@codefast/ui 0.3.10 → 0.3.11-canary.0

package/dist/primitives/input-number.cjs

@@ -40,7 +40,7 @@ const react_context_namespaceObject = require("@radix-ui/react-context");
 const react_use_controllable_state_namespaceObject = require("@radix-ui/react-use-controllable-state");
 const external_react_namespaceObject = require("react");
 const external_input_cjs_namespaceObject = require("./input.cjs");
-const NUMBER_INPUT_NAME = 'InputNumber';
+const NUMBER_INPUT_NAME = "InputNumber";
 const [createInputNumberContext, createInputNumberScope] = (0, react_context_namespaceObject.createContextScope)(NUMBER_INPUT_NAME, [
     external_input_cjs_namespaceObject.createInputScope
 ]);
@@ -49,7 +49,7 @@ const [InputNumberContextProvider, useInputNumberContext] = createInputNumberCon
 function InputNumber(numberInputProps) {
     const { __scopeInputNumber, ariaDecrementLabel, ariaIncrementLabel, defaultValue, formatOptions = {
         minimumFractionDigits: 0,
-        style: 'decimal'
+        style: "decimal"
     }, id, locale, max, min, onChange, step = 1, value: valueProperty, ...props } = numberInputProps;
     const inputScope = useInputScope(__scopeInputNumber);
     const inputRef = (0, external_react_namespaceObject.useRef)(null);
@@ -62,20 +62,20 @@ function InputNumber(numberInputProps) {
         locale
     ]);
     const formatValue = (0, external_react_namespaceObject.useCallback)((inputValue)=>{
-        if (void 0 === inputValue || Number.isNaN(inputValue)) return '';
+        if (void 0 === inputValue || Number.isNaN(inputValue)) return "";
         return new Intl.NumberFormat(locale, formatOptions).format(inputValue);
     }, [
         formatOptions,
         locale
     ]);
     const parseValue = (0, external_react_namespaceObject.useCallback)((inputValue)=>{
-        if ('number' == typeof inputValue) return clamp(inputValue, min, max);
-        if ('string' != typeof inputValue) return NaN;
-        const cleanedValue = inputValue.trim().replaceAll(/[^\d.,\-()]/g, '');
-        if ('' === cleanedValue) return NaN;
+        if ("number" == typeof inputValue) return clamp(inputValue, min, max);
+        if ("string" != typeof inputValue) return NaN;
+        const cleanedValue = inputValue.trim().replaceAll(/[^\d.,\-()]/g, "");
+        if ("" === cleanedValue) return NaN;
         const normalizedValue = normalizeInputValue(cleanedValue, thousandSeparator, decimalSeparator);
         let parsedValue = Number.parseFloat(normalizedValue);
-        if ('percent' === formatOptions.style) parsedValue /= 100;
+        if ("percent" === formatOptions.style) parsedValue /= 100;
         return Number.isNaN(parsedValue) ? 0 : clamp(parsedValue, min, max);
     }, [
         decimalSeparator,
@@ -152,7 +152,7 @@ function InputNumber(numberInputProps) {
         })
     });
 }
-const NUMBER_INPUT_FIELD_NAME = 'InputNumberField';
+const NUMBER_INPUT_FIELD_NAME = "InputNumberField";
 function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
     const inputScope = useInputScope(__scopeInputNumber);
     const { defaultValue, disabled, formatValue, id, inputRef, max, min, onChange, onDecrement, onDecrementToMin, onIncrement, onIncrementToMax, parseValue, readOnly, step, value } = useInputNumberContext(NUMBER_INPUT_FIELD_NAME, __scopeInputNumber);
