@companix/formkit 0.0.27 → 0.0.28

package/dist/bundle.es.js

@@ -1,11 +1,11 @@
-import { jsx as h, Fragment as j, jsxs as B } from "react/jsx-runtime";
-import { createContext as M, useState as w, useContext as R, useMemo as C, useEffect as $, useCallback as A, useRef as P } from "react";
+import { jsx as h, Fragment as w, jsxs as B } from "react/jsx-runtime";
+import { createContext as M, useState as R, useContext as T, useMemo as S, useEffect as $, useCallback as D, useRef as P } from "react";
 import L from "fast-deep-equal";
-const D = M({}), q = (o) => {
-  const [, r] = w([]), e = R(D);
+const j = M({}), q = (o) => {
+  const [, r] = R([]), e = T(j);
   if (!e)
     throw new Error("useValue cannot be used outside Form context");
-  const s = C(() => {
+  const s = S(() => {
     const t = e.getForm(o);
     if (!t)
       throw new Error(`form with name "${o}" doesnt exist in form`);
@@ -19,18 +19,18 @@ const D = M({}), q = (o) => {
       t();
     };
   }, []), s.value;
-}, O = () => (o) => q(o), N = ({ canActivate: o, name: r, children: e }) => {
+}, K = () => (o) => q(o), O = ({ canActivate: o, name: r, children: e }) => {
   const s = q(r);
-  return o(s) ? /* @__PURE__ */ h(j, { children: e }) : null;
+  return o(s) ? /* @__PURE__ */ h(w, { children: e }) : null;
 }, U = ({ item: { Form: o }, name: r }) => {
-  const [, e] = w([]), s = R(D), { unregistry: t } = C(() => s.registry(r, () => {
+  const [, e] = R([]), s = T(j), { unregistry: t } = S(() => s.registry(r, () => {
     e([]);
-  }), []), l = A(
-    (y) => {
-      if (y && y.focus) {
+  }), []), l = D(
+    (b) => {
+      if (b && b.focus) {
         const v = s.getForm(r);
         v.focus = () => {
-          y.focus();
+          b.focus();
         };
       }
     },
@@ -39,107 +39,107 @@ const D = M({}), q = (o) => {
   $(() => () => {
     t();
   }, []);
-  const { value: g, error: V } = s.getForm(r);
+  const { value: g, error: x } = s.getForm(r);
   return /* @__PURE__ */ h(
     o,
     {
       field: {
         value: g,
-        onChange: (y) => {
-          s.onChange(r, y);
+        onChange: (b) => {
+          s.onChange(r, b);
         },
         onBlur: () => {
         },
         ref: l
       },
       isDirty: !1,
-      error: V,
+      error: x,
       disabled: s.disabled
     }
   );
-}, z = ({ item: o, path: r }) => {
-  const { getController: e, items: s } = o, t = R(D), l = C(() => {
-    const f = {};
-    return s.forEach(({ name: b, getForm: n }) => {
-      f[b] = n(b, () => a(b));
-    }), f;
-  }, []), g = A(() => {
-    const f = [];
-    return s.forEach(({ name: b }) => {
-      t.getForm([...r, b].join(".")).value !== void 0 && f.push(b);
-    }), f;
-  }, []), V = C(() => g(), []), [y, v] = w(V);
+}, _ = ({ item: o, path: r }) => {
+  const { getController: e, items: s } = o, t = T(j), l = S(() => {
+    const y = {};
+    return s.forEach(({ name: d, getForm: V }) => {
+      y[d] = V(d, () => a(d));
+    }), y;
+  }, []), g = D(() => {
+    const y = [];
+    return s.forEach(({ name: d }) => {
+      t.getForm([...r, d].join(".")).value !== void 0 && y.push(d);
+    }), y;
+  }, []), x = S(() => g(), []), [b, v] = R(x);
   $(() => {
-    const { unregistry: f } = t.registryExtraForm(
-      s.map(({ name: b }) => [...r, b].join(".")),
+    const { unregistry: y } = t.registryExtraForm(
+      s.map(({ name: d }) => [...r, d].join(".")),
       () => {
         v(g());
       }
     );
     return () => {
-      f();
+      y();
     };
   }, []);
-  const d = A(
-    (f) => {
-      l[f] && !y.includes(f) && v((b) => [...b, f]);
+  const f = D(
+    (y) => {
+      l[y] && !b.includes(y) && v((d) => [...d, y]);
     },
-    [y]
-  ), a = A((f) => {
-    v((b) => b.filter((n) => n !== f));
+    [b]
+  ), a = D((y) => {
+    v((d) => d.filter((V) => V !== y));
   }, []);
-  return /* @__PURE__ */ B(j, { children: [
-    y.map((f) => {
-      const b = l[f];
-      return /* @__PURE__ */ h(E, { path: r, scheme: [b] }, `param-form--${f}`);
+  return /* @__PURE__ */ B(w, { children: [
+    b.map((y) => {
+      const d = l[y];
+      return /* @__PURE__ */ h(p, { path: r, scheme: [d] }, `param-form--${y}`);
     }),
-    e(d, y)
+    e(f, b)
   ] });
-}, E = ({ scheme: o, path: r }) => /* @__PURE__ */ h(j, { children: o.map((e, s) => e.type === "layout" ? /* @__PURE__ */ h(e.Layout, { children: /* @__PURE__ */ h(E, { path: r, scheme: e.childs }) }, `layout-form--${s}-${r.length}`) : e.type === "context" ? /* @__PURE__ */ h(
-  E,
+}, p = ({ scheme: o, path: r }) => /* @__PURE__ */ h(w, { children: o.map((e, s) => e.type === "layout" ? /* @__PURE__ */ h(e.Layout, { children: /* @__PURE__ */ h(p, { path: r, scheme: e.childs }) }, `layout-form--${s}-${r.length}`) : e.type === "context" ? /* @__PURE__ */ h(
+  p,
   {
     path: [...r, e.context],
     scheme: e.childs
   },
   `context-form--${s}-${e.context}-${r.length}`
 ) : e.type === "condition" ? /* @__PURE__ */ h(
-  N,
+  O,
   {
     name: e.depended,
     canActivate: e.canActivate,
-    children: /* @__PURE__ */ h(E, { path: r, scheme: e.childs })
+    children: /* @__PURE__ */ h(p, { path: r, scheme: e.childs })
   },
   `condition--${s}-${e.depended}-${r.length}`
-) : e.type === "extra" ? /* @__PURE__ */ h(z, { path: r, item: e }, `partial-item--${s}-${r.length}`) : e.type === "visability" ? e.hidden ? null : /* @__PURE__ */ h(E, { path: r, scheme: e.childs }, `visability--${s}-${r.length}`) : /* @__PURE__ */ h(
+) : e.type === "extra" ? /* @__PURE__ */ h(_, { path: r, item: e }, `partial-item--${s}-${r.length}`) : e.type === "visability" ? e.hidden ? null : /* @__PURE__ */ h(p, { path: r, scheme: e.childs }, `visability--${s}-${r.length}`) : /* @__PURE__ */ h(
   U,
   {
     name: [...r, e.name].join("."),
     item: e
   },
   `form-item--${s}-${e.name}-${r.length}`
-)) }), p = (o, r, e, s) => {
+)) }), C = (o, r, e, s) => {
   o.forEach((t) => {
     if (t.type === "form" && s(t, [...r, t.name].join("."), e[t.name]), t.type === "context") {
-      p(t.childs, [...r, t.context], e[t.context] ?? {}, s);
+      C(t.childs, [...r, t.context], e[t.context] ?? {}, s);
       return;
     }
     if (t.type === "layout" || t.type === "condition" || t.type === "visability") {
-      p(t.childs, r, e, s);
+      C(t.childs, r, e, s);
       return;
     }
     t.type === "extra" && t.items.forEach(({ getForm: l, name: g }) => {
-      p([l(g, () => {
+      C([l(g, () => {
       })], r, e, s);
     });
   });
-}, m = ({ scheme: o, values: r, path: e, forms: s }) => {
+}, E = ({ scheme: o, values: r, path: e, forms: s }) => {
   o.forEach((t) => {
     if (t.type === "form") {
       const l = [...e, t.name].join(".");
       s[l].value !== void 0 && (r[t.name] = s[l].value);
     }
     if (t.type === "context") {
-      r[t.context] = {}, m({
+      r[t.context] = {}, E({
         scheme: t.childs,
         path: [...e, t.context],
         values: r[t.context],
@@ -148,38 +148,38 @@ const D = M({}), q = (o) => {
       return;
     }
     if (t.type === "layout") {
-      m({ scheme: t.childs, path: e, values: r, forms: s });
+      E({ scheme: t.childs, path: e, values: r, forms: s });
       return;
     }
     if (t.type === "visability") {
-      m({ scheme: t.childs, path: e, values: r, forms: s });
+      E({ scheme: t.childs, path: e, values: r, forms: s });
       return;
     }
     if (t.type === "condition") {
       const l = s[t.depended]?.value;
       if (t.canActivate(l)) {
-        m({ scheme: t.childs, path: e, values: r, forms: s });
+        E({ scheme: t.childs, path: e, values: r, forms: s });
         return;
       }
     }
     t.type === "extra" && t.items.forEach(({ getForm: l, name: g }) => {
-      m({ scheme: [l(g, () => {
+      E({ scheme: [l(g, () => {
       })], path: e, values: r, forms: s });
     });
   });
-}, T = (o, r) => {
+}, N = (o, r) => {
   const e = {};
-  return m({ scheme: o, path: [], values: e, forms: r }), e;
-}, G = (o, r) => {
-  const { onSubmit: e, onEqual: s, disabled: t, onDirty: l, onFormDirty: g, onChangeEvent: V, defaultValues: y } = r, v = { onSubmit: e }, d = {
+  return E({ scheme: o, path: [], values: e, forms: r }), e;
+}, z = (o, r) => {
+  const { onSubmit: e, onEqual: s, disabled: t, onDirty: l, onFormDirty: g, onChangeEvent: x, defaultValues: b } = r, v = { onSubmit: e }, f = {
     isActive: !1,
     isSubmitted: !1,
     dirtyCount: 0
-  }, a = {}, f = {
+  }, a = {}, y = /* @__PURE__ */ new Set(), d = {
     subscribers: [],
     names: {}
   };
-  p(o, [], y ?? {}, (n, u, i) => {
+  C(o, [], b ?? {}, (n, u, i) => {
     a[u] = {
       error: null,
       isDirty: !1,
@@ -195,18 +195,18 @@ const D = M({}), q = (o) => {
       validate: n.validate
     };
   });
-  const b = (n, u) => {
-    l?.({ name: n, isDirty: u }), u && d.dirtyCount === 0 && g?.(!0), !u && d.dirtyCount === 1 && g?.(!1), d.dirtyCount += u ? 1 : -1;
+  const V = (n, u) => {
+    l?.({ name: n, isDirty: u }), u && f.dirtyCount === 0 && g?.(!0), !u && f.dirtyCount === 1 && g?.(!1), f.dirtyCount += u ? 1 : -1;
   };
   return {
     submitRef: v,
     scheme: o,
     disabled: t,
     activate() {
-      d.isActive = !0;
+      f.isActive = !0;
     },
     disactivate() {
-      d.isActive = !1;
+      f.isActive = !1;
     },
     setError(n, u) {
       const i = this.getForm(n);
@@ -224,12 +224,12 @@ const D = M({}), q = (o) => {
       i && i.value !== u && this.onChange(n, u);
     },
     getValues() {
-      return T(o, a);
+      return N(o, a);
     },
     async handleSubmit() {
       if (t)
         return;
-      d.isSubmitted = !0;
+      f.isSubmitted = !0;
       let n = !1, u = !1;
       for (const i in a) {
         const c = a[i];
@@ -239,18 +239,18 @@ const D = M({}), q = (o) => {
         }
       }
       if (!u) {
-        if (d.dirtyCount === 0 && s) {
+        if (f.dirtyCount === 0 && s) {
           s();
           return;
         }
-        const i = T(o, a);
+        const i = N(o, a);
         await v.onSubmit(i, {
           setError: (c, F) => {
-            const x = this.getForm(c);
-            x.error = {
+            const m = this.getForm(c);
+            m.error = {
               error: !0,
               messages: [F.message]
-            }, x.rerender();
+            }, m.rerender();
           }
         }).catch((c) => {
           console.log("[formkit] submit exception:", c);
@@ -258,32 +258,32 @@ const D = M({}), q = (o) => {
       }
     },
     reset(n, { asDirty: u }) {
-      p(o, [], n, (i, c, F) => {
+      C(o, [], n, (i, c, F) => {
         if (F === void 0 && a[c].value === void 0)
           return;
-        if (f.names[c] && F === void 0) {
+        if (d.names[c] && F === void 0) {
           a[c].value = void 0;
           return;
         }
-        const x = F ?? i.defaultValue;
-        u || (a[c].startValue = x, a[c].isDirty = !1), a[c].value !== x && this.onChange(c, x);
-      }), u || (d.dirtyCount = 0, d.isSubmitted = !1), f.subscribers.forEach(({ visualizeEvalueatedForms: i }) => {
+        const m = F ?? i.defaultValue;
+        u || (a[c].startValue = m, a[c].isDirty = !1), a[c].value !== m && this.onChange(c, m);
+      }), u || (f.dirtyCount = 0, f.isSubmitted = !1), d.subscribers.forEach(({ visualizeEvalueatedForms: i }) => {
         i();
       });
     },
     setAsDefault() {
-      p(o, [], {}, ({}, n) => {
-        a[n].startValue = a[n].value, a[n].isDirty = !1;
-      }), d.dirtyCount = 0, d.isSubmitted = !1;
+      C(o, [], {}, (n, u) => {
+        a[u].startValue = a[u].value, a[u].isDirty = !1;
+      }), f.dirtyCount = 0, f.isSubmitted = !1;
     },
     registry(n, u) {
       return a[n].rerender = u, a[n].value === void 0 && (a[n].value = a[n].defaultValue), {
         unregistry() {
           if (a[n].rerender = () => {
-          }, a[n].focus = void 0, d.isActive) {
+          }, a[n].focus = void 0, f.isActive) {
             a[n].value = void 0;
             const i = !L(a[n].startValue, a[n].defaultValue);
-            a[n].isDirty !== i && b(n, i), a[n].isDirty = i;
+            a[n].isDirty !== i && V(n, i), a[n].isDirty = i;
           }
         }
       };
@@ -297,28 +297,38 @@ const D = M({}), q = (o) => {
         c.subscribers = c.subscribers.filter((F) => F !== i);
       };
     },
+    subscribeToAny(n) {
+      return y.add(n), () => {
+        y.delete(n);
+      };
+    },
+    getNames() {
+      return Object.keys(a);
+    },
     registryExtraForm(n, u) {
       const i = { visualizeEvalueatedForms: u };
       return n.forEach((c) => {
-        f.names[c] = !0;
-      }), f.subscribers.push(i), {
+        d.names[c] = !0;
+      }), d.subscribers.push(i), {
         unregistry() {
-          f.subscribers = f.subscribers.filter((c) => c !== i);
+          d.subscribers = d.subscribers.filter((c) => c !== i);
         }
       };
     },
     onChange(n, u) {
       const i = this.getForm(n), c = !L(u, i.startValue);
-      i.isDirty !== c && b(n, c), i.isDirty = c, V?.({ name: n, value: u }), (i.error || d.isSubmitted) && (i.error = i.validate(u) || null);
+      i.isDirty !== c && V(n, c), i.isDirty = c, x?.({ name: n, value: u }), (i.error || f.isSubmitted) && (i.error = i.validate(u) || null);
       const F = i.value;
-      i.value = u, i.rerender(), i.subscribers.forEach(({ callback: x }) => {
-        x(u, F);
+      i.value = u, i.rerender(), i.subscribers.forEach(({ callback: m }) => {
+        m(u, F);
+      }), y.forEach((m) => {
+        m();
       });
     }
   };
 }, Q = (o, r) => {
   const e = P(null);
-  e.current === null && (e.current = G(o, r));
+  e.current === null && (e.current = z(o, r));
   const s = e.current;
   return $(() => {
     e.current && (e.current.submitRef.onSubmit = r.onSubmit);
@@ -346,13 +356,17 @@ const D = M({}), q = (o) => {
       await s.handleSubmit();
     },
     // prettier-ignore
-    subscribe: (t, l) => s.subscribeToForm(t, l)
+    subscribe: (t, l) => s.subscribeToForm(t, l),
+    // подписка на любое изменение значений формы (для гейтов поверх всех полей)
+    subscribeAny: (t) => s.subscribeToAny(t),
+    // плоский список имён всех полей (dotted-пути; вложенные context раскрыты)
+    getNames: () => s.getNames()
   };
-}, W = ({ manager: o }) => (C(() => {
+}, W = ({ manager: o }) => (S(() => {
   o.activate();
 }, []), $(() => () => {
   o.disactivate();
-}, []), /* @__PURE__ */ h(D.Provider, { value: o, children: /* @__PURE__ */ h(E, { scheme: o.scheme, path: [] }) })), S = (o) => {
+}, []), /* @__PURE__ */ h(j.Provider, { value: o, children: /* @__PURE__ */ h(p, { scheme: o.scheme, path: [] }) })), A = (o) => {
   try {
     o();
   } catch (r) {
@@ -367,28 +381,28 @@ const D = M({}), q = (o) => {
     };
   }
 }, X = (o) => (r, e) => {
-  const s = o.getRequireCheck(e), { $rules: t = {}, ...l } = e, { validate: g, required: V } = t;
+  const s = o.getRequireCheck(e), { $rules: t = {}, ...l } = e, { validate: g, required: x } = t;
   return {
     type: "form",
     name: r,
     defaultValue: o.defaultValue,
     Form: o.getForm(l),
-    validate: (y) => {
-      if (V) {
-        const v = S(() => s(y));
+    validate: (b) => {
+      if (x) {
+        const v = A(() => s(b));
         if (v)
           return v;
         if (g) {
-          const d = S(() => g(y));
-          if (d)
-            return d;
+          const f = A(() => g(b));
+          if (f)
+            return f;
         }
         return;
       }
-      if (g && !S(() => s(y))) {
-        const d = S(() => g(y));
-        if (d)
-          return d;
+      if (g && !A(() => s(b))) {
+        const f = A(() => g(b));
+        if (f)
+          return f;
       }
     }
   };
@@ -403,29 +417,29 @@ const D = M({}), q = (o) => {
   type: "extra",
   items: o((e) => (s) => ({ type: "registry", name: e, getForm: s })),
   getController: r
-}), _ = (o) => (...r) => ({
+}), k = (o) => (...r) => ({
   type: "context",
   context: o,
   childs: r
-}), k = (o, r) => (...e) => ({
+}), I = (o, r) => (...e) => ({
   type: "condition",
   depended: o,
   canActivate: r.canActivate,
   childs: e
-}), I = ({ hidden: o }) => (...r) => ({
+}), rr = ({ hidden: o }) => (...r) => ({
   type: "visability",
   hidden: o ?? !1,
   childs: r
 });
 export {
-  k as Condition,
-  _ as Context,
+  I as Condition,
+  k as Context,
   W as FormLayout,
-  I as Visablility,
+  rr as Visablility,
   Z as createExtraForm,
   X as createForm,
   Y as createLayout,
-  O as createUseValue,
+  K as createUseValue,
   Q as useForm,
   q as useValue
 };

package/dist/manager/manager.d.ts

@@ -33,6 +33,8 @@ export interface FormManager<Values, FlattenValues, ClonedValues> {
         unregistry: () => void;
     };
     subscribeToForm: <K extends keyof FlattenValues>(name: K & string, callback: (value: FlattenValues[K], prevValue: FlattenValues[K]) => void) => () => void;
+    subscribeToAny: (callback: () => void) => () => void;
+    getNames: () => string[];
     registryExtraForm: (names: string[], callback: () => void) => {
         unregistry: () => void;
     };

package/dist/useForm.d.ts

@@ -51,6 +51,8 @@ declare const useDynamicForm: (scheme: SchemeItems.All[], opts: MainOptions<Fiel
     };
     handleSubmit: () => Promise<void>;
     subscribe: <K extends string>(name: K, callback: (value: any, prevValue: any) => void) => () => void;
+    subscribeAny: (callback: () => void) => () => void;
+    getNames: () => string[];
 };
 declare const useForm: <Items extends SchemeItems.All[], Values extends ExtractValues<Items[number]>, FlattenValues extends ExtractFlatValues<Items[number]>, Cloned extends Copy<Values>>(scheme: Items, opts: MainOptions<Values, FlattenValues, Cloned>) => {
     manager: FormManager<Values, FlattenValues, Cloned>;
@@ -66,6 +68,8 @@ declare const useForm: <Items extends SchemeItems.All[], Values extends ExtractV
     getValues: () => DeepPartial<Cloned>;
     handleSubmit: () => Promise<void>;
     subscribe: <K extends keyof FlattenValues>(name: K & string, callback: (value: FlattenValues[K], prevValue: FlattenValues[K]) => void) => () => void;
+    subscribeAny: (callback: () => void) => () => void;
+    getNames: () => string[];
 };
 interface Props {
     manager: FormManager<any, any, any>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@companix/formkit",
-  "version": "0.0.27",
+  "version": "0.0.28",
   "module": "./dist/bundle.es.js",
   "types": "./dist/index.d.ts",
   "type": "module",