@companix/formkit 0.0.7 → 0.0.10

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.
@@ -2,6 +2,5 @@ import { SchemeItems } from './core/types';
2
2
  export interface SchemeBuilderProps {
3
3
  scheme: SchemeItems.All[];
4
4
  path: string[];
5
- className?: string;
6
5
  }
7
- export declare const SchemeBuilder: ({ scheme, path, className }: SchemeBuilderProps) => import("react/jsx-runtime").JSX.Element;
6
+ export declare const SchemeBuilder: ({ scheme, path }: SchemeBuilderProps) => import("react/jsx-runtime").JSX.Element;
package/dist/bundle.es.js CHANGED
@@ -1,44 +1,44 @@
1
- import { jsx as b, Fragment as B, jsxs as P } from "react/jsx-runtime";
2
- import { createContext as T, useState as q, useContext as L, useEffect as D, useMemo as A, useCallback as S, useRef as N } from "react";
3
- import R from "fast-deep-equal";
4
- const j = T({}), M = (s) => {
5
- const [, r] = q([]), o = L(j), e = o.getForm(s);
6
- return D(() => {
7
- const { unsubscribe: t } = o.subscribeToForm(s, () => {
1
+ import { jsx as v, Fragment as j, jsxs as M } from "react/jsx-runtime";
2
+ import { createContext as P, useState as R, useContext as q, useEffect as C, useMemo as A, useCallback as $, useRef as T } from "react";
3
+ import L from "fast-deep-equal";
4
+ const D = P({}), B = (n) => {
5
+ const [, r] = R([]), e = q(D), s = e.getForm(n);
6
+ return C(() => {
7
+ const { unsubscribe: t } = e.subscribeToForm(n, () => {
8
8
  r([]);
9
9
  });
10
10
  return () => {
11
11
  t();
12
12
  };
13
- }, []), e?.value;
14
- }, _ = ({ canActivate: s, name: r, children: o }) => {
15
- const e = M(r);
16
- return s(e) ? /* @__PURE__ */ b(B, { children: o }) : null;
17
- }, z = ({ item: { Form: s }, name: r }) => {
18
- const [, o] = q([]), e = L(j), { unregistry: t } = A(() => e.registry(r, () => {
19
- o([]);
20
- }), []), l = S(
13
+ }, []), s?.value;
14
+ }, N = ({ canActivate: n, name: r, children: e }) => {
15
+ const s = B(r);
16
+ return n(s) ? /* @__PURE__ */ v(j, { children: e }) : null;
17
+ }, _ = ({ item: { Form: n }, name: r }) => {
18
+ const [, e] = R([]), s = q(D), { unregistry: t } = A(() => s.registry(r, () => {
19
+ e([]);
20
+ }), []), l = $(
21
21
  (d) => {
22
22
  if (d && d.focus) {
23
- const g = e.getForm(r);
24
- g.focus = () => {
23
+ const m = s.getForm(r);
24
+ m.focus = () => {
25
25
  d.focus();
26
26
  };
27
27
  }
28
28
  },
29
29
  [r]
30
30
  );
31
- D(() => () => {
31
+ C(() => () => {
32
32
  t();
33
33
  }, []);
34
- const { value: y, error: F } = e.getForm(r);
35
- return /* @__PURE__ */ b(
36
- s,
34
+ const { value: h, error: F } = s.getForm(r);
35
+ return /* @__PURE__ */ v(
36
+ n,
37
37
  {
38
38
  field: {
39
- value: y,
39
+ value: h,
40
40
  onChange: (d) => {
41
- e.onChange(r, d);
41
+ s.onChange(r, d);
42
42
  },
43
43
  onBlur: () => {
44
44
  },
@@ -46,351 +46,352 @@ const j = T({}), M = (s) => {
46
46
  },
47
47
  isDirty: !1,
48
48
  error: F,
49
- disabled: e.disabled
49
+ disabled: s.disabled
50
50
  }
51
51
  );
52
- }, G = ({ item: s, path: r }) => {
53
- const { getController: o, items: e } = s, t = L(j), l = A(() => {
54
- const i = {};
55
- return e.forEach(({ name: f, getForm: x }) => {
56
- i[f] = x(f, () => p(f));
57
- }), i;
58
- }, []), y = S(() => {
59
- const i = [];
60
- return e.forEach(({ name: f }) => {
61
- t.getForm([...r, f].join(".")).value !== void 0 && i.push(f);
62
- }), i;
63
- }, []), F = A(() => y(), []), [d, g] = q(F);
64
- D(() => {
65
- const { unregistry: i } = t.registryExtraForm(
66
- e.map(({ name: f }) => [...r, f].join(".")),
52
+ }, z = ({ item: n, path: r }) => {
53
+ const { getController: e, items: s } = n, t = q(D), l = A(() => {
54
+ const a = {};
55
+ return s.forEach(({ name: g, getForm: o }) => {
56
+ a[g] = o(g, () => f(g));
57
+ }), a;
58
+ }, []), h = $(() => {
59
+ const a = [];
60
+ return s.forEach(({ name: g }) => {
61
+ t.getForm([...r, g].join(".")).value !== void 0 && a.push(g);
62
+ }), a;
63
+ }, []), F = A(() => h(), []), [d, m] = R(F);
64
+ C(() => {
65
+ const { unregistry: a } = t.registryExtraForm(
66
+ s.map(({ name: g }) => [...r, g].join(".")),
67
67
  () => {
68
- g(y());
68
+ m(h());
69
69
  }
70
70
  );
71
71
  return () => {
72
- i();
72
+ a();
73
73
  };
74
74
  }, []);
75
- const v = S(
76
- (i) => {
77
- l[i] && !d.includes(i) && g((f) => [...f, i]);
75
+ const y = $(
76
+ (a) => {
77
+ l[a] && !d.includes(a) && m((g) => [...g, a]);
78
78
  },
79
79
  [d]
80
- ), p = S((i) => {
81
- g((f) => f.filter((x) => x !== i));
80
+ ), f = $((a) => {
81
+ m((g) => g.filter((o) => o !== a));
82
82
  }, []);
83
- return /* @__PURE__ */ P(B, { children: [
84
- d.map((i) => {
85
- const f = l[i];
86
- return /* @__PURE__ */ b(V, { path: r, scheme: [f] }, `param-form--${i}`);
83
+ return /* @__PURE__ */ M(j, { children: [
84
+ d.map((a) => {
85
+ const g = l[a];
86
+ return /* @__PURE__ */ v(V, { path: r, scheme: [g] }, `param-form--${a}`);
87
87
  }),
88
- o(v, d)
88
+ e(y, d)
89
89
  ] });
90
- }, V = ({ scheme: s, path: r, className: o }) => /* @__PURE__ */ b("div", { className: o, children: s.map((e, t) => e.type === "layout" ? /* @__PURE__ */ b(e.Layout, { children: /* @__PURE__ */ b(V, { path: r, scheme: e.childs }) }, `layout-form--${t}-${r.length}`) : e.type === "context" ? /* @__PURE__ */ b(
90
+ }, V = ({ scheme: n, path: r }) => /* @__PURE__ */ v(j, { children: n.map((e, s) => e.type === "layout" ? /* @__PURE__ */ v(e.Layout, { children: /* @__PURE__ */ v(V, { path: r, scheme: e.childs }) }, `layout-form--${s}-${r.length}`) : e.type === "context" ? /* @__PURE__ */ v(
91
91
  V,
92
92
  {
93
93
  path: [...r, e.context],
94
94
  scheme: e.childs
95
95
  },
96
- `context-form--${t}-${e.context}-${r.length}`
97
- ) : e.type === "condition" ? /* @__PURE__ */ b(
98
- _,
96
+ `context-form--${s}-${e.context}-${r.length}`
97
+ ) : e.type === "condition" ? /* @__PURE__ */ v(
98
+ N,
99
99
  {
100
100
  name: e.depended,
101
101
  canActivate: e.canActivate,
102
- children: /* @__PURE__ */ b(V, { path: r, scheme: e.childs })
102
+ children: /* @__PURE__ */ v(V, { path: r, scheme: e.childs })
103
103
  },
104
- `condition--${t}-${e.depended}-${r.length}`
105
- ) : e.type === "extra" ? /* @__PURE__ */ b(G, { path: r, item: e }, `partial-item--${t}-${r.length}`) : /* @__PURE__ */ b(
106
- z,
104
+ `condition--${s}-${e.depended}-${r.length}`
105
+ ) : e.type === "extra" ? /* @__PURE__ */ v(z, { path: r, item: e }, `partial-item--${s}-${r.length}`) : /* @__PURE__ */ v(
106
+ _,
107
107
  {
108
108
  name: [...r, e.name].join("."),
109
109
  item: e
110
110
  },
111
- `form-item--${t}-${e.name}-${r.length}`
112
- )) }), C = (s, r, o, e) => {
113
- s.forEach((t) => {
114
- if (t.type === "form" && e(t, [...r, t.name].join("."), o[t.name]), t.type === "context") {
115
- C(t.childs, [...r, t.context], o[t.context] ?? {}, e);
111
+ `form-item--${s}-${e.name}-${r.length}`
112
+ )) }), p = (n, r, e, s) => {
113
+ n.forEach((t) => {
114
+ if (t.type === "form" && s(t, [...r, t.name].join("."), e[t.name]), t.type === "context") {
115
+ p(t.childs, [...r, t.context], e[t.context] ?? {}, s);
116
116
  return;
117
117
  }
118
118
  if (t.type === "layout" || t.type === "condition") {
119
- C(t.childs, r, o, e);
119
+ p(t.childs, r, e, s);
120
120
  return;
121
121
  }
122
- t.type === "extra" && t.items.forEach(({ getForm: l, name: y }) => {
123
- C([l(y, () => {
124
- })], r, o, e);
122
+ t.type === "extra" && t.items.forEach(({ getForm: l, name: h }) => {
123
+ p([l(h, () => {
124
+ })], r, e, s);
125
125
  });
126
126
  });
127
- }, E = ({ scheme: s, values: r, path: o, forms: e }) => {
128
- s.forEach((t) => {
127
+ }, E = ({ scheme: n, values: r, path: e, forms: s }) => {
128
+ n.forEach((t) => {
129
129
  if (t.type === "form") {
130
- const l = [...o, t.name].join(".");
131
- e[l].value !== void 0 && (r[t.name] = e[l].value);
130
+ const l = [...e, t.name].join(".");
131
+ s[l].value !== void 0 && (r[t.name] = s[l].value);
132
132
  }
133
133
  if (t.type === "context") {
134
134
  r[t.context] = {}, E({
135
135
  scheme: t.childs,
136
- path: [...o, t.context],
136
+ path: [...e, t.context],
137
137
  values: r[t.context],
138
- forms: e
138
+ forms: s
139
139
  });
140
140
  return;
141
141
  }
142
142
  if (t.type === "layout") {
143
- E({ scheme: t.childs, path: o, values: r, forms: e });
143
+ E({ scheme: t.childs, path: e, values: r, forms: s });
144
144
  return;
145
145
  }
146
146
  if (t.type === "condition") {
147
- const l = e[t.depended]?.value;
147
+ const l = s[t.depended]?.value;
148
148
  if (t.canActivate(l)) {
149
- E({ scheme: t.childs, path: o, values: r, forms: e });
149
+ E({ scheme: t.childs, path: e, values: r, forms: s });
150
150
  return;
151
151
  }
152
152
  }
153
- t.type === "extra" && t.items.forEach(({ getForm: l, name: y }) => {
154
- E({ scheme: [l(y, () => {
155
- })], path: o, values: r, forms: e });
153
+ t.type === "extra" && t.items.forEach(({ getForm: l, name: h }) => {
154
+ E({ scheme: [l(h, () => {
155
+ })], path: e, values: r, forms: s });
156
156
  });
157
157
  });
158
- }, w = (s, r) => {
159
- const o = {};
160
- return E({ scheme: s, path: [], values: o, forms: r }), o;
161
- }, H = (s, r) => {
162
- const { onSubmit: o, onEqual: e, disabled: t, onDirty: l, onFormDirty: y, onChangeEvent: F, defaultValues: d } = r;
163
- let g = !1, v = !1, p = 0;
164
- const i = {}, f = {
158
+ }, w = (n, r) => {
159
+ const e = {};
160
+ return E({ scheme: n, path: [], values: e, forms: r }), e;
161
+ }, G = (n, r) => {
162
+ const { onSubmit: e, onEqual: s, disabled: t, onDirty: l, onFormDirty: h, onChangeEvent: F, defaultValues: d } = r, m = { onSubmit: e }, y = {
163
+ isActive: !1,
164
+ isSubmitted: !1,
165
+ dirtyCount: 0
166
+ }, f = {}, a = {
165
167
  subscribers: [],
166
168
  names: {}
167
169
  };
168
- C(s, [], d ?? {}, (n, c, u) => {
169
- i[c] = {
170
+ p(n, [], d ?? {}, (o, u, i) => {
171
+ f[u] = {
170
172
  error: null,
171
173
  isDirty: !1,
172
- value: u,
173
- initValue: u ?? n.defaultValue,
174
- defaultValue: n.defaultValue,
174
+ value: i,
175
+ initValue: i ?? o.defaultValue,
176
+ defaultValue: o.defaultValue,
175
177
  rerender: () => {
176
178
  },
177
179
  subscribers: [],
178
- validate: n.validate
180
+ validate: o.validate
179
181
  };
180
182
  });
181
- const x = (n, c) => {
182
- l?.({ name: n, isDirty: c }), c && p === 0 && y?.(!0), !c && p === 1 && y?.(!1), p += c ? 1 : -1;
183
+ const g = (o, u) => {
184
+ l?.({ name: o, isDirty: u }), u && y.dirtyCount === 0 && h?.(!0), !u && y.dirtyCount === 1 && h?.(!1), y.dirtyCount += u ? 1 : -1;
183
185
  };
184
186
  return {
185
- scheme: s,
187
+ submitRef: m,
188
+ scheme: n,
186
189
  disabled: t,
187
190
  activate() {
188
- g = !0;
191
+ y.isActive = !0;
189
192
  },
190
193
  disactivate() {
191
- g = !1;
194
+ y.isActive = !1;
192
195
  },
193
- setError(n, c) {
194
- const u = this.getForm(n);
195
- u && (u.error = {
196
+ setError(o, u) {
197
+ const i = this.getForm(o);
198
+ i && (i.error = {
196
199
  error: !0,
197
- messages: [c.message]
198
- }, u.rerender());
200
+ messages: [u.message]
201
+ }, i.rerender());
199
202
  },
200
- setFocus(n) {
201
- const c = this.getForm(n);
202
- c && c.focus && c.focus();
203
+ setFocus(o) {
204
+ const u = this.getForm(o);
205
+ u && u.focus && u.focus();
203
206
  },
204
- setValue(n, c) {
205
- const u = this.getForm(n);
206
- u && u.value !== c && this.onChange(n, c);
207
+ setValue(o, u) {
208
+ const i = this.getForm(o);
209
+ i && i.value !== u && this.onChange(o, u);
207
210
  },
208
211
  getValues() {
209
- return w(s, i);
212
+ return w(n, f);
210
213
  },
211
214
  async handleSubmit() {
212
215
  if (t)
213
216
  return;
214
- v = !0;
215
- let n = !1, c = !1;
216
- for (const u in i) {
217
- const a = i[u];
218
- if (a.value !== void 0) {
219
- const h = a.validate(a.value);
220
- h && (c = !0, a.error = h, a.rerender(), !n && a.focus && (a.focus(), n = !0));
217
+ y.isSubmitted = !0;
218
+ let o = !1, u = !1;
219
+ for (const i in f) {
220
+ const c = f[i];
221
+ if (c.value !== void 0) {
222
+ const b = c.validate(c.value);
223
+ b && (u = !0, c.error = b, c.rerender(), !o && c.focus && (c.focus(), o = !0));
221
224
  }
222
225
  }
223
- if (!c) {
224
- if (p === 0) {
225
- e?.();
226
+ if (!u) {
227
+ if (y.dirtyCount === 0) {
228
+ s?.();
226
229
  return;
227
230
  }
228
- const u = w(s, i);
229
- await o(u, {
230
- setError: (a, h) => {
231
- const m = this.getForm(a);
232
- m.error = {
231
+ const i = w(n, f);
232
+ await m.onSubmit(i, {
233
+ setError: (c, b) => {
234
+ const x = this.getForm(c);
235
+ x.error = {
233
236
  error: !0,
234
- messages: [h.message]
235
- }, m.rerender();
237
+ messages: [b.message]
238
+ }, x.rerender();
236
239
  }
237
240
  });
238
241
  }
239
242
  },
240
- reset(n) {
241
- const c = [];
242
- C(s, [], n, (u, a, h) => {
243
- if (h === void 0 && i[a].value === void 0)
243
+ reset(o) {
244
+ const u = [];
245
+ p(n, [], o, (i, c, b) => {
246
+ if (b === void 0 && f[c].value === void 0)
244
247
  return;
245
- if (f.names[a] && h === void 0) {
246
- c.push(a), i[a].value = h;
248
+ if (a.names[c] && b === void 0) {
249
+ u.push(c), f[c].value = b;
247
250
  return;
248
251
  }
249
- const m = h ?? u.defaultValue;
250
- i[a].value !== m && (c.push(a), this.onChange(a, m));
251
- }), c.some((u) => f.names[u]) && f.subscribers.forEach(({ callback: u }) => {
252
- u();
252
+ const x = b ?? i.defaultValue;
253
+ f[c].value !== x && (u.push(c), this.onChange(c, x));
254
+ }), u.some((i) => a.names[i]) && a.subscribers.forEach(({ callback: i }) => {
255
+ i();
253
256
  });
254
257
  },
255
- registry(n, c) {
256
- return i[n].rerender = c, i[n].value === void 0 && (i[n].value = i[n].defaultValue), {
258
+ registry(o, u) {
259
+ return f[o].rerender = u, f[o].value === void 0 && (f[o].value = f[o].defaultValue), {
257
260
  unregistry() {
258
- if (i[n].rerender = () => {
259
- }, i[n].focus = void 0, g) {
260
- i[n].value = void 0;
261
- const u = !R(i[n].defaultValue, i[n].initValue);
262
- i[n].isDirty !== u && x(n, u), i[n].isDirty = u;
261
+ if (f[o].rerender = () => {
262
+ }, f[o].focus = void 0, y.isActive) {
263
+ f[o].value = void 0;
264
+ const i = !L(f[o].defaultValue, f[o].initValue);
265
+ f[o].isDirty !== i && g(o, i), f[o].isDirty = i;
263
266
  }
264
267
  }
265
268
  };
266
269
  },
267
- getForm(n) {
268
- return i[n];
270
+ getForm(o) {
271
+ return f[o];
269
272
  },
270
- subscribeToForm(n, c) {
271
- const u = { callback: c }, a = this.getForm(n);
272
- return a.subscribers.push(u), {
273
+ subscribeToForm(o, u) {
274
+ const i = { callback: u }, c = this.getForm(o);
275
+ return c.subscribers.push(i), {
273
276
  unsubscribe: () => {
274
- a.subscribers = a.subscribers.filter((h) => h !== u);
277
+ c.subscribers = c.subscribers.filter((b) => b !== i);
275
278
  }
276
279
  };
277
280
  },
278
- registryExtraForm(n, c) {
279
- const u = { callback: c };
280
- return n.forEach((a) => {
281
- f.names[a] = !0;
282
- }), f.subscribers.push(u), {
281
+ registryExtraForm(o, u) {
282
+ const i = { callback: u };
283
+ return o.forEach((c) => {
284
+ a.names[c] = !0;
285
+ }), a.subscribers.push(i), {
283
286
  unregistry() {
284
- f.subscribers = f.subscribers.filter((a) => a !== u);
287
+ a.subscribers = a.subscribers.filter((c) => c !== i);
285
288
  }
286
289
  };
287
290
  },
288
- onChange(n, c) {
289
- const u = this.getForm(n), a = !R(c, u.initValue);
290
- u.isDirty !== a && x(n, a), u.isDirty = a, F?.({ name: n, value: c }), (u.error || v) && (u.error = u.validate(c) || null), u.value = c, u.rerender(), u.subscribers.forEach(({ callback: h }) => {
291
- h();
291
+ onChange(o, u) {
292
+ const i = this.getForm(o), c = !L(u, i.initValue);
293
+ i.isDirty !== c && g(o, c), i.isDirty = c, F?.({ name: o, value: u }), (i.error || y.isSubmitted) && (i.error = i.validate(u) || null), i.value = u, i.rerender(), i.subscribers.forEach(({ callback: b }) => {
294
+ b();
292
295
  });
293
296
  }
294
297
  };
295
- }, Q = (s, r) => {
296
- const o = N(null);
297
- o.current === null && (o.current = H(s, r));
298
- const e = o.current;
299
- return {
300
- useValue: (t) => M(t),
298
+ }, O = (n, r) => {
299
+ const e = T(null);
300
+ e.current === null && (e.current = G(n, r));
301
+ const s = e.current;
302
+ return C(() => {
303
+ e.current && (e.current.submitRef.onSubmit = r.onSubmit);
304
+ }, [r.onSubmit]), {
305
+ manager: s,
306
+ useValue: (t) => B(t),
301
307
  reset: (t) => {
302
- e.reset(t);
308
+ s.reset(t);
303
309
  },
304
310
  setFocus: (t) => {
305
- e.setFocus(t);
311
+ s.setFocus(t);
306
312
  },
307
313
  setError: (t, l) => {
308
- e.setError(t, l);
314
+ s.setError(t, l);
309
315
  },
310
316
  setValue: (t, l) => {
311
- e.setValue(t, l);
317
+ s.setValue(t, l);
312
318
  },
313
- getValues: () => e.getValues(),
319
+ getValues: () => s.getValues(),
314
320
  handleSubmit: async () => {
315
- await e.handleSubmit();
316
- },
317
- manager: e
321
+ await s.handleSubmit();
322
+ }
318
323
  };
319
- }, U = ({ manager: s, className: r }) => (A(() => {
320
- s.activate();
321
- }, []), D(() => () => {
322
- s.disactivate();
323
- }, []), /* @__PURE__ */ b(j.Provider, { value: s, children: /* @__PURE__ */ b(V, { className: r, scheme: s.scheme, path: [] }) })), $ = (s) => {
324
+ }, Q = ({ manager: n }) => (A(() => {
325
+ n.activate();
326
+ }, []), C(() => () => {
327
+ n.disactivate();
328
+ }, []), /* @__PURE__ */ v(D.Provider, { value: n, children: /* @__PURE__ */ v(V, { scheme: n.scheme, path: [] }) })), S = (n) => {
324
329
  try {
325
- s();
330
+ n();
326
331
  } catch (r) {
327
332
  return r && typeof r == "string" ? {
328
333
  error: !0,
329
334
  messages: [r]
330
- } : r instanceof Array && r.every((o) => o && typeof o == "string") ? {
335
+ } : r instanceof Array && r.every((e) => e && typeof e == "string") ? {
331
336
  error: !0,
332
337
  messages: r
333
338
  } : {
334
339
  error: !0
335
340
  };
336
341
  }
337
- }, W = (s) => (r, o) => {
338
- const e = s.getRequireCheck(o), { $rules: t = {}, ...l } = o, { validate: y, required: F } = t;
342
+ }, U = (n) => (r, e) => {
343
+ const s = n.getRequireCheck(e), { $rules: t = {}, ...l } = e, { validate: h, required: F } = t;
339
344
  return {
340
345
  type: "form",
341
346
  name: r,
342
- defaultValue: s.defaultValue,
343
- Form: s.getForm(l),
347
+ defaultValue: n.defaultValue,
348
+ Form: n.getForm(l),
344
349
  validate: (d) => {
345
350
  if (F) {
346
- const g = $(() => e(d));
347
- if (g)
348
- return g;
349
- if (y) {
350
- const v = $(() => y(d));
351
- if (v)
352
- return v;
351
+ const m = S(() => s(d));
352
+ if (m)
353
+ return m;
354
+ if (h) {
355
+ const y = S(() => h(d));
356
+ if (y)
357
+ return y;
353
358
  }
354
359
  return;
355
360
  }
356
- if (y && !$(() => e(d))) {
357
- const v = $(() => y(d));
358
- if (v)
359
- return v;
361
+ if (h && !S(() => s(d))) {
362
+ const y = S(() => h(d));
363
+ if (y)
364
+ return y;
360
365
  }
361
366
  }
362
367
  };
363
- }, X = (s) => (r) => (...o) => ({
368
+ }, W = (n) => (r) => (...e) => ({
364
369
  type: "layout",
365
- Layout: s(r),
366
- childs: o
367
- }), Y = ({
368
- getItems: s,
370
+ Layout: n(r),
371
+ childs: e
372
+ }), X = ({
373
+ getItems: n,
369
374
  getController: r
370
375
  }) => ({
371
376
  type: "extra",
372
- items: s((o) => (e) => ({
373
- type: "registry",
374
- name: o,
375
- getForm: e
376
- })),
377
+ items: n((e) => (s) => ({ type: "registry", name: e, getForm: s })),
377
378
  getController: r
378
- }), Z = (s) => (...r) => ({
379
+ }), Y = (n) => (...r) => ({
379
380
  type: "context",
380
- context: s,
381
+ context: n,
381
382
  childs: r
382
- }), k = (s, r) => (...o) => ({
383
+ }), Z = (n, r) => (...e) => ({
383
384
  type: "condition",
384
- depended: s,
385
+ depended: n,
385
386
  canActivate: r.canActivate,
386
- childs: o
387
+ childs: e
387
388
  });
388
389
  export {
389
- k as Condition,
390
- Z as Context,
391
- U as FormLayout,
392
- Y as createExtraForm,
393
- W as createForm,
394
- X as createLayout,
395
- Q as useForm
390
+ Z as Condition,
391
+ Y as Context,
392
+ Q as FormLayout,
393
+ X as createExtraForm,
394
+ U as createForm,
395
+ W as createLayout,
396
+ O as useForm
396
397
  };
package/dist/context.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import { FormManager } from './manager/manager';
2
- export declare const FormContext: import('react').Context<FormManager<any, any>>;
2
+ export declare const FormContext: import('react').Context<FormManager<any, any, any>>;
@@ -1,6 +1,6 @@
1
1
  import { DeepPartial, FieldValues } from '../types';
2
2
  import { FieldError, SchemeItems } from '../core/types';
3
- import { MainOptions, SetError } from '../useForm';
3
+ import { MainOptions, SetError, SubmitCallbacls } from '../useForm';
4
4
  interface FormItem {
5
5
  isDirty: boolean;
6
6
  error: FieldError | null;
@@ -17,7 +17,10 @@ interface FormItem {
17
17
  export interface Forms {
18
18
  [name: string]: FormItem;
19
19
  }
20
- export interface FormManager<FlattenValues, ClonedValues> {
20
+ export interface FormManager<Values, FlattenValues, ClonedValues> {
21
+ submitRef: {
22
+ onSubmit: (values: Values, callbacks: SubmitCallbacls<FlattenValues>) => void;
23
+ };
21
24
  scheme: SchemeItems.All[];
22
25
  disabled?: boolean;
23
26
  activate: () => void;
@@ -40,5 +43,5 @@ export interface FormManager<FlattenValues, ClonedValues> {
40
43
  reset: (v: DeepPartial<ClonedValues>) => void;
41
44
  getValues: () => DeepPartial<ClonedValues>;
42
45
  }
43
- export declare const createFormManager: <Values extends FieldValues, Flatten, Cloned>(scheme: SchemeItems.All[], opts: MainOptions<Values, Flatten, Cloned>) => FormManager<Flatten, Cloned>;
46
+ export declare const createFormManager: <Values extends FieldValues, Flatten, Cloned>(scheme: SchemeItems.All[], options: MainOptions<Values, Flatten, Cloned>) => FormManager<Values, Flatten, Cloned>;
44
47
  export {};
package/dist/useForm.d.ts CHANGED
@@ -20,6 +20,9 @@ export type DirtyEvent<T> = Required<{
20
20
  export type SetError<V> = (name: keyof V, error: {
21
21
  message: string;
22
22
  }) => void;
23
+ export interface SubmitCallbacls<FlattenValues> {
24
+ setError: SetError<FlattenValues>;
25
+ }
23
26
  export interface MainOptions<Values extends FieldValues, FlattenValues, ClonedValues> {
24
27
  disabled?: boolean;
25
28
  defaultValues?: DeepPartial<ClonedValues>;
@@ -27,11 +30,10 @@ export interface MainOptions<Values extends FieldValues, FlattenValues, ClonedVa
27
30
  onDirty?: (event: DirtyEvent<FlattenValues>) => void;
28
31
  onChangeEvent?: (event: ChangeEvent<FlattenValues>) => void;
29
32
  onFormDirty?: (isDirty: boolean) => void;
30
- onSubmit: (values: Values, { setError }: {
31
- setError: SetError<FlattenValues>;
32
- }) => Promise<void>;
33
+ onSubmit: (values: Values, callbacks: SubmitCallbacls<FlattenValues>) => Promise<void>;
33
34
  }
34
35
  declare const useDynamicForm: (scheme: SchemeItems.All[], opts: MainOptions<FieldValues, FieldValues, FieldValues>) => {
36
+ manager: FormManager<FieldValues, FieldValues, FieldValues>;
35
37
  useValue: <K extends string>(name: K) => any;
36
38
  reset: (values: {
37
39
  [x: string]: any;
@@ -45,9 +47,9 @@ declare const useDynamicForm: (scheme: SchemeItems.All[], opts: MainOptions<Fiel
45
47
  [x: string]: any;
46
48
  };
47
49
  handleSubmit: () => Promise<void>;
48
- manager: FormManager<FieldValues, FieldValues>;
49
50
  };
50
51
  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>) => {
52
+ manager: FormManager<Values, FlattenValues, Cloned>;
51
53
  useValue: <K extends keyof FlattenValues>(name: K) => FlattenValues[K];
52
54
  reset: (values: DeepPartial<Cloned>) => void;
53
55
  setFocus: (name: keyof FlattenValues) => void;
@@ -57,11 +59,9 @@ declare const useForm: <Items extends SchemeItems.All[], Values extends ExtractV
57
59
  setValue: <K extends keyof FlattenValues>(name: K, value: FlattenValues[K]) => void;
58
60
  getValues: () => DeepPartial<Cloned>;
59
61
  handleSubmit: () => Promise<void>;
60
- manager: FormManager<FlattenValues, Cloned>;
61
62
  };
62
63
  interface Props {
63
- className?: string;
64
- manager: FormManager<any, any>;
64
+ manager: FormManager<any, any, any>;
65
65
  }
66
- export declare const FormLayout: ({ manager, className }: Props) => import("react/jsx-runtime").JSX.Element;
66
+ export declare const FormLayout: ({ manager }: Props) => import("react/jsx-runtime").JSX.Element;
67
67
  export { useForm, useDynamicForm };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@companix/formkit",
3
- "version": "0.0.07",
3
+ "version": "0.0.10",
4
4
  "module": "./dist/bundle.es.js",
5
5
  "types": "./dist/index.d.ts",
6
6
  "type": "module",