@yamada-ui/number-input 1.2.4-dev-20241214144625 → 1.2.4

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.
Files changed (12) hide show
  1. package/dist/{chunk-MZV5BX62.mjs → chunk-OW4A5AQU.mjs} +69 -55
  2. package/dist/chunk-OW4A5AQU.mjs.map +1 -0
  3. package/dist/index.js +68 -54
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +1 -1
  6. package/dist/number-input.d.mts +14 -9
  7. package/dist/number-input.d.ts +14 -9
  8. package/dist/number-input.js +68 -54
  9. package/dist/number-input.js.map +1 -1
  10. package/dist/number-input.mjs +1 -1
  11. package/package.json +8 -8
  12. package/dist/chunk-MZV5BX62.mjs.map +0 -1
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 ColorModeToken,\n CSS,\n CSSUIObject,\n HTMLUIProps,\n PropGetter,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { UseFormControlProps } from \"@yamada-ui/form-control\"\nimport type { UseCounterProps } from \"@yamada-ui/use-counter\"\nimport type {\n ChangeEvent,\n InputHTMLAttributes,\n KeyboardEvent,\n KeyboardEventHandler,\n} from \"react\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { ChevronIcon } from \"@yamada-ui/icon\"\nimport { useCounter } from \"@yamada-ui/use-counter\"\nimport { useEventListener } from \"@yamada-ui/use-event-listener\"\nimport { useInterval } from \"@yamada-ui/use-interval\"\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 { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\n\nconst isDefaultValidCharacter = (character: string) =>\n /^[Ee0-9+\\-.]$/.test(character)\n\nconst isValidNumericKeyboardEvent = (\n { key, altKey, ctrlKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\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 metaKey,\n shiftKey,\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 = \"rangeOverflow\" | \"rangeUnderflow\"\n\nexport interface UseNumberInputProps\n extends UseFormControlProps<HTMLInputElement>,\n UseCounterProps {\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: 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 will be focused as you increment or decrement the value with the stepper.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: number | string) => number | string\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: number | string) => string | undefined\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 * 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 * @deprecated Use `validCharacter` instead.\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 * 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 * 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 validCharacter?: (value: string) => 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\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n let {\n id,\n name,\n allowMouseWheel,\n clampValueOnBlur = true,\n defaultValue,\n focusInputOnChange = true,\n format: formatProp,\n getAriaValueText: getAriaValueTextProp,\n inputMode = \"decimal\",\n isValidCharacter: isValidCharacterProp,\n keepWithinRange = true,\n max = Number.MAX_SAFE_INTEGER,\n min = Number.MIN_SAFE_INTEGER,\n parse: parseProp,\n pattern = \"[0-9]*(.[0-9]+)?\",\n precision,\n step: stepProp,\n validCharacter,\n value: valueProp,\n onChange: onChangeProp,\n onInvalid: onInvalidProp,\n ...rest\n } = useFormControlProps(props)\n const {\n \"aria-invalid\": isInvalid,\n disabled,\n readOnly,\n required,\n onBlur: onBlurProp,\n onFocus: onFocusProp,\n ...formControlProps\n } = pickObject(rest, formControlProperties)\n\n validCharacter ??= isValidCharacterProp\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 end: null | number\n start: null | number\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 validCharacter ?? isDefaultValidCharacter,\n )\n\n const {\n cast,\n isMax,\n isMin,\n isOut,\n setValue,\n update,\n value,\n valueAsNumber,\n ...counter\n } = useCounter({\n defaultValue,\n keepWithinRange,\n max,\n min,\n precision,\n step: stepProp,\n value: valueProp,\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: number | string) => (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 number | string\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 end: ev.currentTarget.selectionEnd,\n start: ev.currentTarget.selectionStart,\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: { [key: string]: KeyboardEventHandler } = {\n ArrowDown: () => decrement(step),\n ArrowUp: () => increment(step),\n End: () => update(max),\n Home: () => update(min),\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 { down, isSpinning, stop, up } = 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<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n id,\n type: \"text\",\n name,\n disabled,\n inputMode,\n pattern,\n readOnly,\n required,\n role: \"spinbutton\",\n ...formControlProps,\n ...props,\n ref: mergeRefs(inputRef, ref),\n \"aria-invalid\": ariaAttr(isInvalid ?? isOut),\n \"aria-valuemax\": max,\n \"aria-valuemin\": min,\n \"aria-valuenow\": Number.isNaN(valueAsNumber) ? undefined : valueAsNumber,\n \"aria-valuetext\": valueText,\n autoComplete: \"off\",\n autoCorrect: \"off\",\n max,\n min,\n step: stepProp,\n value: format(value),\n onBlur: handlerAll(props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(props.onFocus, onFocus),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\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<\"button\"> = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMax)\n\n return {\n \"aria-label\": \"Increase\",\n disabled: trulyDisabled,\n readOnly,\n required,\n ...formControlProps,\n ...props,\n ref: mergeRefs(ref, incrementRef),\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\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<\"button\"> = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && isMin)\n\n return {\n \"aria-label\": \"Decrease\",\n disabled: trulyDisabled,\n readOnly,\n required,\n ...formControlProps,\n ...props,\n ref: mergeRefs(ref, decrementRef),\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\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 isDisabled,\n isFocused,\n isReadOnly,\n isRequired,\n props: rest,\n value: format(value),\n valueAsNumber,\n getDecrementProps,\n getIncrementProps,\n getInputProps,\n }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n\nconst INTERVAL = 50\n\nconst DELAY = 300\n\ntype Action = \"decrement\" | \"increment\"\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 { down, isSpinning, stop, up }\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, { attributeFilter, attributes: true })\n\n return () => observer.disconnect()\n })\n}\n\ninterface NumberInputOptions {\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the addon for the number input.\n *\n * @deprecated Use `stepper` instead.\n */\n isStepper?: boolean\n /**\n * If `true`, display the addon for the number input.\n */\n stepper?: boolean\n /**\n * Props for addon component.\n */\n addonProps?: HTMLUIProps\n /**\n * Props for container element.\n */\n containerProps?: HTMLUIProps\n /**\n * Props for decrement component.\n */\n decrementProps?: NumberDecrementStepperProps\n /**\n * Props for increment component.\n */\n incrementProps?: NumberIncrementStepperProps\n}\n\nexport interface NumberInputProps\n extends Omit<\n HTMLUIProps<\"input\">,\n | \"defaultValue\"\n | \"disabled\"\n | \"max\"\n | \"min\"\n | \"onChange\"\n | \"onInvalid\"\n | \"readOnly\"\n | \"required\"\n | \"size\"\n | \"step\"\n | \"value\"\n >,\n ThemeProps<\"NumberInput\">,\n Omit<UseNumberInputProps, \"disabled\" | \"readOnly\" | \"required\">,\n NumberInputOptions {}\n\ninterface NumberInputContext {\n styles: { [key: string]: CSSUIObject | undefined }\n getDecrementProps: PropGetter<\"button\">\n getIncrementProps: PropGetter<\"button\">\n getInputProps: PropGetter<\"input\">\n}\n\nconst [NumberInputContextProvider, useNumberInputContext] =\n createContext<NumberInputContext>({\n name: \"NumberInputContext\",\n errorMessage: `useNumberInputContext returned is 'undefined'. Seems you forgot to wrap the components in \"<NumberInput />\"`,\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] = useComponentMultiStyle(\"NumberInput\", props)\n let {\n className,\n isStepper = true,\n stepper,\n addonProps,\n containerProps,\n decrementProps,\n incrementProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n const {\n props: rest,\n getDecrementProps,\n getIncrementProps,\n getInputProps,\n } = useNumberInput(computedProps)\n\n stepper ??= isStepper\n\n const css: CSSUIObject = {\n position: \"relative\",\n zIndex: 0,\n ...styles.container,\n }\n\n return (\n <NumberInputContextProvider\n value={{ styles, getDecrementProps, getIncrementProps, getInputProps }}\n >\n <ui.div\n className={cx(\"ui-number-input\", className)}\n role=\"group\"\n __css={css}\n {...containerProps}\n >\n <NumberInputField {...getInputProps(rest, ref)} />\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\nNumberInput.displayName = \"NumberInput\"\nNumberInput.__ui__ = \"NumberInput\"\n\ntype NumberInputFieldProps = Omit<\n HTMLUIProps<\"input\">,\n \"disabled\" | \"readOnly\" | \"required\" | \"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\nNumberInputField.displayName = \"NumberInputField\"\nNumberInputField.__ui__ = \"NumberInputField\"\n\ntype NumberInputAddonProps = HTMLUIProps\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 height: \"calc(100% - 2px)\",\n insetEnd: \"0px\",\n margin: \"1px\",\n position: \"absolute\",\n top: \"0\",\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\nNumberInputAddon.displayName = \"NumberInputAddon\"\nNumberInputAddon.__ui__ = \"NumberInputAddon\"\n\nconst Stepper = ui(\"button\", {\n baseStyle: {\n alignItems: \"center\",\n cursor: \"pointer\",\n display: \"flex\",\n flex: 1,\n justifyContent: \"center\",\n lineHeight: \"normal\",\n transitionDuration: \"normal\",\n transitionProperty: \"common\",\n userSelect: \"none\",\n },\n})\n\ntype NumberIncrementStepperProps = HTMLUIProps<\"button\">\n\nconst NumberIncrementStepper = forwardRef<\n NumberIncrementStepperProps,\n \"button\"\n>(({ className, children, ...rest }, ref) => {\n const { styles, getIncrementProps } = 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, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n </Stepper>\n )\n})\n\nNumberIncrementStepper.displayName = \"NumberIncrementStepper\"\nNumberIncrementStepper.__ui__ = \"NumberIncrementStepper\"\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"button\">\n\nconst NumberDecrementStepper = forwardRef<\n NumberDecrementStepperProps,\n \"button\"\n>(({ className, children, ...rest }, ref) => {\n const { styles, getDecrementProps } = 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, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon />}\n </Stepper>\n )\n})\n\nNumberDecrementStepper.displayName = \"NumberDecrementStepper\"\nNumberDecrementStepper.__ui__ = \"NumberDecrementStepper\"\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 ColorModeToken,\n CSS,\n CSSUIObject,\n HTMLUIProps,\n PropGetter,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { UseFormControlProps } from \"@yamada-ui/form-control\"\nimport type { UseCounterProps } from \"@yamada-ui/use-counter\"\nimport type {\n ChangeEvent,\n InputHTMLAttributes,\n KeyboardEvent,\n KeyboardEventHandler,\n} from \"react\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { ChevronIcon } from \"@yamada-ui/icon\"\nimport { useCounter } from \"@yamada-ui/use-counter\"\nimport { useEventListener } from \"@yamada-ui/use-event-listener\"\nimport { useInterval } from \"@yamada-ui/use-interval\"\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 { useCallback, useEffect, useMemo, useRef, useState } from \"react\"\n\nconst isDefaultValidCharacter = (character: string) =>\n /^[Ee0-9+\\-.]$/.test(character)\n\nconst isValidNumericKeyboardEvent = (\n { key, altKey, ctrlKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\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 metaKey,\n shiftKey,\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 = \"rangeOverflow\" | \"rangeUnderflow\"\n\nexport interface UseNumberInputProps\n extends UseFormControlProps<HTMLInputElement>,\n UseCounterProps {\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: 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 will be focused as you increment or decrement the value with the stepper.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: number | string) => number | string\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: number | string) => string | undefined\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 * 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 * 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 * The callback invoked when invalid number is entered.\n */\n onInvalid?: (\n message: ValidityState,\n value: string,\n valueAsNumber: number,\n ) => void\n}\n\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n const {\n id,\n name,\n allowMouseWheel,\n clampValueOnBlur = true,\n defaultValue,\n focusInputOnChange = true,\n format: formatProp,\n getAriaValueText: getAriaValueTextProp,\n inputMode = \"decimal\",\n isValidCharacter: isValidCharacterProp,\n keepWithinRange = true,\n max: maxValue = Number.MAX_SAFE_INTEGER,\n min: minValue = Number.MIN_SAFE_INTEGER,\n parse: parseProp,\n pattern = \"[0-9]*(.[0-9]+)?\",\n precision,\n step: stepProp,\n value: valueProp,\n onChange: onChangeProp,\n onInvalid: onInvalidProp,\n ...rest\n } = useFormControlProps(props)\n const {\n \"aria-invalid\": invalid,\n disabled,\n readOnly,\n required,\n onBlur: onBlurProp,\n onFocus: onFocusProp,\n ...formControlProps\n } = pickObject(rest, formControlProperties)\n const [focused, setFocused] = useState(false)\n const interactive = !(readOnly || disabled)\n const inputRef = useRef<HTMLInputElement>(null)\n const inputSelectionRef = useRef<{\n end: null | number\n start: null | number\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 cast,\n max,\n min,\n out,\n setValue,\n update,\n value,\n valueAsNumber,\n ...counter\n } = useCounter({\n defaultValue,\n keepWithinRange,\n max: maxValue,\n min: minValue,\n precision,\n step: stepProp,\n value: valueProp,\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: number | string) => (formatProp?.(value) ?? value).toString(),\n [formatProp],\n )\n\n const increment = useCallback(\n (step = stepProp ?? 1) => {\n if (interactive) counter.increment(step)\n },\n [interactive, counter, stepProp],\n )\n\n const decrement = useCallback(\n (step = stepProp ?? 1) => {\n if (interactive) counter.decrement(step)\n },\n [interactive, counter, stepProp],\n )\n\n const validateAndClamp = useCallback(() => {\n let nextValue = value as number | string\n\n if (value === \"\") return\n\n const valueStartsWithE = /^[eE]/.test(value.toString())\n\n if (valueStartsWithE) {\n setValue(\"\")\n } else {\n if (valueAsNumber < minValue) nextValue = minValue\n\n if (valueAsNumber > maxValue) nextValue = maxValue\n\n cast(nextValue)\n }\n }, [cast, maxValue, minValue, 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 end: ev.currentTarget.selectionEnd,\n start: ev.currentTarget.selectionStart,\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: { [key: string]: KeyboardEventHandler } = {\n ArrowDown: () => decrement(step),\n ArrowUp: () => increment(step),\n End: () => update(maxValue),\n Home: () => update(minValue),\n }\n\n const action = keyMap[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n action(ev)\n },\n [\n decrement,\n increment,\n isValidCharacter,\n maxValue,\n minValue,\n stepProp,\n update,\n ],\n )\n\n const { down, isSpinning, stop, up } = 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 > maxValue) {\n onInvalid(\"rangeOverflow\", format(value), valueAsNumber)\n } else if (valueAsNumber < minValue) {\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 focused = ownerDocument.activeElement === inputRef.current\n\n if (!allowMouseWheel || !focused) 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<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n id,\n type: \"text\",\n name,\n disabled,\n inputMode,\n pattern,\n readOnly,\n required,\n role: \"spinbutton\",\n ...formControlProps,\n ...props,\n ref: mergeRefs(inputRef, ref),\n \"aria-invalid\": ariaAttr(invalid ?? out),\n \"aria-valuemax\": maxValue,\n \"aria-valuemin\": minValue,\n \"aria-valuenow\": Number.isNaN(valueAsNumber) ? undefined : valueAsNumber,\n \"aria-valuetext\": valueText,\n autoComplete: \"off\",\n autoCorrect: \"off\",\n max: maxValue,\n min: minValue,\n step: stepProp,\n value: format(value),\n onBlur: handlerAll(props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(props.onFocus, onFocus),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n id,\n name,\n inputMode,\n pattern,\n required,\n disabled,\n readOnly,\n formControlProps,\n maxValue,\n minValue,\n stepProp,\n format,\n value,\n valueAsNumber,\n valueText,\n invalid,\n out,\n onChange,\n onKeyDown,\n onFocus,\n onBlur,\n ],\n )\n\n const getIncrementProps: PropGetter<\"button\"> = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && max)\n\n return {\n \"aria-label\": \"Increase\",\n disabled: trulyDisabled,\n readOnly,\n required,\n ...formControlProps,\n ...props,\n ref: mergeRefs(ref, incrementRef),\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\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 max,\n required,\n readOnly,\n formControlProps,\n stop,\n eventUp,\n ],\n )\n\n const getDecrementProps: PropGetter<\"button\"> = useCallback(\n (props = {}, ref = null) => {\n const trulyDisabled = disabled || (keepWithinRange && min)\n\n return {\n \"aria-label\": \"Decrease\",\n disabled: trulyDisabled,\n readOnly,\n required,\n ...formControlProps,\n ...props,\n ref: mergeRefs(ref, decrementRef),\n style: {\n ...props.style,\n cursor: readOnly ? \"not-allowed\" : props.style?.cursor,\n },\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 min,\n required,\n readOnly,\n formControlProps,\n stop,\n eventDown,\n ],\n )\n\n return {\n disabled,\n focused,\n /**\n * @deprecated Use `disabled` instead.\n */\n isDisabled: disabled,\n /**\n * @deprecated Use `readOnly` instead.\n */\n isReadOnly: readOnly,\n /**\n * @deprecated Use `required` instead.\n */\n isRequired: required,\n props: rest,\n readOnly,\n required,\n value: format(value),\n valueAsNumber,\n getDecrementProps,\n getIncrementProps,\n getInputProps,\n }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n\nconst INTERVAL = 50\n\nconst DELAY = 300\n\ntype Action = \"decrement\" | \"increment\"\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 { down, isSpinning, stop, up }\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, { attributeFilter, attributes: true })\n\n return () => observer.disconnect()\n })\n}\n\ninterface NumberInputOptions {\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: ColorModeToken<CSS.Property.BorderColor, \"colors\">\n /**\n * If `true`, display the addon for the number input.\n *\n * @deprecated Use `stepper` instead.\n */\n isStepper?: boolean\n /**\n * If `true`, display the addon for the number input.\n */\n stepper?: boolean\n /**\n * Props for addon component.\n */\n addonProps?: HTMLUIProps\n /**\n * Props for container element.\n */\n containerProps?: HTMLUIProps\n /**\n * Props for decrement component.\n */\n decrementProps?: NumberDecrementStepperProps\n /**\n * Props for increment component.\n */\n incrementProps?: NumberIncrementStepperProps\n}\n\nexport interface NumberInputProps\n extends Omit<\n HTMLUIProps<\"input\">,\n | \"defaultValue\"\n | \"max\"\n | \"min\"\n | \"onChange\"\n | \"onInvalid\"\n | \"size\"\n | \"step\"\n | \"value\"\n >,\n ThemeProps<\"NumberInput\">,\n UseNumberInputProps,\n NumberInputOptions {}\n\ninterface NumberInputContext {\n styles: { [key: string]: CSSUIObject | undefined }\n getDecrementProps: PropGetter<\"button\">\n getIncrementProps: PropGetter<\"button\">\n getInputProps: PropGetter<\"input\">\n}\n\nconst [NumberInputContextProvider, useNumberInputContext] =\n createContext<NumberInputContext>({\n name: \"NumberInputContext\",\n errorMessage: `useNumberInputContext returned is 'undefined'. Seems you forgot to wrap the components in \"<NumberInput />\"`,\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] = useComponentMultiStyle(\"NumberInput\", props)\n const {\n className,\n isStepper = true,\n stepper = isStepper,\n addonProps,\n containerProps,\n decrementProps,\n incrementProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n const {\n props: rest,\n getDecrementProps,\n getIncrementProps,\n getInputProps,\n } = useNumberInput(computedProps)\n const css: CSSUIObject = {\n position: \"relative\",\n zIndex: 0,\n ...styles.container,\n }\n\n return (\n <NumberInputContextProvider\n value={{ styles, getDecrementProps, getIncrementProps, getInputProps }}\n >\n <ui.div\n className={cx(\"ui-number-input\", className)}\n role=\"group\"\n __css={css}\n {...containerProps}\n >\n <NumberInputField {...getInputProps(rest, ref)} />\n\n {stepper ? (\n <NumberInputAddon {...addonProps}>\n <NumberIncrementStepper {...incrementProps} />\n <NumberDecrementStepper {...decrementProps} />\n </NumberInputAddon>\n ) : null}\n </ui.div>\n </NumberInputContextProvider>\n )\n },\n)\n\nNumberInput.displayName = \"NumberInput\"\nNumberInput.__ui__ = \"NumberInput\"\n\ntype NumberInputFieldProps = Omit<HTMLUIProps<\"input\">, \"size\">\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\nNumberInputField.displayName = \"NumberInputField\"\nNumberInputField.__ui__ = \"NumberInputField\"\n\ntype NumberInputAddonProps = HTMLUIProps\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 height: \"calc(100% - 2px)\",\n insetEnd: \"0px\",\n margin: \"1px\",\n position: \"absolute\",\n top: \"0\",\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\nNumberInputAddon.displayName = \"NumberInputAddon\"\nNumberInputAddon.__ui__ = \"NumberInputAddon\"\n\nconst Stepper = ui(\"button\", {\n baseStyle: {\n alignItems: \"center\",\n cursor: \"pointer\",\n display: \"flex\",\n flex: 1,\n justifyContent: \"center\",\n lineHeight: \"normal\",\n transitionDuration: \"normal\",\n transitionProperty: \"common\",\n userSelect: \"none\",\n },\n})\n\ntype NumberIncrementStepperProps = HTMLUIProps<\"button\">\n\nconst NumberIncrementStepper = forwardRef<\n NumberIncrementStepperProps,\n \"button\"\n>(({ className, children, ...rest }, ref) => {\n const { styles, getIncrementProps } = 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, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n </Stepper>\n )\n})\n\nNumberIncrementStepper.displayName = \"NumberIncrementStepper\"\nNumberIncrementStepper.__ui__ = \"NumberIncrementStepper\"\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"button\">\n\nconst NumberDecrementStepper = forwardRef<\n NumberDecrementStepperProps,\n \"button\"\n>(({ className, children, ...rest }, ref) => {\n const { styles, getDecrementProps } = 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, ref)}\n __css={css}\n >\n {children ?? <ChevronIcon />}\n </Stepper>\n )\n})\n\nNumberDecrementStepper.displayName = \"NumberDecrementStepper\"\nNumberDecrementStepper.__ui__ = \"NumberDecrementStepper\"\n"],"mappings":"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","names":["value","focused","props"]}
package/dist/index.mjs CHANGED
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  NumberInput,
4
4
  useNumberInput