@@ -168,19 +168,19 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
     ]);
     const handleKeyDown = (0, external_react_namespaceObject.useCallback)((event)=>{
         switch(event.key){
-            case 'ArrowUp':
+            case "ArrowUp":
                 onIncrement();
                 event.preventDefault();
                 break;
-            case 'PageUp':
+            case "PageUp":
                 onIncrementToMax();
                 event.preventDefault();
                 break;
-            case 'ArrowDown':
+            case "ArrowDown":
                 onDecrement();
                 event.preventDefault();
                 break;
-            case 'PageDown':
+            case "PageDown":
                 onDecrementToMin();
                 event.preventDefault();
                 break;
@@ -195,23 +195,23 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
     ]);
     const handleKeyDownPrevent = (0, external_react_namespaceObject.useCallback)((event)=>{
         switch(event.key){
-            case 'ArrowUp':
-            case 'ArrowDown':
-            case 'ArrowLeft':
-            case 'ArrowRight':
-            case 'PageUp':
-            case 'PageDown':
-            case 'Tab':
-            case 'Escape':
-            case 'Enter':
-            case 'Backspace':
-            case 'Delete':
-            case 'Home':
-            case 'End':
-            case '.':
-            case ',':
-            case '-':
-            case '%':
+            case "ArrowUp":
+            case "ArrowDown":
+            case "ArrowLeft":
+            case "ArrowRight":
+            case "PageUp":
+            case "PageDown":
+            case "Tab":
+            case "Escape":
+            case "Enter":
+            case "Backspace":
+            case "Delete":
+            case "Home":
+            case "End":
+            case ".":
+            case ",":
+            case "-":
+            case "%":
                 return;
             default:
                 if (isNumberKey(event.key) || isModifierKey(event) || isFunctionKey(event.key)) return;
@@ -220,7 +220,7 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
     }, []);
     const handleKeyDownEnter = (0, external_react_namespaceObject.useCallback)((event)=>{
         const inputElement = inputRef.current;
-        if ('Enter' !== event.key || !inputElement) return;
+        if ("Enter" !== event.key || !inputElement) return;
         const numericValue = parseValue(inputElement.value);
         const formattedValue = formatValue(numericValue);
         if (formattedValue !== inputElement.value) inputElement.value = formattedValue;
@@ -248,9 +248,9 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
             else onDecrement();
         };
         const inputElement = inputRef.current;
-        inputElement?.addEventListener('wheel', handleWheel);
+        inputElement?.addEventListener("wheel", handleWheel);
         return ()=>{
-            inputElement?.removeEventListener('wheel', handleWheel);
+            inputElement?.removeEventListener("wheel", handleWheel);
         };
     }, [
         onIncrement,
@@ -274,9 +274,9 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
             onChange(parseValue(defaultValue));
         };
         const form = inputElement.form;
-        form?.addEventListener('reset', handleReset);
+        form?.addEventListener("reset", handleReset);
         return ()=>{
-            form?.removeEventListener('reset', handleReset);
+            form?.removeEventListener("reset", handleReset);
         };
     }, [
         defaultValue,
@@ -300,7 +300,7 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
         ...props
     });
 }
