@fuf-stack/uniform 1.10.3 → 1.11.0

package/dist/useInputValueTransform-BID-CQ-y.d.cts

@@ -0,0 +1,107 @@
+//#region src/hooks/useInputValueTransform/useInputValueTransform.d.ts
+interface InputValueTransform<TDisplay = unknown> {
+  /** Transforms the form value to display value (e.g., 1000 → "$1,000" or 'a' → ['a']) */
+  toDisplayValue: (value: unknown) => TDisplay;
+  /** Transforms the display value to form value (e.g., "$1,000" → 1000 or ['a'] → 'a') */
+  toFormValue: (value: TDisplay) => unknown;
+}
+interface UseInputValueTransformOptions<TDisplay = unknown> {
+  /** Input type for special number handling */
+  type?: 'text' | 'number' | 'password';
+  /** Value transformation functions */
+  transform?: InputValueTransform<TDisplay>;
+}
+interface UseInputValueTransformReturn<TDisplay = unknown> {
+  /** Converts any form value to display value */
+  toDisplayValue: (formValue: unknown) => TDisplay;
+  /** Converts any display value to form value */
+  toFormValue: (displayValue: TDisplay) => unknown;
+}
+/**
+ * Custom hook providing utility functions for value transformations between display and form values.
+ *
+ * This hook provides pure conversion functions without any state management. It's useful for:
+ * - Currency formatting ($1,000 display vs 1000 stored)
+ * - Number inputs with special handling
+ * - Date formatting (MM/DD/YYYY display vs ISO date stored)
+ * - Phone number formatting ((555) 123-4567 display vs 5551234567 stored)
+ * - Array/Object transformations (single value ↔ array, nested structures)
+ *
+ * **Key Features:**
+ * - Pure conversion functions (no state)
+ * - Generic support for any data type (strings, numbers, arrays, objects)
+ * - Special number input handling (empty string preservation)
+ * - Bidirectional value transformations
+ * - Memoized functions for performance
+ *
+ * @param options Configuration for value transformation
+ * @returns Pure conversion utility functions
+ *
+ * @example
+ * ```tsx
+ * // Currency formatting
+ * const currencyTransform = {
+ *   toDisplayValue: (val) => val ? `$${Number(val).toLocaleString()}` : '',
+ *   toFormValue: (val) => parseFloat(val.replace(/[$,]/g, '')) || 0
+ * };
+ *
+ * const { toDisplayValue, toFormValue } = useInputValueTransform({
+ *   transform: currencyTransform
+ * });
+ *
+ * const displayVal = toDisplayValue(1000); // "$1,000"
+ * const formVal = toFormValue("$1,500"); // 1500
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Number input (no transforms needed)
+ * const { toDisplayValue, toFormValue } = useInputValueTransform({
+ *   type: 'number'
+ * });
+ *
+ * // Handles empty string → empty string (not NaN)
+ * // Handles "123" → 123 (string to number conversion)
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Array to single value (for single checkbox)
+ * const singleValueTransform = {
+ *   toDisplayValue: (val: string[]) => val?.[0] || '',
+ *   toFormValue: (val: string) => val ? [val] : []
+ * };
+ *
+ * const { toDisplayValue, toFormValue } = useInputValueTransform({
+ *   transform: singleValueTransform
+ * });
+ *
+ * const displayVal = toDisplayValue(['option1']); // "option1"
+ * const formVal = toFormValue("option2"); // ["option2"]
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Integration with debouncing
+ * const MyInput = ({ field, transform }) => {
+ *   const transform = useInputValueTransform({ transform });
+ *
+ *   const { onChange, onBlur, value } = useInputValueDebounce({
+ *     ...transform,
+ *     initialValue: field.value,
+ *     debounceDelay: 300,
+ *     onBlur: field.onBlur,
+ *     onChange: field.onChange,
+ *   });
+ *
+ *   return <input value={value} onChange={onChange} onBlur={onBlur} />;
+ * };
+ * ```
+ */
+declare const useInputValueTransform: <TDisplay = unknown>({
+  type,
+  transform
+}: UseInputValueTransformOptions<TDisplay>) => UseInputValueTransformReturn<TDisplay>;
+//#endregion
+export { useInputValueTransform as i, UseInputValueTransformOptions as n, UseInputValueTransformReturn as r, InputValueTransform as t };
+//# sourceMappingURL=useInputValueTransform-BID-CQ-y.d.cts.map

package/dist/useInputValueTransform-BID-CQ-y.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInputValueTransform-BID-CQ-y.d.cts","names":[],"sources":["../src/hooks/useInputValueTransform/useInputValueTransform.ts"],"sourcesContent":[],"mappings":";UAEiB;EAAA;EAOA,cAAA,EAAA,CAAA,KAAA,EAAA,OAAA,EAA6B,GALR,QAKQ;EAO7B;EAwFJ,WAAA,EAAA,CAAA,KAAA,EAlGU,QA0JtB,EAAA,GAAA,OAAA;;AAxD0D,UA/F1C,6BA+F0C,CAAA,WAAA,OAAA,CAAA,CAAA;EAG1B;EAA9B,IAAA,CAAA,EAAA,MAAA,GAAA,QAAA,GAAA,UAAA;EAAuE;EAA7B,SAAA,CAAA,EA9F/B,mBA8F+B,CA9FX,QA8FW,CAAA;;UA3F5B;;0CAEyB;;8BAEZ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAoFjB;;;GAGV,8BAA8B,cAAY,6BAA6B"}

package/dist/useInputValueTransform-C-uSW8Y3.cjs

