@fuf-stack/uniform 0.21.4 → 0.22.0

package/dist/chunk-I2PJDXWB.cjs

@@ -0,0 +1,102 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkTSB65253cjs = require('./chunk-TSB65253.cjs');
+
+
+
+var _chunk555JRYCScjs = require('./chunk-555JRYCS.cjs');
+
+// src/hooks/useInputValueDebounce/useInputValueDebounce.ts
+var _react = require('react');
+var useInputValueDebounce = ({
+  debounceDelay = 300,
+  onBlur,
+  onChange,
+  transformValue,
+  type,
+  value
+}) => {
+  const transform = _chunkTSB65253cjs.useInputValueTransform.call(void 0, {
+    transformValue,
+    type,
+    value
+  });
+  const getFormValue = _react.useCallback.call(void 0, 
+    (rawValue) => {
+      const stringValue = String(rawValue);
+      if (transformValue) {
+        return transformValue.formValue(stringValue);
+      }
+      if (type === "number" && stringValue !== "") {
+        const numValue = Number(stringValue);
+        return Number.isNaN(numValue) ? rawValue : numValue;
+      }
+      return rawValue;
+    },
+    [transformValue, type]
+  );
+  const displayValue = transformValue ? transform.displayValue : value;
+  const [currentDisplayValue, setCurrentDisplayValue] = _react.useState.call(void 0, displayValue);
+  const timeoutRef = _react.useRef.call(void 0, null);
+  _react.useEffect.call(void 0, () => {
+    setCurrentDisplayValue(displayValue);
+  }, [displayValue]);
+  const handleChange = _react.useCallback.call(void 0, 
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (...event) => {
+      var _a, _b, _c, _d;
+      const newValue = (_c = (_b = (_a = event[0]) == null ? void 0 : _a.target) == null ? void 0 : _b.value) != null ? _c : event[0];
+      let displayVal = newValue;
+      if (!transformValue && type === "number" && newValue !== "") {
+        const numValue = Number(newValue);
+        displayVal = Number.isNaN(numValue) ? newValue : numValue;
+      }
+      setCurrentDisplayValue(displayVal);
+      if (transformValue && ((_d = event[0]) == null ? void 0 : _d.target)) {
+        transform.handleInputChange(event[0]);
+      }
+      const formValue = getFormValue(newValue);
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+      const executeOnChange = () => {
+        var _a2;
+        if ((_a2 = event[0]) == null ? void 0 : _a2.target) {
+          const convertedEvent = _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, event[0]), {
+            target: _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, event[0].target), {
+              value: formValue
+            })
+          });
+          onChange(convertedEvent, ...event.slice(1));
+        } else {
+          onChange(formValue);
+        }
+      };
+      if (debounceDelay <= 0) {
+        executeOnChange();
+      } else {
+        timeoutRef.current = setTimeout(executeOnChange, debounceDelay);
+      }
+    },
+    [onChange, debounceDelay, transformValue, transform, type, getFormValue]
+  );
+  const handleBlur = _react.useCallback.call(void 0, () => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+      const formValue = getFormValue(currentDisplayValue);
+      onChange(formValue);
+    }
+    onBlur();
+  }, [currentDisplayValue, onChange, onBlur, getFormValue]);
+  return {
+    onChange: handleChange,
+    onBlur: handleBlur,
+    value: currentDisplayValue
+  };
+};
+
+
+
+exports.useInputValueDebounce = useInputValueDebounce;
+//# sourceMappingURL=chunk-I2PJDXWB.cjs.map

package/dist/chunk-I2PJDXWB.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-I2PJDXWB.cjs","../src/hooks/useInputValueDebounce/useInputValueDebounce.ts"],"names":["_a"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-I2PJDXWB.cjs","sourcesContent":[null,"import type { InputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useInputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\nexport interface UseInputValueDebounceOptions {\n  /** Debounce delay in milliseconds (default: 300) */\n  debounceDelay?: number;\n  /** The onBlur function to call after flushing debounced value */\n  onBlur: () => void;\n  /** The onChange function to call with debounced value */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  onChange: (...event: any[]) => void;\n  /** Value transformation functions */\n  transformValue?: InputValueTransform;\n  /** Input type to handle number conversion (optional) */\n  type?: 'text' | 'number' | 'password';\n  /** The value to debounce */\n  value: string | number;\n}\n\nexport interface UseInputValueDebounceReturn {\n  /** Enhanced onChange function with debouncing */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  onChange: (...event: any[]) => void;\n  /** Enhanced onBlur function that flushes current value immediately */\n  onBlur: () => void;\n  /** The field value that is displayed - updates immediately */\n  value: string | number;\n}\n\n/**\n * Custom hook for debouncing input value changes with immediate blur support.\n *\n * Provides immediate visual feedback by updating the display value instantly,\n * while debouncing the actual form state changes. When the input loses focus,\n * any pending debounced changes are immediately flushed.\n *\n * **Key Features:**\n * - **Debouncing**: Delays form updates until user stops typing\n * - **Transform support**: Optional value transformation between display and form values\n * - **Number conversion**: Automatic conversion for number inputs\n * - **Immediate display updates**: UI stays responsive during debouncing\n * - **Blur flushing**: Immediately applies pending changes on blur\n *\n * @param options Configuration for debounced value handling\n * @param options.debounceDelay Delay in milliseconds (default: 300)\n * @param options.onBlur Function to call after flushing debounced value\n * @param options.onChange Function to call with debounced value\n * @param options.transformValue Optional transform functions for display ↔ form value conversion\n * @param options.type Input type for number conversion ('text' | 'number' | 'password')\n * @param options.value The value to debounce\n * @returns Object containing enhanced onChange, onBlur, and immediate display value\n *\n * @example\n * Basic usage with debouncing:\n * ```tsx\n * const { onChange, onBlur, value } = useInputValueDebounce({\n *   debounceDelay: 300,\n *   onBlur: field.onBlur,\n *   onChange: field.onChange,\n *   value: field.value,\n * });\n * ```\n *\n * @example\n * Number input with automatic conversion:\n * ```tsx\n * const { onChange, onBlur, value } = useInputValueDebounce({\n *   debounceDelay: 300,\n *   onBlur: field.onBlur,\n *   onChange: field.onChange,\n *   type: 'number',\n *   value: field.value, // Display: 123 (number), Form: 123 (number)\n * });\n * ```\n *\n * @example\n * Currency formatting with transforms:\n * ```tsx\n * const currencyTransform = {\n *   displayValue: (val) => val ? `$${Number(val).toFixed(2)}` : '',\n *   formValue: (val) => Number(val.replace(/[$,]/g, '')) || 0\n * };\n *\n * const { onChange, onBlur, value } = useInputValueDebounce({\n *   debounceDelay: 300,\n *   onBlur: field.onBlur,\n *   onChange: field.onChange,\n *   transformValue: currencyTransform,\n *   value: field.value, // Display: \"$100.00\", Form: 100\n * });\n * ```\n */\nexport const useInputValueDebounce = ({\n  debounceDelay = 300,\n  onBlur,\n  onChange,\n  transformValue,\n  type,\n  value,\n}: UseInputValueDebounceOptions): UseInputValueDebounceReturn => {\n  // Use transform hook if transformValue is provided\n  const transform = useInputValueTransform({\n    transformValue,\n    type,\n    value,\n  });\n\n  // Helper function to convert any value to the appropriate form value\n  const getFormValue = useCallback(\n    (rawValue: string | number) => {\n      const stringValue = String(rawValue);\n\n      if (transformValue) {\n        return transformValue.formValue(stringValue);\n      }\n\n      if (type === 'number' && stringValue !== '') {\n        const numValue = Number(stringValue);\n        return Number.isNaN(numValue) ? rawValue : numValue;\n      }\n\n      return rawValue;\n    },\n    [transformValue, type],\n  );\n\n  // Use transform display value if available, otherwise use original value\n  const displayValue = transformValue ? transform.displayValue : value;\n  const [currentDisplayValue, setCurrentDisplayValue] = useState(displayValue);\n  const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n\n  // Sync display value when external value changes\n  useEffect(() => {\n    setCurrentDisplayValue(displayValue);\n  }, [displayValue]);\n\n  // Enhanced onChange handler\n  const handleChange = useCallback(\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (...event: any[]) => {\n      const newValue = event[0]?.target?.value ?? event[0];\n\n      // Convert display value to number if type is number and no transform\n      let displayVal = newValue;\n      if (!transformValue && type === 'number' && newValue !== '') {\n        const numValue = Number(newValue);\n        displayVal = Number.isNaN(numValue) ? newValue : numValue;\n      }\n\n      // Update display immediately\n      setCurrentDisplayValue(displayVal);\n\n      // Update transform if needed\n      if (transformValue && event[0]?.target) {\n        transform.handleInputChange(event[0]);\n      }\n\n      // Get form value using helper\n      const formValue = getFormValue(newValue);\n\n      // Clear existing timeout\n      if (timeoutRef.current) {\n        clearTimeout(timeoutRef.current);\n      }\n\n      const executeOnChange = () => {\n        // Preserve event structure if original was an event\n        if (event[0]?.target) {\n          const convertedEvent = {\n            ...event[0],\n            target: {\n              ...event[0].target,\n              value: formValue,\n            },\n          };\n          onChange(convertedEvent, ...event.slice(1));\n        } else {\n          onChange(formValue);\n        }\n      };\n\n      // Execute immediately or after delay\n      if (debounceDelay <= 0) {\n        executeOnChange();\n      } else {\n        timeoutRef.current = setTimeout(executeOnChange, debounceDelay);\n      }\n    },\n    [onChange, debounceDelay, transformValue, transform, type, getFormValue],\n  );\n\n  // Enhanced blur handler\n  const handleBlur = useCallback(() => {\n    // Flush pending changes\n    if (timeoutRef.current) {\n      clearTimeout(timeoutRef.current);\n      timeoutRef.current = null;\n\n      // Get form value using helper\n      const formValue = getFormValue(currentDisplayValue);\n      onChange(formValue);\n    }\n    onBlur();\n  }, [currentDisplayValue, onChange, onBlur, getFormValue]);\n\n  return {\n    onChange: handleChange,\n    onBlur: handleBlur,\n    value: currentDisplayValue,\n  };\n};\n"]}