-const NUMBER_STEPPER_BUTTON_NAME = 'NumberStepperButton';
+const NUMBER_STEPPER_BUTTON_NAME = "NumberStepperButton";
 function NumberStepperButton({ __scopeInputNumber, operation, ...props }) {
     const { ariaDecrementLabel, ariaIncrementLabel, disabled, id, max, min, onDecrement, onIncrement, value } = useInputNumberContext(NUMBER_STEPPER_BUTTON_NAME, __scopeInputNumber);
     const isDisabled = (0, external_react_namespaceObject.useMemo)(()=>{
@@ -330,7 +330,7 @@ function NumberStepperButton({ __scopeInputNumber, operation, ...props }) {
         }
     }, []);
     const handlePointerDown = (0, external_react_namespaceObject.useCallback)(()=>{
-        const action = 'increment' === operation ? onIncrement : onDecrement;
+        const action = "increment" === operation ? onIncrement : onDecrement;
         startActionInterval(action);
     }, [
         onDecrement,
@@ -342,9 +342,9 @@ function NumberStepperButton({ __scopeInputNumber, operation, ...props }) {
         event.preventDefault();
     }, []);
     const handleKeyDown = (0, external_react_namespaceObject.useCallback)((event)=>{
-        if ('Enter' === event.key || ' ' === event.key) {
+        if ("Enter" === event.key || " " === event.key) {
             event.preventDefault();
-            const action = 'increment' === operation ? onIncrement : onDecrement;
+            const action = "increment" === operation ? onIncrement : onDecrement;
             action();
         }
     }, [
@@ -354,7 +354,7 @@ function NumberStepperButton({ __scopeInputNumber, operation, ...props }) {
     ]);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
         "aria-controls": id,
-        "aria-label": 'increment' === operation ? ariaIncrementLabel : ariaDecrementLabel,
+        "aria-label": "increment" === operation ? ariaIncrementLabel : ariaDecrementLabel,
         "aria-live": "polite",
         disabled: isDisabled,
         type: "button",
@@ -387,11 +387,11 @@ function chain(...callbacks) {
 function getNumberFormatSeparators(locale) {
     const numberFormat = new Intl.NumberFormat(locale);
     const parts = numberFormat.formatToParts(12345.6);
-    let thousandSeparator = '';
-    let decimalSeparator = '';
+    let thousandSeparator = "";
+    let decimalSeparator = "";
     for (const part of parts){
-        if ('group' === part.type) thousandSeparator = part.value;
-        if ('decimal' === part.type) decimalSeparator = part.value;
+        if ("group" === part.type) thousandSeparator = part.value;
+        if ("decimal" === part.type) decimalSeparator = part.value;
         if (thousandSeparator && decimalSeparator) break;
     }
     return {
@@ -400,13 +400,13 @@ function getNumberFormatSeparators(locale) {
     };
 }
 function normalizeInputValue(value, thousandSeparator, decimalSeparator) {
-    return value.replaceAll(new RegExp(`\\${thousandSeparator}`, 'g'), '').replace(new RegExp(`\\${decimalSeparator}`), '.').replaceAll(/[()]/g, '-');
+    return value.replaceAll(new RegExp(`\\${thousandSeparator}`, "g"), "").replace(new RegExp(`\\${decimalSeparator}`), ".").replaceAll(/[()]/g, "-");
 }
 function isModifierKey(event) {
     return event.ctrlKey || event.altKey || event.metaKey || event.shiftKey;
 }
 function isFunctionKey(key) {
-    return key.startsWith('F') && key.length > 1;
+    return key.startsWith("F") && key.length > 1;
 }
 function isNumberKey(key) {
     return !Number.isNaN(Number(key));

package/dist/primitives/input-number.d.ts

@@ -1,6 +1,6 @@
-import type { Scope } from '@radix-ui/react-context';
-import type { ComponentProps, JSX } from 'react';
-import * as InputPrimitive from './input';
+import type { Scope } from "@radix-ui/react-context";
+import type { ComponentProps, JSX } from "react";
+import * as InputPrimitive from "./input";
 /**
  * Props that include an optional scope for the InputNumber component.
  */
@@ -40,23 +40,23 @@ declare function InputNumber(numberInputProps: ScopedProps<InputNumberProps>): J
 /**
  * Defines the props for the `InputNumberField` component.
  */
-type InputNumberFieldProps = Omit<ComponentProps<typeof InputPrimitive.Field>, 'defaultValue' | 'disabled' | 'id' | 'max' | 'min' | 'onChange' | 'prefix' | 'readOnly' | 'step' | 'value'>;
+type InputNumberFieldProps = Omit<ComponentProps<typeof InputPrimitive.Field>, "defaultValue" | "disabled" | "id" | "max" | "min" | "onChange" | "prefix" | "readOnly" | "step" | "value">;
 declare function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }: ScopedProps<InputNumberFieldProps>): JSX.Element;
 /**
  * Props for the NumberStepperButton component.
  */
-interface NumberStepperButtonProps extends ComponentProps<'button'> {
+interface NumberStepperButtonProps extends ComponentProps<"button"> {
     /**
      * The operation to perform when the button is pressed.
      * - `'increment'`: Increases the value.
      * - `'decrement'`: Decreases the value.
      */
-    operation: 'decrement' | 'increment';
+    operation: "decrement" | "increment";
 }
 declare function NumberStepperButton({ __scopeInputNumber, operation, ...props }: ScopedProps<NumberStepperButtonProps>): JSX.Element;
-type InputNumberIncrementButtonProps = Omit<ComponentProps<typeof NumberStepperButton>, 'operation'>;
+type InputNumberIncrementButtonProps = Omit<ComponentProps<typeof NumberStepperButton>, "operation">;
 declare function InputNumberIncrementButton(props: InputNumberIncrementButtonProps): JSX.Element;
-type InputNumberDecrementButtonProps = Omit<ComponentProps<typeof NumberStepperButton>, 'operation'>;
+type InputNumberDecrementButtonProps = Omit<ComponentProps<typeof NumberStepperButton>, "operation">;
 declare function InputNumberDecrementButton(props: InputNumberDecrementButtonProps): JSX.Element;
 export { createInputNumberScope, InputNumberDecrementButton as DecrementButton, InputNumberField as Field, InputNumberIncrementButton as IncrementButton, InputNumber, InputNumberDecrementButton, InputNumberField, InputNumberIncrementButton, InputNumber as Root, };
 export type { InputNumberDecrementButtonProps, InputNumberFieldProps, InputNumberIncrementButtonProps, InputNumberProps, };

package/dist/primitives/input-number.js

@@ -4,7 +4,7 @@ import { createContextScope } from "@radix-ui/react-context";
 import { useControllableState } from "@radix-ui/react-use-controllable-state";
 import { useCallback, useEffect, useMemo, useRef } from "react";
 import { Field, Root, createInputScope } from "./input.js";
-const NUMBER_INPUT_NAME = 'InputNumber';
+const NUMBER_INPUT_NAME = "InputNumber";
 const [createInputNumberContext, createInputNumberScope] = createContextScope(NUMBER_INPUT_NAME, [
     createInputScope
 ]);
@@ -13,7 +13,7 @@ const [InputNumberContextProvider, useInputNumberContext] = createInputNumberCon
 function InputNumber(numberInputProps) {
     const { __scopeInputNumber, ariaDecrementLabel, ariaIncrementLabel, defaultValue, formatOptions = {
         minimumFractionDigits: 0,
-        style: 'decimal'
+        style: "decimal"
     }, id, locale, max, min, onChange, step = 1, value: valueProperty, ...props } = numberInputProps;
     const inputScope = useInputScope(__scopeInputNumber);
     const inputRef = useRef(null);
@@ -26,20 +26,20 @@ function InputNumber(numberInputProps) {
         locale
     ]);
     const formatValue = useCallback((inputValue)=>{
-        if (void 0 === inputValue || Number.isNaN(inputValue)) return '';
+        if (void 0 === inputValue || Number.isNaN(inputValue)) return "";
         return new Intl.NumberFormat(locale, formatOptions).format(inputValue);
     }, [
         formatOptions,
         locale
     ]);
     const parseValue = useCallback((inputValue)=>{
-        if ('number' == typeof inputValue) return clamp(inputValue, min, max);
-        if ('string' != typeof inputValue) return NaN;
-        const cleanedValue = inputValue.trim().replaceAll(/[^\d.,\-()]/g, '');
-        if ('' === cleanedValue) return NaN;
+        if ("number" == typeof inputValue) return clamp(inputValue, min, max);
+        if ("string" != typeof inputValue) return NaN;
+        const cleanedValue = inputValue.trim().replaceAll(/[^\d.,\-()]/g, "");
+        if ("" === cleanedValue) return NaN;
         const normalizedValue = normalizeInputValue(cleanedValue, thousandSeparator, decimalSeparator);
         let parsedValue = Number.parseFloat(normalizedValue);
-        if ('percent' === formatOptions.style) parsedValue /= 100;
+        if ("percent" === formatOptions.style) parsedValue /= 100;
         return Number.isNaN(parsedValue) ? 0 : clamp(parsedValue, min, max);
     }, [
         decimalSeparator,
@@ -116,7 +116,7 @@ function InputNumber(numberInputProps) {
         })
     });
 }
-const NUMBER_INPUT_FIELD_NAME = 'InputNumberField';
+const NUMBER_INPUT_FIELD_NAME = "InputNumberField";
 function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
     const inputScope = useInputScope(__scopeInputNumber);
     const { defaultValue, disabled, formatValue, id, inputRef, max, min, onChange, onDecrement, onDecrementToMin, onIncrement, onIncrementToMax, parseValue, readOnly, step, value } = useInputNumberContext(NUMBER_INPUT_FIELD_NAME, __scopeInputNumber);
@@ -132,19 +132,19 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
     ]);
     const handleKeyDown = useCallback((event)=>{
         switch(event.key){
-            case 'ArrowUp':
+            case "ArrowUp":
                 onIncrement();
                 event.preventDefault();
                 break;
-            case 'PageUp':
+            case "PageUp":
                 onIncrementToMax();
                 event.preventDefault();
                 break;
-            case 'ArrowDown':
+            case "ArrowDown":
                 onDecrement();
                 event.preventDefault();
                 break;
-            case 'PageDown':
+            case "PageDown":
                 onDecrementToMin();
                 event.preventDefault();
                 break;
@@ -159,23 +159,23 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
     ]);
     const handleKeyDownPrevent = useCallback((event)=>{
         switch(event.key){
-            case 'ArrowUp':
-            case 'ArrowDown':
-            case 'ArrowLeft':
-            case 'ArrowRight':
-            case 'PageUp':
-            case 'PageDown':
-            case 'Tab':
-            case 'Escape':
-            case 'Enter':
-            case 'Backspace':
-            case 'Delete':
-            case 'Home':
-            case 'End':
-            case '.':
-            case ',':
-            case '-':
-            case '%':
+            case "ArrowUp":
+            case "ArrowDown":
+            case "ArrowLeft":
+            case "ArrowRight":
+            case "PageUp":
+            case "PageDown":
+            case "Tab":
+            case "Escape":
+            case "Enter":
+            case "Backspace":
+            case "Delete":
+            case "Home":
+            case "End":
+            case ".":
+            case ",":
+            case "-":
+            case "%":
                 return;
             default:
                 if (isNumberKey(event.key) || isModifierKey(event) || isFunctionKey(event.key)) return;
@@ -184,7 +184,7 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
     }, []);
     const handleKeyDownEnter = useCallback((event)=>{
         const inputElement = inputRef.current;
-        if ('Enter' !== event.key || !inputElement) return;
+        if ("Enter" !== event.key || !inputElement) return;
         const numericValue = parseValue(inputElement.value);
         const formattedValue = formatValue(numericValue);
         if (formattedValue !== inputElement.value) inputElement.value = formattedValue;
@@ -212,9 +212,9 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
             else onDecrement();
         };
         const inputElement = inputRef.current;
-        inputElement?.addEventListener('wheel', handleWheel);
+        inputElement?.addEventListener("wheel", handleWheel);
         return ()=>{
-            inputElement?.removeEventListener('wheel', handleWheel);
+            inputElement?.removeEventListener("wheel", handleWheel);
         };
     }, [
         onIncrement,
@@ -238,9 +238,9 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
             onChange(parseValue(defaultValue));
         };
         const form = inputElement.form;
-        form?.addEventListener('reset', handleReset);
+        form?.addEventListener("reset", handleReset);
         return ()=>{
-            form?.removeEventListener('reset', handleReset);
+            form?.removeEventListener("reset", handleReset);
         };
     }, [
         defaultValue,
@@ -264,7 +264,7 @@ function InputNumberField({ __scopeInputNumber, onBlur, onKeyDown, ...props }) {
         ...props
     });
 }
-const NUMBER_STEPPER_BUTTON_NAME = 'NumberStepperButton';
+const NUMBER_STEPPER_BUTTON_NAME = "NumberStepperButton";
 function NumberStepperButton({ __scopeInputNumber, operation, ...props }) {
     const { ariaDecrementLabel, ariaIncrementLabel, disabled, id, max, min, onDecrement, onIncrement, value } = useInputNumberContext(NUMBER_STEPPER_BUTTON_NAME, __scopeInputNumber);
     const isDisabled = useMemo(()=>{
@@ -294,7 +294,7 @@ function NumberStepperButton({ __scopeInputNumber, operation, ...props }) {
         }
     }, []);
     const handlePointerDown = useCallback(()=>{
-        const action = 'increment' === operation ? onIncrement : onDecrement;
+        const action = "increment" === operation ? onIncrement : onDecrement;
         startActionInterval(action);
     }, [
         onDecrement,
@@ -306,9 +306,9 @@ function NumberStepperButton({ __scopeInputNumber, operation, ...props }) {
         event.preventDefault();
     }, []);
     const handleKeyDown = useCallback((event)=>{
-        if ('Enter' === event.key || ' ' === event.key) {
+        if ("Enter" === event.key || " " === event.key) {
             event.preventDefault();
-            const action = 'increment' === operation ? onIncrement : onDecrement;
+            const action = "increment" === operation ? onIncrement : onDecrement;
             action();
         }
     }, [
@@ -318,7 +318,7 @@ function NumberStepperButton({ __scopeInputNumber, operation, ...props }) {
     ]);
     return /*#__PURE__*/ jsx("button", {
         "aria-controls": id,
-        "aria-label": 'increment' === operation ? ariaIncrementLabel : ariaDecrementLabel,
+        "aria-label": "increment" === operation ? ariaIncrementLabel : ariaDecrementLabel,
         "aria-live": "polite",
         disabled: isDisabled,
         type: "button",
@@ -351,11 +351,11 @@ function chain(...callbacks) {
 function getNumberFormatSeparators(locale) {
     const numberFormat = new Intl.NumberFormat(locale);
     const parts = numberFormat.formatToParts(12345.6);
-    let thousandSeparator = '';
-    let decimalSeparator = '';
+    let thousandSeparator = "";
+    let decimalSeparator = "";
     for (const part of parts){
-        if ('group' === part.type) thousandSeparator = part.value;
-        if ('decimal' === part.type) decimalSeparator = part.value;
+        if ("group" === part.type) thousandSeparator = part.value;
+        if ("decimal" === part.type) decimalSeparator = part.value;
         if (thousandSeparator && decimalSeparator) break;
     }
     return {
@@ -364,13 +364,13 @@ function getNumberFormatSeparators(locale) {
     };
 }
 function normalizeInputValue(value, thousandSeparator, decimalSeparator) {
-    return value.replaceAll(new RegExp(`\\${thousandSeparator}`, 'g'), '').replace(new RegExp(`\\${decimalSeparator}`), '.').replaceAll(/[()]/g, '-');
+    return value.replaceAll(new RegExp(`\\${thousandSeparator}`, "g"), "").replace(new RegExp(`\\${decimalSeparator}`), ".").replaceAll(/[()]/g, "-");
 }
 function isModifierKey(event) {
     return event.ctrlKey || event.altKey || event.metaKey || event.shiftKey;
 }
 function isFunctionKey(key) {
-    return key.startsWith('F') && key.length > 1;
+    return key.startsWith("F") && key.length > 1;
 }
 function isNumberKey(key) {
     return !Number.isNaN(Number(key));

package/dist/primitives/input.cjs

@@ -34,20 +34,20 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const react_compose_refs_namespaceObject = require("@radix-ui/react-compose-refs");
 const react_context_namespaceObject = require("@radix-ui/react-context");
 const external_react_namespaceObject = require("react");
-const INPUT_NAME = 'Input';
+const INPUT_NAME = "Input";
 const [createInputContext, createInputScope] = (0, react_context_namespaceObject.createContextScope)(INPUT_NAME);
 const [InputContextProvider, useInputContext] = createInputContext(INPUT_NAME);
 function Input(inputProps) {
-    const { __scopeInput, children, disabled, loaderPosition = 'prefix', loading, prefix, readOnly, spinner, suffix, ...props } = inputProps;
+    const { __scopeInput, children, disabled, loaderPosition = "prefix", loading, prefix, readOnly, spinner, suffix, ...props } = inputProps;
     const inputRef = (0, external_react_namespaceObject.useRef)(null);
     const handlePointerDown = (event)=>{
         const target = event.target;
-        if ('input' === target.tagName.toLowerCase() || target.closest('input, a, button')) return void event.stopPropagation();
+        if ("input" === target.tagName.toLowerCase() || target.closest("input, a, button")) return void event.stopPropagation();
         const inputElement = inputRef.current;
         if (!inputElement) return;
         if (document.activeElement === inputElement) return void event.preventDefault();
         requestAnimationFrame(()=>{
-            if ('file' === inputElement.type) return void inputElement.click();
+            if ("file" === inputElement.type) return void inputElement.click();
             if (document.activeElement !== inputElement) inputElement.focus();
         });
     };
@@ -63,14 +63,14 @@ function Input(inputProps) {
             onPointerDown: handlePointerDown,
             ...props,
             children: [
-                loading && 'prefix' === loaderPosition ? spinner : prefix,
+                loading && "prefix" === loaderPosition ? spinner : prefix,
                 children,
-                loading && 'suffix' === loaderPosition ? spinner : suffix
+                loading && "suffix" === loaderPosition ? spinner : suffix
             ]
         })
     });
 }
-const INPUT_FIELD_NAME = 'InputField';
+const INPUT_FIELD_NAME = "InputField";
 function InputField({ __scopeInput, ...props }) {
     const { disabled, inputRef, readOnly } = useInputContext(INPUT_FIELD_NAME, __scopeInput);
     const composedInputRef = (0, react_compose_refs_namespaceObject.useComposedRefs)(inputRef);

package/dist/primitives/input.d.ts

@@ -1,5 +1,5 @@
-import type { Scope } from '@radix-ui/react-context';
-import type { ComponentProps, JSX, PropsWithChildren, ReactNode } from 'react';
+import type { Scope } from "@radix-ui/react-context";
+import type { ComponentProps, JSX, PropsWithChildren, ReactNode } from "react";
 /**
  * Type for adding scope to component props
  */
@@ -42,7 +42,7 @@ interface InputBehaviorProps {
     /**
      * Position of the loading spinner - either before or after the input
      */
-    loaderPosition?: 'prefix' | 'suffix';
+    loaderPosition?: "prefix" | "suffix";
     /**
      * Whether the input is in the loading state
      */
@@ -60,7 +60,7 @@ declare function Input(inputProps: ScopedProps<InputProps>): JSX.Element;
 /**
  * Props for the InputField component
  */
-type InputFieldProps = ComponentProps<'input'>;
+type InputFieldProps = ComponentProps<"input">;
 declare function InputField({ __scopeInput, ...props }: ScopedProps<InputFieldProps>): JSX.Element;
 export { createInputScope, InputField as Field, Input, InputField, Input as Root };
 export type { InputFieldProps, InputProps };

package/dist/primitives/input.js

@@ -2,20 +2,20 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useComposedRefs } from "@radix-ui/react-compose-refs";
 import { createContextScope } from "@radix-ui/react-context";
 import { useRef } from "react";
-const INPUT_NAME = 'Input';
+const INPUT_NAME = "Input";
 const [createInputContext, createInputScope] = createContextScope(INPUT_NAME);
 const [InputContextProvider, useInputContext] = createInputContext(INPUT_NAME);
 function Input(inputProps) {
-    const { __scopeInput, children, disabled, loaderPosition = 'prefix', loading, prefix, readOnly, spinner, suffix, ...props } = inputProps;
+    const { __scopeInput, children, disabled, loaderPosition = "prefix", loading, prefix, readOnly, spinner, suffix, ...props } = inputProps;
     const inputRef = useRef(null);
     const handlePointerDown = (event)=>{
         const target = event.target;
-        if ('input' === target.tagName.toLowerCase() || target.closest('input, a, button')) return void event.stopPropagation();
+        if ("input" === target.tagName.toLowerCase() || target.closest("input, a, button")) return void event.stopPropagation();
         const inputElement = inputRef.current;
         if (!inputElement) return;
         if (document.activeElement === inputElement) return void event.preventDefault();
         requestAnimationFrame(()=>{
-            if ('file' === inputElement.type) return void inputElement.click();
+            if ("file" === inputElement.type) return void inputElement.click();
             if (document.activeElement !== inputElement) inputElement.focus();
         });
     };
@@ -31,14 +31,14 @@ function Input(inputProps) {
             onPointerDown: handlePointerDown,
             ...props,
             children: [
-                loading && 'prefix' === loaderPosition ? spinner : prefix,
+                loading && "prefix" === loaderPosition ? spinner : prefix,
                 children,
-                loading && 'suffix' === loaderPosition ? spinner : suffix
+                loading && "suffix" === loaderPosition ? spinner : suffix
             ]
         })
     });
 }
-const INPUT_FIELD_NAME = 'InputField';
+const INPUT_FIELD_NAME = "InputField";
 function InputField({ __scopeInput, ...props }) {
     const { disabled, inputRef, readOnly } = useInputContext(INPUT_FIELD_NAME, __scopeInput);
     const composedInputRef = useComposedRefs(inputRef);