@fuf-stack/uniform 1.10.3 → 1.11.0

package/dist/useUniformFieldArray-btjvJdZ6.cjs

@@ -0,0 +1,90 @@
+const require_FormContext = require('./FormContext-C3GymQOA.cjs');
+const require_helpers = require('./helpers-KTgXi0lA.cjs');
+const require_useFormContext = require('./useFormContext-CWuN-_7P.cjs');
+const require_useUniformField = require('./useUniformField-BMvnRC_r.cjs');
+let react = require("react");
+let __fuf_stack_pixel_motion = require("@fuf-stack/pixel-motion");
+let react_hook_form = require("react-hook-form");
+
+//#region src/hooks/useUniformFieldArray/useUniformFieldArray.ts
+/**
+* Enhanced useFieldArray hook with initialization and animation logic.
+* Based on React Hook Form's useFieldArray with additional features:
+* - Automatic initialization when lastElementNotRemovable is set
+* - Animation control (disabled during initialization)
+* - Support for flat arrays (arrays of primitives)
+*
+* Note: Automatic validation triggering on length change is disabled to prevent
+* triggering form-wide validation. Array validation still runs on form submission.
+*
+* @see https://react-hook-form.com/docs/usefieldarray
+*/
+const useUniformFieldArray = ({ name, flat = false, elementInitialValue: _elementInitialValue = null, lastElementNotRemovable = false, disabled, testId: explicitTestId, label }) => {
+	const uniformField = require_useUniformField.useUniformField({
+		name,
+		disabled,
+		testId: explicitTestId,
+		label
+	});
+	const { control } = uniformField;
+	const { fields, append, remove, insert, move } = (0, react_hook_form.useFieldArray)({
+		control,
+		name
+	});
+	const { trigger, setValue } = require_useFormContext.useFormContext();
+	const needsInitialize = (0, react.useMemo)(() => {
+		return lastElementNotRemovable && fields.length === 0;
+	}, [lastElementNotRemovable, fields.length]);
+	const hasInitialized = (0, react.useRef)(!needsInitialize);
+	(0, react.useEffect)(() => {
+		if (needsInitialize) hasInitialized.current = false;
+	}, [needsInitialize]);
+	(0, react.useEffect)(() => {
+		if (hasInitialized.current) setTimeout(() => {
+			trigger(name);
+		}, 200);
+	}, [fields.length]);
+	const [disableAnimation, setDisableAnimation] = (0, react.useState)(true);
+	const prefersReducedMotion = (0, __fuf_stack_pixel_motion.useReducedMotion)();
+	(0, react.useEffect)(() => {
+		if (hasInitialized.current) setDisableAnimation(!!prefersReducedMotion);
+	}, [prefersReducedMotion]);
+	const elementInitialValue = (0, react.useMemo)(() => {
+		return flat ? { [require_helpers.flatArrayKey]: _elementInitialValue ?? null } : _elementInitialValue ?? {};
+	}, [flat, _elementInitialValue]);
+	(0, react.useEffect)(() => {
+		if (needsInitialize) {
+			setValue(name, [elementInitialValue], {
+				shouldDirty: false,
+				shouldTouch: false
+			});
+			hasInitialized.current = true;
+			if (!prefersReducedMotion && disableAnimation) setTimeout(() => {
+				setDisableAnimation(false);
+			}, 1);
+		}
+	}, [needsInitialize]);
+	return {
+		fields,
+		append,
+		remove,
+		insert,
+		move,
+		disableAnimation,
+		elementInitialValue,
+		...uniformField
+	};
+};
+
+//#endregion
+//#region src/hooks/useUniformFieldArray/index.ts
+/* v8 ignore stop */
+
+//#endregion
+Object.defineProperty(exports, 'useUniformFieldArray', {
+  enumerable: true,
+  get: function () {
+    return useUniformFieldArray;
+  }
+});
+//# sourceMappingURL=useUniformFieldArray-btjvJdZ6.cjs.map