package/dist/{chunk-DUEOXE7L.cjs → chunk-IAMV2JNU.cjs}

@@ -1,13 +1,13 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkGNYQC5IJcjs = require('./chunk-GNYQC5IJ.cjs');
+var _chunkPA2DQCBYcjs = require('./chunk-PA2DQCBY.cjs');
 
 
-var _chunkPA2DQCBYcjs = require('./chunk-PA2DQCBY.cjs');
+var _chunkGNYQC5IJcjs = require('./chunk-GNYQC5IJ.cjs');
 
 
 
-var _chunkYPV2TH7Ucjs = require('./chunk-YPV2TH7U.cjs');
+var _chunkY6EAPURVcjs = require('./chunk-Y6EAPURV.cjs');
 
 // src/RadioTabs/RadioTabs.tsx
 var _radio = require('@heroui/radio');
@@ -37,9 +37,9 @@ var RadioTabs = ({
   testId: _testId = void 0,
   variant = void 0
 }) => {
-  const { control, debugMode, getFieldState } = _chunkYPV2TH7Ucjs.useFormContext.call(void 0, );
+  const { control, debugMode, getFieldState } = _chunkY6EAPURVcjs.useFormContext.call(void 0, );
   const { error, invalid, required, testId } = getFieldState(name, _testId);
-  const { field } = _chunkYPV2TH7Ucjs.useController.call(void 0, { control, disabled, name });
+  const { field } = _chunkY6EAPURVcjs.useController.call(void 0, { control, disabled, name });
   const { disabled: isDisabled, onBlur, onChange, ref, value } = field;
   const showTestIdCopyButton = debugMode === "debug-testids";
   const showLabel = label || showTestIdCopyButton;
@@ -101,4 +101,4 @@ var RadioTabs_default2 = RadioTabs_default;
 
 
 exports.RadioTabs_default = RadioTabs_default; exports.RadioTabs_default2 = RadioTabs_default2;
-//# sourceMappingURL=chunk-DUEOXE7L.cjs.map
+//# sourceMappingURL=chunk-IAMV2JNU.cjs.map

package/dist/{chunk-DUEOXE7L.cjs.map → chunk-IAMV2JNU.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-DUEOXE7L.cjs","../src/RadioTabs/RadioTabs.tsx","../src/RadioTabs/index.ts"],"names":[],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-DUEOXE7L.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { TabsProps } from '@fuf-stack/pixels';\nimport type { TabProps } from '@fuf-stack/pixels/Tabs';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport Tabs from '@fuf-stack/pixels/Tabs';\n\nimport { useController, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const radioTabsVariants = tv({\n  slots: {\n    base: 'group', // Needs group for group-data condition\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger',\n    wrapper: '',\n    tabList: '',\n    tab: '',\n    tabContent: '',\n    cursor: '',\n    panel: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof radioTabsVariants>;\ntype ClassName = TVClassName<typeof radioTabsVariants>;\n\nexport interface RadioTabsOption {\n  /** Optional content inside of the tab */\n  content?: ReactNode;\n  /** disables the option */\n  disabled?: boolean;\n  /** option label */\n  label?: React.ReactNode;\n  /** option icon */\n  icon?: ReactNode;\n  /** HTML data-testid attribute of the option */\n  testId?: string;\n  /** option value */\n  value: string;\n}\n\nexport interface RadioTabsProps extends VariantProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** Determines if the Buttons are disabled or not. */\n  disabled?: boolean;\n  /** determines orientation of the Buttons. */\n  inline?: boolean;\n  /** Label displayed next to the RadioButton. */\n  label?: ReactNode;\n  /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n  name: string;\n  /** Radio button configuration. */\n  options: RadioTabsOption[];\n  /** Id to grab element in internal tests. */\n  testId?: string;\n  /** How the RadioTabs should look like. */\n  variant?: TabsProps['variant'];\n}\n\n/**\n * RadioTabs component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n * and [HeroUI Tabs](https://www.heroui.com//docs/components/tabs)\n */\nconst RadioTabs = ({\n  className = undefined,\n  disabled = false,\n  inline = false,\n  label = undefined,\n  name,\n  options,\n  testId: _testId = undefined,\n  variant = undefined,\n}: RadioTabsProps): ReactElement => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n  const { field } = useController({ control, disabled, name });\n  const { disabled: isDisabled, onBlur, onChange, ref, value } = field;\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  const variants = radioTabsVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  const tabOptions = options.map<TabProps>((option) => ({\n    content: option?.content,\n    disabled: option?.disabled,\n    key: option.value,\n    label: option?.label || option?.value,\n    testId: slugify(`option_${option?.testId || option?.value}`, {\n      replaceDots: true,\n    }),\n  }));\n\n  const disabledAllKeys: string[] | undefined = tabOptions?.map(\n    (option) => option.key as string,\n  );\n\n  return (\n    <HeroRadioGroup\n      classNames={classNames}\n      // see HeroUI styles for group-data condition (data-invalid),\n      // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n      data-invalid={invalid}\n      data-required={required}\n      data-testid={testId}\n      errorMessage={\n        error && <FieldValidationError error={error} testId={testId} />\n      }\n      isDisabled={isDisabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={\n        showLabel && (\n          // eslint-disable-next-line jsx-a11y/label-has-associated-control\n          <label>\n            {label}\n            {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n          </label>\n        )\n      }\n      name={name}\n      orientation={inline ? 'horizontal' : 'vertical'}\n      onBlur={onBlur}\n      ref={ref}\n    >\n      <Tabs\n        disabledKeys={disabled ? disabledAllKeys : undefined}\n        fullWidth={false}\n        onSelectionChange={onChange}\n        selectedKey={value}\n        tabs={tabOptions as TabProps[]}\n        testId={testId}\n        variant={variant}\n      />\n    </HeroRadioGroup>\n  );\n};\n\nexport default RadioTabs;\n","import RadioTabs from './RadioTabs';\n\nexport type { RadioTabsProps } from './RadioTabs';\n\nexport { RadioTabs };\n\nexport default RadioTabs;\n"]}
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-IAMV2JNU.cjs","../src/RadioTabs/RadioTabs.tsx","../src/RadioTabs/index.ts"],"names":[],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-IAMV2JNU.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { TabsProps } from '@fuf-stack/pixels';\nimport type { TabProps } from '@fuf-stack/pixels/Tabs';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport Tabs from '@fuf-stack/pixels/Tabs';\n\nimport { useController, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const radioTabsVariants = tv({\n  slots: {\n    base: 'group', // Needs group for group-data condition\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger',\n    wrapper: '',\n    tabList: '',\n    tab: '',\n    tabContent: '',\n    cursor: '',\n    panel: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof radioTabsVariants>;\ntype ClassName = TVClassName<typeof radioTabsVariants>;\n\nexport interface RadioTabsOption {\n  /** Optional content inside of the tab */\n  content?: ReactNode;\n  /** disables the option */\n  disabled?: boolean;\n  /** option label */\n  label?: React.ReactNode;\n  /** option icon */\n  icon?: ReactNode;\n  /** HTML data-testid attribute of the option */\n  testId?: string;\n  /** option value */\n  value: string;\n}\n\nexport interface RadioTabsProps extends VariantProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** Determines if the Buttons are disabled or not. */\n  disabled?: boolean;\n  /** determines orientation of the Buttons. */\n  inline?: boolean;\n  /** Label displayed next to the RadioButton. */\n  label?: ReactNode;\n  /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n  name: string;\n  /** Radio button configuration. */\n  options: RadioTabsOption[];\n  /** Id to grab element in internal tests. */\n  testId?: string;\n  /** How the RadioTabs should look like. */\n  variant?: TabsProps['variant'];\n}\n\n/**\n * RadioTabs component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n * and [HeroUI Tabs](https://www.heroui.com//docs/components/tabs)\n */\nconst RadioTabs = ({\n  className = undefined,\n  disabled = false,\n  inline = false,\n  label = undefined,\n  name,\n  options,\n  testId: _testId = undefined,\n  variant = undefined,\n}: RadioTabsProps): ReactElement => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n  const { field } = useController({ control, disabled, name });\n  const { disabled: isDisabled, onBlur, onChange, ref, value } = field;\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  const variants = radioTabsVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  const tabOptions = options.map<TabProps>((option) => ({\n    content: option?.content,\n    disabled: option?.disabled,\n    key: option.value,\n    label: option?.label || option?.value,\n    testId: slugify(`option_${option?.testId || option?.value}`, {\n      replaceDots: true,\n    }),\n  }));\n\n  const disabledAllKeys: string[] | undefined = tabOptions?.map(\n    (option) => option.key as string,\n  );\n\n  return (\n    <HeroRadioGroup\n      classNames={classNames}\n      // see HeroUI styles for group-data condition (data-invalid),\n      // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n      data-invalid={invalid}\n      data-required={required}\n      data-testid={testId}\n      errorMessage={\n        error && <FieldValidationError error={error} testId={testId} />\n      }\n      isDisabled={isDisabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={\n        showLabel && (\n          // eslint-disable-next-line jsx-a11y/label-has-associated-control\n          <label>\n            {label}\n            {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n          </label>\n        )\n      }\n      name={name}\n      orientation={inline ? 'horizontal' : 'vertical'}\n      onBlur={onBlur}\n      ref={ref}\n    >\n      <Tabs\n        disabledKeys={disabled ? disabledAllKeys : undefined}\n        fullWidth={false}\n        onSelectionChange={onChange}\n        selectedKey={value}\n        tabs={tabOptions as TabProps[]}\n        testId={testId}\n        variant={variant}\n      />\n    </HeroRadioGroup>\n  );\n};\n\nexport default RadioTabs;\n","import RadioTabs from './RadioTabs';\n\nexport type { RadioTabsProps } from './RadioTabs';\n\nexport { RadioTabs };\n\nexport default RadioTabs;\n"]}