@@ -0,0 +1,116 @@
+const require_FormContext = require('./FormContext-C3GymQOA.cjs');
+let react = require("react");
+
+//#region src/hooks/useInputValueTransform/useInputValueTransform.ts
+/**
+* Custom hook providing utility functions for value transformations between display and form values.
+*
+* This hook provides pure conversion functions without any state management. It's useful for:
+* - Currency formatting ($1,000 display vs 1000 stored)
+* - Number inputs with special handling
+* - Date formatting (MM/DD/YYYY display vs ISO date stored)
+* - Phone number formatting ((555) 123-4567 display vs 5551234567 stored)
+* - Array/Object transformations (single value ↔ array, nested structures)
+*
+* **Key Features:**
+* - Pure conversion functions (no state)
+* - Generic support for any data type (strings, numbers, arrays, objects)
+* - Special number input handling (empty string preservation)
+* - Bidirectional value transformations
+* - Memoized functions for performance
+*
+* @param options Configuration for value transformation
+* @returns Pure conversion utility functions
+*
+* @example
+* ```tsx
+* // Currency formatting
+* const currencyTransform = {
+*   toDisplayValue: (val) => val ? `$${Number(val).toLocaleString()}` : '',
+*   toFormValue: (val) => parseFloat(val.replace(/[$,]/g, '')) || 0
+* };
+*
+* const { toDisplayValue, toFormValue } = useInputValueTransform({
+*   transform: currencyTransform
+* });
+*
+* const displayVal = toDisplayValue(1000); // "$1,000"
+* const formVal = toFormValue("$1,500"); // 1500
+* ```
+*
+* @example
+* ```tsx
+* // Number input (no transforms needed)
+* const { toDisplayValue, toFormValue } = useInputValueTransform({
+*   type: 'number'
+* });
+*
+* // Handles empty string → empty string (not NaN)
+* // Handles "123" → 123 (string to number conversion)
+* ```
+*
+* @example
+* ```tsx
+* // Array to single value (for single checkbox)
+* const singleValueTransform = {
+*   toDisplayValue: (val: string[]) => val?.[0] || '',
+*   toFormValue: (val: string) => val ? [val] : []
+* };
+*
+* const { toDisplayValue, toFormValue } = useInputValueTransform({
+*   transform: singleValueTransform
+* });
+*
+* const displayVal = toDisplayValue(['option1']); // "option1"
+* const formVal = toFormValue("option2"); // ["option2"]
+* ```
+*
+* @example
+* ```tsx
+* // Integration with debouncing
+* const MyInput = ({ field, transform }) => {
+*   const transform = useInputValueTransform({ transform });
+*
+*   const { onChange, onBlur, value } = useInputValueDebounce({
+*     ...transform,
+*     initialValue: field.value,
+*     debounceDelay: 300,
+*     onBlur: field.onBlur,
+*     onChange: field.onChange,
+*   });
+*
+*   return <input value={value} onChange={onChange} onBlur={onBlur} />;
+* };
+* ```
+*/
+const useInputValueTransform = ({ type, transform }) => {
+	return {
+		toDisplayValue: (0, react.useCallback)((formValue) => {
+			if (transform?.toDisplayValue) return transform.toDisplayValue(formValue);
+			if (type === "number") {
+				if (formValue === "") return "";
+				const numValue = Number(formValue);
+				return Number.isNaN(numValue) ? formValue : numValue;
+			}
+			return formValue ?? "";
+		}, [type, transform]),
+		toFormValue: (0, react.useCallback)((displayValue) => {
+			if (transform?.toFormValue) return transform.toFormValue(displayValue);
+			if (type === "number") {
+				if (displayValue === "") return "";
+				const numValue = Number(displayValue);
+				return Number.isNaN(numValue) ? displayValue : numValue;
+			}
+			return displayValue;
+		}, [type, transform])
+	};
+};
+
+//#endregion
+Object.defineProperty(exports, 'useInputValueTransform', {
+  enumerable: true,
+  get: function () {
+    return useInputValueTransform;
+  }
+});
+//# sourceMappingURL=useInputValueTransform-C-uSW8Y3.cjs.map

