@yamada-ui/react/dist/esm/components/number-input/use-number-counter.js

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

"use client";


import { useAttributeObserver } from "../../utils/dom.js";
import { mergeRefs } from "../../utils/ref.js";
import { utils_exports } from "../../utils/index.js";
import { useI18n } from "../../providers/i18n-provider/i18n-provider.js";
import { useSpinner } from "./use-spinner.js";
import { useCallback, useRef } from "react";

//#region src/components/number-input/use-number-counter.ts
const useNumberCounter = ({ decrement, disabled, increment, keepWithinRange, max, min,...rest }) => {
	const incrementRef = useRef(null);
	const decrementRef = useRef(null);
	const { down, spinning, stop, up } = useSpinner({
		decrement,
		increment
	});
	const { t } = useI18n("numberInput");
	useAttributeObserver(incrementRef, ["disabled"], spinning, stop);
	useAttributeObserver(decrementRef, ["disabled"], spinning, stop);
	const getButtonProps = useCallback((props = {}) => ({
		type: "button",
		disabled,
		tabIndex: -1,
		...rest,
		...props,
		onPointerLeave: (0, utils_exports.handlerAll)(props.onPointerLeave, stop),
		onPointerUp: (0, utils_exports.handlerAll)(props.onPointerUp, stop)
	}), [
		rest,
		disabled,
		stop
	]);
	const getIncrementProps = useCallback(({ ref,...props } = {}) => {
		const trulyDisabled = disabled || keepWithinRange && max;
		return {
			ref: mergeRefs(ref, incrementRef),
			"aria-label": t("Increase"),
			...getButtonProps({
				disabled: trulyDisabled,
				...props
			}),
			onPointerDown: (0, utils_exports.handlerAll)(props.onPointerDown, (ev) => {
				if (ev.button !== 0 || trulyDisabled) return;
				ev.preventDefault();
				up();
			})
		};
	}, [
		getButtonProps,
		disabled,
		keepWithinRange,
		max,
		up,
		t
	]);
	return {
		getDecrementProps: useCallback(({ ref,...props } = {}) => {
			const trulyDisabled = disabled || keepWithinRange && min;
			return {
				ref: mergeRefs(ref, decrementRef),
				"aria-label": t("Decrease"),
				...getButtonProps({
					disabled: trulyDisabled,
					...props
				}),
				onPointerDown: (0, utils_exports.handlerAll)(props.onPointerDown, (ev) => {
					if (ev.button !== 0 || trulyDisabled) return;
					ev.preventDefault();
					down();
				})
			};
		}, [
			getButtonProps,
			disabled,
			keepWithinRange,
			min,
			down,
			t
		]),
		getIncrementProps
	};
};

//#endregion
export { useNumberCounter };
//# sourceMappingURL=use-number-counter.js.map