package/dist/{chunk-DHB37SIB.js → chunk-IZFO7YMQ.js}

@@ -1,13 +1,13 @@
-import {
-  FieldValidationError_default
-} from "./chunk-UTFZRBBS.js";
 import {
   FieldCopyTestIdButton_default
 } from "./chunk-BQGN3JTU.js";
+import {
+  FieldValidationError_default
+} from "./chunk-UTFZRBBS.js";
 import {
   useController,
   useFormContext
-} from "./chunk-6GHD5O3M.js";
+} from "./chunk-7QWLAPOT.js";
 
 // src/RadioTabs/RadioTabs.tsx
 import { RadioGroup as HeroRadioGroup } from "@heroui/radio";
@@ -101,4 +101,4 @@ export {
   RadioTabs_default,
   RadioTabs_default2
 };
-//# sourceMappingURL=chunk-DHB37SIB.js.map
+//# sourceMappingURL=chunk-IZFO7YMQ.js.map

package/dist/chunk-KMDTMBYI.js

@@ -0,0 +1,102 @@
+import {
+  useInputValueTransform
+} from "./chunk-G5UX55XC.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./chunk-K2V4ULA2.js";
+
+// src/hooks/useInputValueDebounce/useInputValueDebounce.ts
+import { useCallback, useEffect, useRef, useState } from "react";
+var useInputValueDebounce = ({
+  debounceDelay = 300,
+  onBlur,
+  onChange,
+  transformValue,
+  type,
+  value
+}) => {
+  const transform = useInputValueTransform({
+    transformValue,
+    type,
+    value
+  });
+  const getFormValue = useCallback(
+    (rawValue) => {
+      const stringValue = String(rawValue);
+      if (transformValue) {
+        return transformValue.formValue(stringValue);
+      }
+      if (type === "number" && stringValue !== "") {
+        const numValue = Number(stringValue);
+        return Number.isNaN(numValue) ? rawValue : numValue;
+      }
+      return rawValue;
+    },
+    [transformValue, type]
+  );
+  const displayValue = transformValue ? transform.displayValue : value;
+  const [currentDisplayValue, setCurrentDisplayValue] = useState(displayValue);
+  const timeoutRef = useRef(null);
+  useEffect(() => {
+    setCurrentDisplayValue(displayValue);
+  }, [displayValue]);
+  const handleChange = useCallback(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (...event) => {
+      var _a, _b, _c, _d;
+      const newValue = (_c = (_b = (_a = event[0]) == null ? void 0 : _a.target) == null ? void 0 : _b.value) != null ? _c : event[0];
+      let displayVal = newValue;
+      if (!transformValue && type === "number" && newValue !== "") {
+        const numValue = Number(newValue);
+        displayVal = Number.isNaN(numValue) ? newValue : numValue;
+      }
+      setCurrentDisplayValue(displayVal);
+      if (transformValue && ((_d = event[0]) == null ? void 0 : _d.target)) {
+        transform.handleInputChange(event[0]);
+      }
+      const formValue = getFormValue(newValue);
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+      const executeOnChange = () => {
+        var _a2;
+        if ((_a2 = event[0]) == null ? void 0 : _a2.target) {
+          const convertedEvent = __spreadProps(__spreadValues({}, event[0]), {
+            target: __spreadProps(__spreadValues({}, event[0].target), {
+              value: formValue
+            })
+          });
+          onChange(convertedEvent, ...event.slice(1));
+        } else {
+          onChange(formValue);
+        }
+      };
+      if (debounceDelay <= 0) {
+        executeOnChange();
+      } else {
+        timeoutRef.current = setTimeout(executeOnChange, debounceDelay);
+      }
+    },
+    [onChange, debounceDelay, transformValue, transform, type, getFormValue]
+  );
+  const handleBlur = useCallback(() => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+      const formValue = getFormValue(currentDisplayValue);
+      onChange(formValue);
+    }
+    onBlur();
+  }, [currentDisplayValue, onChange, onBlur, getFormValue]);
+  return {
+    onChange: handleChange,
+    onBlur: handleBlur,
+    value: currentDisplayValue
+  };
+};
+
+export {
+  useInputValueDebounce
+};
+//# sourceMappingURL=chunk-KMDTMBYI.js.map

