@companix/formkit 0.0.16 → 0.0.17

package/dist/bundle.es.js

@@ -1,44 +1,52 @@
-import { jsx as h, Fragment as j, jsxs as M } from "react/jsx-runtime";
-import { createContext as P, useState as R, useContext as q, useEffect as p, useMemo as A, useCallback as $, useRef as T } from "react";
+import { jsx as b, Fragment as j, jsxs as M } from "react/jsx-runtime";
+import { createContext as P, useState as w, useContext as R, useMemo as p, useEffect as S, useCallback as A, useRef as T } from "react";
 import L from "fast-deep-equal";
-const D = P({}), B = (n) => {
-  const [, r] = R([]), e = q(D), o = e.getForm(n);
-  return p(() => {
-    const { unsubscribe: t } = e.subscribeToForm(n, () => {
-      r([]);
+const D = P({}), q = (o) => {
+  const [, e] = w([]), r = R(D);
+  if (!r)
+    throw new Error("useValue should be used in FormContext");
+  const n = p(() => {
+    const t = r.getForm(o);
+    if (!t)
+      throw new Error(`form with name "${o}" doesnt exist in form`);
+    return t;
+  }, [r, o]);
+  return S(() => {
+    const { unsubscribe: t } = r.subscribeToForm(o, () => {
+      e([]);
     });
     return () => {
       t();
     };
-  }, []), o?.value;
-}, N = ({ canActivate: n, name: r, children: e }) => {
-  const o = B(r);
-  return n(o) ? /* @__PURE__ */ h(j, { children: e }) : null;
-}, z = ({ item: { Form: n }, name: r }) => {
-  const [, e] = R([]), o = q(D), { unregistry: t } = A(() => o.registry(r, () => {
-    e([]);
-  }), []), f = $(
+  }, []), n.value;
+}, O = () => (o) => q(o), N = ({ canActivate: o, name: e, children: r }) => {
+  const n = q(e);
+  return o(n) ? /* @__PURE__ */ b(j, { children: r }) : null;
+}, U = ({ item: { Form: o }, name: e }) => {
+  const [, r] = w([]), n = R(D), { unregistry: t } = p(() => n.registry(e, () => {
+    r([]);
+  }), []), f = A(
     (y) => {
       if (y && y.focus) {
-        const v = o.getForm(r);
+        const v = n.getForm(e);
         v.focus = () => {
           y.focus();
         };
       }
     },
-    [r]
+    [e]
   );
-  p(() => () => {
+  S(() => () => {
     t();
   }, []);
-  const { value: b, error: x } = o.getForm(r);
-  return /* @__PURE__ */ h(
-    n,
+  const { value: h, error: x } = n.getForm(e);
+  return /* @__PURE__ */ b(
+    o,
     {
       field: {
-        value: b,
+        value: h,
         onChange: (y) => {
-          o.onChange(r, y);
+          n.onChange(e, y);
         },
         onBlur: () => {
         },
@@ -46,120 +54,120 @@ const D = P({}), B = (n) => {
       },
       isDirty: !1,
       error: x,
-      disabled: o.disabled
+      disabled: n.disabled
     }
   );
-}, G = ({ item: n, path: r }) => {
-  const { getController: e, items: o } = n, t = q(D), f = A(() => {
+}, z = ({ item: o, path: e }) => {
+  const { getController: r, items: n } = o, t = R(D), f = p(() => {
     const l = {};
-    return o.forEach(({ name: g, getForm: s }) => {
+    return n.forEach(({ name: g, getForm: s }) => {
       l[g] = s(g, () => a(g));
     }), l;
-  }, []), b = $(() => {
+  }, []), h = A(() => {
     const l = [];
-    return o.forEach(({ name: g }) => {
-      t.getForm([...r, g].join(".")).value !== void 0 && l.push(g);
+    return n.forEach(({ name: g }) => {
+      t.getForm([...e, g].join(".")).value !== void 0 && l.push(g);
     }), l;
-  }, []), x = A(() => b(), []), [y, v] = R(x);
-  p(() => {
+  }, []), x = p(() => h(), []), [y, v] = w(x);
+  S(() => {
     const { unregistry: l } = t.registryExtraForm(
-      o.map(({ name: g }) => [...r, g].join(".")),
+      n.map(({ name: g }) => [...e, g].join(".")),
       () => {
-        v(b());
+        v(h());
       }
     );
     return () => {
       l();
     };
   }, []);
-  const d = $(
+  const d = A(
     (l) => {
       f[l] && !y.includes(l) && v((g) => [...g, l]);
     },
     [y]
-  ), a = $((l) => {
+  ), a = A((l) => {
     v((g) => g.filter((s) => s !== l));
   }, []);
   return /* @__PURE__ */ M(j, { children: [
     y.map((l) => {
       const g = f[l];
-      return /* @__PURE__ */ h(C, { path: r, scheme: [g] }, `param-form--${l}`);
+      return /* @__PURE__ */ b(C, { path: e, scheme: [g] }, `param-form--${l}`);
     }),
-    e(d, y)
+    r(d, y)
   ] });
-}, C = ({ scheme: n, path: r }) => /* @__PURE__ */ h(j, { children: n.map((e, o) => e.type === "layout" ? /* @__PURE__ */ h(e.Layout, { children: /* @__PURE__ */ h(C, { path: r, scheme: e.childs }) }, `layout-form--${o}-${r.length}`) : e.type === "context" ? /* @__PURE__ */ h(
+}, C = ({ scheme: o, path: e }) => /* @__PURE__ */ b(j, { children: o.map((r, n) => r.type === "layout" ? /* @__PURE__ */ b(r.Layout, { children: /* @__PURE__ */ b(C, { path: e, scheme: r.childs }) }, `layout-form--${n}-${e.length}`) : r.type === "context" ? /* @__PURE__ */ b(
   C,
   {
-    path: [...r, e.context],
-    scheme: e.childs
+    path: [...e, r.context],
+    scheme: r.childs
   },
-  `context-form--${o}-${e.context}-${r.length}`
-) : e.type === "condition" ? /* @__PURE__ */ h(
+  `context-form--${n}-${r.context}-${e.length}`
+) : r.type === "condition" ? /* @__PURE__ */ b(
   N,
   {
-    name: e.depended,
-    canActivate: e.canActivate,
-    children: /* @__PURE__ */ h(C, { path: r, scheme: e.childs })
+    name: r.depended,
+    canActivate: r.canActivate,
+    children: /* @__PURE__ */ b(C, { path: e, scheme: r.childs })
   },
-  `condition--${o}-${e.depended}-${r.length}`
-) : e.type === "extra" ? /* @__PURE__ */ h(G, { path: r, item: e }, `partial-item--${o}-${r.length}`) : /* @__PURE__ */ h(
-  z,
+  `condition--${n}-${r.depended}-${e.length}`
+) : r.type === "extra" ? /* @__PURE__ */ b(z, { path: e, item: r }, `partial-item--${n}-${e.length}`) : /* @__PURE__ */ b(
+  U,
   {
-    name: [...r, e.name].join("."),
-    item: e
+    name: [...e, r.name].join("."),
+    item: r
   },
-  `form-item--${o}-${e.name}-${r.length}`
-)) }), V = (n, r, e, o) => {
-  n.forEach((t) => {
-    if (t.type === "form" && o(t, [...r, t.name].join("."), e[t.name]), t.type === "context") {
-      V(t.childs, [...r, t.context], e[t.context] ?? {}, o);
+  `form-item--${n}-${r.name}-${e.length}`
+)) }), V = (o, e, r, n) => {
+  o.forEach((t) => {
+    if (t.type === "form" && n(t, [...e, t.name].join("."), r[t.name]), t.type === "context") {
+      V(t.childs, [...e, t.context], r[t.context] ?? {}, n);
       return;
     }
     if (t.type === "layout" || t.type === "condition") {
-      V(t.childs, r, e, o);
+      V(t.childs, e, r, n);
       return;
     }
-    t.type === "extra" && t.items.forEach(({ getForm: f, name: b }) => {
-      V([f(b, () => {
-      })], r, e, o);
+    t.type === "extra" && t.items.forEach(({ getForm: f, name: h }) => {
+      V([f(h, () => {
+      })], e, r, n);
     });
   });
-}, E = ({ scheme: n, values: r, path: e, forms: o }) => {
-  n.forEach((t) => {
+}, E = ({ scheme: o, values: e, path: r, forms: n }) => {
+  o.forEach((t) => {
     if (t.type === "form") {
-      const f = [...e, t.name].join(".");
-      o[f].value !== void 0 && (r[t.name] = o[f].value);
+      const f = [...r, t.name].join(".");
+      n[f].value !== void 0 && (e[t.name] = n[f].value);
     }
     if (t.type === "context") {
-      r[t.context] = {}, E({
+      e[t.context] = {}, E({
         scheme: t.childs,
-        path: [...e, t.context],
-        values: r[t.context],
-        forms: o
+        path: [...r, t.context],
+        values: e[t.context],
+        forms: n
       });
       return;
     }
     if (t.type === "layout") {
-      E({ scheme: t.childs, path: e, values: r, forms: o });
+      E({ scheme: t.childs, path: r, values: e, forms: n });
       return;
     }
     if (t.type === "condition") {
-      const f = o[t.depended]?.value;
+      const f = n[t.depended]?.value;
       if (t.canActivate(f)) {
-        E({ scheme: t.childs, path: e, values: r, forms: o });
+        E({ scheme: t.childs, path: r, values: e, forms: n });
         return;
       }
     }
-    t.type === "extra" && t.items.forEach(({ getForm: f, name: b }) => {
-      E({ scheme: [f(b, () => {
-      })], path: e, values: r, forms: o });
+    t.type === "extra" && t.items.forEach(({ getForm: f, name: h }) => {
+      E({ scheme: [f(h, () => {
+      })], path: r, values: e, forms: n });
     });
   });
-}, w = (n, r) => {
-  const e = {};
-  return E({ scheme: n, path: [], values: e, forms: r }), e;
-}, H = (n, r) => {
-  const { onSubmit: e, onEqual: o, disabled: t, onDirty: f, onFormDirty: b, onChangeEvent: x, defaultValues: y } = r, v = { onSubmit: e }, d = {
+}, B = (o, e) => {
+  const r = {};
+  return E({ scheme: o, path: [], values: r, forms: e }), r;
+}, G = (o, e) => {
+  const { onSubmit: r, onEqual: n, disabled: t, onDirty: f, onFormDirty: h, onChangeEvent: x, defaultValues: y } = e, v = { onSubmit: r }, d = {
     isActive: !1,
     isSubmitted: !1,
     dirtyCount: 0
@@ -167,7 +175,7 @@ const D = P({}), B = (n) => {
     subscribers: [],
     names: {}
   };
-  V(n, [], y ?? {}, (s, u, i) => {
+  V(o, [], y ?? {}, (s, u, i) => {
     a[u] = {
       error: null,
       isDirty: !1,
@@ -184,11 +192,11 @@ const D = P({}), B = (n) => {
     };
   });
   const g = (s, u) => {
-    f?.({ name: s, isDirty: u }), u && d.dirtyCount === 0 && b?.(!0), !u && d.dirtyCount === 1 && b?.(!1), d.dirtyCount += u ? 1 : -1;
+    f?.({ name: s, isDirty: u }), u && d.dirtyCount === 0 && h?.(!0), !u && d.dirtyCount === 1 && h?.(!1), d.dirtyCount += u ? 1 : -1;
   };
   return {
     submitRef: v,
-    scheme: n,
+    scheme: o,
     disabled: t,
     activate() {
       d.isActive = !0;
@@ -212,7 +220,7 @@ const D = P({}), B = (n) => {
       i && i.value !== u && this.onChange(s, u);
     },
     getValues() {
-      return w(n, a);
+      return B(o, a);
     },
     async handleSubmit() {
       if (t)
@@ -228,10 +236,10 @@ const D = P({}), B = (n) => {
       }
       if (!u) {
         if (d.dirtyCount === 0) {
-          o?.();
+          n?.();
           return;
         }
-        const i = w(n, a);
+        const i = B(o, a);
         await v.onSubmit(i, {
           setError: (c, F) => {
             const m = this.getForm(c);
@@ -244,7 +252,7 @@ const D = P({}), B = (n) => {
       }
     },
     reset(s, { asDirty: u }) {
-      V(n, [], s, (i, c, F) => {
+      V(o, [], s, (i, c, F) => {
         if (F === void 0 && a[c].value === void 0)
           return;
         if (l.names[c] && F === void 0) {
@@ -258,7 +266,7 @@ const D = P({}), B = (n) => {
       });
     },
     setAsDefault() {
-      V(n, [], {}, ({}, s) => {
+      V(o, [], {}, ({}, s) => {
         a[s].startValue = a[s].value, a[s].isDirty = !1;
       }), d.dirtyCount = 0, d.isSubmitted = !1;
     },
@@ -302,106 +310,107 @@ const D = P({}), B = (n) => {
       });
     }
   };
-}, Q = (n, r) => {
-  const e = T(null);
-  e.current === null && (e.current = H(n, r));
-  const o = e.current;
-  return p(() => {
-    e.current && (e.current.submitRef.onSubmit = r.onSubmit);
-  }, [r.onSubmit]), {
-    manager: o,
-    useValue: (t) => B(t),
+}, Q = (o, e) => {
+  const r = T(null);
+  r.current === null && (r.current = G(o, e));
+  const n = r.current;
+  return S(() => {
+    r.current && (r.current.submitRef.onSubmit = e.onSubmit);
+  }, [e.onSubmit]), {
+    manager: n,
+    useValue: (t) => q(t),
     reset: (t, f = {}) => {
-      o.reset(t, f);
+      n.reset(t, f);
     },
     setAsDefault: () => {
-      o.setAsDefault();
+      n.setAsDefault();
     },
     setFocus: (t) => {
-      o.setFocus(t);
+      n.setFocus(t);
     },
     setError: (t, f) => {
-      o.setError(t, f);
+      n.setError(t, f);
     },
     setValue: (t, f) => {
-      o.setValue(t, f);
+      n.setValue(t, f);
     },
-    getValues: () => o.getValues(),
+    getValues: () => n.getValues(),
     handleSubmit: async () => {
-      await o.handleSubmit();
+      await n.handleSubmit();
     }
   };
-}, U = ({ manager: n }) => (A(() => {
-  n.activate();
-}, []), p(() => () => {
-  n.disactivate();
-}, []), /* @__PURE__ */ h(D.Provider, { value: n, children: /* @__PURE__ */ h(C, { scheme: n.scheme, path: [] }) })), S = (n) => {
+}, W = ({ manager: o }) => (p(() => {
+  o.activate();
+}, []), S(() => () => {
+  o.disactivate();
+}, []), /* @__PURE__ */ b(D.Provider, { value: o, children: /* @__PURE__ */ b(C, { scheme: o.scheme, path: [] }) })), $ = (o) => {
   try {
-    n();
-  } catch (r) {
-    return r && typeof r == "string" ? {
+    o();
+  } catch (e) {
+    return e && typeof e == "string" ? {
       error: !0,
-      messages: [r]
-    } : r instanceof Array && r.every((e) => e && typeof e == "string") ? {
+      messages: [e]
+    } : e instanceof Array && e.every((r) => r && typeof r == "string") ? {
       error: !0,
-      messages: r
+      messages: e
     } : {
       error: !0
     };
   }
-}, W = (n) => (r, e) => {
-  const o = n.getRequireCheck(e), { $rules: t = {}, ...f } = e, { validate: b, required: x } = t;
+}, X = (o) => (e, r) => {
+  const n = o.getRequireCheck(r), { $rules: t = {}, ...f } = r, { validate: h, required: x } = t;
   return {
     type: "form",
-    name: r,
-    defaultValue: n.defaultValue,
-    Form: n.getForm(f),
+    name: e,
+    defaultValue: o.defaultValue,
+    Form: o.getForm(f),
     validate: (y) => {
       if (x) {
-        const v = S(() => o(y));
+        const v = $(() => n(y));
         if (v)
           return v;
-        if (b) {
-          const d = S(() => b(y));
+        if (h) {
+          const d = $(() => h(y));
           if (d)
             return d;
         }
         return;
       }
-      if (b && !S(() => o(y))) {
-        const d = S(() => b(y));
+      if (h && !$(() => n(y))) {
+        const d = $(() => h(y));
         if (d)
           return d;
       }
     }
   };
-}, X = (n) => (r) => (...e) => ({
+}, Y = (o) => (e) => (...r) => ({
   type: "layout",
-  Layout: n(r),
-  childs: e
-}), Y = ({
-  getItems: n,
-  getController: r
+  Layout: o(e),
+  childs: r
+}), Z = ({
+  getItems: o,
+  getController: e
 }) => ({
   type: "extra",
-  items: n((e) => (o) => ({ type: "registry", name: e, getForm: o })),
-  getController: r
-}), Z = (n) => (...r) => ({
+  items: o((r) => (n) => ({ type: "registry", name: r, getForm: n })),
+  getController: e
+}), _ = (o) => (...e) => ({
   type: "context",
-  context: n,
-  childs: r
-}), _ = (n, r) => (...e) => ({
-  type: "condition",
-  depended: n,
-  canActivate: r.canActivate,
+  context: o,
   childs: e
+}), k = (o, e) => (...r) => ({
+  type: "condition",
+  depended: o,
+  canActivate: e.canActivate,
+  childs: r
 });
 export {
-  _ as Condition,
-  Z as Context,
-  U as FormLayout,
-  Y as createExtraForm,
-  W as createForm,
-  X as createLayout,
+  k as Condition,
+  _ as Context,
+  W as FormLayout,
+  Z as createExtraForm,
+  X as createForm,
+  Y as createLayout,
+  O as createUseValue,
   Q as useForm
 };

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export { useForm, FormLayout } from './useForm';
+export { createUseValue } from './useValue';
 export { createForm } from './core/builders/create-form';
 export { createLayout } from './core/builders/create-layout';
 export { createExtraForm } from './core/builders/create-extra-form';

package/dist/useValue.d.ts

@@ -1 +1,4 @@
-export declare const useValue: (name: string) => any;
+import { SchemeItems } from './core/types';
+import { ExtractFlatValues } from './core/extract';
+export declare const useValue: <T = any>(name: string) => T;
+export declare const createUseValue: <Items extends SchemeItems.All[]>() => <FlattenValues extends ExtractFlatValues<Items[number]>, K extends keyof FlattenValues>(name: K & string) => FlattenValues[K];

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@companix/formkit",
-  "version": "0.0.16",
+  "version": "0.0.17",
   "module": "./dist/bundle.es.js",
   "types": "./dist/index.d.ts",
   "type": "module",
-  "author": "Pavel Victorov",
+  "author": "Pavel Victorov.",
   "files": [
     "dist"
   ],