cogsbox-state 0.5.467 → 0.5.468

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"Components.d.ts","sourceRoot":"","sources":["../src/Components.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAC;AACnE,OAAO,KAQN,MAAM,OAAO,CAAC;AAkBf,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,QAAQ,GACT,EAAE,sBAAsB,2CAgDxB;AACD,eAAO,MAAM,uBAAuB,mDAWnC,CAAC;AACF,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,eAAe,EACf,QAAQ,EACR,UAAU,EACV,WAAW,EACX,iBAAiB,EACjB,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,GAAG,CAAC;IAEjB,iBAAiB,EAAE,CAAC,OAAO,EAAE;QAC3B,YAAY,EAAE,GAAG,CAAC;QAClB,IAAI,EAAE,MAAM,EAAE,CAAC;QACf,WAAW,EAAE,MAAM,CAAC;QACpB,IAAI,CAAC,EAAE,GAAG,CAAC;KACZ,KAAK,GAAG,CAAC;IACV,QAAQ,EAAE,CACR,MAAM,EAAE,GAAG,EACX,KAAK,EAAE,MAAM,EAEb,WAAW,EAAE,GAAG,KACb,KAAK,CAAC,SAAS,CAAC;CACtB,kDAkEA;AAED,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,IAAI,EACJ,iBAAiB,EACjB,QAAQ,EACR,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,iBAAiB,EAAE,CAAC,OAAO,EAAE;QAC3B,IAAI,EAAE,MAAM,EAAE,CAAC;QACf,WAAW,EAAE,MAAM,CAAC;QACpB,IAAI,CAAC,EAAE,GAAG,CAAC;KACZ,KAAK,GAAG,CAAC;IACV,QAAQ,EAAE,CAAC,MAAM,EAAE,iBAAiB,CAAC,GAAG,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9D,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,QAAQ,EAAE,GAAG,CAAC;CACf,2CAqQA;AACD,wBAAgB,oBAAoB,CAClC,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,EACnB,WAAW,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,QAiBjC"}
1
+ {"version":3,"file":"Components.d.ts","sourceRoot":"","sources":["../src/Components.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAC;AACnE,OAAO,KAQN,MAAM,OAAO,CAAC;AAkBf,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,QAAQ,GACT,EAAE,sBAAsB,2CAgDxB;AACD,eAAO,MAAM,uBAAuB,mDAWnC,CAAC;AACF,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,eAAe,EACf,QAAQ,EACR,UAAU,EACV,WAAW,EACX,iBAAiB,EACjB,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,GAAG,CAAC;IAEjB,iBAAiB,EAAE,CAAC,OAAO,EAAE;QAC3B,YAAY,EAAE,GAAG,CAAC;QAClB,IAAI,EAAE,MAAM,EAAE,CAAC;QACf,WAAW,EAAE,MAAM,CAAC;QACpB,IAAI,CAAC,EAAE,GAAG,CAAC;KACZ,KAAK,GAAG,CAAC;IACV,QAAQ,EAAE,CACR,MAAM,EAAE,GAAG,EACX,KAAK,EAAE,MAAM,EAEb,WAAW,EAAE,GAAG,KACb,KAAK,CAAC,SAAS,CAAC;CACtB,kDAkEA;AAED,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,IAAI,EACJ,iBAAiB,EACjB,QAAQ,EACR,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,iBAAiB,EAAE,CAAC,OAAO,EAAE;QAC3B,IAAI,EAAE,MAAM,EAAE,CAAC;QACf,WAAW,EAAE,MAAM,CAAC;QACpB,IAAI,CAAC,EAAE,GAAG,CAAC;KACZ,KAAK,GAAG,CAAC;IACV,QAAQ,EAAE,CAAC,MAAM,EAAE,iBAAiB,CAAC,GAAG,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9D,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,QAAQ,EAAE,GAAG,CAAC;CACf,2CAsQA;AACD,wBAAgB,oBAAoB,CAClC,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,EACnB,WAAW,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,QAiBjC"}
@@ -20,11 +20,11 @@ function ne({
20
20
  stateKey: n,
21
21
  children: o
22
22
  }) {
23
- const { getInitialOptions: f, getShadowMetadata: s, getShadowValue: l } = p.getState(), g = f(n), d = s(n, t)?.validation, a = d?.status || "NOT_VALIDATED", S = (d?.errors || []).map((c) => ({
23
+ const { getInitialOptions: f, getShadowMetadata: s, getShadowValue: l } = p.getState(), m = f(n), d = s(n, t)?.validation, a = d?.status || "NOT_VALIDATED", S = (d?.errors || []).map((c) => ({
24
24
  ...c,
25
25
  path: t
26
26
  })), u = S.filter((c) => c.severity === "error").map((c) => c.message), i = S.filter((c) => c.severity === "warning").map((c) => c.message), E = u[0] || i[0];
27
- return /* @__PURE__ */ O($, { children: g?.formElements?.validation && !e?.validation?.disable ? g.formElements.validation({
27
+ return /* @__PURE__ */ O($, { children: m?.formElements?.validation && !e?.validation?.disable ? m.formElements.validation({
28
28
  children: /* @__PURE__ */ O(x.Fragment, { children: o }, t.toString()),
29
29
  status: a,
30
30
  // Now passes the new ValidationStatus type
@@ -36,7 +36,7 @@ function ne({
36
36
  getData: () => l(n, t)
37
37
  }) : /* @__PURE__ */ O(x.Fragment, { children: o }, t.toString()) });
38
38
  }
39
- const ge = k(
39
+ const me = k(
40
40
  oe,
41
41
  (e, t) => e.itemPath.join(".") === t.itemPath.join(".") && e.stateKey === t.stateKey && e.itemComponentId === t.itemComponentId && e.localIndex === t.localIndex
42
42
  );
@@ -49,8 +49,8 @@ function oe({
49
49
  rebuildStateShape: s,
50
50
  renderFn: l
51
51
  }) {
52
- const [, g] = A({}), { ref: M, inView: d } = Q(), a = C(null), S = ae(a), u = C(!1), i = [e, ...n].join(".");
53
- B(e, t, g);
52
+ const [, m] = A({}), { ref: M, inView: d } = Q(), a = C(null), S = ae(a), u = C(!1), i = [e, ...n].join(".");
53
+ B(e, t, m);
54
54
  const E = J(
55
55
  (r) => {
56
56
  a.current = r, M(r);
@@ -58,8 +58,8 @@ function oe({
58
58
  [M]
59
59
  );
60
60
  j(() => {
61
- const r = re(i, (m) => {
62
- g({});
61
+ const r = re(i, (g) => {
62
+ m({});
63
63
  });
64
64
  return () => r();
65
65
  }, [i]), j(() => {
@@ -68,10 +68,10 @@ function oe({
68
68
  const r = a.current;
69
69
  if (r && r.offsetHeight > 0) {
70
70
  u.current = !0;
71
- const m = r.offsetHeight;
71
+ const g = r.offsetHeight;
72
72
  h(e, n, {
73
73
  virtualizer: {
74
- itemHeight: m,
74
+ itemHeight: g,
75
75
  domRef: r
76
76
  }
77
77
  });
@@ -93,7 +93,7 @@ function oe({
93
93
  }), y = l(z, o, f);
94
94
  return /* @__PURE__ */ O("div", { ref: E, children: y });
95
95
  }
96
- function me({
96
+ function ge({
97
97
  stateKey: e,
98
98
  path: t,
99
99
  rebuildStateShape: n,
@@ -101,14 +101,14 @@ function me({
101
101
  formOpts: f,
102
102
  setState: s
103
103
  }) {
104
- const [l] = A(() => X()), [, g] = A({}), M = [e, ...t].join(".");
105
- B(e, l, g);
104
+ const [l] = A(() => X()), [, m] = A({}), M = [e, ...t].join(".");
105
+ B(e, l, m);
106
106
  const d = R(e, t), [a, S] = A(d), u = C(!1), i = C(null);
107
107
  j(() => {
108
108
  !u.current && !Y(d, a) && S(d);
109
109
  }, [d]), j(() => {
110
- const r = p.getState().subscribeToPath(M, (m) => {
111
- !u.current && a !== m && g({});
110
+ const r = p.getState().subscribeToPath(M, (g) => {
111
+ !u.current && a !== g && m({});
112
112
  });
113
113
  return () => {
114
114
  r(), i.current && (clearTimeout(i.current), u.current = !1);
@@ -163,12 +163,12 @@ function me({
163
163
  });
164
164
  }
165
165
  }
166
- }, v), g({});
166
+ }, v), m({});
167
167
  },
168
168
  [s, t, f?.debounceTime, e]
169
169
  ), c = J(async () => {
170
170
  if (console.log("handleBlur triggered"), i.current && (clearTimeout(i.current), i.current = null, u.current = !1, s(a, t, { updateType: "update" })), !H(e, [])?.features?.validationEnabled) return;
171
- const { getInitialOptions: m } = p.getState(), v = m(e)?.validation, T = v?.zodSchemaV4 || v?.zodSchemaV3;
171
+ const { getInitialOptions: g } = p.getState(), v = g(e)?.validation, T = v?.zodSchemaV4 || v?.zodSchemaV3;
172
172
  if (!T) return;
173
173
  const I = H(e, t);
174
174
  h(e, t, {
@@ -217,13 +217,14 @@ function me({
217
217
  }
218
218
  });
219
219
  }
220
- g({});
220
+ m({});
221
221
  }, [e, t, a, s]), z = n({
222
222
  path: t,
223
- componentId: l
223
+ componentId: l,
224
+ meta: void 0
224
225
  }), y = new Proxy(z, {
225
- get(r, m) {
226
- return m === "inputProps" ? {
226
+ get(r, g) {
227
+ return g === "inputProps" ? {
227
228
  value: a ?? "",
228
229
  onChange: (v) => {
229
230
  E(v.target.value);
@@ -231,7 +232,7 @@ function me({
231
232
  // 5. Wire the new onBlur handler to the input props.
232
233
  onBlur: c,
233
234
  ref: _.getState().getFormRef(e + "." + t.join("."))
234
- } : r[m];
235
+ } : r[g];
235
236
  }
236
237
  });
237
238
  return /* @__PURE__ */ O(ne, { formOpts: f, path: t, stateKey: e, children: o(y) });
@@ -272,9 +273,9 @@ const ae = (e) => {
272
273
  }, [e.current]), t;
273
274
  };
274
275
  export {
275
- me as FormElementWrapper,
276
+ ge as FormElementWrapper,
276
277
  oe as ListItemWrapper,
277
- ge as MemoizedCogsItemWrapper,
278
+ me as MemoizedCogsItemWrapper,
278
279
  ne as ValidationWrapper,
279
280
  B as useRegisterComponent
280
281
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Components.jsx","sources":["../src/Components.tsx"],"sourcesContent":["import { FormElementParams, type FormOptsType } from './CogsState';\r\nimport React, {\r\n memo,\r\n RefObject,\r\n useCallback,\r\n useEffect,\r\n useLayoutEffect,\r\n useRef,\r\n useState,\r\n} from 'react';\r\nimport { formRefStore, getGlobalStore, ValidationError } from './store';\r\nimport { useInView } from 'react-intersection-observer';\r\nimport { v4 as uuidv4 } from 'uuid';\r\nimport { isDeepEqual } from './utility';\r\nconst {\r\n getInitialOptions,\r\n\r\n getShadowMetadata,\r\n setShadowMetadata,\r\n getShadowValue,\r\n\r\n registerComponent,\r\n unregisterComponent,\r\n\r\n notifyPathSubscribers,\r\n subscribeToPath,\r\n} = getGlobalStore.getState();\r\nexport type ValidationWrapperProps = {\r\n formOpts?: FormOptsType;\r\n path: string[];\r\n stateKey: string;\r\n children: React.ReactNode;\r\n};\r\n\r\nexport function ValidationWrapper({\r\n formOpts,\r\n path,\r\n stateKey,\r\n children,\r\n}: ValidationWrapperProps) {\r\n const { getInitialOptions, getShadowMetadata, getShadowValue } =\r\n getGlobalStore.getState();\r\n const thisStateOpts = getInitialOptions(stateKey!);\r\n\r\n const shadowMeta = getShadowMetadata(stateKey!, path);\r\n const validationState = shadowMeta?.validation;\r\n\r\n const status = validationState?.status || 'NOT_VALIDATED';\r\n\r\n const errors = (validationState?.errors || []).map((err) => ({\r\n ...err,\r\n path: path,\r\n })) as ValidationError[];\r\n const errorMessages = errors\r\n .filter((err) => err.severity === 'error')\r\n .map((err) => err.message);\r\n const warningMessages = errors\r\n .filter((err) => err.severity === 'warning')\r\n .map((err) => err.message);\r\n\r\n // Use first error, or first warning if no errors\r\n const message = errorMessages[0] || warningMessages[0];\r\n\r\n return (\r\n <>\r\n {thisStateOpts?.formElements?.validation &&\r\n !formOpts?.validation?.disable ? (\r\n thisStateOpts.formElements!.validation!({\r\n children: (\r\n <React.Fragment key={path.toString()}>{children}</React.Fragment>\r\n ),\r\n status, // Now passes the new ValidationStatus type\r\n message: formOpts?.validation?.hideMessage\r\n ? ''\r\n : formOpts?.validation?.message || message || '',\r\n\r\n hasErrors: errorMessages.length > 0,\r\n hasWarnings: warningMessages.length > 0,\r\n allErrors: errors,\r\n path: path,\r\n getData: () => getShadowValue(stateKey!, path),\r\n })\r\n ) : (\r\n <React.Fragment key={path.toString()}>{children}</React.Fragment>\r\n )}\r\n </>\r\n );\r\n}\r\nexport const MemoizedCogsItemWrapper = memo(\r\n ListItemWrapper,\r\n (prevProps, nextProps) => {\r\n // Re-render if any of these change:\r\n return (\r\n prevProps.itemPath.join('.') === nextProps.itemPath.join('.') &&\r\n prevProps.stateKey === nextProps.stateKey &&\r\n prevProps.itemComponentId === nextProps.itemComponentId &&\r\n prevProps.localIndex === nextProps.localIndex\r\n );\r\n }\r\n);\r\nexport function ListItemWrapper({\r\n stateKey,\r\n itemComponentId,\r\n itemPath,\r\n localIndex,\r\n arraySetter,\r\n rebuildStateShape,\r\n renderFn,\r\n}: {\r\n stateKey: string;\r\n itemComponentId: string;\r\n itemPath: string[];\r\n localIndex: number;\r\n arraySetter: any;\r\n\r\n rebuildStateShape: (options: {\r\n currentState: any;\r\n path: string[];\r\n componentId: string;\r\n meta?: any;\r\n }) => any;\r\n renderFn: (\r\n setter: any,\r\n index: number,\r\n\r\n arraySetter: any\r\n ) => React.ReactNode;\r\n}) {\r\n const [, forceUpdate] = useState({});\r\n const { ref: inViewRef, inView } = useInView();\r\n const elementRef = useRef<HTMLDivElement | null>(null);\r\n\r\n const imagesLoaded = useImageLoaded(elementRef);\r\n const hasReportedInitialHeight = useRef(false);\r\n const fullKey = [stateKey, ...itemPath].join('.');\r\n useRegisterComponent(stateKey, itemComponentId, forceUpdate);\r\n\r\n const setRefs = useCallback(\r\n (element: HTMLDivElement | null) => {\r\n elementRef.current = element;\r\n inViewRef(element); // This is the ref from useInView\r\n },\r\n [inViewRef]\r\n );\r\n\r\n useEffect(() => {\r\n const unsubscribe = subscribeToPath(fullKey, (e) => {\r\n forceUpdate({});\r\n });\r\n return () => unsubscribe();\r\n }, [fullKey]);\r\n useEffect(() => {\r\n if (!inView || !imagesLoaded || hasReportedInitialHeight.current) {\r\n return;\r\n }\r\n\r\n const element = elementRef.current;\r\n if (element && element.offsetHeight > 0) {\r\n hasReportedInitialHeight.current = true;\r\n const newHeight = element.offsetHeight;\r\n\r\n setShadowMetadata(stateKey, itemPath, {\r\n virtualizer: {\r\n itemHeight: newHeight,\r\n domRef: element,\r\n },\r\n });\r\n\r\n const arrayPath = itemPath.slice(0, -1);\r\n const arrayPathKey = [stateKey, ...arrayPath].join('.');\r\n notifyPathSubscribers(arrayPathKey, {\r\n type: 'ITEMHEIGHT',\r\n itemKey: itemPath.join('.'),\r\n\r\n ref: elementRef.current,\r\n });\r\n }\r\n }, [inView, imagesLoaded, stateKey, itemPath]);\r\n\r\n const itemValue = getShadowValue(stateKey, itemPath);\r\n\r\n if (itemValue === undefined) {\r\n return null;\r\n }\r\n\r\n const itemSetter = rebuildStateShape({\r\n currentState: itemValue,\r\n path: itemPath,\r\n componentId: itemComponentId,\r\n });\r\n const children = renderFn(itemSetter, localIndex, arraySetter);\r\n\r\n return <div ref={setRefs}>{children}</div>;\r\n}\r\n\r\nexport function FormElementWrapper({\r\n stateKey,\r\n path,\r\n rebuildStateShape,\r\n renderFn,\r\n formOpts,\r\n setState,\r\n}: {\r\n stateKey: string;\r\n path: string[];\r\n rebuildStateShape: (options: {\r\n path: string[];\r\n componentId: string;\r\n meta?: any;\r\n }) => any;\r\n renderFn: (params: FormElementParams<any>) => React.ReactNode;\r\n formOpts?: FormOptsType;\r\n setState: any;\r\n}) {\r\n const [componentId] = useState(() => uuidv4());\r\n const [, forceUpdate] = useState({});\r\n\r\n const stateKeyPathKey = [stateKey, ...path].join('.');\r\n useRegisterComponent(stateKey, componentId, forceUpdate);\r\n const globalStateValue = getShadowValue(stateKey, path);\r\n const [localValue, setLocalValue] = useState<any>(globalStateValue);\r\n const isCurrentlyDebouncing = useRef(false);\r\n const debounceTimeoutRef = useRef<NodeJS.Timeout | null>(null);\r\n\r\n useEffect(() => {\r\n if (\r\n !isCurrentlyDebouncing.current &&\r\n !isDeepEqual(globalStateValue, localValue)\r\n ) {\r\n setLocalValue(globalStateValue);\r\n }\r\n }, [globalStateValue]);\r\n\r\n useEffect(() => {\r\n const unsubscribe = getGlobalStore\r\n .getState()\r\n .subscribeToPath(stateKeyPathKey, (newValue) => {\r\n if (!isCurrentlyDebouncing.current && localValue !== newValue) {\r\n forceUpdate({});\r\n }\r\n });\r\n return () => {\r\n unsubscribe();\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n isCurrentlyDebouncing.current = false;\r\n }\r\n };\r\n }, []);\r\n\r\n const debouncedUpdate = useCallback(\r\n (newValue: any) => {\r\n const currentType = typeof globalStateValue;\r\n if (currentType === 'number' && typeof newValue === 'string') {\r\n newValue = newValue === '' ? 0 : Number(newValue);\r\n }\r\n setLocalValue(newValue);\r\n isCurrentlyDebouncing.current = true;\r\n\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n }\r\n\r\n const debounceTime = formOpts?.debounceTime ?? 200;\r\n\r\n debounceTimeoutRef.current = setTimeout(() => {\r\n isCurrentlyDebouncing.current = false;\r\n setState(newValue, path, { updateType: 'update' });\r\n\r\n // NEW: Check if validation is enabled via features\r\n const rootMeta = getGlobalStore\r\n .getState()\r\n .getShadowMetadata(stateKey, []);\r\n if (!rootMeta?.features?.validationEnabled) return;\r\n\r\n const validationOptions = getInitialOptions(stateKey)?.validation;\r\n const zodSchema =\r\n validationOptions?.zodSchemaV4 || validationOptions?.zodSchemaV3;\r\n\r\n if (zodSchema) {\r\n const fullState = getShadowValue(stateKey, []);\r\n const result = zodSchema.safeParse(fullState);\r\n const currentMeta = getShadowMetadata(stateKey, path) || {};\r\n\r\n if (!result.success) {\r\n const errors =\r\n 'issues' in result.error\r\n ? result.error.issues\r\n : (result.error as any).errors;\r\n\r\n const pathErrors = errors.filter(\r\n (error: any) =>\r\n JSON.stringify(error.path) === JSON.stringify(path)\r\n );\r\n\r\n if (pathErrors.length > 0) {\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'INVALID',\r\n errors: [\r\n {\r\n source: 'client',\r\n message: pathErrors[0]?.message,\r\n severity: 'warning', // Gentle error during typing\r\n },\r\n ],\r\n lastValidated: Date.now(),\r\n validatedValue: newValue,\r\n },\r\n });\r\n } else {\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'VALID',\r\n errors: [],\r\n lastValidated: Date.now(),\r\n validatedValue: newValue,\r\n },\r\n });\r\n }\r\n } else {\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'VALID',\r\n errors: [],\r\n lastValidated: Date.now(),\r\n validatedValue: newValue,\r\n },\r\n });\r\n }\r\n }\r\n }, debounceTime);\r\n forceUpdate({});\r\n },\r\n [setState, path, formOpts?.debounceTime, stateKey]\r\n );\r\n\r\n const handleBlur = useCallback(async () => {\r\n console.log('handleBlur triggered');\r\n\r\n // Commit any pending changes\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n debounceTimeoutRef.current = null;\r\n isCurrentlyDebouncing.current = false;\r\n setState(localValue, path, { updateType: 'update' });\r\n }\r\n const rootMeta = getShadowMetadata(stateKey, []);\r\n if (!rootMeta?.features?.validationEnabled) return;\r\n const { getInitialOptions } = getGlobalStore.getState();\r\n const validationOptions = getInitialOptions(stateKey)?.validation;\r\n const zodSchema =\r\n validationOptions?.zodSchemaV4 || validationOptions?.zodSchemaV3;\r\n\r\n if (!zodSchema) return;\r\n\r\n // Get the full path including stateKey\r\n\r\n // Update validation state to \"validating\"\r\n const currentMeta = getShadowMetadata(stateKey, path);\r\n\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'VALIDATING',\r\n errors: [],\r\n lastValidated: Date.now(),\r\n validatedValue: localValue,\r\n },\r\n });\r\n\r\n // Validate full state\r\n const fullState = getShadowValue(stateKey, []);\r\n const result = zodSchema.safeParse(fullState);\r\n\r\n if (!result.success) {\r\n const errors =\r\n 'issues' in result.error\r\n ? result.error.issues\r\n : (result.error as any).errors;\r\n\r\n // Find errors for this specific path\r\n const pathErrors = errors.filter((error: any) => {\r\n // For array paths, we need to translate indices to ULIDs\r\n if (path.some((p) => p.startsWith('id:'))) {\r\n // This is an array item path like [\"id:xyz\", \"name\"]\r\n const parentPath = path[0]!.startsWith('id:')\r\n ? []\r\n : path.slice(0, -1);\r\n\r\n const arrayMeta = getGlobalStore\r\n .getState()\r\n .getShadowMetadata(stateKey, parentPath);\r\n\r\n if (arrayMeta?.arrayKeys) {\r\n const itemKey = [stateKey, ...path.slice(0, -1)].join('.');\r\n const itemIndex = arrayMeta.arrayKeys.indexOf(itemKey);\r\n\r\n // Compare with Zod path\r\n const zodPath = [...parentPath, itemIndex, ...path.slice(-1)];\r\n const match =\r\n JSON.stringify(error.path) === JSON.stringify(zodPath);\r\n\r\n return match;\r\n }\r\n }\r\n\r\n const directMatch = JSON.stringify(error.path) === JSON.stringify(path);\r\n\r\n return directMatch;\r\n });\r\n\r\n // Update shadow metadata with validation result\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'INVALID',\r\n errors: pathErrors.map((err: any) => ({\r\n source: 'client' as const,\r\n message: err.message,\r\n severity: 'error' as const, // Hard error on blur\r\n })),\r\n lastValidated: Date.now(),\r\n validatedValue: localValue,\r\n },\r\n });\r\n } else {\r\n // Validation passed\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'VALID',\r\n errors: [],\r\n lastValidated: Date.now(),\r\n validatedValue: localValue,\r\n },\r\n });\r\n }\r\n forceUpdate({});\r\n }, [stateKey, path, localValue, setState]);\r\n\r\n const baseState = rebuildStateShape({\r\n path: path,\r\n componentId: componentId,\r\n });\r\n\r\n const stateWithInputProps = new Proxy(baseState, {\r\n get(target, prop) {\r\n if (prop === 'inputProps') {\r\n return {\r\n value: localValue ?? '',\r\n onChange: (e: any) => {\r\n debouncedUpdate(e.target.value);\r\n },\r\n // 5. Wire the new onBlur handler to the input props.\r\n onBlur: handleBlur,\r\n ref: formRefStore\r\n .getState()\r\n .getFormRef(stateKey + '.' + path.join('.')),\r\n };\r\n }\r\n\r\n return target[prop];\r\n },\r\n });\r\n\r\n return (\r\n <ValidationWrapper formOpts={formOpts} path={path} stateKey={stateKey}>\r\n {renderFn(stateWithInputProps)}\r\n </ValidationWrapper>\r\n );\r\n}\r\nexport function useRegisterComponent(\r\n stateKey: string,\r\n componentId: string,\r\n forceUpdate: (o: object) => void\r\n) {\r\n const fullComponentId = `${stateKey}////${componentId}`;\r\n\r\n useLayoutEffect(() => {\r\n // Call the safe, centralized function to register\r\n registerComponent(stateKey, fullComponentId, {\r\n forceUpdate: () => forceUpdate({}),\r\n paths: new Set(),\r\n reactiveType: ['component'],\r\n });\r\n\r\n // The cleanup now calls the safe, centralized unregister function\r\n return () => {\r\n unregisterComponent(stateKey, fullComponentId);\r\n };\r\n }, [stateKey, fullComponentId]); // Dependencies are stable and correct\r\n}\r\n\r\nconst useImageLoaded = (ref: RefObject<HTMLElement>): boolean => {\r\n const [loaded, setLoaded] = useState(false);\r\n\r\n useLayoutEffect(() => {\r\n if (!ref.current) {\r\n setLoaded(true);\r\n return;\r\n }\r\n\r\n const images = Array.from(ref.current.querySelectorAll('img'));\r\n\r\n // If there are no images, we are \"loaded\" immediately.\r\n if (images.length === 0) {\r\n setLoaded(true);\r\n return;\r\n }\r\n\r\n let loadedCount = 0;\r\n const handleImageLoad = () => {\r\n loadedCount++;\r\n if (loadedCount === images.length) {\r\n setLoaded(true);\r\n }\r\n };\r\n\r\n images.forEach((image) => {\r\n if (image.complete) {\r\n handleImageLoad();\r\n } else {\r\n image.addEventListener('load', handleImageLoad);\r\n image.addEventListener('error', handleImageLoad);\r\n }\r\n });\r\n\r\n return () => {\r\n images.forEach((image) => {\r\n image.removeEventListener('load', handleImageLoad);\r\n image.removeEventListener('error', handleImageLoad);\r\n });\r\n };\r\n }, [ref.current]);\r\n\r\n return loaded;\r\n};\r\n"],"names":["getInitialOptions","getShadowMetadata","setShadowMetadata","getShadowValue","registerComponent","unregisterComponent","notifyPathSubscribers","subscribeToPath","getGlobalStore","ValidationWrapper","formOpts","path","stateKey","children","thisStateOpts","validationState","status","errors","err","errorMessages","warningMessages","message","jsx","Fragment","React","MemoizedCogsItemWrapper","memo","ListItemWrapper","prevProps","nextProps","itemComponentId","itemPath","localIndex","arraySetter","rebuildStateShape","renderFn","forceUpdate","useState","inViewRef","inView","useInView","elementRef","useRef","imagesLoaded","useImageLoaded","hasReportedInitialHeight","fullKey","useRegisterComponent","setRefs","useCallback","element","useEffect","unsubscribe","e","newHeight","arrayPath","arrayPathKey","itemValue","itemSetter","FormElementWrapper","setState","componentId","uuidv4","stateKeyPathKey","globalStateValue","localValue","setLocalValue","isCurrentlyDebouncing","debounceTimeoutRef","isDeepEqual","newValue","debouncedUpdate","debounceTime","validationOptions","zodSchema","fullState","result","currentMeta","pathErrors","error","handleBlur","p","parentPath","arrayMeta","itemKey","itemIndex","zodPath","baseState","stateWithInputProps","target","prop","formRefStore","fullComponentId","useLayoutEffect","ref","loaded","setLoaded","images","loadedCount","handleImageLoad","image"],"mappings":"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"}
1
+ {"version":3,"file":"Components.jsx","sources":["../src/Components.tsx"],"sourcesContent":["import { FormElementParams, type FormOptsType } from './CogsState';\r\nimport React, {\r\n memo,\r\n RefObject,\r\n useCallback,\r\n useEffect,\r\n useLayoutEffect,\r\n useRef,\r\n useState,\r\n} from 'react';\r\nimport { formRefStore, getGlobalStore, ValidationError } from './store';\r\nimport { useInView } from 'react-intersection-observer';\r\nimport { v4 as uuidv4 } from 'uuid';\r\nimport { isDeepEqual } from './utility';\r\nconst {\r\n getInitialOptions,\r\n\r\n getShadowMetadata,\r\n setShadowMetadata,\r\n getShadowValue,\r\n\r\n registerComponent,\r\n unregisterComponent,\r\n\r\n notifyPathSubscribers,\r\n subscribeToPath,\r\n} = getGlobalStore.getState();\r\nexport type ValidationWrapperProps = {\r\n formOpts?: FormOptsType;\r\n path: string[];\r\n stateKey: string;\r\n children: React.ReactNode;\r\n};\r\n\r\nexport function ValidationWrapper({\r\n formOpts,\r\n path,\r\n stateKey,\r\n children,\r\n}: ValidationWrapperProps) {\r\n const { getInitialOptions, getShadowMetadata, getShadowValue } =\r\n getGlobalStore.getState();\r\n const thisStateOpts = getInitialOptions(stateKey!);\r\n\r\n const shadowMeta = getShadowMetadata(stateKey!, path);\r\n const validationState = shadowMeta?.validation;\r\n\r\n const status = validationState?.status || 'NOT_VALIDATED';\r\n\r\n const errors = (validationState?.errors || []).map((err) => ({\r\n ...err,\r\n path: path,\r\n })) as ValidationError[];\r\n const errorMessages = errors\r\n .filter((err) => err.severity === 'error')\r\n .map((err) => err.message);\r\n const warningMessages = errors\r\n .filter((err) => err.severity === 'warning')\r\n .map((err) => err.message);\r\n\r\n // Use first error, or first warning if no errors\r\n const message = errorMessages[0] || warningMessages[0];\r\n\r\n return (\r\n <>\r\n {thisStateOpts?.formElements?.validation &&\r\n !formOpts?.validation?.disable ? (\r\n thisStateOpts.formElements!.validation!({\r\n children: (\r\n <React.Fragment key={path.toString()}>{children}</React.Fragment>\r\n ),\r\n status, // Now passes the new ValidationStatus type\r\n message: formOpts?.validation?.hideMessage\r\n ? ''\r\n : formOpts?.validation?.message || message || '',\r\n\r\n hasErrors: errorMessages.length > 0,\r\n hasWarnings: warningMessages.length > 0,\r\n allErrors: errors,\r\n path: path,\r\n getData: () => getShadowValue(stateKey!, path),\r\n })\r\n ) : (\r\n <React.Fragment key={path.toString()}>{children}</React.Fragment>\r\n )}\r\n </>\r\n );\r\n}\r\nexport const MemoizedCogsItemWrapper = memo(\r\n ListItemWrapper,\r\n (prevProps, nextProps) => {\r\n // Re-render if any of these change:\r\n return (\r\n prevProps.itemPath.join('.') === nextProps.itemPath.join('.') &&\r\n prevProps.stateKey === nextProps.stateKey &&\r\n prevProps.itemComponentId === nextProps.itemComponentId &&\r\n prevProps.localIndex === nextProps.localIndex\r\n );\r\n }\r\n);\r\nexport function ListItemWrapper({\r\n stateKey,\r\n itemComponentId,\r\n itemPath,\r\n localIndex,\r\n arraySetter,\r\n rebuildStateShape,\r\n renderFn,\r\n}: {\r\n stateKey: string;\r\n itemComponentId: string;\r\n itemPath: string[];\r\n localIndex: number;\r\n arraySetter: any;\r\n\r\n rebuildStateShape: (options: {\r\n currentState: any;\r\n path: string[];\r\n componentId: string;\r\n meta?: any;\r\n }) => any;\r\n renderFn: (\r\n setter: any,\r\n index: number,\r\n\r\n arraySetter: any\r\n ) => React.ReactNode;\r\n}) {\r\n const [, forceUpdate] = useState({});\r\n const { ref: inViewRef, inView } = useInView();\r\n const elementRef = useRef<HTMLDivElement | null>(null);\r\n\r\n const imagesLoaded = useImageLoaded(elementRef);\r\n const hasReportedInitialHeight = useRef(false);\r\n const fullKey = [stateKey, ...itemPath].join('.');\r\n useRegisterComponent(stateKey, itemComponentId, forceUpdate);\r\n\r\n const setRefs = useCallback(\r\n (element: HTMLDivElement | null) => {\r\n elementRef.current = element;\r\n inViewRef(element); // This is the ref from useInView\r\n },\r\n [inViewRef]\r\n );\r\n\r\n useEffect(() => {\r\n const unsubscribe = subscribeToPath(fullKey, (e) => {\r\n forceUpdate({});\r\n });\r\n return () => unsubscribe();\r\n }, [fullKey]);\r\n useEffect(() => {\r\n if (!inView || !imagesLoaded || hasReportedInitialHeight.current) {\r\n return;\r\n }\r\n\r\n const element = elementRef.current;\r\n if (element && element.offsetHeight > 0) {\r\n hasReportedInitialHeight.current = true;\r\n const newHeight = element.offsetHeight;\r\n\r\n setShadowMetadata(stateKey, itemPath, {\r\n virtualizer: {\r\n itemHeight: newHeight,\r\n domRef: element,\r\n },\r\n });\r\n\r\n const arrayPath = itemPath.slice(0, -1);\r\n const arrayPathKey = [stateKey, ...arrayPath].join('.');\r\n notifyPathSubscribers(arrayPathKey, {\r\n type: 'ITEMHEIGHT',\r\n itemKey: itemPath.join('.'),\r\n\r\n ref: elementRef.current,\r\n });\r\n }\r\n }, [inView, imagesLoaded, stateKey, itemPath]);\r\n\r\n const itemValue = getShadowValue(stateKey, itemPath);\r\n\r\n if (itemValue === undefined) {\r\n return null;\r\n }\r\n\r\n const itemSetter = rebuildStateShape({\r\n currentState: itemValue,\r\n path: itemPath,\r\n componentId: itemComponentId,\r\n });\r\n const children = renderFn(itemSetter, localIndex, arraySetter);\r\n\r\n return <div ref={setRefs}>{children}</div>;\r\n}\r\n\r\nexport function FormElementWrapper({\r\n stateKey,\r\n path,\r\n rebuildStateShape,\r\n renderFn,\r\n formOpts,\r\n setState,\r\n}: {\r\n stateKey: string;\r\n path: string[];\r\n rebuildStateShape: (options: {\r\n path: string[];\r\n componentId: string;\r\n meta?: any;\r\n }) => any;\r\n renderFn: (params: FormElementParams<any>) => React.ReactNode;\r\n formOpts?: FormOptsType;\r\n setState: any;\r\n}) {\r\n const [componentId] = useState(() => uuidv4());\r\n const [, forceUpdate] = useState({});\r\n\r\n const stateKeyPathKey = [stateKey, ...path].join('.');\r\n useRegisterComponent(stateKey, componentId, forceUpdate);\r\n const globalStateValue = getShadowValue(stateKey, path);\r\n const [localValue, setLocalValue] = useState<any>(globalStateValue);\r\n const isCurrentlyDebouncing = useRef(false);\r\n const debounceTimeoutRef = useRef<NodeJS.Timeout | null>(null);\r\n\r\n useEffect(() => {\r\n if (\r\n !isCurrentlyDebouncing.current &&\r\n !isDeepEqual(globalStateValue, localValue)\r\n ) {\r\n setLocalValue(globalStateValue);\r\n }\r\n }, [globalStateValue]);\r\n\r\n useEffect(() => {\r\n const unsubscribe = getGlobalStore\r\n .getState()\r\n .subscribeToPath(stateKeyPathKey, (newValue) => {\r\n if (!isCurrentlyDebouncing.current && localValue !== newValue) {\r\n forceUpdate({});\r\n }\r\n });\r\n return () => {\r\n unsubscribe();\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n isCurrentlyDebouncing.current = false;\r\n }\r\n };\r\n }, []);\r\n\r\n const debouncedUpdate = useCallback(\r\n (newValue: any) => {\r\n const currentType = typeof globalStateValue;\r\n if (currentType === 'number' && typeof newValue === 'string') {\r\n newValue = newValue === '' ? 0 : Number(newValue);\r\n }\r\n setLocalValue(newValue);\r\n isCurrentlyDebouncing.current = true;\r\n\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n }\r\n\r\n const debounceTime = formOpts?.debounceTime ?? 200;\r\n\r\n debounceTimeoutRef.current = setTimeout(() => {\r\n isCurrentlyDebouncing.current = false;\r\n setState(newValue, path, { updateType: 'update' });\r\n\r\n // NEW: Check if validation is enabled via features\r\n const rootMeta = getGlobalStore\r\n .getState()\r\n .getShadowMetadata(stateKey, []);\r\n if (!rootMeta?.features?.validationEnabled) return;\r\n\r\n const validationOptions = getInitialOptions(stateKey)?.validation;\r\n const zodSchema =\r\n validationOptions?.zodSchemaV4 || validationOptions?.zodSchemaV3;\r\n\r\n if (zodSchema) {\r\n const fullState = getShadowValue(stateKey, []);\r\n const result = zodSchema.safeParse(fullState);\r\n const currentMeta = getShadowMetadata(stateKey, path) || {};\r\n\r\n if (!result.success) {\r\n const errors =\r\n 'issues' in result.error\r\n ? result.error.issues\r\n : (result.error as any).errors;\r\n\r\n const pathErrors = errors.filter(\r\n (error: any) =>\r\n JSON.stringify(error.path) === JSON.stringify(path)\r\n );\r\n\r\n if (pathErrors.length > 0) {\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'INVALID',\r\n errors: [\r\n {\r\n source: 'client',\r\n message: pathErrors[0]?.message,\r\n severity: 'warning', // Gentle error during typing\r\n },\r\n ],\r\n lastValidated: Date.now(),\r\n validatedValue: newValue,\r\n },\r\n });\r\n } else {\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'VALID',\r\n errors: [],\r\n lastValidated: Date.now(),\r\n validatedValue: newValue,\r\n },\r\n });\r\n }\r\n } else {\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'VALID',\r\n errors: [],\r\n lastValidated: Date.now(),\r\n validatedValue: newValue,\r\n },\r\n });\r\n }\r\n }\r\n }, debounceTime);\r\n forceUpdate({});\r\n },\r\n [setState, path, formOpts?.debounceTime, stateKey]\r\n );\r\n\r\n const handleBlur = useCallback(async () => {\r\n console.log('handleBlur triggered');\r\n\r\n // Commit any pending changes\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n debounceTimeoutRef.current = null;\r\n isCurrentlyDebouncing.current = false;\r\n setState(localValue, path, { updateType: 'update' });\r\n }\r\n const rootMeta = getShadowMetadata(stateKey, []);\r\n if (!rootMeta?.features?.validationEnabled) return;\r\n const { getInitialOptions } = getGlobalStore.getState();\r\n const validationOptions = getInitialOptions(stateKey)?.validation;\r\n const zodSchema =\r\n validationOptions?.zodSchemaV4 || validationOptions?.zodSchemaV3;\r\n\r\n if (!zodSchema) return;\r\n\r\n // Get the full path including stateKey\r\n\r\n // Update validation state to \"validating\"\r\n const currentMeta = getShadowMetadata(stateKey, path);\r\n\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'VALIDATING',\r\n errors: [],\r\n lastValidated: Date.now(),\r\n validatedValue: localValue,\r\n },\r\n });\r\n\r\n // Validate full state\r\n const fullState = getShadowValue(stateKey, []);\r\n const result = zodSchema.safeParse(fullState);\r\n\r\n if (!result.success) {\r\n const errors =\r\n 'issues' in result.error\r\n ? result.error.issues\r\n : (result.error as any).errors;\r\n\r\n // Find errors for this specific path\r\n const pathErrors = errors.filter((error: any) => {\r\n // For array paths, we need to translate indices to ULIDs\r\n if (path.some((p) => p.startsWith('id:'))) {\r\n // This is an array item path like [\"id:xyz\", \"name\"]\r\n const parentPath = path[0]!.startsWith('id:')\r\n ? []\r\n : path.slice(0, -1);\r\n\r\n const arrayMeta = getGlobalStore\r\n .getState()\r\n .getShadowMetadata(stateKey, parentPath);\r\n\r\n if (arrayMeta?.arrayKeys) {\r\n const itemKey = [stateKey, ...path.slice(0, -1)].join('.');\r\n const itemIndex = arrayMeta.arrayKeys.indexOf(itemKey);\r\n\r\n // Compare with Zod path\r\n const zodPath = [...parentPath, itemIndex, ...path.slice(-1)];\r\n const match =\r\n JSON.stringify(error.path) === JSON.stringify(zodPath);\r\n\r\n return match;\r\n }\r\n }\r\n\r\n const directMatch = JSON.stringify(error.path) === JSON.stringify(path);\r\n\r\n return directMatch;\r\n });\r\n\r\n // Update shadow metadata with validation result\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'INVALID',\r\n errors: pathErrors.map((err: any) => ({\r\n source: 'client' as const,\r\n message: err.message,\r\n severity: 'error' as const, // Hard error on blur\r\n })),\r\n lastValidated: Date.now(),\r\n validatedValue: localValue,\r\n },\r\n });\r\n } else {\r\n // Validation passed\r\n setShadowMetadata(stateKey, path, {\r\n ...currentMeta,\r\n validation: {\r\n status: 'VALID',\r\n errors: [],\r\n lastValidated: Date.now(),\r\n validatedValue: localValue,\r\n },\r\n });\r\n }\r\n forceUpdate({});\r\n }, [stateKey, path, localValue, setState]);\r\n\r\n const baseState = rebuildStateShape({\r\n path: path,\r\n componentId: componentId,\r\n meta: undefined,\r\n });\r\n\r\n const stateWithInputProps = new Proxy(baseState, {\r\n get(target, prop) {\r\n if (prop === 'inputProps') {\r\n return {\r\n value: localValue ?? '',\r\n onChange: (e: any) => {\r\n debouncedUpdate(e.target.value);\r\n },\r\n // 5. Wire the new onBlur handler to the input props.\r\n onBlur: handleBlur,\r\n ref: formRefStore\r\n .getState()\r\n .getFormRef(stateKey + '.' + path.join('.')),\r\n };\r\n }\r\n\r\n return target[prop];\r\n },\r\n });\r\n\r\n return (\r\n <ValidationWrapper formOpts={formOpts} path={path} stateKey={stateKey}>\r\n {renderFn(stateWithInputProps)}\r\n </ValidationWrapper>\r\n );\r\n}\r\nexport function useRegisterComponent(\r\n stateKey: string,\r\n componentId: string,\r\n forceUpdate: (o: object) => void\r\n) {\r\n const fullComponentId = `${stateKey}////${componentId}`;\r\n\r\n useLayoutEffect(() => {\r\n // Call the safe, centralized function to register\r\n registerComponent(stateKey, fullComponentId, {\r\n forceUpdate: () => forceUpdate({}),\r\n paths: new Set(),\r\n reactiveType: ['component'],\r\n });\r\n\r\n // The cleanup now calls the safe, centralized unregister function\r\n return () => {\r\n unregisterComponent(stateKey, fullComponentId);\r\n };\r\n }, [stateKey, fullComponentId]); // Dependencies are stable and correct\r\n}\r\n\r\nconst useImageLoaded = (ref: RefObject<HTMLElement>): boolean => {\r\n const [loaded, setLoaded] = useState(false);\r\n\r\n useLayoutEffect(() => {\r\n if (!ref.current) {\r\n setLoaded(true);\r\n return;\r\n }\r\n\r\n const images = Array.from(ref.current.querySelectorAll('img'));\r\n\r\n // If there are no images, we are \"loaded\" immediately.\r\n if (images.length === 0) {\r\n setLoaded(true);\r\n return;\r\n }\r\n\r\n let loadedCount = 0;\r\n const handleImageLoad = () => {\r\n loadedCount++;\r\n if (loadedCount === images.length) {\r\n setLoaded(true);\r\n }\r\n };\r\n\r\n images.forEach((image) => {\r\n if (image.complete) {\r\n handleImageLoad();\r\n } else {\r\n image.addEventListener('load', handleImageLoad);\r\n image.addEventListener('error', handleImageLoad);\r\n }\r\n });\r\n\r\n return () => {\r\n images.forEach((image) => {\r\n image.removeEventListener('load', handleImageLoad);\r\n image.removeEventListener('error', handleImageLoad);\r\n });\r\n };\r\n }, [ref.current]);\r\n\r\n return loaded;\r\n};\r\n"],"names":["getInitialOptions","getShadowMetadata","setShadowMetadata","getShadowValue","registerComponent","unregisterComponent","notifyPathSubscribers","subscribeToPath","getGlobalStore","ValidationWrapper","formOpts","path","stateKey","children","thisStateOpts","validationState","status","errors","err","errorMessages","warningMessages","message","jsx","Fragment","React","MemoizedCogsItemWrapper","memo","ListItemWrapper","prevProps","nextProps","itemComponentId","itemPath","localIndex","arraySetter","rebuildStateShape","renderFn","forceUpdate","useState","inViewRef","inView","useInView","elementRef","useRef","imagesLoaded","useImageLoaded","hasReportedInitialHeight","fullKey","useRegisterComponent","setRefs","useCallback","element","useEffect","unsubscribe","e","newHeight","arrayPath","arrayPathKey","itemValue","itemSetter","FormElementWrapper","setState","componentId","uuidv4","stateKeyPathKey","globalStateValue","localValue","setLocalValue","isCurrentlyDebouncing","debounceTimeoutRef","isDeepEqual","newValue","debouncedUpdate","debounceTime","validationOptions","zodSchema","fullState","result","currentMeta","pathErrors","error","handleBlur","p","parentPath","arrayMeta","itemKey","itemIndex","zodPath","baseState","stateWithInputProps","target","prop","formRefStore","fullComponentId","useLayoutEffect","ref","loaded","setLoaded","images","loadedCount","handleImageLoad","image"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cogsbox-state",
3
- "version": "0.5.467",
3
+ "version": "0.5.468",
4
4
  "description": "React state management library with form controls and server sync",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
package/src/CogsState.tsx CHANGED
@@ -1821,7 +1821,7 @@ function getScopedData(stateKey: string, path: string[], meta?: MetaData) {
1821
1821
  function createProxyHandler<T>(
1822
1822
  stateKey: string,
1823
1823
  effectiveSetState: EffectiveSetState<T>,
1824
- componentId: string,
1824
+ outerComponentId: string,
1825
1825
  sessionId?: string
1826
1826
  ): StateObject<T> {
1827
1827
  const proxyCache = new Map<string, any>();
@@ -1891,7 +1891,8 @@ function createProxyHandler<T>(
1891
1891
  const derivationSignature = meta
1892
1892
  ? JSON.stringify(meta.arrayViews || meta.transforms)
1893
1893
  : '';
1894
- const cacheKey = path.join('.') + ':' + derivationSignature;
1894
+ const cacheKey =
1895
+ path.join('.') + ':' + componentId + ':' + derivationSignature;
1895
1896
  if (proxyCache.has(cacheKey)) {
1896
1897
  return proxyCache.get(cacheKey);
1897
1898
  }
@@ -3442,7 +3443,7 @@ function createProxyHandler<T>(
3442
3443
  initializeShadowState(stateKey, initialState);
3443
3444
  rebuildStateShape({
3444
3445
  path: [],
3445
- componentId: componentId!,
3446
+ componentId: outerComponentId!,
3446
3447
  });
3447
3448
  const initalOptionsGet = getInitialOptions(stateKey as string);
3448
3449
  const localKey = isFunction(initalOptionsGet?.localStorage?.key)
@@ -3472,7 +3473,7 @@ function createProxyHandler<T>(
3472
3473
  const newUpdaterState = createProxyHandler(
3473
3474
  stateKey,
3474
3475
  effectiveSetState,
3475
- componentId,
3476
+ outerComponentId,
3476
3477
  sessionId
3477
3478
  );
3478
3479
  const initialState =
@@ -3510,7 +3511,7 @@ function createProxyHandler<T>(
3510
3511
  };
3511
3512
 
3512
3513
  const returnShape = rebuildStateShape({
3513
- componentId,
3514
+ componentId: outerComponentId,
3514
3515
  path: [],
3515
3516
  });
3516
3517
 
@@ -445,6 +445,7 @@ export function FormElementWrapper({
445
445
  const baseState = rebuildStateShape({
446
446
  path: path,
447
447
  componentId: componentId,
448
+ meta: undefined,
448
449
  });
449
450
 
450
451
  const stateWithInputProps = new Proxy(baseState, {