@fuf-stack/uniform 1.6.1 → 1.6.2

package/dist/Checkboxes/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/Checkboxes/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/FieldArray/index.cjs

@@ -12,7 +12,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/FieldArray/index.js

@@ -12,7 +12,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/Form/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/Form/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/Input/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/Input/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/RadioBoxes/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/RadioBoxes/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/RadioTabs/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/RadioTabs/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/Radios/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/Radios/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/Select/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/Select/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/SubmitButton/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/SubmitButton/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/Switch/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/Switch/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/TextArea/index.cjs

@@ -11,7 +11,7 @@ require('../chunk-NHEZXA4H.cjs');
 require('../chunk-JMFDNTVC.cjs');
 require('../chunk-PCTYJUY7.cjs');
 require('../chunk-OE5BOGGX.cjs');
-require('../chunk-TEIXBRF5.cjs');
+require('../chunk-D5UUY4BD.cjs');
 require('../chunk-NZBO4N3S.cjs');
 require('../chunk-Z353BLWI.cjs');
 require('../chunk-555JRYCS.cjs');

package/dist/TextArea/index.js

@@ -11,7 +11,7 @@ import "../chunk-ELYGQTXB.js";
 import "../chunk-CK362NWK.js";
 import "../chunk-AHJJIANM.js";
 import "../chunk-NTDKZW4E.js";
-import "../chunk-CHNYQVWO.js";
+import "../chunk-L5TXRTPB.js";
 import "../chunk-PO5UQAU6.js";
 import "../chunk-76KOVUDN.js";
 import "../chunk-K2V4ULA2.js";

package/dist/{chunk-TEIXBRF5.cjs → chunk-D5UUY4BD.cjs}

@@ -3,18 +3,23 @@
 var _chunkNZBO4N3Scjs = require('./chunk-NZBO4N3S.cjs');
 
 
+var _chunkZ353BLWIcjs = require('./chunk-Z353BLWI.cjs');
+
+
 var _chunk555JRYCScjs = require('./chunk-555JRYCS.cjs');
 
 // src/hooks/useClientValidation/useClientValidation.ts
 var _react = require('react');
 var _veto = require('@fuf-stack/veto');
