@octanejs/base-ui 0.1.49 → 0.1.51

package/dist/cjs/number-field.cjs

@@ -1,812 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var number_field_exports = {};
-__export(number_field_exports, {
-  NumberField: () => NumberField
-});
-module.exports = __toCommonJS(number_field_exports);
-var import_octane = require("octane");
-var import_internal = require("./internal.cjs");
-var import_useRenderElement = require("./utils/useRenderElement.cjs");
-var import_composeRefs = require("./utils/composeRefs.cjs");
-var import_useControlled = require("./utils/useControlled.cjs");
-var import_useStableCallback = require("./utils/useStableCallback.cjs");
-var import_useValueAsRef = require("./utils/useValueAsRef.cjs");
-var import_useValueChanged = require("./utils/useValueChanged.cjs");
-var import_useForcedRerendering = require("./utils/useForcedRerendering.cjs");
-var import_addEventListener = require("./utils/addEventListener.cjs");
-var import_platform = require("./utils/platform.cjs");
-var import_owner = require("./utils/owner.cjs");
-var import_visuallyHidden = require("./utils/visuallyHidden.cjs");
-var import_list_utils = require("./utils/composite/list-utils.cjs");
-var import_useButton = require("./utils/useButton.cjs");
-var import_useLabelableId = require("./utils/field/useLabelableId.cjs");
-var import_formatNumber = require("./utils/formatNumber.cjs");
-var import_constants = require("./utils/field/constants.cjs");
-var import_FieldRootContext = require("./utils/field/FieldRootContext.cjs");
-var import_FormContext = require("./utils/field/FormContext.cjs");
-var import_LabelableContext = require("./utils/field/LabelableContext.cjs");
-var import_useRegisterFieldControl = require("./utils/field/useRegisterFieldControl.cjs");
-var import_createChangeEventDetails = require("./utils/createChangeEventDetails.cjs");
-var import_parse = require("./utils/number/parse.cjs");
-var import_validate = require("./utils/number/validate.cjs");
-var import_usePressAndHold = require("./utils/usePressAndHold.cjs");
-var import_constants2 = require("./utils/number/constants.cjs");
-const NAVIGATE_KEYS = /* @__PURE__ */ new Set([
-  "Backspace",
-  "Delete",
-  "ArrowLeft",
-  "ArrowRight",
-  "Tab",
-  "Enter",
-  "Escape"
-]);
-function activeElement(doc) {
-  return doc.activeElement;
-}
-const stateAttributesMapping = {
-  inputValue: () => null,
-  value: () => null,
-  ...import_constants.fieldValidityMapping
-};
-const NumberFieldRootContext = (0, import_octane.createContext)(void 0);
-function useNumberFieldRootContext() {
-  const context = (0, import_octane.useContext)(NumberFieldRootContext);
-  if (context === void 0) {
-    throw new Error(
-      "Base UI: NumberFieldRootContext is missing. NumberField parts must be placed within <NumberField.Root>."
-    );
-  }
-  return context;
-}
-function NumberFieldRoot(props) {
-  const slot = (0, import_internal.S)("NumberFieldRoot");
-  const {
-    id: idProp,
-    min,
-    max,
-    smallStep = 0.1,
-    step: stepProp = 1,
-    largeStep = 10,
-    required = false,
-    disabled: disabledProp = false,
-    readOnly = false,
-    form,
-    name: nameProp,
-    defaultValue,
-    value: valueProp,
-    onValueChange: onValueChangeProp,
-    onValueCommitted: onValueCommittedProp,
-    allowWheelScrub = false,
-    snapOnStep = false,
-    allowOutOfRange = false,
-    format,
-    locale,
-    render,
-    className,
-    inputRef: inputRefProp,
-    style,
-    ref,
-    ...elementProps
-  } = props;
-  const {
-    setDirty,
-    validityData,
-    disabled: fieldDisabled,
-    setFilled,
-    invalid,
-    name: fieldName,
-    state: fieldState,
-    validation
-  } = (0, import_FieldRootContext.useFieldRootContext)();
-  const { clearErrors } = (0, import_FormContext.useFormContext)();
-  const disabled = fieldDisabled || disabledProp;
-  const name = fieldName ?? nameProp;
-  const step = stepProp === "any" ? 1 : stepProp;
-  const [isScrubbing, setIsScrubbing] = (0, import_octane.useState)(false, (0, import_internal.subSlot)(slot, "scrubbing"));
-  const minWithDefault = min ?? Number.MIN_SAFE_INTEGER;
-  const maxWithDefault = max ?? Number.MAX_SAFE_INTEGER;
-  const minWithZeroDefault = min ?? 0;
-  const formatStyle = format?.style;
-  const inputRef = (0, import_octane.useRef)(null, (0, import_internal.subSlot)(slot, "inputRef"));
-  const hiddenInputRef = (0, import_composeRefs.useComposedRefs)(
-    inputRefProp,
-    validation.inputRef,
-    (0, import_internal.subSlot)(slot, "hiddenRef")
-  );
-  const id = (0, import_useLabelableId.useLabelableId)({ id: idProp }, (0, import_internal.subSlot)(slot, "id"));
-  const [valueUnwrapped, setValueUnwrapped] = (0, import_useControlled.useControlled)(
-    { controlled: valueProp, default: defaultValue, name: "NumberField", state: "value" },
-    (0, import_internal.subSlot)(slot, "value")
-  );
-  const value = valueUnwrapped ?? null;
-  const valueRef = (0, import_useValueAsRef.useValueAsRef)(value, (0, import_internal.subSlot)(slot, "valueRef"));
-  (0, import_octane.useLayoutEffect)(() => setFilled(value !== null), [setFilled, value], (0, import_internal.subSlot)(slot, "e:filled"));
-  const forceRender = (0, import_useForcedRerendering.useForcedRerendering)((0, import_internal.subSlot)(slot, "force"));
-  const formatOptionsRef = (0, import_useValueAsRef.useValueAsRef)(
-    format,
-    (0, import_internal.subSlot)(slot, "fmtRef")
-  );
-  const hasPendingCommitRef = (0, import_octane.useRef)(false, (0, import_internal.subSlot)(slot, "pending"));
-  const onValueCommitted = (0, import_useStableCallback.useStableCallback)(
-    (nextValue, eventDetails) => {
-      hasPendingCommitRef.current = false;
-      onValueCommittedProp?.(nextValue, eventDetails);
-    },
-    (0, import_internal.subSlot)(slot, "commit")
-  );
-  const allowInputSyncRef = (0, import_octane.useRef)(true, (0, import_internal.subSlot)(slot, "allowSync"));
-  const lastChangedValueRef = (0, import_octane.useRef)(null, (0, import_internal.subSlot)(slot, "lastChanged"));
-  const [inputValue, setInputValue] = (0, import_octane.useState)(
-    () => (0, import_formatNumber.formatNumber)(value, locale, format),
-    (0, import_internal.subSlot)(slot, "inputValue")
-  );
-  const [inputMode, setInputMode] = (0, import_octane.useState)("numeric", (0, import_internal.subSlot)(slot, "inputMode"));
-  const getAllowedNonNumericKeys = (0, import_useStableCallback.useStableCallback)(
-    () => {
-      const { decimal, group, currency, literal } = (0, import_parse.getNumberLocaleDetails)(locale, format);
-      const keys = /* @__PURE__ */ new Set();
-      import_parse.BASE_NON_NUMERIC_SYMBOLS.forEach((symbol) => keys.add(symbol));
-      if (decimal) keys.add(decimal);
-      if (group) {
-        keys.add(group);
-        if (import_parse.SPACE_SEPARATOR_RE.test(group)) keys.add(" ");
-      }
-      const allowPercentSymbols = formatStyle === "percent" || formatStyle === "unit" && format?.unit === "percent";
-      const allowPermilleSymbols = formatStyle === "percent" || formatStyle === "unit" && format?.unit === "permille";
-      if (allowPercentSymbols) import_parse.PERCENTAGES.forEach((key) => keys.add(key));
-      if (allowPermilleSymbols) import_parse.PERMILLE.forEach((key) => keys.add(key));
-      if (formatStyle === "currency" && currency) keys.add(currency);
-      if (literal) {
-        Array.from(literal).forEach((char) => keys.add(char));
-        if (import_parse.SPACE_SEPARATOR_RE.test(literal)) keys.add(" ");
-      }
-      import_parse.PLUS_SIGNS_WITH_ASCII.forEach((key) => keys.add(key));
-      if (minWithDefault < 0 || allowOutOfRange) {
-        import_parse.MINUS_SIGNS_WITH_ASCII.forEach((key) => keys.add(key));
-      }
-      return keys;
-    },
-    (0, import_internal.subSlot)(slot, "allowedKeys")
-  );
-  const getStepAmount = (0, import_useStableCallback.useStableCallback)(
-    (event) => {
-      if (event?.altKey) return smallStep;
-      if (event?.shiftKey) return largeStep;
-      return step;
-    },
-    (0, import_internal.subSlot)(slot, "stepAmount")
-  );
-  const setValue = (0, import_useStableCallback.useStableCallback)(
-    (unvalidatedValue, details) => {
-      const eventWithOptionalKeyState = details.event;
-      const dir = details.direction;
-      const isInputReason = details.reason === import_createChangeEventDetails.REASONS.inputChange || details.reason === "input-clear" || details.reason === "input-blur" || details.reason === "input-paste" || details.reason === import_createChangeEventDetails.REASONS.none;
-      const shouldClampValue = !allowOutOfRange || !isInputReason;
-      const validatedValue = (0, import_validate.toValidatedNumber)(unvalidatedValue, {
-        step: dir ? getStepAmount(eventWithOptionalKeyState) * dir : void 0,
-        format: formatOptionsRef.current,
-        minWithDefault,
-        maxWithDefault,
-        minWithZeroDefault,
-        snapOnStep,
-        small: eventWithOptionalKeyState?.altKey ?? false,
-        clamp: shouldClampValue
-      });
-      const shouldFireChange = validatedValue !== value || isInputReason && (unvalidatedValue !== value || allowInputSyncRef.current === false);
-      if (shouldFireChange) {
-        onValueChangeProp?.(validatedValue, details);
-        if (details.isCanceled) return false;
-        setValueUnwrapped(validatedValue);
-        setDirty(validatedValue !== validityData.initialValue);
-        hasPendingCommitRef.current = true;
-      }
-      lastChangedValueRef.current = validatedValue;
-      if (allowInputSyncRef.current) {
-        setInputValue((0, import_formatNumber.formatNumber)(validatedValue, locale, format));
-      }
-      forceRender();
-      return shouldFireChange;
-    },
-    (0, import_internal.subSlot)(slot, "setValue")
-  );
-  const incrementValue = (0, import_useStableCallback.useStableCallback)(
-    (amount, params) => {
-      const { direction, currentValue, event, reason } = params;
-      const prevValue = currentValue == null ? valueRef.current : currentValue;
-      if (typeof prevValue !== "number") {
-        return setValue(0, (0, import_createChangeEventDetails.createChangeEventDetails)(reason, event));
-      }
-      return setValue(
-        prevValue + amount * direction,
-        (0, import_createChangeEventDetails.createChangeEventDetails)(reason, event, void 0, { direction })
-      );
-    },
-    (0, import_internal.subSlot)(slot, "increment")
-  );
-  (0, import_octane.useLayoutEffect)(
-    () => {
-      if (!allowInputSyncRef.current) return;
-      const nextInputValue = (0, import_formatNumber.formatNumber)(value, locale, format);
-      if (nextInputValue !== inputValue) setInputValue(nextInputValue);
-    },
-    void 0,
-    (0, import_internal.subSlot)(slot, "e:syncInput")
-  );
-  (0, import_octane.useLayoutEffect)(
-    () => {
-      if (!import_platform.platform.os.ios) return;
-      let computedInputMode = "text";
-      if (minWithDefault >= 0) computedInputMode = "decimal";
-      setInputMode(computedInputMode);
-    },
-    [minWithDefault],
-    (0, import_internal.subSlot)(slot, "e:inputMode")
-  );
-  (0, import_octane.useEffect)(
-    () => {
-      const element2 = inputRef.current;
-      if (disabled || readOnly || !allowWheelScrub || !element2) return void 0;
-      function handleWheel(event) {
-        if (event.ctrlKey || activeElement((0, import_owner.ownerDocument)(inputRef.current)) !== inputRef.current) {
-          return;
-        }
-        event.preventDefault();
-        allowInputSyncRef.current = true;
-        const amount = getStepAmount(event);
-        const changed = incrementValue(amount, {
-          direction: event.deltaY > 0 ? -1 : 1,
-          event,
-          reason: "wheel"
-        });
-        if (changed) {
-          onValueCommitted(
-            lastChangedValueRef.current ?? valueRef.current,
-            (0, import_createChangeEventDetails.createChangeEventDetails)("wheel", event)
-          );
-        }
-      }
-      return (0, import_addEventListener.addEventListener)(element2, "wheel", handleWheel);
-    },
-    [allowWheelScrub, incrementValue, disabled, readOnly, getStepAmount, onValueCommitted],
-    (0, import_internal.subSlot)(slot, "e:wheel")
-  );
-  const state = (0, import_octane.useMemo)(
-    () => ({
-      ...fieldState,
-      disabled,
-      readOnly,
-      required,
-      value,
-      inputValue,
-      scrubbing: isScrubbing
-    }),
-    [fieldState, disabled, readOnly, required, value, inputValue, isScrubbing],
-    (0, import_internal.subSlot)(slot, "state")
-  );
-  const contextValue = (0, import_octane.useMemo)(
-    () => ({
-      inputRef,
-      inputValue,
-      value,
-      minWithDefault,
-      maxWithDefault,
-      disabled,
-      readOnly,
-      id,
-      setValue,
-      incrementValue,
-      getStepAmount,
-      allowInputSyncRef,
-      formatOptionsRef,
-      valueRef,
-      lastChangedValueRef,
-      hasPendingCommitRef,
-      name,
-      nameProp,
-      required,
-      invalid,
-      inputMode,
-      getAllowedNonNumericKeys,
-      min,
-      max,
-      setInputValue,
-      locale,
-      isScrubbing,
-      setIsScrubbing,
-      state,
-      onValueCommitted
-    }),
-    [
-      inputValue,
-      value,
-      minWithDefault,
-      maxWithDefault,
-      disabled,
-      readOnly,
-      id,
-      setValue,
-      incrementValue,
-      getStepAmount,
-      name,
-      nameProp,
-      required,
-      invalid,
-      inputMode,
-      getAllowedNonNumericKeys,
-      min,
-      max,
-      locale,
-      isScrubbing,
-      state,
-      onValueCommitted
-    ],
-    (0, import_internal.subSlot)(slot, "ctx")
-  );
-  const element = (0, import_useRenderElement.useRenderElement)(
-    "div",
-    { render, className, style },
-    { ref, state, props: elementProps, stateAttributesMapping },
-    (0, import_internal.subSlot)(slot, "re")
-  );
-  const hiddenInputProps = validation.getValidationProps(disabled, {
-    onFocus() {
-      inputRef.current?.focus();
-    },
-    onChange(event) {
-      if (event.defaultPrevented || disabled || readOnly) return;
-      const nextValue = event.currentTarget.valueAsNumber;
-      const parsedValue = Number.isNaN(nextValue) ? null : nextValue;
-      const details = (0, import_createChangeEventDetails.createChangeEventDetails)(import_createChangeEventDetails.REASONS.none, event);
-      setValue(parsedValue, details);
-      clearErrors(name);
-      validation.change(lastChangedValueRef.current ?? parsedValue);
-    }
-  });
-  const hiddenInput = (0, import_octane.createElement)("input", {
-    ...hiddenInputProps,
-    // This form-facing control intentionally observes the native commit event;
-    // the visible text input above owns per-edit handling.
-    suppressNativeChangeWarning: true,
-    ref: hiddenInputRef,
-    type: "number",
-    form,
-    name,
-    value: value ?? "",
-    min,
-    max,
-    step: stepProp,
-    disabled,
-    readOnly,
-    required,
-    "aria-hidden": true,
-    tabIndex: -1,
-    style: name ? import_visuallyHidden.visuallyHiddenInput : import_visuallyHidden.visuallyHidden
-  });
-  return (0, import_octane.createElement)(NumberFieldRootContext.Provider, {
-    value: contextValue,
-    // Octane reconciles an ARRAY child as a keyed list, so each slot carries a stable key;
-    // values that cannot be keyed in place go through a keyed Fragment.
-    children: [
-      (0, import_octane.createElement)(import_octane.Fragment, { key: "element", children: element }),
-      (0, import_octane.createElement)(import_octane.Fragment, { key: "hidden-input", children: hiddenInput })
-    ]
-  });
-}
-function NumberFieldGroup(props) {
-  const slot = (0, import_internal.S)("NumberFieldGroup");
-  const { render, className, style, ref, ...elementProps } = props;
-  const { state } = useNumberFieldRootContext();
-  return (0, import_useRenderElement.useRenderElement)(
-    "div",
-    { render, className, style },
-    { ref, state, props: [{ role: "group" }, elementProps], stateAttributesMapping },
-    (0, import_internal.subSlot)(slot, "re")
-  );
-}
-function NumberFieldInput(props) {
-  const slot = (0, import_internal.S)("NumberFieldInput");
-  const { render, className, style, ref, ...elementProps } = props;
-  const {
-    allowInputSyncRef,
-    disabled,
-    formatOptionsRef,
-    getAllowedNonNumericKeys,
-    getStepAmount,
-    id,
-    incrementValue,
-    inputMode,
-    inputValue,
-    max,
-    min,
-    name,
-    nameProp,
-    readOnly,
-    required,
-    setValue,
-    state,
-    setInputValue,
-    locale,
-    inputRef,
-    value,
-    onValueCommitted,
-    lastChangedValueRef,
-    hasPendingCommitRef,
-    valueRef
-  } = useNumberFieldRootContext();
-  const { clearErrors } = (0, import_FormContext.useFormContext)();
-  const { validationMode, setTouched, setFocused, invalid, shouldValidateOnChange, validation } = (0, import_FieldRootContext.useFieldRootContext)();
-  const { labelId } = (0, import_LabelableContext.useLabelableContext)();
-  const hasTouchedInputRef = (0, import_octane.useRef)(false, (0, import_internal.subSlot)(slot, "touched"));
-  const blockRevalidationRef = (0, import_octane.useRef)(false, (0, import_internal.subSlot)(slot, "blockReval"));
-  const pendingCaretRef = (0, import_octane.useRef)(null, (0, import_internal.subSlot)(slot, "caret"));
-  (0, import_useRegisterFieldControl.useRegisterFieldControl)(
-    inputRef,
-    id,
-    value,
-    void 0,
-    !disabled,
-    nameProp,
-    (0, import_internal.subSlot)(slot, "register")
-  );
-  (0, import_octane.useLayoutEffect)(
-    () => {
-      if (pendingCaretRef.current != null) {
-        const caret = pendingCaretRef.current;
-        pendingCaretRef.current = null;
-        inputRef.current?.setSelectionRange(caret, caret);
-      }
-    },
-    void 0,
-    (0, import_internal.subSlot)(slot, "e:caret")
-  );
-  (0, import_useValueChanged.useValueChanged)(
-    value,
-    () => {
-      clearErrors(name);
-      if (blockRevalidationRef.current && !shouldValidateOnChange()) {
-        blockRevalidationRef.current = false;
-        return;
-      }
-      validation.change(value);
-    },
-    (0, import_internal.subSlot)(slot, "valueChanged")
-  );
-  const inputProps = {
-    id,
-    required,
-    disabled,
-    readOnly,
-    inputMode,
-    value: inputValue,
-    type: "text",
-    autoComplete: "off",
-    autoCorrect: "off",
-    spellCheck: "false",
-    "aria-roledescription": "Number field",
-    "aria-invalid": !disabled && invalid ? true : void 0,
-    "aria-labelledby": labelId,
-    onFocus(event) {
-      if (event.defaultPrevented || disabled) return;
-      setFocused(true);
-      if (hasTouchedInputRef.current) return;
-      hasTouchedInputRef.current = true;
-      const target = event.currentTarget;
-      const length = target.value.length;
-      target.setSelectionRange(length, length);
-    },
-    onBlur(event) {
-      if (event.defaultPrevented || disabled) return;
-      setTouched(true);
-      setFocused(false);
-      if (readOnly) return;
-      const hadManualInput = !allowInputSyncRef.current;
-      const hadPendingProgrammaticChange = hasPendingCommitRef.current;
-      allowInputSyncRef.current = true;
-      if (inputValue.trim() === "") {
-        const clearDetails = (0, import_createChangeEventDetails.createChangeEventDetails)("input-clear", event);
-        setValue(null, clearDetails);
-        if (clearDetails.isCanceled) return;
-        if (validationMode === "onBlur") validation.commit(null);
-        if (hadManualInput || hadPendingProgrammaticChange || value !== null) {
-          onValueCommitted(null, (0, import_createChangeEventDetails.createChangeEventDetails)("input-clear", event));
-        }
-        return;
-      }
-      const formatOptions = formatOptionsRef.current;
-      const parsedValue = (0, import_parse.parseNumber)(inputValue, locale, formatOptions);
-      if (parsedValue === null) return;
-      const hasRoundingOptions = (0, import_validate.hasNumberFormatRoundingOptions)(formatOptions);
-      let committed;
-      if (!hadManualInput && !hasRoundingOptions) {
-        committed = value;
-      } else if (hasRoundingOptions) {
-        committed = (0, import_validate.removeFloatingPointErrors)(parsedValue, formatOptions);
-      } else {
-        committed = parsedValue;
-      }
-      const shouldUpdateValue = value !== committed;
-      const shouldCommit = hadManualInput || shouldUpdateValue || hadPendingProgrammaticChange;
-      let committedValue = committed;
-      if (shouldUpdateValue) {
-        const changeDetails = (0, import_createChangeEventDetails.createChangeEventDetails)("input-blur", event);
-        blockRevalidationRef.current = true;
-        setValue(committed, changeDetails);
-        if (changeDetails.isCanceled) {
-          blockRevalidationRef.current = false;
-          return;
-        }
-        committedValue = lastChangedValueRef.current ?? committed;
-        if (committedValue === value) blockRevalidationRef.current = false;
-      }
-      if (validationMode === "onBlur") validation.commit(committedValue);
-      if (shouldCommit)
-        onValueCommitted(committedValue, (0, import_createChangeEventDetails.createChangeEventDetails)("input-blur", event));
-      const canonicalText = (0, import_formatNumber.formatNumber)(committedValue, locale, formatOptions);
-      if (inputValue !== canonicalText) setInputValue(canonicalText);
-    },
-    onInput(event) {
-      if (event.defaultPrevented) return;
-      allowInputSyncRef.current = false;
-      const targetValue = event.currentTarget.value;
-      if (targetValue.trim() === "") {
-        setInputValue(targetValue);
-        setValue(null, (0, import_createChangeEventDetails.createChangeEventDetails)("input-clear", event));
-        return;
-      }
-      const allowedNonNumericKeys = getAllowedNonNumericKeys();
-      const isValidCharacterString = Array.from(targetValue).every(
-        (ch) => (0, import_parse.isNumeralChar)(ch) || import_parse.ANY_MINUS_DETECT_RE.test(ch) || allowedNonNumericKeys.has(ch)
-      );
-      if (!isValidCharacterString) return;
-      const parsedValue = (0, import_parse.parseNumber)(targetValue, locale, formatOptionsRef.current);
-      setInputValue(targetValue);
-      if (parsedValue !== null) {
-        setValue(parsedValue, (0, import_createChangeEventDetails.createChangeEventDetails)(import_createChangeEventDetails.REASONS.inputChange, event));
-      }
-    },
-    onKeyDown(event) {
-      if (event.defaultPrevented || readOnly || disabled) return;
-      const nativeEvent = event;
-      const hadManualInput = !allowInputSyncRef.current;
-      const allowedNonNumericKeys = getAllowedNonNumericKeys();
-      let isAllowedNonNumericKey = allowedNonNumericKeys.has(event.key);
-      const { decimal, currency, percentSign } = (0, import_parse.getNumberLocaleDetails)(
-        locale,
-        formatOptionsRef.current
-      );
-      const selectionStart = event.currentTarget.selectionStart;
-      const selectionEnd = event.currentTarget.selectionEnd;
-      const isAllSelected = selectionStart === 0 && selectionEnd === inputValue.length;
-      const selectionContainsIndex = (index) => selectionStart != null && selectionEnd != null && index >= selectionStart && index < selectionEnd;
-      const signGroups = [
-        [import_parse.ANY_MINUS_DETECT_RE, import_parse.ANY_MINUS_RE],
-        [import_parse.ANY_PLUS_DETECT_RE, import_parse.ANY_PLUS_RE]
-      ];
-      signGroups.forEach(([detectRe, globalRe]) => {
-        if (detectRe.test(event.key) && Array.from(allowedNonNumericKeys).some((k) => detectRe.test(k))) {
-          const existingIndex = inputValue.search(globalRe);
-          const isReplacingExisting = existingIndex !== -1 && selectionContainsIndex(existingIndex);
-          isAllowedNonNumericKey = !(import_parse.ANY_MINUS_DETECT_RE.test(inputValue) || import_parse.ANY_PLUS_DETECT_RE.test(inputValue)) || isAllSelected || isReplacingExisting;
-        }
-      });
-      [decimal, currency, percentSign].forEach((symbol) => {
-        if (symbol && event.key === symbol) {
-          const symbolIndex = inputValue.indexOf(symbol);
-          const isSymbolHighlighted = selectionContainsIndex(symbolIndex);
-          isAllowedNonNumericKey = !inputValue.includes(symbol) || isAllSelected || isSymbolHighlighted;
-        }
-      });
-      const isNavigateKey = NAVIGATE_KEYS.has(event.key);
-      const isStepKey = event.key === "ArrowUp" || event.key === "ArrowDown";
-      if (event.which === 229 || event.altKey && !isStepKey || event.ctrlKey || event.metaKey || isAllowedNonNumericKey || (0, import_parse.isNumeralChar)(event.key) || isNavigateKey) {
-        return;
-      }
-      const willSetHome = event.key === "Home" && min != null;
-      const willSetEnd = event.key === "End" && max != null;
-      if (event.key.length > 1 && !isStepKey && !willSetHome && !willSetEnd) return;
-      const currentValue = hadManualInput ? (0, import_parse.parseNumber)(inputValue, locale, formatOptionsRef.current) : null;
-      const amount = getStepAmount(event);
-      (0, import_list_utils.stopEvent)(event);
-      const commitDetails = (0, import_createChangeEventDetails.createChangeEventDetails)("keyboard", nativeEvent);
-      let changed = false;
-      if (event.key === "ArrowUp" || event.key === "ArrowDown") {
-        allowInputSyncRef.current = true;
-        if (!hadManualInput) lastChangedValueRef.current = valueRef.current;
-        changed = incrementValue(amount, {
-          direction: event.key === "ArrowUp" ? 1 : -1,
-          currentValue,
-          event: nativeEvent,
-          reason: "keyboard"
-        });
-      } else if (willSetHome) {
-        allowInputSyncRef.current = true;
-        changed = setValue(min, (0, import_createChangeEventDetails.createChangeEventDetails)("keyboard", nativeEvent));
-      } else if (willSetEnd) {
-        allowInputSyncRef.current = true;
-        changed = setValue(max, (0, import_createChangeEventDetails.createChangeEventDetails)("keyboard", nativeEvent));
-      }
-      if (changed) onValueCommitted(lastChangedValueRef.current ?? valueRef.current, commitDetails);
-    },
-    onPaste(event) {
-      if (event.defaultPrevented || readOnly || disabled) return;
-      let pastedData = "";
-      try {
-        pastedData = event.clipboardData?.getData("text/plain") ?? "";
-      } catch {
-        return;
-      }
-      event.preventDefault();
-      const input = event.currentTarget;
-      const selectionStart = input.selectionStart ?? inputValue.length;
-      const selectionEnd = input.selectionEnd ?? inputValue.length;
-      const nextText = inputValue.slice(0, selectionStart) + pastedData + inputValue.slice(selectionEnd);
-      const parsedValue = (0, import_parse.parseNumber)(nextText, locale, formatOptionsRef.current);
-      if (parsedValue !== null) {
-        allowInputSyncRef.current = false;
-        pendingCaretRef.current = selectionStart + pastedData.length;
-        setValue(parsedValue, (0, import_createChangeEventDetails.createChangeEventDetails)("input-paste", event));
-        setInputValue(nextText);
-      }
-    }
-  };
-  return (0, import_useRenderElement.useRenderElement)(
-    "input",
-    { render, className, style },
-    {
-      ref: [ref, inputRef],
-      state,
-      props: [inputProps, elementProps, (p) => validation.getValidationProps(disabled, p)],
-      stateAttributesMapping
-    },
-    (0, import_internal.subSlot)(slot, "re")
-  );
-}
-function useNumberFieldButton(params) {
-  const {
-    allowInputSyncRef,
-    disabled,
-    formatOptionsRef,
-    getStepAmount,
-    id,
-    incrementValue,
-    inputRef,
-    inputValue,
-    isIncrement,
-    locale,
-    readOnly,
-    setValue,
-    valueRef,
-    lastChangedValueRef,
-    onValueCommitted,
-    slot
-  } = params;
-  const pressReason = isIncrement ? import_createChangeEventDetails.REASONS.incrementPress : import_createChangeEventDetails.REASONS.decrementPress;
-  function commitValue(nativeEvent) {
-    const shouldCommitInputValue = !allowInputSyncRef.current;
-    allowInputSyncRef.current = true;
-    if (!shouldCommitInputValue) {
-      lastChangedValueRef.current = valueRef.current;
-      return;
-    }
-    const parsedValue = (0, import_parse.parseNumber)(inputValue, locale, formatOptionsRef.current);
-    if (parsedValue !== null) {
-      const details = (0, import_createChangeEventDetails.createChangeEventDetails)(pressReason, nativeEvent);
-      setValue(parsedValue, details);
-      if (!details.isCanceled) valueRef.current = parsedValue;
-    }
-  }
-  const { pointerHandlers, shouldSkipClick } = (0, import_usePressAndHold.usePressAndHold)({
-    disabled: disabled || readOnly,
-    elementRef: inputRef,
-    tickDelay: import_constants2.CHANGE_VALUE_TICK_DELAY,
-    startDelay: import_constants2.START_AUTO_CHANGE_DELAY,
-    scrollDistance: import_constants2.SCROLLING_POINTER_MOVE_DISTANCE,
-    tick(triggerEvent) {
-      const amount = getStepAmount(triggerEvent);
-      return incrementValue(amount, {
-        direction: isIncrement ? 1 : -1,
-        event: triggerEvent,
-        reason: pressReason
-      });
-    },
-    onStop(nativeEvent) {
-      const committed = lastChangedValueRef.current ?? valueRef.current;
-      onValueCommitted(committed, (0, import_createChangeEventDetails.createChangeEventDetails)(pressReason, nativeEvent));
-    }
-  });
-  return {
-    disabled,
-    "aria-label": isIncrement ? "Increase" : "Decrease",
-    "aria-controls": id,
-    tabIndex: -1,
-    style: { WebkitUserSelect: "none", userSelect: "none" },
-    ...pointerHandlers,
-    onClick(event) {
-      const isDisabled = disabled || readOnly;
-      if (event.defaultPrevented || isDisabled || shouldSkipClick(event)) return;
-      commitValue(event);
-      const amount = getStepAmount(event);
-      const prev = valueRef.current;
-      incrementValue(amount, { direction: isIncrement ? 1 : -1, event, reason: pressReason });
-      const committed = lastChangedValueRef.current ?? valueRef.current;
-      if (committed !== prev) {
-        onValueCommitted(committed, (0, import_createChangeEventDetails.createChangeEventDetails)(pressReason, event));
-      }
-    },
-    onPointerDown(event) {
-      const isMainButton = !event.button || event.button === 0;
-      if (event.defaultPrevented || readOnly || !isMainButton || disabled) return;
-      commitValue(event);
-      lastChangedValueRef.current = null;
-      if (!(0, import_usePressAndHold.isTouchLikePointerType)(event.pointerType)) inputRef.current?.focus();
-      pointerHandlers.onPointerDown(event);
-    },
-    _slot: slot
-  };
-}
-function useNumberFieldStepperButton(componentProps, isIncrement, slot) {
-  const {
-    render,
-    className,
-    disabled: disabledProp = false,
-    nativeButton = true,
-    style,
-    ref,
-    ...elementProps
-  } = componentProps;
-  const ctx = useNumberFieldRootContext();
-  const { disabled: contextDisabled, maxWithDefault, minWithDefault, readOnly, state, value } = ctx;
-  const isAtBoundary = value != null && (isIncrement ? value >= maxWithDefault : value <= minWithDefault);
-  const disabled = disabledProp || contextDisabled || isAtBoundary;
-  const buttonProps = useNumberFieldButton({ ...ctx, isIncrement, disabled, slot });
-  const { getButtonProps, buttonRef } = (0, import_useButton.useButton)(
-    { disabled: disabled || readOnly, native: nativeButton, focusableWhenDisabled: true },
-    (0, import_internal.subSlot)(slot, "button")
-  );
-  const buttonState = { ...state, disabled };
-  return (0, import_useRenderElement.useRenderElement)(
-    "button",
-    { render, className, style },
-    {
-      ref: [ref, buttonRef],
-      state: buttonState,
-      props: [buttonProps, elementProps, getButtonProps],
-      stateAttributesMapping
-    },
-    (0, import_internal.subSlot)(slot, "re")
-  );
-}
-function NumberFieldIncrement(props) {
-  return useNumberFieldStepperButton(props, true, (0, import_internal.S)("NumberFieldIncrement"));
-}
-function NumberFieldDecrement(props) {
-  return useNumberFieldStepperButton(props, false, (0, import_internal.S)("NumberFieldDecrement"));
-}
-const NumberField = {
-  Root: NumberFieldRoot,
-  Group: NumberFieldGroup,
-  Input: NumberFieldInput,
-  Increment: NumberFieldIncrement,
-  Decrement: NumberFieldDecrement
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  NumberField
-});