5
- } from "./chunk-MZV5BX62.mjs";
5
+ } from "./chunk-OW4A5AQU.mjs";
6
6
  export {
7
7
  NumberInput,
8
8
  useNumberInput
package/dist/number-input.d.mts CHANGED
@@ -52,8 +52,6 @@ interface UseNumberInputProps extends UseFormControlProps<HTMLInputElement>, Use
52
52
  /**
53
53
  * Whether the pressed key should be allowed in the input.
54
54
  * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\-.]$/.
55
- *
56
- * @deprecated Use `validCharacter` instead.
57
55
  */
58
56
  isValidCharacter?: (value: string) => boolean;
59
57
  /**
@@ -66,20 +64,25 @@ interface UseNumberInputProps extends UseFormControlProps<HTMLInputElement>, Use
66
64
  * @default '[0-9]*(.[0-9]+)?'
67
65
  */
68
66
  pattern?: InputHTMLAttributes<any>["pattern"];
69
- /**
70
- * Whether the pressed key should be allowed in the input.
71
- * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\-.]$/.
72
- */
73
- validCharacter?: (value: string) => boolean;
74
67
  /**
75
68
  * The callback invoked when invalid number is entered.
76
69
  */
77
70
  onInvalid?: (message: ValidityState, value: string, valueAsNumber: number) => void;
78
71
  }
