@yamada-ui/number-input 1.1.13 → 1.1.14-dev-20240917033401

package/dist/{chunk-NCOASV6M.mjs → chunk-JMDHK253.mjs}

@@ -4,7 +4,7 @@
 import {
   ui,
   forwardRef,
-  useMultiComponentStyle,
+  useComponentMultiStyle,
   omitThemeProps
 } from "@yamada-ui/core";
 import {
@@ -335,7 +335,6 @@ var useNumberInput = (props = {}) => {
           cursor: readOnly ? "not-allowed" : (_a = props2.style) == null ? void 0 : _a.cursor
         },
         ref: mergeRefs(ref, incrementRef),
-        role: "button",
         tabIndex: -1,
         onPointerDown: handlerAll(props2.onPointerDown, (ev) => {
           if (ev.button === 0 && !trulyDisabled) eventUp(ev);
@@ -370,7 +369,6 @@ var useNumberInput = (props = {}) => {
           cursor: readOnly ? "not-allowed" : (_a = props2.style) == null ? void 0 : _a.cursor
         },
         ref: mergeRefs(ref, decrementRef),
-        role: "button",
         tabIndex: -1,
         onPointerDown: handlerAll(props2.onPointerDown, (ev) => {
           if (ev.button === 0 && !trulyDisabled) eventDown(ev);
@@ -465,7 +463,7 @@ var [NumberInputContextProvider, useNumberInputContext] = createContext({
 });
 var NumberInput = forwardRef(
   (props, ref) => {
-    const [styles, mergedProps] = useMultiComponentStyle("NumberInput", props);
+    const [styles, mergedProps] = useComponentMultiStyle("NumberInput", props);
     const {
       className,
       isStepper = true,
@@ -497,12 +495,7 @@ var NumberInput = forwardRef(
             __css: css,
             ...containerProps,
             children: [
-              /* @__PURE__ */ jsx(
-                NumberInputField,
-                {
-                  ...getInputProps(rest, ref)
-                }
-              ),
+              /* @__PURE__ */ jsx(NumberInputField, { ...getInputProps(rest, ref) }),
               isStepper ? /* @__PURE__ */ jsxs(NumberInputAddon, { ...addonProps, children: [
                 /* @__PURE__ */ jsx(NumberIncrementStepper, { ...incrementProps }),
                 /* @__PURE__ */ jsx(NumberDecrementStepper, { ...decrementProps })
@@ -558,7 +551,7 @@ var NumberInputAddon = forwardRef(
     );
   }
 );
-var Stepper = ui("div", {
+var Stepper = ui("button", {
   baseStyle: {
     display: "flex",
     justifyContent: "center",
@@ -571,39 +564,35 @@ var Stepper = ui("div", {
     lineHeight: "normal"
   }
 });
-var NumberIncrementStepper = forwardRef(
-  ({ className, children, ...rest }, ref) => {
-    const { getIncrementProps, styles } = useNumberInputContext();
-    const css = { ...styles.stepper };
-    return /* @__PURE__ */ jsx(
-      Stepper,
-      {
-        className: cx("ui-number-input__stepper--up", className),
-        ...getIncrementProps(rest, ref),
-        __css: css,
-        children: children != null ? children : /* @__PURE__ */ jsx(ChevronIcon, { __css: { transform: "rotate(180deg)" } })
-      }
-    );
-  }
-);
-var NumberDecrementStepper = forwardRef(
-  ({ className, children, ...rest }, ref) => {
-    const { getDecrementProps, styles } = useNumberInputContext();
-    const css = { ...styles.stepper };
-    return /* @__PURE__ */ jsx(
-      Stepper,
-      {
-        className: cx("ui-number-input__stepper--down", className),
-        ...getDecrementProps(rest, ref),
-        __css: css,
-        children: children != null ? children : /* @__PURE__ */ jsx(ChevronIcon, {})
-      }
-    );
-  }
-);
+var NumberIncrementStepper = forwardRef(({ className, children, ...rest }, ref) => {
+  const { getIncrementProps, styles } = useNumberInputContext();
+  const css = { ...styles.stepper };
+  return /* @__PURE__ */ jsx(
+    Stepper,
+    {
+      className: cx("ui-number-input__stepper--up", className),
+      ...getIncrementProps(rest, ref),
+      __css: css,
+      children: children != null ? children : /* @__PURE__ */ jsx(ChevronIcon, { __css: { transform: "rotate(180deg)" } })
+    }
+  );
+});
+var NumberDecrementStepper = forwardRef(({ className, children, ...rest }, ref) => {
+  const { getDecrementProps, styles } = useNumberInputContext();
+  const css = { ...styles.stepper };
+  return /* @__PURE__ */ jsx(
+    Stepper,
+    {
+      className: cx("ui-number-input__stepper--down", className),
+      ...getDecrementProps(rest, ref),
+      __css: css,
+      children: children != null ? children : /* @__PURE__ */ jsx(ChevronIcon, {})
+    }
+  );
+});
 
 export {
   useNumberInput,
   NumberInput
 };
-//# sourceMappingURL=chunk-NCOASV6M.mjs.map
+//# sourceMappingURL=chunk-JMDHK253.mjs.map

package/dist/chunk-JMDHK253.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/number-input.tsx"],"sourcesContent":["import type {\n  CSSUIObject,\n  HTMLUIProps,\n  ThemeProps,\n  ColorModeToken,\n  CSS,\n  PropGetter,\n} from \"@yamada-ui/core\"\nimport {\n  ui,\n  forwardRef,\n  useComponentMultiStyle,\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 {\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 interface UseNumberInputProps\n  extends 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: { [key: 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<\"input\"> = 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<\"button\"> = 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        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        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        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\ninterface 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\n  /**\n   * Props for addon component.\n   */\n  addonProps?: HTMLUIProps\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 interface NumberInputProps\n  extends Omit<\n      HTMLUIProps<\"input\">,\n      | \"value\"\n      | \"defaultValue\"\n      | \"disabled\"\n      | \"required\"\n      | \"readOnly\"\n      | \"size\"\n      | \"min\"\n      | \"max\"\n      | \"step\"\n      | \"onChange\"\n      | \"onInvalid\"\n    >,\n    ThemeProps<\"NumberInput\">,\n    Omit<UseNumberInputProps, \"disabled\" | \"required\" | \"readOnly\">,\n    NumberInputOptions {}\n\ninterface NumberInputContext {\n  getInputProps: PropGetter<\"input\">\n  getIncrementProps: PropGetter<\"button\">\n  getDecrementProps: PropGetter<\"button\">\n  styles: { [key: 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] = useComponentMultiStyle(\"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 {...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\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\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(\"button\", {\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<\"button\">\n\nconst NumberIncrementStepper = forwardRef<\n  NumberIncrementStepperProps,\n  \"button\"\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, ref)}\n      __css={css}\n    >\n      {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n    </Stepper>\n  )\n})\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"button\">\n\nconst NumberDecrementStepper = forwardRef<\n  NumberDecrementStepperProps,\n  \"button\"\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, ref)}\n      __css={css}\n    >\n      {children ?? <ChevronIcon />}\n    </Stepper>\n  )\n})\n"],"mappings":";;;AAQA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,mBAAmB;AAE5B,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAC5B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAOP,SAAS,aAAa,WAAW,SAAS,QAAQ,gBAAgB;AA2rBxD,cAGE,YAHF;AAzrBV,IAAM,0BAA0B,CAAC,cAC/B,gBAAgB,KAAK,SAAS;AAEhC,IAAM,8BAA8B,CAClC,EAAE,KAAK,SAAS,QAAQ,QAAQ,GAChC,YACG;AACH,MAAI,OAAO,KAAM,QAAO;AAExB,QAAM,gBAAgB,WAAW,UAAU;AAC3C,QAAM,uBAAuB,IAAI,WAAW;AAE5C,MAAI,CAAC,wBAAwB,cAAe,QAAO;AAEnD,SAAO,QAAQ,GAAG;AACpB;AAEA,IAAM,UAAU,CAAuC;AAAA,EACrD;AAAA,EACA;AAAA,EACA;AACF,MAAS;AACP,MAAI,QAAQ;AAEZ,MAAI,WAAW,QAAS,SAAQ;AAEhC,MAAI,SAAU,SAAQ;AAEtB,SAAO;AACT;AA0EO,IAAM,iBAAiB,CAAC,QAA6B,CAAC,MAAM;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB;AAAA,IACA,MAAM,OAAO;AAAA,IACb,MAAM,OAAO;AAAA,IACb,MAAM;AAAA,IACN;AAAA,IACA,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,kBAAkB;AAAA,IAClB,UAAU;AAAA,IACV,GAAG;AAAA,EACL,IAAI,oBAAoB,KAAK;AAC7B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,GAAG;AAAA,EACL,IAAI,WAAW,MAAM,qBAAqB;AAE1C,QAAM,aAAa;AACnB,QAAM,aAAa;AACnB,QAAM,aAAa;AAEnB,QAAM,CAAC,WAAW,UAAU,IAAI,SAAS,KAAK;AAC9C,QAAM,gBAAgB,EAAE,YAAY;AAEpC,QAAM,WAAW,OAAyB,IAAI;AAC9C,QAAM,oBAAoB,OAGhB,IAAI;AACd,QAAM,eAAe,OAA0B,IAAI;AACnD,QAAM,eAAe,OAA0B,IAAI;AAEnD,QAAM,UAAU;AAAA,IACd,WAAW,aAAa,CAAC,OAAO;AApMpC;AAqMM,iBAAW,IAAI;AAEf,UAAI,CAAC,kBAAkB,QAAS;AAEhC,SAAG,OAAO,kBACR,uBAAkB,QAAQ,UAA1B,aAAmC,QAAG,cAAc,UAAjB,mBAAwB;AAC7D,SAAG,cAAc,gBACf,uBAAkB,QAAQ,QAA1B,YAAiC,GAAG,cAAc;AAAA,IACtD,CAAC;AAAA,EACH;AACA,QAAM,SAAS;AAAA,IACb,WAAW,YAAY,MAAM;AAC3B,iBAAW,KAAK;AAEhB,UAAI,iBAAkB,kBAAiB;AAAA,IACzC,CAAC;AAAA,EACH;AACA,QAAM,YAAY,eAAe,aAAa;AAC9C,QAAM,mBAAmB,eAAe,oBAAoB;AAC5D,QAAM,mBAAmB;AAAA,IACvB,sDAAwB;AAAA,EAC1B;AAEA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI,WAAW;AAAA,IACb,OAAO;AAAA,IACP;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,YAAY,QAAQ,MAAM;AAC9B,QAAI,OAAO,qDAAmB;AAE9B,QAAI,QAAQ,KAAM,QAAO;AAEzB,WAAO,MAAM,SAAS;AAEtB,WAAO,CAAC,OAAO,SAAY;AAAA,EAC7B,GAAG,CAAC,OAAO,gBAAgB,CAAC;AAE5B,QAAM,WAAW;AAAA,IACf,CAACA,WAAkBA,OAAM,MAAM,EAAE,EAAE,OAAO,gBAAgB,EAAE,KAAK,EAAE;AAAA,IACnE,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,QAAQ;AAAA,IACZ,CAACA,WAAe;AAjQpB;AAiQuB,0DAAYA,YAAZ,YAAsBA;AAAA;AAAA,IACzC,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,SAAS;AAAA,IACb,CAACA,WAAwB;AAtQ7B;AAsQiC,6DAAaA,YAAb,YAAuBA,QAAO,SAAS;AAAA;AAAA,IACpE,CAAC,UAAU;AAAA,EACb;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,OAAO,8BAAY,MAAM;AACxB,UAAI,cAAe,SAAQ,UAAU,IAAI;AAAA,IAC3C;AAAA,IACA,CAAC,eAAe,SAAS,QAAQ;AAAA,EACnC;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,OAAO,8BAAY,MAAM;AACxB,UAAI,cAAe,SAAQ,UAAU,IAAI;AAAA,IAC3C;AAAA,IACA,CAAC,eAAe,SAAS,QAAQ;AAAA,EACnC;AAEA,QAAM,mBAAmB,YAAY,MAAM;AACzC,QAAI,OAAO;AAEX,QAAI,UAAU,GAAI;AAElB,UAAM,mBAAmB,QAAQ,KAAK,MAAM,SAAS,CAAC;AAEtD,QAAI,kBAAkB;AACpB,eAAS,EAAE;AAAA,IACb,OAAO;AACL,UAAI,gBAAgB,IAAK,QAAO;AAEhC,UAAI,gBAAgB,IAAK,QAAO;AAEhC,WAAK,IAAI;AAAA,IACX;AAAA,EACF,GAAG,CAAC,MAAM,KAAK,KAAK,UAAU,OAAO,aAAa,CAAC;AAEnD,QAAM,WAAW;AAAA,IACf,CAAC,OAAsC;AACrC,UAAK,GAAG,YAA2B,YAAa;AAEhD,YAAM,cAAc,MAAM,GAAG,cAAc,KAAK;AAEhD,aAAO,SAAS,WAAW,CAAC;AAE5B,wBAAkB,UAAU;AAAA,QAC1B,OAAO,GAAG,cAAc;AAAA,QACxB,KAAK,GAAG,cAAc;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,OAAO,QAAQ,QAAQ;AAAA,EAC1B;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,OAAsB;AACrB,UAAI,GAAG,YAAY,YAAa;AAEhC,UAAI,CAAC,4BAA4B,IAAI,gBAAgB;AACnD,WAAG,eAAe;AAEpB,YAAM,OAAO,QAAQ,EAAE,KAAK,8BAAY;AAExC,YAAM,SAAkD;AAAA,QACtD,SAAS,MAAM,UAAU,IAAI;AAAA,QAC7B,WAAW,MAAM,UAAU,IAAI;AAAA,QAC/B,MAAM,MAAM,OAAO,GAAG;AAAA,QACtB,KAAK,MAAM,OAAO,GAAG;AAAA,MACvB;AAEA,YAAM,SAAS,OAAO,GAAG,GAAG;AAE5B,UAAI,CAAC,OAAQ;AAEb,SAAG,eAAe;AAClB,aAAO,EAAE;AAAA,IACX;AAAA,IACA,CAAC,WAAW,WAAW,kBAAkB,KAAK,KAAK,UAAU,MAAM;AAAA,EACrE;AAEA,QAAM,EAAE,IAAI,MAAM,MAAM,WAAW,IAAI,WAAW,WAAW,SAAS;AAEtE,uBAAqB,cAAc,CAAC,UAAU,GAAG,YAAY,IAAI;AACjE,uBAAqB,cAAc,CAAC,UAAU,GAAG,YAAY,IAAI;AAEjE,QAAM,aAAa,YAAY,MAAM;AACnC,QAAI;AACF,4BAAsB,MAAM;AA3VlC;AA4VQ,uBAAS,YAAT,mBAAkB;AAAA,MACpB,CAAC;AAAA,EACL,GAAG,CAAC,kBAAkB,CAAC;AAEvB,QAAM,UAAU;AAAA,IACd,CAAC,OAAY;AACX,SAAG,eAAe;AAClB,SAAG;AACH,iBAAW;AAAA,IACb;AAAA,IACA,CAAC,YAAY,EAAE;AAAA,EACjB;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,OAAY;AACX,SAAG,eAAe;AAClB,WAAK;AACL,iBAAW;AAAA,IACb;AAAA,IACA,CAAC,YAAY,IAAI;AAAA,EACnB;AAEA,kBAAgB,MAAM;AACpB,QAAI,gBAAgB,KAAK;AACvB,6CAAY,iBAAiB,OAAO,KAAK,GAAG;AAAA,IAC9C,WAAW,gBAAgB,KAAK;AAC9B,6CAAY,iBAAiB,OAAO,KAAK,GAAG;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,eAAe,OAAO,QAAQ,SAAS,CAAC;AAE5C,sBAAoB,MAAM;AACxB,QAAI,CAAC,SAAS,QAAS;AAEvB,UAAM,YAAY,SAAS,QAAQ,SAAS;AAE5C,QAAI,CAAC,UAAW;AAEhB,UAAM,cAAc,MAAM,SAAS,QAAQ,KAAK;AAEhD,aAAS,SAAS,WAAW,CAAC;AAAA,EAChC,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB;AAAA,IACE,MAAM,SAAS;AAAA,IACf;AAAA,IACA,CAAC,OAAO;AAzYZ;AA0YM,YAAM,iBAAgB,oBAAS,YAAT,mBAAkB,kBAAlB,YAAmC;AACzD,YAAMC,aAAY,cAAc,kBAAkB,SAAS;AAE3D,UAAI,CAAC,mBAAmB,CAACA,WAAW;AAEpC,SAAG,eAAe;AAElB,YAAM,OAAO,QAAQ,EAAS,KAAK,8BAAY;AAC/C,YAAM,YAAY,KAAK,KAAK,GAAG,MAAM;AAErC,UAAI,cAAc,IAAI;AACpB,kBAAU,IAAI;AAAA,MAChB,WAAW,cAAc,GAAG;AAC1B,kBAAU,IAAI;AAAA,MAChB;AAAA,IACF;AAAA,IACA,EAAE,SAAS,MAAM;AAAA,EACnB;AAEA,QAAM,gBAAqC;AAAA,IACzC,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN,KAAK,UAAU,UAAU,GAAG;AAAA,MAC5B,OAAO,OAAO,KAAK;AAAA,MACnB,iBAAiB;AAAA,MACjB,iBAAiB;AAAA,MACjB,iBAAiB,OAAO,MAAM,aAAa,IAAI,SAAY;AAAA,MAC3D,kBAAkB;AAAA,MAClB,gBAAgB,SAAS,gCAAa,KAAK;AAAA,MAC3C,cAAc;AAAA,MACd,aAAa;AAAA,MACb,UAAU,WAAWA,OAAM,UAAU,QAAQ;AAAA,MAC7C,WAAW,WAAWA,OAAM,WAAW,SAAS;AAAA,MAChD,SAAS,WAAWA,OAAM,SAAS,OAAO;AAAA,MAC1C,QAAQ,WAAWA,OAAM,QAAQ,MAAM;AAAA,IACzC;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAA0C;AAAA,IAC9C,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AArdhC;AAsdM,YAAM,gBAAgB,YAAa,mBAAmB;AAEtD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,GAAG;AAAA,QACH,GAAGA;AAAA,QACH,OAAO;AAAA,UACL,GAAGA,OAAM;AAAA,UACT,QAAQ,WAAW,iBAAgB,KAAAA,OAAM,UAAN,mBAAa;AAAA,QAClD;AAAA,QACA,KAAK,UAAU,KAAK,YAAY;AAAA,QAChC,UAAU;AAAA,QACV,eAAe,WAAWA,OAAM,eAAe,CAAC,OAAO;AACrD,cAAI,GAAG,WAAW,KAAK,CAAC,cAAe,SAAQ,EAAE;AAAA,QACnD,CAAC;AAAA,QACD,gBAAgB,WAAWA,OAAM,gBAAgB,IAAI;AAAA,QACrD,aAAa,WAAWA,OAAM,aAAa,IAAI;AAAA,MACjD;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAA0C;AAAA,IAC9C,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AAxfhC;AAyfM,YAAM,gBAAgB,YAAa,mBAAmB;AAEtD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,GAAG;AAAA,QACH,GAAGA;AAAA,QACH,OAAO;AAAA,UACL,GAAGA,OAAM;AAAA,UACT,QAAQ,WAAW,iBAAgB,KAAAA,OAAM,UAAN,mBAAa;AAAA,QAClD;AAAA,QACA,KAAK,UAAU,KAAK,YAAY;AAAA,QAChC,UAAU;AAAA,QACV,eAAe,WAAWA,OAAM,eAAe,CAAC,OAAO;AACrD,cAAI,GAAG,WAAW,KAAK,CAAC,cAAe,WAAU,EAAE;AAAA,QACrD,CAAC;AAAA,QACD,gBAAgB,WAAWA,OAAM,gBAAgB,IAAI;AAAA,QACrD,aAAa,WAAWA,OAAM,aAAa,IAAI;AAAA,MACjD;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,IACP,OAAO,OAAO,KAAK;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAIA,IAAM,WAAW;AAEjB,IAAM,QAAQ;AAId,IAAM,aAAa,CAAC,WAAqB,cAAwB;AAC/D,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAClD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAwB,IAAI;AACxD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,IAAI;AACzC,QAAM,aAAa,OAAY,IAAI;AAEnC,QAAM,gBAAgB,MAAM,aAAa,WAAW,OAAO;AAE3D;AAAA,IACE,MAAM;AACJ,UAAI,WAAW,YAAa,WAAU;AAEtC,UAAI,WAAW,YAAa,WAAU;AAAA,IACxC;AAAA,IACA,aAAa,WAAW;AAAA,EAC1B;AAEA,QAAM,KAAK,YAAY,MAAM;AAC3B,QAAI,OAAQ,WAAU;AAEtB,eAAW,UAAU,WAAW,MAAM;AACpC,gBAAU,KAAK;AACf,oBAAc,IAAI;AAClB,gBAAU,WAAW;AAAA,IACvB,GAAG,KAAK;AAAA,EACV,GAAG,CAAC,WAAW,MAAM,CAAC;AAEtB,QAAM,OAAO,YAAY,MAAM;AAC7B,QAAI,OAAQ,WAAU;AAEtB,eAAW,UAAU,WAAW,MAAM;AACpC,gBAAU,KAAK;AACf,oBAAc,IAAI;AAClB,gBAAU,WAAW;AAAA,IACvB,GAAG,KAAK;AAAA,EACV,GAAG,CAAC,WAAW,MAAM,CAAC;AAEtB,QAAM,OAAO,YAAY,MAAM;AAC7B,cAAU,IAAI;AACd,kBAAc,KAAK;AACnB,kBAAc;AAAA,EAChB,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,WAAO,MAAM,cAAc;AAAA,EAC7B,GAAG,CAAC,CAAC;AAEL,SAAO,EAAE,IAAI,MAAM,MAAM,WAAW;AACtC;AAEA,IAAM,uBAAuB,CAC3B,KACA,iBACA,SACA,SACG;AACH,YAAU,MAAM;AAxmBlB;AAymBI,QAAI,CAAC,IAAI,WAAW,CAAC,QAAS;AAE9B,UAAM,iBAAgB,SAAI,QAAQ,cAAc,gBAA1B,YAAyC;AAE/D,UAAM,WAAW,IAAI,cAAc,iBAAiB,CAAC,YAAY;AAC/D,iBAAW,EAAE,MAAM,cAAc,KAAK,SAAS;AAC7C,YACE,SAAS,gBACT,iBACA,gBAAgB,SAAS,aAAa;AAEtC,eAAK;AAAA,MACT;AAAA,IACF,CAAC;AAED,aAAS,QAAQ,IAAI,SAAS,EAAE,YAAY,MAAM,gBAAgB,CAAC;AAEnE,WAAO,MAAM,SAAS,WAAW;AAAA,EACnC,CAAC;AACH;AA2DA,IAAM,CAAC,4BAA4B,qBAAqB,IACtD,cAAkC;AAAA,EAChC,QAAQ;AAAA,EACR,MAAM;AACR,CAAC;AAOI,IAAM,cAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,IAAI,uBAAuB,eAAe,KAAK;AACzE,UAAM;AAAA,MACJ;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,eAAe,WAAW;AAC9B,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,IACT,IAAI,eAAe,aAAa;AAEhC,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,EAAE,eAAe,mBAAmB,mBAAmB,OAAO;AAAA,QAErE;AAAA,UAAC,GAAG;AAAA,UAAH;AAAA,YACC,WAAW,GAAG,mBAAmB,SAAS;AAAA,YAC1C,OAAO;AAAA,YACN,GAAG;AAAA,YAEJ;AAAA,kCAAC,oBAAkB,GAAG,cAAc,MAAM,GAAG,GAAG;AAAA,cAE/C,YACC,qBAAC,oBAAkB,GAAG,YACpB;AAAA,oCAAC,0BAAwB,GAAG,gBAAgB;AAAA,gBAC5C,oBAAC,0BAAwB,GAAG,gBAAgB;AAAA,iBAC9C,IACE;AAAA;AAAA;AAAA,QACN;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAOA,IAAM,mBAAmB;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,sBAAsB;AAEzC,UAAM,MAAmB;AAAA,MACvB,OAAO;AAAA,MACP,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,WAAW,GAAG,0BAA0B,SAAS;AAAA,QACjD,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAIA,IAAM,mBAAmB;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,sBAAsB;AAEzC,UAAM,MAAmB;AAAA,MACvB,SAAS;AAAA,MACT,eAAe;AAAA,MACf,UAAU;AAAA,MACV,KAAK;AAAA,MACL,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,WAAW,GAAG,0BAA0B,SAAS;AAAA,QACjD,eAAW;AAAA,QACX,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,IAAM,UAAU,GAAG,UAAU;AAAA,EAC3B,WAAW;AAAA,IACT,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,oBAAoB;AAAA,IACpB,oBAAoB;AAAA,IACpB,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,YAAY;AAAA,EACd;AACF,CAAC;AAID,IAAM,yBAAyB,WAG7B,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,GAAG,QAAQ;AAC3C,QAAM,EAAE,mBAAmB,OAAO,IAAI,sBAAsB;AAE5D,QAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,gCAAgC,SAAS;AAAA,MACtD,GAAG,kBAAkB,MAAM,GAAG;AAAA,MAC/B,OAAO;AAAA,MAEN,wCAAY,oBAAC,eAAY,OAAO,EAAE,WAAW,iBAAiB,GAAG;AAAA;AAAA,EACpE;AAEJ,CAAC;AAID,IAAM,yBAAyB,WAG7B,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,GAAG,QAAQ;AAC3C,QAAM,EAAE,mBAAmB,OAAO,IAAI,sBAAsB;AAE5D,QAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,kCAAkC,SAAS;AAAA,MACxD,GAAG,kBAAkB,MAAM,GAAG;AAAA,MAC/B,OAAO;AAAA,MAEN,wCAAY,oBAAC,eAAY;AAAA;AAAA,EAC5B;AAEJ,CAAC;","names":["value","isFocused","props"]}

package/dist/index.d.mts

@@ -3,4 +3,3 @@ import '@yamada-ui/core';
 import 'react';
 import '@yamada-ui/form-control';
 import '@yamada-ui/use-counter';
-import '@yamada-ui/utils';

package/dist/index.d.ts

@@ -3,4 +3,3 @@ import '@yamada-ui/core';
 import 'react';
 import '@yamada-ui/form-control';
 import '@yamada-ui/use-counter';
-import '@yamada-ui/utils';

package/dist/index.js

@@ -343,7 +343,6 @@ var useNumberInput = (props = {}) => {
           cursor: readOnly ? "not-allowed" : (_a = props2.style) == null ? void 0 : _a.cursor
         },
         ref: (0, import_utils.mergeRefs)(ref, incrementRef),
-        role: "button",
         tabIndex: -1,
         onPointerDown: (0, import_utils.handlerAll)(props2.onPointerDown, (ev) => {
           if (ev.button === 0 && !trulyDisabled) eventUp(ev);
@@ -378,7 +377,6 @@ var useNumberInput = (props = {}) => {
           cursor: readOnly ? "not-allowed" : (_a = props2.style) == null ? void 0 : _a.cursor
         },
         ref: (0, import_utils.mergeRefs)(ref, decrementRef),
-        role: "button",
         tabIndex: -1,
         onPointerDown: (0, import_utils.handlerAll)(props2.onPointerDown, (ev) => {
           if (ev.button === 0 && !trulyDisabled) eventDown(ev);
@@ -473,7 +471,7 @@ var [NumberInputContextProvider, useNumberInputContext] = (0, import_utils.creat
 });
 var NumberInput = (0, import_core.forwardRef)(
   (props, ref) => {
-    const [styles, mergedProps] = (0, import_core.useMultiComponentStyle)("NumberInput", props);
+    const [styles, mergedProps] = (0, import_core.useComponentMultiStyle)("NumberInput", props);
     const {
       className,
       isStepper = true,
@@ -505,12 +503,7 @@ var NumberInput = (0, import_core.forwardRef)(
             __css: css,
             ...containerProps,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                NumberInputField,
-                {
-                  ...getInputProps(rest, ref)
-                }
-              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NumberInputField, { ...getInputProps(rest, ref) }),
               isStepper ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(NumberInputAddon, { ...addonProps, children: [
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NumberIncrementStepper, { ...incrementProps }),
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NumberDecrementStepper, { ...decrementProps })
@@ -566,7 +559,7 @@ var NumberInputAddon = (0, import_core.forwardRef)(
     );
   }
 );
-var Stepper = (0, import_core.ui)("div", {
+var Stepper = (0, import_core.ui)("button", {
   baseStyle: {
     display: "flex",
     justifyContent: "center",
@@ -579,36 +572,32 @@ var Stepper = (0, import_core.ui)("div", {
     lineHeight: "normal"
   }
 });
-var NumberIncrementStepper = (0, import_core.forwardRef)(
-  ({ className, children, ...rest }, ref) => {
-    const { getIncrementProps, styles } = useNumberInputContext();
-    const css = { ...styles.stepper };
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      Stepper,
-      {
-        className: (0, import_utils.cx)("ui-number-input__stepper--up", className),
-        ...getIncrementProps(rest, ref),
-        __css: css,
-        children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, { __css: { transform: "rotate(180deg)" } })
-      }
-    );
-  }
-);
-var NumberDecrementStepper = (0, import_core.forwardRef)(
-  ({ className, children, ...rest }, ref) => {
-    const { getDecrementProps, styles } = useNumberInputContext();
-    const css = { ...styles.stepper };
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      Stepper,
-      {
-        className: (0, import_utils.cx)("ui-number-input__stepper--down", className),
-        ...getDecrementProps(rest, ref),
-        __css: css,
-        children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, {})
-      }
-    );
-  }
-);
+var NumberIncrementStepper = (0, import_core.forwardRef)(({ className, children, ...rest }, ref) => {
+  const { getIncrementProps, styles } = useNumberInputContext();
+  const css = { ...styles.stepper };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    Stepper,
+    {
+      className: (0, import_utils.cx)("ui-number-input__stepper--up", className),
+      ...getIncrementProps(rest, ref),
+      __css: css,
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, { __css: { transform: "rotate(180deg)" } })
+    }
+  );
+});
+var NumberDecrementStepper = (0, import_core.forwardRef)(({ className, children, ...rest }, ref) => {
+  const { getDecrementProps, styles } = useNumberInputContext();
+  const css = { ...styles.stepper };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    Stepper,
+    {
+      className: (0, import_utils.cx)("ui-number-input__stepper--down", className),
+      ...getDecrementProps(rest, ref),
+      __css: css,
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, {})
+    }
+  );
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   NumberInput,

package/dist/index.js.map

@@ -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    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":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACOA,kBAKO;AAEP,0BAGO;AACP,kBAA4B;AAE5B,yBAA2B;AAC3B,gCAAiC;AACjC,0BAA4B;AAE5B,mBAUO;AAOP,mBAAkE;AAirBxD;AA/qBV,IAAM,0BAA0B,CAAC,cAC/B,gBAAgB,KAAK,SAAS;AAEhC,IAAM,8BAA8B,CAClC,EAAE,KAAK,SAAS,QAAQ,QAAQ,GAChC,YACG;AACH,MAAI,OAAO,KAAM,QAAO;AAExB,QAAM,gBAAgB,WAAW,UAAU;AAC3C,QAAM,uBAAuB,IAAI,WAAW;AAE5C,MAAI,CAAC,wBAAwB,cAAe,QAAO;AAEnD,SAAO,QAAQ,GAAG;AACpB;AAEA,IAAM,UAAU,CAAuC;AAAA,EACrD;AAAA,EACA;AAAA,EACA;AACF,MAAS;AACP,MAAI,QAAQ;AAEZ,MAAI,WAAW,QAAS,SAAQ;AAEhC,MAAI,SAAU,SAAQ;AAEtB,SAAO;AACT;AAyEO,IAAM,iBAAiB,CAAC,QAA6B,CAAC,MAAM;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB;AAAA,IACA,MAAM,OAAO;AAAA,IACb,MAAM,OAAO;AAAA,IACb,MAAM;AAAA,IACN;AAAA,IACA,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,kBAAkB;AAAA,IAClB,UAAU;AAAA,IACV,GAAG;AAAA,EACL,QAAI,yCAAoB,KAAK;AAC7B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,GAAG;AAAA,EACL,QAAI,yBAAW,MAAM,yCAAqB;AAE1C,QAAM,aAAa;AACnB,QAAM,aAAa;AACnB,QAAM,aAAa;AAEnB,QAAM,CAAC,WAAW,UAAU,QAAI,uBAAS,KAAK;AAC9C,QAAM,gBAAgB,EAAE,YAAY;AAEpC,QAAM,eAAW,qBAAyB,IAAI;AAC9C,QAAM,wBAAoB,qBAGhB,IAAI;AACd,QAAM,mBAAe,qBAA0B,IAAI;AACnD,QAAM,mBAAe,qBAA0B,IAAI;AAEnD,QAAM,cAAU;AAAA,QACd,yBAAW,aAAa,CAAC,OAAO;AAnMpC;AAoMM,iBAAW,IAAI;AAEf,UAAI,CAAC,kBAAkB,QAAS;AAEhC,SAAG,OAAO,kBACR,uBAAkB,QAAQ,UAA1B,aAAmC,QAAG,cAAc,UAAjB,mBAAwB;AAC7D,SAAG,cAAc,gBACf,uBAAkB,QAAQ,QAA1B,YAAiC,GAAG,cAAc;AAAA,IACtD,CAAC;AAAA,EACH;AACA,QAAM,aAAS;AAAA,QACb,yBAAW,YAAY,MAAM;AAC3B,iBAAW,KAAK;AAEhB,UAAI,iBAAkB,kBAAiB;AAAA,IACzC,CAAC;AAAA,EACH;AACA,QAAM,gBAAY,6BAAe,aAAa;AAC9C,QAAM,uBAAmB,6BAAe,oBAAoB;AAC5D,QAAM,uBAAmB;AAAA,IACvB,sDAAwB;AAAA,EAC1B;AAEA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,QAAI,+BAAW;AAAA,IACb,OAAO;AAAA,IACP;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,QAAI,OAAO,qDAAmB;AAE9B,QAAI,QAAQ,KAAM,QAAO;AAEzB,WAAO,MAAM,SAAS;AAEtB,WAAO,CAAC,OAAO,SAAY;AAAA,EAC7B,GAAG,CAAC,OAAO,gBAAgB,CAAC;AAE5B,QAAM,eAAW;AAAA,IACf,CAACA,WAAkBA,OAAM,MAAM,EAAE,EAAE,OAAO,gBAAgB,EAAE,KAAK,EAAE;AAAA,IACnE,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,YAAQ;AAAA,IACZ,CAACA,WAAe;AAhQpB;AAgQuB,0DAAYA,YAAZ,YAAsBA;AAAA;AAAA,IACzC,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,aAAS;AAAA,IACb,CAACA,WAAwB;AArQ7B;AAqQiC,6DAAaA,YAAb,YAAuBA,QAAO,SAAS;AAAA;AAAA,IACpE,CAAC,UAAU;AAAA,EACb;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,OAAO,8BAAY,MAAM;AACxB,UAAI,cAAe,SAAQ,UAAU,IAAI;AAAA,IAC3C;AAAA,IACA,CAAC,eAAe,SAAS,QAAQ;AAAA,EACnC;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,OAAO,8BAAY,MAAM;AACxB,UAAI,cAAe,SAAQ,UAAU,IAAI;AAAA,IAC3C;AAAA,IACA,CAAC,eAAe,SAAS,QAAQ;AAAA,EACnC;AAEA,QAAM,uBAAmB,0BAAY,MAAM;AACzC,QAAI,OAAO;AAEX,QAAI,UAAU,GAAI;AAElB,UAAM,mBAAmB,QAAQ,KAAK,MAAM,SAAS,CAAC;AAEtD,QAAI,kBAAkB;AACpB,eAAS,EAAE;AAAA,IACb,OAAO;AACL,UAAI,gBAAgB,IAAK,QAAO;AAEhC,UAAI,gBAAgB,IAAK,QAAO;AAEhC,WAAK,IAAI;AAAA,IACX;AAAA,EACF,GAAG,CAAC,MAAM,KAAK,KAAK,UAAU,OAAO,aAAa,CAAC;AAEnD,QAAM,eAAW;AAAA,IACf,CAAC,OAAsC;AACrC,UAAK,GAAG,YAA2B,YAAa;AAEhD,YAAM,cAAc,MAAM,GAAG,cAAc,KAAK;AAEhD,aAAO,SAAS,WAAW,CAAC;AAE5B,wBAAkB,UAAU;AAAA,QAC1B,OAAO,GAAG,cAAc;AAAA,QACxB,KAAK,GAAG,cAAc;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,OAAO,QAAQ,QAAQ;AAAA,EAC1B;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,OAAsB;AACrB,UAAI,GAAG,YAAY,YAAa;AAEhC,UAAI,CAAC,4BAA4B,IAAI,gBAAgB;AACnD,WAAG,eAAe;AAEpB,YAAM,OAAO,QAAQ,EAAE,KAAK,8BAAY;AAExC,YAAM,SAA+C;AAAA,QACnD,SAAS,MAAM,UAAU,IAAI;AAAA,QAC7B,WAAW,MAAM,UAAU,IAAI;AAAA,QAC/B,MAAM,MAAM,OAAO,GAAG;AAAA,QACtB,KAAK,MAAM,OAAO,GAAG;AAAA,MACvB;AAEA,YAAM,SAAS,OAAO,GAAG,GAAG;AAE5B,UAAI,CAAC,OAAQ;AAEb,SAAG,eAAe;AAClB,aAAO,EAAE;AAAA,IACX;AAAA,IACA,CAAC,WAAW,WAAW,kBAAkB,KAAK,KAAK,UAAU,MAAM;AAAA,EACrE;AAEA,QAAM,EAAE,IAAI,MAAM,MAAM,WAAW,IAAI,WAAW,WAAW,SAAS;AAEtE,uBAAqB,cAAc,CAAC,UAAU,GAAG,YAAY,IAAI;AACjE,uBAAqB,cAAc,CAAC,UAAU,GAAG,YAAY,IAAI;AAEjE,QAAM,iBAAa,0BAAY,MAAM;AACnC,QAAI;AACF,4BAAsB,MAAM;AA1VlC;AA2VQ,uBAAS,YAAT,mBAAkB;AAAA,MACpB,CAAC;AAAA,EACL,GAAG,CAAC,kBAAkB,CAAC;AAEvB,QAAM,cAAU;AAAA,IACd,CAAC,OAAY;AACX,SAAG,eAAe;AAClB,SAAG;AACH,iBAAW;AAAA,IACb;AAAA,IACA,CAAC,YAAY,EAAE;AAAA,EACjB;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,OAAY;AACX,SAAG,eAAe;AAClB,WAAK;AACL,iBAAW;AAAA,IACb;AAAA,IACA,CAAC,YAAY,IAAI;AAAA,EACnB;AAEA,oCAAgB,MAAM;AACpB,QAAI,gBAAgB,KAAK;AACvB,6CAAY,iBAAiB,OAAO,KAAK,GAAG;AAAA,IAC9C,WAAW,gBAAgB,KAAK;AAC9B,6CAAY,iBAAiB,OAAO,KAAK,GAAG;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,eAAe,OAAO,QAAQ,SAAS,CAAC;AAE5C,wCAAoB,MAAM;AACxB,QAAI,CAAC,SAAS,QAAS;AAEvB,UAAM,YAAY,SAAS,QAAQ,SAAS;AAE5C,QAAI,CAAC,UAAW;AAEhB,UAAM,cAAc,MAAM,SAAS,QAAQ,KAAK;AAEhD,aAAS,SAAS,WAAW,CAAC;AAAA,EAChC,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB;AAAA,IACE,MAAM,SAAS;AAAA,IACf;AAAA,IACA,CAAC,OAAO;AAxYZ;AAyYM,YAAM,iBAAgB,oBAAS,YAAT,mBAAkB,kBAAlB,YAAmC;AACzD,YAAMC,aAAY,cAAc,kBAAkB,SAAS;AAE3D,UAAI,CAAC,mBAAmB,CAACA,WAAW;AAEpC,SAAG,eAAe;AAElB,YAAM,OAAO,QAAQ,EAAS,KAAK,8BAAY;AAC/C,YAAM,YAAY,KAAK,KAAK,GAAG,MAAM;AAErC,UAAI,cAAc,IAAI;AACpB,kBAAU,IAAI;AAAA,MAChB,WAAW,cAAc,GAAG;AAC1B,kBAAU,IAAI;AAAA,MAChB;AAAA,IACF;AAAA,IACA,EAAE,SAAS,MAAM;AAAA,EACnB;AAEA,QAAM,oBAA4B;AAAA,IAChC,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN,SAAK,wBAAU,UAAU,GAAG;AAAA,MAC5B,OAAO,OAAO,KAAK;AAAA,MACnB,iBAAiB;AAAA,MACjB,iBAAiB;AAAA,MACjB,iBAAiB,OAAO,MAAM,aAAa,IAAI,SAAY;AAAA,MAC3D,kBAAkB;AAAA,MAClB,oBAAgB,uBAAS,gCAAa,KAAK;AAAA,MAC3C,cAAc;AAAA,MACd,aAAa;AAAA,MACb,cAAU,yBAAWA,OAAM,UAAU,QAAQ;AAAA,MAC7C,eAAW,yBAAWA,OAAM,WAAW,SAAS;AAAA,MAChD,aAAS,yBAAWA,OAAM,SAAS,OAAO;AAAA,MAC1C,YAAQ,yBAAWA,OAAM,QAAQ,MAAM;AAAA,IACzC;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,wBAAgC;AAAA,IACpC,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AApdhC;AAqdM,YAAM,gBAAgB,YAAa,mBAAmB;AAEtD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,GAAG;AAAA,QACH,GAAGA;AAAA,QACH,OAAO;AAAA,UACL,GAAGA,OAAM;AAAA,UACT,QAAQ,WAAW,iBAAgB,KAAAA,OAAM,UAAN,mBAAa;AAAA,QAClD;AAAA,QACA,SAAK,wBAAU,KAAK,YAAY;AAAA,QAChC,MAAM;AAAA,QACN,UAAU;AAAA,QACV,mBAAe,yBAAWA,OAAM,eAAe,CAAC,OAAO;AACrD,cAAI,GAAG,WAAW,KAAK,CAAC,cAAe,SAAQ,EAAE;AAAA,QACnD,CAAC;AAAA,QACD,oBAAgB,yBAAWA,OAAM,gBAAgB,IAAI;AAAA,QACrD,iBAAa,yBAAWA,OAAM,aAAa,IAAI;AAAA,MACjD;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,wBAAgC;AAAA,IACpC,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AAxfhC;AAyfM,YAAM,gBAAgB,YAAa,mBAAmB;AAEtD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,GAAG;AAAA,QACH,GAAGA;AAAA,QACH,OAAO;AAAA,UACL,GAAGA,OAAM;AAAA,UACT,QAAQ,WAAW,iBAAgB,KAAAA,OAAM,UAAN,mBAAa;AAAA,QAClD;AAAA,QACA,SAAK,wBAAU,KAAK,YAAY;AAAA,QAChC,MAAM;AAAA,QACN,UAAU;AAAA,QACV,mBAAe,yBAAWA,OAAM,eAAe,CAAC,OAAO;AACrD,cAAI,GAAG,WAAW,KAAK,CAAC,cAAe,WAAU,EAAE;AAAA,QACrD,CAAC;AAAA,QACD,oBAAgB,yBAAWA,OAAM,gBAAgB,IAAI;AAAA,QACrD,iBAAa,yBAAWA,OAAM,aAAa,IAAI;AAAA,MACjD;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,IACP,OAAO,OAAO,KAAK;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAIA,IAAM,WAAW;AAEjB,IAAM,QAAQ;AAId,IAAM,aAAa,CAAC,WAAqB,cAAwB;AAC/D,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAClD,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAwB,IAAI;AACxD,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,IAAI;AACzC,QAAM,iBAAa,qBAAY,IAAI;AAEnC,QAAM,gBAAgB,MAAM,aAAa,WAAW,OAAO;AAE3D;AAAA,IACE,MAAM;AACJ,UAAI,WAAW,YAAa,WAAU;AAEtC,UAAI,WAAW,YAAa,WAAU;AAAA,IACxC;AAAA,IACA,aAAa,WAAW;AAAA,EAC1B;AAEA,QAAM,SAAK,0BAAY,MAAM;AAC3B,QAAI,OAAQ,WAAU;AAEtB,eAAW,UAAU,WAAW,MAAM;AACpC,gBAAU,KAAK;AACf,oBAAc,IAAI;AAClB,gBAAU,WAAW;AAAA,IACvB,GAAG,KAAK;AAAA,EACV,GAAG,CAAC,WAAW,MAAM,CAAC;AAEtB,QAAM,WAAO,0BAAY,MAAM;AAC7B,QAAI,OAAQ,WAAU;AAEtB,eAAW,UAAU,WAAW,MAAM;AACpC,gBAAU,KAAK;AACf,oBAAc,IAAI;AAClB,gBAAU,WAAW;AAAA,IACvB,GAAG,KAAK;AAAA,EACV,GAAG,CAAC,WAAW,MAAM,CAAC;AAEtB,QAAM,WAAO,0BAAY,MAAM;AAC7B,cAAU,IAAI;AACd,kBAAc,KAAK;AACnB,kBAAc;AAAA,EAChB,GAAG,CAAC,CAAC;AAEL,8BAAU,MAAM;AACd,WAAO,MAAM,cAAc;AAAA,EAC7B,GAAG,CAAC,CAAC;AAEL,SAAO,EAAE,IAAI,MAAM,MAAM,WAAW;AACtC;AAEA,IAAM,uBAAuB,CAC3B,KACA,iBACA,SACA,SACG;AACH,8BAAU,MAAM;AAzmBlB;AA0mBI,QAAI,CAAC,IAAI,WAAW,CAAC,QAAS;AAE9B,UAAM,iBAAgB,SAAI,QAAQ,cAAc,gBAA1B,YAAyC;AAE/D,UAAM,WAAW,IAAI,cAAc,iBAAiB,CAAC,YAAY;AAC/D,iBAAW,EAAE,MAAM,cAAc,KAAK,SAAS;AAC7C,YACE,SAAS,gBACT,iBACA,gBAAgB,SAAS,aAAa;AAEtC,eAAK;AAAA,MACT;AAAA,IACF,CAAC;AAED,aAAS,QAAQ,IAAI,SAAS,EAAE,YAAY,MAAM,gBAAgB,CAAC;AAEnE,WAAO,MAAM,SAAS,WAAW;AAAA,EACnC,CAAC;AACH;AAgDA,IAAM,CAAC,4BAA4B,qBAAqB,QACtD,4BAAkC;AAAA,EAChC,QAAQ;AAAA,EACR,MAAM;AACR,CAAC;AAOI,IAAM,kBAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,eAAe,KAAK;AACzE,UAAM;AAAA,MACJ;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAC9B,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,IACT,IAAI,eAAe,aAAa;AAEhC,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,EAAE,eAAe,mBAAmB,mBAAmB,OAAO;AAAA,QAErE;AAAA,UAAC,eAAG;AAAA,UAAH;AAAA,YACC,eAAW,iBAAG,mBAAmB,SAAS;AAAA,YAC1C,OAAO;AAAA,YACN,GAAG;AAAA,YAEJ;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACE,GAAG,cAAc,MAAoC,GAAG;AAAA;AAAA,cAC3D;AAAA,cAEC,YACC,6CAAC,oBAAkB,GAAG,YACpB;AAAA,4DAAC,0BAAwB,GAAG,gBAAgB;AAAA,gBAC5C,4CAAC,0BAAwB,GAAG,gBAAgB;AAAA,iBAC9C,IACE;AAAA;AAAA;AAAA,QACN;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAOA,IAAM,uBAAmB;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,sBAAsB;AAEzC,UAAM,MAAmB;AAAA,MACvB,OAAO;AAAA,MACP,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,iBAAG,0BAA0B,SAAS;AAAA,QACjD,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAIA,IAAM,uBAAmB;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,sBAAsB;AAEzC,UAAM,MAAmB;AAAA,MACvB,SAAS;AAAA,MACT,eAAe;AAAA,MACf,UAAU;AAAA,MACV,KAAK;AAAA,MACL,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,iBAAG,0BAA0B,SAAS;AAAA,QACjD,eAAW;AAAA,QACX,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,IAAM,cAAU,gBAAG,OAAO;AAAA,EACxB,WAAW;AAAA,IACT,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,oBAAoB;AAAA,IACpB,oBAAoB;AAAA,IACpB,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,YAAY;AAAA,EACd;AACF,CAAC;AAID,IAAM,6BAAyB;AAAA,EAC7B,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,GAAG,QAAQ;AACzC,UAAM,EAAE,mBAAmB,OAAO,IAAI,sBAAsB;AAE5D,UAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAW,iBAAG,gCAAgC,SAAS;AAAA,QACtD,GAAG,kBAAkB,MAAoC,GAAG;AAAA,QAC7D,OAAO;AAAA,QAEN,wCAAY,4CAAC,2BAAY,OAAO,EAAE,WAAW,iBAAiB,GAAG;AAAA;AAAA,IACpE;AAAA,EAEJ;AACF;AAIA,IAAM,6BAAyB;AAAA,EAC7B,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,GAAG,QAAQ;AACzC,UAAM,EAAE,mBAAmB,OAAO,IAAI,sBAAsB;AAE5D,UAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAW,iBAAG,kCAAkC,SAAS;AAAA,QACxD,GAAG,kBAAkB,MAAoC,GAAG;AAAA,QAC7D,OAAO;AAAA,QAEN,wCAAY,4CAAC,2BAAY;AAAA;AAAA,IAC5B;AAAA,EAEJ;AACF;","names":["value","isFocused","props"]}
+{"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  PropGetter,\n} from \"@yamada-ui/core\"\nimport {\n  ui,\n  forwardRef,\n  useComponentMultiStyle,\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 {\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 interface UseNumberInputProps\n  extends 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: { [key: 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<\"input\"> = 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<\"button\"> = 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        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        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        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\ninterface 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\n  /**\n   * Props for addon component.\n   */\n  addonProps?: HTMLUIProps\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 interface NumberInputProps\n  extends Omit<\n      HTMLUIProps<\"input\">,\n      | \"value\"\n      | \"defaultValue\"\n      | \"disabled\"\n      | \"required\"\n      | \"readOnly\"\n      | \"size\"\n      | \"min\"\n      | \"max\"\n      | \"step\"\n      | \"onChange\"\n      | \"onInvalid\"\n    >,\n    ThemeProps<\"NumberInput\">,\n    Omit<UseNumberInputProps, \"disabled\" | \"required\" | \"readOnly\">,\n    NumberInputOptions {}\n\ninterface NumberInputContext {\n  getInputProps: PropGetter<\"input\">\n  getIncrementProps: PropGetter<\"button\">\n  getDecrementProps: PropGetter<\"button\">\n  styles: { [key: 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] = useComponentMultiStyle(\"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 {...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\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\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(\"button\", {\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<\"button\">\n\nconst NumberIncrementStepper = forwardRef<\n  NumberIncrementStepperProps,\n  \"button\"\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, ref)}\n      __css={css}\n    >\n      {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n    </Stepper>\n  )\n})\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"button\">\n\nconst NumberDecrementStepper = forwardRef<\n  NumberDecrementStepperProps,\n  \"button\"\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, ref)}\n      __css={css}\n    >\n      {children ?? <ChevronIcon />}\n    </Stepper>\n  )\n})\n"],"mappings":"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","names":["value","isFocused","props"]}

package/dist/index.mjs

@@ -2,7 +2,7 @@
 import {
   NumberInput,
   useNumberInput
-} from "./chunk-NCOASV6M.mjs";
+} from "./chunk-JMDHK253.mjs";
 export {
   NumberInput,
   useNumberInput

package/dist/number-input.d.mts

@@ -1,13 +1,12 @@
 import * as _yamada_ui_core from '@yamada-ui/core';
-import { HTMLUIProps, ThemeProps, ColorModeToken, CSS } from '@yamada-ui/core';
+import { PropGetter, HTMLUIProps, ThemeProps, ColorModeToken, CSS } from '@yamada-ui/core';
 import * as react from 'react';
 import { InputHTMLAttributes } from 'react';
 import { UseFormControlProps } from '@yamada-ui/form-control';
 import { UseCounterProps } from '@yamada-ui/use-counter';
-import { PropGetter } from '@yamada-ui/utils';
 
 type ValidityState = "rangeUnderflow" | "rangeOverflow";
-type UseNumberInputProps = UseFormControlProps<HTMLInputElement> & UseCounterProps & {
+interface UseNumberInputProps extends UseFormControlProps<HTMLInputElement>, UseCounterProps {
     /**
      * The HTML `name` attribute used for forms.
      */
@@ -69,7 +68,7 @@ type UseNumberInputProps = UseFormControlProps<HTMLInputElement> & UseCounterPro
      * If using a custom display format, this converts the default format to the custom format.
      */
     format?: (value: string | number) => string | number;
-};
+}
 declare const useNumberInput: (props?: UseNumberInputProps) => {
     props: {
         _hover?: {} | undefined;
@@ -84,7 +83,7 @@ declare const useNumberInput: (props?: UseNumberInputProps) => {
         "aria-readonly": boolean | undefined;
         "aria-required": boolean | undefined;
         "aria-invalid": boolean | undefined;
-        "data-readonly": boolean | "true" | "false";
+        "data-readonly": boolean | "false" | "true";
         onFocus: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
         onBlur: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
     };
@@ -94,12 +93,12 @@ declare const useNumberInput: (props?: UseNumberInputProps) => {
     isRequired: boolean | undefined;
     isReadOnly: boolean | undefined;
     isDisabled: boolean | undefined;
-    getInputProps: PropGetter;
-    getIncrementProps: PropGetter;
-    getDecrementProps: PropGetter;
+    getInputProps: PropGetter<"input", undefined>;
+    getIncrementProps: PropGetter<"button", undefined>;
+    getDecrementProps: PropGetter<"button", undefined>;
 };
 type UseNumberInputReturn = ReturnType<typeof useNumberInput>;
-type NumberInputOptions = {
+interface NumberInputOptions {
     /**
      * If `true`, display the addon for the number input.
      */
@@ -107,11 +106,11 @@ type NumberInputOptions = {
     /**
      * Props for container element.
      */
-    containerProps?: HTMLUIProps<"div">;
+    containerProps?: HTMLUIProps;
     /**
      * Props for addon component.
      */
-    addonProps?: HTMLUIProps<"div">;
+    addonProps?: HTMLUIProps;
     /**
      * Props for increment component.
      */
@@ -128,15 +127,16 @@ type NumberInputOptions = {
      * The border color when the input is invalid.
      */
     errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, "colors">;
-};
-type NumberInputProps = Omit<HTMLUIProps<"input">, "disabled" | "required" | "readOnly" | "size" | "onChange"> & ThemeProps<"NumberInput"> & Omit<UseNumberInputProps, "disabled" | "required" | "readOnly"> & NumberInputOptions;
+}
+interface NumberInputProps extends Omit<HTMLUIProps<"input">, "value" | "defaultValue" | "disabled" | "required" | "readOnly" | "size" | "min" | "max" | "step" | "onChange" | "onInvalid">, ThemeProps<"NumberInput">, Omit<UseNumberInputProps, "disabled" | "required" | "readOnly">, NumberInputOptions {
+}
 /**
  * `NumberInput` is a component used to obtain numeric input from the user.
  *
  * @see Docs https://yamada-ui.com/components/forms/number-input
  */
 declare const NumberInput: _yamada_ui_core.Component<"input", NumberInputProps>;
-type NumberIncrementStepperProps = HTMLUIProps<"div">;
-type NumberDecrementStepperProps = HTMLUIProps<"div">;
+type NumberIncrementStepperProps = HTMLUIProps<"button">;
+type NumberDecrementStepperProps = HTMLUIProps<"button">;
 
 export { NumberInput, type NumberInputProps, type UseNumberInputProps, type UseNumberInputReturn, useNumberInput };

package/dist/number-input.d.ts

@@ -1,13 +1,12 @@
 import * as _yamada_ui_core from '@yamada-ui/core';
-import { HTMLUIProps, ThemeProps, ColorModeToken, CSS } from '@yamada-ui/core';
+import { PropGetter, HTMLUIProps, ThemeProps, ColorModeToken, CSS } from '@yamada-ui/core';
 import * as react from 'react';
 import { InputHTMLAttributes } from 'react';
 import { UseFormControlProps } from '@yamada-ui/form-control';
 import { UseCounterProps } from '@yamada-ui/use-counter';
-import { PropGetter } from '@yamada-ui/utils';
 
 type ValidityState = "rangeUnderflow" | "rangeOverflow";
-type UseNumberInputProps = UseFormControlProps<HTMLInputElement> & UseCounterProps & {
+interface UseNumberInputProps extends UseFormControlProps<HTMLInputElement>, UseCounterProps {
     /**
      * The HTML `name` attribute used for forms.
      */
@@ -69,7 +68,7 @@ type UseNumberInputProps = UseFormControlProps<HTMLInputElement> & UseCounterPro
      * If using a custom display format, this converts the default format to the custom format.
      */
     format?: (value: string | number) => string | number;
-};
+}
 declare const useNumberInput: (props?: UseNumberInputProps) => {
     props: {
         _hover?: {} | undefined;
@@ -84,7 +83,7 @@ declare const useNumberInput: (props?: UseNumberInputProps) => {
         "aria-readonly": boolean | undefined;
         "aria-required": boolean | undefined;
         "aria-invalid": boolean | undefined;
-        "data-readonly": boolean | "true" | "false";
+        "data-readonly": boolean | "false" | "true";
         onFocus: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
         onBlur: (event: react.FocusEvent<HTMLInputElement, Element>) => void;
     };
@@ -94,12 +93,12 @@ declare const useNumberInput: (props?: UseNumberInputProps) => {
     isRequired: boolean | undefined;
     isReadOnly: boolean | undefined;
     isDisabled: boolean | undefined;
-    getInputProps: PropGetter;
-    getIncrementProps: PropGetter;
-    getDecrementProps: PropGetter;
+    getInputProps: PropGetter<"input", undefined>;
+    getIncrementProps: PropGetter<"button", undefined>;
+    getDecrementProps: PropGetter<"button", undefined>;
 };
 type UseNumberInputReturn = ReturnType<typeof useNumberInput>;
-type NumberInputOptions = {
+interface NumberInputOptions {
     /**
      * If `true`, display the addon for the number input.
      */
@@ -107,11 +106,11 @@ type NumberInputOptions = {
     /**
      * Props for container element.
      */
-    containerProps?: HTMLUIProps<"div">;
+    containerProps?: HTMLUIProps;
     /**
      * Props for addon component.
      */
-    addonProps?: HTMLUIProps<"div">;
+    addonProps?: HTMLUIProps;
     /**
      * Props for increment component.
      */
@@ -128,15 +127,16 @@ type NumberInputOptions = {
      * The border color when the input is invalid.
      */
     errorBorderColor?: ColorModeToken<CSS.Property.BorderColor, "colors">;
-};
-type NumberInputProps = Omit<HTMLUIProps<"input">, "disabled" | "required" | "readOnly" | "size" | "onChange"> & ThemeProps<"NumberInput"> & Omit<UseNumberInputProps, "disabled" | "required" | "readOnly"> & NumberInputOptions;
+}
+interface NumberInputProps extends Omit<HTMLUIProps<"input">, "value" | "defaultValue" | "disabled" | "required" | "readOnly" | "size" | "min" | "max" | "step" | "onChange" | "onInvalid">, ThemeProps<"NumberInput">, Omit<UseNumberInputProps, "disabled" | "required" | "readOnly">, NumberInputOptions {
+}
 /**
  * `NumberInput` is a component used to obtain numeric input from the user.
  *
  * @see Docs https://yamada-ui.com/components/forms/number-input
  */
 declare const NumberInput: _yamada_ui_core.Component<"input", NumberInputProps>;
-type NumberIncrementStepperProps = HTMLUIProps<"div">;
-type NumberDecrementStepperProps = HTMLUIProps<"div">;
+type NumberIncrementStepperProps = HTMLUIProps<"button">;
+type NumberDecrementStepperProps = HTMLUIProps<"button">;
 
 export { NumberInput, type NumberInputProps, type UseNumberInputProps, type UseNumberInputReturn, useNumberInput };

package/dist/number-input.js

@@ -341,7 +341,6 @@ var useNumberInput = (props = {}) => {
           cursor: readOnly ? "not-allowed" : (_a = props2.style) == null ? void 0 : _a.cursor
         },
         ref: (0, import_utils.mergeRefs)(ref, incrementRef),
-        role: "button",
         tabIndex: -1,
         onPointerDown: (0, import_utils.handlerAll)(props2.onPointerDown, (ev) => {
           if (ev.button === 0 && !trulyDisabled) eventUp(ev);
@@ -376,7 +375,6 @@ var useNumberInput = (props = {}) => {
           cursor: readOnly ? "not-allowed" : (_a = props2.style) == null ? void 0 : _a.cursor
         },
         ref: (0, import_utils.mergeRefs)(ref, decrementRef),
-        role: "button",
         tabIndex: -1,
         onPointerDown: (0, import_utils.handlerAll)(props2.onPointerDown, (ev) => {
           if (ev.button === 0 && !trulyDisabled) eventDown(ev);
@@ -471,7 +469,7 @@ var [NumberInputContextProvider, useNumberInputContext] = (0, import_utils.creat
 });
 var NumberInput = (0, import_core.forwardRef)(
   (props, ref) => {
-    const [styles, mergedProps] = (0, import_core.useMultiComponentStyle)("NumberInput", props);
+    const [styles, mergedProps] = (0, import_core.useComponentMultiStyle)("NumberInput", props);
     const {
       className,
       isStepper = true,
@@ -503,12 +501,7 @@ var NumberInput = (0, import_core.forwardRef)(
             __css: css,
             ...containerProps,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                NumberInputField,
-                {
-                  ...getInputProps(rest, ref)
-                }
-              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NumberInputField, { ...getInputProps(rest, ref) }),
               isStepper ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(NumberInputAddon, { ...addonProps, children: [
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NumberIncrementStepper, { ...incrementProps }),
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NumberDecrementStepper, { ...decrementProps })
@@ -564,7 +557,7 @@ var NumberInputAddon = (0, import_core.forwardRef)(
     );
   }
 );
-var Stepper = (0, import_core.ui)("div", {
+var Stepper = (0, import_core.ui)("button", {
   baseStyle: {
     display: "flex",
     justifyContent: "center",
@@ -577,36 +570,32 @@ var Stepper = (0, import_core.ui)("div", {
     lineHeight: "normal"
   }
 });
-var NumberIncrementStepper = (0, import_core.forwardRef)(
-  ({ className, children, ...rest }, ref) => {
-    const { getIncrementProps, styles } = useNumberInputContext();
-    const css = { ...styles.stepper };
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      Stepper,
-      {
-        className: (0, import_utils.cx)("ui-number-input__stepper--up", className),
-        ...getIncrementProps(rest, ref),
-        __css: css,
-        children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, { __css: { transform: "rotate(180deg)" } })
-      }
-    );
-  }
-);
-var NumberDecrementStepper = (0, import_core.forwardRef)(
-  ({ className, children, ...rest }, ref) => {
-    const { getDecrementProps, styles } = useNumberInputContext();
-    const css = { ...styles.stepper };
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      Stepper,
-      {
-        className: (0, import_utils.cx)("ui-number-input__stepper--down", className),
-        ...getDecrementProps(rest, ref),
-        __css: css,
-        children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, {})
-      }
-    );
-  }
-);
+var NumberIncrementStepper = (0, import_core.forwardRef)(({ className, children, ...rest }, ref) => {
+  const { getIncrementProps, styles } = useNumberInputContext();
+  const css = { ...styles.stepper };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    Stepper,
+    {
+      className: (0, import_utils.cx)("ui-number-input__stepper--up", className),
+      ...getIncrementProps(rest, ref),
+      __css: css,
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, { __css: { transform: "rotate(180deg)" } })
+    }
+  );
+});
+var NumberDecrementStepper = (0, import_core.forwardRef)(({ className, children, ...rest }, ref) => {
+  const { getDecrementProps, styles } = useNumberInputContext();
+  const css = { ...styles.stepper };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    Stepper,
+    {
+      className: (0, import_utils.cx)("ui-number-input__stepper--down", className),
+      ...getDecrementProps(rest, ref),
+      __css: css,
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, {})
+    }
+  );
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   NumberInput,

package/dist/number-input.js.map

@@ -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":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,kBAKO;AAEP,0BAGO;AACP,kBAA4B;AAE5B,yBAA2B;AAC3B,gCAAiC;AACjC,0BAA4B;AAE5B,mBAUO;AAOP,mBAAkE;AAirBxD;AA/qBV,IAAM,0BAA0B,CAAC,cAC/B,gBAAgB,KAAK,SAAS;AAEhC,IAAM,8BAA8B,CAClC,EAAE,KAAK,SAAS,QAAQ,QAAQ,GAChC,YACG;AACH,MAAI,OAAO,KAAM,QAAO;AAExB,QAAM,gBAAgB,WAAW,UAAU;AAC3C,QAAM,uBAAuB,IAAI,WAAW;AAE5C,MAAI,CAAC,wBAAwB,cAAe,QAAO;AAEnD,SAAO,QAAQ,GAAG;AACpB;AAEA,IAAM,UAAU,CAAuC;AAAA,EACrD;AAAA,EACA;AAAA,EACA;AACF,MAAS;AACP,MAAI,QAAQ;AAEZ,MAAI,WAAW,QAAS,SAAQ;AAEhC,MAAI,SAAU,SAAQ;AAEtB,SAAO;AACT;AAyEO,IAAM,iBAAiB,CAAC,QAA6B,CAAC,MAAM;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB;AAAA,IACA,MAAM,OAAO;AAAA,IACb,MAAM,OAAO;AAAA,IACb,MAAM;AAAA,IACN;AAAA,IACA,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,kBAAkB;AAAA,IAClB,UAAU;AAAA,IACV,GAAG;AAAA,EACL,QAAI,yCAAoB,KAAK;AAC7B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,GAAG;AAAA,EACL,QAAI,yBAAW,MAAM,yCAAqB;AAE1C,QAAM,aAAa;AACnB,QAAM,aAAa;AACnB,QAAM,aAAa;AAEnB,QAAM,CAAC,WAAW,UAAU,QAAI,uBAAS,KAAK;AAC9C,QAAM,gBAAgB,EAAE,YAAY;AAEpC,QAAM,eAAW,qBAAyB,IAAI;AAC9C,QAAM,wBAAoB,qBAGhB,IAAI;AACd,QAAM,mBAAe,qBAA0B,IAAI;AACnD,QAAM,mBAAe,qBAA0B,IAAI;AAEnD,QAAM,cAAU;AAAA,QACd,yBAAW,aAAa,CAAC,OAAO;AAnMpC;AAoMM,iBAAW,IAAI;AAEf,UAAI,CAAC,kBAAkB,QAAS;AAEhC,SAAG,OAAO,kBACR,uBAAkB,QAAQ,UAA1B,aAAmC,QAAG,cAAc,UAAjB,mBAAwB;AAC7D,SAAG,cAAc,gBACf,uBAAkB,QAAQ,QAA1B,YAAiC,GAAG,cAAc;AAAA,IACtD,CAAC;AAAA,EACH;AACA,QAAM,aAAS;AAAA,QACb,yBAAW,YAAY,MAAM;AAC3B,iBAAW,KAAK;AAEhB,UAAI,iBAAkB,kBAAiB;AAAA,IACzC,CAAC;AAAA,EACH;AACA,QAAM,gBAAY,6BAAe,aAAa;AAC9C,QAAM,uBAAmB,6BAAe,oBAAoB;AAC5D,QAAM,uBAAmB;AAAA,IACvB,sDAAwB;AAAA,EAC1B;AAEA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,QAAI,+BAAW;AAAA,IACb,OAAO;AAAA,IACP;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,QAAI,OAAO,qDAAmB;AAE9B,QAAI,QAAQ,KAAM,QAAO;AAEzB,WAAO,MAAM,SAAS;AAEtB,WAAO,CAAC,OAAO,SAAY;AAAA,EAC7B,GAAG,CAAC,OAAO,gBAAgB,CAAC;AAE5B,QAAM,eAAW;AAAA,IACf,CAACA,WAAkBA,OAAM,MAAM,EAAE,EAAE,OAAO,gBAAgB,EAAE,KAAK,EAAE;AAAA,IACnE,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,YAAQ;AAAA,IACZ,CAACA,WAAe;AAhQpB;AAgQuB,0DAAYA,YAAZ,YAAsBA;AAAA;AAAA,IACzC,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,aAAS;AAAA,IACb,CAACA,WAAwB;AArQ7B;AAqQiC,6DAAaA,YAAb,YAAuBA,QAAO,SAAS;AAAA;AAAA,IACpE,CAAC,UAAU;AAAA,EACb;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,OAAO,8BAAY,MAAM;AACxB,UAAI,cAAe,SAAQ,UAAU,IAAI;AAAA,IAC3C;AAAA,IACA,CAAC,eAAe,SAAS,QAAQ;AAAA,EACnC;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,OAAO,8BAAY,MAAM;AACxB,UAAI,cAAe,SAAQ,UAAU,IAAI;AAAA,IAC3C;AAAA,IACA,CAAC,eAAe,SAAS,QAAQ;AAAA,EACnC;AAEA,QAAM,uBAAmB,0BAAY,MAAM;AACzC,QAAI,OAAO;AAEX,QAAI,UAAU,GAAI;AAElB,UAAM,mBAAmB,QAAQ,KAAK,MAAM,SAAS,CAAC;AAEtD,QAAI,kBAAkB;AACpB,eAAS,EAAE;AAAA,IACb,OAAO;AACL,UAAI,gBAAgB,IAAK,QAAO;AAEhC,UAAI,gBAAgB,IAAK,QAAO;AAEhC,WAAK,IAAI;AAAA,IACX;AAAA,EACF,GAAG,CAAC,MAAM,KAAK,KAAK,UAAU,OAAO,aAAa,CAAC;AAEnD,QAAM,eAAW;AAAA,IACf,CAAC,OAAsC;AACrC,UAAK,GAAG,YAA2B,YAAa;AAEhD,YAAM,cAAc,MAAM,GAAG,cAAc,KAAK;AAEhD,aAAO,SAAS,WAAW,CAAC;AAE5B,wBAAkB,UAAU;AAAA,QAC1B,OAAO,GAAG,cAAc;AAAA,QACxB,KAAK,GAAG,cAAc;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,OAAO,QAAQ,QAAQ;AAAA,EAC1B;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,OAAsB;AACrB,UAAI,GAAG,YAAY,YAAa;AAEhC,UAAI,CAAC,4BAA4B,IAAI,gBAAgB;AACnD,WAAG,eAAe;AAEpB,YAAM,OAAO,QAAQ,EAAE,KAAK,8BAAY;AAExC,YAAM,SAA+C;AAAA,QACnD,SAAS,MAAM,UAAU,IAAI;AAAA,QAC7B,WAAW,MAAM,UAAU,IAAI;AAAA,QAC/B,MAAM,MAAM,OAAO,GAAG;AAAA,QACtB,KAAK,MAAM,OAAO,GAAG;AAAA,MACvB;AAEA,YAAM,SAAS,OAAO,GAAG,GAAG;AAE5B,UAAI,CAAC,OAAQ;AAEb,SAAG,eAAe;AAClB,aAAO,EAAE;AAAA,IACX;AAAA,IACA,CAAC,WAAW,WAAW,kBAAkB,KAAK,KAAK,UAAU,MAAM;AAAA,EACrE;AAEA,QAAM,EAAE,IAAI,MAAM,MAAM,WAAW,IAAI,WAAW,WAAW,SAAS;AAEtE,uBAAqB,cAAc,CAAC,UAAU,GAAG,YAAY,IAAI;AACjE,uBAAqB,cAAc,CAAC,UAAU,GAAG,YAAY,IAAI;AAEjE,QAAM,iBAAa,0BAAY,MAAM;AACnC,QAAI;AACF,4BAAsB,MAAM;AA1VlC;AA2VQ,uBAAS,YAAT,mBAAkB;AAAA,MACpB,CAAC;AAAA,EACL,GAAG,CAAC,kBAAkB,CAAC;AAEvB,QAAM,cAAU;AAAA,IACd,CAAC,OAAY;AACX,SAAG,eAAe;AAClB,SAAG;AACH,iBAAW;AAAA,IACb;AAAA,IACA,CAAC,YAAY,EAAE;AAAA,EACjB;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,OAAY;AACX,SAAG,eAAe;AAClB,WAAK;AACL,iBAAW;AAAA,IACb;AAAA,IACA,CAAC,YAAY,IAAI;AAAA,EACnB;AAEA,oCAAgB,MAAM;AACpB,QAAI,gBAAgB,KAAK;AACvB,6CAAY,iBAAiB,OAAO,KAAK,GAAG;AAAA,IAC9C,WAAW,gBAAgB,KAAK;AAC9B,6CAAY,iBAAiB,OAAO,KAAK,GAAG;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,eAAe,OAAO,QAAQ,SAAS,CAAC;AAE5C,wCAAoB,MAAM;AACxB,QAAI,CAAC,SAAS,QAAS;AAEvB,UAAM,YAAY,SAAS,QAAQ,SAAS;AAE5C,QAAI,CAAC,UAAW;AAEhB,UAAM,cAAc,MAAM,SAAS,QAAQ,KAAK;AAEhD,aAAS,SAAS,WAAW,CAAC;AAAA,EAChC,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB;AAAA,IACE,MAAM,SAAS;AAAA,IACf;AAAA,IACA,CAAC,OAAO;AAxYZ;AAyYM,YAAM,iBAAgB,oBAAS,YAAT,mBAAkB,kBAAlB,YAAmC;AACzD,YAAMC,aAAY,cAAc,kBAAkB,SAAS;AAE3D,UAAI,CAAC,mBAAmB,CAACA,WAAW;AAEpC,SAAG,eAAe;AAElB,YAAM,OAAO,QAAQ,EAAS,KAAK,8BAAY;AAC/C,YAAM,YAAY,KAAK,KAAK,GAAG,MAAM;AAErC,UAAI,cAAc,IAAI;AACpB,kBAAU,IAAI;AAAA,MAChB,WAAW,cAAc,GAAG;AAC1B,kBAAU,IAAI;AAAA,MAChB;AAAA,IACF;AAAA,IACA,EAAE,SAAS,MAAM;AAAA,EACnB;AAEA,QAAM,oBAA4B;AAAA,IAChC,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN,SAAK,wBAAU,UAAU,GAAG;AAAA,MAC5B,OAAO,OAAO,KAAK;AAAA,MACnB,iBAAiB;AAAA,MACjB,iBAAiB;AAAA,MACjB,iBAAiB,OAAO,MAAM,aAAa,IAAI,SAAY;AAAA,MAC3D,kBAAkB;AAAA,MAClB,oBAAgB,uBAAS,gCAAa,KAAK;AAAA,MAC3C,cAAc;AAAA,MACd,aAAa;AAAA,MACb,cAAU,yBAAWA,OAAM,UAAU,QAAQ;AAAA,MAC7C,eAAW,yBAAWA,OAAM,WAAW,SAAS;AAAA,MAChD,aAAS,yBAAWA,OAAM,SAAS,OAAO;AAAA,MAC1C,YAAQ,yBAAWA,OAAM,QAAQ,MAAM;AAAA,IACzC;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,wBAAgC;AAAA,IACpC,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AApdhC;AAqdM,YAAM,gBAAgB,YAAa,mBAAmB;AAEtD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,GAAG;AAAA,QACH,GAAGA;AAAA,QACH,OAAO;AAAA,UACL,GAAGA,OAAM;AAAA,UACT,QAAQ,WAAW,iBAAgB,KAAAA,OAAM,UAAN,mBAAa;AAAA,QAClD;AAAA,QACA,SAAK,wBAAU,KAAK,YAAY;AAAA,QAChC,MAAM;AAAA,QACN,UAAU;AAAA,QACV,mBAAe,yBAAWA,OAAM,eAAe,CAAC,OAAO;AACrD,cAAI,GAAG,WAAW,KAAK,CAAC,cAAe,SAAQ,EAAE;AAAA,QACnD,CAAC;AAAA,QACD,oBAAgB,yBAAWA,OAAM,gBAAgB,IAAI;AAAA,QACrD,iBAAa,yBAAWA,OAAM,aAAa,IAAI;AAAA,MACjD;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,wBAAgC;AAAA,IACpC,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AAxfhC;AAyfM,YAAM,gBAAgB,YAAa,mBAAmB;AAEtD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,GAAG;AAAA,QACH,GAAGA;AAAA,QACH,OAAO;AAAA,UACL,GAAGA,OAAM;AAAA,UACT,QAAQ,WAAW,iBAAgB,KAAAA,OAAM,UAAN,mBAAa;AAAA,QAClD;AAAA,QACA,SAAK,wBAAU,KAAK,YAAY;AAAA,QAChC,MAAM;AAAA,QACN,UAAU;AAAA,QACV,mBAAe,yBAAWA,OAAM,eAAe,CAAC,OAAO;AACrD,cAAI,GAAG,WAAW,KAAK,CAAC,cAAe,WAAU,EAAE;AAAA,QACrD,CAAC;AAAA,QACD,oBAAgB,yBAAWA,OAAM,gBAAgB,IAAI;AAAA,QACrD,iBAAa,yBAAWA,OAAM,aAAa,IAAI;AAAA,MACjD;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,IACP,OAAO,OAAO,KAAK;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAIA,IAAM,WAAW;AAEjB,IAAM,QAAQ;AAId,IAAM,aAAa,CAAC,WAAqB,cAAwB;AAC/D,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAClD,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAwB,IAAI;AACxD,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,IAAI;AACzC,QAAM,iBAAa,qBAAY,IAAI;AAEnC,QAAM,gBAAgB,MAAM,aAAa,WAAW,OAAO;AAE3D;AAAA,IACE,MAAM;AACJ,UAAI,WAAW,YAAa,WAAU;AAEtC,UAAI,WAAW,YAAa,WAAU;AAAA,IACxC;AAAA,IACA,aAAa,WAAW;AAAA,EAC1B;AAEA,QAAM,SAAK,0BAAY,MAAM;AAC3B,QAAI,OAAQ,WAAU;AAEtB,eAAW,UAAU,WAAW,MAAM;AACpC,gBAAU,KAAK;AACf,oBAAc,IAAI;AAClB,gBAAU,WAAW;AAAA,IACvB,GAAG,KAAK;AAAA,EACV,GAAG,CAAC,WAAW,MAAM,CAAC;AAEtB,QAAM,WAAO,0BAAY,MAAM;AAC7B,QAAI,OAAQ,WAAU;AAEtB,eAAW,UAAU,WAAW,MAAM;AACpC,gBAAU,KAAK;AACf,oBAAc,IAAI;AAClB,gBAAU,WAAW;AAAA,IACvB,GAAG,KAAK;AAAA,EACV,GAAG,CAAC,WAAW,MAAM,CAAC;AAEtB,QAAM,WAAO,0BAAY,MAAM;AAC7B,cAAU,IAAI;AACd,kBAAc,KAAK;AACnB,kBAAc;AAAA,EAChB,GAAG,CAAC,CAAC;AAEL,8BAAU,MAAM;AACd,WAAO,MAAM,cAAc;AAAA,EAC7B,GAAG,CAAC,CAAC;AAEL,SAAO,EAAE,IAAI,MAAM,MAAM,WAAW;AACtC;AAEA,IAAM,uBAAuB,CAC3B,KACA,iBACA,SACA,SACG;AACH,8BAAU,MAAM;AAzmBlB;AA0mBI,QAAI,CAAC,IAAI,WAAW,CAAC,QAAS;AAE9B,UAAM,iBAAgB,SAAI,QAAQ,cAAc,gBAA1B,YAAyC;AAE/D,UAAM,WAAW,IAAI,cAAc,iBAAiB,CAAC,YAAY;AAC/D,iBAAW,EAAE,MAAM,cAAc,KAAK,SAAS;AAC7C,YACE,SAAS,gBACT,iBACA,gBAAgB,SAAS,aAAa;AAEtC,eAAK;AAAA,MACT;AAAA,IACF,CAAC;AAED,aAAS,QAAQ,IAAI,SAAS,EAAE,YAAY,MAAM,gBAAgB,CAAC;AAEnE,WAAO,MAAM,SAAS,WAAW;AAAA,EACnC,CAAC;AACH;AAgDA,IAAM,CAAC,4BAA4B,qBAAqB,QACtD,4BAAkC;AAAA,EAChC,QAAQ;AAAA,EACR,MAAM;AACR,CAAC;AAOI,IAAM,kBAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,eAAe,KAAK;AACzE,UAAM;AAAA,MACJ;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAC9B,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,IACT,IAAI,eAAe,aAAa;AAEhC,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,EAAE,eAAe,mBAAmB,mBAAmB,OAAO;AAAA,QAErE;AAAA,UAAC,eAAG;AAAA,UAAH;AAAA,YACC,eAAW,iBAAG,mBAAmB,SAAS;AAAA,YAC1C,OAAO;AAAA,YACN,GAAG;AAAA,YAEJ;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACE,GAAG,cAAc,MAAoC,GAAG;AAAA;AAAA,cAC3D;AAAA,cAEC,YACC,6CAAC,oBAAkB,GAAG,YACpB;AAAA,4DAAC,0BAAwB,GAAG,gBAAgB;AAAA,gBAC5C,4CAAC,0BAAwB,GAAG,gBAAgB;AAAA,iBAC9C,IACE;AAAA;AAAA;AAAA,QACN;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAOA,IAAM,uBAAmB;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,sBAAsB;AAEzC,UAAM,MAAmB;AAAA,MACvB,OAAO;AAAA,MACP,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,iBAAG,0BAA0B,SAAS;AAAA,QACjD,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAIA,IAAM,uBAAmB;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,sBAAsB;AAEzC,UAAM,MAAmB;AAAA,MACvB,SAAS;AAAA,MACT,eAAe;AAAA,MACf,UAAU;AAAA,MACV,KAAK;AAAA,MACL,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,iBAAG,0BAA0B,SAAS;AAAA,QACjD,eAAW;AAAA,QACX,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,IAAM,cAAU,gBAAG,OAAO;AAAA,EACxB,WAAW;AAAA,IACT,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,oBAAoB;AAAA,IACpB,oBAAoB;AAAA,IACpB,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,YAAY;AAAA,EACd;AACF,CAAC;AAID,IAAM,6BAAyB;AAAA,EAC7B,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,GAAG,QAAQ;AACzC,UAAM,EAAE,mBAAmB,OAAO,IAAI,sBAAsB;AAE5D,UAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAW,iBAAG,gCAAgC,SAAS;AAAA,QACtD,GAAG,kBAAkB,MAAoC,GAAG;AAAA,QAC7D,OAAO;AAAA,QAEN,wCAAY,4CAAC,2BAAY,OAAO,EAAE,WAAW,iBAAiB,GAAG;AAAA;AAAA,IACpE;AAAA,EAEJ;AACF;AAIA,IAAM,6BAAyB;AAAA,EAC7B,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,GAAG,QAAQ;AACzC,UAAM,EAAE,mBAAmB,OAAO,IAAI,sBAAsB;AAE5D,UAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAW,iBAAG,kCAAkC,SAAS;AAAA,QACxD,GAAG,kBAAkB,MAAoC,GAAG;AAAA,QAC7D,OAAO;AAAA,QAEN,wCAAY,4CAAC,2BAAY;AAAA;AAAA,IAC5B;AAAA,EAEJ;AACF;","names":["value","isFocused","props"]}
+{"version":3,"sources":["../src/number-input.tsx"],"sourcesContent":["import type {\n  CSSUIObject,\n  HTMLUIProps,\n  ThemeProps,\n  ColorModeToken,\n  CSS,\n  PropGetter,\n} from \"@yamada-ui/core\"\nimport {\n  ui,\n  forwardRef,\n  useComponentMultiStyle,\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 {\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 interface UseNumberInputProps\n  extends 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: { [key: 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<\"input\"> = 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<\"button\"> = 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        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        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        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\ninterface 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\n  /**\n   * Props for addon component.\n   */\n  addonProps?: HTMLUIProps\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 interface NumberInputProps\n  extends Omit<\n      HTMLUIProps<\"input\">,\n      | \"value\"\n      | \"defaultValue\"\n      | \"disabled\"\n      | \"required\"\n      | \"readOnly\"\n      | \"size\"\n      | \"min\"\n      | \"max\"\n      | \"step\"\n      | \"onChange\"\n      | \"onInvalid\"\n    >,\n    ThemeProps<\"NumberInput\">,\n    Omit<UseNumberInputProps, \"disabled\" | \"required\" | \"readOnly\">,\n    NumberInputOptions {}\n\ninterface NumberInputContext {\n  getInputProps: PropGetter<\"input\">\n  getIncrementProps: PropGetter<\"button\">\n  getDecrementProps: PropGetter<\"button\">\n  styles: { [key: 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] = useComponentMultiStyle(\"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 {...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\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\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(\"button\", {\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<\"button\">\n\nconst NumberIncrementStepper = forwardRef<\n  NumberIncrementStepperProps,\n  \"button\"\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, ref)}\n      __css={css}\n    >\n      {children ?? <ChevronIcon __css={{ transform: \"rotate(180deg)\" }} />}\n    </Stepper>\n  )\n})\n\ntype NumberDecrementStepperProps = HTMLUIProps<\"button\">\n\nconst NumberDecrementStepper = forwardRef<\n  NumberDecrementStepperProps,\n  \"button\"\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, ref)}\n      __css={css}\n    >\n      {children ?? <ChevronIcon />}\n    </Stepper>\n  )\n})\n"],"mappings":"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","names":["value","isFocused","props"]}

package/dist/number-input.mjs

@@ -2,7 +2,7 @@
 import {
   NumberInput,
   useNumberInput
-} from "./chunk-NCOASV6M.mjs";
+} from "./chunk-JMDHK253.mjs";
 export {
   NumberInput,
   useNumberInput

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yamada-ui/number-input",
-  "version": "1.1.13",
+  "version": "1.1.14-dev-20240917033401",
   "description": "Yamada UI number input component",
   "keywords": [
     "yamada",
@@ -36,13 +36,13 @@
     "url": "https://github.com/yamada-ui/yamada-ui/issues"
   },
   "dependencies": {
-    "@yamada-ui/core": "1.14.0",
-    "@yamada-ui/form-control": "2.1.1",
-    "@yamada-ui/icon": "1.1.5",
-    "@yamada-ui/use-counter": "1.0.20",
-    "@yamada-ui/use-event-listener": "1.0.19",
-    "@yamada-ui/use-interval": "1.0.19",
-    "@yamada-ui/utils": "1.5.0"
+    "@yamada-ui/core": "1.14.1-dev-20240917033401",
+    "@yamada-ui/form-control": "2.1.2-dev-20240917033401",
+    "@yamada-ui/icon": "1.1.6-dev-20240917033401",
+    "@yamada-ui/use-counter": "1.0.21-dev-20240917033401",
+    "@yamada-ui/use-event-listener": "1.0.20-dev-20240917033401",
+    "@yamada-ui/use-interval": "1.0.20-dev-20240917033401",
+    "@yamada-ui/utils": "1.5.1-dev-20240917033401"
   },
   "devDependencies": {
     "clean-package": "2.2.0",

package/dist/chunk-NCOASV6M.mjs.map

@@ -1 +0,0 @@
-{"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":";;;AAOA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,mBAAmB;AAE5B,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAE5B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAOP,SAAS,aAAa,WAAW,SAAS,QAAQ,gBAAgB;AAirBxD,cAKE,YALF;AA/qBV,IAAM,0BAA0B,CAAC,cAC/B,gBAAgB,KAAK,SAAS;AAEhC,IAAM,8BAA8B,CAClC,EAAE,KAAK,SAAS,QAAQ,QAAQ,GAChC,YACG;AACH,MAAI,OAAO,KAAM,QAAO;AAExB,QAAM,gBAAgB,WAAW,UAAU;AAC3C,QAAM,uBAAuB,IAAI,WAAW;AAE5C,MAAI,CAAC,wBAAwB,cAAe,QAAO;AAEnD,SAAO,QAAQ,GAAG;AACpB;AAEA,IAAM,UAAU,CAAuC;AAAA,EACrD;AAAA,EACA;AAAA,EACA;AACF,MAAS;AACP,MAAI,QAAQ;AAEZ,MAAI,WAAW,QAAS,SAAQ;AAEhC,MAAI,SAAU,SAAQ;AAEtB,SAAO;AACT;AAyEO,IAAM,iBAAiB,CAAC,QAA6B,CAAC,MAAM;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB;AAAA,IACA,MAAM,OAAO;AAAA,IACb,MAAM,OAAO;AAAA,IACb,MAAM;AAAA,IACN;AAAA,IACA,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,kBAAkB;AAAA,IAClB,UAAU;AAAA,IACV,GAAG;AAAA,EACL,IAAI,oBAAoB,KAAK;AAC7B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,GAAG;AAAA,EACL,IAAI,WAAW,MAAM,qBAAqB;AAE1C,QAAM,aAAa;AACnB,QAAM,aAAa;AACnB,QAAM,aAAa;AAEnB,QAAM,CAAC,WAAW,UAAU,IAAI,SAAS,KAAK;AAC9C,QAAM,gBAAgB,EAAE,YAAY;AAEpC,QAAM,WAAW,OAAyB,IAAI;AAC9C,QAAM,oBAAoB,OAGhB,IAAI;AACd,QAAM,eAAe,OAA0B,IAAI;AACnD,QAAM,eAAe,OAA0B,IAAI;AAEnD,QAAM,UAAU;AAAA,IACd,WAAW,aAAa,CAAC,OAAO;AAnMpC;AAoMM,iBAAW,IAAI;AAEf,UAAI,CAAC,kBAAkB,QAAS;AAEhC,SAAG,OAAO,kBACR,uBAAkB,QAAQ,UAA1B,aAAmC,QAAG,cAAc,UAAjB,mBAAwB;AAC7D,SAAG,cAAc,gBACf,uBAAkB,QAAQ,QAA1B,YAAiC,GAAG,cAAc;AAAA,IACtD,CAAC;AAAA,EACH;AACA,QAAM,SAAS;AAAA,IACb,WAAW,YAAY,MAAM;AAC3B,iBAAW,KAAK;AAEhB,UAAI,iBAAkB,kBAAiB;AAAA,IACzC,CAAC;AAAA,EACH;AACA,QAAM,YAAY,eAAe,aAAa;AAC9C,QAAM,mBAAmB,eAAe,oBAAoB;AAC5D,QAAM,mBAAmB;AAAA,IACvB,sDAAwB;AAAA,EAC1B;AAEA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI,WAAW;AAAA,IACb,OAAO;AAAA,IACP;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,YAAY,QAAQ,MAAM;AAC9B,QAAI,OAAO,qDAAmB;AAE9B,QAAI,QAAQ,KAAM,QAAO;AAEzB,WAAO,MAAM,SAAS;AAEtB,WAAO,CAAC,OAAO,SAAY;AAAA,EAC7B,GAAG,CAAC,OAAO,gBAAgB,CAAC;AAE5B,QAAM,WAAW;AAAA,IACf,CAACA,WAAkBA,OAAM,MAAM,EAAE,EAAE,OAAO,gBAAgB,EAAE,KAAK,EAAE;AAAA,IACnE,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,QAAQ;AAAA,IACZ,CAACA,WAAe;AAhQpB;AAgQuB,0DAAYA,YAAZ,YAAsBA;AAAA;AAAA,IACzC,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,SAAS;AAAA,IACb,CAACA,WAAwB;AArQ7B;AAqQiC,6DAAaA,YAAb,YAAuBA,QAAO,SAAS;AAAA;AAAA,IACpE,CAAC,UAAU;AAAA,EACb;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,OAAO,8BAAY,MAAM;AACxB,UAAI,cAAe,SAAQ,UAAU,IAAI;AAAA,IAC3C;AAAA,IACA,CAAC,eAAe,SAAS,QAAQ;AAAA,EACnC;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,OAAO,8BAAY,MAAM;AACxB,UAAI,cAAe,SAAQ,UAAU,IAAI;AAAA,IAC3C;AAAA,IACA,CAAC,eAAe,SAAS,QAAQ;AAAA,EACnC;AAEA,QAAM,mBAAmB,YAAY,MAAM;AACzC,QAAI,OAAO;AAEX,QAAI,UAAU,GAAI;AAElB,UAAM,mBAAmB,QAAQ,KAAK,MAAM,SAAS,CAAC;AAEtD,QAAI,kBAAkB;AACpB,eAAS,EAAE;AAAA,IACb,OAAO;AACL,UAAI,gBAAgB,IAAK,QAAO;AAEhC,UAAI,gBAAgB,IAAK,QAAO;AAEhC,WAAK,IAAI;AAAA,IACX;AAAA,EACF,GAAG,CAAC,MAAM,KAAK,KAAK,UAAU,OAAO,aAAa,CAAC;AAEnD,QAAM,WAAW;AAAA,IACf,CAAC,OAAsC;AACrC,UAAK,GAAG,YAA2B,YAAa;AAEhD,YAAM,cAAc,MAAM,GAAG,cAAc,KAAK;AAEhD,aAAO,SAAS,WAAW,CAAC;AAE5B,wBAAkB,UAAU;AAAA,QAC1B,OAAO,GAAG,cAAc;AAAA,QACxB,KAAK,GAAG,cAAc;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,OAAO,QAAQ,QAAQ;AAAA,EAC1B;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,OAAsB;AACrB,UAAI,GAAG,YAAY,YAAa;AAEhC,UAAI,CAAC,4BAA4B,IAAI,gBAAgB;AACnD,WAAG,eAAe;AAEpB,YAAM,OAAO,QAAQ,EAAE,KAAK,8BAAY;AAExC,YAAM,SAA+C;AAAA,QACnD,SAAS,MAAM,UAAU,IAAI;AAAA,QAC7B,WAAW,MAAM,UAAU,IAAI;AAAA,QAC/B,MAAM,MAAM,OAAO,GAAG;AAAA,QACtB,KAAK,MAAM,OAAO,GAAG;AAAA,MACvB;AAEA,YAAM,SAAS,OAAO,GAAG,GAAG;AAE5B,UAAI,CAAC,OAAQ;AAEb,SAAG,eAAe;AAClB,aAAO,EAAE;AAAA,IACX;AAAA,IACA,CAAC,WAAW,WAAW,kBAAkB,KAAK,KAAK,UAAU,MAAM;AAAA,EACrE;AAEA,QAAM,EAAE,IAAI,MAAM,MAAM,WAAW,IAAI,WAAW,WAAW,SAAS;AAEtE,uBAAqB,cAAc,CAAC,UAAU,GAAG,YAAY,IAAI;AACjE,uBAAqB,cAAc,CAAC,UAAU,GAAG,YAAY,IAAI;AAEjE,QAAM,aAAa,YAAY,MAAM;AACnC,QAAI;AACF,4BAAsB,MAAM;AA1VlC;AA2VQ,uBAAS,YAAT,mBAAkB;AAAA,MACpB,CAAC;AAAA,EACL,GAAG,CAAC,kBAAkB,CAAC;AAEvB,QAAM,UAAU;AAAA,IACd,CAAC,OAAY;AACX,SAAG,eAAe;AAClB,SAAG;AACH,iBAAW;AAAA,IACb;AAAA,IACA,CAAC,YAAY,EAAE;AAAA,EACjB;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,OAAY;AACX,SAAG,eAAe;AAClB,WAAK;AACL,iBAAW;AAAA,IACb;AAAA,IACA,CAAC,YAAY,IAAI;AAAA,EACnB;AAEA,kBAAgB,MAAM;AACpB,QAAI,gBAAgB,KAAK;AACvB,6CAAY,iBAAiB,OAAO,KAAK,GAAG;AAAA,IAC9C,WAAW,gBAAgB,KAAK;AAC9B,6CAAY,iBAAiB,OAAO,KAAK,GAAG;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,eAAe,OAAO,QAAQ,SAAS,CAAC;AAE5C,sBAAoB,MAAM;AACxB,QAAI,CAAC,SAAS,QAAS;AAEvB,UAAM,YAAY,SAAS,QAAQ,SAAS;AAE5C,QAAI,CAAC,UAAW;AAEhB,UAAM,cAAc,MAAM,SAAS,QAAQ,KAAK;AAEhD,aAAS,SAAS,WAAW,CAAC;AAAA,EAChC,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB;AAAA,IACE,MAAM,SAAS;AAAA,IACf;AAAA,IACA,CAAC,OAAO;AAxYZ;AAyYM,YAAM,iBAAgB,oBAAS,YAAT,mBAAkB,kBAAlB,YAAmC;AACzD,YAAMC,aAAY,cAAc,kBAAkB,SAAS;AAE3D,UAAI,CAAC,mBAAmB,CAACA,WAAW;AAEpC,SAAG,eAAe;AAElB,YAAM,OAAO,QAAQ,EAAS,KAAK,8BAAY;AAC/C,YAAM,YAAY,KAAK,KAAK,GAAG,MAAM;AAErC,UAAI,cAAc,IAAI;AACpB,kBAAU,IAAI;AAAA,MAChB,WAAW,cAAc,GAAG;AAC1B,kBAAU,IAAI;AAAA,MAChB;AAAA,IACF;AAAA,IACA,EAAE,SAAS,MAAM;AAAA,EACnB;AAEA,QAAM,gBAA4B;AAAA,IAChC,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN,KAAK,UAAU,UAAU,GAAG;AAAA,MAC5B,OAAO,OAAO,KAAK;AAAA,MACnB,iBAAiB;AAAA,MACjB,iBAAiB;AAAA,MACjB,iBAAiB,OAAO,MAAM,aAAa,IAAI,SAAY;AAAA,MAC3D,kBAAkB;AAAA,MAClB,gBAAgB,SAAS,gCAAa,KAAK;AAAA,MAC3C,cAAc;AAAA,MACd,aAAa;AAAA,MACb,UAAU,WAAWA,OAAM,UAAU,QAAQ;AAAA,MAC7C,WAAW,WAAWA,OAAM,WAAW,SAAS;AAAA,MAChD,SAAS,WAAWA,OAAM,SAAS,OAAO;AAAA,MAC1C,QAAQ,WAAWA,OAAM,QAAQ,MAAM;AAAA,IACzC;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAAgC;AAAA,IACpC,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AApdhC;AAqdM,YAAM,gBAAgB,YAAa,mBAAmB;AAEtD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,GAAG;AAAA,QACH,GAAGA;AAAA,QACH,OAAO;AAAA,UACL,GAAGA,OAAM;AAAA,UACT,QAAQ,WAAW,iBAAgB,KAAAA,OAAM,UAAN,mBAAa;AAAA,QAClD;AAAA,QACA,KAAK,UAAU,KAAK,YAAY;AAAA,QAChC,MAAM;AAAA,QACN,UAAU;AAAA,QACV,eAAe,WAAWA,OAAM,eAAe,CAAC,OAAO;AACrD,cAAI,GAAG,WAAW,KAAK,CAAC,cAAe,SAAQ,EAAE;AAAA,QACnD,CAAC;AAAA,QACD,gBAAgB,WAAWA,OAAM,gBAAgB,IAAI;AAAA,QACrD,aAAa,WAAWA,OAAM,aAAa,IAAI;AAAA,MACjD;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAAgC;AAAA,IACpC,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AAxfhC;AAyfM,YAAM,gBAAgB,YAAa,mBAAmB;AAEtD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,GAAG;AAAA,QACH,GAAGA;AAAA,QACH,OAAO;AAAA,UACL,GAAGA,OAAM;AAAA,UACT,QAAQ,WAAW,iBAAgB,KAAAA,OAAM,UAAN,mBAAa;AAAA,QAClD;AAAA,QACA,KAAK,UAAU,KAAK,YAAY;AAAA,QAChC,MAAM;AAAA,QACN,UAAU;AAAA,QACV,eAAe,WAAWA,OAAM,eAAe,CAAC,OAAO;AACrD,cAAI,GAAG,WAAW,KAAK,CAAC,cAAe,WAAU,EAAE;AAAA,QACrD,CAAC;AAAA,QACD,gBAAgB,WAAWA,OAAM,gBAAgB,IAAI;AAAA,QACrD,aAAa,WAAWA,OAAM,aAAa,IAAI;AAAA,MACjD;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,IACP,OAAO,OAAO,KAAK;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAIA,IAAM,WAAW;AAEjB,IAAM,QAAQ;AAId,IAAM,aAAa,CAAC,WAAqB,cAAwB;AAC/D,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAClD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAwB,IAAI;AACxD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,IAAI;AACzC,QAAM,aAAa,OAAY,IAAI;AAEnC,QAAM,gBAAgB,MAAM,aAAa,WAAW,OAAO;AAE3D;AAAA,IACE,MAAM;AACJ,UAAI,WAAW,YAAa,WAAU;AAEtC,UAAI,WAAW,YAAa,WAAU;AAAA,IACxC;AAAA,IACA,aAAa,WAAW;AAAA,EAC1B;AAEA,QAAM,KAAK,YAAY,MAAM;AAC3B,QAAI,OAAQ,WAAU;AAEtB,eAAW,UAAU,WAAW,MAAM;AACpC,gBAAU,KAAK;AACf,oBAAc,IAAI;AAClB,gBAAU,WAAW;AAAA,IACvB,GAAG,KAAK;AAAA,EACV,GAAG,CAAC,WAAW,MAAM,CAAC;AAEtB,QAAM,OAAO,YAAY,MAAM;AAC7B,QAAI,OAAQ,WAAU;AAEtB,eAAW,UAAU,WAAW,MAAM;AACpC,gBAAU,KAAK;AACf,oBAAc,IAAI;AAClB,gBAAU,WAAW;AAAA,IACvB,GAAG,KAAK;AAAA,EACV,GAAG,CAAC,WAAW,MAAM,CAAC;AAEtB,QAAM,OAAO,YAAY,MAAM;AAC7B,cAAU,IAAI;AACd,kBAAc,KAAK;AACnB,kBAAc;AAAA,EAChB,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,WAAO,MAAM,cAAc;AAAA,EAC7B,GAAG,CAAC,CAAC;AAEL,SAAO,EAAE,IAAI,MAAM,MAAM,WAAW;AACtC;AAEA,IAAM,uBAAuB,CAC3B,KACA,iBACA,SACA,SACG;AACH,YAAU,MAAM;AAzmBlB;AA0mBI,QAAI,CAAC,IAAI,WAAW,CAAC,QAAS;AAE9B,UAAM,iBAAgB,SAAI,QAAQ,cAAc,gBAA1B,YAAyC;AAE/D,UAAM,WAAW,IAAI,cAAc,iBAAiB,CAAC,YAAY;AAC/D,iBAAW,EAAE,MAAM,cAAc,KAAK,SAAS;AAC7C,YACE,SAAS,gBACT,iBACA,gBAAgB,SAAS,aAAa;AAEtC,eAAK;AAAA,MACT;AAAA,IACF,CAAC;AAED,aAAS,QAAQ,IAAI,SAAS,EAAE,YAAY,MAAM,gBAAgB,CAAC;AAEnE,WAAO,MAAM,SAAS,WAAW;AAAA,EACnC,CAAC;AACH;AAgDA,IAAM,CAAC,4BAA4B,qBAAqB,IACtD,cAAkC;AAAA,EAChC,QAAQ;AAAA,EACR,MAAM;AACR,CAAC;AAOI,IAAM,cAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,CAAC,QAAQ,WAAW,IAAI,uBAAuB,eAAe,KAAK;AACzE,UAAM;AAAA,MACJ;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,eAAe,WAAW;AAC9B,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,IACT,IAAI,eAAe,aAAa;AAEhC,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,EAAE,eAAe,mBAAmB,mBAAmB,OAAO;AAAA,QAErE;AAAA,UAAC,GAAG;AAAA,UAAH;AAAA,YACC,WAAW,GAAG,mBAAmB,SAAS;AAAA,YAC1C,OAAO;AAAA,YACN,GAAG;AAAA,YAEJ;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACE,GAAG,cAAc,MAAoC,GAAG;AAAA;AAAA,cAC3D;AAAA,cAEC,YACC,qBAAC,oBAAkB,GAAG,YACpB;AAAA,oCAAC,0BAAwB,GAAG,gBAAgB;AAAA,gBAC5C,oBAAC,0BAAwB,GAAG,gBAAgB;AAAA,iBAC9C,IACE;AAAA;AAAA;AAAA,QACN;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAOA,IAAM,mBAAmB;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,sBAAsB;AAEzC,UAAM,MAAmB;AAAA,MACvB,OAAO;AAAA,MACP,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,WAAW,GAAG,0BAA0B,SAAS;AAAA,QACjD,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAIA,IAAM,mBAAmB;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,sBAAsB;AAEzC,UAAM,MAAmB;AAAA,MACvB,SAAS;AAAA,MACT,eAAe;AAAA,MACf,UAAU;AAAA,MACV,KAAK;AAAA,MACL,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,WAAW,GAAG,0BAA0B,SAAS;AAAA,QACjD,eAAW;AAAA,QACX,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,IAAM,UAAU,GAAG,OAAO;AAAA,EACxB,WAAW;AAAA,IACT,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,oBAAoB;AAAA,IACpB,oBAAoB;AAAA,IACpB,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,YAAY;AAAA,EACd;AACF,CAAC;AAID,IAAM,yBAAyB;AAAA,EAC7B,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,GAAG,QAAQ;AACzC,UAAM,EAAE,mBAAmB,OAAO,IAAI,sBAAsB;AAE5D,UAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,GAAG,gCAAgC,SAAS;AAAA,QACtD,GAAG,kBAAkB,MAAoC,GAAG;AAAA,QAC7D,OAAO;AAAA,QAEN,wCAAY,oBAAC,eAAY,OAAO,EAAE,WAAW,iBAAiB,GAAG;AAAA;AAAA,IACpE;AAAA,EAEJ;AACF;AAIA,IAAM,yBAAyB;AAAA,EAC7B,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,GAAG,QAAQ;AACzC,UAAM,EAAE,mBAAmB,OAAO,IAAI,sBAAsB;AAE5D,UAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,GAAG,kCAAkC,SAAS;AAAA,QACxD,GAAG,kBAAkB,MAAoC,GAAG;AAAA,QAC7D,OAAO;AAAA,QAEN,wCAAY,oBAAC,eAAY;AAAA;AAAA,IAC5B;AAAA,EAEJ;AACF;","names":["value","isFocused","props"]}