@wix/site-ui 1.30.0 → 1.31.0

package/dist/NumberField/index.js

@@ -1,7 +1,1405 @@
-import { jsx } from "react/jsx-runtime";
-import { NumberField } from "@base-ui/react/number-field";
+import { jsx, jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
+import { useRefWithInit, useMergedRefs, useRenderElement, esm_formatErrorMessage } from "../8272.js";
+import { useLabelableContext, fieldValidityMapping, useFieldRootContext } from "../1477.js";
+import { formatNumber, formatNumberMaxPrecision, getFormatter } from "../6914.js";
+import { clamp } from "../3296.js";
+import { useLabelableId } from "../9048.js";
+import { useControlled } from "../8527.js";
+import { useValueAsRef } from "../4707.js";
+import { useIsoLayoutEffect } from "../6499.js";
+import { useForcedRerendering } from "../8935.js";
+import { useStableCallback } from "../7541.js";
+import { inputPaste, inputBlur, inputChange, inputClear, keyboard, incrementPress, decrementPress } from "../2418.js";
+import { createGenericEventDetails, createChangeEventDetails } from "../4768.js";
+import { isFirefox, isIOS, isWebKit } from "../8971.js";
+import { getTarget, activeElement } from "../4549.js";
+import { ownerDocument } from "../9829.js";
+import { addEventListener } from "../4723.js";
+import { visuallyHiddenInput, visuallyHidden } from "../8225.js";
+import { Timeout, useTimeout } from "../42.js";
+import { useOnMount } from "../2861.js";
+import { getWindow } from "../3829.js";
+import { useButton } from "../9189.js";
+import { useFormContext } from "../5085.js";
+import { useRegisterFieldControl } from "../4281.js";
+import { useValueChanged } from "../2801.js";
+import { stopEvent } from "../6330.js";
+import { mergeCleanups } from "../4495.js";
 import * as __rspack_external_react from "react";
+import * as __rspack_external_react_dom_7136dc57 from "react-dom";
+const NumberFieldRootContext = /*#__PURE__*/ __rspack_external_react.createContext(void 0);
+if ("production" !== process.env.NODE_ENV) NumberFieldRootContext.displayName = "NumberFieldRootContext";
+function useNumberFieldRootContext() {
+    const context = __rspack_external_react.useContext(NumberFieldRootContext);
+    if (void 0 === context) throw new Error("production" !== process.env.NODE_ENV ? 'Base UI: NumberFieldRootContext is missing. NumberField parts must be placed within <NumberField.Root>.' : esm_formatErrorMessage(43));
+    return context;
+}
+const stateAttributesMapping = {
+    inputValue: ()=>null,
+    value: ()=>null,
+    ...fieldValidityMapping
+};
+const HAN_NUMERALS = [
+    '零',
+    '〇',
+    '一',
+    '二',
+    '三',
+    '四',
+    '五',
+    '六',
+    '七',
+    '八',
+    '九'
+];
+const HAN_NUMERAL_TO_DIGIT = {
+    零: '0',
+    〇: '0',
+    一: '1',
+    二: '2',
+    三: '3',
+    四: '4',
+    五: '5',
+    六: '6',
+    七: '7',
+    八: '8',
+    九: '9'
+};
+const ARABIC_NUMERALS = [
+    '٠',
+    '١',
+    '٢',
+    '٣',
+    '٤',
+    '٥',
+    '٦',
+    '٧',
+    '٨',
+    '٩'
+];
+const PERSIAN_NUMERALS = [
+    '۰',
+    '۱',
+    '۲',
+    '۳',
+    '۴',
+    '۵',
+    '۶',
+    '۷',
+    '۸',
+    '۹'
+];
+const FULLWIDTH_NUMERALS = [
+    '０',
+    '１',
+    '２',
+    '３',
+    '４',
+    '５',
+    '６',
+    '７',
+    '８',
+    '９'
+];
+const PERCENTAGES = [
+    '%',
+    '٪',
+    '％',
+    '﹪'
+];
+const PERMILLE = [
+    '‰',
+    '؉'
+];
+const UNICODE_MINUS_SIGNS = [
+    '−',
+    '－',
+    '‒',
+    '–',
+    '—',
+    '﹣'
+];
+const UNICODE_PLUS_SIGNS = [
+    '＋',
+    '﹢'
+];
+const FULLWIDTH_DECIMAL = '．';
+const FULLWIDTH_GROUP = '，';
+const ARABIC_RE = new RegExp(`[${ARABIC_NUMERALS.join('')}]`, 'g');
+const PERSIAN_RE = new RegExp(`[${PERSIAN_NUMERALS.join('')}]`, 'g');
+const FULLWIDTH_RE = new RegExp(`[${FULLWIDTH_NUMERALS.join('')}]`, 'g');
+const HAN_RE = new RegExp(`[${HAN_NUMERALS.join('')}]`, 'g');
+const PERCENT_RE = new RegExp(`[${PERCENTAGES.join('')}]`);
+const PERMILLE_RE = new RegExp(`[${PERMILLE.join('')}]`);
+const ARABIC_DETECT_RE = /[٠١٢٣٤٥٦٧٨٩]/;
+const PERSIAN_DETECT_RE = /[۰۱۲۳۴۵۶۷۸۹]/;
+const HAN_DETECT_RE = /[零〇一二三四五六七八九]/;
+const FULLWIDTH_DETECT_RE = new RegExp(`[${FULLWIDTH_NUMERALS.join('')}]`);
+const BASE_NON_NUMERIC_SYMBOLS = [
+    '.',
+    ',',
+    FULLWIDTH_DECIMAL,
+    FULLWIDTH_GROUP,
+    '٫',
+    '٬'
+];
+const SPACE_SEPARATOR_RE = /\p{Zs}/u;
+const PLUS_SIGNS_WITH_ASCII = [
+    '+',
+    ...UNICODE_PLUS_SIGNS
+];
+const MINUS_SIGNS_WITH_ASCII = [
+    '-',
+    ...UNICODE_MINUS_SIGNS
+];
+const escapeRegExp = (s)=>s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+const escapeClassChar = (s)=>s.replace(/[-\\\]^]/g, (m)=>`\\${m}`);
+const charClassFrom = (chars)=>`[${chars.map(escapeClassChar).join('')}]`;
+const ANY_MINUS_CLASS = charClassFrom([
+    '-'
+].concat(UNICODE_MINUS_SIGNS));
+const ANY_PLUS_CLASS = charClassFrom([
+    '+'
+].concat(UNICODE_PLUS_SIGNS));
+const ANY_MINUS_RE = new RegExp(ANY_MINUS_CLASS, 'gu');
+const ANY_PLUS_RE = new RegExp(ANY_PLUS_CLASS, 'gu');
+const ANY_MINUS_DETECT_RE = new RegExp(ANY_MINUS_CLASS);
+const ANY_PLUS_DETECT_RE = new RegExp(ANY_PLUS_CLASS);
+function getNumberLocaleDetails(locale, options) {
+    const parts = getFormatter(locale, options).formatToParts(11111.1);
+    const result = {};
+    parts.forEach((part)=>{
+        result[part.type] = part.value;
+    });
+    getFormatter(locale).formatToParts(0.1).forEach((part)=>{
+        if ('decimal' === part.type) result[part.type] = part.value;
+    });
+    return result;
+}
+function parseNumber(formattedNumber, locale, options) {
+    if (null == formattedNumber) return null;
+    let input = String(formattedNumber).replace(/\p{Cf}/gu, '').trim();
+    input = input.replace(ANY_MINUS_RE, '-').replace(ANY_PLUS_RE, '+');
+    let isNegative = false;
+    const trailing = input.match(/([+-])\s*$/);
+    if (trailing) {
+        if ('-' === trailing[1]) isNegative = true;
+        input = input.replace(/([+-])\s*$/, '');
+    }
+    const leading = input.match(/^\s*([+-])/);
+    if (leading) {
+        if ('-' === leading[1]) isNegative = true;
+        input = input.replace(/^\s*[+-]/, '');
+    }
+    let computedLocale = locale;
+    if (void 0 === computedLocale) {
+        if (ARABIC_DETECT_RE.test(input) || PERSIAN_DETECT_RE.test(input)) computedLocale = 'ar';
+        else if (HAN_DETECT_RE.test(input)) computedLocale = 'zh';
+    }
+    const { group, decimal, currency } = getNumberLocaleDetails(computedLocale, options);
+    const unitParts = getFormatter(computedLocale, options).formatToParts(1).filter((p)=>'unit' === p.type).map((p)=>escapeRegExp(p.value));
+    const unitRegex = unitParts.length ? new RegExp(unitParts.join('|'), 'g') : null;
+    let groupRegex = null;
+    if (group) {
+        const isSpaceGroup = /\p{Zs}/u.test(group);
+        const isApostropheGroup = "'" === group || '’' === group;
+        groupRegex = isSpaceGroup ? /\p{Zs}/gu : isApostropheGroup ? /['’]/g : new RegExp(escapeRegExp(group), 'g');
+    }
+    const replacements = [
+        {
+            regex: group ? groupRegex : null,
+            replacement: ''
+        },
+        {
+            regex: decimal ? new RegExp(escapeRegExp(decimal), 'g') : null,
+            replacement: '.'
+        },
+        {
+            regex: /．/g,
+            replacement: '.'
+        },
+        {
+            regex: /，/g,
+            replacement: ''
+        },
+        {
+            regex: /٫/g,
+            replacement: '.'
+        },
+        {
+            regex: /٬/g,
+            replacement: ''
+        },
+        {
+            regex: currency ? new RegExp(escapeRegExp(currency), 'g') : null,
+            replacement: ''
+        },
+        {
+            regex: unitRegex,
+            replacement: ''
+        },
+        {
+            regex: ARABIC_RE,
+            replacement: (ch)=>String(ARABIC_NUMERALS.indexOf(ch))
+        },
+        {
+            regex: PERSIAN_RE,
+            replacement: (ch)=>String(PERSIAN_NUMERALS.indexOf(ch))
+        },
+        {
+            regex: FULLWIDTH_RE,
+            replacement: (ch)=>String(FULLWIDTH_NUMERALS.indexOf(ch))
+        },
+        {
+            regex: HAN_RE,
+            replacement: (ch)=>HAN_NUMERAL_TO_DIGIT[ch]
+        }
+    ];
+    let unformatted = replacements.reduce((acc, { regex, replacement })=>regex ? acc.replace(regex, replacement) : acc, input);
+    const lastDot = unformatted.lastIndexOf('.');
+    if (-1 !== lastDot) unformatted = `${unformatted.slice(0, lastDot).replace(/\./g, '')}.${unformatted.slice(lastDot + 1).replace(/\./g, '')}`;
+    if (/^[-+]?Infinity$/i.test(input) || /[∞]/.test(input)) return null;
+    const parseTarget = (isNegative ? '-' : '') + unformatted;
+    let num = parseFloat(parseTarget);
+    const style = options?.style;
+    const isUnitPercent = 'unit' === style && options?.unit === 'percent';
+    const hasPercentSymbol = PERCENT_RE.test(formattedNumber) || 'percent' === style;
+    const hasPermilleSymbol = PERMILLE_RE.test(formattedNumber);
+    if (hasPermilleSymbol) num /= 1000;
+    else if (!isUnitPercent && hasPercentSymbol) num /= 100;
+    if (Number.isNaN(num)) return null;
+    return num;
+}
+const STEP_EPSILON_FACTOR = 1e-10;
+function getFractionDigits(format) {
+    const defaultOptions = getFormatter('en-US').resolvedOptions();
+    const minimumFractionDigits = format?.minimumFractionDigits ?? defaultOptions.minimumFractionDigits ?? 0;
+    const maximumFractionDigits = Math.max(format?.maximumFractionDigits ?? defaultOptions.maximumFractionDigits ?? 20, minimumFractionDigits);
+    return {
+        maximumFractionDigits,
+        minimumFractionDigits
+    };
+}
+function roundToFractionDigits(value, maximumFractionDigits) {
+    if (!Number.isFinite(value)) return value;
+    const digits = Math.min(Math.max(maximumFractionDigits, 0), 20);
+    return Number(value.toFixed(digits));
+}
+function removeFloatingPointErrors(value, format) {
+    const { maximumFractionDigits } = getFractionDigits(format);
+    return roundToFractionDigits(value, maximumFractionDigits);
+}
+function snapToStep(clampedValue, base, step, mode = 'directional') {
+    if (0 === step) return clampedValue;
+    const stepSize = Math.abs(step);
+    const direction = Math.sign(step);
+    const tolerance = stepSize * STEP_EPSILON_FACTOR * direction;
+    const divisor = 'nearest' === mode ? step : stepSize;
+    const rawSteps = (clampedValue - base + tolerance) / divisor;
+    let snappedSteps;
+    snappedSteps = 'nearest' === mode ? Math.round(rawSteps) : direction > 0 ? Math.floor(rawSteps) : Math.ceil(rawSteps);
+    const stepForResult = 'nearest' === mode ? step : stepSize;
+    return base + snappedSteps * stepForResult;
+}
+function toValidatedNumber(value, { step, minWithDefault, maxWithDefault, minWithZeroDefault, format, snapOnStep, small, clamp: shouldClamp }) {
+    if (null === value) return value;
+    const clampedValue = shouldClamp ? clamp(value, minWithDefault, maxWithDefault) : value;
+    if (null != step && snapOnStep) {
+        if (0 === step) return removeFloatingPointErrors(clampedValue, format);
+        let base = minWithZeroDefault;
+        if (!small && minWithDefault !== Number.MIN_SAFE_INTEGER) base = minWithDefault;
+        const snappedValue = snapToStep(clampedValue, base, step, small ? 'nearest' : 'directional');
+        return removeFloatingPointErrors(snappedValue, format);
+    }
+    return removeFloatingPointErrors(clampedValue, format);
+}
+const NumberFieldRoot_NumberFieldRoot = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    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, ...elementProps } = componentProps;
+    const { setDirty, validityData, disabled: fieldDisabled, setFilled, invalid, name: fieldName, state: fieldState, validation, shouldValidateOnChange } = useFieldRootContext();
+    const disabled = fieldDisabled || disabledProp;
+    const name = fieldName ?? nameProp;
+    const step = 'any' === stepProp ? 1 : stepProp;
+    const [isScrubbing, setIsScrubbing] = __rspack_external_react.useState(false);
+    const minWithDefault = min ?? Number.MIN_SAFE_INTEGER;
+    const maxWithDefault = max ?? Number.MAX_SAFE_INTEGER;
+    const minWithZeroDefault = min ?? 0;
+    const formatStyle = format?.style;
+    const inputRef = __rspack_external_react.useRef(null);
+    const hiddenInputRef = useMergedRefs(inputRefProp, validation.inputRef);
+    const id = useLabelableId({
+        id: idProp
+    });
+    const [valueUnwrapped, setValueUnwrapped] = useControlled({
+        controlled: valueProp,
+        default: defaultValue,
+        name: 'NumberField',
+        state: 'value'
+    });
+    const value = valueUnwrapped ?? null;
+    const valueRef = useValueAsRef(value);
+    useIsoLayoutEffect(()=>{
+        setFilled(null !== value);
+    }, [
+        setFilled,
+        value
+    ]);
+    const forceRender = useForcedRerendering();
+    const formatOptionsRef = useValueAsRef(format);
+    const hasPendingCommitRef = __rspack_external_react.useRef(false);
+    const onValueCommitted = useStableCallback((nextValue, eventDetails)=>{
+        hasPendingCommitRef.current = false;
+        onValueCommittedProp?.(nextValue, eventDetails);
+    });
+    const allowInputSyncRef = __rspack_external_react.useRef(true);
+    const lastChangedValueRef = __rspack_external_react.useRef(null);
+    const [inputValue, setInputValue] = __rspack_external_react.useState(()=>{
+        if (void 0 !== valueProp) return getControlledInputValue(value, locale, format);
+        return formatNumber(value, locale, format);
+    });
+    const [inputMode, setInputMode] = __rspack_external_react.useState('numeric');
+    const getAllowedNonNumericKeys = useStableCallback(()=>{
+        const { decimal, group, currency, literal } = getNumberLocaleDetails(locale, format);
+        const keys = new Set();
+        BASE_NON_NUMERIC_SYMBOLS.forEach((symbol)=>keys.add(symbol));
+        if (decimal) keys.add(decimal);
+        if (group) {
+            keys.add(group);
+            if (SPACE_SEPARATOR_RE.test(group)) keys.add(' ');
+        }
+        const allowPercentSymbols = 'percent' === formatStyle || 'unit' === formatStyle && format?.unit === 'percent';
+        const allowPermilleSymbols = 'percent' === formatStyle || 'unit' === formatStyle && format?.unit === 'permille';
+        if (allowPercentSymbols) PERCENTAGES.forEach((key)=>keys.add(key));
+        if (allowPermilleSymbols) PERMILLE.forEach((key)=>keys.add(key));
+        if ('currency' === formatStyle && currency) keys.add(currency);
+        if (literal) {
+            Array.from(literal).forEach((char)=>keys.add(char));
+            if (SPACE_SEPARATOR_RE.test(literal)) keys.add(' ');
+        }
+        PLUS_SIGNS_WITH_ASCII.forEach((key)=>keys.add(key));
+        if (minWithDefault < 0) MINUS_SIGNS_WITH_ASCII.forEach((key)=>keys.add(key));
+        return keys;
+    });
+    const getStepAmount = useStableCallback((event)=>{
+        if (event?.altKey) return smallStep;
+        if (event?.shiftKey) return largeStep;
+        return step;
+    });
+    const setValue = useStableCallback((unvalidatedValue, details)=>{
+        const eventWithOptionalKeyState = details.event;
+        const dir = details.direction;
+        const reason = details.reason;
+        const shouldClampValue = !allowOutOfRange || !(reason === inputChange || reason === inputBlur || reason === inputPaste || reason === inputClear || "none" === reason);
+        const validatedValue = toValidatedNumber(unvalidatedValue, {
+            step: dir ? getStepAmount(eventWithOptionalKeyState) * dir : void 0,
+            format: formatOptionsRef.current,
+            minWithDefault,
+            maxWithDefault,
+            minWithZeroDefault,
+            snapOnStep,
+            small: eventWithOptionalKeyState?.altKey ?? false,
+            clamp: shouldClampValue
+        });
+        const isInputReason = details.reason === inputChange || details.reason === inputClear || details.reason === inputBlur || details.reason === inputPaste || "none" === details.reason;
+        const shouldFireChange = validatedValue !== value || isInputReason && (unvalidatedValue !== value || false === allowInputSyncRef.current);
+        if (shouldFireChange) {
+            lastChangedValueRef.current = validatedValue;
+            onValueChangeProp?.(validatedValue, details);
+            if (details.isCanceled) return shouldFireChange;
+            setValueUnwrapped(validatedValue);
+            setDirty(validatedValue !== validityData.initialValue);
+            hasPendingCommitRef.current = true;
+        }
+        if (allowInputSyncRef.current) setInputValue(formatNumber(validatedValue, locale, format));
+        forceRender();
+        return shouldFireChange;
+    });
+    const incrementValue = useStableCallback((amount, { direction, currentValue, event, reason })=>{
+        const prevValue = null == currentValue ? valueRef.current : currentValue;
+        const nextValue = 'number' == typeof prevValue ? prevValue + amount * direction : Math.max(0, min ?? 0);
+        const nativeEvent = event;
+        return setValue(nextValue, createChangeEventDetails(reason, nativeEvent, void 0, {
+            direction
+        }));
+    });
+    useIsoLayoutEffect(function() {
+        if (!allowInputSyncRef.current) return;
+        const nextInputValue = void 0 !== valueProp ? getControlledInputValue(value, locale, format) : formatNumber(value, locale, format);
+        if (nextInputValue !== inputValue) setInputValue(nextInputValue);
+    });
+    useIsoLayoutEffect(function() {
+        if (!isIOS) return;
+        let computedInputMode = 'text';
+        if (minWithDefault >= 0) computedInputMode = 'decimal';
+        setInputMode(computedInputMode);
+    }, [
+        minWithDefault,
+        formatStyle
+    ]);
+    __rspack_external_react.useEffect(function() {
+        const element = inputRef.current;
+        if (disabled || readOnly || !allowWheelScrub || !element) return;
+        function handleWheel(event) {
+            if (event.ctrlKey || activeElement(ownerDocument(inputRef.current)) !== inputRef.current) return;
+            event.preventDefault();
+            allowInputSyncRef.current = true;
+            const amount = getStepAmount(event) ?? 1;
+            incrementValue(amount, {
+                direction: event.deltaY > 0 ? -1 : 1,
+                event,
+                reason: 'wheel'
+            });
+        }
+        return addEventListener(element, 'wheel', handleWheel);
+    }, [
+        allowWheelScrub,
+        incrementValue,
+        disabled,
+        readOnly,
+        getStepAmount
+    ]);
+    const state = __rspack_external_react.useMemo(()=>({
+            ...fieldState,
+            disabled,
+            readOnly,
+            required,
+            value,
+            inputValue,
+            scrubbing: isScrubbing
+        }), [
+        fieldState,
+        disabled,
+        readOnly,
+        required,
+        value,
+        inputValue,
+        isScrubbing
+    ]);
+    const contextValue = __rspack_external_react.useMemo(()=>({
+            inputRef,
+            inputValue,
+            value,
+            minWithDefault,
+            maxWithDefault,
+            disabled,
+            readOnly,
+            id,
+            setValue,
+            incrementValue,
+            getStepAmount,
+            allowInputSyncRef,
+            formatOptionsRef,
+            valueRef,
+            lastChangedValueRef,
+            hasPendingCommitRef,
+            name,
+            required,
+            invalid,
+            inputMode,
+            getAllowedNonNumericKeys,
+            min,
+            max,
+            setInputValue,
+            locale,
+            isScrubbing,
+            setIsScrubbing,
+            state,
+            onValueCommitted
+        }), [
+        inputRef,
+        inputValue,
+        value,
+        minWithDefault,
+        maxWithDefault,
+        disabled,
+        readOnly,
+        id,
+        setValue,
+        incrementValue,
+        getStepAmount,
+        formatOptionsRef,
+        valueRef,
+        name,
+        required,
+        invalid,
+        inputMode,
+        getAllowedNonNumericKeys,
+        min,
+        max,
+        setInputValue,
+        locale,
+        isScrubbing,
+        state,
+        onValueCommitted
+    ]);
+    const element = useRenderElement('div', componentProps, {
+        ref: forwardedRef,
+        state,
+        props: elementProps,
+        stateAttributesMapping: stateAttributesMapping
+    });
+    return /*#__PURE__*/ jsxs(NumberFieldRootContext.Provider, {
+        value: contextValue,
+        children: [
+            element,
+            /*#__PURE__*/ jsx("input", {
+                ...validation.getInputValidationProps({
+                    onFocus () {
+                        inputRef.current?.focus();
+                    },
+                    onChange (event) {
+                        if (event.nativeEvent.defaultPrevented || disabled || readOnly) return void event.preventBaseUIHandler?.();
+                        const nextValue = event.currentTarget.valueAsNumber;
+                        const parsedValue = Number.isNaN(nextValue) ? null : nextValue;
+                        const details = createChangeEventDetails("none", event.nativeEvent);
+                        setDirty(parsedValue !== validityData.initialValue);
+                        setValue(parsedValue, details);
+                        if (shouldValidateOnChange()) validation.commit(parsedValue);
+                    }
+                }),
+                ref: hiddenInputRef,
+                type: "number",
+                form: form,
+                name: name,
+                value: value ?? '',
+                min: min,
+                max: max,
+                step: stepProp,
+                disabled: disabled,
+                required: required,
+                "aria-hidden": true,
+                tabIndex: -1,
+                style: name ? visuallyHiddenInput : visuallyHidden,
+                suppressHydrationWarning: true
+            })
+        ]
+    });
+});
+if ("production" !== process.env.NODE_ENV) NumberFieldRoot_NumberFieldRoot.displayName = "NumberFieldRoot";
+function getControlledInputValue(value, locale, format) {
+    const explicitPrecision = format?.maximumFractionDigits != null || format?.minimumFractionDigits != null;
+    return explicitPrecision ? formatNumber(value, locale, format) : formatNumberMaxPrecision(value, locale, format);
+}
+const NumberFieldGroup_NumberFieldGroup = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { render, className, style, ...elementProps } = componentProps;
+    const { state } = useNumberFieldRootContext();
+    const element = useRenderElement('div', componentProps, {
+        ref: forwardedRef,
+        state,
+        props: [
+            {
+                role: 'group'
+            },
+            elementProps
+        ],
+        stateAttributesMapping: stateAttributesMapping
+    });
+    return element;
+});
+if ("production" !== process.env.NODE_ENV) NumberFieldGroup_NumberFieldGroup.displayName = "NumberFieldGroup";
+const EMPTY = 0;
+class Interval extends Timeout {
+    static create() {
+        return new Interval();
+    }
+    start(delay, fn) {
+        this.clear();
+        this.currentId = setInterval(()=>{
+            fn();
+        }, delay);
+    }
+    clear = ()=>{
+        if (this.currentId !== EMPTY) {
+            clearInterval(this.currentId);
+            this.currentId = EMPTY;
+        }
+    };
+}
+function useInterval() {
+    const timeout = useRefWithInit(Interval.create).current;
+    useOnMount(timeout.disposeEffect);
+    return timeout;
+}
+const DEFAULT_TICK_DELAY = 60;
+const DEFAULT_START_DELAY = 400;
+const DEFAULT_SCROLL_DISTANCE = 8;
+const TOUCH_TIMEOUT = 50;
+const MAX_POINTER_MOVES_AFTER_TOUCH = 3;
+function isTouchLikePointerType(pointerType) {
+    return 'touch' === pointerType || 'pen' === pointerType;
+}
+function usePressAndHold(params) {
+    const { disabled, readOnly = false, tick, onStop, tickDelay = DEFAULT_TICK_DELAY, startDelay = DEFAULT_START_DELAY, scrollDistance = DEFAULT_SCROLL_DISTANCE, elementRef } = params;
+    const startTickTimeout = useTimeout();
+    const tickInterval = useInterval();
+    const intentionalTouchCheckTimeout = useTimeout();
+    const isPressedRef = __rspack_external_react.useRef(false);
+    const movesAfterTouchRef = __rspack_external_react.useRef(0);
+    const downCoordsRef = __rspack_external_react.useRef({
+        x: 0,
+        y: 0
+    });
+    const isTouchingButtonRef = __rspack_external_react.useRef(false);
+    const ignoreClickRef = __rspack_external_react.useRef(false);
+    const pointerTypeRef = __rspack_external_react.useRef('');
+    const unsubscribeFromGlobalContextMenuRef = __rspack_external_react.useRef(()=>{});
+    const stopAutoChange = useStableCallback(()=>{
+        intentionalTouchCheckTimeout.clear();
+        startTickTimeout.clear();
+        tickInterval.clear();
+        unsubscribeFromGlobalContextMenuRef.current();
+        movesAfterTouchRef.current = 0;
+    });
+    function startAutoChange(triggerNativeEvent) {
+        stopAutoChange();
+        const element = elementRef.current;
+        if (!element) return;
+        const win = getWindow(element);
+        function handleContextMenu(event) {
+            event.preventDefault();
+        }
+        unsubscribeFromGlobalContextMenuRef.current = addEventListener(win, 'contextmenu', handleContextMenu);
+        addEventListener(win, 'pointerup', (event)=>{
+            isPressedRef.current = false;
+            stopAutoChange();
+            onStop?.(event);
+        }, {
+            once: true
+        });
+        if (!tick(triggerNativeEvent)) return void stopAutoChange();
+        startTickTimeout.start(startDelay, ()=>{
+            tickInterval.start(tickDelay, ()=>{
+                if (!tick(triggerNativeEvent)) stopAutoChange();
+            });
+        });
+    }
+    __rspack_external_react.useEffect(()=>()=>stopAutoChange(), [
+        stopAutoChange
+    ]);
+    const pointerHandlers = {
+        onTouchStart () {
+            isTouchingButtonRef.current = true;
+        },
+        onTouchEnd () {
+            isTouchingButtonRef.current = false;
+        },
+        onPointerDown (event) {
+            const isMainButton = !event.button || 0 === event.button;
+            if (event.defaultPrevented || !isMainButton || disabled || readOnly) return;
+            pointerTypeRef.current = event.pointerType;
+            ignoreClickRef.current = false;
+            isPressedRef.current = true;
+            downCoordsRef.current = {
+                x: event.clientX,
+                y: event.clientY
+            };
+            const isTouchPointer = isTouchLikePointerType(event.pointerType);
+            if (isTouchPointer) intentionalTouchCheckTimeout.start(TOUCH_TIMEOUT, ()=>{
+                const moves = movesAfterTouchRef.current;
+                movesAfterTouchRef.current = 0;
+                const stillPressed = isPressedRef.current;
+                if (stillPressed && moves < MAX_POINTER_MOVES_AFTER_TOUCH) {
+                    startAutoChange(event.nativeEvent);
+                    ignoreClickRef.current = true;
+                } else {
+                    ignoreClickRef.current = false;
+                    stopAutoChange();
+                }
+            });
+            else {
+                event.preventDefault();
+                startAutoChange(event.nativeEvent);
+            }
+        },
+        onPointerUp (event) {
+            if (isTouchLikePointerType(event.pointerType)) isPressedRef.current = false;
+        },
+        onPointerMove (event) {
+            if (disabled || readOnly || !isTouchLikePointerType(event.pointerType) || !isPressedRef.current) return;
+            if (null != movesAfterTouchRef.current) movesAfterTouchRef.current += 1;
+            const { x, y } = downCoordsRef.current;
+            const dx = x - event.clientX;
+            const dy = y - event.clientY;
+            if (dx ** 2 + dy ** 2 > scrollDistance ** 2) stopAutoChange();
+        },
+        onMouseEnter (event) {
+            if (event.defaultPrevented || disabled || readOnly || !isPressedRef.current || isTouchingButtonRef.current || isTouchLikePointerType(pointerTypeRef.current)) return;
+            startAutoChange(event.nativeEvent);
+        },
+        onMouseLeave () {
+            if (isTouchingButtonRef.current) return;
+            stopAutoChange();
+        },
+        onMouseUp () {
+            if (isTouchingButtonRef.current) return;
+            stopAutoChange();
+        }
+    };
+    const shouldSkipClick = useStableCallback((event)=>{
+        if (event.defaultPrevented) return true;
+        if (isTouchLikePointerType(pointerTypeRef.current)) return ignoreClickRef.current;
+        return 0 !== event.detail;
+    });
+    return {
+        pointerHandlers,
+        shouldSkipClick
+    };
+}
+function useNumberFieldButton_isTouchLikePointerType(pointerType) {
+    return 'touch' === pointerType || 'pen' === pointerType;
+}
+function useNumberFieldButton(params) {
+    const { allowInputSyncRef, disabled, formatOptionsRef, getStepAmount, id, incrementValue, inputRef, inputValue, isIncrement, locale, readOnly, setValue, valueRef, lastChangedValueRef, onValueCommitted } = params;
+    const pressReason = isIncrement ? incrementPress : decrementPress;
+    function commitValue(nativeEvent) {
+        allowInputSyncRef.current = true;
+        const parsedValue = parseNumber(inputValue, locale, formatOptionsRef.current);
+        if (null !== parsedValue) {
+            valueRef.current = parsedValue;
+            setValue(parsedValue, createChangeEventDetails(pressReason, nativeEvent, void 0, {
+                direction: isIncrement ? 1 : -1
+            }));
+        }
+    }
+    const { pointerHandlers, shouldSkipClick } = usePressAndHold({
+        disabled: disabled || readOnly,
+        elementRef: inputRef,
+        tickDelay: 60,
+        startDelay: 400,
+        scrollDistance: 8,
+        tick (triggerEvent) {
+            const amount = getStepAmount(triggerEvent) ?? 1;
+            return incrementValue(amount, {
+                direction: isIncrement ? 1 : -1,
+                event: triggerEvent,
+                reason: pressReason
+            });
+        },
+        onStop (nativeEvent) {
+            const committed = lastChangedValueRef.current ?? valueRef.current;
+            onValueCommitted(committed, createGenericEventDetails(pressReason, nativeEvent));
+        }
+    });
+    const props = {
+        disabled,
+        'aria-readonly': readOnly || void 0,
+        '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.nativeEvent);
+            const amount = getStepAmount(event) ?? 1;
+            const prev = valueRef.current;
+            incrementValue(amount, {
+                direction: isIncrement ? 1 : -1,
+                event: event.nativeEvent,
+                reason: pressReason
+            });
+            const committed = lastChangedValueRef.current ?? valueRef.current;
+            if (committed !== prev) onValueCommitted(committed, createGenericEventDetails(pressReason, event.nativeEvent));
+        },
+        onPointerDown (event) {
+            const isMainButton = !event.button || 0 === event.button;
+            if (event.defaultPrevented || readOnly || !isMainButton || disabled) return;
+            commitValue(event.nativeEvent);
+            if (!useNumberFieldButton_isTouchLikePointerType(event.pointerType)) inputRef.current?.focus();
+            pointerHandlers.onPointerDown(event);
+        }
+    };
+    return props;
+}
+const NumberFieldIncrement_NumberFieldIncrement = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { render, className, disabled: disabledProp = false, nativeButton = true, style, ...elementProps } = componentProps;
+    const { allowInputSyncRef, disabled: contextDisabled, formatOptionsRef, getStepAmount, id, incrementValue, inputRef, inputValue, locale, maxWithDefault, readOnly, setValue, state, value, valueRef, lastChangedValueRef, onValueCommitted } = useNumberFieldRootContext();
+    const isMax = null != value && value >= maxWithDefault;
+    const disabled = disabledProp || contextDisabled || isMax;
+    const props = useNumberFieldButton({
+        isIncrement: true,
+        inputRef,
+        inputValue,
+        disabled,
+        readOnly,
+        id,
+        setValue,
+        getStepAmount,
+        incrementValue,
+        allowInputSyncRef,
+        formatOptionsRef,
+        valueRef,
+        locale,
+        lastChangedValueRef,
+        onValueCommitted
+    });
+    const { getButtonProps, buttonRef } = useButton({
+        disabled,
+        native: nativeButton,
+        focusableWhenDisabled: true
+    });
+    const buttonState = __rspack_external_react.useMemo(()=>({
+            ...state,
+            disabled
+        }), [
+        state,
+        disabled
+    ]);
+    const element = useRenderElement('button', componentProps, {
+        ref: [
+            forwardedRef,
+            buttonRef
+        ],
+        state: buttonState,
+        props: [
+            props,
+            elementProps,
+            getButtonProps
+        ],
+        stateAttributesMapping: stateAttributesMapping
+    });
+    return element;
+});
+if ("production" !== process.env.NODE_ENV) NumberFieldIncrement_NumberFieldIncrement.displayName = "NumberFieldIncrement";
+const NumberFieldDecrement_NumberFieldDecrement = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { render, className, disabled: disabledProp = false, nativeButton = true, style, ...elementProps } = componentProps;
+    const { allowInputSyncRef, disabled: contextDisabled, formatOptionsRef, getStepAmount, id, incrementValue, inputRef, inputValue, minWithDefault, readOnly, setValue, state, value, valueRef, locale, lastChangedValueRef, onValueCommitted } = useNumberFieldRootContext();
+    const isMin = null != value && value <= minWithDefault;
+    const disabled = disabledProp || contextDisabled || isMin;
+    const props = useNumberFieldButton({
+        isIncrement: false,
+        inputRef,
+        inputValue,
+        disabled,
+        readOnly,
+        id,
+        setValue,
+        getStepAmount,
+        incrementValue,
+        allowInputSyncRef,
+        formatOptionsRef,
+        valueRef,
+        locale,
+        lastChangedValueRef,
+        onValueCommitted
+    });
+    const { getButtonProps, buttonRef } = useButton({
+        disabled,
+        native: nativeButton,
+        focusableWhenDisabled: true
+    });
+    const buttonState = __rspack_external_react.useMemo(()=>({
+            ...state,
+            disabled
+        }), [
+        state,
+        disabled
+    ]);
+    const element = useRenderElement('button', componentProps, {
+        ref: [
+            forwardedRef,
+            buttonRef
+        ],
+        state: buttonState,
+        props: [
+            props,
+            elementProps,
+            getButtonProps
+        ],
+        stateAttributesMapping: stateAttributesMapping
+    });
+    return element;
+});
+if ("production" !== process.env.NODE_ENV) NumberFieldDecrement_NumberFieldDecrement.displayName = "NumberFieldDecrement";
+const NumberFieldInput_stateAttributesMapping = {
+    ...fieldValidityMapping,
+    ...stateAttributesMapping
+};
+const NAVIGATE_KEYS = new Set([
+    'Backspace',
+    'Delete',
+    'ArrowLeft',
+    'ArrowRight',
+    'Tab',
+    'Enter',
+    'Escape'
+]);
+const NumberFieldInput_NumberFieldInput = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { render, className, style, ...elementProps } = componentProps;
+    const { allowInputSyncRef, disabled, formatOptionsRef, getAllowedNonNumericKeys, getStepAmount, id, incrementValue, inputMode, inputValue, max, min, name, readOnly, required, setValue, state, setInputValue, locale, inputRef, value, onValueCommitted, lastChangedValueRef, hasPendingCommitRef, valueRef } = useNumberFieldRootContext();
+    const { clearErrors } = useFormContext();
+    const { validationMode, setTouched, setFocused, invalid, shouldValidateOnChange, validation } = useFieldRootContext();
+    const { labelId } = useLabelableContext();
+    const hasTouchedInputRef = __rspack_external_react.useRef(false);
+    const blockRevalidationRef = __rspack_external_react.useRef(false);
+    useRegisterFieldControl(inputRef, id, value);
+    useValueChanged(value, (previousValue)=>{
+        const validateOnChange = shouldValidateOnChange();
+        clearErrors(name);
+        if (validateOnChange) validation.commit(value);
+        if (previousValue === value || validateOnChange) return;
+        if (blockRevalidationRef.current) {
+            blockRevalidationRef.current = false;
+            return;
+        }
+        validation.commit(value, true);
+    });
+    const inputProps = {
+        id,
+        required,
+        disabled,
+        readOnly,
+        inputMode,
+        value: inputValue,
+        type: 'text',
+        autoComplete: 'off',
+        autoCorrect: 'off',
+        spellCheck: 'false',
+        "aria-roledescription": 'Number field',
+        'aria-invalid': invalid || void 0,
+        'aria-labelledby': labelId,
+        suppressHydrationWarning: true,
+        onFocus (event) {
+            if (event.defaultPrevented || readOnly || 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 || readOnly || disabled) return;
+            setTouched(true);
+            setFocused(false);
+            const hadManualInput = !allowInputSyncRef.current;
+            const hadPendingProgrammaticChange = hasPendingCommitRef.current;
+            allowInputSyncRef.current = true;
+            if ('' === inputValue.trim()) {
+                setValue(null, createChangeEventDetails(inputClear, event.nativeEvent));
+                if ('onBlur' === validationMode) validation.commit(null);
+                onValueCommitted(null, createGenericEventDetails(inputClear, event.nativeEvent));
+                return;
+            }
+            const formatOptions = formatOptionsRef.current;
+            const parsedValue = parseNumber(inputValue, locale, formatOptions);
+            if (null === parsedValue) return;
+            const hasExplicitPrecision = formatOptions?.maximumFractionDigits != null || formatOptions?.minimumFractionDigits != null;
+            const maxFrac = formatOptions?.maximumFractionDigits;
+            const committed = hasExplicitPrecision && 'number' == typeof maxFrac ? Number(parsedValue.toFixed(maxFrac)) : parsedValue;
+            const nextEventDetails = createGenericEventDetails(inputBlur, event.nativeEvent);
+            const shouldUpdateValue = value !== committed;
+            const shouldCommit = hadManualInput || shouldUpdateValue || hadPendingProgrammaticChange;
+            if ('onBlur' === validationMode) validation.commit(committed);
+            if (shouldUpdateValue) {
+                blockRevalidationRef.current = true;
+                setValue(committed, createChangeEventDetails(inputBlur, event.nativeEvent));
+            }
+            if (shouldCommit) onValueCommitted(committed, nextEventDetails);
+            const canonicalText = formatNumber(committed, locale, formatOptions);
+            const shouldPreserveFullPrecision = !hasExplicitPrecision && parsedValue === value && inputValue === formatNumberMaxPrecision(parsedValue, locale, formatOptions);
+            if (!shouldPreserveFullPrecision && inputValue !== canonicalText) setInputValue(canonicalText);
+        },
+        onChange (event) {
+            if (event.nativeEvent.defaultPrevented) return;
+            allowInputSyncRef.current = false;
+            const targetValue = event.currentTarget.value;
+            if ('' === targetValue.trim()) {
+                setInputValue(targetValue);
+                setValue(null, createChangeEventDetails(inputClear, event.nativeEvent));
+                return;
+            }
+            const allowedNonNumericKeys = getAllowedNonNumericKeys();
+            const isValidCharacterString = Array.from(targetValue).every((ch)=>{
+                const isAsciiDigit = ch >= '0' && ch <= '9';
+                const isArabicNumeral = ARABIC_DETECT_RE.test(ch);
+                const isHanNumeral = HAN_DETECT_RE.test(ch);
+                const isPersianNumeral = PERSIAN_DETECT_RE.test(ch);
+                const isFullwidthNumeral = FULLWIDTH_DETECT_RE.test(ch);
+                const isMinus = ANY_MINUS_DETECT_RE.test(ch);
+                return isAsciiDigit || isArabicNumeral || isHanNumeral || isPersianNumeral || isFullwidthNumeral || isMinus || allowedNonNumericKeys.has(ch);
+            });
+            if (!isValidCharacterString) return;
+            const parsedValue = parseNumber(targetValue, locale, formatOptionsRef.current);
+            setInputValue(targetValue);
+            if (null !== parsedValue) setValue(parsedValue, createChangeEventDetails(inputChange, event.nativeEvent));
+        },
+        onKeyDown (event) {
+            if (event.defaultPrevented || readOnly || disabled) return;
+            const nativeEvent = event.nativeEvent;
+            allowInputSyncRef.current = true;
+            const allowedNonNumericKeys = getAllowedNonNumericKeys();
+            let isAllowedNonNumericKey = allowedNonNumericKeys.has(event.key);
+            const { decimal, currency, percentSign } = getNumberLocaleDetails(locale, formatOptionsRef.current);
+            const selectionStart = event.currentTarget.selectionStart;
+            const selectionEnd = event.currentTarget.selectionEnd;
+            const isAllSelected = 0 === selectionStart && selectionEnd === inputValue.length;
+            const selectionContainsIndex = (index)=>null != selectionStart && null != selectionEnd && index >= selectionStart && index < selectionEnd;
+            if (ANY_MINUS_DETECT_RE.test(event.key) && Array.from(allowedNonNumericKeys).some((k)=>ANY_MINUS_DETECT_RE.test(k || ''))) {
+                const existingIndex = inputValue.search(ANY_MINUS_RE);
+                const isReplacingExisting = null != existingIndex && -1 !== existingIndex && selectionContainsIndex(existingIndex);
+                isAllowedNonNumericKey = !(ANY_MINUS_DETECT_RE.test(inputValue) || ANY_PLUS_DETECT_RE.test(inputValue)) || isAllSelected || isReplacingExisting;
+            }
+            if (ANY_PLUS_DETECT_RE.test(event.key) && Array.from(allowedNonNumericKeys).some((k)=>ANY_PLUS_DETECT_RE.test(k || ''))) {
+                const existingIndex = inputValue.search(ANY_PLUS_RE);
+                const isReplacingExisting = null != existingIndex && -1 !== existingIndex && selectionContainsIndex(existingIndex);
+                isAllowedNonNumericKey = !(ANY_MINUS_DETECT_RE.test(inputValue) || ANY_PLUS_DETECT_RE.test(inputValue)) || isAllSelected || isReplacingExisting;
+            }
+            [
+                decimal,
+                currency,
+                percentSign
+            ].forEach((symbol)=>{
+                if (event.key === symbol) {
+                    const symbolIndex = inputValue.indexOf(symbol);
+                    const isSymbolHighlighted = selectionContainsIndex(symbolIndex);
+                    isAllowedNonNumericKey = !inputValue.includes(symbol) || isAllSelected || isSymbolHighlighted;
+                }
+            });
+            const isAsciiDigit = event.key >= '0' && event.key <= '9';
+            const isArabicNumeral = ARABIC_DETECT_RE.test(event.key);
+            const isHanNumeral = HAN_DETECT_RE.test(event.key);
+            const isPersianNumeral = PERSIAN_DETECT_RE.test(event.key);
+            const isFullwidthNumeral = FULLWIDTH_DETECT_RE.test(event.key);
+            const isNavigateKey = NAVIGATE_KEYS.has(event.key);
+            if (229 === event.which || event.altKey || event.ctrlKey || event.metaKey || isAllowedNonNumericKey || isAsciiDigit || isArabicNumeral || isFullwidthNumeral || isHanNumeral || isPersianNumeral || isNavigateKey) return;
+            const parsedValue = parseNumber(inputValue, locale, formatOptionsRef.current);
+            const amount = getStepAmount(event) ?? 1;
+            stopEvent(event);
+            const commitDetails = createGenericEventDetails(keyboard, nativeEvent);
+            if ('ArrowUp' === event.key) {
+                incrementValue(amount, {
+                    direction: 1,
+                    currentValue: parsedValue,
+                    event: nativeEvent,
+                    reason: keyboard
+                });
+                onValueCommitted(lastChangedValueRef.current ?? valueRef.current, commitDetails);
+            } else if ('ArrowDown' === event.key) {
+                incrementValue(amount, {
+                    direction: -1,
+                    currentValue: parsedValue,
+                    event: nativeEvent,
+                    reason: keyboard
+                });
+                onValueCommitted(lastChangedValueRef.current ?? valueRef.current, commitDetails);
+            } else if ('Home' === event.key && null != min) {
+                setValue(min, createChangeEventDetails(keyboard, nativeEvent));
+                onValueCommitted(lastChangedValueRef.current ?? valueRef.current, commitDetails);
+            } else if ('End' === event.key && null != max) {
+                setValue(max, createChangeEventDetails(keyboard, nativeEvent));
+                onValueCommitted(lastChangedValueRef.current ?? valueRef.current, commitDetails);
+            }
+        },
+        onPaste (event) {
+            if (event.defaultPrevented || readOnly || disabled) return;
+            event.preventDefault();
+            const clipboardData = event.clipboardData || window.Clipboard;
+            const pastedData = clipboardData.getData('text/plain');
+            const parsedValue = parseNumber(pastedData, locale, formatOptionsRef.current);
+            if (null !== parsedValue) {
+                allowInputSyncRef.current = false;
+                setValue(parsedValue, createChangeEventDetails(inputPaste, event.nativeEvent));
+                setInputValue(pastedData);
+            }
+        }
+    };
+    const element = useRenderElement('input', componentProps, {
+        ref: [
+            forwardedRef,
+            inputRef
+        ],
+        state,
+        props: [
+            inputProps,
+            validation.getValidationProps(),
+            elementProps
+        ],
+        stateAttributesMapping: NumberFieldInput_stateAttributesMapping
+    });
+    return element;
+});
+if ("production" !== process.env.NODE_ENV) NumberFieldInput_NumberFieldInput.displayName = "NumberFieldInput";
+const NumberFieldScrubAreaContext = /*#__PURE__*/ __rspack_external_react.createContext(void 0);
+if ("production" !== process.env.NODE_ENV) NumberFieldScrubAreaContext.displayName = "NumberFieldScrubAreaContext";
+function useNumberFieldScrubAreaContext() {
+    const context = __rspack_external_react.useContext(NumberFieldScrubAreaContext);
+    if (void 0 === context) throw new Error("production" !== process.env.NODE_ENV ? 'Base UI: NumberFieldScrubAreaContext is missing. NumberFieldScrubArea parts must be placed within <NumberField.ScrubArea>.' : esm_formatErrorMessage(44));
+    return context;
+}
+function getViewportRect(teleportDistance, scrubAreaEl) {
+    const win = getWindow(scrubAreaEl);
+    const rect = scrubAreaEl.getBoundingClientRect();
+    if (rect && null != teleportDistance) return {
+        x: rect.left - teleportDistance / 2,
+        y: rect.top - teleportDistance / 2,
+        width: rect.right + teleportDistance / 2,
+        height: rect.bottom + teleportDistance / 2
+    };
+    const vV = win.visualViewport;
+    if (vV) return {
+        x: vV.offsetLeft,
+        y: vV.offsetTop,
+        width: vV.offsetLeft + vV.width,
+        height: vV.offsetTop + vV.height
+    };
+    return {
+        x: 0,
+        y: 0,
+        width: win.document.documentElement.clientWidth,
+        height: win.document.documentElement.clientHeight
+    };
+}
+function subscribeToVisualViewportResize(element, visualScaleRef) {
+    const vV = getWindow(element).visualViewport;
+    if (!vV) return ()=>{};
+    function handleVisualResize() {
+        if (vV) visualScaleRef.current = vV.scale;
+    }
+    handleVisualResize();
+    return addEventListener(vV, 'resize', handleVisualResize);
+}
+const NumberFieldScrubArea_NumberFieldScrubArea = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { render, className, direction = 'horizontal', pixelSensitivity = 2, teleportDistance, style, ...elementProps } = componentProps;
+    const { state, setIsScrubbing: setRootScrubbing, disabled, readOnly, inputRef, incrementValue, allowInputSyncRef, getStepAmount, onValueCommitted, lastChangedValueRef, valueRef } = useNumberFieldRootContext();
+    const scrubAreaRef = __rspack_external_react.useRef(null);
+    const isScrubbingRef = __rspack_external_react.useRef(false);
+    const didMoveRef = __rspack_external_react.useRef(false);
+    const pointerDownTargetRef = __rspack_external_react.useRef(null);
+    const scrubAreaCursorRef = __rspack_external_react.useRef(null);
+    const virtualCursorCoords = __rspack_external_react.useRef({
+        x: 0,
+        y: 0
+    });
+    const visualScaleRef = __rspack_external_react.useRef(1);
+    const exitPointerLockTimeout = useTimeout();
+    const [isTouchInput, setIsTouchInput] = __rspack_external_react.useState(false);
+    const [isPointerLockDenied, setIsPointerLockDenied] = __rspack_external_react.useState(false);
+    const [isScrubbing, setIsScrubbing] = __rspack_external_react.useState(false);
+    __rspack_external_react.useEffect(()=>{
+        if (!isScrubbing || !scrubAreaCursorRef.current) return;
+        return subscribeToVisualViewportResize(scrubAreaCursorRef.current, visualScaleRef);
+    }, [
+        isScrubbing
+    ]);
+    function updateCursorTransform(x, y) {
+        if (scrubAreaCursorRef.current) scrubAreaCursorRef.current.style.transform = `translate3d(${x}px,${y}px,0) scale(${1 / visualScaleRef.current})`;
+    }
+    const onScrub = useStableCallback(({ movementX, movementY })=>{
+        const virtualCursor = scrubAreaCursorRef.current;
+        const scrubAreaEl = scrubAreaRef.current;
+        if (!virtualCursor || !scrubAreaEl) return;
+        const rect = getViewportRect(teleportDistance, scrubAreaEl);
+        const coords = virtualCursorCoords.current;
+        const newCoords = {
+            x: Math.round(coords.x + movementX),
+            y: Math.round(coords.y + movementY)
+        };
+        const cursorWidth = virtualCursor.offsetWidth;
+        const cursorHeight = virtualCursor.offsetHeight;
+        if (newCoords.x + cursorWidth / 2 < rect.x) newCoords.x = rect.width - cursorWidth / 2;
+        else if (newCoords.x + cursorWidth / 2 > rect.width) newCoords.x = rect.x - cursorWidth / 2;
+        if (newCoords.y + cursorHeight / 2 < rect.y) newCoords.y = rect.height - cursorHeight / 2;
+        else if (newCoords.y + cursorHeight / 2 > rect.height) newCoords.y = rect.y - cursorHeight / 2;
+        virtualCursorCoords.current = newCoords;
+        updateCursorTransform(newCoords.x, newCoords.y);
+    });
+    const onScrubbingChange = useStableCallback((scrubbingValue, { clientX, clientY })=>{
+        __rspack_external_react_dom_7136dc57.flushSync(()=>{
+            setIsScrubbing(scrubbingValue);
+            setRootScrubbing(scrubbingValue);
+        });
+        const virtualCursor = scrubAreaCursorRef.current;
+        if (!virtualCursor || !scrubbingValue) return;
+        const initialCoords = {
+            x: clientX - virtualCursor.offsetWidth / 2,
+            y: clientY - virtualCursor.offsetHeight / 2
+        };
+        virtualCursorCoords.current = initialCoords;
+        updateCursorTransform(initialCoords.x, initialCoords.y);
+    });
+    __rspack_external_react.useEffect(function() {
+        if (!inputRef.current || disabled || readOnly || !isScrubbing) return;
+        let cumulativeDelta = 0;
+        function handleScrubPointerUp(event) {
+            function handler() {
+                try {
+                    ownerDocument(scrubAreaRef.current).exitPointerLock();
+                } catch  {} finally{
+                    isScrubbingRef.current = false;
+                    onScrubbingChange(false, event);
+                    onValueCommitted(lastChangedValueRef.current ?? valueRef.current, createGenericEventDetails("scrub", event));
+                    const pointerDownTarget = pointerDownTargetRef.current;
+                    const input = inputRef.current;
+                    if (!didMoveRef.current && null != pointerDownTarget && input) pointerDownTarget.dispatchEvent(new (getWindow(input)).MouseEvent('click', {
+                        bubbles: true,
+                        cancelable: true
+                    }));
+                    didMoveRef.current = false;
+                    pointerDownTargetRef.current = null;
+                }
+            }
+            if (isFirefox) exitPointerLockTimeout.start(20, handler);
+            else handler();
+        }
+        function handleScrubPointerMove(event) {
+            if (!isScrubbingRef.current) return;
+            event.preventDefault();
+            onScrub(event);
+            const { movementX, movementY } = event;
+            cumulativeDelta += 'vertical' === direction ? movementY : movementX;
+            if (Math.abs(cumulativeDelta) >= pixelSensitivity) {
+                cumulativeDelta = 0;
+                didMoveRef.current = true;
+                const dValue = 'vertical' === direction ? -movementY : movementX;
+                const stepAmount = getStepAmount(event) ?? 1;
+                const rawAmount = dValue * stepAmount;
+                if (0 !== rawAmount) {
+                    allowInputSyncRef.current = true;
+                    incrementValue(Math.abs(rawAmount), {
+                        direction: rawAmount >= 0 ? 1 : -1,
+                        event,
+                        reason: "scrub"
+                    });
+                }
+            }
+        }
+        const win = getWindow(inputRef.current);
+        const unsubscribe = mergeCleanups(addEventListener(win, 'pointerup', handleScrubPointerUp, true), addEventListener(win, 'pointermove', handleScrubPointerMove, true));
+        return ()=>{
+            exitPointerLockTimeout.clear();
+            unsubscribe();
+        };
+    }, [
+        disabled,
+        readOnly,
+        allowInputSyncRef,
+        incrementValue,
+        isScrubbing,
+        getStepAmount,
+        inputRef,
+        onScrubbingChange,
+        onScrub,
+        direction,
+        pixelSensitivity,
+        lastChangedValueRef,
+        onValueCommitted,
+        valueRef,
+        exitPointerLockTimeout
+    ]);
+    __rspack_external_react.useEffect(function() {
+        const element = scrubAreaRef.current;
+        if (!element || disabled || readOnly) return;
+        function handleTouchStart(event) {
+            if (1 === event.touches.length) event.preventDefault();
+        }
+        return addEventListener(element, 'touchstart', handleTouchStart);
+    }, [
+        disabled,
+        readOnly
+    ]);
+    const defaultProps = {
+        role: 'presentation',
+        style: {
+            touchAction: 'none',
+            WebkitUserSelect: 'none',
+            userSelect: 'none'
+        },
+        async onPointerDown (event) {
+            const isMainButton = !event.button || 0 === event.button;
+            if (event.defaultPrevented || readOnly || !isMainButton || disabled) return;
+            const isTouch = 'touch' === event.pointerType;
+            setIsTouchInput(isTouch);
+            if ('mouse' === event.pointerType) {
+                event.preventDefault();
+                inputRef.current?.focus();
+            }
+            isScrubbingRef.current = true;
+            didMoveRef.current = false;
+            pointerDownTargetRef.current = getTarget(event.nativeEvent);
+            onScrubbingChange(true, event.nativeEvent);
+            if (!isTouch && !isWebKit) try {
+                await ownerDocument(scrubAreaRef.current).body.requestPointerLock();
+                setIsPointerLockDenied(false);
+            } catch (error) {
+                setIsPointerLockDenied(true);
+            } finally{
+                if (isScrubbingRef.current) __rspack_external_react_dom_7136dc57.flushSync(()=>{
+                    onScrubbingChange(true, event.nativeEvent);
+                });
+            }
+        }
+    };
+    const element = useRenderElement('span', componentProps, {
+        ref: [
+            forwardedRef,
+            scrubAreaRef
+        ],
+        state,
+        props: [
+            defaultProps,
+            elementProps
+        ],
+        stateAttributesMapping: stateAttributesMapping
+    });
+    const contextValue = __rspack_external_react.useMemo(()=>({
+            isScrubbing,
+            isTouchInput,
+            isPointerLockDenied,
+            scrubAreaCursorRef,
+            scrubAreaRef,
+            direction,
+            pixelSensitivity,
+            teleportDistance
+        }), [
+        isScrubbing,
+        isTouchInput,
+        isPointerLockDenied,
+        direction,
+        pixelSensitivity,
+        teleportDistance
+    ]);
+    return /*#__PURE__*/ jsx(NumberFieldScrubAreaContext.Provider, {
+        value: contextValue,
+        children: element
+    });
+});
+if ("production" !== process.env.NODE_ENV) NumberFieldScrubArea_NumberFieldScrubArea.displayName = "NumberFieldScrubArea";
+const NumberFieldScrubAreaCursor_NumberFieldScrubAreaCursor = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { render, className, style, ...elementProps } = componentProps;
+    const { state } = useNumberFieldRootContext();
+    const { isScrubbing, isTouchInput, isPointerLockDenied, scrubAreaCursorRef } = useNumberFieldScrubAreaContext();
+    const [domElement, setDomElement] = __rspack_external_react.useState(null);
+    const shouldRender = isScrubbing && !isWebKit && !isTouchInput && !isPointerLockDenied;
+    const element = useRenderElement('span', componentProps, {
+        enabled: shouldRender,
+        ref: [
+            forwardedRef,
+            scrubAreaCursorRef,
+            setDomElement
+        ],
+        state,
+        props: [
+            {
+                role: 'presentation',
+                style: {
+                    position: 'fixed',
+                    top: 0,
+                    left: 0,
+                    pointerEvents: 'none'
+                }
+            },
+            elementProps
+        ],
+        stateAttributesMapping: stateAttributesMapping
+    });
+    return element && /*#__PURE__*/ __rspack_external_react_dom_7136dc57.createPortal(element, ownerDocument(domElement).body);
+});
+if ("production" !== process.env.NODE_ENV) NumberFieldScrubAreaCursor_NumberFieldScrubAreaCursor.displayName = "NumberFieldScrubAreaCursor";
 const NumberField_module = {
     root: "root-XA6trs",
     group: "group-lqMZOf",
@@ -10,42 +1408,42 @@ const NumberField_module = {
     decrement: "decrement-zkpqlA",
     scrubArea: "scrubArea-XsXHM_"
 };
-const Root = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberField.Root, {
+const Root = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberFieldRoot_NumberFieldRoot, {
         ref: ref,
         className: clsx(NumberField_module.root, className),
         ...props
     }));