package/dist/chunk-KMDTMBYI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/useInputValueDebounce/useInputValueDebounce.ts"],"sourcesContent":["import type { InputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useInputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\nexport interface UseInputValueDebounceOptions {\n  /** Debounce delay in milliseconds (default: 300) */\n  debounceDelay?: number;\n  /** The onBlur function to call after flushing debounced value */\n  onBlur: () => void;\n  /** The onChange function to call with debounced value */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  onChange: (...event: any[]) => void;\n  /** Value transformation functions */\n  transformValue?: InputValueTransform;\n  /** Input type to handle number conversion (optional) */\n  type?: 'text' | 'number' | 'password';\n  /** The value to debounce */\n  value: string | number;\n}\n\nexport interface UseInputValueDebounceReturn {\n  /** Enhanced onChange function with debouncing */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  onChange: (...event: any[]) => void;\n  /** Enhanced onBlur function that flushes current value immediately */\n  onBlur: () => void;\n  /** The field value that is displayed - updates immediately */\n  value: string | number;\n}\n\n/**\n * Custom hook for debouncing input value changes with immediate blur support.\n *\n * Provides immediate visual feedback by updating the display value instantly,\n * while debouncing the actual form state changes. When the input loses focus,\n * any pending debounced changes are immediately flushed.\n *\n * **Key Features:**\n * - **Debouncing**: Delays form updates until user stops typing\n * - **Transform support**: Optional value transformation between display and form values\n * - **Number conversion**: Automatic conversion for number inputs\n * - **Immediate display updates**: UI stays responsive during debouncing\n * - **Blur flushing**: Immediately applies pending changes on blur\n *\n * @param options Configuration for debounced value handling\n * @param options.debounceDelay Delay in milliseconds (default: 300)\n * @param options.onBlur Function to call after flushing debounced value\n * @param options.onChange Function to call with debounced value\n * @param options.transformValue Optional transform functions for display ↔ form value conversion\n * @param options.type Input type for number conversion ('text' | 'number' | 'password')\n * @param options.value The value to debounce\n * @returns Object containing enhanced onChange, onBlur, and immediate display value\n *\n * @example\n * Basic usage with debouncing:\n * ```tsx\n * const { onChange, onBlur, value } = useInputValueDebounce({\n *   debounceDelay: 300,\n *   onBlur: field.onBlur,\n *   onChange: field.onChange,\n *   value: field.value,\n * });\n * ```\n *\n * @example\n * Number input with automatic conversion:\n * ```tsx\n * const { onChange, onBlur, value } = useInputValueDebounce({\n *   debounceDelay: 300,\n *   onBlur: field.onBlur,\n *   onChange: field.onChange,\n *   type: 'number',\n *   value: field.value, // Display: 123 (number), Form: 123 (number)\n * });\n * ```\n *\n * @example\n * Currency formatting with transforms:\n * ```tsx\n * const currencyTransform = {\n *   displayValue: (val) => val ? `$${Number(val).toFixed(2)}` : '',\n *   formValue: (val) => Number(val.replace(/[$,]/g, '')) || 0\n * };\n *\n * const { onChange, onBlur, value } = useInputValueDebounce({\n *   debounceDelay: 300,\n *   onBlur: field.onBlur,\n *   onChange: field.onChange,\n *   transformValue: currencyTransform,\n *   value: field.value, // Display: \"$100.00\", Form: 100\n * });\n * ```\n */\nexport const useInputValueDebounce = ({\n  debounceDelay = 300,\n  onBlur,\n  onChange,\n  transformValue,\n  type,\n  value,\n}: UseInputValueDebounceOptions): UseInputValueDebounceReturn => {\n  // Use transform hook if transformValue is provided\n  const transform = useInputValueTransform({\n    transformValue,\n    type,\n    value,\n  });\n\n  // Helper function to convert any value to the appropriate form value\n  const getFormValue = useCallback(\n    (rawValue: string | number) => {\n      const stringValue = String(rawValue);\n\n      if (transformValue) {\n        return transformValue.formValue(stringValue);\n      }\n\n      if (type === 'number' && stringValue !== '') {\n        const numValue = Number(stringValue);\n        return Number.isNaN(numValue) ? rawValue : numValue;\n      }\n\n      return rawValue;\n    },\n    [transformValue, type],\n  );\n\n  // Use transform display value if available, otherwise use original value\n  const displayValue = transformValue ? transform.displayValue : value;\n  const [currentDisplayValue, setCurrentDisplayValue] = useState(displayValue);\n  const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n\n  // Sync display value when external value changes\n  useEffect(() => {\n    setCurrentDisplayValue(displayValue);\n  }, [displayValue]);\n\n  // Enhanced onChange handler\n  const handleChange = useCallback(\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (...event: any[]) => {\n      const newValue = event[0]?.target?.value ?? event[0];\n\n      // Convert display value to number if type is number and no transform\n      let displayVal = newValue;\n      if (!transformValue && type === 'number' && newValue !== '') {\n        const numValue = Number(newValue);\n        displayVal = Number.isNaN(numValue) ? newValue : numValue;\n      }\n\n      // Update display immediately\n      setCurrentDisplayValue(displayVal);\n\n      // Update transform if needed\n      if (transformValue && event[0]?.target) {\n        transform.handleInputChange(event[0]);\n      }\n\n      // Get form value using helper\n      const formValue = getFormValue(newValue);\n\n      // Clear existing timeout\n      if (timeoutRef.current) {\n        clearTimeout(timeoutRef.current);\n      }\n\n      const executeOnChange = () => {\n        // Preserve event structure if original was an event\n        if (event[0]?.target) {\n          const convertedEvent = {\n            ...event[0],\n            target: {\n              ...event[0].target,\n              value: formValue,\n            },\n          };\n          onChange(convertedEvent, ...event.slice(1));\n        } else {\n          onChange(formValue);\n        }\n      };\n\n      // Execute immediately or after delay\n      if (debounceDelay <= 0) {\n        executeOnChange();\n      } else {\n        timeoutRef.current = setTimeout(executeOnChange, debounceDelay);\n      }\n    },\n    [onChange, debounceDelay, transformValue, transform, type, getFormValue],\n  );\n\n  // Enhanced blur handler\n  const handleBlur = useCallback(() => {\n    // Flush pending changes\n    if (timeoutRef.current) {\n      clearTimeout(timeoutRef.current);\n      timeoutRef.current = null;\n\n      // Get form value using helper\n      const formValue = getFormValue(currentDisplayValue);\n      onChange(formValue);\n    }\n    onBlur();\n  }, [currentDisplayValue, onChange, onBlur, getFormValue]);\n\n  return {\n    onChange: handleChange,\n    onBlur: handleBlur,\n    value: currentDisplayValue,\n  };\n};\n"],"mappings":";;;;;;;;;AAEA,SAAS,aAAa,WAAW,QAAQ,gBAAgB;AA6FlD,IAAM,wBAAwB,CAAC;AAAA,EACpC,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAiE;AAE/D,QAAM,YAAY,uBAAuB;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAGD,QAAM,eAAe;AAAA,IACnB,CAAC,aAA8B;AAC7B,YAAM,cAAc,OAAO,QAAQ;AAEnC,UAAI,gBAAgB;AAClB,eAAO,eAAe,UAAU,WAAW;AAAA,MAC7C;AAEA,UAAI,SAAS,YAAY,gBAAgB,IAAI;AAC3C,cAAM,WAAW,OAAO,WAAW;AACnC,eAAO,OAAO,MAAM,QAAQ,IAAI,WAAW;AAAA,MAC7C;AAEA,aAAO;AAAA,IACT;AAAA,IACA,CAAC,gBAAgB,IAAI;AAAA,EACvB;AAGA,QAAM,eAAe,iBAAiB,UAAU,eAAe;AAC/D,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAAS,YAAY;AAC3E,QAAM,aAAa,OAA8B,IAAI;AAGrD,YAAU,MAAM;AACd,2BAAuB,YAAY;AAAA,EACrC,GAAG,CAAC,YAAY,CAAC;AAGjB,QAAM,eAAe;AAAA;AAAA,IAEnB,IAAI,UAAiB;AA9IzB;AA+IM,YAAM,YAAW,uBAAM,CAAC,MAAP,mBAAU,WAAV,mBAAkB,UAAlB,YAA2B,MAAM,CAAC;AAGnD,UAAI,aAAa;AACjB,UAAI,CAAC,kBAAkB,SAAS,YAAY,aAAa,IAAI;AAC3D,cAAM,WAAW,OAAO,QAAQ;AAChC,qBAAa,OAAO,MAAM,QAAQ,IAAI,WAAW;AAAA,MACnD;AAGA,6BAAuB,UAAU;AAGjC,UAAI,oBAAkB,WAAM,CAAC,MAAP,mBAAU,SAAQ;AACtC,kBAAU,kBAAkB,MAAM,CAAC,CAAC;AAAA,MACtC;AAGA,YAAM,YAAY,aAAa,QAAQ;AAGvC,UAAI,WAAW,SAAS;AACtB,qBAAa,WAAW,OAAO;AAAA,MACjC;AAEA,YAAM,kBAAkB,MAAM;AAxKpC,YAAAA;AA0KQ,aAAIA,MAAA,MAAM,CAAC,MAAP,gBAAAA,IAAU,QAAQ;AACpB,gBAAM,iBAAiB,iCAClB,MAAM,CAAC,IADW;AAAA,YAErB,QAAQ,iCACH,MAAM,CAAC,EAAE,SADN;AAAA,cAEN,OAAO;AAAA,YACT;AAAA,UACF;AACA,mBAAS,gBAAgB,GAAG,MAAM,MAAM,CAAC,CAAC;AAAA,QAC5C,OAAO;AACL,mBAAS,SAAS;AAAA,QACpB;AAAA,MACF;AAGA,UAAI,iBAAiB,GAAG;AACtB,wBAAgB;AAAA,MAClB,OAAO;AACL,mBAAW,UAAU,WAAW,iBAAiB,aAAa;AAAA,MAChE;AAAA,IACF;AAAA,IACA,CAAC,UAAU,eAAe,gBAAgB,WAAW,MAAM,YAAY;AAAA,EACzE;AAGA,QAAM,aAAa,YAAY,MAAM;AAEnC,QAAI,WAAW,SAAS;AACtB,mBAAa,WAAW,OAAO;AAC/B,iBAAW,UAAU;AAGrB,YAAM,YAAY,aAAa,mBAAmB;AAClD,eAAS,SAAS;AAAA,IACpB;AACA,WAAO;AAAA,EACT,GAAG,CAAC,qBAAqB,UAAU,QAAQ,YAAY,CAAC;AAExD,SAAO;AAAA,IACL,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,OAAO;AAAA,EACT;AACF;","names":["_a"]}

package/dist/{chunk-CESGUF6F.cjs → chunk-L4YPB7MU.cjs}

@@ -37,6 +37,9 @@ var toFormFormat = (fields) => {
   );
 };
 var toValidationFormat = (formState) => {
+  if (formState === void 0 || formState === null) {
+    return formState;
+  }
   return JSON.parse(
     JSON.stringify(formState, (_, value) => {
       if (Array.isArray(value)) {
@@ -60,4 +63,4 @@ var toValidationFormat = (formState) => {
 
 
 exports.fromNullishString = fromNullishString; exports.toNullishString = toNullishString; exports.toFormFormat = toFormFormat; exports.toValidationFormat = toValidationFormat;
-//# sourceMappingURL=chunk-CESGUF6F.cjs.map
+//# sourceMappingURL=chunk-L4YPB7MU.cjs.map

package/dist/chunk-L4YPB7MU.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-L4YPB7MU.cjs","../src/helpers/nullishFields/nullishFields.ts"],"names":[],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-L4YPB7MU.cjs","sourcesContent":[null,"/**\n * String markers used to preserve null, false, and 0 values during JSON processing\n */\nconst nullString = '__NULL__';\nconst falseString = '__FALSE__';\nconst zeroString = '__ZERO__';\n\n/**\n * Converts marker strings back to their original values when processing arrays\n */\nexport const fromNullishString = (value: unknown): unknown => {\n  if (typeof value !== 'string') return value;\n\n  switch (value) {\n    case nullString:\n      return null;\n    case falseString:\n      return false;\n    case zeroString:\n      return 0;\n    default:\n      return value;\n  }\n};\n\n/**\n * Converts null/falsy values to marker strings for JSON processing\n */\nexport const toNullishString = (value: unknown): unknown => {\n  if (value === null || value === '') return nullString;\n  if (value === false) return falseString;\n  if (value === 0) return zeroString;\n  return value;\n};\n\n/**\n * Converts field values to a format suitable for forms by:\n * - Converting array values to their string markers to preserve null/falsy values\n * - Removing empty strings and null values from objects\n *\n * This conversion is required because React Hook Form does not support arrays with\n * flat values (string, number, boolean, null). Array fields must contain objects.\n * We work around this by converting array values to string markers.\n *\n * @example\n * const fields = {\n *   name: 'John',\n *   scores: [0, null, 75, false],\n *   contact: {\n *     email: '',\n *     phone: null,\n *     address: '123 Main St'\n *   }\n * };\n *\n * // Result:\n * {\n *   name: 'John',\n *   scores: ['__ZERO__', '__NULL__', 75, '__FALSE__'],\n *   contact: {\n *     address: '123 Main St'\n *   }\n * }\n */\nexport const toFormFormat = (\n  fields: Record<string, unknown>,\n): Record<string, unknown> => {\n  return JSON.parse(\n    JSON.stringify(fields, (_, value) => {\n      if (Array.isArray(value)) {\n        return value.map(toNullishString);\n      }\n\n      if (value && typeof value === 'object') {\n        return Object.fromEntries(\n          Object.entries(value).filter(([_key, v]) => v !== '' && v !== null),\n        );\n      }\n\n      return value;\n    }),\n  );\n};\n\n/**\n * Converts form state to a format suitable for validation by:\n * - Converting array string markers (__NULL__, __FALSE__, __ZERO__) back to their original values\n * - Converting _NULL__ to null\n * - Removing fields that contain empty strings, null, or any string markers representing null/empty values\n *\n * @example\n * const formState = {\n *   name: 'John',\n *   scores: [75, '__ZERO__', '_NULL__', '__FALSE__'],\n *   email: null,\n *   phone: '__NULL__',\n *   contact: {\n *     address: '123 Main St',\n *     fax: null\n *   }\n * };\n *\n * // Result:\n * {\n *   name: 'John',\n *   scores: [75, 0, null, false],\n *   contact: {\n *     address: '123 Main St'\n *   }\n * }\n */\nexport const toValidationFormat = (\n  formState: Record<string, unknown> | null | undefined,\n): Record<string, unknown> | null | undefined => {\n  // Handle null or undefined input\n  if (formState === undefined || formState === null) {\n    return formState;\n  }\n\n  return JSON.parse(\n    JSON.stringify(formState, (_, value) => {\n      if (Array.isArray(value)) {\n        return value.map(fromNullishString);\n      }\n\n      if (value && typeof value === 'object') {\n        return Object.fromEntries(\n          Object.entries(value)\n            .filter(\n              ([_key, v]) =>\n                fromNullishString(v) !== '' && fromNullishString(v) !== null,\n            )\n            .map(([k, v]) => [k, fromNullishString(v)]),\n        );\n      }\n\n      return value;\n    }),\n  );\n};\n"]}

package/dist/{chunk-JOPMDYPE.cjs → chunk-NMYLBRT5.cjs}

@@ -3,18 +3,18 @@
 var _chunkTTD3KL6Ecjs = require('./chunk-TTD3KL6E.cjs');
 
 
-var _chunkGNYQC5IJcjs = require('./chunk-GNYQC5IJ.cjs');
+var _chunkPA2DQCBYcjs = require('./chunk-PA2DQCBY.cjs');
 
 
-var _chunkPA2DQCBYcjs = require('./chunk-PA2DQCBY.cjs');
+var _chunkGNYQC5IJcjs = require('./chunk-GNYQC5IJ.cjs');
 
 
 
 
-var _chunkYPV2TH7Ucjs = require('./chunk-YPV2TH7U.cjs');
+var _chunkY6EAPURVcjs = require('./chunk-Y6EAPURV.cjs');
 
 
-var _chunkCESGUF6Fcjs = require('./chunk-CESGUF6F.cjs');
+var _chunkL4YPB7MUcjs = require('./chunk-L4YPB7MU.cjs');
 
 
 
@@ -118,9 +118,9 @@ var FieldArrayElement = ({
   testId = void 0
 }) => {
   var _a;
-  const { getFieldState } = _chunkYPV2TH7Ucjs.useFormContext.call(void 0, );
+  const { getFieldState } = _chunkY6EAPURVcjs.useFormContext.call(void 0, );
   const { error, invalid } = getFieldState(arrayFieldName, void 0);
-  const { getHelperWrapperProps, getErrorMessageProps } = _chunkYPV2TH7Ucjs.useInput.call(void 0, {
+  const { getHelperWrapperProps, getErrorMessageProps } = _chunkY6EAPURVcjs.useInput.call(void 0, {
     classNames: { helperWrapper: "block" },
     errorMessage: JSON.stringify(error),
     isInvalid: invalid,
@@ -282,13 +282,13 @@ var FieldArray = ({
     getFieldState,
     trigger
     // watch
-  } = _chunkYPV2TH7Ucjs.useFormContext.call(void 0, );
-  const { fields, append, remove, insert, move } = _chunkYPV2TH7Ucjs.useFieldArray.call(void 0, {
+  } = _chunkY6EAPURVcjs.useFormContext.call(void 0, );
+  const { fields, append, remove, insert, move } = _chunkY6EAPURVcjs.useFieldArray.call(void 0, {
     control,
     name
   });
   const { error, testId, invalid, required } = getFieldState(name, _testId);
-  const { label, getLabelProps, getHelperWrapperProps, getErrorMessageProps } = _chunkYPV2TH7Ucjs.useInput.call(void 0, {
+  const { label, getLabelProps, getHelperWrapperProps, getErrorMessageProps } = _chunkY6EAPURVcjs.useInput.call(void 0, {
     isInvalid: invalid,
     isRequired: required,
     errorMessage: JSON.stringify(error),
@@ -297,7 +297,7 @@ var FieldArray = ({
     placeholder: " ",
     classNames: { helperWrapper: "block" }
   });
-  const elementInitialValue = _chunkCESGUF6Fcjs.toNullishString.call(void 0, _elementInitialValue);
+  const elementInitialValue = _chunkL4YPB7MUcjs.toNullishString.call(void 0, _elementInitialValue);
   if (lastElementNotRemovable && fields.length === 0) {
     append(elementInitialValue);
   }
@@ -383,4 +383,4 @@ var FieldArray_default2 = FieldArray_default;
 
 
 exports.FieldArray_default = FieldArray_default; exports.FieldArray_default2 = FieldArray_default2;
-//# sourceMappingURL=chunk-JOPMDYPE.cjs.map
+//# sourceMappingURL=chunk-NMYLBRT5.cjs.map

package/dist/{chunk-JOPMDYPE.cjs.map → chunk-NMYLBRT5.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-JOPMDYPE.cjs","../src/FieldArray/FieldArray.tsx","../src/FieldArray/subcomponents/FieldArrayElement.tsx","../src/FieldArray/subcomponents/ElementInsertAfterButton.tsx","../src/FieldArray/subcomponents/ElementRemoveButton.tsx","../src/FieldArray/subcomponents/SortDragHandle.tsx","../src/FieldArray/subcomponents/SortContext.tsx","../src/FieldArray/index.ts"],"names":["jsx","Button","cn","useSortable","Fragment","FieldArray_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-JOPMDYPE.cjs","sourcesContent":[null,"/* eslint-disable react/jsx-props-no-spreading */\n\nimport type { FieldArrayElementMethods } from './subcomponents/FieldArrayElement';\nimport type { FieldArrayProps } from './types';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { toNullishString } from '../helpers';\nimport { useFieldArray, useFormContext, useInput } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport FieldArrayElement from './subcomponents/FieldArrayElement';\nimport SortContext from './subcomponents/SortContext';\n\nexport const fieldArrayVariants = tv({\n  slots: {\n    appendButton: 'w-full',\n    elementWrapper: 'flex-grow',\n    insertAfterButton: 'text-xs font-medium',\n    label: '!pointer-events-auto !static !z-0 -mb-1 ml-1 !inline-block',\n    list: 'm-0 w-full list-none',\n    listItem: 'mb-4 flex w-full flex-row',\n    removeButton: 'ml-1',\n    sortDragHandle: 'mr-2 text-base text-xl',\n  },\n});\n\n/**\n * FieldArray component based in [RHF useFieldArray](https://react-hook-form.com/docs/usefieldarray)\n */\nconst FieldArray = ({\n  appendButtonText = 'Add Element',\n  children,\n  className: _className = undefined,\n  duplicate = false,\n  elementInitialValue: _elementInitialValue = null,\n  insertAfter = false,\n  label: _label = undefined,\n  lastElementNotRemovable = false,\n  name,\n  sortable = false,\n  testId: _testId = undefined,\n}: FieldArrayProps) => {\n  // className from slots\n  const variants = fieldArrayVariants();\n  const className = variantsToClassNames(variants, _className, 'list');\n\n  const {\n    control,\n    debugMode,\n    getValues,\n    getFieldState,\n    trigger,\n    // watch\n  } = useFormContext();\n\n  const { fields, append, remove, insert, move } = useFieldArray({\n    control,\n    name,\n  });\n\n  const { error, testId, invalid, required } = getFieldState(name, _testId);\n\n  // TODO: what about input props?\n  const { label, getLabelProps, getHelperWrapperProps, getErrorMessageProps } =\n    useInput({\n      isInvalid: invalid,\n      isRequired: required,\n      errorMessage: JSON.stringify(error),\n      label: _label,\n      labelPlacement: 'inside',\n      placeholder: ' ',\n      classNames: { helperWrapper: 'block' },\n    });\n\n  // TODO: add info\n  const elementInitialValue = toNullishString(_elementInitialValue);\n\n  // When lastElementNotRemovable is set and the field array is empty,\n  // add an initial element to ensure there's always at least one visible element\n  if (lastElementNotRemovable && fields.length === 0) {\n    append(elementInitialValue);\n  }\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  return (\n    <SortContext sortable={sortable} move={move} fields={fields}>\n      <ul\n        className={className.list}\n        data-testid={testId}\n        /**\n         * TODO: this trigger causes the field array (not element)\n         * are shown immediately, but this will cause additional\n         * render cycles, not sure if we should do this...\n         */\n        onBlur={() => trigger(`${name}`)}\n      >\n        {/* field array label */}\n        {showLabel && (\n          <>\n            {label && (\n              // eslint-disable-next-line jsx-a11y/label-has-associated-control\n              <label\n                {...getLabelProps()}\n                className={cn(getLabelProps()?.className, className.label)}\n              >\n                {label}\n              </label>\n            )}\n            {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n          </>\n        )}\n\n        {fields.map((field, index) => {\n          const elementName = `${name}.${index}`;\n          const elementTestId = `${testId}_${index}`;\n\n          // create methods for element\n          const elementMethods: FieldArrayElementMethods = {\n            append: () => append(elementInitialValue),\n            duplicate: () => {\n              const values = getValues(name);\n              insert(index + 1, values[index]);\n            },\n            insert: () => insert(index + 1, elementInitialValue),\n            remove: () => remove(index),\n          };\n\n          return (\n            <FieldArrayElement\n              arrayFieldName={name}\n              className={className}\n              fields={fields}\n              id={field.id}\n              index={index}\n              duplicate={duplicate}\n              insertAfter={insertAfter}\n              key={field.id}\n              lastNotDeletable={lastElementNotRemovable}\n              methods={elementMethods}\n              sortable={sortable}\n              testId={elementTestId}\n            >\n              {children({\n                index,\n                length: fields.length,\n                methods: elementMethods,\n                name: elementName,\n                testId: elementTestId,\n              })}\n            </FieldArrayElement>\n          );\n        })}\n\n        {/* append elements */}\n        <Button\n          className={className.appendButton}\n          disableAnimation\n          onClick={() => append(elementInitialValue)}\n          size=\"sm\"\n          testId={`${testId}_append_button`}\n        >\n          {appendButtonText}\n        </Button>\n\n        {/* top level field array errors */}\n        {/* @ts-expect-error rhf incompatibility */}\n        {error?._errors && (\n          <div {...getHelperWrapperProps()}>\n            <div {...getErrorMessageProps()}>\n              {/* @ts-expect-error rhf incompatibility */}\n              <FieldValidationError error={error?._errors} testId={testId} />\n            </div>\n          </div>\n        )}\n      </ul>\n    </SortContext>\n  );\n};\n\nexport default FieldArray;\n","/* eslint-disable react/jsx-props-no-spreading */\n\nimport type { ClassValue } from '@fuf-stack/pixel-utils';\nimport type { FieldArrayFeatures } from '../types';\n\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { Grid } from '../../Grid';\nimport { useFormContext, useInput } from '../../hooks';\nimport { FieldValidationError } from '../../partials/FieldValidationError';\nimport ElementInsertAfterButton from './ElementInsertAfterButton';\nimport ElementRemoveButton from './ElementRemoveButton';\nimport SortDragHandle from './SortDragHandle';\n\nexport type FieldArrayElementMethods = {\n  /** Add new element at end */\n  append: () => void;\n  /** Clone current element */\n  duplicate: () => void;\n  /** Add new element after current */\n  insert: () => void;\n  /** Remove current element */\n  remove: () => void;\n};\n\ninterface FieldArrayElementProps extends FieldArrayFeatures {\n  /** Base field name for form context */\n  arrayFieldName: string;\n  /** Form elements to render inside array element */\n  children: React.ReactNode;\n  /** CSS class names for component parts */\n  className: {\n    /** Class of wrapper div inside the li that wraps the rendered element fields directly */\n    elementWrapper?: ClassValue;\n    /** Class for the li */\n    listItem?: ClassValue;\n    /** Class for the insert button between elements */\n    insertAfterButton?: ClassValue;\n    /** Class for the remove element button */\n    removeButton?: ClassValue;\n    /** Class for the drag handle when sorting enabled */\n    sortDragHandle?: ClassValue;\n  };\n  /** All fields in the form array */\n  fields: Record<'id', string>[];\n  /** Unique identifier for drag/drop */\n  id: string | number;\n  /** Field index in array */\n  index: number;\n  /** Prevent deletion of last remaining element */\n  lastNotDeletable?: boolean;\n  /** Field array operation methods */\n  methods: FieldArrayElementMethods;\n  /** HTML data-testid of the element */\n  testId?: string;\n}\n\n/**\n * Form array element component using react-hook-form with drag-drop sorting\n * and validation capabilities\n */\nconst FieldArrayElement = ({\n  arrayFieldName,\n  children,\n  className,\n  fields,\n  id,\n  index,\n  insertAfter = false,\n  lastNotDeletable = true,\n  methods,\n  sortable = false,\n  testId = undefined,\n}: FieldArrayElementProps) => {\n  const { getFieldState } = useFormContext();\n  const { error, invalid } = getFieldState(arrayFieldName, undefined);\n\n  // TODO: what about input props? and label props? Do we need a label?\n  const { getHelperWrapperProps, getErrorMessageProps } = useInput({\n    classNames: { helperWrapper: 'block' },\n    errorMessage: JSON.stringify(error),\n    isInvalid: invalid,\n    labelPlacement: 'inside',\n    placeholder: ' ',\n  });\n\n  // Apply transform styles when sortable is enabled for smooth drag animations\n  // transform: handles the item's position during drag\n  // transition: controls the animation timing when dropping\n  const { setNodeRef, transform, transition } = useSortable({ id });\n  const sortingStyle = sortable\n    ? {\n        transform: CSS.Translate.toString(transform),\n        transition,\n      }\n    : undefined;\n\n  return (\n    <>\n      <li\n        className={cn(className.listItem)}\n        ref={setNodeRef}\n        style={sortingStyle}\n      >\n        {/** sorting drag handle */}\n        {sortable && (\n          <SortDragHandle\n            className={className.sortDragHandle}\n            id={id}\n            testId={`${testId}_sort_drag_handle`}\n          />\n        )}\n\n        {/** render element fields */}\n        <div\n          className={cn(className.elementWrapper)}\n          data-testid={`${testId}_element_wrapper`}\n        >\n          {/* TODO: this has to be improved */}\n          <Grid>{children}</Grid>\n        </div>\n\n        {/** remove element */}\n        {lastNotDeletable && fields.length === 1 ? null : (\n          <ElementRemoveButton\n            className={className.removeButton}\n            onClick={() => methods.remove()}\n            testId={`${testId}_remove_button`}\n          />\n        )}\n\n        {/** insertAfter feature when not last element */}\n        {insertAfter && index !== fields.length - 1 && (\n          <ElementInsertAfterButton\n            className={className.insertAfterButton}\n            onClick={() => methods.insert()}\n            testId={`${testId}_insert_after_button`}\n          />\n        )}\n      </li>\n\n      {/** element error */}\n      {error && typeof error[index] !== 'undefined' && (\n        <div {...getHelperWrapperProps()}>\n          <div {...getErrorMessageProps()}>\n            <FieldValidationError\n              /* @ts-expect-error rhf incompatibility */\n              error={error[Number(index)]?._errors}\n              testId={testId as string}\n            />\n          </div>\n        </div>\n      )}\n    </>\n  );\n};\n\nexport default FieldArrayElement;\n","import type { ClassValue } from '@fuf-stack/pixel-utils';\n\nimport { FaPlus } from 'react-icons/fa6';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\ninterface ElementInsertAfterButtonProps {\n  /** CSS class name */\n  className?: ClassValue;\n  /** click handler */\n  onClick: () => void;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\nconst ElementInsertAfterButton = ({\n  className = undefined,\n  onClick,\n  testId = undefined,\n}: ElementInsertAfterButtonProps) => {\n  return (\n    <Button\n      className={cn(className)}\n      color=\"success\"\n      icon={<FaPlus />}\n      onClick={onClick}\n      size=\"sm\"\n      testId={testId}\n      variant=\"light\"\n    />\n  );\n};\n\nexport default ElementInsertAfterButton;\n","import type { ClassValue } from '@fuf-stack/pixel-utils';\n\nimport { FaTimes } from 'react-icons/fa';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\ninterface ElementRemoveButtonProps {\n  /** CSS class name */\n  className?: ClassValue;\n  /** click handler */\n  onClick: () => void;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\nconst ElementRemoveButton = ({\n  className = undefined,\n  onClick,\n  testId = undefined,\n}: ElementRemoveButtonProps) => {\n  return (\n    <Button\n      ariaLabel=\"remove element\"\n      className={cn(className)}\n      color=\"danger\"\n      icon={<FaTimes />}\n      onClick={onClick}\n      testId={testId}\n      variant=\"light\"\n    />\n  );\n};\n\nexport default ElementRemoveButton;\n","import type { ClassValue } from '@fuf-stack/pixel-utils';\n\nimport { FaGripVertical } from 'react-icons/fa';\n\nimport { useSortable } from '@dnd-kit/sortable';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\ninterface SortDragHandleProps {\n  /** Optional CSS class name */\n  className?: ClassValue;\n  /** Unique identifier for sortable item */\n  id: string | number;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * Drag handle component that integrates with dnd-kit sortable functionality.\n * Renders a vertical grip icon that can be used to reorder items.\n */\nconst SortDragHandle = ({\n  className = undefined,\n  id,\n  testId = undefined,\n}: SortDragHandleProps) => {\n  // Get dnd-kit sortable attributes and listeners\n  const { attributes, listeners } = useSortable({ id });\n\n  return (\n    <div\n      className={cn(className)}\n      data-testid={testId}\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...attributes}\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...listeners}\n    >\n      <FaGripVertical />\n    </div>\n  );\n};\n\nexport default SortDragHandle;\n","/* eslint-disable react/jsx-props-no-spreading */\n\nimport type { DragEndEvent } from '@dnd-kit/core';\nimport type { ReactNode } from 'react';\nimport type { UseFieldArrayMove } from 'react-hook-form';\n\nimport {\n  closestCenter,\n  DndContext,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core';\nimport {\n  restrictToVerticalAxis,\n  restrictToWindowEdges,\n} from '@dnd-kit/modifiers';\nimport {\n  SortableContext,\n  verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\n\ninterface SortContextProps {\n  /** child components */\n  children: ReactNode;\n  /** enable/disable sorting functionality */\n  sortable: boolean;\n  /** Array of objects containing unique IDs for sortable items */\n  fields: Record<'id', string>[];\n  /** react-hook-form's move function to update field array indices */\n  move: UseFieldArrayMove;\n}\n\n/**\n * A wrapper component that provides drag-and-drop sorting functionality for field arrays\n * using dnd-kit and react-hook-form.\n *\n * This component integrates with react-hook-form's field arrays to enable vertical\n * drag-and-drop reordering of form fields. It supports both pointer (mouse/touch)\n * and keyboard interactions for accessibility.\n */\nconst SortContext = ({\n  children,\n  sortable,\n  fields,\n  move,\n}: SortContextProps) => {\n  // Initialize sensors for both pointer (mouse/touch) and keyboard interactions\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor),\n  );\n\n  // Early return if sorting is disabled\n  if (!sortable) {\n    return children;\n  }\n\n  /**\n   * Handles the end of a drag operation by updating field positions\n   * @param event - The drag end event containing active and over elements\n   */\n  const handleDragEnd = (event: DragEndEvent) => {\n    const { active, over } = event;\n\n    // Only move if dropping over a different item\n    if (active.id !== over?.id) {\n      // Find the indices of the dragged item and drop target\n      const oldIndex = fields.findIndex((field) => field.id === active.id);\n      const newIndex = fields.findIndex((field) => field.id === over?.id);\n      // Update the field array order using react-hook-form's move function\n      move(oldIndex, newIndex);\n    }\n  };\n\n  return (\n    <DndContext\n      collisionDetection={closestCenter}\n      modifiers={[restrictToVerticalAxis, restrictToWindowEdges]}\n      onDragEnd={handleDragEnd}\n      sensors={sensors}\n    >\n      <SortableContext\n        items={fields.map((field) => field.id)}\n        strategy={verticalListSortingStrategy}\n      >\n        {children}\n      </SortableContext>\n    </DndContext>\n  );\n};\n\nexport default SortContext;\n","import FieldArray from './FieldArray';\n\nexport type * from './types';\n\nexport { FieldArray };\n\nexport default FieldArray;\n"]}
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-NMYLBRT5.cjs","../src/FieldArray/FieldArray.tsx","../src/FieldArray/subcomponents/FieldArrayElement.tsx","../src/FieldArray/subcomponents/ElementInsertAfterButton.tsx","../src/FieldArray/subcomponents/ElementRemoveButton.tsx","../src/FieldArray/subcomponents/SortDragHandle.tsx","../src/FieldArray/subcomponents/SortContext.tsx","../src/FieldArray/index.ts"],"names":["jsx","Button","cn","useSortable","Fragment","FieldArray_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-NMYLBRT5.cjs","sourcesContent":[null,"/* eslint-disable react/jsx-props-no-spreading */\n\nimport type { FieldArrayElementMethods } from './subcomponents/FieldArrayElement';\nimport type { FieldArrayProps } from './types';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { toNullishString } from '../helpers';\nimport { useFieldArray, useFormContext, useInput } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport FieldArrayElement from './subcomponents/FieldArrayElement';\nimport SortContext from './subcomponents/SortContext';\n\nexport const fieldArrayVariants = tv({\n  slots: {\n    appendButton: 'w-full',\n    elementWrapper: 'flex-grow',\n    insertAfterButton: 'text-xs font-medium',\n    label: '!pointer-events-auto !static !z-0 -mb-1 ml-1 !inline-block',\n    list: 'm-0 w-full list-none',\n    listItem: 'mb-4 flex w-full flex-row',\n    removeButton: 'ml-1',\n    sortDragHandle: 'mr-2 text-base text-xl',\n  },\n});\n\n/**\n * FieldArray component based in [RHF useFieldArray](https://react-hook-form.com/docs/usefieldarray)\n */\nconst FieldArray = ({\n  appendButtonText = 'Add Element',\n  children,\n  className: _className = undefined,\n  duplicate = false,\n  elementInitialValue: _elementInitialValue = null,\n  insertAfter = false,\n  label: _label = undefined,\n  lastElementNotRemovable = false,\n  name,\n  sortable = false,\n  testId: _testId = undefined,\n}: FieldArrayProps) => {\n  // className from slots\n  const variants = fieldArrayVariants();\n  const className = variantsToClassNames(variants, _className, 'list');\n\n  const {\n    control,\n    debugMode,\n    getValues,\n    getFieldState,\n    trigger,\n    // watch\n  } = useFormContext();\n\n  const { fields, append, remove, insert, move } = useFieldArray({\n    control,\n    name,\n  });\n\n  const { error, testId, invalid, required } = getFieldState(name, _testId);\n\n  // TODO: what about input props?\n  const { label, getLabelProps, getHelperWrapperProps, getErrorMessageProps } =\n    useInput({\n      isInvalid: invalid,\n      isRequired: required,\n      errorMessage: JSON.stringify(error),\n      label: _label,\n      labelPlacement: 'inside',\n      placeholder: ' ',\n      classNames: { helperWrapper: 'block' },\n    });\n\n  // TODO: add info\n  const elementInitialValue = toNullishString(_elementInitialValue);\n\n  // When lastElementNotRemovable is set and the field array is empty,\n  // add an initial element to ensure there's always at least one visible element\n  if (lastElementNotRemovable && fields.length === 0) {\n    append(elementInitialValue);\n  }\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  return (\n    <SortContext sortable={sortable} move={move} fields={fields}>\n      <ul\n        className={className.list}\n        data-testid={testId}\n        /**\n         * TODO: this trigger causes the field array (not element)\n         * are shown immediately, but this will cause additional\n         * render cycles, not sure if we should do this...\n         */\n        onBlur={() => trigger(`${name}`)}\n      >\n        {/* field array label */}\n        {showLabel && (\n          <>\n            {label && (\n              // eslint-disable-next-line jsx-a11y/label-has-associated-control\n              <label\n                {...getLabelProps()}\n                className={cn(getLabelProps()?.className, className.label)}\n              >\n                {label}\n              </label>\n            )}\n            {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n          </>\n        )}\n\n        {fields.map((field, index) => {\n          const elementName = `${name}.${index}`;\n          const elementTestId = `${testId}_${index}`;\n\n          // create methods for element\n          const elementMethods: FieldArrayElementMethods = {\n            append: () => append(elementInitialValue),\n            duplicate: () => {\n              const values = getValues(name);\n              insert(index + 1, values[index]);\n            },\n            insert: () => insert(index + 1, elementInitialValue),\n            remove: () => remove(index),\n          };\n\n          return (\n            <FieldArrayElement\n              arrayFieldName={name}\n              className={className}\n              fields={fields}\n              id={field.id}\n              index={index}\n              duplicate={duplicate}\n              insertAfter={insertAfter}\n              key={field.id}\n              lastNotDeletable={lastElementNotRemovable}\n              methods={elementMethods}\n              sortable={sortable}\n              testId={elementTestId}\n            >\n              {children({\n                index,\n                length: fields.length,\n                methods: elementMethods,\n                name: elementName,\n                testId: elementTestId,\n              })}\n            </FieldArrayElement>\n          );\n        })}\n\n        {/* append elements */}\n        <Button\n          className={className.appendButton}\n          disableAnimation\n          onClick={() => append(elementInitialValue)}\n          size=\"sm\"\n          testId={`${testId}_append_button`}\n        >\n          {appendButtonText}\n        </Button>\n\n        {/* top level field array errors */}\n        {/* @ts-expect-error rhf incompatibility */}\n        {error?._errors && (\n          <div {...getHelperWrapperProps()}>\n            <div {...getErrorMessageProps()}>\n              {/* @ts-expect-error rhf incompatibility */}\n              <FieldValidationError error={error?._errors} testId={testId} />\n            </div>\n          </div>\n        )}\n      </ul>\n    </SortContext>\n  );\n};\n\nexport default FieldArray;\n","/* eslint-disable react/jsx-props-no-spreading */\n\nimport type { ClassValue } from '@fuf-stack/pixel-utils';\nimport type { FieldArrayFeatures } from '../types';\n\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { Grid } from '../../Grid';\nimport { useFormContext, useInput } from '../../hooks';\nimport { FieldValidationError } from '../../partials/FieldValidationError';\nimport ElementInsertAfterButton from './ElementInsertAfterButton';\nimport ElementRemoveButton from './ElementRemoveButton';\nimport SortDragHandle from './SortDragHandle';\n\nexport type FieldArrayElementMethods = {\n  /** Add new element at end */\n  append: () => void;\n  /** Clone current element */\n  duplicate: () => void;\n  /** Add new element after current */\n  insert: () => void;\n  /** Remove current element */\n  remove: () => void;\n};\n\ninterface FieldArrayElementProps extends FieldArrayFeatures {\n  /** Base field name for form context */\n  arrayFieldName: string;\n  /** Form elements to render inside array element */\n  children: React.ReactNode;\n  /** CSS class names for component parts */\n  className: {\n    /** Class of wrapper div inside the li that wraps the rendered element fields directly */\n    elementWrapper?: ClassValue;\n    /** Class for the li */\n    listItem?: ClassValue;\n    /** Class for the insert button between elements */\n    insertAfterButton?: ClassValue;\n    /** Class for the remove element button */\n    removeButton?: ClassValue;\n    /** Class for the drag handle when sorting enabled */\n    sortDragHandle?: ClassValue;\n  };\n  /** All fields in the form array */\n  fields: Record<'id', string>[];\n  /** Unique identifier for drag/drop */\n  id: string | number;\n  /** Field index in array */\n  index: number;\n  /** Prevent deletion of last remaining element */\n  lastNotDeletable?: boolean;\n  /** Field array operation methods */\n  methods: FieldArrayElementMethods;\n  /** HTML data-testid of the element */\n  testId?: string;\n}\n\n/**\n * Form array element component using react-hook-form with drag-drop sorting\n * and validation capabilities\n */\nconst FieldArrayElement = ({\n  arrayFieldName,\n  children,\n  className,\n  fields,\n  id,\n  index,\n  insertAfter = false,\n  lastNotDeletable = true,\n  methods,\n  sortable = false,\n  testId = undefined,\n}: FieldArrayElementProps) => {\n  const { getFieldState } = useFormContext();\n  const { error, invalid } = getFieldState(arrayFieldName, undefined);\n\n  // TODO: what about input props? and label props? Do we need a label?\n  const { getHelperWrapperProps, getErrorMessageProps } = useInput({\n    classNames: { helperWrapper: 'block' },\n    errorMessage: JSON.stringify(error),\n    isInvalid: invalid,\n    labelPlacement: 'inside',\n    placeholder: ' ',\n  });\n\n  // Apply transform styles when sortable is enabled for smooth drag animations\n  // transform: handles the item's position during drag\n  // transition: controls the animation timing when dropping\n  const { setNodeRef, transform, transition } = useSortable({ id });\n  const sortingStyle = sortable\n    ? {\n        transform: CSS.Translate.toString(transform),\n        transition,\n      }\n    : undefined;\n\n  return (\n    <>\n      <li\n        className={cn(className.listItem)}\n        ref={setNodeRef}\n        style={sortingStyle}\n      >\n        {/** sorting drag handle */}\n        {sortable && (\n          <SortDragHandle\n            className={className.sortDragHandle}\n            id={id}\n            testId={`${testId}_sort_drag_handle`}\n          />\n        )}\n\n        {/** render element fields */}\n        <div\n          className={cn(className.elementWrapper)}\n          data-testid={`${testId}_element_wrapper`}\n        >\n          {/* TODO: this has to be improved */}\n          <Grid>{children}</Grid>\n        </div>\n\n        {/** remove element */}\n        {lastNotDeletable && fields.length === 1 ? null : (\n          <ElementRemoveButton\n            className={className.removeButton}\n            onClick={() => methods.remove()}\n            testId={`${testId}_remove_button`}\n          />\n        )}\n\n        {/** insertAfter feature when not last element */}\n        {insertAfter && index !== fields.length - 1 && (\n          <ElementInsertAfterButton\n            className={className.insertAfterButton}\n            onClick={() => methods.insert()}\n            testId={`${testId}_insert_after_button`}\n          />\n        )}\n      </li>\n\n      {/** element error */}\n      {error && typeof error[index] !== 'undefined' && (\n        <div {...getHelperWrapperProps()}>\n          <div {...getErrorMessageProps()}>\n            <FieldValidationError\n              /* @ts-expect-error rhf incompatibility */\n              error={error[Number(index)]?._errors}\n              testId={testId as string}\n            />\n          </div>\n        </div>\n      )}\n    </>\n  );\n};\n\nexport default FieldArrayElement;\n","import type { ClassValue } from '@fuf-stack/pixel-utils';\n\nimport { FaPlus } from 'react-icons/fa6';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\ninterface ElementInsertAfterButtonProps {\n  /** CSS class name */\n  className?: ClassValue;\n  /** click handler */\n  onClick: () => void;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\nconst ElementInsertAfterButton = ({\n  className = undefined,\n  onClick,\n  testId = undefined,\n}: ElementInsertAfterButtonProps) => {\n  return (\n    <Button\n      className={cn(className)}\n      color=\"success\"\n      icon={<FaPlus />}\n      onClick={onClick}\n      size=\"sm\"\n      testId={testId}\n      variant=\"light\"\n    />\n  );\n};\n\nexport default ElementInsertAfterButton;\n","import type { ClassValue } from '@fuf-stack/pixel-utils';\n\nimport { FaTimes } from 'react-icons/fa';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\ninterface ElementRemoveButtonProps {\n  /** CSS class name */\n  className?: ClassValue;\n  /** click handler */\n  onClick: () => void;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\nconst ElementRemoveButton = ({\n  className = undefined,\n  onClick,\n  testId = undefined,\n}: ElementRemoveButtonProps) => {\n  return (\n    <Button\n      ariaLabel=\"remove element\"\n      className={cn(className)}\n      color=\"danger\"\n      icon={<FaTimes />}\n      onClick={onClick}\n      testId={testId}\n      variant=\"light\"\n    />\n  );\n};\n\nexport default ElementRemoveButton;\n","import type { ClassValue } from '@fuf-stack/pixel-utils';\n\nimport { FaGripVertical } from 'react-icons/fa';\n\nimport { useSortable } from '@dnd-kit/sortable';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\ninterface SortDragHandleProps {\n  /** Optional CSS class name */\n  className?: ClassValue;\n  /** Unique identifier for sortable item */\n  id: string | number;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * Drag handle component that integrates with dnd-kit sortable functionality.\n * Renders a vertical grip icon that can be used to reorder items.\n */\nconst SortDragHandle = ({\n  className = undefined,\n  id,\n  testId = undefined,\n}: SortDragHandleProps) => {\n  // Get dnd-kit sortable attributes and listeners\n  const { attributes, listeners } = useSortable({ id });\n\n  return (\n    <div\n      className={cn(className)}\n      data-testid={testId}\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...attributes}\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...listeners}\n    >\n      <FaGripVertical />\n    </div>\n  );\n};\n\nexport default SortDragHandle;\n","/* eslint-disable react/jsx-props-no-spreading */\n\nimport type { DragEndEvent } from '@dnd-kit/core';\nimport type { ReactNode } from 'react';\nimport type { UseFieldArrayMove } from 'react-hook-form';\n\nimport {\n  closestCenter,\n  DndContext,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core';\nimport {\n  restrictToVerticalAxis,\n  restrictToWindowEdges,\n} from '@dnd-kit/modifiers';\nimport {\n  SortableContext,\n  verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\n\ninterface SortContextProps {\n  /** child components */\n  children: ReactNode;\n  /** enable/disable sorting functionality */\n  sortable: boolean;\n  /** Array of objects containing unique IDs for sortable items */\n  fields: Record<'id', string>[];\n  /** react-hook-form's move function to update field array indices */\n  move: UseFieldArrayMove;\n}\n\n/**\n * A wrapper component that provides drag-and-drop sorting functionality for field arrays\n * using dnd-kit and react-hook-form.\n *\n * This component integrates with react-hook-form's field arrays to enable vertical\n * drag-and-drop reordering of form fields. It supports both pointer (mouse/touch)\n * and keyboard interactions for accessibility.\n */\nconst SortContext = ({\n  children,\n  sortable,\n  fields,\n  move,\n}: SortContextProps) => {\n  // Initialize sensors for both pointer (mouse/touch) and keyboard interactions\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor),\n  );\n\n  // Early return if sorting is disabled\n  if (!sortable) {\n    return children;\n  }\n\n  /**\n   * Handles the end of a drag operation by updating field positions\n   * @param event - The drag end event containing active and over elements\n   */\n  const handleDragEnd = (event: DragEndEvent) => {\n    const { active, over } = event;\n\n    // Only move if dropping over a different item\n    if (active.id !== over?.id) {\n      // Find the indices of the dragged item and drop target\n      const oldIndex = fields.findIndex((field) => field.id === active.id);\n      const newIndex = fields.findIndex((field) => field.id === over?.id);\n      // Update the field array order using react-hook-form's move function\n      move(oldIndex, newIndex);\n    }\n  };\n\n  return (\n    <DndContext\n      collisionDetection={closestCenter}\n      modifiers={[restrictToVerticalAxis, restrictToWindowEdges]}\n      onDragEnd={handleDragEnd}\n      sensors={sensors}\n    >\n      <SortableContext\n        items={fields.map((field) => field.id)}\n        strategy={verticalListSortingStrategy}\n      >\n        {children}\n      </SortableContext>\n    </DndContext>\n  );\n};\n\nexport default SortContext;\n","import FieldArray from './FieldArray';\n\nexport type * from './types';\n\nexport { FieldArray };\n\nexport default FieldArray;\n"]}

package/dist/{chunk-MU265R6G.js → chunk-NR5MV234.js}

@@ -1,14 +1,14 @@
-import {
-  FieldValidationError_default
-} from "./chunk-UTFZRBBS.js";
 import {
   FieldCopyTestIdButton_default
 } from "./chunk-BQGN3JTU.js";
+import {
+  FieldValidationError_default
+} from "./chunk-UTFZRBBS.js";
 import {
   useController,
   useFormContext,
   useInput
-} from "./chunk-6GHD5O3M.js";
+} from "./chunk-7QWLAPOT.js";
 import {
   __spreadProps,
   __spreadValues
@@ -95,4 +95,4 @@ export {
   Switch_default,
   Switch_default2
 };
-//# sourceMappingURL=chunk-MU265R6G.js.map
+//# sourceMappingURL=chunk-NR5MV234.js.map

package/dist/{chunk-DLSCFVU6.js → chunk-O7DOVGO2.js}

@@ -1,13 +1,13 @@
-import {
-  FieldValidationError_default
-} from "./chunk-UTFZRBBS.js";
 import {
   FieldCopyTestIdButton_default
 } from "./chunk-BQGN3JTU.js";
+import {
+  FieldValidationError_default
+} from "./chunk-UTFZRBBS.js";
 import {
   useController,
   useFormContext
-} from "./chunk-6GHD5O3M.js";
+} from "./chunk-7QWLAPOT.js";
 import {
   __spreadProps,
   __spreadValues
@@ -182,4 +182,4 @@ export {
   CheckboxGroup_default,
   CheckboxGroup_default2
 };
-//# sourceMappingURL=chunk-DLSCFVU6.js.map
+//# sourceMappingURL=chunk-O7DOVGO2.js.map