package/dist/useUniformFieldArray-btjvJdZ6.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUniformFieldArray-btjvJdZ6.cjs","names":["useUniformField","useFormContext","flatArrayKey"],"sources":["../src/hooks/useUniformFieldArray/useUniformFieldArray.ts","../src/hooks/useUniformFieldArray/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { ArrayPath, FieldValues, Path } from 'react-hook-form';\n\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { useFieldArray as useRHFFieldArray } from 'react-hook-form';\n\nimport { useReducedMotion } from '@fuf-stack/pixel-motion';\n\nimport { flatArrayKey } from '../../helpers';\nimport { useFormContext } from '../useFormContext';\nimport { useUniformField } from '../useUniformField';\n\nexport interface UseUniformFieldArrayProps<\n  TFieldValues extends FieldValues = FieldValues,\n> {\n  /** Field name for the array */\n  name: ArrayPath<TFieldValues>;\n  /** Whether this is a flat array (array of primitives) */\n  flat?: boolean;\n  /** Initial value for new array elements */\n  elementInitialValue?: unknown;\n  /** Whether the last element cannot be removed (always maintain at least one element) */\n  lastElementNotRemovable?: boolean;\n  /** Disable the field */\n  disabled?: boolean;\n  /** Optional explicit test id used to build stable test ids */\n  testId?: string;\n  /** Optional label content */\n  label?: ReactNode;\n}\n\n/**\n * Enhanced useFieldArray hook with initialization and animation logic.\n * Based on React Hook Form's useFieldArray with additional features:\n * - Automatic initialization when lastElementNotRemovable is set\n * - Animation control (disabled during initialization)\n * - Support for flat arrays (arrays of primitives)\n *\n * Note: Automatic validation triggering on length change is disabled to prevent\n * triggering form-wide validation. Array validation still runs on form submission.\n *\n * @see https://react-hook-form.com/docs/usefieldarray\n */\nexport const useUniformFieldArray = <\n  TFieldValues extends FieldValues = FieldValues,\n>({\n  name,\n  flat = false,\n  elementInitialValue: _elementInitialValue = null,\n  lastElementNotRemovable = false,\n  disabled,\n  testId: explicitTestId,\n  label,\n}: UseUniformFieldArrayProps<TFieldValues>) => {\n  // Get uniform field state and utilities\n  const uniformField = useUniformField<TFieldValues>({\n    name: name as Path<TFieldValues> & string,\n    disabled,\n    testId: explicitTestId,\n    label,\n  });\n\n  const { control } = uniformField;\n\n  const { fields, append, remove, insert, move } = useRHFFieldArray({\n    control,\n    name,\n  });\n\n  const { trigger, setValue } = useFormContext<TFieldValues>();\n\n  // Determine if initialization is needed (initially or after reset).\n  // This flag automatically handles both scenarios:\n  // - Initial mount: fields.length starts at 0\n  // - Form reset: fields.length becomes 0 again\n  // Additional initialization conditions can be added here later (e.g., minElements > 0)\n  // Using useMemo ensures this value is properly tracked by React and effects can depend on it\n  const needsInitialize = useMemo(() => {\n    return lastElementNotRemovable && fields.length === 0;\n  }, [lastElementNotRemovable, fields.length]);\n\n  // Track whether initialization has completed. Initialized contextually:\n  // - If initialization IS needed (needsInitialize = true): starts as false, set to true after init\n  // - If initialization is NOT needed (needsInitialize = false): starts as true (already initialized)\n  // This ref is used to:\n  // 1. Skip validation during initialization/re-initialization\n  // 2. Gate animation enabling until after initialization\n  // 3. Gate motion preference effect until after initialization\n  const hasInitialized = useRef(!needsInitialize);\n\n  // Reset initialization flag when needsInitialize changes to true.\n  // This handles form reset: when fields become empty (needsInitialize becomes true),\n  // hasInitialized is reset to false, triggering re-initialization in the effect below.\n  useEffect(() => {\n    if (needsInitialize) {\n      hasInitialized.current = false;\n    }\n  }, [needsInitialize]);\n\n  // Validate array-level constraints (min/max items) when length changes.\n  // Skip validation during initialization/re-initialization to avoid showing errors prematurely.\n  useEffect(() => {\n    if (hasInitialized.current) {\n      setTimeout(() => {\n        // Trigger validation so min/max errors appear instantly when user adds/removes items\n        trigger(name as Path<TFieldValues>);\n      }, 200);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [fields.length]);\n\n  // Animation control: Start with animations disabled to prevent animating in initial elements.\n  // Will be enabled after initialization completes (unless user prefers reduced motion).\n  const [disableAnimation, setDisableAnimation] = useState(true);\n\n  // Respond to user's motion preference changes (after initialization).\n  // During initialization, animations stay disabled regardless of preference.\n  const prefersReducedMotion = useReducedMotion();\n  useEffect(() => {\n    if (hasInitialized.current) {\n      setDisableAnimation(!!prefersReducedMotion);\n    }\n  }, [prefersReducedMotion]);\n\n  // Prepare initial element value based on mode\n  // - flat=true: arrays of primitives → object with flatArrayKey and null value by default\n  // - flat=false: arrays of objects → empty object by default\n  const elementInitialValue = useMemo(() => {\n    return flat\n      ? { [flatArrayKey]: _elementInitialValue ?? null }\n      : (_elementInitialValue ?? {});\n  }, [flat, _elementInitialValue]);\n\n  // Initialization/Re-initialization: Add initial element when needed.\n  // This handles both initial mount and form reset scenarios by reacting to needsInitialize.\n  // CRITICAL: This effect MUST be the LAST hook in this component.\n  // It sets hasInitialized.current = true, which acts as a gate for other effects.\n  // If this runs before other effects, hasInitialized will be true during their first run,\n  // causing them to execute logic meant only for post-initialization (e.g., validation,\n  // animation enabling). By placing this last, all other effects run first with\n  // hasInitialized = false, allowing them to skip initialization-phase logic.\n  useEffect(\n    () => {\n      if (needsInitialize) {\n        // use setValue instead of append to avoid focusing the added element\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        setValue(name as Path<TFieldValues>, [elementInitialValue] as any, {\n          shouldDirty: false,\n          shouldTouch: false,\n        });\n\n        // Mark initialization as complete\n        hasInitialized.current = true;\n\n        // Enable animations after a brief delay (unless user prefers reduced motion or animations are already enabled).\n        // This only runs on initial mount when animations start disabled.\n        // On reset, disableAnimation is typically false, so this setTimeout won't run and animations stay enabled.\n        if (!prefersReducedMotion && disableAnimation) {\n          setTimeout(() => {\n            setDisableAnimation(false);\n          }, 1);\n        }\n      }\n    },\n    // Run when needsInitialize changes (initial mount or reset)\n    // needsInitialize is memoized based on fields.length and lastElementNotRemovable\n    // Other dependencies are intentionally omitted:\n    // - append, setValue, trigger, setDisableAnimation are stable refs/functions\n    // - elementInitialValue, name, flat, prefersReducedMotion, disableAnimation are props/stable values\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [needsInitialize],\n  );\n\n  return {\n    // Field array methods and state\n    fields,\n    append,\n    remove,\n    insert,\n    move,\n    disableAnimation,\n    elementInitialValue,\n    // Uniform field state and utilities (spread all)\n    ...uniformField,\n  };\n};\n","/* v8 ignore start */\n\nexport * from './useUniformFieldArray';\n\n/* v8 ignore stop */\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA2CA,MAAa,wBAEX,EACA,MACA,OAAO,OACP,qBAAqB,uBAAuB,MAC5C,0BAA0B,OAC1B,UACA,QAAQ,gBACR,YAC6C;CAE7C,MAAM,eAAeA,wCAA8B;EAC3C;EACN;EACA,QAAQ;EACR;EACD,CAAC;CAEF,MAAM,EAAE,YAAY;CAEpB,MAAM,EAAE,QAAQ,QAAQ,QAAQ,QAAQ,4CAA0B;EAChE;EACA;EACD,CAAC;CAEF,MAAM,EAAE,SAAS,aAAaC,uCAA8B;CAQ5D,MAAM,2CAAgC;AACpC,SAAO,2BAA2B,OAAO,WAAW;IACnD,CAAC,yBAAyB,OAAO,OAAO,CAAC;CAS5C,MAAM,mCAAwB,CAAC,gBAAgB;AAK/C,4BAAgB;AACd,MAAI,gBACF,gBAAe,UAAU;IAE1B,CAAC,gBAAgB,CAAC;AAIrB,4BAAgB;AACd,MAAI,eAAe,QACjB,kBAAiB;AAEf,WAAQ,KAA2B;KAClC,IAAI;IAGR,CAAC,OAAO,OAAO,CAAC;CAInB,MAAM,CAAC,kBAAkB,2CAAgC,KAAK;CAI9D,MAAM,uEAAyC;AAC/C,4BAAgB;AACd,MAAI,eAAe,QACjB,qBAAoB,CAAC,CAAC,qBAAqB;IAE5C,CAAC,qBAAqB,CAAC;CAK1B,MAAM,+CAAoC;AACxC,SAAO,OACH,GAAGC,+BAAe,wBAAwB,MAAM,GAC/C,wBAAwB,EAAE;IAC9B,CAAC,MAAM,qBAAqB,CAAC;AAUhC,4BACQ;AACJ,MAAI,iBAAiB;AAGnB,YAAS,MAA4B,CAAC,oBAAoB,EAAS;IACjE,aAAa;IACb,aAAa;IACd,CAAC;AAGF,kBAAe,UAAU;AAKzB,OAAI,CAAC,wBAAwB,iBAC3B,kBAAiB;AACf,wBAAoB,MAAM;MACzB,EAAE;;IAUX,CAAC,gBAAgB,CAClB;AAED,QAAO;EAEL;EACA;EACA;EACA;EACA;EACA;EACA;EAEA,GAAG;EACJ"}

package/dist/useWatchUserChange-BAdiqg2q.d.ts

@@ -0,0 +1,78 @@
+import { FieldValues, Path, UseFormReset, UseFormResetField, UseFormSetValue } from "react-hook-form";
+
+//#region src/hooks/useWatchUserChange/useWatchUserChange.d.ts
+interface UseWatchUserChangeOptions<TFieldValues extends FieldValues> {
+  /** Field name to watch for user changes */
+  watch: Path<TFieldValues>;
+  /**
+   * Callback when watched field is changed by user input.
+   * Receives the new value and form helpers (setValue, resetField, reset).
+   */
+  onChange: (value: unknown, helpers: {
+    setValue: UseFormSetValue<TFieldValues>;
+    resetField: UseFormResetField<TFieldValues>;
+    reset: UseFormReset<TFieldValues>;
+  }) => void;
+}
+/**
+ * Hook that watches for user changes on a specific form field.
+ *
+ * Only triggers on manual user input (typing, clicking, selecting),
+ * NOT on programmatic changes like form.reset() or form.setValue().
+ *
+ * This hook subscribes to field changes at the source (useController),
+ * ensuring immediate and accurate detection of user interactions.
+ *
+ * Use cases:
+ * - Reset dependent fields when parent field changes
+ * - Set mode-specific default values when a toggle changes
+ * - Clear form sections based on user selections
+ * - Trigger side effects only on user interaction
+ *
+ * Note: To watch multiple fields, call this hook multiple times.
+ *
+ * @example
+ * ```tsx
+ * // Reset city and address when user changes country
+ * useWatchUserChange({
+ *   watch: 'country',
+ *   onChange: (value, { resetField }) => {
+ *     resetField('city');
+ *     resetField('address');
+ *   },
+ * });
+ *
+ * // Set defaults when user changes payment method
+ * useWatchUserChange({
+ *   watch: 'paymentMethod',
+ *   onChange: (value, { setValue }) => {
+ *     if (value === 'credit') {
+ *       setValue('installments', 3);
+ *     } else {
+ *       setValue('installments', 1);
+ *     }
+ *   },
+ * });
+ *
+ * // Watch multiple fields by calling the hook multiple times
+ * useWatchUserChange({
+ *   watch: 'category',
+ *   onChange: (value, { resetField }) => {
+ *     resetField('productId');
+ *   },
+ * });
+ * useWatchUserChange({
+ *   watch: 'brand',
+ *   onChange: (value, { resetField }) => {
+ *     resetField('productId');
+ *   },
+ * });
+ * ```
+ */
+declare const useWatchUserChange: <TFieldValues extends FieldValues = FieldValues>({
+  watch: watchField,
+  onChange
+}: UseWatchUserChangeOptions<TFieldValues>) => void;
+//#endregion
+export { useWatchUserChange as n, UseWatchUserChangeOptions as t };
+//# sourceMappingURL=useWatchUserChange-BAdiqg2q.d.ts.map

package/dist/useWatchUserChange-BAdiqg2q.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useWatchUserChange-BAdiqg2q.d.ts","names":[],"sources":["../src/hooks/useWatchUserChange/useWatchUserChange.ts"],"sourcesContent":[],"mappings":";;;UAYiB,+CAA+C;;EAA/C,KAAA,EAER,IAFQ,CAEH,YAFG,CAAA;EAA+C;;;;EAUhD,QAAA,EAAA,CAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA;IACoB,QAAA,EADpB,eACoB,CADJ,YACI,CAAA;IAAlB,UAAA,EAAA,iBAAA,CAAkB,YAAlB,CAAA;IACQ,KAAA,EAAb,YAAa,CAAA,YAAA,CAAA;EAAb,CAAA,EAAA,GAAA,IAAA;;AA4Db;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAAa,0CACU,cAAc;SACnC;;GAGC,0BAA0B"}

package/dist/useWatchUserChange-C1ezpj0t.js

@@ -0,0 +1,83 @@
+import { n as useFormContext } from "./useFormContext-JCm1UR_e.js";
+import { useEffect } from "react";
+
+//#region src/hooks/useWatchUserChange/useWatchUserChange.ts
+/**
+* Hook that watches for user changes on a specific form field.
+*
+* Only triggers on manual user input (typing, clicking, selecting),
+* NOT on programmatic changes like form.reset() or form.setValue().
+*
+* This hook subscribes to field changes at the source (useController),
+* ensuring immediate and accurate detection of user interactions.
+*
+* Use cases:
+* - Reset dependent fields when parent field changes
+* - Set mode-specific default values when a toggle changes
+* - Clear form sections based on user selections
+* - Trigger side effects only on user interaction
+*
+* Note: To watch multiple fields, call this hook multiple times.
+*
+* @example
+* ```tsx
+* // Reset city and address when user changes country
+* useWatchUserChange({
+*   watch: 'country',
+*   onChange: (value, { resetField }) => {
+*     resetField('city');
+*     resetField('address');
+*   },
+* });
+*
+* // Set defaults when user changes payment method
+* useWatchUserChange({
+*   watch: 'paymentMethod',
+*   onChange: (value, { setValue }) => {
+*     if (value === 'credit') {
+*       setValue('installments', 3);
+*     } else {
+*       setValue('installments', 1);
+*     }
+*   },
+* });
+*
+* // Watch multiple fields by calling the hook multiple times
+* useWatchUserChange({
+*   watch: 'category',
+*   onChange: (value, { resetField }) => {
+*     resetField('productId');
+*   },
+* });
+* useWatchUserChange({
+*   watch: 'brand',
+*   onChange: (value, { resetField }) => {
+*     resetField('productId');
+*   },
+* });
+* ```
+*/
+const useWatchUserChange = ({ watch: watchField, onChange }) => {
+	const { setValue, resetField, reset, userChange } = useFormContext();
+	useEffect(() => {
+		const listener = (fieldName, value) => {
+			if (fieldName === watchField) onChange(value, {
+				setValue,
+				resetField,
+				reset
+			});
+		};
+		return userChange.subscribe(listener);
+	}, [
+		watchField,
+		onChange,
+		setValue,
+		resetField,
+		reset,
+		userChange
+	]);
+};
+
+//#endregion
+export { useWatchUserChange as t };
+//# sourceMappingURL=useWatchUserChange-C1ezpj0t.js.map

package/dist/useWatchUserChange-C1ezpj0t.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useWatchUserChange-C1ezpj0t.js","names":[],"sources":["../src/hooks/useWatchUserChange/useWatchUserChange.ts"],"sourcesContent":["import type {\n  FieldValues,\n  Path,\n  UseFormReset,\n  UseFormResetField,\n  UseFormSetValue,\n} from 'react-hook-form';\n\nimport { useEffect } from 'react';\n\nimport { useFormContext } from '../useFormContext/useFormContext';\n\nexport interface UseWatchUserChangeOptions<TFieldValues extends FieldValues> {\n  /** Field name to watch for user changes */\n  watch: Path<TFieldValues>;\n  /**\n   * Callback when watched field is changed by user input.\n   * Receives the new value and form helpers (setValue, resetField, reset).\n   */\n  onChange: (\n    value: unknown,\n    helpers: {\n      setValue: UseFormSetValue<TFieldValues>;\n      resetField: UseFormResetField<TFieldValues>;\n      reset: UseFormReset<TFieldValues>;\n    },\n  ) => void;\n}\n\n/**\n * Hook that watches for user changes on a specific form field.\n *\n * Only triggers on manual user input (typing, clicking, selecting),\n * NOT on programmatic changes like form.reset() or form.setValue().\n *\n * This hook subscribes to field changes at the source (useController),\n * ensuring immediate and accurate detection of user interactions.\n *\n * Use cases:\n * - Reset dependent fields when parent field changes\n * - Set mode-specific default values when a toggle changes\n * - Clear form sections based on user selections\n * - Trigger side effects only on user interaction\n *\n * Note: To watch multiple fields, call this hook multiple times.\n *\n * @example\n * ```tsx\n * // Reset city and address when user changes country\n * useWatchUserChange({\n *   watch: 'country',\n *   onChange: (value, { resetField }) => {\n *     resetField('city');\n *     resetField('address');\n *   },\n * });\n *\n * // Set defaults when user changes payment method\n * useWatchUserChange({\n *   watch: 'paymentMethod',\n *   onChange: (value, { setValue }) => {\n *     if (value === 'credit') {\n *       setValue('installments', 3);\n *     } else {\n *       setValue('installments', 1);\n *     }\n *   },\n * });\n *\n * // Watch multiple fields by calling the hook multiple times\n * useWatchUserChange({\n *   watch: 'category',\n *   onChange: (value, { resetField }) => {\n *     resetField('productId');\n *   },\n * });\n * useWatchUserChange({\n *   watch: 'brand',\n *   onChange: (value, { resetField }) => {\n *     resetField('productId');\n *   },\n * });\n * ```\n */\nexport const useWatchUserChange = <\n  TFieldValues extends FieldValues = FieldValues,\n>({\n  watch: watchField,\n  onChange,\n}: UseWatchUserChangeOptions<TFieldValues>) => {\n  const { setValue, resetField, reset, userChange } =\n    useFormContext<TFieldValues>();\n\n  useEffect(() => {\n    // Create listener that checks if changed field is the one we're watching\n    const listener = (fieldName: Path<TFieldValues>, value: unknown) => {\n      // Check if this is the field we're watching\n      if (fieldName === watchField) {\n        // Call the onChange callback with helpers\n        onChange(value, { setValue, resetField, reset });\n      }\n    };\n\n    // Subscribe to user changes\n    const unsubscribe = userChange.subscribe(listener);\n\n    // Cleanup on unmount\n    return unsubscribe;\n  }, [watchField, onChange, setValue, resetField, reset, userChange]);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoFA,MAAa,sBAEX,EACA,OAAO,YACP,eAC6C;CAC7C,MAAM,EAAE,UAAU,YAAY,OAAO,eACnC,gBAA8B;AAEhC,iBAAgB;EAEd,MAAM,YAAY,WAA+B,UAAmB;AAElE,OAAI,cAAc,WAEhB,UAAS,OAAO;IAAE;IAAU;IAAY;IAAO,CAAC;;AAQpD,SAHoB,WAAW,UAAU,SAAS;IAIjD;EAAC;EAAY;EAAU;EAAU;EAAY;EAAO;EAAW,CAAC"}

package/dist/useWatchUserChange-C5dr12By.cjs

@@ -0,0 +1,89 @@
+const require_FormContext = require('./FormContext-C3GymQOA.cjs');
+const require_useFormContext = require('./useFormContext-CWuN-_7P.cjs');
+let react = require("react");
+
+//#region src/hooks/useWatchUserChange/useWatchUserChange.ts
+/**
+* Hook that watches for user changes on a specific form field.
+*
+* Only triggers on manual user input (typing, clicking, selecting),
+* NOT on programmatic changes like form.reset() or form.setValue().
+*
+* This hook subscribes to field changes at the source (useController),
+* ensuring immediate and accurate detection of user interactions.
+*
+* Use cases:
+* - Reset dependent fields when parent field changes
+* - Set mode-specific default values when a toggle changes
+* - Clear form sections based on user selections
+* - Trigger side effects only on user interaction
+*
+* Note: To watch multiple fields, call this hook multiple times.
+*
+* @example
+* ```tsx
+* // Reset city and address when user changes country
+* useWatchUserChange({
+*   watch: 'country',
+*   onChange: (value, { resetField }) => {
+*     resetField('city');
+*     resetField('address');
+*   },
+* });
+*
+* // Set defaults when user changes payment method
+* useWatchUserChange({
+*   watch: 'paymentMethod',
+*   onChange: (value, { setValue }) => {
+*     if (value === 'credit') {
+*       setValue('installments', 3);
+*     } else {
+*       setValue('installments', 1);
+*     }
+*   },
+* });
+*
+* // Watch multiple fields by calling the hook multiple times
+* useWatchUserChange({
+*   watch: 'category',
+*   onChange: (value, { resetField }) => {
+*     resetField('productId');
+*   },
+* });
+* useWatchUserChange({
+*   watch: 'brand',
+*   onChange: (value, { resetField }) => {
+*     resetField('productId');
+*   },
+* });
+* ```
+*/
+const useWatchUserChange = ({ watch: watchField, onChange }) => {
+	const { setValue, resetField, reset, userChange } = require_useFormContext.useFormContext();
+	(0, react.useEffect)(() => {
+		const listener = (fieldName, value) => {
+			if (fieldName === watchField) onChange(value, {
+				setValue,
+				resetField,
+				reset
+			});
+		};
+		return userChange.subscribe(listener);
+	}, [
+		watchField,
+		onChange,
+		setValue,
+		resetField,
+		reset,
+		userChange
+	]);
+};
+
+//#endregion
+Object.defineProperty(exports, 'useWatchUserChange', {
+  enumerable: true,
+  get: function () {
+    return useWatchUserChange;
+  }
+});
+//# sourceMappingURL=useWatchUserChange-C5dr12By.cjs.map

package/dist/useWatchUserChange-C5dr12By.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useWatchUserChange-C5dr12By.cjs","names":["useFormContext"],"sources":["../src/hooks/useWatchUserChange/useWatchUserChange.ts"],"sourcesContent":["import type {\n  FieldValues,\n  Path,\n  UseFormReset,\n  UseFormResetField,\n  UseFormSetValue,\n} from 'react-hook-form';\n\nimport { useEffect } from 'react';\n\nimport { useFormContext } from '../useFormContext/useFormContext';\n\nexport interface UseWatchUserChangeOptions<TFieldValues extends FieldValues> {\n  /** Field name to watch for user changes */\n  watch: Path<TFieldValues>;\n  /**\n   * Callback when watched field is changed by user input.\n   * Receives the new value and form helpers (setValue, resetField, reset).\n   */\n  onChange: (\n    value: unknown,\n    helpers: {\n      setValue: UseFormSetValue<TFieldValues>;\n      resetField: UseFormResetField<TFieldValues>;\n      reset: UseFormReset<TFieldValues>;\n    },\n  ) => void;\n}\n\n/**\n * Hook that watches for user changes on a specific form field.\n *\n * Only triggers on manual user input (typing, clicking, selecting),\n * NOT on programmatic changes like form.reset() or form.setValue().\n *\n * This hook subscribes to field changes at the source (useController),\n * ensuring immediate and accurate detection of user interactions.\n *\n * Use cases:\n * - Reset dependent fields when parent field changes\n * - Set mode-specific default values when a toggle changes\n * - Clear form sections based on user selections\n * - Trigger side effects only on user interaction\n *\n * Note: To watch multiple fields, call this hook multiple times.\n *\n * @example\n * ```tsx\n * // Reset city and address when user changes country\n * useWatchUserChange({\n *   watch: 'country',\n *   onChange: (value, { resetField }) => {\n *     resetField('city');\n *     resetField('address');\n *   },\n * });\n *\n * // Set defaults when user changes payment method\n * useWatchUserChange({\n *   watch: 'paymentMethod',\n *   onChange: (value, { setValue }) => {\n *     if (value === 'credit') {\n *       setValue('installments', 3);\n *     } else {\n *       setValue('installments', 1);\n *     }\n *   },\n * });\n *\n * // Watch multiple fields by calling the hook multiple times\n * useWatchUserChange({\n *   watch: 'category',\n *   onChange: (value, { resetField }) => {\n *     resetField('productId');\n *   },\n * });\n * useWatchUserChange({\n *   watch: 'brand',\n *   onChange: (value, { resetField }) => {\n *     resetField('productId');\n *   },\n * });\n * ```\n */\nexport const useWatchUserChange = <\n  TFieldValues extends FieldValues = FieldValues,\n>({\n  watch: watchField,\n  onChange,\n}: UseWatchUserChangeOptions<TFieldValues>) => {\n  const { setValue, resetField, reset, userChange } =\n    useFormContext<TFieldValues>();\n\n  useEffect(() => {\n    // Create listener that checks if changed field is the one we're watching\n    const listener = (fieldName: Path<TFieldValues>, value: unknown) => {\n      // Check if this is the field we're watching\n      if (fieldName === watchField) {\n        // Call the onChange callback with helpers\n        onChange(value, { setValue, resetField, reset });\n      }\n    };\n\n    // Subscribe to user changes\n    const unsubscribe = userChange.subscribe(listener);\n\n    // Cleanup on unmount\n    return unsubscribe;\n  }, [watchField, onChange, setValue, resetField, reset, userChange]);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoFA,MAAa,sBAEX,EACA,OAAO,YACP,eAC6C;CAC7C,MAAM,EAAE,UAAU,YAAY,OAAO,eACnCA,uCAA8B;AAEhC,4BAAgB;EAEd,MAAM,YAAY,WAA+B,UAAmB;AAElE,OAAI,cAAc,WAEhB,UAAS,OAAO;IAAE;IAAU;IAAY;IAAO,CAAC;;AAQpD,SAHoB,WAAW,UAAU,SAAS;IAIjD;EAAC;EAAY;EAAU;EAAU;EAAY;EAAO;EAAW,CAAC"}

package/dist/useWatchUserChange-COVdHmki.d.cts

@@ -0,0 +1,78 @@
+import { FieldValues, Path, UseFormReset, UseFormResetField, UseFormSetValue } from "react-hook-form";
+
+//#region src/hooks/useWatchUserChange/useWatchUserChange.d.ts
+interface UseWatchUserChangeOptions<TFieldValues extends FieldValues> {
+  /** Field name to watch for user changes */
+  watch: Path<TFieldValues>;
+  /**
+   * Callback when watched field is changed by user input.
+   * Receives the new value and form helpers (setValue, resetField, reset).
+   */
+  onChange: (value: unknown, helpers: {
+    setValue: UseFormSetValue<TFieldValues>;
+    resetField: UseFormResetField<TFieldValues>;
+    reset: UseFormReset<TFieldValues>;
+  }) => void;
+}
+/**
+ * Hook that watches for user changes on a specific form field.
+ *
+ * Only triggers on manual user input (typing, clicking, selecting),
+ * NOT on programmatic changes like form.reset() or form.setValue().
+ *
+ * This hook subscribes to field changes at the source (useController),
+ * ensuring immediate and accurate detection of user interactions.
+ *
+ * Use cases:
+ * - Reset dependent fields when parent field changes
+ * - Set mode-specific default values when a toggle changes
+ * - Clear form sections based on user selections
+ * - Trigger side effects only on user interaction
+ *
+ * Note: To watch multiple fields, call this hook multiple times.
+ *
+ * @example
+ * ```tsx
+ * // Reset city and address when user changes country
+ * useWatchUserChange({
+ *   watch: 'country',
+ *   onChange: (value, { resetField }) => {
+ *     resetField('city');
+ *     resetField('address');
+ *   },
+ * });
+ *
+ * // Set defaults when user changes payment method
+ * useWatchUserChange({
+ *   watch: 'paymentMethod',
+ *   onChange: (value, { setValue }) => {
+ *     if (value === 'credit') {
+ *       setValue('installments', 3);
+ *     } else {
+ *       setValue('installments', 1);
+ *     }
+ *   },
+ * });
+ *
+ * // Watch multiple fields by calling the hook multiple times
+ * useWatchUserChange({
+ *   watch: 'category',
+ *   onChange: (value, { resetField }) => {
+ *     resetField('productId');
+ *   },
+ * });
+ * useWatchUserChange({
+ *   watch: 'brand',
+ *   onChange: (value, { resetField }) => {
+ *     resetField('productId');
+ *   },
+ * });
+ * ```
+ */
+declare const useWatchUserChange: <TFieldValues extends FieldValues = FieldValues>({
+  watch: watchField,
+  onChange
+}: UseWatchUserChangeOptions<TFieldValues>) => void;
+//#endregion
+export { useWatchUserChange as n, UseWatchUserChangeOptions as t };
+//# sourceMappingURL=useWatchUserChange-COVdHmki.d.cts.map

package/dist/useWatchUserChange-COVdHmki.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useWatchUserChange-COVdHmki.d.cts","names":[],"sources":["../src/hooks/useWatchUserChange/useWatchUserChange.ts"],"sourcesContent":[],"mappings":";;;UAYiB,+CAA+C;;EAA/C,KAAA,EAER,IAFQ,CAEH,YAFG,CAAA;EAA+C;;;;EAUhD,QAAA,EAAA,CAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA;IACoB,QAAA,EADpB,eACoB,CADJ,YACI,CAAA;IAAlB,UAAA,EAAA,iBAAA,CAAkB,YAAlB,CAAA;IACQ,KAAA,EAAb,YAAa,CAAA,YAAA,CAAA;EAAb,CAAA,EAAA,GAAA,IAAA;;AA4Db;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAAa,0CACU,cAAc;SACnC;;GAGC,0BAA0B"}