79
72
  declare const useNumberInput: (props?: UseNumberInputProps) => {
73
+ disabled: boolean | undefined;
74
+ focused: boolean;
75
+ /**
76
+ * @deprecated Use `disabled` instead.
77
+ */
80
78
  isDisabled: boolean | undefined;
81
- isFocused: boolean;
79
+ /**
80
+ * @deprecated Use `readOnly` instead.
81
+ */
82
82
  isReadOnly: boolean | undefined;
83
+ /**
84
+ * @deprecated Use `required` instead.
85
+ */
83
86
  isRequired: boolean | undefined;
84
87
  props: {
85
88
  _active?: {} | undefined;
@@ -98,6 +101,8 @@ declare const useNumberInput: (props?: UseNumberInputProps) => {
98
101
  onBlur: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
99
102
  onFocus: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
100
103
  };
104
+ readOnly: boolean | undefined;
105
+ required: boolean | undefined;
101
106
  value: string;
102
107
  valueAsNumber: number;
103
108
  getDecrementProps: PropGetter<"button", undefined>;
@@ -141,7 +146,7 @@ interface NumberInputOptions {
141
146
  */
142
147
  incrementProps?: NumberIncrementStepperProps;
143
148
  }
144
- interface NumberInputProps extends Omit<HTMLUIProps<"input">, "defaultValue" | "disabled" | "max" | "min" | "onChange" | "onInvalid" | "readOnly" | "required" | "size" | "step" | "value">, ThemeProps<"NumberInput">, Omit<UseNumberInputProps, "disabled" | "readOnly" | "required">, NumberInputOptions {
149
+ interface NumberInputProps extends Omit<HTMLUIProps<"input">, "defaultValue" | "max" | "min" | "onChange" | "onInvalid" | "size" | "step" | "value">, ThemeProps<"NumberInput">, UseNumberInputProps, NumberInputOptions {
145
150
  }
146
151
  /**
147
152
  * `NumberInput` is a component used to obtain numeric input from the user.
package/dist/number-input.d.ts CHANGED
@@ -52,8 +52,6 @@ interface UseNumberInputProps extends UseFormControlProps<HTMLInputElement>, Use
52
52
  /**
53
53
  * Whether the pressed key should be allowed in the input.
54
54
  * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\-.]$/.
55
- *
56
- * @deprecated Use `validCharacter` instead.
57
55
  */
58
56
  isValidCharacter?: (value: string) => boolean;
59
57
  /**
@@ -66,20 +64,25 @@ interface UseNumberInputProps extends UseFormControlProps<HTMLInputElement>, Use
66
64
  * @default '[0-9]*(.[0-9]+)?'
67
65
  */
68
66
  pattern?: InputHTMLAttributes<any>["pattern"];
69
- /**
70
- * Whether the pressed key should be allowed in the input.
71
- * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\-.]$/.
72
- */
73
- validCharacter?: (value: string) => boolean;
74
67
  /**
75
68
  * The callback invoked when invalid number is entered.
76
69
  */
77
70
  onInvalid?: (message: ValidityState, value: string, valueAsNumber: number) => void;
78
71
  }
79
72
  declare const useNumberInput: (props?: UseNumberInputProps) => {
73
+ disabled: boolean | undefined;
74
+ focused: boolean;
75
+ /**
76
+ * @deprecated Use `disabled` instead.
77
+ */
80
78
  isDisabled: boolean | undefined;
81
- isFocused: boolean;
79
+ /**
80
+ * @deprecated Use `readOnly` instead.
81
+ */
82
82
  isReadOnly: boolean | undefined;
83
+ /**
84
+ * @deprecated Use `required` instead.
85
+ */
83
86
  isRequired: boolean | undefined;
84
87
  props: {
85
88
  _active?: {} | undefined;
@@ -98,6 +101,8 @@ declare const useNumberInput: (props?: UseNumberInputProps) => {
98
101
  onBlur: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
99
102
  onFocus: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
100
103
  };
104
+ readOnly: boolean | undefined;
105
+ required: boolean | undefined;
101
106
  value: string;
102
107
  valueAsNumber: number;
103
108
  getDecrementProps: PropGetter<"button", undefined>;
@@ -141,7 +146,7 @@ interface NumberInputOptions {
141
146
  */
142
147
  incrementProps?: NumberIncrementStepperProps;
143
148
  }
144
- interface NumberInputProps extends Omit<HTMLUIProps<"input">, "defaultValue" | "disabled" | "max" | "min" | "onChange" | "onInvalid" | "readOnly" | "required" | "size" | "step" | "value">, ThemeProps<"NumberInput">, Omit<UseNumberInputProps, "disabled" | "readOnly" | "required">, NumberInputOptions {
149
+ interface NumberInputProps extends Omit<HTMLUIProps<"input">, "defaultValue" | "max" | "min" | "onChange" | "onInvalid" | "size" | "step" | "value">, ThemeProps<"NumberInput">, UseNumberInputProps, NumberInputOptions {
145
150
  }
146
151
  /**
147
152
  * `NumberInput` is a component used to obtain numeric input from the user.
package/dist/number-input.js CHANGED
@@ -52,7 +52,7 @@ var getStep = ({
52
52
  return ratio;
53
53
  };
54
54
  var useNumberInput = (props = {}) => {
55
- let {
55
+ const {
56
56
  id,
57
57
  name,
58
58
  allowMouseWheel,
@@ -64,20 +64,19 @@ var useNumberInput = (props = {}) => {
64
64
  inputMode = "decimal",
65
65
  isValidCharacter: isValidCharacterProp,
66
66
  keepWithinRange = true,
67
- max = Number.MAX_SAFE_INTEGER,
68
- min = Number.MIN_SAFE_INTEGER,
67
+ max: maxValue = Number.MAX_SAFE_INTEGER,
68
+ min: minValue = Number.MIN_SAFE_INTEGER,
69
69
  parse: parseProp,
70
70
  pattern = "[0-9]*(.[0-9]+)?",
71
71
  precision,
72
72
  step: stepProp,
73
- validCharacter,
74
73
  value: valueProp,
75
74
  onChange: onChangeProp,
76
75
  onInvalid: onInvalidProp,
77
76
  ...rest
78
77
  } = (0, import_form_control.useFormControlProps)(props);
79
78
  const {
80
- "aria-invalid": isInvalid,
79
+ "aria-invalid": invalid,
81
80
  disabled,
82
81
  readOnly,
83
82
  required,
@@ -85,12 +84,8 @@ var useNumberInput = (props = {}) => {
85
84
  onFocus: onFocusProp,
86
85
  ...formControlProps
87
86
  } = (0, import_utils.pickObject)(rest, import_form_control.formControlProperties);
88
- validCharacter != null ? validCharacter : validCharacter = isValidCharacterProp;
89
- const isRequired = required;
90
- const isReadOnly = readOnly;
91
- const isDisabled = disabled;
92
- const [isFocused, setFocused] = (0, import_react.useState)(false);
93
- const isInteractive = !(readOnly || disabled);
87
+ const [focused, setFocused] = (0, import_react.useState)(false);
88
+ const interactive = !(readOnly || disabled);
94
89
  const inputRef = (0, import_react.useRef)(null);
95
90
  const inputSelectionRef = (0, import_react.useRef)(null);
96
91
  const incrementRef = (0, import_react.useRef)(null);
@@ -113,13 +108,13 @@ var useNumberInput = (props = {}) => {
113
108
  const onInvalid = (0, import_utils.useCallbackRef)(onInvalidProp);
114
109
  const getAriaValueText = (0, import_utils.useCallbackRef)(getAriaValueTextProp);
115
110
  const isValidCharacter = (0, import_utils.useCallbackRef)(
116
- validCharacter != null ? validCharacter : isDefaultValidCharacter
111
+ isValidCharacterProp != null ? isValidCharacterProp : isDefaultValidCharacter
117
112
  );
118
113
  const {
119
114
  cast,
120
- isMax,
121
- isMin,
122
- isOut,
115
+ max,
116
+ min,
117
+ out,
123
118
  setValue,
124
119
  update,
125
120
  value,
@@ -128,8 +123,8 @@ var useNumberInput = (props = {}) => {
128
123
  } = (0, import_use_counter.useCounter)({
129
124
  defaultValue,
130
125
  keepWithinRange,
131
- max,
132
- min,
126
+ max: maxValue,
127
+ min: minValue,
133
128
  precision,
134
129
  step: stepProp,
135
130
  value: valueProp,
@@ -161,28 +156,28 @@ var useNumberInput = (props = {}) => {
161
156
  );
162
157
  const increment = (0, import_react.useCallback)(
163
158
  (step = stepProp != null ? stepProp : 1) => {
164
- if (isInteractive) counter.increment(step);
159
+ if (interactive) counter.increment(step);
165
160
  },
166
- [isInteractive, counter, stepProp]
161
+ [interactive, counter, stepProp]
167
162
  );
168
163
  const decrement = (0, import_react.useCallback)(
169
164
  (step = stepProp != null ? stepProp : 1) => {
170
- if (isInteractive) counter.decrement(step);
165
+ if (interactive) counter.decrement(step);
171
166
  },
172
- [isInteractive, counter, stepProp]
167
+ [interactive, counter, stepProp]
173
168
  );
174
169
  const validateAndClamp = (0, import_react.useCallback)(() => {
175
- let next = value;
170
+ let nextValue = value;
176
171
  if (value === "") return;
177
172
  const valueStartsWithE = /^[eE]/.test(value.toString());
178
173
  if (valueStartsWithE) {
179
174
  setValue("");
180
175
  } else {
181
- if (valueAsNumber < min) next = min;
182
- if (valueAsNumber > max) next = max;
183
- cast(next);
176
+ if (valueAsNumber < minValue) nextValue = minValue;
177
+ if (valueAsNumber > maxValue) nextValue = maxValue;
178
+ cast(nextValue);
184
179
  }
185
- }, [cast, max, min, setValue, value, valueAsNumber]);
180
+ }, [cast, maxValue, minValue, setValue, value, valueAsNumber]);
186
181
  const onChange = (0, import_react.useCallback)(
187
182
  (ev) => {
188
183
  if (ev.nativeEvent.isComposing) return;
@@ -204,15 +199,23 @@ var useNumberInput = (props = {}) => {
204
199
  const keyMap = {
205
200
  ArrowDown: () => decrement(step),
206
201
  ArrowUp: () => increment(step),
207
- End: () => update(max),
208
- Home: () => update(min)
202
+ End: () => update(maxValue),
203
+ Home: () => update(minValue)
209
204
  };
210
205
  const action = keyMap[ev.key];
211
206
  if (!action) return;
212
207
  ev.preventDefault();
213
208
  action(ev);
214
209
  },
215
- [decrement, increment, isValidCharacter, max, min, stepProp, update]
210
+ [
211
+ decrement,
212
+ increment,
213
+ isValidCharacter,
214
+ maxValue,
215
+ minValue,
216
+ stepProp,
217
+ update
218
+ ]
216
219
  );
217
220
  const { down, isSpinning, stop, up } = useSpinner(increment, decrement);
218
221
  useAttributeObserver(incrementRef, ["disabled"], isSpinning, stop);
@@ -241,9 +244,9 @@ var useNumberInput = (props = {}) => {
241
244
  [focusInput, down]
242
245
  );
243
246
  (0, import_utils.useUpdateEffect)(() => {
244
- if (valueAsNumber > max) {
247
+ if (valueAsNumber > maxValue) {
245
248
  onInvalid("rangeOverflow", format(value), valueAsNumber);
246
- } else if (valueAsNumber < min) {
249
+ } else if (valueAsNumber < minValue) {
247
250
  onInvalid("rangeOverflow", format(value), valueAsNumber);
248
251
  }
249
252
  }, [valueAsNumber, value, format, onInvalid]);
@@ -260,8 +263,8 @@ var useNumberInput = (props = {}) => {
260
263
  (ev) => {
261
264
  var _a, _b;
262
265
  const ownerDocument = (_b = (_a = inputRef.current) == null ? void 0 : _a.ownerDocument) != null ? _b : document;
263
- const isFocused2 = ownerDocument.activeElement === inputRef.current;
264
- if (!allowMouseWheel || !isFocused2) return;
266
+ const focused2 = ownerDocument.activeElement === inputRef.current;
267
+ if (!allowMouseWheel || !focused2) return;
265
268
  ev.preventDefault();
266
269
  const step = getStep(ev) * (stepProp != null ? stepProp : 1);
267
270
  const direction = Math.sign(ev.deltaY);
@@ -287,15 +290,15 @@ var useNumberInput = (props = {}) => {
287
290
  ...formControlProps,
288
291
  ...props2,
289
292
  ref: (0, import_utils.mergeRefs)(inputRef, ref),
290
- "aria-invalid": (0, import_utils.ariaAttr)(isInvalid != null ? isInvalid : isOut),
291
- "aria-valuemax": max,
292
- "aria-valuemin": min,
293
+ "aria-invalid": (0, import_utils.ariaAttr)(invalid != null ? invalid : out),
294
+ "aria-valuemax": maxValue,
295
+ "aria-valuemin": minValue,
293
296
  "aria-valuenow": Number.isNaN(valueAsNumber) ? void 0 : valueAsNumber,
294
297
  "aria-valuetext": valueText,
295
298
  autoComplete: "off",
296
299
  autoCorrect: "off",
297
- max,
298
- min,
300
+ max: maxValue,
301
+ min: minValue,
299
302
  step: stepProp,
300
303
  value: format(value),
301
304
  onBlur: (0, import_utils.handlerAll)(props2.onBlur, onBlur),
@@ -312,15 +315,15 @@ var useNumberInput = (props = {}) => {
312
315
  disabled,
313
316
  readOnly,
314
317
  formControlProps,
315
- min,
316
- max,
318
+ maxValue,
319
+ minValue,
317
320
  stepProp,
318
321
  format,
319
322
  value,
320
323
  valueAsNumber,
321
324
  valueText,
322
- isInvalid,
323
- isOut,
325
+ invalid,
326
+ out,
324
327
  onChange,
325
328
  onKeyDown,
326
329
  onFocus,
@@ -330,7 +333,7 @@ var useNumberInput = (props = {}) => {
330
333
  const getIncrementProps = (0, import_react.useCallback)(
331
334
  (props2 = {}, ref = null) => {
332
335
  var _a;
333
- const trulyDisabled = disabled || keepWithinRange && isMax;
336
+ const trulyDisabled = disabled || keepWithinRange && max;
334
337
  return {
335
338
  "aria-label": "Increase",
336
339
  disabled: trulyDisabled,
@@ -354,7 +357,7 @@ var useNumberInput = (props = {}) => {
354
357
  [
355
358
  disabled,
356
359
  keepWithinRange,
357
- isMax,
360
+ max,
358
361
  required,
359
362
  readOnly,
360
363
  formControlProps,
@@ -365,7 +368,7 @@ var useNumberInput = (props = {}) => {
365
368
  const getDecrementProps = (0, import_react.useCallback)(
366
369
  (props2 = {}, ref = null) => {
367
370
  var _a;
368
- const trulyDisabled = disabled || keepWithinRange && isMin;
371
+ const trulyDisabled = disabled || keepWithinRange && min;
369
372
  return {
370
373
  "aria-label": "Decrease",
371
374
  disabled: trulyDisabled,
@@ -389,7 +392,7 @@ var useNumberInput = (props = {}) => {
389
392
  [
390
393
  disabled,
391
394
  keepWithinRange,
392
- isMin,
395
+ min,
393
396
  required,
394
397
  readOnly,
395
398
  formControlProps,
@@ -398,11 +401,23 @@ var useNumberInput = (props = {}) => {
398
401
  ]
399
402
  );
400
403
  return {
401
- isDisabled,
402
- isFocused,
403
- isReadOnly,
404
- isRequired,
404
+ disabled,
405
+ focused,
406
+ /**
407
+ * @deprecated Use `disabled` instead.
408
+ */
409
+ isDisabled: disabled,
410
+ /**
411
+ * @deprecated Use `readOnly` instead.
412
+ */
413
+ isReadOnly: readOnly,
414
+ /**
415
+ * @deprecated Use `required` instead.
416
+ */
417
+ isRequired: required,
405
418
  props: rest,
419
+ readOnly,
420
+ required,
406
421
  value: format(value),
407
422
  valueAsNumber,
408
423
  getDecrementProps,
@@ -473,10 +488,10 @@ var [NumberInputContextProvider, useNumberInputContext] = (0, import_utils.creat
473
488
  var NumberInput = (0, import_core.forwardRef)(
474
489
  (props, ref) => {
475
490
  const [styles, mergedProps] = (0, import_core.useComponentMultiStyle)("NumberInput", props);
476
- let {
491
+ const {
477
492
  className,
478
493
  isStepper = true,
479
- stepper,
494
+ stepper = isStepper,
480
495
  addonProps,
481
496
  containerProps,
482
497
  decrementProps,
@@ -489,7 +504,6 @@ var NumberInput = (0, import_core.forwardRef)(
489
504
  getIncrementProps,
490
505
  getInputProps
491
506
  } = useNumberInput(computedProps);
492
- stepper != null ? stepper : stepper = isStepper;
493
507
  const css = {
494
508
  position: "relative",
495
509
  zIndex: 0,
@@ -508,7 +522,7 @@ var NumberInput = (0, import_core.forwardRef)(
508
522
  ...containerProps,
509
523
  children: [
510
524
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NumberInputField, { ...getInputProps(rest, ref) }),
511
- isStepper ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(NumberInputAddon, { ...addonProps, children: [
525
+ stepper ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(NumberInputAddon, { ...addonProps, children: [
512
526
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NumberIncrementStepper, { ...incrementProps }),
513
527
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NumberDecrementStepper, { ...decrementProps })
514
528
  ] }) : null