@yamada-ui/number-input 1.1.13-dev-20240907122824 → 1.1.13-dev-20240908075149

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -54,9 +54,6 @@ var useNumberInput = (props = {}) => {
54
54
  defaultValue,
55
55
  inputMode = "decimal",
56
56
  pattern = "[0-9]*(.[0-9]+)?",
57
- required,
58
- disabled,
59
- readOnly,
60
57
  focusInputOnChange = true,
61
58
  clampValueOnBlur = true,
62
59
  keepWithinRange = true,
@@ -71,12 +68,17 @@ var useNumberInput = (props = {}) => {
71
68
  isValidCharacter: isValidCharacterProp,
72
69
  getAriaValueText: getAriaValueTextProp,
73
70
  onChange: onChangeProp,
74
- onFocus: onFocusProp,
75
- onBlur: onBlurProp,
76
- "aria-invalid": isInvalid,
77
71
  ...rest
78
72
  } = useFormControlProps(props);
79
- const formControlProps = pickObject(rest, formControlProperties);
73
+ const {
74
+ required,
75
+ disabled,
76
+ readOnly,
77
+ "aria-invalid": isInvalid,
78
+ onFocus: onFocusProp,
79
+ onBlur: onBlurProp,
80
+ ...formControlProps
81
+ } = pickObject(rest, formControlProperties);
80
82
  const isRequired = required;
81
83
  const isReadOnly = readOnly;
82
84
  const isDisabled = disabled;
@@ -604,4 +606,4 @@ export {
604
606
  useNumberInput,
605
607
  NumberInput
606
608
  };
607
- //# sourceMappingURL=chunk-GLR53SQE.mjs.map
609
+ //# sourceMappingURL=chunk-NCOASV6M.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/number-input.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useMultiComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { UseFormControlProps } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { ChevronIcon } from \"@yamada-ui/icon\"\nimport type { UseCounterProps } from \"@yamada-ui/use-counter\"\nimport { useCounter } from \"@yamada-ui/use-counter\"\nimport { useEventListener } from \"@yamada-ui/use-event-listener\"\nimport { useInterval } from \"@yamada-ui/use-interval\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n ariaAttr,\n createContext,\n cx,\n handlerAll,\n mergeRefs,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n InputHTMLAttributes,\n KeyboardEvent,\n KeyboardEventHandler,\n} from \"react\"\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\n\nconst isDefaultValidCharacter = (character: string) =>\n /^[Ee0-9+\\-.]$/.test(character)\n\nconst isValidNumericKeyboardEvent = (\n { key, ctrlKey, altKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\n) => {\n if (key == null) return true\n\n const isModifierKey = ctrlKey || altKey || metaKey\n const isSingleCharacterKey = key.length === 1\n\n if (!isSingleCharacterKey || isModifierKey) return true\n\n return isValid(key)\n}\n\nconst getStep = <Y extends KeyboardEvent | WheelEvent>({\n ctrlKey,\n shiftKey,\n metaKey,\n}: Y) => {\n let ratio = 1\n\n if (metaKey || ctrlKey) ratio = 0.1\n\n if (shiftKey) ratio = 10\n\n return ratio\n}\n\ntype ValidityState = \"rangeUnderflow\" | \"rangeOverflow\"\n\nexport type UseNumberInputProps = UseFormControlProps<HTMLInputElement> &\n UseCounterProps & {\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * Hints at the type of data that might be entered by the user.\n * It also determines the type of keyboard shown to the user on mobile devices.\n *\n * @default 'decimal'\n */\n inputMode?: InputHTMLAttributes<any>[\"inputMode\"]\n /**\n * The pattern used to check the <input> element's value against on form submission.\n *\n * @default '[0-9]*(.[0-9]+)?'\n */\n pattern?: InputHTMLAttributes<any>[\"pattern\"]\n /**\n * If `true`, the input will be focused as you increment or decrement the value with the stepper.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * This controls the value update when you blur out of the input.\n * - If `true` and the value is greater than `max`, the value will be reset to `max`.\n * - Else, the value remains the same.\n *\n * @default true\n */\n clampValueOnBlur?: boolean\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: boolean\n /**\n * The callback invoked when invalid number is entered.\n */\n onInvalid?: (\n message: ValidityState,\n value: string,\n valueAsNumber: number,\n ) => void\n /**\n * This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n *\n * It is used to set the `aria-valuetext` property of the input.\n */\n getAriaValueText?: (value: string | number) => string\n /**\n * Whether the pressed key should be allowed in the input.\n * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\\-.]$/.\n */\n isValidCharacter?: (value: string) => boolean\n /**\n * If using a custom display format, this converts the custom format to a format `parseFloat` understands.\n */\n parse?: (value: string) => string\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: string | number) => string | number\n }\n\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n const {\n id,\n name,\n value: valueProp,\n defaultValue,\n inputMode = \"decimal\",\n pattern = \"[0-9]*(.[0-9]+)?\",\n focusInputOnChange = true,\n clampValueOnBlur = true,\n keepWithinRange = true,\n allowMouseWheel,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step: stepProp,\n precision,\n parse: parseProp,\n format: formatProp,\n onInvalid: onInvalidProp,\n isValidCharacter: isValidCharacterProp,\n getAriaValueText: getAriaValueTextProp,\n onChange: onChangeProp,\n ...rest\n } = useFormControlProps(props)\n const {\n required,\n disabled,\n readOnly,\n \"aria-invalid\": isInvalid,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...formControlProps\n } = pickObject(rest, formControlProperties)\n\n const isRequired = required\n const isReadOnly = readOnly\n const isDisabled = disabled\n\n const [isFocused, setFocused] = useState(false)\n const isInteractive = !(readOnly || disabled)\n\n const inputRef = useRef<HTMLInputElement>(null)\n const inputSelectionRef = useRef<{\n start: number | null\n end: number | null\n } | null>(null)\n const incrementRef = useRef<HTMLButtonElement>(null)\n const decrementRef = useRef<HTMLButtonElement>(null)\n\n const onFocus = useCallbackRef(\n handlerAll(onFocusProp, (ev) => {\n setFocused(true)\n\n if (!inputSelectionRef.current) return\n\n ev.target.selectionStart =\n inputSelectionRef.current.start ?? ev.currentTarget.value?.length\n ev.currentTarget.selectionEnd =\n inputSelectionRef.current.end ?? ev.currentTarget.selectionStart\n }),\n )\n const onBlur = useCallbackRef(\n handlerAll(onBlurProp, () => {\n setFocused(false)\n\n if (clampValueOnBlur) validateAndClamp()\n }),\n )\n const onInvalid = useCallbackRef(onInvalidProp)\n const getAriaValueText = useCallbackRef(getAriaValueTextProp)\n const isValidCharacter = useCallbackRef(\n isValidCharacterProp ?? isDefaultValidCharacter,\n )\n\n const {\n isMin,\n isMax,\n isOut,\n value,\n valueAsNumber,\n setValue,\n update,\n cast,\n ...counter\n } = useCounter({\n value: valueProp,\n defaultValue,\n step: stepProp,\n min,\n max,\n precision,\n keepWithinRange,\n onChange: onChangeProp,\n })\n\n const valueText = useMemo(() => {\n let text = getAriaValueText?.(value)\n\n if (text != null) return text\n\n text = value.toString()\n\n return !text ? undefined : text\n }, [value, getAriaValueText])\n\n const sanitize = useCallback(\n (value: string) => value.split(\"\").filter(isValidCharacter).join(\"\"),\n [isValidCharacter],\n )\n\n const parse = useCallback(\n (value: string) => parseProp?.(value) ?? value,\n [parseProp],\n )\n\n const format = useCallback(\n (value: string | number) => (formatProp?.(value) ?? value).toString(),\n [formatProp],\n )\n\n const increment = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.increment(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const decrement = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.decrement(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const validateAndClamp = useCallback(() => {\n let next = value as string | number\n\n if (value === \"\") return\n\n const valueStartsWithE = /^[eE]/.test(value.toString())\n\n if (valueStartsWithE) {\n setValue(\"\")\n } else {\n if (valueAsNumber < min) next = min\n\n if (valueAsNumber > max) next = max\n\n cast(next)\n }\n }, [cast, max, min, setValue, value, valueAsNumber])\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if ((ev.nativeEvent as InputEvent).isComposing) return\n\n const parsedInput = parse(ev.currentTarget.value)\n\n update(sanitize(parsedInput))\n\n inputSelectionRef.current = {\n start: ev.currentTarget.selectionStart,\n end: ev.currentTarget.selectionEnd,\n }\n },\n [parse, update, sanitize],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.nativeEvent.isComposing) return\n\n if (!isValidNumericKeyboardEvent(ev, isValidCharacter))\n ev.preventDefault()\n\n const step = getStep(ev) * (stepProp ?? 1)\n\n const keyMap: Record<string, KeyboardEventHandler> = {\n ArrowUp: () => increment(step),\n ArrowDown: () => decrement(step),\n Home: () => update(min),\n End: () => update(max),\n }\n\n const action = keyMap[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n action(ev)\n },\n [decrement, increment, isValidCharacter, max, min, stepProp, update],\n )\n\n const { up, down, stop, isSpinning } = useSpinner(increment, decrement)\n\n useAttributeObserver(incrementRef, [\"disabled\"], isSpinning, stop)\n useAttributeObserver(decrementRef, [\"disabled\"], isSpinning, stop)\n\n const focusInput = useCallback(() => {\n if (focusInputOnChange)\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n }, [focusInputOnChange])\n\n const eventUp = useCallback(\n (ev: any) => {\n ev.preventDefault()\n up()\n focusInput()\n },\n [focusInput, up],\n )\n\n const eventDown = useCallback(\n (ev: any) => {\n ev.preventDefault()\n down()\n focusInput()\n },\n [focusInput, down],\n )\n\n useUpdateEffect(() => {\n if (valueAsNumber > max) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n } else if (valueAsNumber < min) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n }\n }, [valueAsNumber, value, format, onInvalid])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n const notInSync = inputRef.current.value != value\n\n if (!notInSync) return\n\n const parsedInput = parse(inputRef.current.value)\n\n setValue(sanitize(parsedInput))\n }, [parse, sanitize])\n\n useEventListener(\n () => inputRef.current,\n \"wheel\",\n (ev) => {\n const ownerDocument = inputRef.current?.ownerDocument ?? document\n const isFocused = ownerDocument.activeElement === inputRef.current\n\n if (!allowMouseWheel || !isFocused) return\n\n ev.preventDefault()\n\n const step = getStep(ev as any) * (stepProp ?? 1)\n const direction = Math.sign(ev.deltaY)\n\n if (direction === -1) {\n increment(step)\n } else if (direction === 1) {\n decrement(step)\n }\n },\n { passive: false },\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n id,\n name,\n type: \"text\",\n role: \"spinbutton\",\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n ...formControlProps,\n ...props,\n min,\n max,\n step: stepProp,\n ref: mergeRefs(inputRef, ref),\n value: format(value),\n \"aria-valuemin\": min,\n \"aria-valuemax\": max,\n \"aria-valuenow\": Number.isNaN(valueAsNumber) ? undefined : valueAsNumber,\n \"aria-valuetext\": valueText,\n \"aria-invalid\": ariaAttr(isInvalid ?? isOut),\n autoComplete: \"off\",\n autoCorrect: \"off\",\n onChange: handlerAll(props.onChange, onChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onFocus: handlerAll(props.onFocus, onFocus),\n onBlur: handlerAll(props.onBlur, onBlur),\n }),\n [\n id,\n name,\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n formControlProps,\n min,\n max,\n stepProp,\n format,\n value,\n valueAsNumber,\n valueText,\n isInvalid,\n isOut,\n onChange,\n onKeyDown,\n onFocus,\n onBlur,\n ],\n )\n\n const getIncrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMax)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, incrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventUp(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMax,\n required,\n readOnly,\n formControlProps,\n stop,\n eventUp,\n ],\n )\n\n const getDecrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMin)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, decrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventDown(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMin,\n required,\n readOnly,\n formControlProps,\n stop,\n eventDown,\n ],\n )\n\n return {\n props: rest,\n value: format(value),\n valueAsNumber,\n isFocused,\n isRequired,\n isReadOnly,\n isDisabled,\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n\nconst INTERVAL = 50\n\nconst DELAY = 300\n\ntype Action = \"increment\" | \"decrement\"\n\nconst useSpinner = (increment: Function, decrement: Function) => {\n const [isSpinning, setIsSpinning] = useState(false)\n const [action, setAction] = useState<Action | null>(null)\n const [isOnce, setIsOnce] = useState(true)\n const timeoutRef = useRef<any>(null)\n\n const removeTimeout = () => clearTimeout(timeoutRef.current)\n\n useInterval(\n () => {\n if (action === \"increment\") increment()\n\n if (action === \"decrement\") decrement()\n },\n isSpinning ? INTERVAL : null,\n )\n\n const up = useCallback(() => {\n if (isOnce) increment()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"increment\")\n }, DELAY)\n }, [increment, isOnce])\n\n const down = useCallback(() => {\n if (isOnce) decrement()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"decrement\")\n }, DELAY)\n }, [decrement, isOnce])\n\n const stop = useCallback(() => {\n setIsOnce(true)\n setIsSpinning(false)\n removeTimeout()\n }, [])\n\n useEffect(() => {\n return () => removeTimeout()\n }, [])\n\n return { up, down, stop, isSpinning }\n}\n\nconst useAttributeObserver = (\n ref: React.RefObject<HTMLElement | null>,\n attributeFilter: string[],\n enabled: boolean,\n func: () => void,\n) => {\n useEffect(() => {\n if (!ref.current || !enabled) return\n\n const ownerDocument = ref.current.ownerDocument.defaultView ?? window\n\n const observer = new ownerDocument.MutationObserver((changes) => {\n for (const { type, attributeName } of changes) {\n if (\n type === \"attributes\" &&\n attributeName &&\n attributeFilter.includes(attributeName)\n )\n func()\n }\n })\n\n observer.observe(ref.current, { attributes: true, attributeFilter })\n\n return () => observer.disconnect()\n })\n}\n\ntype NumberInputOptions = {\n /**\n * If `true`, display the addon for the number input.\n */\n isStepper?: boolean\n /**\n * Props for container element.\n */\n containerProps?: HTMLUIProps<\"div\">\n /**\n * Props for addon component.\n */\n addonProps?: HTMLUIProps<\"div\">\n /**\n * Props for increment component.\n */\n incrementProps?: NumberIncrementStepperProps\n /**\n * Props for decrement component.\n */\n decrementProps?: NumberDecrementStepperProps\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n}\n\nexport type NumberInputProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\" | \"onChange\"\n> &\n ThemeProps<\"NumberInput\"> &\n Omit<UseNumberInputProps, \"disabled\" | \"required\" | \"readOnly\"> &\n NumberInputOptions\n\ntype NumberInputContext = {\n getInputProps: PropGetter\n getIncrementProps: PropGetter\n getDecrementProps: PropGetter\n styles: Record<string, CSSUIObject>\n}\n\nconst [NumberInputContextProvider, useNumberInputContext] =\n createContext<NumberInputContext>({\n strict: false,\n name: \"NumberInputContext\",\n })\n\n/**\n * `NumberInput` is a component used to obtain numeric input from the user.\n *\n * @see Docs https://yamada-ui.com/components/forms/number-input\n */\nexport const NumberInput = forwardRef<NumberInputProps, \"input\">(\n (props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"NumberInput\", props)\n const {\n className,\n isStepper = true,\n containerProps,\n addonProps,\n incrementProps,\n decrementProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n const {\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n props: rest,\n } = useNumberInput(computedProps)\n\n const css: CSSUIObject = {\n position: \"relative\",\n zIndex: 0,\n ...styles.container,\n }\n\n return (\n <NumberInputContextProvider\n value={{ getInputProps, getIncrementProps, getDecrementProps, styles }}\n >\n <ui.div\n className={cx(\"ui-number-input\", className)}\n __css={css}\n {...containerProps}\n >\n <NumberInputField\n {...getInputProps(rest as DOMAttributes<HTMLElement>, ref)}\n />\n\n {isStepper ? (\n <NumberInputAddon {...addonProps}>\n <NumberIncrementStepper {...incrementProps} />\n <NumberDecrementStepper {...decrementProps} />\n </NumberInputAddon>\n ) : null}\n </ui.div>\n </NumberInputContextProvider>\n )\n },\n)\n\ntype NumberInputFieldProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\"\n>\n\nconst NumberInputField = forwardRef<NumberInputFieldProps, \"input\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n width: \"100%\",\n ...styles.field,\n }\n\n return (\n <ui.input\n ref={ref}\n className={cx(\"ui-number-input__field\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype NumberInputAddonProps = HTMLUIProps<\"div\">\n\nconst NumberInputAddon = forwardRef<NumberInputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n display: \"flex\",\n flexDirection: \"column\",\n position: \"absolute\",\n top: \"0\",\n insetEnd: \"0px\",\n margin: \"1px\",\n height: \"calc(100% - 2px)\",\n zIndex: \"fallback(yamcha, 1)\",\n ...styles.addon,\n }\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-number-input__addon\", className)}\n aria-hidden\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst Stepper = ui(\"div\", {\n baseStyle: {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n flex: 1,\n transitionProperty: \"common\",\n transitionDuration: \"normal\",\n userSelect: \"none\",\n cursor: \"pointer\",\n lineHeight: \"normal\",\n },\n})\n\ntype NumberIncrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberIncrementStepper = forwardRef<NumberIncrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getIncrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--up\", className)}\n {...getIncrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n </Stepper>\n )\n },\n)\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberDecrementStepper = forwardRef<NumberDecrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getDecrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--down\", className)}\n {...getDecrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon />}\n </Stepper>\n )\n },\n)\n"],"mappings":"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","names":["value","isFocused","props"]}
package/dist/index.d.mts CHANGED
@@ -1,6 +1,6 @@
1
1
  export { NumberInput, NumberInputProps, UseNumberInputProps, UseNumberInputReturn, useNumberInput } from './number-input.mjs';
2
2
  import '@yamada-ui/core';
3
+ import 'react';
3
4
  import '@yamada-ui/form-control';
4
5
  import '@yamada-ui/use-counter';
5
6
  import '@yamada-ui/utils';
6
- import 'react';
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export { NumberInput, NumberInputProps, UseNumberInputProps, UseNumberInputReturn, useNumberInput } from './number-input.js';
2
2
  import '@yamada-ui/core';
3
+ import 'react';
3
4
  import '@yamada-ui/form-control';
4
5
  import '@yamada-ui/use-counter';
5
6
  import '@yamada-ui/utils';
6
- import 'react';
package/dist/index.js CHANGED
@@ -62,9 +62,6 @@ var useNumberInput = (props = {}) => {
62
62
  defaultValue,
63
63
  inputMode = "decimal",
64
64
  pattern = "[0-9]*(.[0-9]+)?",
65
- required,
66
- disabled,
67
- readOnly,
68
65
  focusInputOnChange = true,
69
66
  clampValueOnBlur = true,
70
67
  keepWithinRange = true,
@@ -79,12 +76,17 @@ var useNumberInput = (props = {}) => {
79
76
  isValidCharacter: isValidCharacterProp,
80
77
  getAriaValueText: getAriaValueTextProp,
81
78
  onChange: onChangeProp,
82
- onFocus: onFocusProp,
83
- onBlur: onBlurProp,
84
- "aria-invalid": isInvalid,
85
79
  ...rest
86
80
  } = (0, import_form_control.useFormControlProps)(props);
87
- const formControlProps = (0, import_utils.pickObject)(rest, import_form_control.formControlProperties);
81
+ const {
82
+ required,
83
+ disabled,
84
+ readOnly,
85
+ "aria-invalid": isInvalid,
86
+ onFocus: onFocusProp,
87
+ onBlur: onBlurProp,
88
+ ...formControlProps
89
+ } = (0, import_utils.pickObject)(rest, import_form_control.formControlProperties);
88
90
  const isRequired = required;
89
91
  const isReadOnly = readOnly;
90
92
  const isDisabled = disabled;
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/number-input.tsx"],"sourcesContent":["export { NumberInput, useNumberInput } from \"./number-input\"\nexport type {\n NumberInputProps,\n UseNumberInputProps,\n UseNumberInputReturn,\n} from \"./number-input\"\n","import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useMultiComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { UseFormControlProps } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { ChevronIcon } from \"@yamada-ui/icon\"\nimport type { UseCounterProps } from \"@yamada-ui/use-counter\"\nimport { useCounter } from \"@yamada-ui/use-counter\"\nimport { useEventListener } from \"@yamada-ui/use-event-listener\"\nimport { useInterval } from \"@yamada-ui/use-interval\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n ariaAttr,\n createContext,\n cx,\n handlerAll,\n mergeRefs,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n InputHTMLAttributes,\n KeyboardEvent,\n KeyboardEventHandler,\n} from \"react\"\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\n\nconst isDefaultValidCharacter = (character: string) =>\n /^[Ee0-9+\\-.]$/.test(character)\n\nconst isValidNumericKeyboardEvent = (\n { key, ctrlKey, altKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\n) => {\n if (key == null) return true\n\n const isModifierKey = ctrlKey || altKey || metaKey\n const isSingleCharacterKey = key.length === 1\n\n if (!isSingleCharacterKey || isModifierKey) return true\n\n return isValid(key)\n}\n\nconst getStep = <Y extends KeyboardEvent | WheelEvent>({\n ctrlKey,\n shiftKey,\n metaKey,\n}: Y) => {\n let ratio = 1\n\n if (metaKey || ctrlKey) ratio = 0.1\n\n if (shiftKey) ratio = 10\n\n return ratio\n}\n\ntype ValidityState = \"rangeUnderflow\" | \"rangeOverflow\"\n\nexport type UseNumberInputProps = UseFormControlProps<HTMLInputElement> &\n UseCounterProps & {\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * Hints at the type of data that might be entered by the user.\n * It also determines the type of keyboard shown to the user on mobile devices.\n *\n * @default 'decimal'\n */\n inputMode?: InputHTMLAttributes<any>[\"inputMode\"]\n /**\n * The pattern used to check the <input> element's value against on form submission.\n *\n * @default '[0-9]*(.[0-9]+)?'\n */\n pattern?: InputHTMLAttributes<any>[\"pattern\"]\n /**\n * If `true`, the input will be focused as you increment or decrement the value with the stepper.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * This controls the value update when you blur out of the input.\n * - If `true` and the value is greater than `max`, the value will be reset to `max`.\n * - Else, the value remains the same.\n *\n * @default true\n */\n clampValueOnBlur?: boolean\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: boolean\n /**\n * The callback invoked when invalid number is entered.\n */\n onInvalid?: (\n message: ValidityState,\n value: string,\n valueAsNumber: number,\n ) => void\n /**\n * This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n *\n * It is used to set the `aria-valuetext` property of the input.\n */\n getAriaValueText?: (value: string | number) => string\n /**\n * Whether the pressed key should be allowed in the input.\n * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\\-.]$/.\n */\n isValidCharacter?: (value: string) => boolean\n /**\n * If using a custom display format, this converts the custom format to a format `parseFloat` understands.\n */\n parse?: (value: string) => string\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: string | number) => string | number\n }\n\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n const {\n id,\n name,\n value: valueProp,\n defaultValue,\n inputMode = \"decimal\",\n pattern = \"[0-9]*(.[0-9]+)?\",\n required,\n disabled,\n readOnly,\n focusInputOnChange = true,\n clampValueOnBlur = true,\n keepWithinRange = true,\n allowMouseWheel,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step: stepProp,\n precision,\n parse: parseProp,\n format: formatProp,\n onInvalid: onInvalidProp,\n isValidCharacter: isValidCharacterProp,\n getAriaValueText: getAriaValueTextProp,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n \"aria-invalid\": isInvalid,\n ...rest\n } = useFormControlProps(props)\n const formControlProps = pickObject(rest, formControlProperties)\n\n const isRequired = required\n const isReadOnly = readOnly\n const isDisabled = disabled\n\n const [isFocused, setFocused] = useState(false)\n const isInteractive = !(readOnly || disabled)\n\n const inputRef = useRef<HTMLInputElement>(null)\n const inputSelectionRef = useRef<{\n start: number | null\n end: number | null\n } | null>(null)\n const incrementRef = useRef<HTMLButtonElement>(null)\n const decrementRef = useRef<HTMLButtonElement>(null)\n\n const onFocus = useCallbackRef(\n handlerAll(onFocusProp, (ev) => {\n setFocused(true)\n\n if (!inputSelectionRef.current) return\n\n ev.target.selectionStart =\n inputSelectionRef.current.start ?? ev.currentTarget.value?.length\n ev.currentTarget.selectionEnd =\n inputSelectionRef.current.end ?? ev.currentTarget.selectionStart\n }),\n )\n const onBlur = useCallbackRef(\n handlerAll(onBlurProp, () => {\n setFocused(false)\n\n if (clampValueOnBlur) validateAndClamp()\n }),\n )\n const onInvalid = useCallbackRef(onInvalidProp)\n const getAriaValueText = useCallbackRef(getAriaValueTextProp)\n const isValidCharacter = useCallbackRef(\n isValidCharacterProp ?? isDefaultValidCharacter,\n )\n\n const {\n isMin,\n isMax,\n isOut,\n value,\n valueAsNumber,\n setValue,\n update,\n cast,\n ...counter\n } = useCounter({\n value: valueProp,\n defaultValue,\n step: stepProp,\n min,\n max,\n precision,\n keepWithinRange,\n onChange: onChangeProp,\n })\n\n const valueText = useMemo(() => {\n let text = getAriaValueText?.(value)\n\n if (text != null) return text\n\n text = value.toString()\n\n return !text ? undefined : text\n }, [value, getAriaValueText])\n\n const sanitize = useCallback(\n (value: string) => value.split(\"\").filter(isValidCharacter).join(\"\"),\n [isValidCharacter],\n )\n\n const parse = useCallback(\n (value: string) => parseProp?.(value) ?? value,\n [parseProp],\n )\n\n const format = useCallback(\n (value: string | number) => (formatProp?.(value) ?? value).toString(),\n [formatProp],\n )\n\n const increment = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.increment(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const decrement = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.decrement(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const validateAndClamp = useCallback(() => {\n let next = value as string | number\n\n if (value === \"\") return\n\n const valueStartsWithE = /^[eE]/.test(value.toString())\n\n if (valueStartsWithE) {\n setValue(\"\")\n } else {\n if (valueAsNumber < min) next = min\n\n if (valueAsNumber > max) next = max\n\n cast(next)\n }\n }, [cast, max, min, setValue, value, valueAsNumber])\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if ((ev.nativeEvent as InputEvent).isComposing) return\n\n const parsedInput = parse(ev.currentTarget.value)\n\n update(sanitize(parsedInput))\n\n inputSelectionRef.current = {\n start: ev.currentTarget.selectionStart,\n end: ev.currentTarget.selectionEnd,\n }\n },\n [parse, update, sanitize],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.nativeEvent.isComposing) return\n\n if (!isValidNumericKeyboardEvent(ev, isValidCharacter))\n ev.preventDefault()\n\n const step = getStep(ev) * (stepProp ?? 1)\n\n const keyMap: Record<string, KeyboardEventHandler> = {\n ArrowUp: () => increment(step),\n ArrowDown: () => decrement(step),\n Home: () => update(min),\n End: () => update(max),\n }\n\n const action = keyMap[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n action(ev)\n },\n [decrement, increment, isValidCharacter, max, min, stepProp, update],\n )\n\n const { up, down, stop, isSpinning } = useSpinner(increment, decrement)\n\n useAttributeObserver(incrementRef, [\"disabled\"], isSpinning, stop)\n useAttributeObserver(decrementRef, [\"disabled\"], isSpinning, stop)\n\n const focusInput = useCallback(() => {\n if (focusInputOnChange)\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n }, [focusInputOnChange])\n\n const eventUp = useCallback(\n (ev: any) => {\n ev.preventDefault()\n up()\n focusInput()\n },\n [focusInput, up],\n )\n\n const eventDown = useCallback(\n (ev: any) => {\n ev.preventDefault()\n down()\n focusInput()\n },\n [focusInput, down],\n )\n\n useUpdateEffect(() => {\n if (valueAsNumber > max) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n } else if (valueAsNumber < min) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n }\n }, [valueAsNumber, value, format, onInvalid])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n const notInSync = inputRef.current.value != value\n\n if (!notInSync) return\n\n const parsedInput = parse(inputRef.current.value)\n\n setValue(sanitize(parsedInput))\n }, [parse, sanitize])\n\n useEventListener(\n () => inputRef.current,\n \"wheel\",\n (ev) => {\n const ownerDocument = inputRef.current?.ownerDocument ?? document\n const isFocused = ownerDocument.activeElement === inputRef.current\n\n if (!allowMouseWheel || !isFocused) return\n\n ev.preventDefault()\n\n const step = getStep(ev as any) * (stepProp ?? 1)\n const direction = Math.sign(ev.deltaY)\n\n if (direction === -1) {\n increment(step)\n } else if (direction === 1) {\n decrement(step)\n }\n },\n { passive: false },\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n id,\n name,\n type: \"text\",\n role: \"spinbutton\",\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n ...formControlProps,\n ...props,\n min,\n max,\n step: stepProp,\n ref: mergeRefs(inputRef, ref),\n value: format(value),\n \"aria-valuemin\": min,\n \"aria-valuemax\": max,\n \"aria-valuenow\": Number.isNaN(valueAsNumber) ? undefined : valueAsNumber,\n \"aria-valuetext\": valueText,\n \"aria-invalid\": ariaAttr(isInvalid ?? isOut),\n autoComplete: \"off\",\n autoCorrect: \"off\",\n onChange: handlerAll(props.onChange, onChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onFocus: handlerAll(props.onFocus, onFocus),\n onBlur: handlerAll(props.onBlur, onBlur),\n }),\n [\n id,\n name,\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n formControlProps,\n min,\n max,\n stepProp,\n format,\n value,\n valueAsNumber,\n valueText,\n isInvalid,\n isOut,\n onChange,\n onKeyDown,\n onFocus,\n onBlur,\n ],\n )\n\n const getIncrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMax)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, incrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventUp(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMax,\n required,\n readOnly,\n formControlProps,\n stop,\n eventUp,\n ],\n )\n\n const getDecrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMin)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, decrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventDown(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMin,\n required,\n readOnly,\n formControlProps,\n stop,\n eventDown,\n ],\n )\n\n return {\n props: rest,\n value: format(value),\n valueAsNumber,\n isFocused,\n isRequired,\n isReadOnly,\n isDisabled,\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n\nconst INTERVAL = 50\n\nconst DELAY = 300\n\ntype Action = \"increment\" | \"decrement\"\n\nconst useSpinner = (increment: Function, decrement: Function) => {\n const [isSpinning, setIsSpinning] = useState(false)\n const [action, setAction] = useState<Action | null>(null)\n const [isOnce, setIsOnce] = useState(true)\n const timeoutRef = useRef<any>(null)\n\n const removeTimeout = () => clearTimeout(timeoutRef.current)\n\n useInterval(\n () => {\n if (action === \"increment\") increment()\n\n if (action === \"decrement\") decrement()\n },\n isSpinning ? INTERVAL : null,\n )\n\n const up = useCallback(() => {\n if (isOnce) increment()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"increment\")\n }, DELAY)\n }, [increment, isOnce])\n\n const down = useCallback(() => {\n if (isOnce) decrement()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"decrement\")\n }, DELAY)\n }, [decrement, isOnce])\n\n const stop = useCallback(() => {\n setIsOnce(true)\n setIsSpinning(false)\n removeTimeout()\n }, [])\n\n useEffect(() => {\n return () => removeTimeout()\n }, [])\n\n return { up, down, stop, isSpinning }\n}\n\nconst useAttributeObserver = (\n ref: React.RefObject<HTMLElement | null>,\n attributeFilter: string[],\n enabled: boolean,\n func: () => void,\n) => {\n useEffect(() => {\n if (!ref.current || !enabled) return\n\n const ownerDocument = ref.current.ownerDocument.defaultView ?? window\n\n const observer = new ownerDocument.MutationObserver((changes) => {\n for (const { type, attributeName } of changes) {\n if (\n type === \"attributes\" &&\n attributeName &&\n attributeFilter.includes(attributeName)\n )\n func()\n }\n })\n\n observer.observe(ref.current, { attributes: true, attributeFilter })\n\n return () => observer.disconnect()\n })\n}\n\ntype NumberInputOptions = {\n /**\n * If `true`, display the addon for the number input.\n */\n isStepper?: boolean\n /**\n * Props for container element.\n */\n containerProps?: HTMLUIProps<\"div\">\n /**\n * Props for addon component.\n */\n addonProps?: HTMLUIProps<\"div\">\n /**\n * Props for increment component.\n */\n incrementProps?: NumberIncrementStepperProps\n /**\n * Props for decrement component.\n */\n decrementProps?: NumberDecrementStepperProps\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n}\n\nexport type NumberInputProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\" | \"onChange\"\n> &\n ThemeProps<\"NumberInput\"> &\n Omit<UseNumberInputProps, \"disabled\" | \"required\" | \"readOnly\"> &\n NumberInputOptions\n\ntype NumberInputContext = {\n getInputProps: PropGetter\n getIncrementProps: PropGetter\n getDecrementProps: PropGetter\n styles: Record<string, CSSUIObject>\n}\n\nconst [NumberInputContextProvider, useNumberInputContext] =\n createContext<NumberInputContext>({\n strict: false,\n name: \"NumberInputContext\",\n })\n\n/**\n * `NumberInput` is a component used to obtain numeric input from the user.\n *\n * @see Docs https://yamada-ui.com/components/forms/number-input\n */\nexport const NumberInput = forwardRef<NumberInputProps, \"input\">(\n (props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"NumberInput\", props)\n const {\n className,\n isStepper = true,\n containerProps,\n addonProps,\n incrementProps,\n decrementProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n const {\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n props: rest,\n } = useNumberInput(computedProps)\n\n const css: CSSUIObject = {\n position: \"relative\",\n zIndex: 0,\n ...styles.container,\n }\n\n return (\n <NumberInputContextProvider\n value={{ getInputProps, getIncrementProps, getDecrementProps, styles }}\n >\n <ui.div\n className={cx(\"ui-number-input\", className)}\n __css={css}\n {...containerProps}\n >\n <NumberInputField\n {...getInputProps(rest as DOMAttributes<HTMLElement>, ref)}\n />\n\n {isStepper ? (\n <NumberInputAddon {...addonProps}>\n <NumberIncrementStepper {...incrementProps} />\n <NumberDecrementStepper {...decrementProps} />\n </NumberInputAddon>\n ) : null}\n </ui.div>\n </NumberInputContextProvider>\n )\n },\n)\n\ntype NumberInputFieldProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\"\n>\n\nconst NumberInputField = forwardRef<NumberInputFieldProps, \"input\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n width: \"100%\",\n ...styles.field,\n }\n\n return (\n <ui.input\n ref={ref}\n className={cx(\"ui-number-input__field\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype NumberInputAddonProps = HTMLUIProps<\"div\">\n\nconst NumberInputAddon = forwardRef<NumberInputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n display: \"flex\",\n flexDirection: \"column\",\n position: \"absolute\",\n top: \"0\",\n insetEnd: \"0px\",\n margin: \"1px\",\n height: \"calc(100% - 2px)\",\n zIndex: \"fallback(yamcha, 1)\",\n ...styles.addon,\n }\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-number-input__addon\", className)}\n aria-hidden\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst Stepper = ui(\"div\", {\n baseStyle: {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n flex: 1,\n transitionProperty: \"common\",\n transitionDuration: \"normal\",\n userSelect: \"none\",\n cursor: \"pointer\",\n lineHeight: \"normal\",\n },\n})\n\ntype NumberIncrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberIncrementStepper = forwardRef<NumberIncrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getIncrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--up\", className)}\n {...getIncrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n </Stepper>\n )\n },\n)\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberDecrementStepper = forwardRef<NumberDecrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getDecrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--down\", className)}\n {...getDecrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon />}\n </Stepper>\n )\n },\n)\n"],"mappings":"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","names":["value","isFocused","props"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/number-input.tsx"],"sourcesContent":["export { NumberInput, useNumberInput } from \"./number-input\"\nexport type {\n NumberInputProps,\n UseNumberInputProps,\n UseNumberInputReturn,\n} from \"./number-input\"\n","import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useMultiComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { UseFormControlProps } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { ChevronIcon } from \"@yamada-ui/icon\"\nimport type { UseCounterProps } from \"@yamada-ui/use-counter\"\nimport { useCounter } from \"@yamada-ui/use-counter\"\nimport { useEventListener } from \"@yamada-ui/use-event-listener\"\nimport { useInterval } from \"@yamada-ui/use-interval\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n ariaAttr,\n createContext,\n cx,\n handlerAll,\n mergeRefs,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n InputHTMLAttributes,\n KeyboardEvent,\n KeyboardEventHandler,\n} from \"react\"\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\n\nconst isDefaultValidCharacter = (character: string) =>\n /^[Ee0-9+\\-.]$/.test(character)\n\nconst isValidNumericKeyboardEvent = (\n { key, ctrlKey, altKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\n) => {\n if (key == null) return true\n\n const isModifierKey = ctrlKey || altKey || metaKey\n const isSingleCharacterKey = key.length === 1\n\n if (!isSingleCharacterKey || isModifierKey) return true\n\n return isValid(key)\n}\n\nconst getStep = <Y extends KeyboardEvent | WheelEvent>({\n ctrlKey,\n shiftKey,\n metaKey,\n}: Y) => {\n let ratio = 1\n\n if (metaKey || ctrlKey) ratio = 0.1\n\n if (shiftKey) ratio = 10\n\n return ratio\n}\n\ntype ValidityState = \"rangeUnderflow\" | \"rangeOverflow\"\n\nexport type UseNumberInputProps = UseFormControlProps<HTMLInputElement> &\n UseCounterProps & {\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * Hints at the type of data that might be entered by the user.\n * It also determines the type of keyboard shown to the user on mobile devices.\n *\n * @default 'decimal'\n */\n inputMode?: InputHTMLAttributes<any>[\"inputMode\"]\n /**\n * The pattern used to check the <input> element's value against on form submission.\n *\n * @default '[0-9]*(.[0-9]+)?'\n */\n pattern?: InputHTMLAttributes<any>[\"pattern\"]\n /**\n * If `true`, the input will be focused as you increment or decrement the value with the stepper.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * This controls the value update when you blur out of the input.\n * - If `true` and the value is greater than `max`, the value will be reset to `max`.\n * - Else, the value remains the same.\n *\n * @default true\n */\n clampValueOnBlur?: boolean\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: boolean\n /**\n * The callback invoked when invalid number is entered.\n */\n onInvalid?: (\n message: ValidityState,\n value: string,\n valueAsNumber: number,\n ) => void\n /**\n * This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n *\n * It is used to set the `aria-valuetext` property of the input.\n */\n getAriaValueText?: (value: string | number) => string\n /**\n * Whether the pressed key should be allowed in the input.\n * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\\-.]$/.\n */\n isValidCharacter?: (value: string) => boolean\n /**\n * If using a custom display format, this converts the custom format to a format `parseFloat` understands.\n */\n parse?: (value: string) => string\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: string | number) => string | number\n }\n\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n const {\n id,\n name,\n value: valueProp,\n defaultValue,\n inputMode = \"decimal\",\n pattern = \"[0-9]*(.[0-9]+)?\",\n focusInputOnChange = true,\n clampValueOnBlur = true,\n keepWithinRange = true,\n allowMouseWheel,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step: stepProp,\n precision,\n parse: parseProp,\n format: formatProp,\n onInvalid: onInvalidProp,\n isValidCharacter: isValidCharacterProp,\n getAriaValueText: getAriaValueTextProp,\n onChange: onChangeProp,\n ...rest\n } = useFormControlProps(props)\n const {\n required,\n disabled,\n readOnly,\n \"aria-invalid\": isInvalid,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...formControlProps\n } = pickObject(rest, formControlProperties)\n\n const isRequired = required\n const isReadOnly = readOnly\n const isDisabled = disabled\n\n const [isFocused, setFocused] = useState(false)\n const isInteractive = !(readOnly || disabled)\n\n const inputRef = useRef<HTMLInputElement>(null)\n const inputSelectionRef = useRef<{\n start: number | null\n end: number | null\n } | null>(null)\n const incrementRef = useRef<HTMLButtonElement>(null)\n const decrementRef = useRef<HTMLButtonElement>(null)\n\n const onFocus = useCallbackRef(\n handlerAll(onFocusProp, (ev) => {\n setFocused(true)\n\n if (!inputSelectionRef.current) return\n\n ev.target.selectionStart =\n inputSelectionRef.current.start ?? ev.currentTarget.value?.length\n ev.currentTarget.selectionEnd =\n inputSelectionRef.current.end ?? ev.currentTarget.selectionStart\n }),\n )\n const onBlur = useCallbackRef(\n handlerAll(onBlurProp, () => {\n setFocused(false)\n\n if (clampValueOnBlur) validateAndClamp()\n }),\n )\n const onInvalid = useCallbackRef(onInvalidProp)\n const getAriaValueText = useCallbackRef(getAriaValueTextProp)\n const isValidCharacter = useCallbackRef(\n isValidCharacterProp ?? isDefaultValidCharacter,\n )\n\n const {\n isMin,\n isMax,\n isOut,\n value,\n valueAsNumber,\n setValue,\n update,\n cast,\n ...counter\n } = useCounter({\n value: valueProp,\n defaultValue,\n step: stepProp,\n min,\n max,\n precision,\n keepWithinRange,\n onChange: onChangeProp,\n })\n\n const valueText = useMemo(() => {\n let text = getAriaValueText?.(value)\n\n if (text != null) return text\n\n text = value.toString()\n\n return !text ? undefined : text\n }, [value, getAriaValueText])\n\n const sanitize = useCallback(\n (value: string) => value.split(\"\").filter(isValidCharacter).join(\"\"),\n [isValidCharacter],\n )\n\n const parse = useCallback(\n (value: string) => parseProp?.(value) ?? value,\n [parseProp],\n )\n\n const format = useCallback(\n (value: string | number) => (formatProp?.(value) ?? value).toString(),\n [formatProp],\n )\n\n const increment = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.increment(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const decrement = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.decrement(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const validateAndClamp = useCallback(() => {\n let next = value as string | number\n\n if (value === \"\") return\n\n const valueStartsWithE = /^[eE]/.test(value.toString())\n\n if (valueStartsWithE) {\n setValue(\"\")\n } else {\n if (valueAsNumber < min) next = min\n\n if (valueAsNumber > max) next = max\n\n cast(next)\n }\n }, [cast, max, min, setValue, value, valueAsNumber])\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if ((ev.nativeEvent as InputEvent).isComposing) return\n\n const parsedInput = parse(ev.currentTarget.value)\n\n update(sanitize(parsedInput))\n\n inputSelectionRef.current = {\n start: ev.currentTarget.selectionStart,\n end: ev.currentTarget.selectionEnd,\n }\n },\n [parse, update, sanitize],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.nativeEvent.isComposing) return\n\n if (!isValidNumericKeyboardEvent(ev, isValidCharacter))\n ev.preventDefault()\n\n const step = getStep(ev) * (stepProp ?? 1)\n\n const keyMap: Record<string, KeyboardEventHandler> = {\n ArrowUp: () => increment(step),\n ArrowDown: () => decrement(step),\n Home: () => update(min),\n End: () => update(max),\n }\n\n const action = keyMap[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n action(ev)\n },\n [decrement, increment, isValidCharacter, max, min, stepProp, update],\n )\n\n const { up, down, stop, isSpinning } = useSpinner(increment, decrement)\n\n useAttributeObserver(incrementRef, [\"disabled\"], isSpinning, stop)\n useAttributeObserver(decrementRef, [\"disabled\"], isSpinning, stop)\n\n const focusInput = useCallback(() => {\n if (focusInputOnChange)\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n }, [focusInputOnChange])\n\n const eventUp = useCallback(\n (ev: any) => {\n ev.preventDefault()\n up()\n focusInput()\n },\n [focusInput, up],\n )\n\n const eventDown = useCallback(\n (ev: any) => {\n ev.preventDefault()\n down()\n focusInput()\n },\n [focusInput, down],\n )\n\n useUpdateEffect(() => {\n if (valueAsNumber > max) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n } else if (valueAsNumber < min) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n }\n }, [valueAsNumber, value, format, onInvalid])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n const notInSync = inputRef.current.value != value\n\n if (!notInSync) return\n\n const parsedInput = parse(inputRef.current.value)\n\n setValue(sanitize(parsedInput))\n }, [parse, sanitize])\n\n useEventListener(\n () => inputRef.current,\n \"wheel\",\n (ev) => {\n const ownerDocument = inputRef.current?.ownerDocument ?? document\n const isFocused = ownerDocument.activeElement === inputRef.current\n\n if (!allowMouseWheel || !isFocused) return\n\n ev.preventDefault()\n\n const step = getStep(ev as any) * (stepProp ?? 1)\n const direction = Math.sign(ev.deltaY)\n\n if (direction === -1) {\n increment(step)\n } else if (direction === 1) {\n decrement(step)\n }\n },\n { passive: false },\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n id,\n name,\n type: \"text\",\n role: \"spinbutton\",\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n ...formControlProps,\n ...props,\n min,\n max,\n step: stepProp,\n ref: mergeRefs(inputRef, ref),\n value: format(value),\n \"aria-valuemin\": min,\n \"aria-valuemax\": max,\n \"aria-valuenow\": Number.isNaN(valueAsNumber) ? undefined : valueAsNumber,\n \"aria-valuetext\": valueText,\n \"aria-invalid\": ariaAttr(isInvalid ?? isOut),\n autoComplete: \"off\",\n autoCorrect: \"off\",\n onChange: handlerAll(props.onChange, onChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onFocus: handlerAll(props.onFocus, onFocus),\n onBlur: handlerAll(props.onBlur, onBlur),\n }),\n [\n id,\n name,\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n formControlProps,\n min,\n max,\n stepProp,\n format,\n value,\n valueAsNumber,\n valueText,\n isInvalid,\n isOut,\n onChange,\n onKeyDown,\n onFocus,\n onBlur,\n ],\n )\n\n const getIncrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMax)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, incrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventUp(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMax,\n required,\n readOnly,\n formControlProps,\n stop,\n eventUp,\n ],\n )\n\n const getDecrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMin)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, decrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventDown(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMin,\n required,\n readOnly,\n formControlProps,\n stop,\n eventDown,\n ],\n )\n\n return {\n props: rest,\n value: format(value),\n valueAsNumber,\n isFocused,\n isRequired,\n isReadOnly,\n isDisabled,\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n\nconst INTERVAL = 50\n\nconst DELAY = 300\n\ntype Action = \"increment\" | \"decrement\"\n\nconst useSpinner = (increment: Function, decrement: Function) => {\n const [isSpinning, setIsSpinning] = useState(false)\n const [action, setAction] = useState<Action | null>(null)\n const [isOnce, setIsOnce] = useState(true)\n const timeoutRef = useRef<any>(null)\n\n const removeTimeout = () => clearTimeout(timeoutRef.current)\n\n useInterval(\n () => {\n if (action === \"increment\") increment()\n\n if (action === \"decrement\") decrement()\n },\n isSpinning ? INTERVAL : null,\n )\n\n const up = useCallback(() => {\n if (isOnce) increment()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"increment\")\n }, DELAY)\n }, [increment, isOnce])\n\n const down = useCallback(() => {\n if (isOnce) decrement()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"decrement\")\n }, DELAY)\n }, [decrement, isOnce])\n\n const stop = useCallback(() => {\n setIsOnce(true)\n setIsSpinning(false)\n removeTimeout()\n }, [])\n\n useEffect(() => {\n return () => removeTimeout()\n }, [])\n\n return { up, down, stop, isSpinning }\n}\n\nconst useAttributeObserver = (\n ref: React.RefObject<HTMLElement | null>,\n attributeFilter: string[],\n enabled: boolean,\n func: () => void,\n) => {\n useEffect(() => {\n if (!ref.current || !enabled) return\n\n const ownerDocument = ref.current.ownerDocument.defaultView ?? window\n\n const observer = new ownerDocument.MutationObserver((changes) => {\n for (const { type, attributeName } of changes) {\n if (\n type === \"attributes\" &&\n attributeName &&\n attributeFilter.includes(attributeName)\n )\n func()\n }\n })\n\n observer.observe(ref.current, { attributes: true, attributeFilter })\n\n return () => observer.disconnect()\n })\n}\n\ntype NumberInputOptions = {\n /**\n * If `true`, display the addon for the number input.\n */\n isStepper?: boolean\n /**\n * Props for container element.\n */\n containerProps?: HTMLUIProps<\"div\">\n /**\n * Props for addon component.\n */\n addonProps?: HTMLUIProps<\"div\">\n /**\n * Props for increment component.\n */\n incrementProps?: NumberIncrementStepperProps\n /**\n * Props for decrement component.\n */\n decrementProps?: NumberDecrementStepperProps\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n}\n\nexport type NumberInputProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\" | \"onChange\"\n> &\n ThemeProps<\"NumberInput\"> &\n Omit<UseNumberInputProps, \"disabled\" | \"required\" | \"readOnly\"> &\n NumberInputOptions\n\ntype NumberInputContext = {\n getInputProps: PropGetter\n getIncrementProps: PropGetter\n getDecrementProps: PropGetter\n styles: Record<string, CSSUIObject>\n}\n\nconst [NumberInputContextProvider, useNumberInputContext] =\n createContext<NumberInputContext>({\n strict: false,\n name: \"NumberInputContext\",\n })\n\n/**\n * `NumberInput` is a component used to obtain numeric input from the user.\n *\n * @see Docs https://yamada-ui.com/components/forms/number-input\n */\nexport const NumberInput = forwardRef<NumberInputProps, \"input\">(\n (props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"NumberInput\", props)\n const {\n className,\n isStepper = true,\n containerProps,\n addonProps,\n incrementProps,\n decrementProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n const {\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n props: rest,\n } = useNumberInput(computedProps)\n\n const css: CSSUIObject = {\n position: \"relative\",\n zIndex: 0,\n ...styles.container,\n }\n\n return (\n <NumberInputContextProvider\n value={{ getInputProps, getIncrementProps, getDecrementProps, styles }}\n >\n <ui.div\n className={cx(\"ui-number-input\", className)}\n __css={css}\n {...containerProps}\n >\n <NumberInputField\n {...getInputProps(rest as DOMAttributes<HTMLElement>, ref)}\n />\n\n {isStepper ? (\n <NumberInputAddon {...addonProps}>\n <NumberIncrementStepper {...incrementProps} />\n <NumberDecrementStepper {...decrementProps} />\n </NumberInputAddon>\n ) : null}\n </ui.div>\n </NumberInputContextProvider>\n )\n },\n)\n\ntype NumberInputFieldProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\"\n>\n\nconst NumberInputField = forwardRef<NumberInputFieldProps, \"input\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n width: \"100%\",\n ...styles.field,\n }\n\n return (\n <ui.input\n ref={ref}\n className={cx(\"ui-number-input__field\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype NumberInputAddonProps = HTMLUIProps<\"div\">\n\nconst NumberInputAddon = forwardRef<NumberInputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n display: \"flex\",\n flexDirection: \"column\",\n position: \"absolute\",\n top: \"0\",\n insetEnd: \"0px\",\n margin: \"1px\",\n height: \"calc(100% - 2px)\",\n zIndex: \"fallback(yamcha, 1)\",\n ...styles.addon,\n }\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-number-input__addon\", className)}\n aria-hidden\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst Stepper = ui(\"div\", {\n baseStyle: {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n flex: 1,\n transitionProperty: \"common\",\n transitionDuration: \"normal\",\n userSelect: \"none\",\n cursor: \"pointer\",\n lineHeight: \"normal\",\n },\n})\n\ntype NumberIncrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberIncrementStepper = forwardRef<NumberIncrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getIncrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--up\", className)}\n {...getIncrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n </Stepper>\n )\n },\n)\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberDecrementStepper = forwardRef<NumberDecrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getDecrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--down\", className)}\n {...getDecrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon />}\n </Stepper>\n )\n },\n)\n"],"mappings":"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","names":["value","isFocused","props"]}
package/dist/index.mjs CHANGED
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  NumberInput,
4
4
  useNumberInput