-var useClientValidation = (data, schemaFactory) => {
+var useClientValidation = (data, schemaFactory, options) => {
+  var _a;
   const {
     formState: { touchedFields },
     validation: { setClientValidationSchema },
     trigger
   } = _chunkNZBO4N3Scjs.useFormContext.call(void 0, );
-  const key = _react.useId.call(void 0, );
+  const autoGeneratedKey = _react.useId.call(void 0, );
+  const key = (_a = options == null ? void 0 : options.key) != null ? _a : autoGeneratedKey;
   const dataHash = JSON.stringify(data);
   _react.useEffect.call(void 0, () => {
     if (data != null) {
@@ -40,6 +45,10 @@ var clientValidationSchemaByName = (name, fieldSchema) => {
   for (let i = segments.length - 1; i >= 0; i -= 1) {
     const segment = segments[i];
     const isNumeric = /^\d+$/.test(segment);
+    const isFlatArrayKey = segment === _chunkZ353BLWIcjs.flatArrayKey;
+    if (isFlatArrayKey) {
+      continue;
+    }
     if (isNumeric) {
       schema = _veto.array.call(void 0, schema).optional();
     } else {
@@ -56,4 +65,4 @@ var clientValidationSchemaByName = (name, fieldSchema) => {
 
 
 exports.useClientValidation = useClientValidation; exports.clientValidationSchemaByName = clientValidationSchemaByName;
-//# sourceMappingURL=chunk-TEIXBRF5.cjs.map
+//# sourceMappingURL=chunk-D5UUY4BD.cjs.map

package/dist/chunk-D5UUY4BD.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-D5UUY4BD.cjs","../src/hooks/useClientValidation/useClientValidation.ts"],"names":[],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACRA,8BAAiC;AAEjC,uCAAmC;AA8D5B,IAAM,oBAAA,EAAsB,CACjC,IAAA,EACA,aAAA,EACA,OAAA,EAAA,GACS;AAtEX,EAAA,IAAA,EAAA;AAuEE,EAAA,MAAM;AAAA,IACJ,SAAA,EAAW,EAAE,cAAc,CAAA;AAAA,IAC3B,UAAA,EAAY,EAAE,0BAA0B,CAAA;AAAA,IACxC;AAAA,EACF,EAAA,EAAI,8CAAA,CAAe;AAGnB,EAAA,MAAM,iBAAA,EAAmB,0BAAA,CAAM;AAC/B,EAAA,MAAM,IAAA,EAAA,CAAM,GAAA,EAAA,QAAA,GAAA,KAAA,EAAA,KAAA,EAAA,EAAA,OAAA,CAAS,GAAA,EAAA,GAAT,KAAA,EAAA,GAAA,EAAgB,gBAAA;AAI5B,EAAA,MAAM,SAAA,EAAW,IAAA,CAAK,SAAA,CAAU,IAAI,CAAA;AAGpC,EAAA,8BAAA,CAAU,EAAA,GAAM;AAEd,IAAA,GAAA,CAAI,KAAA,GAAQ,IAAA,EAAM;AAChB,MAAA,MAAM,iBAAA,EAAmB,aAAA,CAAc,IAAI,CAAA;AAC3C,MAAA,yBAAA,CAA0B,GAAA,EAAK,gBAAgB,CAAA;AAAA,IACjD,EAAA,KAAO;AAEL,MAAA,yBAAA,CAA0B,GAAA,EAAK,IAAI,CAAA;AAAA,IACrC;AAGA,IAAA,MAAM,kBAAA,EAAoB,MAAA,CAAO,IAAA,CAAK,aAAa,CAAA;AACnD,IAAA,GAAA,CAAI,iBAAA,CAAkB,OAAA,EAAS,CAAA,EAAG;AAGhC,MAAA,UAAA,CAAW,CAAA,EAAA,GAAY,uCAAA,IAAA,EAAA,IAAA,EAAA,QAAA,EAAA,CAAA,EAAA;AACrB,QAAA,OAAO,OAAA,CAAQ,iBAAiB,CAAA;AAAA,MAClC,CAAA,CAAA,EAAG,CAAC,CAAA;AAAA,IACN;AAGA,IAAA,OAAO,CAAA,EAAA,GAAM;AACX,MAAA,yBAAA,CAA0B,GAAA,EAAK,IAAI,CAAA;AAAA,IACrC,CAAA;AAAA,EAGF,CAAA,EAAG,CAAC,QAAA,EAAU,GAAG,CAAC,CAAA;AACpB,CAAA;AAmFO,IAAM,6BAAA,EAA+B,CAC1C,IAAA,EACA,WAAA,EAAA,GACG;AACH,EAAA,MAAM,SAAA,EAAW,IAAA,CAAK,KAAA,CAAM,GAAG,CAAA;AAG/B,EAAA,IAAI,OAAA,EAAsB,WAAA;AAG1B,EAAA,IAAA,CAAA,IAAS,EAAA,EAAI,QAAA,CAAS,OAAA,EAAS,CAAA,EAAG,EAAA,GAAK,CAAA,EAAG,EAAA,GAAK,CAAA,EAAG;AAChD,IAAA,MAAM,QAAA,EAAU,QAAA,CAAS,CAAC,CAAA;AAE1B,IAAA,MAAM,UAAA,EAAY,OAAA,CAAQ,IAAA,CAAK,OAAO,CAAA;AACtC,IAAA,MAAM,eAAA,EAAiB,QAAA,IAAY,8BAAA;AAEnC,IAAA,GAAA,CAAI,cAAA,EAAgB;AAIlB,MAAA,QAAA;AAAA,IACF;AAEA,IAAA,GAAA,CAAI,SAAA,EAAW;AAEb,MAAA,OAAA,EAAS,yBAAA,MAAY,CAAA,CAAE,QAAA,CAAS,CAAA;AAAA,IAClC,EAAA,KAAO;AAGL,MAAA,MAAM,IAAA,EAAM,+BAAA;AAAY,QACtB,CAAC,OAAO,CAAA,EAAG;AAAA,MACb,CAAC,CAAA;AACD,MAAA,OAAA,EAAS,EAAA,EAAI,EAAA,EAAI,GAAA,CAAI,QAAA,CAAS,EAAA,EAAI,GAAA;AAAA,IACpC;AAAA,EACF;AAEA,EAAA,OAAO,MAAA;AACT,CAAA;AD3KA;AACA;AACE;AACA;AACF,uHAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-D5UUY4BD.cjs","sourcesContent":[null,"import type { VetoTypeAny } from '@fuf-stack/veto';\n\nimport { useEffect, useId } from 'react';\n\nimport { array, objectLoose } from '@fuf-stack/veto';\n\nimport { flatArrayKey } from '../../helpers';\nimport { useFormContext } from '../useFormContext/useFormContext';\n\n/**\n * Hook for adding dynamic client-side validation to forms.\n *\n * Client validation is used for context-dependent validation rules that require external data\n * (e.g., checking if a username already exists). It complements base validation (passed to Form),\n * which handles static rules like \"required\", min/max length, format, etc.\n *\n * **Typical pattern:**\n * - Base validation: Static, always-on rules (required, format, length constraints)\n * - Client validation: Dynamic rules based on external data (uniqueness, business logic)\n * - Client schemas should use `.nullish()` to allow empty values (base validation handles \"required\")\n *\n * Automatically manages validation schema lifecycle: sets schema when data is provided,\n * clears schema when data is null/undefined, and cleans up on unmount. When the client\n * validation schema changes, automatically re-validates all touched fields.\n *\n * @param data - Data to create validation schema from (or null/undefined to clear validation)\n * @param schemaFactory - Function that creates a validation schema from the data. Schemas should typically use `.nullish()`.\n * @param options - Optional configuration object\n * @param options.key - Optional custom key for registration. Useful when multiple instances should share validation (e.g., in field arrays)\n *\n * @example\n * ```tsx\n * // Base validation handles \"required\" and format\n * const baseSchema = veto({ username: vt.string({ min: 3 }) });\n *\n * // Client validation adds dynamic uniqueness check\n * const { data: teamData } = useTeamQuery(teamId);\n * useClientValidation(teamData, (data) =>\n *   vt.objectLoose({\n *     username: vt.string()\n *       .refine(\n *         (value) => !data.existingUsers.includes(value),\n *         { message: 'Username already exists' }\n *       )\n *       .nullish() // Allow empty - base validation handles \"required\"\n *   })\n * );\n * ```\n *\n * @example\n * ```tsx\n * // Using custom key in a field array to avoid multiple registrations\n * fields.map((field, index) => (\n *   useClientValidation(\n *     userData,\n *     (data) => clientValidationSchemaByName(\n *       `items.${index}.name`,\n *       vt.string()\n *         .refine((val) => !data.forbidden.includes(val), { message: 'Name not allowed' })\n *         .nullish()\n *     ),\n *     { key: 'items-validation' } // All instances share the same key\n *   )\n * ));\n * ```\n */\nexport const useClientValidation = <TData = unknown>(\n  data: TData | null | undefined,\n  schemaFactory: (data: TData) => VetoTypeAny,\n  options?: { key?: string },\n): void => {\n  const {\n    formState: { touchedFields },\n    validation: { setClientValidationSchema },\n    trigger,\n  } = useFormContext();\n\n  // Use provided key or auto-generate unique key\n  const autoGeneratedKey = useId();\n  const key = options?.key ?? autoGeneratedKey;\n\n  // Use data hash instead of object reference to avoid unnecessary re-runs\n  // when data object reference changes but data remains the same\n  const dataHash = JSON.stringify(data);\n\n  // Single effect to manage validation schema lifecycle\n  useEffect(() => {\n    // Set validation schema when data is available\n    if (data != null) {\n      const validationSchema = schemaFactory(data);\n      setClientValidationSchema(key, validationSchema);\n    } else {\n      // Clear validation schema when no data\n      setClientValidationSchema(key, null);\n    }\n\n    // Re-validate all touched fields when client validation schema changes\n    const touchedFieldNames = Object.keys(touchedFields);\n    if (touchedFieldNames.length > 0) {\n      // Use setTimeout to ensure the client validation schema update has propagated\n      // before triggering re-validation (fixes race condition)\n      setTimeout(async () => {\n        return trigger(touchedFieldNames);\n      }, 1);\n    }\n\n    // Cleanup on unmount or when dependencies change\n    return () => {\n      setClientValidationSchema(key, null);\n    };\n    // Only re-run when data (dataHash) or key changes\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [dataHash, key]);\n};\n\n/**\n * Helper function to create a veto looseObject schema for a single field with nested path support.\n *\n * Parses field paths (dot-notation) and creates properly nested loose object schemas with array support.\n * All intermediate objects and arrays are marked as optional to allow partial data structures.\n * Numeric segments in the path are treated as array indices, and the parent field is wrapped in an array schema.\n * Supports flat arrays (arrays of primitives) via the special `__FLAT__` key.\n *\n * **Important:** The fieldSchema should typically use `.nullish()` to allow empty values. This is because:\n * - Base validation (passed to Form) handles \"required\" constraints\n * - Client validation adds dynamic, context-dependent rules (e.g., \"username already exists\")\n * - Form data processing converts empty strings in flat arrays to `null` (not `undefined`)\n * - `.nullish()` accepts both `null` and `undefined`, while `.optional()` only accepts `undefined`\n *\n * This pattern ensures client validation only validates non-empty values, while base validation\n * enforces required fields and basic constraints (min length, format, etc.).\n *\n * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name', 'tags.0.__FLAT__')\n * @param fieldSchema - The veto validation schema for the field. Should typically use `.nullish()` to allow empty values.\n * @returns A nested loose object schema matching the field path structure with proper type inference\n *\n * @example\n * ```tsx\n * // Typical usage: base validation handles \"required\", client validation adds dynamic rules\n * // Base validation (in Form component)\n * const baseSchema = veto({ username: vt.string({ min: 3 }) }); // Required + min length\n *\n * // Client validation (dynamic check for existing usernames)\n * const { data: userData } = useUserQuery(userId);\n * useClientValidation(userData, (data) =>\n *   clientValidationSchemaByName(\n *     'username',\n *     vt.string()\n *       .refine(\n *         (value) => !data.existingUsernames.includes(value),\n *         { message: 'Username already taken' }\n *       )\n *       .nullish() // Allow empty - base validation handles \"required\"\n *   )\n * );\n * ```\n *\n * @example\n * ```tsx\n * // Nested field path with dynamic validation\n * clientValidationSchemaByName(\n *   'user.profile.email',\n *   vt.string()\n *     .refine(\n *       (value) => !reservedEmails.includes(value),\n *       { message: 'This email is reserved' }\n *     )\n *     .nullish()\n * )\n * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: ... }).optional() }).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Array of objects with dynamic validation\n * clientValidationSchemaByName(\n *   'items.0.tag',\n *   vt.string()\n *     .refine((value) => !forbiddenTags.includes(value), { message: 'Tag not allowed' })\n *     .nullish()\n * )\n * // => objectLoose({ items: array(objectLoose({ tag: ... })).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Flat array (array of primitives) with dynamic validation\n * clientValidationSchemaByName(\n *   'tags.0.__FLAT__',\n *   vt.string()\n *     .refine((value) => !forbiddenWords.includes(value), { message: 'Word not allowed' })\n *     .nullish()\n * )\n * // => objectLoose({ tags: array(vt.string().refine(...).nullish()).optional() })\n * ```\n */\nexport const clientValidationSchemaByName = <T extends VetoTypeAny>(\n  name: string,\n  fieldSchema: T,\n) => {\n  const segments = name.split('.');\n\n  // Build schema from innermost to outermost\n  let schema: VetoTypeAny = fieldSchema;\n\n  // Process segments in reverse order to build nested structure\n  for (let i = segments.length - 1; i >= 0; i -= 1) {\n    const segment = segments[i];\n\n    const isNumeric = /^\\d+$/.test(segment);\n    const isFlatArrayKey = segment === flatArrayKey;\n\n    if (isFlatArrayKey) {\n      // Skip the __FLAT__ key - it's just a marker for flat arrays\n      // The schema is already correct (primitive type), just continue\n      // eslint-disable-next-line no-continue\n      continue;\n    }\n\n    if (isNumeric) {\n      // Current segment is an array index - wrap current schema in optional array\n      schema = array(schema).optional();\n    } else {\n      // Current segment is a field name - wrap in objectLoose\n      // Make it optional if it's an intermediate object (not the root)\n      const obj = objectLoose({\n        [segment]: schema,\n      });\n      schema = i > 0 ? obj.optional() : obj;\n    }\n  }\n\n  return schema;\n};\n"]}

package/dist/{chunk-CHNYQVWO.js → chunk-L5TXRTPB.js}

@@ -1,6 +1,9 @@
 import {
   useFormContext
 } from "./chunk-PO5UQAU6.js";
+import {
+  flatArrayKey
+} from "./chunk-76KOVUDN.js";
 import {
   __async
 } from "./chunk-K2V4ULA2.js";
@@ -8,13 +11,15 @@ import {
 // src/hooks/useClientValidation/useClientValidation.ts
 import { useEffect, useId } from "react";
 import { array, objectLoose } from "@fuf-stack/veto";
-var useClientValidation = (data, schemaFactory) => {
+var useClientValidation = (data, schemaFactory, options) => {
+  var _a;
   const {
     formState: { touchedFields },
     validation: { setClientValidationSchema },
     trigger
   } = useFormContext();
-  const key = useId();
+  const autoGeneratedKey = useId();
+  const key = (_a = options == null ? void 0 : options.key) != null ? _a : autoGeneratedKey;
   const dataHash = JSON.stringify(data);
   useEffect(() => {
     if (data != null) {
@@ -40,6 +45,10 @@ var clientValidationSchemaByName = (name, fieldSchema) => {
   for (let i = segments.length - 1; i >= 0; i -= 1) {
     const segment = segments[i];
     const isNumeric = /^\d+$/.test(segment);
+    const isFlatArrayKey = segment === flatArrayKey;
+    if (isFlatArrayKey) {
+      continue;
+    }
     if (isNumeric) {
       schema = array(schema).optional();
     } else {
@@ -56,4 +65,4 @@ export {
   useClientValidation,
   clientValidationSchemaByName
 };
-//# sourceMappingURL=chunk-CHNYQVWO.js.map
+//# sourceMappingURL=chunk-L5TXRTPB.js.map

package/dist/chunk-L5TXRTPB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/useClientValidation/useClientValidation.ts"],"sourcesContent":["import type { VetoTypeAny } from '@fuf-stack/veto';\n\nimport { useEffect, useId } from 'react';\n\nimport { array, objectLoose } from '@fuf-stack/veto';\n\nimport { flatArrayKey } from '../../helpers';\nimport { useFormContext } from '../useFormContext/useFormContext';\n\n/**\n * Hook for adding dynamic client-side validation to forms.\n *\n * Client validation is used for context-dependent validation rules that require external data\n * (e.g., checking if a username already exists). It complements base validation (passed to Form),\n * which handles static rules like \"required\", min/max length, format, etc.\n *\n * **Typical pattern:**\n * - Base validation: Static, always-on rules (required, format, length constraints)\n * - Client validation: Dynamic rules based on external data (uniqueness, business logic)\n * - Client schemas should use `.nullish()` to allow empty values (base validation handles \"required\")\n *\n * Automatically manages validation schema lifecycle: sets schema when data is provided,\n * clears schema when data is null/undefined, and cleans up on unmount. When the client\n * validation schema changes, automatically re-validates all touched fields.\n *\n * @param data - Data to create validation schema from (or null/undefined to clear validation)\n * @param schemaFactory - Function that creates a validation schema from the data. Schemas should typically use `.nullish()`.\n * @param options - Optional configuration object\n * @param options.key - Optional custom key for registration. Useful when multiple instances should share validation (e.g., in field arrays)\n *\n * @example\n * ```tsx\n * // Base validation handles \"required\" and format\n * const baseSchema = veto({ username: vt.string({ min: 3 }) });\n *\n * // Client validation adds dynamic uniqueness check\n * const { data: teamData } = useTeamQuery(teamId);\n * useClientValidation(teamData, (data) =>\n *   vt.objectLoose({\n *     username: vt.string()\n *       .refine(\n *         (value) => !data.existingUsers.includes(value),\n *         { message: 'Username already exists' }\n *       )\n *       .nullish() // Allow empty - base validation handles \"required\"\n *   })\n * );\n * ```\n *\n * @example\n * ```tsx\n * // Using custom key in a field array to avoid multiple registrations\n * fields.map((field, index) => (\n *   useClientValidation(\n *     userData,\n *     (data) => clientValidationSchemaByName(\n *       `items.${index}.name`,\n *       vt.string()\n *         .refine((val) => !data.forbidden.includes(val), { message: 'Name not allowed' })\n *         .nullish()\n *     ),\n *     { key: 'items-validation' } // All instances share the same key\n *   )\n * ));\n * ```\n */\nexport const useClientValidation = <TData = unknown>(\n  data: TData | null | undefined,\n  schemaFactory: (data: TData) => VetoTypeAny,\n  options?: { key?: string },\n): void => {\n  const {\n    formState: { touchedFields },\n    validation: { setClientValidationSchema },\n    trigger,\n  } = useFormContext();\n\n  // Use provided key or auto-generate unique key\n  const autoGeneratedKey = useId();\n  const key = options?.key ?? autoGeneratedKey;\n\n  // Use data hash instead of object reference to avoid unnecessary re-runs\n  // when data object reference changes but data remains the same\n  const dataHash = JSON.stringify(data);\n\n  // Single effect to manage validation schema lifecycle\n  useEffect(() => {\n    // Set validation schema when data is available\n    if (data != null) {\n      const validationSchema = schemaFactory(data);\n      setClientValidationSchema(key, validationSchema);\n    } else {\n      // Clear validation schema when no data\n      setClientValidationSchema(key, null);\n    }\n\n    // Re-validate all touched fields when client validation schema changes\n    const touchedFieldNames = Object.keys(touchedFields);\n    if (touchedFieldNames.length > 0) {\n      // Use setTimeout to ensure the client validation schema update has propagated\n      // before triggering re-validation (fixes race condition)\n      setTimeout(async () => {\n        return trigger(touchedFieldNames);\n      }, 1);\n    }\n\n    // Cleanup on unmount or when dependencies change\n    return () => {\n      setClientValidationSchema(key, null);\n    };\n    // Only re-run when data (dataHash) or key changes\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [dataHash, key]);\n};\n\n/**\n * Helper function to create a veto looseObject schema for a single field with nested path support.\n *\n * Parses field paths (dot-notation) and creates properly nested loose object schemas with array support.\n * All intermediate objects and arrays are marked as optional to allow partial data structures.\n * Numeric segments in the path are treated as array indices, and the parent field is wrapped in an array schema.\n * Supports flat arrays (arrays of primitives) via the special `__FLAT__` key.\n *\n * **Important:** The fieldSchema should typically use `.nullish()` to allow empty values. This is because:\n * - Base validation (passed to Form) handles \"required\" constraints\n * - Client validation adds dynamic, context-dependent rules (e.g., \"username already exists\")\n * - Form data processing converts empty strings in flat arrays to `null` (not `undefined`)\n * - `.nullish()` accepts both `null` and `undefined`, while `.optional()` only accepts `undefined`\n *\n * This pattern ensures client validation only validates non-empty values, while base validation\n * enforces required fields and basic constraints (min length, format, etc.).\n *\n * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name', 'tags.0.__FLAT__')\n * @param fieldSchema - The veto validation schema for the field. Should typically use `.nullish()` to allow empty values.\n * @returns A nested loose object schema matching the field path structure with proper type inference\n *\n * @example\n * ```tsx\n * // Typical usage: base validation handles \"required\", client validation adds dynamic rules\n * // Base validation (in Form component)\n * const baseSchema = veto({ username: vt.string({ min: 3 }) }); // Required + min length\n *\n * // Client validation (dynamic check for existing usernames)\n * const { data: userData } = useUserQuery(userId);\n * useClientValidation(userData, (data) =>\n *   clientValidationSchemaByName(\n *     'username',\n *     vt.string()\n *       .refine(\n *         (value) => !data.existingUsernames.includes(value),\n *         { message: 'Username already taken' }\n *       )\n *       .nullish() // Allow empty - base validation handles \"required\"\n *   )\n * );\n * ```\n *\n * @example\n * ```tsx\n * // Nested field path with dynamic validation\n * clientValidationSchemaByName(\n *   'user.profile.email',\n *   vt.string()\n *     .refine(\n *       (value) => !reservedEmails.includes(value),\n *       { message: 'This email is reserved' }\n *     )\n *     .nullish()\n * )\n * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: ... }).optional() }).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Array of objects with dynamic validation\n * clientValidationSchemaByName(\n *   'items.0.tag',\n *   vt.string()\n *     .refine((value) => !forbiddenTags.includes(value), { message: 'Tag not allowed' })\n *     .nullish()\n * )\n * // => objectLoose({ items: array(objectLoose({ tag: ... })).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Flat array (array of primitives) with dynamic validation\n * clientValidationSchemaByName(\n *   'tags.0.__FLAT__',\n *   vt.string()\n *     .refine((value) => !forbiddenWords.includes(value), { message: 'Word not allowed' })\n *     .nullish()\n * )\n * // => objectLoose({ tags: array(vt.string().refine(...).nullish()).optional() })\n * ```\n */\nexport const clientValidationSchemaByName = <T extends VetoTypeAny>(\n  name: string,\n  fieldSchema: T,\n) => {\n  const segments = name.split('.');\n\n  // Build schema from innermost to outermost\n  let schema: VetoTypeAny = fieldSchema;\n\n  // Process segments in reverse order to build nested structure\n  for (let i = segments.length - 1; i >= 0; i -= 1) {\n    const segment = segments[i];\n\n    const isNumeric = /^\\d+$/.test(segment);\n    const isFlatArrayKey = segment === flatArrayKey;\n\n    if (isFlatArrayKey) {\n      // Skip the __FLAT__ key - it's just a marker for flat arrays\n      // The schema is already correct (primitive type), just continue\n      // eslint-disable-next-line no-continue\n      continue;\n    }\n\n    if (isNumeric) {\n      // Current segment is an array index - wrap current schema in optional array\n      schema = array(schema).optional();\n    } else {\n      // Current segment is a field name - wrap in objectLoose\n      // Make it optional if it's an intermediate object (not the root)\n      const obj = objectLoose({\n        [segment]: schema,\n      });\n      schema = i > 0 ? obj.optional() : obj;\n    }\n  }\n\n  return schema;\n};\n"],"mappings":";;;;;;;;;;;AAEA,SAAS,WAAW,aAAa;AAEjC,SAAS,OAAO,mBAAmB;AA8D5B,IAAM,sBAAsB,CACjC,MACA,eACA,YACS;AAtEX;AAuEE,QAAM;AAAA,IACJ,WAAW,EAAE,cAAc;AAAA,IAC3B,YAAY,EAAE,0BAA0B;AAAA,IACxC;AAAA,EACF,IAAI,eAAe;AAGnB,QAAM,mBAAmB,MAAM;AAC/B,QAAM,OAAM,wCAAS,QAAT,YAAgB;AAI5B,QAAM,WAAW,KAAK,UAAU,IAAI;AAGpC,YAAU,MAAM;AAEd,QAAI,QAAQ,MAAM;AAChB,YAAM,mBAAmB,cAAc,IAAI;AAC3C,gCAA0B,KAAK,gBAAgB;AAAA,IACjD,OAAO;AAEL,gCAA0B,KAAK,IAAI;AAAA,IACrC;AAGA,UAAM,oBAAoB,OAAO,KAAK,aAAa;AACnD,QAAI,kBAAkB,SAAS,GAAG;AAGhC,iBAAW,MAAY;AACrB,eAAO,QAAQ,iBAAiB;AAAA,MAClC,IAAG,CAAC;AAAA,IACN;AAGA,WAAO,MAAM;AACX,gCAA0B,KAAK,IAAI;AAAA,IACrC;AAAA,EAGF,GAAG,CAAC,UAAU,GAAG,CAAC;AACpB;AAmFO,IAAM,+BAA+B,CAC1C,MACA,gBACG;AACH,QAAM,WAAW,KAAK,MAAM,GAAG;AAG/B,MAAI,SAAsB;AAG1B,WAAS,IAAI,SAAS,SAAS,GAAG,KAAK,GAAG,KAAK,GAAG;AAChD,UAAM,UAAU,SAAS,CAAC;AAE1B,UAAM,YAAY,QAAQ,KAAK,OAAO;AACtC,UAAM,iBAAiB,YAAY;AAEnC,QAAI,gBAAgB;AAIlB;AAAA,IACF;AAEA,QAAI,WAAW;AAEb,eAAS,MAAM,MAAM,EAAE,SAAS;AAAA,IAClC,OAAO;AAGL,YAAM,MAAM,YAAY;AAAA,QACtB,CAAC,OAAO,GAAG;AAAA,MACb,CAAC;AACD,eAAS,IAAI,IAAI,IAAI,SAAS,IAAI;AAAA,IACpC;AAAA,EACF;AAEA,SAAO;AACT;","names":[]}

package/dist/hooks/index.cjs

@@ -22,7 +22,7 @@ require('../chunk-OE5BOGGX.cjs');
 
 
 
-var _chunkTEIXBRF5cjs = require('../chunk-TEIXBRF5.cjs');
+var _chunkD5UUY4BDcjs = require('../chunk-D5UUY4BD.cjs');
 
 
 
@@ -40,5 +40,5 @@ require('../chunk-555JRYCS.cjs');
 
 
 
-exports.checkFieldIsRequired = _chunkNZBO4N3Scjs.checkFieldIsRequired; exports.clientValidationSchemaByName = _chunkTEIXBRF5cjs.clientValidationSchemaByName; exports.useClientValidation = _chunkTEIXBRF5cjs.useClientValidation; exports.useController = _chunkJMFDNTVCcjs.useController; exports.useFormContext = _chunkNZBO4N3Scjs.useFormContext; exports.useInput = _chunkPCTYJUY7cjs.useInput; exports.useInputValueDebounce = _chunkBZ5OMN4Ycjs.useInputValueDebounce; exports.useInputValueTransform = _chunk4WYC2RBEcjs.useInputValueTransform; exports.useUniformField = _chunkTGJJZEHBcjs.useUniformField; exports.useUniformFieldArray = _chunkAACO4OEKcjs.useUniformFieldArray;
+exports.checkFieldIsRequired = _chunkNZBO4N3Scjs.checkFieldIsRequired; exports.clientValidationSchemaByName = _chunkD5UUY4BDcjs.clientValidationSchemaByName; exports.useClientValidation = _chunkD5UUY4BDcjs.useClientValidation; exports.useController = _chunkJMFDNTVCcjs.useController; exports.useFormContext = _chunkNZBO4N3Scjs.useFormContext; exports.useInput = _chunkPCTYJUY7cjs.useInput; exports.useInputValueDebounce = _chunkBZ5OMN4Ycjs.useInputValueDebounce; exports.useInputValueTransform = _chunk4WYC2RBEcjs.useInputValueTransform; exports.useUniformField = _chunkTGJJZEHBcjs.useUniformField; exports.useUniformFieldArray = _chunkAACO4OEKcjs.useUniformFieldArray;
 //# sourceMappingURL=index.cjs.map

package/dist/hooks/index.d.cts

@@ -6,7 +6,7 @@ export { useInput } from '@heroui/input';
 export { UseInputValueDebounceOptions, UseInputValueDebounceReturn, useInputValueDebounce } from './useInputValueDebounce/index.cjs';
 export { InputValueTransform, UseInputValueTransformOptions, UseInputValueTransformReturn, useInputValueTransform } from './useInputValueTransform/index.cjs';
 export { UseUniformFieldParams, UseUniformFieldReturn, useUniformField } from './useUniformField/index.cjs';
-import '@fuf-stack/veto/dist/types.d-CNPgNK-V';
+import '@fuf-stack/veto/dist/types.d-Dzd6j9xO';
 import '@fuf-stack/veto';
 import 'react-hook-form';
 import 'react';

package/dist/hooks/index.d.ts

@@ -6,7 +6,7 @@ export { useInput } from '@heroui/input';
 export { UseInputValueDebounceOptions, UseInputValueDebounceReturn, useInputValueDebounce } from './useInputValueDebounce/index.js';
 export { InputValueTransform, UseInputValueTransformOptions, UseInputValueTransformReturn, useInputValueTransform } from './useInputValueTransform/index.js';
 export { UseUniformFieldParams, UseUniformFieldReturn, useUniformField } from './useUniformField/index.js';
-import '@fuf-stack/veto/dist/types.d-CNPgNK-V';
+import '@fuf-stack/veto/dist/types.d-Dzd6j9xO';
 import '@fuf-stack/veto';
 import 'react-hook-form';
 import 'react';

package/dist/hooks/index.js

@@ -22,7 +22,7 @@ import "../chunk-NTDKZW4E.js";
 import {
   clientValidationSchemaByName,
   useClientValidation
-} from "../chunk-CHNYQVWO.js";
+} from "../chunk-L5TXRTPB.js";
 import {
   checkFieldIsRequired,
   useFormContext

package/dist/hooks/useClientValidation/index.cjs

@@ -1,12 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunkTEIXBRF5cjs = require('../../chunk-TEIXBRF5.cjs');
+var _chunkD5UUY4BDcjs = require('../../chunk-D5UUY4BD.cjs');
 require('../../chunk-NZBO4N3S.cjs');
 require('../../chunk-Z353BLWI.cjs');
 require('../../chunk-555JRYCS.cjs');
 
 
 
-exports.clientValidationSchemaByName = _chunkTEIXBRF5cjs.clientValidationSchemaByName; exports.useClientValidation = _chunkTEIXBRF5cjs.useClientValidation;
+exports.clientValidationSchemaByName = _chunkD5UUY4BDcjs.clientValidationSchemaByName; exports.useClientValidation = _chunkD5UUY4BDcjs.useClientValidation;
 //# sourceMappingURL=index.cjs.map

package/dist/hooks/useClientValidation/index.d.cts

@@ -1,78 +1,147 @@
-import * as _fuf_stack_veto_dist_types_d_CNPgNK_V from '@fuf-stack/veto/dist/types.d-CNPgNK-V';
+import * as _fuf_stack_veto_dist_types_d_Dzd6j9xO from '@fuf-stack/veto/dist/types.d-Dzd6j9xO';
 import { VetoTypeAny } from '@fuf-stack/veto';
 
 /**
  * Hook for adding dynamic client-side validation to forms.
  *
- * Automatically manages validation schema lifecycle: sets schema when data is provided,
- * clears schema when data is null/undefined, and cleans up on unmount.
+ * Client validation is used for context-dependent validation rules that require external data
+ * (e.g., checking if a username already exists). It complements base validation (passed to Form),
+ * which handles static rules like "required", min/max length, format, etc.
+ *
+ * **Typical pattern:**
+ * - Base validation: Static, always-on rules (required, format, length constraints)
+ * - Client validation: Dynamic rules based on external data (uniqueness, business logic)
+ * - Client schemas should use `.nullish()` to allow empty values (base validation handles "required")
  *
- * When the client validation schema changes, automatically re-validates all touched
- * fields to ensure they are validated against the new schema.
+ * Automatically manages validation schema lifecycle: sets schema when data is provided,
+ * clears schema when data is null/undefined, and cleans up on unmount. When the client
+ * validation schema changes, automatically re-validates all touched fields.
  *
  * @param data - Data to create validation schema from (or null/undefined to clear validation)
- * @param schemaFactory - Function that creates a validation schema from the data.
+ * @param schemaFactory - Function that creates a validation schema from the data. Schemas should typically use `.nullish()`.
+ * @param options - Optional configuration object
+ * @param options.key - Optional custom key for registration. Useful when multiple instances should share validation (e.g., in field arrays)
  *
  * @example
  * ```tsx
- * const { data: teamData } = useTeamQuery(teamId);
+ * // Base validation handles "required" and format
+ * const baseSchema = veto({ username: vt.string({ min: 3 }) });
  *
+ * // Client validation adds dynamic uniqueness check
+ * const { data: teamData } = useTeamQuery(teamId);
  * useClientValidation(teamData, (data) =>
- *   vt.object({
- *     username: vt.string().refine(
- *       (value) => !data.existingUsers.includes(value),
- *       { message: 'Username already exists' }
- *     )
+ *   vt.objectLoose({
+ *     username: vt.string()
+ *       .refine(
+ *         (value) => !data.existingUsers.includes(value),
+ *         { message: 'Username already exists' }
+ *       )
+ *       .nullish() // Allow empty - base validation handles "required"
  *   })
  * );
  * ```
+ *
+ * @example
+ * ```tsx
+ * // Using custom key in a field array to avoid multiple registrations
+ * fields.map((field, index) => (
+ *   useClientValidation(
+ *     userData,
+ *     (data) => clientValidationSchemaByName(
+ *       `items.${index}.name`,
+ *       vt.string()
+ *         .refine((val) => !data.forbidden.includes(val), { message: 'Name not allowed' })
+ *         .nullish()
+ *     ),
+ *     { key: 'items-validation' } // All instances share the same key
+ *   )
+ * ));
+ * ```
  */
-declare const useClientValidation: <TData = unknown>(data: TData | null | undefined, schemaFactory: (data: TData) => VetoTypeAny) => void;
+declare const useClientValidation: <TData = unknown>(data: TData | null | undefined, schemaFactory: (data: TData) => VetoTypeAny, options?: {
+    key?: string;
+}) => void;
 /**
  * Helper function to create a veto looseObject schema for a single field with nested path support.
  *
  * Parses field paths (dot-notation) and creates properly nested loose object schemas with array support.
  * All intermediate objects and arrays are marked as optional to allow partial data structures.
  * Numeric segments in the path are treated as array indices, and the parent field is wrapped in an array schema.
+ * Supports flat arrays (arrays of primitives) via the special `__FLAT__` key.
+ *
+ * **Important:** The fieldSchema should typically use `.nullish()` to allow empty values. This is because:
+ * - Base validation (passed to Form) handles "required" constraints
+ * - Client validation adds dynamic, context-dependent rules (e.g., "username already exists")
+ * - Form data processing converts empty strings in flat arrays to `null` (not `undefined`)
+ * - `.nullish()` accepts both `null` and `undefined`, while `.optional()` only accepts `undefined`
  *
- * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name')
- * @param fieldSchema - The veto validation schema for the field
+ * This pattern ensures client validation only validates non-empty values, while base validation
+ * enforces required fields and basic constraints (min length, format, etc.).
+ *
+ * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name', 'tags.0.__FLAT__')
+ * @param fieldSchema - The veto validation schema for the field. Should typically use `.nullish()` to allow empty values.
  * @returns A nested loose object schema matching the field path structure with proper type inference
  *
  * @example
  * ```tsx
- * // Simple field
- * clientValidationSchemaByName('username', vt.string())
- * // => objectLoose({ username: vt.string() })
+ * // Typical usage: base validation handles "required", client validation adds dynamic rules
+ * // Base validation (in Form component)
+ * const baseSchema = veto({ username: vt.string({ min: 3 }) }); // Required + min length
+ *
+ * // Client validation (dynamic check for existing usernames)
+ * const { data: userData } = useUserQuery(userId);
+ * useClientValidation(userData, (data) =>
+ *   clientValidationSchemaByName(
+ *     'username',
+ *     vt.string()
+ *       .refine(
+ *         (value) => !data.existingUsernames.includes(value),
+ *         { message: 'Username already taken' }
+ *       )
+ *       .nullish() // Allow empty - base validation handles "required"
+ *   )
+ * );
  * ```
  *
  * @example
  * ```tsx
- * // Nested field (with optional intermediate objects)
- * clientValidationSchemaByName('user.profile.email', vt.string().email())
- * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: vt.string().email() }).optional() }).optional() })
+ * // Nested field path with dynamic validation
+ * clientValidationSchemaByName(
+ *   'user.profile.email',
+ *   vt.string()
+ *     .refine(
+ *       (value) => !reservedEmails.includes(value),
+ *       { message: 'This email is reserved' }
+ *     )
+ *     .nullish()
+ * )
+ * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: ... }).optional() }).optional() })
  * ```
  *
  * @example
  * ```tsx
- * // Array field (with optional array)
- * clientValidationSchemaByName('items.0.name', vt.string())
- * // => objectLoose({ items: array(objectLoose({ name: vt.string() })).optional() })
+ * // Array of objects with dynamic validation
+ * clientValidationSchemaByName(
+ *   'items.0.tag',
+ *   vt.string()
+ *     .refine((value) => !forbiddenTags.includes(value), { message: 'Tag not allowed' })
+ *     .nullish()
+ * )
+ * // => objectLoose({ items: array(objectLoose({ tag: ... })).optional() })
  * ```
  *
  * @example
  * ```tsx
- * // Usage with useClientValidation
- * const { data: userData } = useUserQuery(userId);
- *
- * useClientValidation(userData, (data) =>
- *   clientValidationSchemaByName('username', vt.string().refine(
- *     (value) => !data.existingUsernames.includes(value),
- *     { message: 'Username already taken' }
- *   ))
- * );
+ * // Flat array (array of primitives) with dynamic validation
+ * clientValidationSchemaByName(
+ *   'tags.0.__FLAT__',
+ *   vt.string()
+ *     .refine((value) => !forbiddenWords.includes(value), { message: 'Word not allowed' })
+ *     .nullish()
+ * )
+ * // => objectLoose({ tags: array(vt.string().refine(...).nullish()).optional() })
  * ```
  */
-declare const clientValidationSchemaByName: <T extends VetoTypeAny>(name: string, fieldSchema: T) => _fuf_stack_veto_dist_types_d_CNPgNK_V.Z;
+declare const clientValidationSchemaByName: <T extends VetoTypeAny>(name: string, fieldSchema: T) => _fuf_stack_veto_dist_types_d_Dzd6j9xO.Z;
 
 export { clientValidationSchemaByName, useClientValidation };

package/dist/hooks/useClientValidation/index.d.ts

@@ -1,78 +1,147 @@
-import * as _fuf_stack_veto_dist_types_d_CNPgNK_V from '@fuf-stack/veto/dist/types.d-CNPgNK-V';
+import * as _fuf_stack_veto_dist_types_d_Dzd6j9xO from '@fuf-stack/veto/dist/types.d-Dzd6j9xO';
 import { VetoTypeAny } from '@fuf-stack/veto';
 
 /**
  * Hook for adding dynamic client-side validation to forms.
  *
- * Automatically manages validation schema lifecycle: sets schema when data is provided,
- * clears schema when data is null/undefined, and cleans up on unmount.
+ * Client validation is used for context-dependent validation rules that require external data
+ * (e.g., checking if a username already exists). It complements base validation (passed to Form),
+ * which handles static rules like "required", min/max length, format, etc.
+ *
+ * **Typical pattern:**
+ * - Base validation: Static, always-on rules (required, format, length constraints)
+ * - Client validation: Dynamic rules based on external data (uniqueness, business logic)
+ * - Client schemas should use `.nullish()` to allow empty values (base validation handles "required")
  *
- * When the client validation schema changes, automatically re-validates all touched
- * fields to ensure they are validated against the new schema.
+ * Automatically manages validation schema lifecycle: sets schema when data is provided,
+ * clears schema when data is null/undefined, and cleans up on unmount. When the client
+ * validation schema changes, automatically re-validates all touched fields.
  *
  * @param data - Data to create validation schema from (or null/undefined to clear validation)
- * @param schemaFactory - Function that creates a validation schema from the data.
+ * @param schemaFactory - Function that creates a validation schema from the data. Schemas should typically use `.nullish()`.
+ * @param options - Optional configuration object
+ * @param options.key - Optional custom key for registration. Useful when multiple instances should share validation (e.g., in field arrays)
  *
  * @example
  * ```tsx
- * const { data: teamData } = useTeamQuery(teamId);
+ * // Base validation handles "required" and format
+ * const baseSchema = veto({ username: vt.string({ min: 3 }) });
  *
+ * // Client validation adds dynamic uniqueness check
+ * const { data: teamData } = useTeamQuery(teamId);
  * useClientValidation(teamData, (data) =>
- *   vt.object({
- *     username: vt.string().refine(
- *       (value) => !data.existingUsers.includes(value),
- *       { message: 'Username already exists' }
- *     )
+ *   vt.objectLoose({
+ *     username: vt.string()
+ *       .refine(
+ *         (value) => !data.existingUsers.includes(value),
+ *         { message: 'Username already exists' }
+ *       )
+ *       .nullish() // Allow empty - base validation handles "required"
  *   })
  * );
  * ```
+ *
+ * @example
+ * ```tsx
+ * // Using custom key in a field array to avoid multiple registrations
+ * fields.map((field, index) => (
+ *   useClientValidation(
+ *     userData,
+ *     (data) => clientValidationSchemaByName(
+ *       `items.${index}.name`,
+ *       vt.string()
+ *         .refine((val) => !data.forbidden.includes(val), { message: 'Name not allowed' })
+ *         .nullish()
+ *     ),
+ *     { key: 'items-validation' } // All instances share the same key
+ *   )
+ * ));
+ * ```
  */
-declare const useClientValidation: <TData = unknown>(data: TData | null | undefined, schemaFactory: (data: TData) => VetoTypeAny) => void;
+declare const useClientValidation: <TData = unknown>(data: TData | null | undefined, schemaFactory: (data: TData) => VetoTypeAny, options?: {
+    key?: string;
+}) => void;
 /**
  * Helper function to create a veto looseObject schema for a single field with nested path support.
  *
  * Parses field paths (dot-notation) and creates properly nested loose object schemas with array support.
  * All intermediate objects and arrays are marked as optional to allow partial data structures.
  * Numeric segments in the path are treated as array indices, and the parent field is wrapped in an array schema.
+ * Supports flat arrays (arrays of primitives) via the special `__FLAT__` key.
+ *
+ * **Important:** The fieldSchema should typically use `.nullish()` to allow empty values. This is because:
+ * - Base validation (passed to Form) handles "required" constraints
+ * - Client validation adds dynamic, context-dependent rules (e.g., "username already exists")
+ * - Form data processing converts empty strings in flat arrays to `null` (not `undefined`)
+ * - `.nullish()` accepts both `null` and `undefined`, while `.optional()` only accepts `undefined`
  *
- * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name')
- * @param fieldSchema - The veto validation schema for the field
+ * This pattern ensures client validation only validates non-empty values, while base validation
+ * enforces required fields and basic constraints (min length, format, etc.).
+ *
+ * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name', 'tags.0.__FLAT__')
+ * @param fieldSchema - The veto validation schema for the field. Should typically use `.nullish()` to allow empty values.
  * @returns A nested loose object schema matching the field path structure with proper type inference
  *
  * @example
  * ```tsx
- * // Simple field
- * clientValidationSchemaByName('username', vt.string())
- * // => objectLoose({ username: vt.string() })
+ * // Typical usage: base validation handles "required", client validation adds dynamic rules
+ * // Base validation (in Form component)
+ * const baseSchema = veto({ username: vt.string({ min: 3 }) }); // Required + min length
+ *
+ * // Client validation (dynamic check for existing usernames)
+ * const { data: userData } = useUserQuery(userId);
+ * useClientValidation(userData, (data) =>
+ *   clientValidationSchemaByName(
+ *     'username',
+ *     vt.string()
+ *       .refine(
+ *         (value) => !data.existingUsernames.includes(value),
+ *         { message: 'Username already taken' }
+ *       )
+ *       .nullish() // Allow empty - base validation handles "required"
+ *   )
+ * );
  * ```
  *
  * @example
  * ```tsx
- * // Nested field (with optional intermediate objects)
- * clientValidationSchemaByName('user.profile.email', vt.string().email())
- * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: vt.string().email() }).optional() }).optional() })
+ * // Nested field path with dynamic validation
+ * clientValidationSchemaByName(
+ *   'user.profile.email',
+ *   vt.string()
+ *     .refine(
+ *       (value) => !reservedEmails.includes(value),
+ *       { message: 'This email is reserved' }
+ *     )
+ *     .nullish()
+ * )
+ * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: ... }).optional() }).optional() })
  * ```
  *
  * @example
  * ```tsx
- * // Array field (with optional array)
- * clientValidationSchemaByName('items.0.name', vt.string())
- * // => objectLoose({ items: array(objectLoose({ name: vt.string() })).optional() })
+ * // Array of objects with dynamic validation
+ * clientValidationSchemaByName(
+ *   'items.0.tag',
+ *   vt.string()
+ *     .refine((value) => !forbiddenTags.includes(value), { message: 'Tag not allowed' })
+ *     .nullish()
+ * )
+ * // => objectLoose({ items: array(objectLoose({ tag: ... })).optional() })
  * ```
  *
  * @example
  * ```tsx
- * // Usage with useClientValidation
- * const { data: userData } = useUserQuery(userId);
- *
- * useClientValidation(userData, (data) =>
- *   clientValidationSchemaByName('username', vt.string().refine(
- *     (value) => !data.existingUsernames.includes(value),
- *     { message: 'Username already taken' }
- *   ))
- * );
+ * // Flat array (array of primitives) with dynamic validation
+ * clientValidationSchemaByName(
+ *   'tags.0.__FLAT__',
+ *   vt.string()
+ *     .refine((value) => !forbiddenWords.includes(value), { message: 'Word not allowed' })
+ *     .nullish()
+ * )
+ * // => objectLoose({ tags: array(vt.string().refine(...).nullish()).optional() })
  * ```
  */
-declare const clientValidationSchemaByName: <T extends VetoTypeAny>(name: string, fieldSchema: T) => _fuf_stack_veto_dist_types_d_CNPgNK_V.Z;
+declare const clientValidationSchemaByName: <T extends VetoTypeAny>(name: string, fieldSchema: T) => _fuf_stack_veto_dist_types_d_Dzd6j9xO.Z;
 
 export { clientValidationSchemaByName, useClientValidation };

package/dist/hooks/useClientValidation/index.js

@@ -1,7 +1,7 @@
 import {
   clientValidationSchemaByName,
   useClientValidation
-} from "../../chunk-CHNYQVWO.js";
+} from "../../chunk-L5TXRTPB.js";
 import "../../chunk-PO5UQAU6.js";
 import "../../chunk-76KOVUDN.js";
 import "../../chunk-K2V4ULA2.js";

package/dist/index.cjs

@@ -62,7 +62,7 @@ var _chunkOE5BOGGXcjs = require('./chunk-OE5BOGGX.cjs');
 
 
 
-var _chunkTEIXBRF5cjs = require('./chunk-TEIXBRF5.cjs');
+var _chunkD5UUY4BDcjs = require('./chunk-D5UUY4BD.cjs');
 
 
 
@@ -105,5 +105,5 @@ require('./chunk-555JRYCS.cjs');
 
 
 
-exports.Checkboxes = _chunkRMCPVDACcjs.Checkboxes_default; exports.FieldArray = _chunkIYULWK4Hcjs.FieldArray_default; exports.FieldCopyTestIdButton = _chunkOE5BOGGXcjs.FieldCopyTestIdButton_default; exports.FieldValidationError = _chunkNHEZXA4Hcjs.FieldValidationError_default; exports.Form = _chunkWFO4XPA3cjs.Form_default; exports.Grid = _chunkTTD3KL6Ecjs.Grid_default; exports.Input = _chunkF6JQYB53cjs.Input_default; exports.RadioBoxes = _chunkVPUMTPD3cjs.RadioBoxes_default; exports.RadioTabs = _chunk345LYO4Hcjs.RadioTabs_default; exports.Radios = _chunkE4DCVJS5cjs.Radios_default; exports.Select = _chunkA5Z75X7Mcjs.Select_default; exports.SubmitButton = _chunkOJHD2XHDcjs.SubmitButton_default; exports.Switch = _chunkXJBGXFVXcjs.Switch_default; exports.TextArea = _chunkNZIAIYPScjs.TextArea_default; exports.checkFieldIsRequired = _chunkNZBO4N3Scjs.checkFieldIsRequired; exports.clientValidationSchemaByName = _chunkTEIXBRF5cjs.clientValidationSchemaByName; exports.flatArrayKey = _chunkZ353BLWIcjs.flatArrayKey; exports.fromNullishString = _chunkZ353BLWIcjs.fromNullishString; exports.toFormFormat = _chunkZ353BLWIcjs.toFormFormat; exports.toNullishString = _chunkZ353BLWIcjs.toNullishString; exports.toValidationFormat = _chunkZ353BLWIcjs.toValidationFormat; exports.useClientValidation = _chunkTEIXBRF5cjs.useClientValidation; exports.useController = _chunkJMFDNTVCcjs.useController; exports.useFormContext = _chunkNZBO4N3Scjs.useFormContext; exports.useInput = _chunkPCTYJUY7cjs.useInput; exports.useInputValueDebounce = _chunkBZ5OMN4Ycjs.useInputValueDebounce; exports.useInputValueTransform = _chunk4WYC2RBEcjs.useInputValueTransform; exports.useUniformField = _chunkTGJJZEHBcjs.useUniformField; exports.useUniformFieldArray = _chunkAACO4OEKcjs.useUniformFieldArray;
+exports.Checkboxes = _chunkRMCPVDACcjs.Checkboxes_default; exports.FieldArray = _chunkIYULWK4Hcjs.FieldArray_default; exports.FieldCopyTestIdButton = _chunkOE5BOGGXcjs.FieldCopyTestIdButton_default; exports.FieldValidationError = _chunkNHEZXA4Hcjs.FieldValidationError_default; exports.Form = _chunkWFO4XPA3cjs.Form_default; exports.Grid = _chunkTTD3KL6Ecjs.Grid_default; exports.Input = _chunkF6JQYB53cjs.Input_default; exports.RadioBoxes = _chunkVPUMTPD3cjs.RadioBoxes_default; exports.RadioTabs = _chunk345LYO4Hcjs.RadioTabs_default; exports.Radios = _chunkE4DCVJS5cjs.Radios_default; exports.Select = _chunkA5Z75X7Mcjs.Select_default; exports.SubmitButton = _chunkOJHD2XHDcjs.SubmitButton_default; exports.Switch = _chunkXJBGXFVXcjs.Switch_default; exports.TextArea = _chunkNZIAIYPScjs.TextArea_default; exports.checkFieldIsRequired = _chunkNZBO4N3Scjs.checkFieldIsRequired; exports.clientValidationSchemaByName = _chunkD5UUY4BDcjs.clientValidationSchemaByName; exports.flatArrayKey = _chunkZ353BLWIcjs.flatArrayKey; exports.fromNullishString = _chunkZ353BLWIcjs.fromNullishString; exports.toFormFormat = _chunkZ353BLWIcjs.toFormFormat; exports.toNullishString = _chunkZ353BLWIcjs.toNullishString; exports.toValidationFormat = _chunkZ353BLWIcjs.toValidationFormat; exports.useClientValidation = _chunkD5UUY4BDcjs.useClientValidation; exports.useController = _chunkJMFDNTVCcjs.useController; exports.useFormContext = _chunkNZBO4N3Scjs.useFormContext; exports.useInput = _chunkPCTYJUY7cjs.useInput; exports.useInputValueDebounce = _chunkBZ5OMN4Ycjs.useInputValueDebounce; exports.useInputValueTransform = _chunk4WYC2RBEcjs.useInputValueTransform; exports.useUniformField = _chunkTGJJZEHBcjs.useUniformField; exports.useUniformFieldArray = _chunkAACO4OEKcjs.useUniformFieldArray;
 //# sourceMappingURL=index.cjs.map

package/dist/index.d.cts

@@ -28,7 +28,7 @@ import 'react';
 import '@fuf-stack/veto';
 import 'react-hook-form';
 import './FormContext-LRho0tno.cjs';
-import '@fuf-stack/veto/dist/types.d-CNPgNK-V';
+import '@fuf-stack/veto/dist/types.d-Dzd6j9xO';
 import '@fuf-stack/pixels';
 import 'react-select';
 import '@heroui/switch';

package/dist/index.d.ts

@@ -28,7 +28,7 @@ import 'react';
 import '@fuf-stack/veto';
 import 'react-hook-form';
 import './FormContext-LRho0tno.js';
-import '@fuf-stack/veto/dist/types.d-CNPgNK-V';
+import '@fuf-stack/veto/dist/types.d-Dzd6j9xO';
 import '@fuf-stack/pixels';
 import 'react-select';
 import '@heroui/switch';

package/dist/index.js

@@ -62,7 +62,7 @@ import {
 import {
   clientValidationSchemaByName,
   useClientValidation
-} from "./chunk-CHNYQVWO.js";
+} from "./chunk-L5TXRTPB.js";
 import {
   checkFieldIsRequired,
   useFormContext

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fuf-stack/uniform",
-  "version": "1.6.1",
+  "version": "1.6.2",
   "description": "fuf react form library",
   "author": "Fröhlich ∧ Frei",
   "homepage": "https://github.com/fuf-stack/pixels#readme",

package/dist/chunk-CHNYQVWO.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/hooks/useClientValidation/useClientValidation.ts"],"sourcesContent":["import type { VetoTypeAny } from '@fuf-stack/veto';\n\nimport { useEffect, useId } from 'react';\n\nimport { array, objectLoose } from '@fuf-stack/veto';\n\nimport { useFormContext } from '../useFormContext/useFormContext';\n\n/**\n * Hook for adding dynamic client-side validation to forms.\n *\n * Automatically manages validation schema lifecycle: sets schema when data is provided,\n * clears schema when data is null/undefined, and cleans up on unmount.\n *\n * When the client validation schema changes, automatically re-validates all touched\n * fields to ensure they are validated against the new schema.\n *\n * @param data - Data to create validation schema from (or null/undefined to clear validation)\n * @param schemaFactory - Function that creates a validation schema from the data.\n *\n * @example\n * ```tsx\n * const { data: teamData } = useTeamQuery(teamId);\n *\n * useClientValidation(teamData, (data) =>\n *   vt.object({\n *     username: vt.string().refine(\n *       (value) => !data.existingUsers.includes(value),\n *       { message: 'Username already exists' }\n *     )\n *   })\n * );\n * ```\n */\nexport const useClientValidation = <TData = unknown>(\n  data: TData | null | undefined,\n  schemaFactory: (data: TData) => VetoTypeAny,\n): void => {\n  const {\n    formState: { touchedFields },\n    validation: { setClientValidationSchema },\n    trigger,\n  } = useFormContext();\n\n  // Auto-generate unique key\n  const key = useId();\n\n  // Use data hash instead of object reference to avoid unnecessary re-runs\n  // when data object reference changes but data remains the same\n  const dataHash = JSON.stringify(data);\n\n  // Single effect to manage validation schema lifecycle\n  useEffect(() => {\n    // Set validation schema when data is available\n    if (data != null) {\n      const validationSchema = schemaFactory(data);\n      setClientValidationSchema(key, validationSchema);\n    } else {\n      // Clear validation schema when no data\n      setClientValidationSchema(key, null);\n    }\n\n    // Re-validate all touched fields when client validation schema changes\n    const touchedFieldNames = Object.keys(touchedFields);\n    if (touchedFieldNames.length > 0) {\n      // Use setTimeout to ensure the client validation schema update has propagated\n      // before triggering re-validation (fixes race condition)\n      setTimeout(async () => {\n        return trigger(touchedFieldNames);\n      }, 1);\n    }\n\n    // Cleanup on unmount or when dependencies change\n    return () => {\n      setClientValidationSchema(key, null);\n    };\n    // Only re-run when data (dataHash) or key changes\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [dataHash, key]);\n};\n\n/**\n * Helper function to create a veto looseObject schema for a single field with nested path support.\n *\n * Parses field paths (dot-notation) and creates properly nested loose object schemas with array support.\n * All intermediate objects and arrays are marked as optional to allow partial data structures.\n * Numeric segments in the path are treated as array indices, and the parent field is wrapped in an array schema.\n *\n * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name')\n * @param fieldSchema - The veto validation schema for the field\n * @returns A nested loose object schema matching the field path structure with proper type inference\n *\n * @example\n * ```tsx\n * // Simple field\n * clientValidationSchemaByName('username', vt.string())\n * // => objectLoose({ username: vt.string() })\n * ```\n *\n * @example\n * ```tsx\n * // Nested field (with optional intermediate objects)\n * clientValidationSchemaByName('user.profile.email', vt.string().email())\n * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: vt.string().email() }).optional() }).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Array field (with optional array)\n * clientValidationSchemaByName('items.0.name', vt.string())\n * // => objectLoose({ items: array(objectLoose({ name: vt.string() })).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Usage with useClientValidation\n * const { data: userData } = useUserQuery(userId);\n *\n * useClientValidation(userData, (data) =>\n *   clientValidationSchemaByName('username', vt.string().refine(\n *     (value) => !data.existingUsernames.includes(value),\n *     { message: 'Username already taken' }\n *   ))\n * );\n * ```\n */\nexport const clientValidationSchemaByName = <T extends VetoTypeAny>(\n  name: string,\n  fieldSchema: T,\n) => {\n  const segments = name.split('.');\n\n  // Build schema from innermost to outermost\n  let schema: VetoTypeAny = fieldSchema;\n\n  // Process segments in reverse order to build nested structure\n  for (let i = segments.length - 1; i >= 0; i -= 1) {\n    const segment = segments[i];\n    const isNumeric = /^\\d+$/.test(segment);\n\n    if (isNumeric) {\n      // Current segment is an array index - wrap current schema in optional array\n      schema = array(schema).optional();\n    } else {\n      // Current segment is a field name - wrap in objectLoose\n      // Make it optional if it's an intermediate object (not the root)\n      const obj = objectLoose({\n        [segment]: schema,\n      });\n      schema = i > 0 ? obj.optional() : obj;\n    }\n  }\n\n  return schema;\n};\n"],"mappings":";;;;;;;;AAEA,SAAS,WAAW,aAAa;AAEjC,SAAS,OAAO,mBAAmB;AA8B5B,IAAM,sBAAsB,CACjC,MACA,kBACS;AACT,QAAM;AAAA,IACJ,WAAW,EAAE,cAAc;AAAA,IAC3B,YAAY,EAAE,0BAA0B;AAAA,IACxC;AAAA,EACF,IAAI,eAAe;AAGnB,QAAM,MAAM,MAAM;AAIlB,QAAM,WAAW,KAAK,UAAU,IAAI;AAGpC,YAAU,MAAM;AAEd,QAAI,QAAQ,MAAM;AAChB,YAAM,mBAAmB,cAAc,IAAI;AAC3C,gCAA0B,KAAK,gBAAgB;AAAA,IACjD,OAAO;AAEL,gCAA0B,KAAK,IAAI;AAAA,IACrC;AAGA,UAAM,oBAAoB,OAAO,KAAK,aAAa;AACnD,QAAI,kBAAkB,SAAS,GAAG;AAGhC,iBAAW,MAAY;AACrB,eAAO,QAAQ,iBAAiB;AAAA,MAClC,IAAG,CAAC;AAAA,IACN;AAGA,WAAO,MAAM;AACX,gCAA0B,KAAK,IAAI;AAAA,IACrC;AAAA,EAGF,GAAG,CAAC,UAAU,GAAG,CAAC;AACpB;AA+CO,IAAM,+BAA+B,CAC1C,MACA,gBACG;AACH,QAAM,WAAW,KAAK,MAAM,GAAG;AAG/B,MAAI,SAAsB;AAG1B,WAAS,IAAI,SAAS,SAAS,GAAG,KAAK,GAAG,KAAK,GAAG;AAChD,UAAM,UAAU,SAAS,CAAC;AAC1B,UAAM,YAAY,QAAQ,KAAK,OAAO;AAEtC,QAAI,WAAW;AAEb,eAAS,MAAM,MAAM,EAAE,SAAS;AAAA,IAClC,OAAO;AAGL,YAAM,MAAM,YAAY;AAAA,QACtB,CAAC,OAAO,GAAG;AAAA,MACb,CAAC;AACD,eAAS,IAAI,IAAI,IAAI,SAAS,IAAI;AAAA,IACpC;AAAA,EACF;AAEA,SAAO;AACT;","names":[]}

package/dist/chunk-TEIXBRF5.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-TEIXBRF5.cjs","../src/hooks/useClientValidation/useClientValidation.ts"],"names":[],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACLA,8BAAiC;AAEjC,uCAAmC;AA8B5B,IAAM,oBAAA,EAAsB,CACjC,IAAA,EACA,aAAA,EAAA,GACS;AACT,EAAA,MAAM;AAAA,IACJ,SAAA,EAAW,EAAE,cAAc,CAAA;AAAA,IAC3B,UAAA,EAAY,EAAE,0BAA0B,CAAA;AAAA,IACxC;AAAA,EACF,EAAA,EAAI,8CAAA,CAAe;AAGnB,EAAA,MAAM,IAAA,EAAM,0BAAA,CAAM;AAIlB,EAAA,MAAM,SAAA,EAAW,IAAA,CAAK,SAAA,CAAU,IAAI,CAAA;AAGpC,EAAA,8BAAA,CAAU,EAAA,GAAM;AAEd,IAAA,GAAA,CAAI,KAAA,GAAQ,IAAA,EAAM;AAChB,MAAA,MAAM,iBAAA,EAAmB,aAAA,CAAc,IAAI,CAAA;AAC3C,MAAA,yBAAA,CAA0B,GAAA,EAAK,gBAAgB,CAAA;AAAA,IACjD,EAAA,KAAO;AAEL,MAAA,yBAAA,CAA0B,GAAA,EAAK,IAAI,CAAA;AAAA,IACrC;AAGA,IAAA,MAAM,kBAAA,EAAoB,MAAA,CAAO,IAAA,CAAK,aAAa,CAAA;AACnD,IAAA,GAAA,CAAI,iBAAA,CAAkB,OAAA,EAAS,CAAA,EAAG;AAGhC,MAAA,UAAA,CAAW,CAAA,EAAA,GAAY,uCAAA,IAAA,EAAA,IAAA,EAAA,QAAA,EAAA,CAAA,EAAA;AACrB,QAAA,OAAO,OAAA,CAAQ,iBAAiB,CAAA;AAAA,MAClC,CAAA,CAAA,EAAG,CAAC,CAAA;AAAA,IACN;AAGA,IAAA,OAAO,CAAA,EAAA,GAAM;AACX,MAAA,yBAAA,CAA0B,GAAA,EAAK,IAAI,CAAA;AAAA,IACrC,CAAA;AAAA,EAGF,CAAA,EAAG,CAAC,QAAA,EAAU,GAAG,CAAC,CAAA;AACpB,CAAA;AA+CO,IAAM,6BAAA,EAA+B,CAC1C,IAAA,EACA,WAAA,EAAA,GACG;AACH,EAAA,MAAM,SAAA,EAAW,IAAA,CAAK,KAAA,CAAM,GAAG,CAAA;AAG/B,EAAA,IAAI,OAAA,EAAsB,WAAA;AAG1B,EAAA,IAAA,CAAA,IAAS,EAAA,EAAI,QAAA,CAAS,OAAA,EAAS,CAAA,EAAG,EAAA,GAAK,CAAA,EAAG,EAAA,GAAK,CAAA,EAAG;AAChD,IAAA,MAAM,QAAA,EAAU,QAAA,CAAS,CAAC,CAAA;AAC1B,IAAA,MAAM,UAAA,EAAY,OAAA,CAAQ,IAAA,CAAK,OAAO,CAAA;AAEtC,IAAA,GAAA,CAAI,SAAA,EAAW;AAEb,MAAA,OAAA,EAAS,yBAAA,MAAY,CAAA,CAAE,QAAA,CAAS,CAAA;AAAA,IAClC,EAAA,KAAO;AAGL,MAAA,MAAM,IAAA,EAAM,+BAAA;AAAY,QACtB,CAAC,OAAO,CAAA,EAAG;AAAA,MACb,CAAC,CAAA;AACD,MAAA,OAAA,EAAS,EAAA,EAAI,EAAA,EAAI,GAAA,CAAI,QAAA,CAAS,EAAA,EAAI,GAAA;AAAA,IACpC;AAAA,EACF;AAEA,EAAA,OAAO,MAAA;AACT,CAAA;ADrGA;AACA;AACE;AACA;AACF,uHAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-TEIXBRF5.cjs","sourcesContent":[null,"import type { VetoTypeAny } from '@fuf-stack/veto';\n\nimport { useEffect, useId } from 'react';\n\nimport { array, objectLoose } from '@fuf-stack/veto';\n\nimport { useFormContext } from '../useFormContext/useFormContext';\n\n/**\n * Hook for adding dynamic client-side validation to forms.\n *\n * Automatically manages validation schema lifecycle: sets schema when data is provided,\n * clears schema when data is null/undefined, and cleans up on unmount.\n *\n * When the client validation schema changes, automatically re-validates all touched\n * fields to ensure they are validated against the new schema.\n *\n * @param data - Data to create validation schema from (or null/undefined to clear validation)\n * @param schemaFactory - Function that creates a validation schema from the data.\n *\n * @example\n * ```tsx\n * const { data: teamData } = useTeamQuery(teamId);\n *\n * useClientValidation(teamData, (data) =>\n *   vt.object({\n *     username: vt.string().refine(\n *       (value) => !data.existingUsers.includes(value),\n *       { message: 'Username already exists' }\n *     )\n *   })\n * );\n * ```\n */\nexport const useClientValidation = <TData = unknown>(\n  data: TData | null | undefined,\n  schemaFactory: (data: TData) => VetoTypeAny,\n): void => {\n  const {\n    formState: { touchedFields },\n    validation: { setClientValidationSchema },\n    trigger,\n  } = useFormContext();\n\n  // Auto-generate unique key\n  const key = useId();\n\n  // Use data hash instead of object reference to avoid unnecessary re-runs\n  // when data object reference changes but data remains the same\n  const dataHash = JSON.stringify(data);\n\n  // Single effect to manage validation schema lifecycle\n  useEffect(() => {\n    // Set validation schema when data is available\n    if (data != null) {\n      const validationSchema = schemaFactory(data);\n      setClientValidationSchema(key, validationSchema);\n    } else {\n      // Clear validation schema when no data\n      setClientValidationSchema(key, null);\n    }\n\n    // Re-validate all touched fields when client validation schema changes\n    const touchedFieldNames = Object.keys(touchedFields);\n    if (touchedFieldNames.length > 0) {\n      // Use setTimeout to ensure the client validation schema update has propagated\n      // before triggering re-validation (fixes race condition)\n      setTimeout(async () => {\n        return trigger(touchedFieldNames);\n      }, 1);\n    }\n\n    // Cleanup on unmount or when dependencies change\n    return () => {\n      setClientValidationSchema(key, null);\n    };\n    // Only re-run when data (dataHash) or key changes\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [dataHash, key]);\n};\n\n/**\n * Helper function to create a veto looseObject schema for a single field with nested path support.\n *\n * Parses field paths (dot-notation) and creates properly nested loose object schemas with array support.\n * All intermediate objects and arrays are marked as optional to allow partial data structures.\n * Numeric segments in the path are treated as array indices, and the parent field is wrapped in an array schema.\n *\n * @param name - The dot-separated path to the field (e.g., 'username', 'user.profile.email', 'items.0.name')\n * @param fieldSchema - The veto validation schema for the field\n * @returns A nested loose object schema matching the field path structure with proper type inference\n *\n * @example\n * ```tsx\n * // Simple field\n * clientValidationSchemaByName('username', vt.string())\n * // => objectLoose({ username: vt.string() })\n * ```\n *\n * @example\n * ```tsx\n * // Nested field (with optional intermediate objects)\n * clientValidationSchemaByName('user.profile.email', vt.string().email())\n * // => objectLoose({ user: objectLoose({ profile: objectLoose({ email: vt.string().email() }).optional() }).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Array field (with optional array)\n * clientValidationSchemaByName('items.0.name', vt.string())\n * // => objectLoose({ items: array(objectLoose({ name: vt.string() })).optional() })\n * ```\n *\n * @example\n * ```tsx\n * // Usage with useClientValidation\n * const { data: userData } = useUserQuery(userId);\n *\n * useClientValidation(userData, (data) =>\n *   clientValidationSchemaByName('username', vt.string().refine(\n *     (value) => !data.existingUsernames.includes(value),\n *     { message: 'Username already taken' }\n *   ))\n * );\n * ```\n */\nexport const clientValidationSchemaByName = <T extends VetoTypeAny>(\n  name: string,\n  fieldSchema: T,\n) => {\n  const segments = name.split('.');\n\n  // Build schema from innermost to outermost\n  let schema: VetoTypeAny = fieldSchema;\n\n  // Process segments in reverse order to build nested structure\n  for (let i = segments.length - 1; i >= 0; i -= 1) {\n    const segment = segments[i];\n    const isNumeric = /^\\d+$/.test(segment);\n\n    if (isNumeric) {\n      // Current segment is an array index - wrap current schema in optional array\n      schema = array(schema).optional();\n    } else {\n      // Current segment is a field name - wrap in objectLoose\n      // Make it optional if it's an intermediate object (not the root)\n      const obj = objectLoose({\n        [segment]: schema,\n      });\n      schema = i > 0 ? obj.optional() : obj;\n    }\n  }\n\n  return schema;\n};\n"]}