xmlui 0.10.11 → 0.10.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xmlui",
-  "version": "0.10.11",
+  "version": "0.10.12",
   "sideEffects": false,
   "scripts": {
     "start-test-bed": "cd src/testing/infrastructure && xmlui start",

package/dist/scripts/src/components/NumberBox/NumberBox2.js

@@ -1,99 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.numberBox2ComponentRenderer = exports.NumberBoxMd2 = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const NumberBox_module_scss_1 = __importDefault(require("./NumberBox.module.scss"));
-const renderers_1 = require("../../components-core/renderers");
-const themeVars_1 = require("../../components-core/theming/themeVars");
-const metadata_helpers_1 = require("../metadata-helpers");
-const NumberBox2Native_1 = require("./NumberBox2Native");
-const COMP = "NumberBox2";
-exports.NumberBoxMd2 = (0, metadata_helpers_1.createMetadata)({
-    status: "experimental",
-    description: `A \`${COMP}\` component allows users to input numeric values: either integer or floating ` +
-        `point numbers. It also accepts empty values, where the stored value will be of type \`null\`.`,
-    props: {
-        placeholder: (0, metadata_helpers_1.dPlaceholder)(),
-        initialValue: (0, metadata_helpers_1.dInitialValue)(),
-        label: (0, metadata_helpers_1.dLabel)(),
-        labelPosition: (0, metadata_helpers_1.dLabelPosition)(NumberBox2Native_1.defaultProps.labelPosition),
-        labelWidth: (0, metadata_helpers_1.dLabelWidth)(COMP),
-        labelBreak: (0, metadata_helpers_1.dLabelBreak)(COMP),
-        maxLength: (0, metadata_helpers_1.dMaxLength)(),
-        autoFocus: (0, metadata_helpers_1.dAutoFocus)(),
-        required: (0, metadata_helpers_1.dRequired)(),
-        readOnly: (0, metadata_helpers_1.dReadonly)(),
-        enabled: (0, metadata_helpers_1.dEnabled)(),
-        validationStatus: (0, metadata_helpers_1.dValidationStatus)(),
-        startText: (0, metadata_helpers_1.dStartText)(),
-        startIcon: (0, metadata_helpers_1.dStartIcon)(),
-        endText: (0, metadata_helpers_1.dEndText)(),
-        endIcon: (0, metadata_helpers_1.dEndIcon)(),
-        hasSpinBox: {
-            description: `This boolean prop shows (\`true\`) or hides (\`false\`) the spinner buttons for the input field.`,
-            valueType: "boolean",
-            defaultValue: NumberBox2Native_1.defaultProps.hasSpinBox,
-        },
-        spinnerUpIcon: (0, metadata_helpers_1.d)(`Allows setting the icon displayed in the ${COMP} spinner for incrementing values. You can change ` +
-            `the default icon for all ${COMP} instances with the "icon.spinnerUp:NumberBox" declaration in the ` +
-            `app configuration file.`),
-        spinnerDownIcon: (0, metadata_helpers_1.d)(`Allows setting the icon displayed in the ${COMP} spinner for decrementing values. You can change ` +
-            `the default icon for all ${COMP} instances with the "icon.spinnerDown:NumberBox" declaration in the ` +
-            `app configuration file.`),
-        step: {
-            description: `This prop governs how big the step when clicking on the spinner of the field.`,
-            valueType: "number",
-            defaultValue: NumberBox2Native_1.defaultProps.step,
-        },
-        integersOnly: {
-            description: `This boolean property signs whether the input field accepts integers only (\`true\`) ` +
-                `or not (\`false\`).`,
-            valueType: "boolean",
-            defaultValue: NumberBox2Native_1.defaultProps.integersOnly,
-        },
-        maxFractionDigits: {
-            description: `This prop sets the maximum number of decimal places allowed in the input field. ` +
-                `If the number of decimal places is greater than this value, the value will be truncated to the maximum allowed decimal places. `,
-            valueType: "number",
-            defaultValue: NumberBox2Native_1.defaultProps.maxFractionDigits,
-        },
-        zeroOrPositive: {
-            description: `This boolean property determines whether the input value can only be 0 or positive numbers ` +
-                `(\`true\`) or also negative (\`false\`).`,
-            valueType: "boolean",
-            defaultValue: NumberBox2Native_1.defaultProps.zeroOrPositive,
-        },
-        minValue: (0, metadata_helpers_1.d)(`The minimum value the input field allows. Can be a float or an integer if ` +
-            `[\`integersOnly\`](#integersonly) is set to \`false\`, otherwise it can only be an integer.`),
-        maxValue: (0, metadata_helpers_1.d)(`The maximum value the input field allows. Can be a float or an integer if ` +
-            `[\`integersOnly\`](#integersonly) is set to \`false\`, otherwise it can only be an integer.`),
-    },
-    events: {
-        gotFocus: (0, metadata_helpers_1.dGotFocus)(COMP),
-        lostFocus: (0, metadata_helpers_1.dLostFocus)(COMP),
-        didChange: (0, metadata_helpers_1.dDidChange)(COMP),
-    },
-    apis: {
-        focus: {
-            description: "This method focuses the input field of the component.",
-            signature: "focus(): void",
-        },
-        value: {
-            description: "This API retrieves the current value of the component.",
-            signature: "get value(): number | undefined",
-        },
-        setValue: {
-            description: "This API sets the value of the component.",
-            signature: "setValue(value: number | undefined): void",
-        },
-    },
-    themeVars: (0, themeVars_1.parseScssVar)(NumberBox_module_scss_1.default.themeVars),
-});
-exports.numberBox2ComponentRenderer = (0, renderers_1.createComponentRenderer)(COMP, exports.NumberBoxMd2, ({ node, state, updateState, lookupEventHandler, extractValue, className, registerComponentApi, }) => {
-    return ((0, jsx_runtime_1.jsx)(NumberBox2Native_1.NumberBox2, { className: className, value: state === null || state === void 0 ? void 0 : state.value, initialValue: extractValue.asOptionalString(node.props.initialValue), enabled: extractValue.asOptionalBoolean(node.props.enabled), placeholder: extractValue.asOptionalString(node.props.placeholder), validationStatus: extractValue(node.props.validationStatus), updateState: updateState, onDidChange: lookupEventHandler("didChange"), onFocus: lookupEventHandler("gotFocus"), onBlur: lookupEventHandler("lostFocus"), registerComponentApi: registerComponentApi, hasSpinBox: extractValue.asOptionalBoolean(node.props.hasSpinBox), step: extractValue(node.props.step), integersOnly: extractValue.asOptionalBoolean(node.props.integersOnly), zeroOrPositive: extractValue.asOptionalBoolean(node.props.zeroOrPositive), maxFractionDigits: extractValue.asOptionalNumber(node.props.maxFractionDigits), min: extractValue.asOptionalNumber(node.props.minValue), max: extractValue.asOptionalNumber(node.props.maxValue), startText: extractValue.asOptionalString(node.props.startText), startIcon: extractValue.asOptionalString(node.props.startIcon), endText: extractValue.asOptionalString(node.props.endText), endIcon: extractValue.asOptionalString(node.props.endIcon), spinnerUpIcon: extractValue.asOptionalString(node.props.spinnerUpIcon), spinnerDownIcon: extractValue.asOptionalString(node.props.spinnerDownIcon), autoFocus: extractValue.asOptionalBoolean(node.props.autoFocus), readOnly: extractValue.asOptionalBoolean(node.props.readOnly), 
-        //maxLength={extractValue(node.props.maxLength)}
-        label: extractValue(node.props.label), labelPosition: extractValue(node.props.labelPosition), labelWidth: extractValue(node.props.labelWidth), labelBreak: extractValue.asOptionalBoolean(node.props.labelBreak), required: extractValue.asOptionalBoolean(node.props.required) }));
-});

package/dist/scripts/src/components/NumberBox/NumberBox2Native.js

@@ -1,420 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NumberBox2 = exports.defaultProps = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importStar(require("react"));
-const classnames_1 = __importDefault(require("classnames"));
-const NumberBox_module_scss_1 = __importDefault(require("./NumberBox.module.scss"));
-const constants_1 = require("../../components-core/constants");
-const misc_1 = require("../../components-core/utils/misc");
-const numberbox_abstractions_1 = require("./numberbox-abstractions");
-const IconNative_1 = require("../Icon/IconNative");
-const InputAdornment_1 = require("../Input/InputAdornment");
-const ButtonNative_1 = require("../Button/ButtonNative");
-const ItemWithLabel_1 = require("../FormItem/ItemWithLabel");
-const lodash_es_1 = require("lodash-es");
-const number_1 = require("@internationalized/number");
-// Default props for NumberBox2 component
-exports.defaultProps = {
-    zeroOrPositive: false,
-    min: -numberbox_abstractions_1.NUMBERBOX_MAX_VALUE,
-    max: numberbox_abstractions_1.NUMBERBOX_MAX_VALUE,
-    maxFractionDigits: 3,
-    enabled: true,
-    integersOnly: false,
-    validationStatus: "none",
-    hasSpinBox: true,
-    step: 1,
-    labelPosition: "top",
-};
-exports.NumberBox2 = (0, react_1.forwardRef)(function NumberBox2(_a, forwardedRef) {
-    var _b, _c, _d;
-    var { id, style, className, value, initialValue, zeroOrPositive = exports.defaultProps.zeroOrPositive, min = zeroOrPositive ? 0 : exports.defaultProps.min, max = exports.defaultProps.max, maxFractionDigits = exports.defaultProps.maxFractionDigits, enabled = exports.defaultProps.enabled, placeholder, step = exports.defaultProps.step, integersOnly = exports.defaultProps.integersOnly, validationStatus = exports.defaultProps.validationStatus, hasSpinBox = exports.defaultProps.hasSpinBox, updateState = constants_1.noop, onDidChange = constants_1.noop, onFocus = constants_1.noop, onBlur = constants_1.noop, registerComponentApi, startText, startIcon, endText, endIcon, spinnerUpIcon, spinnerDownIcon, autoFocus, readOnly, required, label, labelPosition, labelWidth, labelBreak } = _a, rest = __rest(_a, ["id", "style", "className", "value", "initialValue", "zeroOrPositive", "min", "max", "maxFractionDigits", "enabled", "placeholder", "step", "integersOnly", "validationStatus", "hasSpinBox", "updateState", "onDidChange", "onFocus", "onBlur", "registerComponentApi", "startText", "startIcon", "endText", "endIcon", "spinnerUpIcon", "spinnerDownIcon", "autoFocus", "readOnly", "required", "label", "labelPosition", "labelWidth", "labelBreak"]);
-    const inputRef = (0, react_1.useRef)(null);
-    const upButton = (0, react_1.useRef)(null);
-    const downButton = (0, react_1.useRef)(null);
-    // Formatter & Parser
-    const locale = "en-US";
-    const formatOptions = (0, react_1.useMemo)(() => {
-        return {
-            useGrouping: false,
-            minimumFractionDigits: 0,
-            maximumFractionDigits: integersOnly ? 0 : maxFractionDigits,
-        };
-    }, [maxFractionDigits, integersOnly]);
-    const formatter = useNumberFormatter(locale, formatOptions);
-    const parser = useNumberParser(locale, formatOptions);
-    min = (0, numberbox_abstractions_1.clamp)((_b = (0, numberbox_abstractions_1.toUsableNumber)(min, true)) !== null && _b !== void 0 ? _b : (zeroOrPositive ? 0 : -numberbox_abstractions_1.NUMBERBOX_MAX_VALUE), (zeroOrPositive ? 0 : -numberbox_abstractions_1.NUMBERBOX_MAX_VALUE), numberbox_abstractions_1.NUMBERBOX_MAX_VALUE);
-    max = (0, numberbox_abstractions_1.clamp)((_c = (0, numberbox_abstractions_1.toUsableNumber)(max, true)) !== null && _c !== void 0 ? _c : (zeroOrPositive ? 0 : -numberbox_abstractions_1.NUMBERBOX_MAX_VALUE), (zeroOrPositive ? 0 : -numberbox_abstractions_1.NUMBERBOX_MAX_VALUE), numberbox_abstractions_1.NUMBERBOX_MAX_VALUE);
-    const initializeValue = (0, react_1.useCallback)((value, defaultValue = "") => {
-        return (0, numberbox_abstractions_1.isEmptyLike)(value) || (0, lodash_es_1.isNaN)(parser.parse(value.toString()))
-            ? defaultValue
-            : formatter.format((0, numberbox_abstractions_1.clamp)(+value, min, max));
-    }, [formatter, parser, min, max]);
-    // --- Convert to representable string value (from number | null | undefined)
-    const [valueStrRep, setValueStrRep] = react_1.default.useState(initializeValue(value));
-    (0, react_1.useLayoutEffect)(() => {
-        setValueStrRep(initializeValue(value));
-    }, [value, initializeValue]);
-    const onFixCursorPosition = useCursorCorrection(valueStrRep, inputRef);
-    const _step = (_d = (0, numberbox_abstractions_1.toUsableNumber)(step, true)) !== null && _d !== void 0 ? _d : numberbox_abstractions_1.DEFAULT_STEP;
-    const inputMode = (0, react_1.useMemo)(() => {
-        // The inputMode attribute influences the software keyboard that is shown on touch devices.
-        // Browsers and operating systems are quite inconsistent about what keys are available.
-        // We choose between numeric and decimal based on whether we allow negative and fractional numbers,
-        // and based on testing on various devices to determine what keys are available in each inputMode.
-        const hasDecimals = formatter.resolvedOptions().maximumFractionDigits > 0;
-        return hasDecimals ? "decimal" : "numeric";
-    }, [formatter]);
-    // --- Initialize the related field with the input's initial value
-    (0, react_1.useEffect)(() => {
-        updateState({ value: initialValue }, { initial: true });
-    }, [initialValue, updateState]);
-    const clampInputValue = (0, react_1.useCallback)((value) => {
-        return (0, numberbox_abstractions_1.clamp)(value, min, max);
-    }, [min, max]);
-    const clampAndSaveInput = (0, react_1.useCallback)((value) => {
-        if ((0, numberbox_abstractions_1.isEmptyLike)(value)) {
-            updateState({ value: null });
-            return;
-        }
-        value = value.toString();
-        // Set to empty state if input value is empty
-        if (!value.length) {
-            updateState({ value: null });
-            return;
-        }
-        let parsedValue = parser.parse(value);
-        parsedValue = clampInputValue(parsedValue);
-        // if it failed to parse, then reset input to formatted version of current number
-        if ((0, lodash_es_1.isNaN)(parsedValue)) {
-            updateState({ value });
-            return;
-        }
-        // value representation needs to be synchronized with the last parsed value
-        setValueStrRep((lastVal) => {
-            const formatted = formatter.format(parsedValue);
-            if (lastVal !== formatted) {
-                return formatted;
-            }
-            return lastVal;
-        });
-        updateState({ value: parsedValue });
-    }, [clampInputValue, updateState, parser, formatter]);
-    // --- Stepper logic
-    const increment = (0, react_1.useCallback)(() => {
-        if (!enabled)
-            return;
-        if (readOnly)
-            return;
-        const currentValue = (0, numberbox_abstractions_1.isEmptyLike)(value) || (0, lodash_es_1.isNaN)(value) ? "0" : value.toString();
-        const newValue = handleChangingValue(currentValue, parser, "increase", _step, min, max);
-        updateState({ value: newValue });
-    }, [value, enabled, readOnly, parser, _step, min, max, updateState]);
-    const decrement = (0, react_1.useCallback)(() => {
-        if (!enabled)
-            return;
-        if (readOnly)
-            return;
-        const currentValue = (0, numberbox_abstractions_1.isEmptyLike)(value) || (0, lodash_es_1.isNaN)(value) ? "0" : value.toString();
-        const newValue = handleChangingValue(currentValue, parser, "decrease", _step, min, max);
-        updateState({ value: newValue });
-    }, [value, enabled, readOnly, parser, _step, min, max, updateState]);
-    // --- Register stepper logic to buttons
-    useLongPress(upButton.current, increment);
-    useLongPress(downButton.current, decrement);
-    // --- Handle input
-    const _onBeforeInput = (0, react_1.useCallback)((event) => {
-        var _a, _b, _c;
-        const target = event.target;
-        const nextValue = parser.parse(target.value.slice(0, (_a = target.selectionStart) !== null && _a !== void 0 ? _a : undefined) +
-            ((_b = event.nativeEvent.data) !== null && _b !== void 0 ? _b : "") +
-            target.value.slice((_c = target.selectionEnd) !== null && _c !== void 0 ? _c : undefined)).toString();
-        // pre-validate
-        if (!parser.isValidPartialNumber(nextValue, min, max)) {
-            event.preventDefault();
-        }
-    }, [parser, min, max]);
-    const _onChange = (0, react_1.useCallback)((event) => {
-        const strValue = event.target.value;
-        let parsed = clampInputValue(parser.parse(event.target.value));
-        if (integersOnly && Number.isInteger(parsed)) {
-            parsed = Math.trunc(parsed);
-        }
-        // NOTE: This is the most important part.
-        // We only synchronize values when they are a valid number
-        // Otherwise we only update the local string representation and
-        // synchronize the value from state when the input is blurred.
-        if (canSynchronizeValue(strValue, locale, formatOptions)) {
-            updateState({ value: parsed });
-        }
-        else {
-            setValueStrRep(strValue);
-        }
-        // TODO: this needs to be adjusted based on the number of group separators (no group separators yet)
-        onFixCursorPosition(event);
-        onDidChange(parsed);
-    }, [
-        clampInputValue,
-        parser,
-        onDidChange,
-        locale,
-        formatOptions,
-        onFixCursorPosition,
-        updateState,
-        integersOnly,
-    ]);
-    const _onFocus = (0, react_1.useCallback)(() => {
-        onFocus === null || onFocus === void 0 ? void 0 : onFocus();
-    }, [onFocus]);
-    const _onBlur = (0, react_1.useCallback)((event) => {
-        const value = event.target.value;
-        clampAndSaveInput(value);
-        onBlur();
-    }, [clampAndSaveInput, onBlur]);
-    const _onKeyDown = (0, react_1.useCallback)((event) => {
-        if (event.key === "Enter") {
-            clampAndSaveInput(value);
-        }
-        if (event.code === "ArrowUp") {
-            event.preventDefault();
-            increment();
-        }
-        if (event.code === "ArrowDown") {
-            event.preventDefault();
-            decrement();
-        }
-    }, [clampAndSaveInput, increment, decrement, value]);
-    // --- Register API events
-    const focus = (0, react_1.useCallback)(() => {
-        var _a;
-        (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-    }, []);
-    (0, react_1.useEffect)(() => {
-        if (autoFocus) {
-            setTimeout(() => {
-                var _a;
-                (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-            }, 0);
-        }
-    }, [autoFocus]);
-    const setValue = (0, misc_1.useEvent)((newValue) => {
-        updateState({ value: newValue });
-    });
-    (0, react_1.useEffect)(() => {
-        registerComponentApi === null || registerComponentApi === void 0 ? void 0 : registerComponentApi({
-            focus,
-            setValue,
-        });
-    }, [focus, registerComponentApi, setValue]);
-    return ((0, jsx_runtime_1.jsx)(ItemWithLabel_1.ItemWithLabel, Object.assign({}, rest, { ref: forwardedRef, labelPosition: labelPosition, label: label, labelWidth: labelWidth, labelBreak: labelBreak, required: required, enabled: enabled, onFocus: onFocus, onBlur: onBlur, style: style, className: className, children: (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(NumberBox_module_scss_1.default.inputRoot, {
-                [NumberBox_module_scss_1.default.readOnly]: readOnly,
-                [NumberBox_module_scss_1.default.disabled]: !enabled,
-                [NumberBox_module_scss_1.default.noSpinBox]: !hasSpinBox,
-                [NumberBox_module_scss_1.default.error]: validationStatus === "error",
-                [NumberBox_module_scss_1.default.warning]: validationStatus === "warning",
-                [NumberBox_module_scss_1.default.valid]: validationStatus === "valid",
-            }), tabIndex: -1, onFocus: () => {
-                var _a;
-                (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-            }, children: [(0, jsx_runtime_1.jsx)(InputAdornment_1.Adornment, { text: startText, iconName: startIcon, className: NumberBox_module_scss_1.default.adornment }), (0, jsx_runtime_1.jsx)("input", { id: id, ref: inputRef, type: "text", placeholder: placeholder, required: required, readOnly: readOnly, disabled: !enabled, inputMode: inputMode, className: (0, classnames_1.default)(NumberBox_module_scss_1.default.input), value: valueStrRep, min: min, max: max, autoFocus: autoFocus, onBeforeInput: _onBeforeInput, onChange: _onChange, onFocus: _onFocus, onBlur: _onBlur, onKeyDown: _onKeyDown }), (0, jsx_runtime_1.jsx)(InputAdornment_1.Adornment, { text: endText, iconName: endIcon, className: NumberBox_module_scss_1.default.adornment }), hasSpinBox && ((0, jsx_runtime_1.jsxs)("div", { className: NumberBox_module_scss_1.default.spinnerBox, children: [(0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { "data-spinner": "up", type: "button", variant: "ghost", themeColor: "secondary", tabIndex: -1, className: NumberBox_module_scss_1.default.spinnerButton, disabled: !enabled || readOnly, ref: upButton, children: (0, jsx_runtime_1.jsx)(IconNative_1.Icon, { name: spinnerUpIcon || "spinnerUp:NumberBox", fallback: "chevronup", size: "sm" }) }), (0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { "data-spinner": "down", type: "button", tabIndex: -1, variant: "ghost", themeColor: "secondary", className: NumberBox_module_scss_1.default.spinnerButton, disabled: !enabled || readOnly, ref: downButton, children: (0, jsx_runtime_1.jsx)(IconNative_1.Icon, { name: spinnerDownIcon || "spinnerDown:NumberBox", fallback: "chevrondown", size: "sm" }) })] }))] }) })));
-});
-function useNumberFormatter(locale, options) {
-    return (0, react_1.useMemo)(() => {
-        return new number_1.NumberFormatter(locale, options);
-    }, [locale, options]);
-}
-function useNumberParser(locale, options) {
-    return (0, react_1.useMemo)(() => {
-        return new number_1.NumberParser(locale, options);
-    }, [locale, options]);
-}
-function useLongPress(elementRef, action, delay = 500) {
-    const timeoutId = (0, react_1.useRef)(0);
-    const intervalId = (0, react_1.useRef)(0);
-    const savedAction = (0, react_1.useRef)(action);
-    // Remember the latest action callback, since it is different every render
-    (0, react_1.useEffect)(() => {
-        savedAction.current = action;
-    }, [action]);
-    (0, react_1.useEffect)(() => {
-        const onMouseDown = () => {
-            var _a;
-            (_a = savedAction.current) === null || _a === void 0 ? void 0 : _a.call(savedAction);
-            timeoutId.current = window.setTimeout(() => {
-                intervalId.current = window.setInterval(() => {
-                    var _a;
-                    (_a = savedAction.current) === null || _a === void 0 ? void 0 : _a.call(savedAction);
-                }, 100);
-            }, delay);
-        };
-        const onMouseUp = () => {
-            clearTimeout(timeoutId.current);
-            clearInterval(intervalId.current);
-        };
-        const onMouseOut = () => {
-            clearTimeout(timeoutId.current);
-            clearInterval(intervalId.current);
-        };
-        elementRef === null || elementRef === void 0 ? void 0 : elementRef.addEventListener("mousedown", onMouseDown);
-        elementRef === null || elementRef === void 0 ? void 0 : elementRef.addEventListener("mouseup", onMouseUp);
-        elementRef === null || elementRef === void 0 ? void 0 : elementRef.addEventListener("mouseout", onMouseOut);
-        return () => {
-            elementRef === null || elementRef === void 0 ? void 0 : elementRef.removeEventListener("mousedown", onMouseDown);
-            elementRef === null || elementRef === void 0 ? void 0 : elementRef.removeEventListener("mouseup", onMouseUp);
-            elementRef === null || elementRef === void 0 ? void 0 : elementRef.removeEventListener("mouseout", onMouseOut);
-        };
-    }, [elementRef, action, delay]);
-}
-function handleChangingValue(value, parser, type, step = 1, min = -numberbox_abstractions_1.NUMBERBOX_MAX_VALUE, max = numberbox_abstractions_1.NUMBERBOX_MAX_VALUE) {
-    const currentInputValue = parser.parse(value !== null && value !== void 0 ? value : "");
-    if ((0, lodash_es_1.isNaN)(currentInputValue)) {
-        return min !== null && min !== void 0 ? min : 0;
-    }
-    if (type === "increase") {
-        return (0, numberbox_abstractions_1.clamp)(currentInputValue + (step !== null && step !== void 0 ? step : 1), min, max);
-    }
-    else {
-        return (0, numberbox_abstractions_1.clamp)(currentInputValue - (step !== null && step !== void 0 ? step : 1), min, max);
-    }
-}
-function canSynchronizeValue(value, locale, options) {
-    if (value.trim() === "")
-        return true;
-    if ((0, lodash_es_1.isNaN)(value))
-        return false;
-    if (hasLeadingZeros(value, locale, options))
-        return false;
-    if (isFloatWithTrailingZeros(value, locale, options))
-        return false;
-    if (overMaximumFractionDigits(value, locale, options))
-        return false;
-    return true;
-}
-function hasLeadingZeros(input, locale = "en-US", options) {
-    var _a, _b;
-    // Create a formatter to detect locale-specific separators
-    const formatter = new Intl.NumberFormat(locale, options);
-    const parts = formatter.formatToParts(1234.5);
-    const group = ((_a = parts.find((p) => p.type === "group")) === null || _a === void 0 ? void 0 : _a.value) || "";
-    const decimal = ((_b = parts.find((p) => p.type === "decimal")) === null || _b === void 0 ? void 0 : _b.value) || "";
-    // Normalize separators for parsing
-    const normalized = (group === "" ? input : input.replace(new RegExp(`\\${group}`, "g"), "")).replace(decimal, ".");
-    if (!/^-?\d*\.?\d*$/.test(normalized))
-        return false;
-    const [integer, fraction] = normalized.split(".");
-    // Integer validation
-    if (!fraction) {
-        return integer.length > 1 && integer.startsWith("0");
-    }
-    // Float validation
-    const leadingIntegerZeros = integer.startsWith("0") && integer.length >= 1;
-    const leadingFractionZeros = (fraction.match(/^0+/) || [""])[0].length >= 2;
-    return leadingIntegerZeros || leadingFractionZeros;
-}
-function isFloatWithTrailingZeros(input, locale = "en-US", options) {
-    var _a, _b;
-    // Create formatter to detect locale-specific separators
-    const formatter = new Intl.NumberFormat(locale, options);
-    const parts = formatter.formatToParts(1234.5);
-    const group = ((_a = parts.find((p) => p.type === "group")) === null || _a === void 0 ? void 0 : _a.value) || "";
-    const decimal = ((_b = parts.find((p) => p.type === "decimal")) === null || _b === void 0 ? void 0 : _b.value) || ".";
-    // Normalize separators for parsing
-    const normalized = (group === "" ? input : input.replace(new RegExp(`\\${group}`, "g"), "")).replace(decimal, ".");
-    // Validate numeric format
-    if (!/^-?\d*\.?\d*$/.test(normalized))
-        return false;
-    // Check if it's a float (has decimal point)
-    if (!normalized.includes("."))
-        return false;
-    // Split into integer and fractional parts
-    const [_, fraction] = normalized.split(".");
-    // Must have fractional digits to be a float -> integers get a pass
-    if (!fraction || fraction.length === 0)
-        return true;
-    // Check for trailing zeros in the fractional part
-    return /0+$/.test(fraction);
-}
-function overMaximumFractionDigits(input, locale = "en-US", options) {
-    var _a, _b;
-    // Create a formatter to detect locale-specific separators
-    const formatter = new Intl.NumberFormat(locale, options);
-    const parts = formatter.formatToParts(1234.5);
-    const group = ((_a = parts.find((p) => p.type === "group")) === null || _a === void 0 ? void 0 : _a.value) || "";
-    const decimal = ((_b = parts.find((p) => p.type === "decimal")) === null || _b === void 0 ? void 0 : _b.value) || "";
-    // Normalize separators for parsing
-    const normalized = (group === "" ? input : input.replace(new RegExp(`\\${group}`, "g"), "")).replace(decimal, ".");
-    if (!/^-?\d*\.?\d*$/.test(normalized))
-        return false;
-    const [_, fraction] = normalized.split(".");
-    // Integer validation
-    if (!fraction) {
-        return false;
-    }
-    // Float validation
-    return fraction.length > options.maximumFractionDigits;
-}
-/**
- * Solution comes from: https://giacomocerquone.com/blog/keep-input-cursor-still/
- */
-function useCursorCorrection(value, inputRef) {
-    const position = (0, react_1.useRef)({
-        beforeStart: 0,
-        beforeEnd: 0,
-    });
-    (0, react_1.useLayoutEffect)(() => {
-        inputRef.current.setSelectionRange(position.current.beforeStart, position.current.beforeEnd);
-    }, [value]);
-    const onInputChange = (event) => {
-        position.current.beforeStart = event.target.selectionStart;
-        position.current.beforeEnd = event.target.selectionEnd;
-    };
-    return onInputChange;
-}