5
- } from "./chunk-GLR53SQE.mjs";
5
+ } from "./chunk-NCOASV6M.mjs";
6
6
  export {
7
7
  NumberInput,
8
8
  useNumberInput
@@ -1,9 +1,10 @@
1
1
  import * as _yamada_ui_core from '@yamada-ui/core';
2
2
  import { HTMLUIProps, ThemeProps, ColorModeToken, CSS } from '@yamada-ui/core';
3
+ import * as react from 'react';
4
+ import { InputHTMLAttributes } from 'react';
3
5
  import { UseFormControlProps } from '@yamada-ui/form-control';
4
6
  import { UseCounterProps } from '@yamada-ui/use-counter';
5
7
  import { PropGetter } from '@yamada-ui/utils';
6
- import { InputHTMLAttributes } from 'react';
7
8
 
8
9
  type ValidityState = "rangeUnderflow" | "rangeOverflow";
9
10
  type UseNumberInputProps = UseFormControlProps<HTMLInputElement> & UseCounterProps & {
@@ -76,10 +77,16 @@ declare const useNumberInput: (props?: UseNumberInputProps) => {
76
77
  _focus?: {} | undefined;
77
78
  _invalid?: {} | undefined;
78
79
  _focusVisible?: {} | undefined;
80
+ disabled: boolean | undefined;
81
+ required: boolean | undefined;
82
+ readOnly: boolean | undefined;
79
83
  "aria-disabled": boolean | undefined;
80
84
  "aria-readonly": boolean | undefined;
81
85
  "aria-required": boolean | undefined;
86
+ "aria-invalid": boolean | undefined;
82
87
  "data-readonly": boolean | "true" | "false";
88
+ onFocus: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
89
+ onBlur: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
83
90
  };
84
91
  value: string;
85
92
  valueAsNumber: number;
@@ -1,9 +1,10 @@
1
1
  import * as _yamada_ui_core from '@yamada-ui/core';
2
2
  import { HTMLUIProps, ThemeProps, ColorModeToken, CSS } from '@yamada-ui/core';
3
+ import * as react from 'react';
4
+ import { InputHTMLAttributes } from 'react';
3
5
  import { UseFormControlProps } from '@yamada-ui/form-control';
4
6
  import { UseCounterProps } from '@yamada-ui/use-counter';
5
7
  import { PropGetter } from '@yamada-ui/utils';
6
- import { InputHTMLAttributes } from 'react';
7
8
 
8
9
  type ValidityState = "rangeUnderflow" | "rangeOverflow";
9
10
  type UseNumberInputProps = UseFormControlProps<HTMLInputElement> & UseCounterProps & {
@@ -76,10 +77,16 @@ declare const useNumberInput: (props?: UseNumberInputProps) => {
76
77
  _focus?: {} | undefined;
77
78
  _invalid?: {} | undefined;
78
79
  _focusVisible?: {} | undefined;
80
+ disabled: boolean | undefined;
81
+ required: boolean | undefined;
82
+ readOnly: boolean | undefined;
79
83
  "aria-disabled": boolean | undefined;
80
84
  "aria-readonly": boolean | undefined;
81
85
  "aria-required": boolean | undefined;
86
+ "aria-invalid": boolean | undefined;
82
87
  "data-readonly": boolean | "true" | "false";
88
+ onFocus: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
89
+ onBlur: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
83
90
  };
84
91
  value: string;
85
92
  valueAsNumber: number;
@@ -60,9 +60,6 @@ var useNumberInput = (props = {}) => {
60
60
  defaultValue,
61
61
  inputMode = "decimal",
62
62
  pattern = "[0-9]*(.[0-9]+)?",
63
- required,
64
- disabled,
65
- readOnly,
66
63
  focusInputOnChange = true,
67
64
  clampValueOnBlur = true,
68
65
  keepWithinRange = true,
@@ -77,12 +74,17 @@ var useNumberInput = (props = {}) => {
77
74
  isValidCharacter: isValidCharacterProp,
78
75
  getAriaValueText: getAriaValueTextProp,
79
76
  onChange: onChangeProp,
80
- onFocus: onFocusProp,
81
- onBlur: onBlurProp,
82
- "aria-invalid": isInvalid,
83
77
  ...rest
84
78
  } = (0, import_form_control.useFormControlProps)(props);
85
- const formControlProps = (0, import_utils.pickObject)(rest, import_form_control.formControlProperties);
79
+ const {
80
+ required,
81
+ disabled,
82
+ readOnly,
83
+ "aria-invalid": isInvalid,
84
+ onFocus: onFocusProp,
85
+ onBlur: onBlurProp,
86
+ ...formControlProps
87
+ } = (0, import_utils.pickObject)(rest, import_form_control.formControlProperties);
86
88
  const isRequired = required;
87
89
  const isReadOnly = readOnly;
88
90
  const isDisabled = disabled;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/number-input.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useMultiComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { UseFormControlProps } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { ChevronIcon } from \"@yamada-ui/icon\"\nimport type { UseCounterProps } from \"@yamada-ui/use-counter\"\nimport { useCounter } from \"@yamada-ui/use-counter\"\nimport { useEventListener } from \"@yamada-ui/use-event-listener\"\nimport { useInterval } from \"@yamada-ui/use-interval\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n ariaAttr,\n createContext,\n cx,\n handlerAll,\n mergeRefs,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n InputHTMLAttributes,\n KeyboardEvent,\n KeyboardEventHandler,\n} from \"react\"\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\n\nconst isDefaultValidCharacter = (character: string) =>\n /^[Ee0-9+\\-.]$/.test(character)\n\nconst isValidNumericKeyboardEvent = (\n { key, ctrlKey, altKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\n) => {\n if (key == null) return true\n\n const isModifierKey = ctrlKey || altKey || metaKey\n const isSingleCharacterKey = key.length === 1\n\n if (!isSingleCharacterKey || isModifierKey) return true\n\n return isValid(key)\n}\n\nconst getStep = <Y extends KeyboardEvent | WheelEvent>({\n ctrlKey,\n shiftKey,\n metaKey,\n}: Y) => {\n let ratio = 1\n\n if (metaKey || ctrlKey) ratio = 0.1\n\n if (shiftKey) ratio = 10\n\n return ratio\n}\n\ntype ValidityState = \"rangeUnderflow\" | \"rangeOverflow\"\n\nexport type UseNumberInputProps = UseFormControlProps<HTMLInputElement> &\n UseCounterProps & {\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * Hints at the type of data that might be entered by the user.\n * It also determines the type of keyboard shown to the user on mobile devices.\n *\n * @default 'decimal'\n */\n inputMode?: InputHTMLAttributes<any>[\"inputMode\"]\n /**\n * The pattern used to check the <input> element's value against on form submission.\n *\n * @default '[0-9]*(.[0-9]+)?'\n */\n pattern?: InputHTMLAttributes<any>[\"pattern\"]\n /**\n * If `true`, the input will be focused as you increment or decrement the value with the stepper.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * This controls the value update when you blur out of the input.\n * - If `true` and the value is greater than `max`, the value will be reset to `max`.\n * - Else, the value remains the same.\n *\n * @default true\n */\n clampValueOnBlur?: boolean\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: boolean\n /**\n * The callback invoked when invalid number is entered.\n */\n onInvalid?: (\n message: ValidityState,\n value: string,\n valueAsNumber: number,\n ) => void\n /**\n * This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n *\n * It is used to set the `aria-valuetext` property of the input.\n */\n getAriaValueText?: (value: string | number) => string\n /**\n * Whether the pressed key should be allowed in the input.\n * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\\-.]$/.\n */\n isValidCharacter?: (value: string) => boolean\n /**\n * If using a custom display format, this converts the custom format to a format `parseFloat` understands.\n */\n parse?: (value: string) => string\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: string | number) => string | number\n }\n\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n const {\n id,\n name,\n value: valueProp,\n defaultValue,\n inputMode = \"decimal\",\n pattern = \"[0-9]*(.[0-9]+)?\",\n required,\n disabled,\n readOnly,\n focusInputOnChange = true,\n clampValueOnBlur = true,\n keepWithinRange = true,\n allowMouseWheel,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step: stepProp,\n precision,\n parse: parseProp,\n format: formatProp,\n onInvalid: onInvalidProp,\n isValidCharacter: isValidCharacterProp,\n getAriaValueText: getAriaValueTextProp,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n \"aria-invalid\": isInvalid,\n ...rest\n } = useFormControlProps(props)\n const formControlProps = pickObject(rest, formControlProperties)\n\n const isRequired = required\n const isReadOnly = readOnly\n const isDisabled = disabled\n\n const [isFocused, setFocused] = useState(false)\n const isInteractive = !(readOnly || disabled)\n\n const inputRef = useRef<HTMLInputElement>(null)\n const inputSelectionRef = useRef<{\n start: number | null\n end: number | null\n } | null>(null)\n const incrementRef = useRef<HTMLButtonElement>(null)\n const decrementRef = useRef<HTMLButtonElement>(null)\n\n const onFocus = useCallbackRef(\n handlerAll(onFocusProp, (ev) => {\n setFocused(true)\n\n if (!inputSelectionRef.current) return\n\n ev.target.selectionStart =\n inputSelectionRef.current.start ?? ev.currentTarget.value?.length\n ev.currentTarget.selectionEnd =\n inputSelectionRef.current.end ?? ev.currentTarget.selectionStart\n }),\n )\n const onBlur = useCallbackRef(\n handlerAll(onBlurProp, () => {\n setFocused(false)\n\n if (clampValueOnBlur) validateAndClamp()\n }),\n )\n const onInvalid = useCallbackRef(onInvalidProp)\n const getAriaValueText = useCallbackRef(getAriaValueTextProp)\n const isValidCharacter = useCallbackRef(\n isValidCharacterProp ?? isDefaultValidCharacter,\n )\n\n const {\n isMin,\n isMax,\n isOut,\n value,\n valueAsNumber,\n setValue,\n update,\n cast,\n ...counter\n } = useCounter({\n value: valueProp,\n defaultValue,\n step: stepProp,\n min,\n max,\n precision,\n keepWithinRange,\n onChange: onChangeProp,\n })\n\n const valueText = useMemo(() => {\n let text = getAriaValueText?.(value)\n\n if (text != null) return text\n\n text = value.toString()\n\n return !text ? undefined : text\n }, [value, getAriaValueText])\n\n const sanitize = useCallback(\n (value: string) => value.split(\"\").filter(isValidCharacter).join(\"\"),\n [isValidCharacter],\n )\n\n const parse = useCallback(\n (value: string) => parseProp?.(value) ?? value,\n [parseProp],\n )\n\n const format = useCallback(\n (value: string | number) => (formatProp?.(value) ?? value).toString(),\n [formatProp],\n )\n\n const increment = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.increment(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const decrement = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.decrement(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const validateAndClamp = useCallback(() => {\n let next = value as string | number\n\n if (value === \"\") return\n\n const valueStartsWithE = /^[eE]/.test(value.toString())\n\n if (valueStartsWithE) {\n setValue(\"\")\n } else {\n if (valueAsNumber < min) next = min\n\n if (valueAsNumber > max) next = max\n\n cast(next)\n }\n }, [cast, max, min, setValue, value, valueAsNumber])\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if ((ev.nativeEvent as InputEvent).isComposing) return\n\n const parsedInput = parse(ev.currentTarget.value)\n\n update(sanitize(parsedInput))\n\n inputSelectionRef.current = {\n start: ev.currentTarget.selectionStart,\n end: ev.currentTarget.selectionEnd,\n }\n },\n [parse, update, sanitize],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.nativeEvent.isComposing) return\n\n if (!isValidNumericKeyboardEvent(ev, isValidCharacter))\n ev.preventDefault()\n\n const step = getStep(ev) * (stepProp ?? 1)\n\n const keyMap: Record<string, KeyboardEventHandler> = {\n ArrowUp: () => increment(step),\n ArrowDown: () => decrement(step),\n Home: () => update(min),\n End: () => update(max),\n }\n\n const action = keyMap[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n action(ev)\n },\n [decrement, increment, isValidCharacter, max, min, stepProp, update],\n )\n\n const { up, down, stop, isSpinning } = useSpinner(increment, decrement)\n\n useAttributeObserver(incrementRef, [\"disabled\"], isSpinning, stop)\n useAttributeObserver(decrementRef, [\"disabled\"], isSpinning, stop)\n\n const focusInput = useCallback(() => {\n if (focusInputOnChange)\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n }, [focusInputOnChange])\n\n const eventUp = useCallback(\n (ev: any) => {\n ev.preventDefault()\n up()\n focusInput()\n },\n [focusInput, up],\n )\n\n const eventDown = useCallback(\n (ev: any) => {\n ev.preventDefault()\n down()\n focusInput()\n },\n [focusInput, down],\n )\n\n useUpdateEffect(() => {\n if (valueAsNumber > max) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n } else if (valueAsNumber < min) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n }\n }, [valueAsNumber, value, format, onInvalid])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n const notInSync = inputRef.current.value != value\n\n if (!notInSync) return\n\n const parsedInput = parse(inputRef.current.value)\n\n setValue(sanitize(parsedInput))\n }, [parse, sanitize])\n\n useEventListener(\n () => inputRef.current,\n \"wheel\",\n (ev) => {\n const ownerDocument = inputRef.current?.ownerDocument ?? document\n const isFocused = ownerDocument.activeElement === inputRef.current\n\n if (!allowMouseWheel || !isFocused) return\n\n ev.preventDefault()\n\n const step = getStep(ev as any) * (stepProp ?? 1)\n const direction = Math.sign(ev.deltaY)\n\n if (direction === -1) {\n increment(step)\n } else if (direction === 1) {\n decrement(step)\n }\n },\n { passive: false },\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n id,\n name,\n type: \"text\",\n role: \"spinbutton\",\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n ...formControlProps,\n ...props,\n min,\n max,\n step: stepProp,\n ref: mergeRefs(inputRef, ref),\n value: format(value),\n \"aria-valuemin\": min,\n \"aria-valuemax\": max,\n \"aria-valuenow\": Number.isNaN(valueAsNumber) ? undefined : valueAsNumber,\n \"aria-valuetext\": valueText,\n \"aria-invalid\": ariaAttr(isInvalid ?? isOut),\n autoComplete: \"off\",\n autoCorrect: \"off\",\n onChange: handlerAll(props.onChange, onChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onFocus: handlerAll(props.onFocus, onFocus),\n onBlur: handlerAll(props.onBlur, onBlur),\n }),\n [\n id,\n name,\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n formControlProps,\n min,\n max,\n stepProp,\n format,\n value,\n valueAsNumber,\n valueText,\n isInvalid,\n isOut,\n onChange,\n onKeyDown,\n onFocus,\n onBlur,\n ],\n )\n\n const getIncrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMax)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, incrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventUp(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMax,\n required,\n readOnly,\n formControlProps,\n stop,\n eventUp,\n ],\n )\n\n const getDecrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMin)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, decrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventDown(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMin,\n required,\n readOnly,\n formControlProps,\n stop,\n eventDown,\n ],\n )\n\n return {\n props: rest,\n value: format(value),\n valueAsNumber,\n isFocused,\n isRequired,\n isReadOnly,\n isDisabled,\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n\nconst INTERVAL = 50\n\nconst DELAY = 300\n\ntype Action = \"increment\" | \"decrement\"\n\nconst useSpinner = (increment: Function, decrement: Function) => {\n const [isSpinning, setIsSpinning] = useState(false)\n const [action, setAction] = useState<Action | null>(null)\n const [isOnce, setIsOnce] = useState(true)\n const timeoutRef = useRef<any>(null)\n\n const removeTimeout = () => clearTimeout(timeoutRef.current)\n\n useInterval(\n () => {\n if (action === \"increment\") increment()\n\n if (action === \"decrement\") decrement()\n },\n isSpinning ? INTERVAL : null,\n )\n\n const up = useCallback(() => {\n if (isOnce) increment()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"increment\")\n }, DELAY)\n }, [increment, isOnce])\n\n const down = useCallback(() => {\n if (isOnce) decrement()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"decrement\")\n }, DELAY)\n }, [decrement, isOnce])\n\n const stop = useCallback(() => {\n setIsOnce(true)\n setIsSpinning(false)\n removeTimeout()\n }, [])\n\n useEffect(() => {\n return () => removeTimeout()\n }, [])\n\n return { up, down, stop, isSpinning }\n}\n\nconst useAttributeObserver = (\n ref: React.RefObject<HTMLElement | null>,\n attributeFilter: string[],\n enabled: boolean,\n func: () => void,\n) => {\n useEffect(() => {\n if (!ref.current || !enabled) return\n\n const ownerDocument = ref.current.ownerDocument.defaultView ?? window\n\n const observer = new ownerDocument.MutationObserver((changes) => {\n for (const { type, attributeName } of changes) {\n if (\n type === \"attributes\" &&\n attributeName &&\n attributeFilter.includes(attributeName)\n )\n func()\n }\n })\n\n observer.observe(ref.current, { attributes: true, attributeFilter })\n\n return () => observer.disconnect()\n })\n}\n\ntype NumberInputOptions = {\n /**\n * If `true`, display the addon for the number input.\n */\n isStepper?: boolean\n /**\n * Props for container element.\n */\n containerProps?: HTMLUIProps<\"div\">\n /**\n * Props for addon component.\n */\n addonProps?: HTMLUIProps<\"div\">\n /**\n * Props for increment component.\n */\n incrementProps?: NumberIncrementStepperProps\n /**\n * Props for decrement component.\n */\n decrementProps?: NumberDecrementStepperProps\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n}\n\nexport type NumberInputProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\" | \"onChange\"\n> &\n ThemeProps<\"NumberInput\"> &\n Omit<UseNumberInputProps, \"disabled\" | \"required\" | \"readOnly\"> &\n NumberInputOptions\n\ntype NumberInputContext = {\n getInputProps: PropGetter\n getIncrementProps: PropGetter\n getDecrementProps: PropGetter\n styles: Record<string, CSSUIObject>\n}\n\nconst [NumberInputContextProvider, useNumberInputContext] =\n createContext<NumberInputContext>({\n strict: false,\n name: \"NumberInputContext\",\n })\n\n/**\n * `NumberInput` is a component used to obtain numeric input from the user.\n *\n * @see Docs https://yamada-ui.com/components/forms/number-input\n */\nexport const NumberInput = forwardRef<NumberInputProps, \"input\">(\n (props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"NumberInput\", props)\n const {\n className,\n isStepper = true,\n containerProps,\n addonProps,\n incrementProps,\n decrementProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n const {\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n props: rest,\n } = useNumberInput(computedProps)\n\n const css: CSSUIObject = {\n position: \"relative\",\n zIndex: 0,\n ...styles.container,\n }\n\n return (\n <NumberInputContextProvider\n value={{ getInputProps, getIncrementProps, getDecrementProps, styles }}\n >\n <ui.div\n className={cx(\"ui-number-input\", className)}\n __css={css}\n {...containerProps}\n >\n <NumberInputField\n {...getInputProps(rest as DOMAttributes<HTMLElement>, ref)}\n />\n\n {isStepper ? (\n <NumberInputAddon {...addonProps}>\n <NumberIncrementStepper {...incrementProps} />\n <NumberDecrementStepper {...decrementProps} />\n </NumberInputAddon>\n ) : null}\n </ui.div>\n </NumberInputContextProvider>\n )\n },\n)\n\ntype NumberInputFieldProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\"\n>\n\nconst NumberInputField = forwardRef<NumberInputFieldProps, \"input\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n width: \"100%\",\n ...styles.field,\n }\n\n return (\n <ui.input\n ref={ref}\n className={cx(\"ui-number-input__field\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype NumberInputAddonProps = HTMLUIProps<\"div\">\n\nconst NumberInputAddon = forwardRef<NumberInputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n display: \"flex\",\n flexDirection: \"column\",\n position: \"absolute\",\n top: \"0\",\n insetEnd: \"0px\",\n margin: \"1px\",\n height: \"calc(100% - 2px)\",\n zIndex: \"fallback(yamcha, 1)\",\n ...styles.addon,\n }\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-number-input__addon\", className)}\n aria-hidden\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst Stepper = ui(\"div\", {\n baseStyle: {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n flex: 1,\n transitionProperty: \"common\",\n transitionDuration: \"normal\",\n userSelect: \"none\",\n cursor: \"pointer\",\n lineHeight: \"normal\",\n },\n})\n\ntype NumberIncrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberIncrementStepper = forwardRef<NumberIncrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getIncrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--up\", className)}\n {...getIncrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n </Stepper>\n )\n },\n)\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberDecrementStepper = forwardRef<NumberDecrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getDecrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--down\", className)}\n {...getDecrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon />}\n </Stepper>\n )\n },\n)\n"],"mappings":"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","names":["value","isFocused","props"]}
1
+ {"version":3,"sources":["../src/number-input.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useMultiComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { UseFormControlProps } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { ChevronIcon } from \"@yamada-ui/icon\"\nimport type { UseCounterProps } from \"@yamada-ui/use-counter\"\nimport { useCounter } from \"@yamada-ui/use-counter\"\nimport { useEventListener } from \"@yamada-ui/use-event-listener\"\nimport { useInterval } from \"@yamada-ui/use-interval\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n ariaAttr,\n createContext,\n cx,\n handlerAll,\n mergeRefs,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n InputHTMLAttributes,\n KeyboardEvent,\n KeyboardEventHandler,\n} from \"react\"\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\n\nconst isDefaultValidCharacter = (character: string) =>\n /^[Ee0-9+\\-.]$/.test(character)\n\nconst isValidNumericKeyboardEvent = (\n { key, ctrlKey, altKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\n) => {\n if (key == null) return true\n\n const isModifierKey = ctrlKey || altKey || metaKey\n const isSingleCharacterKey = key.length === 1\n\n if (!isSingleCharacterKey || isModifierKey) return true\n\n return isValid(key)\n}\n\nconst getStep = <Y extends KeyboardEvent | WheelEvent>({\n ctrlKey,\n shiftKey,\n metaKey,\n}: Y) => {\n let ratio = 1\n\n if (metaKey || ctrlKey) ratio = 0.1\n\n if (shiftKey) ratio = 10\n\n return ratio\n}\n\ntype ValidityState = \"rangeUnderflow\" | \"rangeOverflow\"\n\nexport type UseNumberInputProps = UseFormControlProps<HTMLInputElement> &\n UseCounterProps & {\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * Hints at the type of data that might be entered by the user.\n * It also determines the type of keyboard shown to the user on mobile devices.\n *\n * @default 'decimal'\n */\n inputMode?: InputHTMLAttributes<any>[\"inputMode\"]\n /**\n * The pattern used to check the <input> element's value against on form submission.\n *\n * @default '[0-9]*(.[0-9]+)?'\n */\n pattern?: InputHTMLAttributes<any>[\"pattern\"]\n /**\n * If `true`, the input will be focused as you increment or decrement the value with the stepper.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * This controls the value update when you blur out of the input.\n * - If `true` and the value is greater than `max`, the value will be reset to `max`.\n * - Else, the value remains the same.\n *\n * @default true\n */\n clampValueOnBlur?: boolean\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: boolean\n /**\n * The callback invoked when invalid number is entered.\n */\n onInvalid?: (\n message: ValidityState,\n value: string,\n valueAsNumber: number,\n ) => void\n /**\n * This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n *\n * It is used to set the `aria-valuetext` property of the input.\n */\n getAriaValueText?: (value: string | number) => string\n /**\n * Whether the pressed key should be allowed in the input.\n * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\\-.]$/.\n */\n isValidCharacter?: (value: string) => boolean\n /**\n * If using a custom display format, this converts the custom format to a format `parseFloat` understands.\n */\n parse?: (value: string) => string\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: string | number) => string | number\n }\n\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n const {\n id,\n name,\n value: valueProp,\n defaultValue,\n inputMode = \"decimal\",\n pattern = \"[0-9]*(.[0-9]+)?\",\n focusInputOnChange = true,\n clampValueOnBlur = true,\n keepWithinRange = true,\n allowMouseWheel,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step: stepProp,\n precision,\n parse: parseProp,\n format: formatProp,\n onInvalid: onInvalidProp,\n isValidCharacter: isValidCharacterProp,\n getAriaValueText: getAriaValueTextProp,\n onChange: onChangeProp,\n ...rest\n } = useFormControlProps(props)\n const {\n required,\n disabled,\n readOnly,\n \"aria-invalid\": isInvalid,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...formControlProps\n } = pickObject(rest, formControlProperties)\n\n const isRequired = required\n const isReadOnly = readOnly\n const isDisabled = disabled\n\n const [isFocused, setFocused] = useState(false)\n const isInteractive = !(readOnly || disabled)\n\n const inputRef = useRef<HTMLInputElement>(null)\n const inputSelectionRef = useRef<{\n start: number | null\n end: number | null\n } | null>(null)\n const incrementRef = useRef<HTMLButtonElement>(null)\n const decrementRef = useRef<HTMLButtonElement>(null)\n\n const onFocus = useCallbackRef(\n handlerAll(onFocusProp, (ev) => {\n setFocused(true)\n\n if (!inputSelectionRef.current) return\n\n ev.target.selectionStart =\n inputSelectionRef.current.start ?? ev.currentTarget.value?.length\n ev.currentTarget.selectionEnd =\n inputSelectionRef.current.end ?? ev.currentTarget.selectionStart\n }),\n )\n const onBlur = useCallbackRef(\n handlerAll(onBlurProp, () => {\n setFocused(false)\n\n if (clampValueOnBlur) validateAndClamp()\n }),\n )\n const onInvalid = useCallbackRef(onInvalidProp)\n const getAriaValueText = useCallbackRef(getAriaValueTextProp)\n const isValidCharacter = useCallbackRef(\n isValidCharacterProp ?? isDefaultValidCharacter,\n )\n\n const {\n isMin,\n isMax,\n isOut,\n value,\n valueAsNumber,\n setValue,\n update,\n cast,\n ...counter\n } = useCounter({\n value: valueProp,\n defaultValue,\n step: stepProp,\n min,\n max,\n precision,\n keepWithinRange,\n onChange: onChangeProp,\n })\n\n const valueText = useMemo(() => {\n let text = getAriaValueText?.(value)\n\n if (text != null) return text\n\n text = value.toString()\n\n return !text ? undefined : text\n }, [value, getAriaValueText])\n\n const sanitize = useCallback(\n (value: string) => value.split(\"\").filter(isValidCharacter).join(\"\"),\n [isValidCharacter],\n )\n\n const parse = useCallback(\n (value: string) => parseProp?.(value) ?? value,\n [parseProp],\n )\n\n const format = useCallback(\n (value: string | number) => (formatProp?.(value) ?? value).toString(),\n [formatProp],\n )\n\n const increment = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.increment(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const decrement = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.decrement(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const validateAndClamp = useCallback(() => {\n let next = value as string | number\n\n if (value === \"\") return\n\n const valueStartsWithE = /^[eE]/.test(value.toString())\n\n if (valueStartsWithE) {\n setValue(\"\")\n } else {\n if (valueAsNumber < min) next = min\n\n if (valueAsNumber > max) next = max\n\n cast(next)\n }\n }, [cast, max, min, setValue, value, valueAsNumber])\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if ((ev.nativeEvent as InputEvent).isComposing) return\n\n const parsedInput = parse(ev.currentTarget.value)\n\n update(sanitize(parsedInput))\n\n inputSelectionRef.current = {\n start: ev.currentTarget.selectionStart,\n end: ev.currentTarget.selectionEnd,\n }\n },\n [parse, update, sanitize],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.nativeEvent.isComposing) return\n\n if (!isValidNumericKeyboardEvent(ev, isValidCharacter))\n ev.preventDefault()\n\n const step = getStep(ev) * (stepProp ?? 1)\n\n const keyMap: Record<string, KeyboardEventHandler> = {\n ArrowUp: () => increment(step),\n ArrowDown: () => decrement(step),\n Home: () => update(min),\n End: () => update(max),\n }\n\n const action = keyMap[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n action(ev)\n },\n [decrement, increment, isValidCharacter, max, min, stepProp, update],\n )\n\n const { up, down, stop, isSpinning } = useSpinner(increment, decrement)\n\n useAttributeObserver(incrementRef, [\"disabled\"], isSpinning, stop)\n useAttributeObserver(decrementRef, [\"disabled\"], isSpinning, stop)\n\n const focusInput = useCallback(() => {\n if (focusInputOnChange)\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n }, [focusInputOnChange])\n\n const eventUp = useCallback(\n (ev: any) => {\n ev.preventDefault()\n up()\n focusInput()\n },\n [focusInput, up],\n )\n\n const eventDown = useCallback(\n (ev: any) => {\n ev.preventDefault()\n down()\n focusInput()\n },\n [focusInput, down],\n )\n\n useUpdateEffect(() => {\n if (valueAsNumber > max) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n } else if (valueAsNumber < min) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n }\n }, [valueAsNumber, value, format, onInvalid])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n const notInSync = inputRef.current.value != value\n\n if (!notInSync) return\n\n const parsedInput = parse(inputRef.current.value)\n\n setValue(sanitize(parsedInput))\n }, [parse, sanitize])\n\n useEventListener(\n () => inputRef.current,\n \"wheel\",\n (ev) => {\n const ownerDocument = inputRef.current?.ownerDocument ?? document\n const isFocused = ownerDocument.activeElement === inputRef.current\n\n if (!allowMouseWheel || !isFocused) return\n\n ev.preventDefault()\n\n const step = getStep(ev as any) * (stepProp ?? 1)\n const direction = Math.sign(ev.deltaY)\n\n if (direction === -1) {\n increment(step)\n } else if (direction === 1) {\n decrement(step)\n }\n },\n { passive: false },\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n id,\n name,\n type: \"text\",\n role: \"spinbutton\",\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n ...formControlProps,\n ...props,\n min,\n max,\n step: stepProp,\n ref: mergeRefs(inputRef, ref),\n value: format(value),\n \"aria-valuemin\": min,\n \"aria-valuemax\": max,\n \"aria-valuenow\": Number.isNaN(valueAsNumber) ? undefined : valueAsNumber,\n \"aria-valuetext\": valueText,\n \"aria-invalid\": ariaAttr(isInvalid ?? isOut),\n autoComplete: \"off\",\n autoCorrect: \"off\",\n onChange: handlerAll(props.onChange, onChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onFocus: handlerAll(props.onFocus, onFocus),\n onBlur: handlerAll(props.onBlur, onBlur),\n }),\n [\n id,\n name,\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n formControlProps,\n min,\n max,\n stepProp,\n format,\n value,\n valueAsNumber,\n valueText,\n isInvalid,\n isOut,\n onChange,\n onKeyDown,\n onFocus,\n onBlur,\n ],\n )\n\n const getIncrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMax)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, incrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventUp(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMax,\n required,\n readOnly,\n formControlProps,\n stop,\n eventUp,\n ],\n )\n\n const getDecrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMin)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, decrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventDown(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMin,\n required,\n readOnly,\n formControlProps,\n stop,\n eventDown,\n ],\n )\n\n return {\n props: rest,\n value: format(value),\n valueAsNumber,\n isFocused,\n isRequired,\n isReadOnly,\n isDisabled,\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n\nconst INTERVAL = 50\n\nconst DELAY = 300\n\ntype Action = \"increment\" | \"decrement\"\n\nconst useSpinner = (increment: Function, decrement: Function) => {\n const [isSpinning, setIsSpinning] = useState(false)\n const [action, setAction] = useState<Action | null>(null)\n const [isOnce, setIsOnce] = useState(true)\n const timeoutRef = useRef<any>(null)\n\n const removeTimeout = () => clearTimeout(timeoutRef.current)\n\n useInterval(\n () => {\n if (action === \"increment\") increment()\n\n if (action === \"decrement\") decrement()\n },\n isSpinning ? INTERVAL : null,\n )\n\n const up = useCallback(() => {\n if (isOnce) increment()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"increment\")\n }, DELAY)\n }, [increment, isOnce])\n\n const down = useCallback(() => {\n if (isOnce) decrement()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"decrement\")\n }, DELAY)\n }, [decrement, isOnce])\n\n const stop = useCallback(() => {\n setIsOnce(true)\n setIsSpinning(false)\n removeTimeout()\n }, [])\n\n useEffect(() => {\n return () => removeTimeout()\n }, [])\n\n return { up, down, stop, isSpinning }\n}\n\nconst useAttributeObserver = (\n ref: React.RefObject<HTMLElement | null>,\n attributeFilter: string[],\n enabled: boolean,\n func: () => void,\n) => {\n useEffect(() => {\n if (!ref.current || !enabled) return\n\n const ownerDocument = ref.current.ownerDocument.defaultView ?? window\n\n const observer = new ownerDocument.MutationObserver((changes) => {\n for (const { type, attributeName } of changes) {\n if (\n type === \"attributes\" &&\n attributeName &&\n attributeFilter.includes(attributeName)\n )\n func()\n }\n })\n\n observer.observe(ref.current, { attributes: true, attributeFilter })\n\n return () => observer.disconnect()\n })\n}\n\ntype NumberInputOptions = {\n /**\n * If `true`, display the addon for the number input.\n */\n isStepper?: boolean\n /**\n * Props for container element.\n */\n containerProps?: HTMLUIProps<\"div\">\n /**\n * Props for addon component.\n */\n addonProps?: HTMLUIProps<\"div\">\n /**\n * Props for increment component.\n */\n incrementProps?: NumberIncrementStepperProps\n /**\n * Props for decrement component.\n */\n decrementProps?: NumberDecrementStepperProps\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n}\n\nexport type NumberInputProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\" | \"onChange\"\n> &\n ThemeProps<\"NumberInput\"> &\n Omit<UseNumberInputProps, \"disabled\" | \"required\" | \"readOnly\"> &\n NumberInputOptions\n\ntype NumberInputContext = {\n getInputProps: PropGetter\n getIncrementProps: PropGetter\n getDecrementProps: PropGetter\n styles: Record<string, CSSUIObject>\n}\n\nconst [NumberInputContextProvider, useNumberInputContext] =\n createContext<NumberInputContext>({\n strict: false,\n name: \"NumberInputContext\",\n })\n\n/**\n * `NumberInput` is a component used to obtain numeric input from the user.\n *\n * @see Docs https://yamada-ui.com/components/forms/number-input\n */\nexport const NumberInput = forwardRef<NumberInputProps, \"input\">(\n (props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"NumberInput\", props)\n const {\n className,\n isStepper = true,\n containerProps,\n addonProps,\n incrementProps,\n decrementProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n const {\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n props: rest,\n } = useNumberInput(computedProps)\n\n const css: CSSUIObject = {\n position: \"relative\",\n zIndex: 0,\n ...styles.container,\n }\n\n return (\n <NumberInputContextProvider\n value={{ getInputProps, getIncrementProps, getDecrementProps, styles }}\n >\n <ui.div\n className={cx(\"ui-number-input\", className)}\n __css={css}\n {...containerProps}\n >\n <NumberInputField\n {...getInputProps(rest as DOMAttributes<HTMLElement>, ref)}\n />\n\n {isStepper ? (\n <NumberInputAddon {...addonProps}>\n <NumberIncrementStepper {...incrementProps} />\n <NumberDecrementStepper {...decrementProps} />\n </NumberInputAddon>\n ) : null}\n </ui.div>\n </NumberInputContextProvider>\n )\n },\n)\n\ntype NumberInputFieldProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\"\n>\n\nconst NumberInputField = forwardRef<NumberInputFieldProps, \"input\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n width: \"100%\",\n ...styles.field,\n }\n\n return (\n <ui.input\n ref={ref}\n className={cx(\"ui-number-input__field\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype NumberInputAddonProps = HTMLUIProps<\"div\">\n\nconst NumberInputAddon = forwardRef<NumberInputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n display: \"flex\",\n flexDirection: \"column\",\n position: \"absolute\",\n top: \"0\",\n insetEnd: \"0px\",\n margin: \"1px\",\n height: \"calc(100% - 2px)\",\n zIndex: \"fallback(yamcha, 1)\",\n ...styles.addon,\n }\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-number-input__addon\", className)}\n aria-hidden\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst Stepper = ui(\"div\", {\n baseStyle: {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n flex: 1,\n transitionProperty: \"common\",\n transitionDuration: \"normal\",\n userSelect: \"none\",\n cursor: \"pointer\",\n lineHeight: \"normal\",\n },\n})\n\ntype NumberIncrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberIncrementStepper = forwardRef<NumberIncrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getIncrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--up\", className)}\n {...getIncrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n </Stepper>\n )\n },\n)\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberDecrementStepper = forwardRef<NumberDecrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getDecrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--down\", className)}\n {...getDecrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon />}\n </Stepper>\n )\n },\n)\n"],"mappings":"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","names":["value","isFocused","props"]}
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  NumberInput,
4
4
  useNumberInput
5
- } from "./chunk-GLR53SQE.mjs";
5
+ } from "./chunk-NCOASV6M.mjs";
6
6
  export {
7
7
  NumberInput,
8
8
  useNumberInput
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/number-input",
3
- "version": "1.1.13-dev-20240907122824",
3
+ "version": "1.1.13-dev-20240908075149",
4
4
  "description": "Yamada UI number input component",
5
5
  "keywords": [
6
6
  "yamada",
@@ -36,13 +36,13 @@
36
36
  "url": "https://github.com/yamada-ui/yamada-ui/issues"
37
37
  },
38
38
  "dependencies": {
39
- "@yamada-ui/core": "1.13.1-dev-20240907122824",
40
- "@yamada-ui/form-control": "2.1.1-dev-20240907122824",
41
- "@yamada-ui/icon": "1.1.5-dev-20240907122824",
42
- "@yamada-ui/use-counter": "1.0.19",
43
- "@yamada-ui/use-event-listener": "1.0.18",
44
- "@yamada-ui/use-interval": "1.0.18",
45
- "@yamada-ui/utils": "1.4.0"
39
+ "@yamada-ui/core": "1.14.0-dev-20240908075149",
40
+ "@yamada-ui/form-control": "2.1.1-dev-20240908075149",
41
+ "@yamada-ui/icon": "1.1.5-dev-20240908075149",
42
+ "@yamada-ui/use-counter": "1.0.20-dev-20240908075149",
43
+ "@yamada-ui/use-event-listener": "1.0.19-dev-20240908075149",
44
+ "@yamada-ui/use-interval": "1.0.19-dev-20240908075149",
45
+ "@yamada-ui/utils": "1.4.1-dev-20240908075149"
46
46
  },
47
47
  "devDependencies": {
48
48
  "clean-package": "2.2.0",
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/number-input.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n HTMLUIProps,\n ThemeProps,\n ColorModeToken,\n CSS,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useMultiComponentStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { UseFormControlProps } from \"@yamada-ui/form-control\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { ChevronIcon } from \"@yamada-ui/icon\"\nimport type { UseCounterProps } from \"@yamada-ui/use-counter\"\nimport { useCounter } from \"@yamada-ui/use-counter\"\nimport { useEventListener } from \"@yamada-ui/use-event-listener\"\nimport { useInterval } from \"@yamada-ui/use-interval\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n ariaAttr,\n createContext,\n cx,\n handlerAll,\n mergeRefs,\n pickObject,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n InputHTMLAttributes,\n KeyboardEvent,\n KeyboardEventHandler,\n} from \"react\"\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\n\nconst isDefaultValidCharacter = (character: string) =>\n /^[Ee0-9+\\-.]$/.test(character)\n\nconst isValidNumericKeyboardEvent = (\n { key, ctrlKey, altKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\n) => {\n if (key == null) return true\n\n const isModifierKey = ctrlKey || altKey || metaKey\n const isSingleCharacterKey = key.length === 1\n\n if (!isSingleCharacterKey || isModifierKey) return true\n\n return isValid(key)\n}\n\nconst getStep = <Y extends KeyboardEvent | WheelEvent>({\n ctrlKey,\n shiftKey,\n metaKey,\n}: Y) => {\n let ratio = 1\n\n if (metaKey || ctrlKey) ratio = 0.1\n\n if (shiftKey) ratio = 10\n\n return ratio\n}\n\ntype ValidityState = \"rangeUnderflow\" | \"rangeOverflow\"\n\nexport type UseNumberInputProps = UseFormControlProps<HTMLInputElement> &\n UseCounterProps & {\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * Hints at the type of data that might be entered by the user.\n * It also determines the type of keyboard shown to the user on mobile devices.\n *\n * @default 'decimal'\n */\n inputMode?: InputHTMLAttributes<any>[\"inputMode\"]\n /**\n * The pattern used to check the <input> element's value against on form submission.\n *\n * @default '[0-9]*(.[0-9]+)?'\n */\n pattern?: InputHTMLAttributes<any>[\"pattern\"]\n /**\n * If `true`, the input will be focused as you increment or decrement the value with the stepper.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * This controls the value update when you blur out of the input.\n * - If `true` and the value is greater than `max`, the value will be reset to `max`.\n * - Else, the value remains the same.\n *\n * @default true\n */\n clampValueOnBlur?: boolean\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: boolean\n /**\n * The callback invoked when invalid number is entered.\n */\n onInvalid?: (\n message: ValidityState,\n value: string,\n valueAsNumber: number,\n ) => void\n /**\n * This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n *\n * It is used to set the `aria-valuetext` property of the input.\n */\n getAriaValueText?: (value: string | number) => string\n /**\n * Whether the pressed key should be allowed in the input.\n * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\\-.]$/.\n */\n isValidCharacter?: (value: string) => boolean\n /**\n * If using a custom display format, this converts the custom format to a format `parseFloat` understands.\n */\n parse?: (value: string) => string\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: string | number) => string | number\n }\n\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n const {\n id,\n name,\n value: valueProp,\n defaultValue,\n inputMode = \"decimal\",\n pattern = \"[0-9]*(.[0-9]+)?\",\n required,\n disabled,\n readOnly,\n focusInputOnChange = true,\n clampValueOnBlur = true,\n keepWithinRange = true,\n allowMouseWheel,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step: stepProp,\n precision,\n parse: parseProp,\n format: formatProp,\n onInvalid: onInvalidProp,\n isValidCharacter: isValidCharacterProp,\n getAriaValueText: getAriaValueTextProp,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n \"aria-invalid\": isInvalid,\n ...rest\n } = useFormControlProps(props)\n const formControlProps = pickObject(rest, formControlProperties)\n\n const isRequired = required\n const isReadOnly = readOnly\n const isDisabled = disabled\n\n const [isFocused, setFocused] = useState(false)\n const isInteractive = !(readOnly || disabled)\n\n const inputRef = useRef<HTMLInputElement>(null)\n const inputSelectionRef = useRef<{\n start: number | null\n end: number | null\n } | null>(null)\n const incrementRef = useRef<HTMLButtonElement>(null)\n const decrementRef = useRef<HTMLButtonElement>(null)\n\n const onFocus = useCallbackRef(\n handlerAll(onFocusProp, (ev) => {\n setFocused(true)\n\n if (!inputSelectionRef.current) return\n\n ev.target.selectionStart =\n inputSelectionRef.current.start ?? ev.currentTarget.value?.length\n ev.currentTarget.selectionEnd =\n inputSelectionRef.current.end ?? ev.currentTarget.selectionStart\n }),\n )\n const onBlur = useCallbackRef(\n handlerAll(onBlurProp, () => {\n setFocused(false)\n\n if (clampValueOnBlur) validateAndClamp()\n }),\n )\n const onInvalid = useCallbackRef(onInvalidProp)\n const getAriaValueText = useCallbackRef(getAriaValueTextProp)\n const isValidCharacter = useCallbackRef(\n isValidCharacterProp ?? isDefaultValidCharacter,\n )\n\n const {\n isMin,\n isMax,\n isOut,\n value,\n valueAsNumber,\n setValue,\n update,\n cast,\n ...counter\n } = useCounter({\n value: valueProp,\n defaultValue,\n step: stepProp,\n min,\n max,\n precision,\n keepWithinRange,\n onChange: onChangeProp,\n })\n\n const valueText = useMemo(() => {\n let text = getAriaValueText?.(value)\n\n if (text != null) return text\n\n text = value.toString()\n\n return !text ? undefined : text\n }, [value, getAriaValueText])\n\n const sanitize = useCallback(\n (value: string) => value.split(\"\").filter(isValidCharacter).join(\"\"),\n [isValidCharacter],\n )\n\n const parse = useCallback(\n (value: string) => parseProp?.(value) ?? value,\n [parseProp],\n )\n\n const format = useCallback(\n (value: string | number) => (formatProp?.(value) ?? value).toString(),\n [formatProp],\n )\n\n const increment = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.increment(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const decrement = useCallback(\n (step = stepProp ?? 1) => {\n if (isInteractive) counter.decrement(step)\n },\n [isInteractive, counter, stepProp],\n )\n\n const validateAndClamp = useCallback(() => {\n let next = value as string | number\n\n if (value === \"\") return\n\n const valueStartsWithE = /^[eE]/.test(value.toString())\n\n if (valueStartsWithE) {\n setValue(\"\")\n } else {\n if (valueAsNumber < min) next = min\n\n if (valueAsNumber > max) next = max\n\n cast(next)\n }\n }, [cast, max, min, setValue, value, valueAsNumber])\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if ((ev.nativeEvent as InputEvent).isComposing) return\n\n const parsedInput = parse(ev.currentTarget.value)\n\n update(sanitize(parsedInput))\n\n inputSelectionRef.current = {\n start: ev.currentTarget.selectionStart,\n end: ev.currentTarget.selectionEnd,\n }\n },\n [parse, update, sanitize],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.nativeEvent.isComposing) return\n\n if (!isValidNumericKeyboardEvent(ev, isValidCharacter))\n ev.preventDefault()\n\n const step = getStep(ev) * (stepProp ?? 1)\n\n const keyMap: Record<string, KeyboardEventHandler> = {\n ArrowUp: () => increment(step),\n ArrowDown: () => decrement(step),\n Home: () => update(min),\n End: () => update(max),\n }\n\n const action = keyMap[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n action(ev)\n },\n [decrement, increment, isValidCharacter, max, min, stepProp, update],\n )\n\n const { up, down, stop, isSpinning } = useSpinner(increment, decrement)\n\n useAttributeObserver(incrementRef, [\"disabled\"], isSpinning, stop)\n useAttributeObserver(decrementRef, [\"disabled\"], isSpinning, stop)\n\n const focusInput = useCallback(() => {\n if (focusInputOnChange)\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n }, [focusInputOnChange])\n\n const eventUp = useCallback(\n (ev: any) => {\n ev.preventDefault()\n up()\n focusInput()\n },\n [focusInput, up],\n )\n\n const eventDown = useCallback(\n (ev: any) => {\n ev.preventDefault()\n down()\n focusInput()\n },\n [focusInput, down],\n )\n\n useUpdateEffect(() => {\n if (valueAsNumber > max) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n } else if (valueAsNumber < min) {\n onInvalid?.(\"rangeOverflow\", format(value), valueAsNumber)\n }\n }, [valueAsNumber, value, format, onInvalid])\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n const notInSync = inputRef.current.value != value\n\n if (!notInSync) return\n\n const parsedInput = parse(inputRef.current.value)\n\n setValue(sanitize(parsedInput))\n }, [parse, sanitize])\n\n useEventListener(\n () => inputRef.current,\n \"wheel\",\n (ev) => {\n const ownerDocument = inputRef.current?.ownerDocument ?? document\n const isFocused = ownerDocument.activeElement === inputRef.current\n\n if (!allowMouseWheel || !isFocused) return\n\n ev.preventDefault()\n\n const step = getStep(ev as any) * (stepProp ?? 1)\n const direction = Math.sign(ev.deltaY)\n\n if (direction === -1) {\n increment(step)\n } else if (direction === 1) {\n decrement(step)\n }\n },\n { passive: false },\n )\n\n const getInputProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n id,\n name,\n type: \"text\",\n role: \"spinbutton\",\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n ...formControlProps,\n ...props,\n min,\n max,\n step: stepProp,\n ref: mergeRefs(inputRef, ref),\n value: format(value),\n \"aria-valuemin\": min,\n \"aria-valuemax\": max,\n \"aria-valuenow\": Number.isNaN(valueAsNumber) ? undefined : valueAsNumber,\n \"aria-valuetext\": valueText,\n \"aria-invalid\": ariaAttr(isInvalid ?? isOut),\n autoComplete: \"off\",\n autoCorrect: \"off\",\n onChange: handlerAll(props.onChange, onChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onFocus: handlerAll(props.onFocus, onFocus),\n onBlur: handlerAll(props.onBlur, onBlur),\n }),\n [\n id,\n name,\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n formControlProps,\n min,\n max,\n stepProp,\n format,\n value,\n valueAsNumber,\n valueText,\n isInvalid,\n isOut,\n onChange,\n onKeyDown,\n onFocus,\n onBlur,\n ],\n )\n\n const getIncrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMax)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, incrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventUp(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMax,\n required,\n readOnly,\n formControlProps,\n stop,\n eventUp,\n ],\n )\n\n const getDecrementProps: PropGetter = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMin)\n\n return {\n required,\n readOnly,\n disabled: trulyDisabled,\n ...formControlProps,\n ...props,\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\n ref: mergeRefs(ref, decrementRef),\n role: \"button\",\n tabIndex: -1,\n onPointerDown: handlerAll(props.onPointerDown, (ev) => {\n if (ev.button === 0 && !trulyDisabled) eventDown(ev)\n }),\n onPointerLeave: handlerAll(props.onPointerLeave, stop),\n onPointerUp: handlerAll(props.onPointerUp, stop),\n }\n },\n [\n disabled,\n keepWithinRange,\n isMin,\n required,\n readOnly,\n formControlProps,\n stop,\n eventDown,\n ],\n )\n\n return {\n props: rest,\n value: format(value),\n valueAsNumber,\n isFocused,\n isRequired,\n isReadOnly,\n isDisabled,\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n\nconst INTERVAL = 50\n\nconst DELAY = 300\n\ntype Action = \"increment\" | \"decrement\"\n\nconst useSpinner = (increment: Function, decrement: Function) => {\n const [isSpinning, setIsSpinning] = useState(false)\n const [action, setAction] = useState<Action | null>(null)\n const [isOnce, setIsOnce] = useState(true)\n const timeoutRef = useRef<any>(null)\n\n const removeTimeout = () => clearTimeout(timeoutRef.current)\n\n useInterval(\n () => {\n if (action === \"increment\") increment()\n\n if (action === \"decrement\") decrement()\n },\n isSpinning ? INTERVAL : null,\n )\n\n const up = useCallback(() => {\n if (isOnce) increment()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"increment\")\n }, DELAY)\n }, [increment, isOnce])\n\n const down = useCallback(() => {\n if (isOnce) decrement()\n\n timeoutRef.current = setTimeout(() => {\n setIsOnce(false)\n setIsSpinning(true)\n setAction(\"decrement\")\n }, DELAY)\n }, [decrement, isOnce])\n\n const stop = useCallback(() => {\n setIsOnce(true)\n setIsSpinning(false)\n removeTimeout()\n }, [])\n\n useEffect(() => {\n return () => removeTimeout()\n }, [])\n\n return { up, down, stop, isSpinning }\n}\n\nconst useAttributeObserver = (\n ref: React.RefObject<HTMLElement | null>,\n attributeFilter: string[],\n enabled: boolean,\n func: () => void,\n) => {\n useEffect(() => {\n if (!ref.current || !enabled) return\n\n const ownerDocument = ref.current.ownerDocument.defaultView ?? window\n\n const observer = new ownerDocument.MutationObserver((changes) => {\n for (const { type, attributeName } of changes) {\n if (\n type === \"attributes\" &&\n attributeName &&\n attributeFilter.includes(attributeName)\n )\n func()\n }\n })\n\n observer.observe(ref.current, { attributes: true, attributeFilter })\n\n return () => observer.disconnect()\n })\n}\n\ntype NumberInputOptions = {\n /**\n * If `true`, display the addon for the number input.\n */\n isStepper?: boolean\n /**\n * Props for container element.\n */\n containerProps?: HTMLUIProps<\"div\">\n /**\n * Props for addon component.\n */\n addonProps?: HTMLUIProps<\"div\">\n /**\n * Props for increment component.\n */\n incrementProps?: NumberIncrementStepperProps\n /**\n * Props for decrement component.\n */\n decrementProps?: NumberDecrementStepperProps\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n}\n\nexport type NumberInputProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\" | \"onChange\"\n> &\n ThemeProps<\"NumberInput\"> &\n Omit<UseNumberInputProps, \"disabled\" | \"required\" | \"readOnly\"> &\n NumberInputOptions\n\ntype NumberInputContext = {\n getInputProps: PropGetter\n getIncrementProps: PropGetter\n getDecrementProps: PropGetter\n styles: Record<string, CSSUIObject>\n}\n\nconst [NumberInputContextProvider, useNumberInputContext] =\n createContext<NumberInputContext>({\n strict: false,\n name: \"NumberInputContext\",\n })\n\n/**\n * `NumberInput` is a component used to obtain numeric input from the user.\n *\n * @see Docs https://yamada-ui.com/components/forms/number-input\n */\nexport const NumberInput = forwardRef<NumberInputProps, \"input\">(\n (props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"NumberInput\", props)\n const {\n className,\n isStepper = true,\n containerProps,\n addonProps,\n incrementProps,\n decrementProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n const {\n getInputProps,\n getIncrementProps,\n getDecrementProps,\n props: rest,\n } = useNumberInput(computedProps)\n\n const css: CSSUIObject = {\n position: \"relative\",\n zIndex: 0,\n ...styles.container,\n }\n\n return (\n <NumberInputContextProvider\n value={{ getInputProps, getIncrementProps, getDecrementProps, styles }}\n >\n <ui.div\n className={cx(\"ui-number-input\", className)}\n __css={css}\n {...containerProps}\n >\n <NumberInputField\n {...getInputProps(rest as DOMAttributes<HTMLElement>, ref)}\n />\n\n {isStepper ? (\n <NumberInputAddon {...addonProps}>\n <NumberIncrementStepper {...incrementProps} />\n <NumberDecrementStepper {...decrementProps} />\n </NumberInputAddon>\n ) : null}\n </ui.div>\n </NumberInputContextProvider>\n )\n },\n)\n\ntype NumberInputFieldProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"required\" | \"readOnly\" | \"size\"\n>\n\nconst NumberInputField = forwardRef<NumberInputFieldProps, \"input\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n width: \"100%\",\n ...styles.field,\n }\n\n return (\n <ui.input\n ref={ref}\n className={cx(\"ui-number-input__field\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype NumberInputAddonProps = HTMLUIProps<\"div\">\n\nconst NumberInputAddon = forwardRef<NumberInputAddonProps, \"div\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useNumberInputContext()\n\n const css: CSSUIObject = {\n display: \"flex\",\n flexDirection: \"column\",\n position: \"absolute\",\n top: \"0\",\n insetEnd: \"0px\",\n margin: \"1px\",\n height: \"calc(100% - 2px)\",\n zIndex: \"fallback(yamcha, 1)\",\n ...styles.addon,\n }\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-number-input__addon\", className)}\n aria-hidden\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst Stepper = ui(\"div\", {\n baseStyle: {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n flex: 1,\n transitionProperty: \"common\",\n transitionDuration: \"normal\",\n userSelect: \"none\",\n cursor: \"pointer\",\n lineHeight: \"normal\",\n },\n})\n\ntype NumberIncrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberIncrementStepper = forwardRef<NumberIncrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getIncrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--up\", className)}\n {...getIncrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n </Stepper>\n )\n },\n)\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"div\">\n\nconst NumberDecrementStepper = forwardRef<NumberDecrementStepperProps, \"div\">(\n ({ className, children, ...rest }, ref) => {\n const { getDecrementProps, styles } = useNumberInputContext()\n\n const css: CSSUIObject = { ...styles.stepper }\n\n return (\n <Stepper\n className={cx(\"ui-number-input__stepper--down\", className)}\n {...getDecrementProps(rest as DOMAttributes<HTMLElement>, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon />}\n </Stepper>\n )\n },\n)\n"],"mappings":"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","names":["value","isFocused","props"]}