{"version":3,"file":"useWatch.mjs","names":[],"sources":["../../../../../../../react-form/src/hooks/useWatch.ts"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useReducer, useRef } from \"react\";\nimport { useForm } from \"./useForm\";\n\n/**\n * Shallow equality used to decide whether a watched value actually changed.\n * Primitives compare by `Object.is`; arrays compare element-wise (for the\n * `names[]` form). Two fresh objects (the `watch-all` case) never compare equal,\n * so `useWatch()` still re-renders on every change — that is inherent.\n */\nfunction isSameWatched(a: any, b: any): boolean {\n  if (Object.is(a, b)) return true;\n\n  if (Array.isArray(a) && Array.isArray(b)) {\n    return a.length === b.length && a.every((value, i) => Object.is(value, b[i]));\n  }\n\n  return false;\n}\n\n/**\n * Reactively read form values from any descendant of a `Form` / `NativeForm`.\n *\n * - `useWatch()` → the whole collected values object (re-renders on any change).\n * - `useWatch(\"user.email\")` → that single control's current value.\n * - `useWatch([\"a\", \"b\"])` → an array of those controls' values.\n *\n * For the single / `names[]` forms the component re-renders **only when the\n * watched value(s) change**, not on every unrelated field change.\n */\nexport function useWatch(): Record<string, any>;\nexport function useWatch(name: string): any;\nexport function useWatch(names: string[]): any[];\nexport function useWatch(name?: string | string[]): any {\n  const form = useForm();\n  const [, rerender] = useReducer((count: number) => count + 1, 0);\n\n  const read = () => {\n    if (!form) {\n      if (name === undefined) return {};\n      return Array.isArray(name) ? name.map(() => undefined) : undefined;\n    }\n\n    if (name === undefined) return form.values();\n    if (Array.isArray(name)) return name.map((control) => form.value(control));\n    return form.value(name);\n  };\n\n  const current = read();\n\n  // Latest rendered value, compared against on each change event.\n  const latest = useRef(current);\n  latest.current = current;\n\n  // Stable dependency for the `names[]` form so a fresh array literal each\n  // render does not re-subscribe.\n  const nameKey = Array.isArray(name) ? name.join(\"|\") : name;\n\n  useEffect(() => {\n    if (!form) return;\n\n    const onChange = () => {\n      const next = read();\n\n      if (!isSameWatched(latest.current, next)) {\n        latest.current = next;\n        rerender();\n      }\n    };\n\n    const changeEvent = form.on(\"change\", onChange);\n    const resetEvent = form.on(\"reset\", onChange);\n\n    return () => {\n      changeEvent.unsubscribe();\n      resetEvent.unsubscribe();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [form, nameKey]);\n\n  return current;\n}\n"],"mappings":";;;;;;;;;;;;AAWA,SAAS,cAAc,GAAQ,GAAiB;CAC9C,IAAI,OAAO,GAAG,GAAG,CAAC,GAAG,OAAO;CAE5B,IAAI,MAAM,QAAQ,CAAC,KAAK,MAAM,QAAQ,CAAC,GACrC,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,OAAO,OAAO,MAAM,OAAO,GAAG,OAAO,EAAE,EAAE,CAAC;CAG9E,OAAO;AACT;AAeA,SAAgB,SAAS,MAA+B;CACtD,MAAM,OAAO,QAAQ;CACrB,MAAM,GAAG,YAAY,YAAY,UAAkB,QAAQ,GAAG,CAAC;CAE/D,MAAM,aAAa;EACjB,IAAI,CAAC,MAAM;GACT,IAAI,SAAS,QAAW,OAAO,CAAC;GAChC,OAAO,MAAM,QAAQ,IAAI,IAAI,KAAK,UAAU,MAAS,IAAI;EAC3D;EAEA,IAAI,SAAS,QAAW,OAAO,KAAK,OAAO;EAC3C,IAAI,MAAM,QAAQ,IAAI,GAAG,OAAO,KAAK,KAAK,YAAY,KAAK,MAAM,OAAO,CAAC;EACzE,OAAO,KAAK,MAAM,IAAI;CACxB;CAEA,MAAM,UAAU,KAAK;CAGrB,MAAM,SAAS,OAAO,OAAO;CAC7B,OAAO,UAAU;CAMjB,gBAAgB;EACd,IAAI,CAAC,MAAM;EAEX,MAAM,iBAAiB;GACrB,MAAM,OAAO,KAAK;GAElB,IAAI,CAAC,cAAc,OAAO,SAAS,IAAI,GAAG;IACxC,OAAO,UAAU;IACjB,SAAS;GACX;EACF;EAEA,MAAM,cAAc,KAAK,GAAG,UAAU,QAAQ;EAC9C,MAAM,aAAa,KAAK,GAAG,SAAS,QAAQ;EAE5C,aAAa;GACX,YAAY,YAAY;GACxB,WAAW,YAAY;EACzB;CAEF,GAAG,CAAC,MAtBY,MAAM,QAAQ,IAAI,IAAI,KAAK,KAAK,GAAG,IAAI,IAsBtC,CAAC;CAElB,OAAO;AACT"}