-const Group = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberField.Group, {
+const Group = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberFieldGroup_NumberFieldGroup, {
         ref: ref,
         className: clsx(NumberField_module.group, className),
         ...props
     }));
-const Increment = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberField.Increment, {
+const Increment = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberFieldIncrement_NumberFieldIncrement, {
         ref: ref,
         className: clsx(NumberField_module.increment, className),
         ...props
     }));
-const Decrement = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberField.Decrement, {
+const Decrement = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberFieldDecrement_NumberFieldDecrement, {
         ref: ref,
         className: clsx(NumberField_module.decrement, className),
         ...props
     }));
-const Input = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberField.Input, {
+const Input = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberFieldInput_NumberFieldInput, {
         ref: ref,
         className: clsx(NumberField_module.input, className),
         ...props
     }));
-const ScrubArea = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberField.ScrubArea, {
+const ScrubArea = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberFieldScrubArea_NumberFieldScrubArea, {
         ref: ref,
         className: clsx(NumberField_module.scrubArea, className),
         ...props
     }));
-const ScrubAreaCursor = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberField.ScrubAreaCursor, {
+const ScrubAreaCursor = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(NumberFieldScrubAreaCursor_NumberFieldScrubAreaCursor, {
         ref: ref,
         className: clsx(NumberField_module.scrubAreaCursor, className),
         ...props
     }));
-const NumberField_NumberField = {
+const NumberField = {
     Root: Root,
     Group: Group,
     Increment: Increment,
@@ -54,4 +1452,4 @@ const NumberField_NumberField = {
     ScrubArea: ScrubArea,
     ScrubAreaCursor: ScrubAreaCursor
 };
-export { NumberField_NumberField as NumberField };
+export { NumberField };