package/dist/useInputValueTransform-C-uSW8Y3.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInputValueTransform-C-uSW8Y3.cjs","names":[],"sources":["../src/hooks/useInputValueTransform/useInputValueTransform.ts"],"sourcesContent":["import { useCallback } from 'react';\n\nexport interface InputValueTransform<TDisplay = unknown> {\n  /** Transforms the form value to display value (e.g., 1000 → \"$1,000\" or 'a' → ['a']) */\n  toDisplayValue: (value: unknown) => TDisplay;\n  /** Transforms the display value to form value (e.g., \"$1,000\" → 1000 or ['a'] → 'a') */\n  toFormValue: (value: TDisplay) => unknown;\n}\n\nexport interface UseInputValueTransformOptions<TDisplay = unknown> {\n  /** Input type for special number handling */\n  type?: 'text' | 'number' | 'password';\n  /** Value transformation functions */\n  transform?: InputValueTransform<TDisplay>;\n}\n\nexport interface UseInputValueTransformReturn<TDisplay = unknown> {\n  /** Converts any form value to display value */\n  toDisplayValue: (formValue: unknown) => TDisplay;\n  /** Converts any display value to form value */\n  toFormValue: (displayValue: TDisplay) => unknown;\n}\n\n/**\n * Custom hook providing utility functions for value transformations between display and form values.\n *\n * This hook provides pure conversion functions without any state management. It's useful for:\n * - Currency formatting ($1,000 display vs 1000 stored)\n * - Number inputs with special handling\n * - Date formatting (MM/DD/YYYY display vs ISO date stored)\n * - Phone number formatting ((555) 123-4567 display vs 5551234567 stored)\n * - Array/Object transformations (single value ↔ array, nested structures)\n *\n * **Key Features:**\n * - Pure conversion functions (no state)\n * - Generic support for any data type (strings, numbers, arrays, objects)\n * - Special number input handling (empty string preservation)\n * - Bidirectional value transformations\n * - Memoized functions for performance\n *\n * @param options Configuration for value transformation\n * @returns Pure conversion utility functions\n *\n * @example\n * ```tsx\n * // Currency formatting\n * const currencyTransform = {\n *   toDisplayValue: (val) => val ? `$${Number(val).toLocaleString()}` : '',\n *   toFormValue: (val) => parseFloat(val.replace(/[$,]/g, '')) || 0\n * };\n *\n * const { toDisplayValue, toFormValue } = useInputValueTransform({\n *   transform: currencyTransform\n * });\n *\n * const displayVal = toDisplayValue(1000); // \"$1,000\"\n * const formVal = toFormValue(\"$1,500\"); // 1500\n * ```\n *\n * @example\n * ```tsx\n * // Number input (no transforms needed)\n * const { toDisplayValue, toFormValue } = useInputValueTransform({\n *   type: 'number'\n * });\n *\n * // Handles empty string → empty string (not NaN)\n * // Handles \"123\" → 123 (string to number conversion)\n * ```\n *\n * @example\n * ```tsx\n * // Array to single value (for single checkbox)\n * const singleValueTransform = {\n *   toDisplayValue: (val: string[]) => val?.[0] || '',\n *   toFormValue: (val: string) => val ? [val] : []\n * };\n *\n * const { toDisplayValue, toFormValue } = useInputValueTransform({\n *   transform: singleValueTransform\n * });\n *\n * const displayVal = toDisplayValue(['option1']); // \"option1\"\n * const formVal = toFormValue(\"option2\"); // [\"option2\"]\n * ```\n *\n * @example\n * ```tsx\n * // Integration with debouncing\n * const MyInput = ({ field, transform }) => {\n *   const transform = useInputValueTransform({ transform });\n *\n *   const { onChange, onBlur, value } = useInputValueDebounce({\n *     ...transform,\n *     initialValue: field.value,\n *     debounceDelay: 300,\n *     onBlur: field.onBlur,\n *     onChange: field.onChange,\n *   });\n *\n *   return <input value={value} onChange={onChange} onBlur={onBlur} />;\n * };\n * ```\n */\nexport const useInputValueTransform = <TDisplay = unknown>({\n  type,\n  transform,\n}: UseInputValueTransformOptions<TDisplay>): UseInputValueTransformReturn<TDisplay> => {\n  /**\n   * Converts any form value to display value\n   */\n  const toDisplayValue = useCallback(\n    (formValue: unknown): TDisplay => {\n      if (transform?.toDisplayValue) {\n        return transform.toDisplayValue(formValue);\n      }\n\n      // For number type, convert valid strings to numbers for display\n      if (type === 'number') {\n        if (formValue === '') {\n          return '' as TDisplay;\n        }\n        const numValue = Number(formValue);\n        return (Number.isNaN(numValue) ? formValue : numValue) as TDisplay;\n      }\n\n      // Default: pass through (handles primitives, arrays, objects, etc.)\n      return (formValue ?? '') as TDisplay;\n    },\n    [type, transform],\n  );\n\n  /**\n   * Converts any display value to form value\n   */\n  const toFormValue = useCallback(\n    (displayValue: TDisplay): unknown => {\n      if (transform?.toFormValue) {\n        return transform.toFormValue(displayValue);\n      }\n\n      // For number type, convert strings to numbers\n      if (type === 'number') {\n        if (displayValue === '') {\n          return '';\n        }\n        const numValue = Number(displayValue);\n        return Number.isNaN(numValue) ? displayValue : numValue;\n      }\n\n      // Default: pass through (handles primitives, arrays, objects, etc.)\n      return displayValue;\n    },\n    [type, transform],\n  );\n\n  return {\n    toDisplayValue,\n    toFormValue,\n  };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwGA,MAAa,0BAA8C,EACzD,MACA,gBACqF;AAiDrF,QAAO;EACL,wCA7CC,cAAiC;AAChC,OAAI,WAAW,eACb,QAAO,UAAU,eAAe,UAAU;AAI5C,OAAI,SAAS,UAAU;AACrB,QAAI,cAAc,GAChB,QAAO;IAET,MAAM,WAAW,OAAO,UAAU;AAClC,WAAQ,OAAO,MAAM,SAAS,GAAG,YAAY;;AAI/C,UAAQ,aAAa;KAEvB,CAAC,MAAM,UAAU,CAClB;EA4BC,qCAtBC,iBAAoC;AACnC,OAAI,WAAW,YACb,QAAO,UAAU,YAAY,aAAa;AAI5C,OAAI,SAAS,UAAU;AACrB,QAAI,iBAAiB,GACnB,QAAO;IAET,MAAM,WAAW,OAAO,aAAa;AACrC,WAAO,OAAO,MAAM,SAAS,GAAG,eAAe;;AAIjD,UAAO;KAET,CAAC,MAAM,UAAU,CAClB;EAKA"}

package/dist/useInputValueTransform-D7LfyYRe.d.ts

@@ -0,0 +1,107 @@
+//#region src/hooks/useInputValueTransform/useInputValueTransform.d.ts
+interface InputValueTransform<TDisplay = unknown> {
+  /** Transforms the form value to display value (e.g., 1000 → "$1,000" or 'a' → ['a']) */
+  toDisplayValue: (value: unknown) => TDisplay;
+  /** Transforms the display value to form value (e.g., "$1,000" → 1000 or ['a'] → 'a') */
+  toFormValue: (value: TDisplay) => unknown;
+}
+interface UseInputValueTransformOptions<TDisplay = unknown> {
+  /** Input type for special number handling */
+  type?: 'text' | 'number' | 'password';
+  /** Value transformation functions */
+  transform?: InputValueTransform<TDisplay>;
+}
+interface UseInputValueTransformReturn<TDisplay = unknown> {
+  /** Converts any form value to display value */
+  toDisplayValue: (formValue: unknown) => TDisplay;
+  /** Converts any display value to form value */
+  toFormValue: (displayValue: TDisplay) => unknown;
+}
+/**
+ * Custom hook providing utility functions for value transformations between display and form values.
+ *
+ * This hook provides pure conversion functions without any state management. It's useful for:
+ * - Currency formatting ($1,000 display vs 1000 stored)
+ * - Number inputs with special handling
+ * - Date formatting (MM/DD/YYYY display vs ISO date stored)
+ * - Phone number formatting ((555) 123-4567 display vs 5551234567 stored)
+ * - Array/Object transformations (single value ↔ array, nested structures)
+ *
+ * **Key Features:**
+ * - Pure conversion functions (no state)
+ * - Generic support for any data type (strings, numbers, arrays, objects)
+ * - Special number input handling (empty string preservation)
+ * - Bidirectional value transformations
+ * - Memoized functions for performance
+ *
+ * @param options Configuration for value transformation
+ * @returns Pure conversion utility functions
+ *
+ * @example
+ * ```tsx
+ * // Currency formatting
+ * const currencyTransform = {
+ *   toDisplayValue: (val) => val ? `$${Number(val).toLocaleString()}` : '',
+ *   toFormValue: (val) => parseFloat(val.replace(/[$,]/g, '')) || 0
+ * };
+ *
+ * const { toDisplayValue, toFormValue } = useInputValueTransform({
+ *   transform: currencyTransform
+ * });
+ *
+ * const displayVal = toDisplayValue(1000); // "$1,000"
+ * const formVal = toFormValue("$1,500"); // 1500
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Number input (no transforms needed)
+ * const { toDisplayValue, toFormValue } = useInputValueTransform({
+ *   type: 'number'
+ * });
+ *
+ * // Handles empty string → empty string (not NaN)
+ * // Handles "123" → 123 (string to number conversion)
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Array to single value (for single checkbox)
+ * const singleValueTransform = {
+ *   toDisplayValue: (val: string[]) => val?.[0] || '',
+ *   toFormValue: (val: string) => val ? [val] : []
+ * };
+ *
+ * const { toDisplayValue, toFormValue } = useInputValueTransform({
+ *   transform: singleValueTransform
+ * });
+ *
+ * const displayVal = toDisplayValue(['option1']); // "option1"
+ * const formVal = toFormValue("option2"); // ["option2"]
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Integration with debouncing
+ * const MyInput = ({ field, transform }) => {
+ *   const transform = useInputValueTransform({ transform });
+ *
+ *   const { onChange, onBlur, value } = useInputValueDebounce({
+ *     ...transform,
+ *     initialValue: field.value,
+ *     debounceDelay: 300,
+ *     onBlur: field.onBlur,
+ *     onChange: field.onChange,
+ *   });
+ *
+ *   return <input value={value} onChange={onChange} onBlur={onBlur} />;
+ * };
+ * ```
+ */
+declare const useInputValueTransform: <TDisplay = unknown>({
+  type,
+  transform
+}: UseInputValueTransformOptions<TDisplay>) => UseInputValueTransformReturn<TDisplay>;
+//#endregion
+export { useInputValueTransform as i, UseInputValueTransformOptions as n, UseInputValueTransformReturn as r, InputValueTransform as t };
+//# sourceMappingURL=useInputValueTransform-D7LfyYRe.d.ts.map

package/dist/useInputValueTransform-D7LfyYRe.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInputValueTransform-D7LfyYRe.d.ts","names":[],"sources":["../src/hooks/useInputValueTransform/useInputValueTransform.ts"],"sourcesContent":[],"mappings":";UAEiB;EAAA;EAOA,cAAA,EAAA,CAAA,KAAA,EAAA,OAAA,EAA6B,GALR,QAKQ;EAO7B;EAwFJ,WAAA,EAAA,CAAA,KAAA,EAlGU,QA0JtB,EAAA,GAAA,OAAA;;AAxD0D,UA/F1C,6BA+F0C,CAAA,WAAA,OAAA,CAAA,CAAA;EAG1B;EAA9B,IAAA,CAAA,EAAA,MAAA,GAAA,QAAA,GAAA,UAAA;EAAuE;EAA7B,SAAA,CAAA,EA9F/B,mBA8F+B,CA9FX,QA8FW,CAAA;;UA3F5B;;0CAEyB;;8BAEZ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAoFjB;;;GAGV,8BAA8B,cAAY,6BAA6B"}

package/dist/useInputValueTransform-aiIf8lq5.js

@@ -0,0 +1,110 @@
+import { useCallback } from "react";
+
+//#region src/hooks/useInputValueTransform/useInputValueTransform.ts
+/**
+* Custom hook providing utility functions for value transformations between display and form values.
+*
+* This hook provides pure conversion functions without any state management. It's useful for:
+* - Currency formatting ($1,000 display vs 1000 stored)
+* - Number inputs with special handling
+* - Date formatting (MM/DD/YYYY display vs ISO date stored)
+* - Phone number formatting ((555) 123-4567 display vs 5551234567 stored)
+* - Array/Object transformations (single value ↔ array, nested structures)
+*
+* **Key Features:**
+* - Pure conversion functions (no state)
+* - Generic support for any data type (strings, numbers, arrays, objects)
+* - Special number input handling (empty string preservation)
+* - Bidirectional value transformations
+* - Memoized functions for performance
+*
+* @param options Configuration for value transformation
+* @returns Pure conversion utility functions
+*
+* @example
+* ```tsx
+* // Currency formatting
+* const currencyTransform = {
+*   toDisplayValue: (val) => val ? `$${Number(val).toLocaleString()}` : '',
+*   toFormValue: (val) => parseFloat(val.replace(/[$,]/g, '')) || 0
+* };
+*
+* const { toDisplayValue, toFormValue } = useInputValueTransform({
+*   transform: currencyTransform
+* });
+*
+* const displayVal = toDisplayValue(1000); // "$1,000"
+* const formVal = toFormValue("$1,500"); // 1500
+* ```
+*
+* @example
+* ```tsx
+* // Number input (no transforms needed)
+* const { toDisplayValue, toFormValue } = useInputValueTransform({
+*   type: 'number'
+* });
+*
+* // Handles empty string → empty string (not NaN)
+* // Handles "123" → 123 (string to number conversion)
+* ```
+*
+* @example
+* ```tsx
+* // Array to single value (for single checkbox)
+* const singleValueTransform = {
+*   toDisplayValue: (val: string[]) => val?.[0] || '',
+*   toFormValue: (val: string) => val ? [val] : []
+* };
+*
+* const { toDisplayValue, toFormValue } = useInputValueTransform({
+*   transform: singleValueTransform
+* });
+*
+* const displayVal = toDisplayValue(['option1']); // "option1"
+* const formVal = toFormValue("option2"); // ["option2"]
+* ```
+*
+* @example
+* ```tsx
+* // Integration with debouncing
+* const MyInput = ({ field, transform }) => {
+*   const transform = useInputValueTransform({ transform });
+*
+*   const { onChange, onBlur, value } = useInputValueDebounce({
+*     ...transform,
+*     initialValue: field.value,
+*     debounceDelay: 300,
+*     onBlur: field.onBlur,
+*     onChange: field.onChange,
+*   });
+*
+*   return <input value={value} onChange={onChange} onBlur={onBlur} />;
+* };
+* ```
+*/
+const useInputValueTransform = ({ type, transform }) => {
+	return {
+		toDisplayValue: useCallback((formValue) => {
+			if (transform?.toDisplayValue) return transform.toDisplayValue(formValue);
+			if (type === "number") {
+				if (formValue === "") return "";
+				const numValue = Number(formValue);
+				return Number.isNaN(numValue) ? formValue : numValue;
+			}
+			return formValue ?? "";
+		}, [type, transform]),
+		toFormValue: useCallback((displayValue) => {
+			if (transform?.toFormValue) return transform.toFormValue(displayValue);
+			if (type === "number") {
+				if (displayValue === "") return "";
+				const numValue = Number(displayValue);
+				return Number.isNaN(numValue) ? displayValue : numValue;
+			}
+			return displayValue;
+		}, [type, transform])
+	};
+};
+
+//#endregion
+export { useInputValueTransform as t };
+//# sourceMappingURL=useInputValueTransform-aiIf8lq5.js.map

package/dist/useInputValueTransform-aiIf8lq5.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInputValueTransform-aiIf8lq5.js","names":[],"sources":["../src/hooks/useInputValueTransform/useInputValueTransform.ts"],"sourcesContent":["import { useCallback } from 'react';\n\nexport interface InputValueTransform<TDisplay = unknown> {\n  /** Transforms the form value to display value (e.g., 1000 → \"$1,000\" or 'a' → ['a']) */\n  toDisplayValue: (value: unknown) => TDisplay;\n  /** Transforms the display value to form value (e.g., \"$1,000\" → 1000 or ['a'] → 'a') */\n  toFormValue: (value: TDisplay) => unknown;\n}\n\nexport interface UseInputValueTransformOptions<TDisplay = unknown> {\n  /** Input type for special number handling */\n  type?: 'text' | 'number' | 'password';\n  /** Value transformation functions */\n  transform?: InputValueTransform<TDisplay>;\n}\n\nexport interface UseInputValueTransformReturn<TDisplay = unknown> {\n  /** Converts any form value to display value */\n  toDisplayValue: (formValue: unknown) => TDisplay;\n  /** Converts any display value to form value */\n  toFormValue: (displayValue: TDisplay) => unknown;\n}\n\n/**\n * Custom hook providing utility functions for value transformations between display and form values.\n *\n * This hook provides pure conversion functions without any state management. It's useful for:\n * - Currency formatting ($1,000 display vs 1000 stored)\n * - Number inputs with special handling\n * - Date formatting (MM/DD/YYYY display vs ISO date stored)\n * - Phone number formatting ((555) 123-4567 display vs 5551234567 stored)\n * - Array/Object transformations (single value ↔ array, nested structures)\n *\n * **Key Features:**\n * - Pure conversion functions (no state)\n * - Generic support for any data type (strings, numbers, arrays, objects)\n * - Special number input handling (empty string preservation)\n * - Bidirectional value transformations\n * - Memoized functions for performance\n *\n * @param options Configuration for value transformation\n * @returns Pure conversion utility functions\n *\n * @example\n * ```tsx\n * // Currency formatting\n * const currencyTransform = {\n *   toDisplayValue: (val) => val ? `$${Number(val).toLocaleString()}` : '',\n *   toFormValue: (val) => parseFloat(val.replace(/[$,]/g, '')) || 0\n * };\n *\n * const { toDisplayValue, toFormValue } = useInputValueTransform({\n *   transform: currencyTransform\n * });\n *\n * const displayVal = toDisplayValue(1000); // \"$1,000\"\n * const formVal = toFormValue(\"$1,500\"); // 1500\n * ```\n *\n * @example\n * ```tsx\n * // Number input (no transforms needed)\n * const { toDisplayValue, toFormValue } = useInputValueTransform({\n *   type: 'number'\n * });\n *\n * // Handles empty string → empty string (not NaN)\n * // Handles \"123\" → 123 (string to number conversion)\n * ```\n *\n * @example\n * ```tsx\n * // Array to single value (for single checkbox)\n * const singleValueTransform = {\n *   toDisplayValue: (val: string[]) => val?.[0] || '',\n *   toFormValue: (val: string) => val ? [val] : []\n * };\n *\n * const { toDisplayValue, toFormValue } = useInputValueTransform({\n *   transform: singleValueTransform\n * });\n *\n * const displayVal = toDisplayValue(['option1']); // \"option1\"\n * const formVal = toFormValue(\"option2\"); // [\"option2\"]\n * ```\n *\n * @example\n * ```tsx\n * // Integration with debouncing\n * const MyInput = ({ field, transform }) => {\n *   const transform = useInputValueTransform({ transform });\n *\n *   const { onChange, onBlur, value } = useInputValueDebounce({\n *     ...transform,\n *     initialValue: field.value,\n *     debounceDelay: 300,\n *     onBlur: field.onBlur,\n *     onChange: field.onChange,\n *   });\n *\n *   return <input value={value} onChange={onChange} onBlur={onBlur} />;\n * };\n * ```\n */\nexport const useInputValueTransform = <TDisplay = unknown>({\n  type,\n  transform,\n}: UseInputValueTransformOptions<TDisplay>): UseInputValueTransformReturn<TDisplay> => {\n  /**\n   * Converts any form value to display value\n   */\n  const toDisplayValue = useCallback(\n    (formValue: unknown): TDisplay => {\n      if (transform?.toDisplayValue) {\n        return transform.toDisplayValue(formValue);\n      }\n\n      // For number type, convert valid strings to numbers for display\n      if (type === 'number') {\n        if (formValue === '') {\n          return '' as TDisplay;\n        }\n        const numValue = Number(formValue);\n        return (Number.isNaN(numValue) ? formValue : numValue) as TDisplay;\n      }\n\n      // Default: pass through (handles primitives, arrays, objects, etc.)\n      return (formValue ?? '') as TDisplay;\n    },\n    [type, transform],\n  );\n\n  /**\n   * Converts any display value to form value\n   */\n  const toFormValue = useCallback(\n    (displayValue: TDisplay): unknown => {\n      if (transform?.toFormValue) {\n        return transform.toFormValue(displayValue);\n      }\n\n      // For number type, convert strings to numbers\n      if (type === 'number') {\n        if (displayValue === '') {\n          return '';\n        }\n        const numValue = Number(displayValue);\n        return Number.isNaN(numValue) ? displayValue : numValue;\n      }\n\n      // Default: pass through (handles primitives, arrays, objects, etc.)\n      return displayValue;\n    },\n    [type, transform],\n  );\n\n  return {\n    toDisplayValue,\n    toFormValue,\n  };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwGA,MAAa,0BAA8C,EACzD,MACA,gBACqF;AAiDrF,QAAO;EACL,gBA9CqB,aACpB,cAAiC;AAChC,OAAI,WAAW,eACb,QAAO,UAAU,eAAe,UAAU;AAI5C,OAAI,SAAS,UAAU;AACrB,QAAI,cAAc,GAChB,QAAO;IAET,MAAM,WAAW,OAAO,UAAU;AAClC,WAAQ,OAAO,MAAM,SAAS,GAAG,YAAY;;AAI/C,UAAQ,aAAa;KAEvB,CAAC,MAAM,UAAU,CAClB;EA4BC,aAvBkB,aACjB,iBAAoC;AACnC,OAAI,WAAW,YACb,QAAO,UAAU,YAAY,aAAa;AAI5C,OAAI,SAAS,UAAU;AACrB,QAAI,iBAAiB,GACnB,QAAO;IAET,MAAM,WAAW,OAAO,aAAa;AACrC,WAAO,OAAO,MAAM,SAAS,GAAG,eAAe;;AAIjD,UAAO;KAET,CAAC,MAAM,UAAU,CAClB;EAKA"}

package/dist/useUniformField-BMvnRC_r.cjs

@@ -0,0 +1,136 @@
+const require_FormContext = require('./FormContext-C3GymQOA.cjs');
+const require_FieldCopyTestIdButton = require('./FieldCopyTestIdButton-AaLwu_8y.cjs');
+const require_FieldValidationError = require('./FieldValidationError-Cq6aI0tE.cjs');
+const require_useController = require('./useController-BzkCcbSo.cjs');
+const require_useFormContext = require('./useFormContext-CWuN-_7P.cjs');
+const require_useInputValueTransform = require('./useInputValueTransform-C-uSW8Y3.cjs');
+let __fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
+let react = require("react");
+react = require_FormContext.__toESM(react);
+let __fuf_stack_pixels = require("@fuf-stack/pixels");
+let react_jsx_runtime = require("react/jsx-runtime");
+let __heroui_input = require("@heroui/input");
+
+//#region src/hooks/useUniformField/useUniformField.tsx
+/**
+* Debounce invalid state changes to prevent UI flicker on rapid changes.
+*
+* Primary purpose: Reduce UI flicker when validation state changes rapidly
+* (e.g., during fast typing). Without debouncing, error messages would flash
+* in/out rapidly, creating a poor UX.
+*
+* Secondary benefit: When animations are enabled (default), gives time for
+* enter/exit animations to complete smoothly.
+*
+* Behavior:
+* - Debounces both true → false and false → true transitions by `delayMs`
+* - Disabled in test environments for immediate snapshots
+*/
+const useDebouncedInvalid = (invalid, delayMs) => {
+	const debouncedInvalid = (0, __fuf_stack_pixels.useDebounce)(invalid, delayMs);
+	if ((0, __fuf_stack_pixel_utils.isTestEnvironment)()) return invalid;
+	return debouncedInvalid;
+};
+/**
+* Combines frequently used form field logic into a single hook.
+*
+* Provides:
+* - Enhanced form context (validation-aware state, `testId`, value transforms)
+* - Controller field with nullish conversion handling
+* - Value transformation via `transform` prop:
+*   • Allows disentangled display and form values (e.g., string ↔ object, boolean ↔ array)
+*   • Automatically applies `toDisplayValue` to field value for components
+*   • Automatically applies `toFormValue` to display value when onChange is called
+*   • Works with `type` prop for automatic number/string conversion
+*   • Examples: storing objects while displaying strings, storing booleans as arrays, enriching values with metadata
+* - Debounced `invalid` state with smart timing:
+*   • `true` (field becomes invalid): applies immediately so errors show right away
+*   • `false` (field becomes valid): delayed 200ms to allow smooth exit animations
+*   • Respects `prefers-reduced-motion` by skipping delays when user prefers reduced motion
+* - Smart `invalid` visibility (via `showInvalid`):
+*   • Shows errors when field is dirty OR touched OR form has been submitted
+*   • Prevents showing errors on pristine/untouched fields for better UX
+*   • Works well for all field types (text inputs, checkboxes, radios, arrays)
+* - Prebuilt `errorMessage` React node using `FieldValidationError`
+* - Computed `label` node which appends a `FieldCopyTestIdButton` in
+*   `debug-testids` mode
+* - `defaultValue` for uncontrolled defaults and all usual field handlers
+* - Access to form utilities: `control`, `getValues`, `resetField`
+* - Presentation helpers: `getLabelProps`, `getErrorMessageProps`,
+*   `getHelperWrapperProps` for consistent wiring to underlying UI components
+*/
+const useUniformField = (params) => {
+	const { name, ariaLabel: customAriaLabel, disabled = false, testId: explicitTestId, label, type, transform } = params;
+	const { control, debugMode, formState: { submitCount }, getFieldState, getValues, resetField } = require_useFormContext.useFormContext();
+	const { error, invalid: rawInvalid, isDirty, isTouched, required, testId } = getFieldState(name, explicitTestId);
+	const { field } = require_useController.useController({
+		control,
+		disabled,
+		name
+	});
+	const { onChange: fieldOnChange, value: fieldValue, disabled: isDisabled, onBlur, ref } = field;
+	const { toDisplayValue, toFormValue } = require_useInputValueTransform.useInputValueTransform({
+		type,
+		transform
+	});
+	const transformedValue = toDisplayValue(fieldValue);
+	const transformedOnChange = (eventOrValue) => {
+		fieldOnChange(toFormValue(eventOrValue?.target?.value ?? eventOrValue));
+	};
+	const defaultValue = getValues()?.[name];
+	const invalid = useDebouncedInvalid(rawInvalid && (isDirty || isTouched || submitCount > 0), 200);
+	const showTestIdCopyButton = debugMode === "debug-testids";
+	const labelNode = !!label || showTestIdCopyButton ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [label !== false ? label : null, showTestIdCopyButton ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FieldCopyTestIdButton.FieldCopyTestIdButton_default$1, { testId }) : null] }) : null;
+	const errorMessage = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FieldValidationError.FieldValidationError_default$1, {
+		error,
+		testId
+	});
+	const { getErrorMessageProps, getLabelProps, getHelperWrapperProps } = (0, __heroui_input.useInput)({
+		ref,
+		classNames: { helperWrapper: "p-0" },
+		errorMessage: JSON.stringify(error),
+		isInvalid: invalid,
+		isRequired: required,
+		label,
+		labelPlacement: "outside"
+	});
+	return {
+		ariaLabel: customAriaLabel ?? (typeof label === "string" ? label : name),
+		control,
+		debugMode,
+		defaultValue,
+		disabled: isDisabled,
+		error,
+		errorMessage,
+		field: {
+			...field,
+			value: transformedValue,
+			onChange: transformedOnChange
+		},
+		getErrorMessageProps,
+		getHelperWrapperProps,
+		getLabelProps,
+		getValues,
+		invalid,
+		label: labelNode,
+		onBlur,
+		onChange: transformedOnChange,
+		ref,
+		required,
+		resetField,
+		testId
+	};
+};
+
+//#endregion
+//#region src/hooks/useUniformField/index.ts
+/* v8 ignore stop */
+
+//#endregion
+Object.defineProperty(exports, 'useUniformField', {
+  enumerable: true,
+  get: function () {
+    return useUniformField;
+  }
+});
+//# sourceMappingURL=useUniformField-BMvnRC_r.cjs.map

package/dist/useUniformField-BMvnRC_r.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUniformField-BMvnRC_r.cjs","names":["useFormContext","useController","useInputValueTransform","labelNode: ReactNode | null","FieldCopyTestIdButton","FieldValidationError"],"sources":["../src/hooks/useUniformField/useUniformField.tsx","../src/hooks/useUniformField/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { FieldError, FieldValues, Path } from 'react-hook-form';\nimport type { InputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\nimport React from 'react';\n\nimport { isTestEnvironment } from '@fuf-stack/pixel-utils';\nimport { useDebounce } from '@fuf-stack/pixels';\n\nimport { FieldCopyTestIdButton } from '../../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../../partials/FieldValidationError';\nimport { useController } from '../useController/useController';\nimport { useFormContext } from '../useFormContext/useFormContext';\nimport { useInput } from '../useInput/useInput';\nimport { useInputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\n/**\n * Debounce invalid state changes to prevent UI flicker on rapid changes.\n *\n * Primary purpose: Reduce UI flicker when validation state changes rapidly\n * (e.g., during fast typing). Without debouncing, error messages would flash\n * in/out rapidly, creating a poor UX.\n *\n * Secondary benefit: When animations are enabled (default), gives time for\n * enter/exit animations to complete smoothly.\n *\n * Behavior:\n * - Debounces both true → false and false → true transitions by `delayMs`\n * - Disabled in test environments for immediate snapshots\n */\nconst useDebouncedInvalid = (invalid: boolean, delayMs: number) => {\n  const debouncedInvalid = useDebounce(invalid, delayMs);\n\n  // Disable debouncing in test environments for immediate snapshots\n  if (isTestEnvironment()) {\n    return invalid;\n  }\n\n  return debouncedInvalid;\n};\n\nexport interface UseUniformFieldParams<\n  TFieldValues extends FieldValues = FieldValues,\n  TDisplay = unknown,\n> {\n  /** Form field name */\n  name: Path<TFieldValues> & string;\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** Disable the field */\n  disabled?: boolean;\n  /** Optional label content */\n  label?: ReactNode;\n  /** Optional explicit test id used to build stable test ids */\n  testId?: string;\n  /** Optional value transformation between form and display values */\n  transform?: InputValueTransform<TDisplay>;\n  /** Input type for special number handling */\n  type?: 'text' | 'number' | 'password';\n}\n\nexport interface UseUniformFieldReturn<\n  TFieldValues extends FieldValues = FieldValues,\n> {\n  /** Computed aria-label fallback (field name) when no visible label exists. Components can override based on their accessibility needs (e.g., if placeholder provides sufficient context) */\n  ariaLabel: string | undefined;\n  /** react-hook-form control instance for advanced integrations */\n  control: ReturnType<typeof useFormContext<TFieldValues>>['control'];\n  /** Debug mode from Uniform provider */\n  debugMode: ReturnType<typeof useFormContext<TFieldValues>>['debugMode'];\n  /** Current value used to initialize uncontrolled components */\n  defaultValue: unknown;\n  /** Whether the field is currently disabled (from RHF) */\n  disabled: boolean | undefined;\n  /** Validation error(s) for the field */\n  error: FieldError[] | undefined;\n  /** Pre-built errorMessage node to plug into components */\n  errorMessage: ReactNode | null;\n  /** RHF controller field with transformed value/onChange (use this for simple components) */\n  field: ReturnType<typeof useController<TFieldValues>>['field'];\n  /** Helper to spread standardized error message props to underlying components */\n  getErrorMessageProps: ReturnType<typeof useInput>['getErrorMessageProps'];\n  /** Helper to spread standardized helper wrapper props (for spacing/animation) */\n  getHelperWrapperProps: ReturnType<typeof useInput>['getHelperWrapperProps'];\n  /** Helper to spread standardized label props to underlying components */\n  getLabelProps: ReturnType<typeof useInput>['getLabelProps'];\n  /** Access current form values (converted to validation-friendly format) */\n  getValues: ReturnType<typeof useFormContext<TFieldValues>>['getValues'];\n  /** Whether the field should show invalid state (debounced for smooth animations). True when field is invalid AND (dirty OR touched OR submitted) */\n  invalid: boolean;\n  /** Computed label node including optional test id copy button */\n  label: ReactNode | null;\n  /** onBlur handler from controller */\n  onBlur: ReturnType<typeof useController<TFieldValues>>['field']['onBlur'];\n  /** onChange handler from controller (with transform applied) */\n  onChange: ReturnType<typeof useController<TFieldValues>>['field']['onChange'];\n  /** Ref to forward to underlying control */\n  ref: ReturnType<typeof useController<TFieldValues>>['field']['ref'];\n  /** Whether the field is required according to validation schema */\n  required: boolean;\n  /** Reset a specific field in the form */\n  resetField: ReturnType<typeof useFormContext<TFieldValues>>['resetField'];\n  /** Generated HTML data-testid for the field */\n  testId: string;\n}\n\n/**\n * Combines frequently used form field logic into a single hook.\n *\n * Provides:\n * - Enhanced form context (validation-aware state, `testId`, value transforms)\n * - Controller field with nullish conversion handling\n * - Value transformation via `transform` prop:\n *   • Allows disentangled display and form values (e.g., string ↔ object, boolean ↔ array)\n *   • Automatically applies `toDisplayValue` to field value for components\n *   • Automatically applies `toFormValue` to display value when onChange is called\n *   • Works with `type` prop for automatic number/string conversion\n *   • Examples: storing objects while displaying strings, storing booleans as arrays, enriching values with metadata\n * - Debounced `invalid` state with smart timing:\n *   • `true` (field becomes invalid): applies immediately so errors show right away\n *   • `false` (field becomes valid): delayed 200ms to allow smooth exit animations\n *   • Respects `prefers-reduced-motion` by skipping delays when user prefers reduced motion\n * - Smart `invalid` visibility (via `showInvalid`):\n *   • Shows errors when field is dirty OR touched OR form has been submitted\n *   • Prevents showing errors on pristine/untouched fields for better UX\n *   • Works well for all field types (text inputs, checkboxes, radios, arrays)\n * - Prebuilt `errorMessage` React node using `FieldValidationError`\n * - Computed `label` node which appends a `FieldCopyTestIdButton` in\n *   `debug-testids` mode\n * - `defaultValue` for uncontrolled defaults and all usual field handlers\n * - Access to form utilities: `control`, `getValues`, `resetField`\n * - Presentation helpers: `getLabelProps`, `getErrorMessageProps`,\n *   `getHelperWrapperProps` for consistent wiring to underlying UI components\n */\nexport const useUniformField = <\n  TFieldValues extends FieldValues = FieldValues,\n  TDisplay = unknown,\n>(\n  params: UseUniformFieldParams<TFieldValues, TDisplay>,\n): UseUniformFieldReturn<TFieldValues> => {\n  const {\n    name,\n    ariaLabel: customAriaLabel,\n    disabled = false,\n    testId: explicitTestId,\n    label,\n    type,\n    transform,\n  } = params;\n\n  const {\n    control,\n    debugMode,\n    formState: { submitCount },\n    getFieldState,\n    getValues,\n    resetField,\n  } = useFormContext<TFieldValues>();\n\n  const {\n    error,\n    invalid: rawInvalid,\n    isDirty,\n    isTouched,\n    required,\n    testId,\n  } = getFieldState(name, explicitTestId);\n\n  const { field } = useController<TFieldValues>({\n    control,\n    disabled,\n    name,\n  });\n  const {\n    onChange: fieldOnChange,\n    value: fieldValue,\n    disabled: isDisabled,\n    onBlur,\n    ref,\n  } = field;\n\n  // Get transform utilities (but don't apply them automatically)\n  // Components can choose how to use them (directly or via useInputValueDebounce)\n  const { toDisplayValue, toFormValue } = useInputValueTransform<TDisplay>({\n    type,\n    transform,\n  });\n\n  // For components without special needs: apply transform to value and onChange\n  const transformedValue = toDisplayValue(fieldValue);\n  const transformedOnChange = (eventOrValue: TDisplay | React.ChangeEvent) => {\n    // Extract value from event or use value directly\n    const displayValue =\n      (eventOrValue as React.ChangeEvent<HTMLInputElement>)?.target?.value ??\n      eventOrValue;\n    const formValue = toFormValue(displayValue as TDisplay);\n    fieldOnChange(formValue as typeof fieldValue);\n  };\n\n  const defaultValue = (getValues() as Record<string, unknown>)?.[\n    name as string\n  ];\n\n  /**\n   * Determine when to show the invalid state to the user.\n   *\n   * Show errors when the field is invalid AND any of these conditions are met:\n   *   - Field is dirty (value changed from initial) - good for checkboxes/radios/arrays\n   *   - Field is touched (focused and blurred) - good for text inputs\n   *   - Form has been submitted - shows all errors after submit attempt\n   *\n   * This prevents showing errors on pristine/untouched fields for better UX.\n   * Examples:\n   *   - Text input: User loads form with empty required field → no error shown yet\n   *   - Text input: User focuses and blurs → error shows (via isTouched)\n   *   - Checkbox group: User clicks first checkbox → error shows immediately (via isDirty)\n   *   - Any field: User submits form → all errors show (via submitCount)\n   *\n   * The entire condition is debounced to prevent flickering and allow smooth animations\n   * when any of the states (invalid, isDirty, isTouched, submitCount) change.\n   */\n  const showInvalid = rawInvalid && (isDirty || isTouched || submitCount > 0);\n  const invalid = useDebouncedInvalid(showInvalid, 200);\n\n  // Build a label node that:\n  // - shows the provided label (unless explicitly set to false)\n  // - appends a copy-to-clipboard button for the test id in `debug-testids` mode\n  // Consumers can pass this directly to component `label` props\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const labelNode: ReactNode | null =\n    !!label || showTestIdCopyButton ? (\n      <>\n        {label !== false ? label : null}\n        {showTestIdCopyButton ? (\n          <FieldCopyTestIdButton testId={testId} />\n        ) : null}\n      </>\n    ) : null;\n\n  // Ready-to-render error message; consumers can drop this into their\n  // component `errorMessage` prop without repeating mapping/markup\n  const errorMessage = <FieldValidationError error={error} testId={testId} />;\n\n  // Generate standardized props for label, helper wrapper and error message\n  // so consumers can spread them directly into UI components (e.g. HeroUI),\n  // keeping animations/spacing consistent across fields\n  const { getErrorMessageProps, getLabelProps, getHelperWrapperProps } =\n    useInput({\n      ref,\n      classNames: {\n        // set padding to 0 for error message exit animation\n        helperWrapper: 'p-0',\n      },\n      errorMessage: JSON.stringify(error),\n      isInvalid: invalid,\n      isRequired: required,\n      label,\n      labelPlacement: 'outside',\n    });\n\n  // Compute aria-label: prefer custom prop, then use string label if available, otherwise field name\n  // Components can further override this based on their specific accessibility needs\n  // (e.g., Input/TextArea may skip this if they have a meaningful placeholder)\n  const ariaLabel =\n    customAriaLabel ?? (typeof label === 'string' ? label : name);\n\n  return {\n    ariaLabel,\n    control,\n    debugMode,\n    defaultValue,\n    disabled: isDisabled,\n    error,\n    errorMessage,\n    field: {\n      ...field,\n      value: transformedValue as typeof field.value,\n      onChange: transformedOnChange as typeof field.onChange,\n    },\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    getLabelProps,\n    getValues,\n    invalid,\n    label: labelNode,\n    onBlur,\n    onChange: transformedOnChange as typeof field.onChange,\n    ref,\n    required,\n    resetField,\n    testId,\n  };\n};\n","/* v8 ignore start */\n\nexport * from './useUniformField';\n\n/* v8 ignore stop */\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAM,uBAAuB,SAAkB,YAAoB;CACjE,MAAM,uDAA+B,SAAS,QAAQ;AAGtD,qDAAuB,CACrB,QAAO;AAGT,QAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgGT,MAAa,mBAIX,WACwC;CACxC,MAAM,EACJ,MACA,WAAW,iBACX,WAAW,OACX,QAAQ,gBACR,OACA,MACA,cACE;CAEJ,MAAM,EACJ,SACA,WACA,WAAW,EAAE,eACb,eACA,WACA,eACEA,uCAA8B;CAElC,MAAM,EACJ,OACA,SAAS,YACT,SACA,WACA,UACA,WACE,cAAc,MAAM,eAAe;CAEvC,MAAM,EAAE,UAAUC,oCAA4B;EAC5C;EACA;EACA;EACD,CAAC;CACF,MAAM,EACJ,UAAU,eACV,OAAO,YACP,UAAU,YACV,QACA,QACE;CAIJ,MAAM,EAAE,gBAAgB,gBAAgBC,sDAAiC;EACvE;EACA;EACD,CAAC;CAGF,MAAM,mBAAmB,eAAe,WAAW;CACnD,MAAM,uBAAuB,iBAA+C;AAM1E,gBADkB,YAFf,cAAsD,QAAQ,SAC/D,aACqD,CACV;;CAG/C,MAAM,eAAgB,WAAW,GAC/B;CAsBF,MAAM,UAAU,oBADI,eAAe,WAAW,aAAa,cAAc,IACxB,IAAI;CAMrD,MAAM,uBAAuB,cAAc;CAC3C,MAAMC,YACJ,CAAC,CAAC,SAAS,uBACT,qFACG,UAAU,QAAQ,QAAQ,MAC1B,uBACC,2CAACC,iEAA8B,SAAU,GACvC,QACH,GACD;CAIN,MAAM,eAAe,2CAACC;EAA4B;EAAe;GAAU;CAK3E,MAAM,EAAE,sBAAsB,eAAe,uDAClC;EACP;EACA,YAAY,EAEV,eAAe,OAChB;EACD,cAAc,KAAK,UAAU,MAAM;EACnC,WAAW;EACX,YAAY;EACZ;EACA,gBAAgB;EACjB,CAAC;AAQJ,QAAO;EACL,WAHA,oBAAoB,OAAO,UAAU,WAAW,QAAQ;EAIxD;EACA;EACA;EACA,UAAU;EACV;EACA;EACA,OAAO;GACL,GAAG;GACH,OAAO;GACP,UAAU;GACX;EACD;EACA;EACA;EACA;EACA;EACA,OAAO;EACP;EACA,UAAU;EACV;EACA;EACA;EACA;EACD"}