@code0-tech/pictor 0.11.0 → 0.12.0

package/dist/components/data-table/DataTable.js

@@ -1,42 +1,64 @@
-import { jsxs as _, jsx as p } from "react/jsx-runtime";
-import g from "react";
+import { jsxs as x, jsx as y } from "react/jsx-runtime";
+import c from "react";
 import '../../assets/components/data-table/DataTable.style.css';/* empty css                     */
 import "../../utils/contextStore.js";
-import { mergeComponentProps as h } from "../../utils/component.js";
+import { mergeComponentProps as E } from "../../utils/component.js";
 import "js-md5";
-const d = (l, m) => m.split(".").reduce((t, f) => {
-  if (t != null)
-    return Array.isArray(t) ? t.map((a) => a?.[f]).filter((a) => a !== void 0) : t[f];
-}, l), w = (l) => {
+import { Flex as F } from "../flex/Flex.js";
+import { DataTableHeader as R } from "./DataTableHeader.js";
+import { DataTablePaginationContext as v } from "./DataTablePagination.js";
+const C = (u, p) => p.split(".").reduce((n, m) => {
+  if (n != null)
+    return Array.isArray(n) ? n.map((i) => i?.[m]).filter((i) => i !== void 0) : n[m];
+}, u), U = (u) => {
   const {
-    data: m,
-    sort: t,
-    filter: f,
-    loading: a,
-    loadingComponent: C,
-    emptyComponent: A,
-    onSelect: u,
-    children: O,
-    ...b
-  } = l, y = m.filter((i) => Object.entries(f || {}).every(([o, {
-    operator: n,
-    value: r
+    data: p,
+    sort: n,
+    filter: m,
+    limit: i,
+    pagination: A,
+    loading: _,
+    loadingComponent: z,
+    emptyComponent: D,
+    onSelect: N,
+    children: g,
+    ...k
+  } = u, [b, P] = c.useState(0), h = Array.isArray(g) ? g : [g], w = h.find((r) => typeof r == "function"), V = h.find((r) => c.isValidElement(r) && r.type === R), S = h.filter((r) => typeof r != "function" && r !== V), O = p.filter((r) => Object.entries(m || {}).every(([o, {
+    operator: a,
+    value: e
   }]) => {
-    const e = d(i, o);
-    return n === "isOneOf" && !Array.isArray(r) && !Array.isArray(e) ? e === r : n === "isOneOf" && !Array.isArray(r) && Array.isArray(e) ? Array.from(e).includes(r) : n === "isOneOf" && Array.isArray(r) && !Array.isArray(e) ? Array.from(r).some((s) => s === e) : n === "isOneOf" && Array.isArray(r) && Array.isArray(e) ? Array.from(r).some((s) => Array.from(e).includes(s)) : !1;
-  })), c = g.useMemo(() => t ? [...y].sort((i, o) => {
-    for (const [n, r] of Object.entries(t)) {
-      const e = d(i, n), s = d(o, n);
-      if (e < s) return r === "asc" ? -1 : 1;
-      if (e > s) return r === "asc" ? 1 : -1;
+    const t = C(r, o);
+    return a === "isOneOf" && !Array.isArray(e) && !Array.isArray(t) ? t === e : a === "isOneOf" && !Array.isArray(e) && Array.isArray(t) ? Array.from(t).includes(e) : a === "isOneOf" && Array.isArray(e) && !Array.isArray(t) ? Array.from(e).some((l) => l === t) : a === "isOneOf" && Array.isArray(e) && Array.isArray(t) ? Array.from(e).some((l) => Array.from(t).includes(l)) : !1;
+  })), f = c.useMemo(() => n ? [...O].sort((r, o) => {
+    for (const [a, e] of Object.entries(n)) {
+      const t = C(r, a), l = C(o, a);
+      if (t < l) return e === "asc" ? -1 : 1;
+      if (t > l) return e === "asc" ? 1 : -1;
     }
     return 0;
-  }) : y, [y, t]);
-  return /* @__PURE__ */ _("table", { ...h("data-table", b), children: [
-    c.map((i, o) => /* @__PURE__ */ p("tr", { className: "data-table__row", onClick: () => u?.(i), children: O?.(i, o) })),
-    c.length === 0 && !a && A ? /* @__PURE__ */ p("tr", { className: "data-table__row", onClick: () => u?.(void 0), children: A }) : null
+  }) : O, [O, n]), d = typeof i == "number" ? i : 10, j = A ? Math.max(1, Math.ceil(f.length / d)) : 1, s = Math.min(b, j - 1);
+  c.useEffect(() => {
+    b !== s && P(s);
+  }, [b, s]);
+  const T = A ? f.slice(s * d, s * d + d) : typeof i == "number" ? f.slice(0, i) : f, M = /* @__PURE__ */ x("table", { ...E("data-table", k), children: [
+    V,
+    /* @__PURE__ */ x("tbody", { children: [
+      T.map((r, o) => /* @__PURE__ */ y("tr", { className: "data-table__row", onClick: () => N?.(r), children: w?.(r, o) })),
+      f.length === 0 && !_ && D ? /* @__PURE__ */ y("tr", { className: "data-table__row", onClick: () => N?.(void 0), children: D }) : null
+    ] })
   ] });
+  return A ? /* @__PURE__ */ y(v.Provider, { value: {
+    page: s,
+    pageCount: j,
+    setPage: P
+  }, children: /* @__PURE__ */ x(F, { style: {
+    flexDirection: "column",
+    gap: "0.5rem"
+  }, children: [
+    M,
+    S.map((r, o) => /* @__PURE__ */ y(c.Fragment, { children: r }, o))
+  ] }) }) : M;
 };
 export {
-  w as DataTable
+  U as DataTable
 };

package/dist/components/data-table/DataTableHeader.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+import { Component } from '../../utils';
+export interface DataTableHeaderProps extends Component<HTMLTableSectionElement> {
+    children?: React.ReactNode | React.ReactNode[];
+}
+/**
+ * Optional header for a <DataTable/>. Place it as a child (alongside the row renderer) and fill it
+ * with <DataTableHeaderColumn/> cells that line up with the columns your row renderer emits.
+ */
+export declare const DataTableHeader: React.FC<DataTableHeaderProps>;
+export interface DataTableHeaderColumnProps extends Component<HTMLTableCellElement> {
+    children?: React.ReactNode | React.ReactNode[];
+}
+export declare const DataTableHeaderColumn: React.FC<DataTableHeaderColumnProps>;

package/dist/components/data-table/DataTableHeader.js

@@ -0,0 +1,39 @@
+import { jsx as n } from "react/jsx-runtime";
+import { c } from "../../_virtual/compiler-runtime.js";
+import "../../utils/contextStore.js";
+import "react";
+import { mergeComponentProps as m } from "../../utils/component.js";
+import "js-md5";
+const p = (a) => {
+  const e = c.c(8);
+  let t, r;
+  if (e[0] !== a) {
+    const {
+      children: i,
+      ...s
+    } = a;
+    t = i, r = m("data-table__header", s), e[0] = a, e[1] = t, e[2] = r;
+  } else
+    t = e[1], r = e[2];
+  let l;
+  e[3] !== t ? (l = /* @__PURE__ */ n("tr", { className: "data-table__header-row", children: t }), e[3] = t, e[4] = l) : l = e[4];
+  let o;
+  return e[5] !== r || e[6] !== l ? (o = /* @__PURE__ */ n("thead", { ...r, children: l }), e[5] = r, e[6] = l, e[7] = o) : o = e[7], o;
+}, x = (a) => {
+  const e = c.c(6);
+  let t, r;
+  if (e[0] !== a) {
+    const {
+      children: o,
+      ...i
+    } = a;
+    t = o, r = m("data-table__header-column", i), e[0] = a, e[1] = t, e[2] = r;
+  } else
+    t = e[1], r = e[2];
+  let l;
+  return e[3] !== t || e[4] !== r ? (l = /* @__PURE__ */ n("th", { ...r, children: t }), e[3] = t, e[4] = r, e[5] = l) : l = e[5], l;
+};
+export {
+  p as DataTableHeader,
+  x as DataTableHeaderColumn
+};

package/dist/components/data-table/DataTablePagination.d.ts

@@ -0,0 +1,30 @@
+import { default as React } from 'react';
+import { Component } from '../../utils';
+export interface DataTablePaginationContextValue {
+    page: number;
+    pageCount: number;
+    setPage: React.Dispatch<React.SetStateAction<number>>;
+}
+export declare const DataTablePaginationContext: React.Context<DataTablePaginationContextValue | null>;
+export declare const useDataTablePagination: () => DataTablePaginationContextValue;
+export interface DataTablePaginationProps extends Component<HTMLDivElement> {
+}
+/**
+ * Layout container for the pagination controls. Place it as a child of a paginated
+ * <DataTable/>, which creates the context these controls read from. Fully styleable –
+ * compose it with <DataTablePaginationValue/>, the triggers and your own <Text/>/<Button/>.
+ */
+export declare const DataTablePagination: React.FC<DataTablePaginationProps>;
+/**
+ * Renders the 1-indexed current page number. Unstyled – wrap it in your own <Text/> to style it.
+ */
+export declare const DataTablePaginationValue: React.FC;
+/**
+ * Renders the total number of pages. Unstyled – wrap it in your own <Text/> to style it.
+ */
+export declare const DataTableMaxPaginationValue: React.FC;
+export interface DataTablePaginationTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    asChild?: boolean;
+}
+export declare const DataTablePaginationForwardTrigger: React.ForwardRefExoticComponent<DataTablePaginationTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+export declare const DataTablePaginationBackwardsTrigger: React.ForwardRefExoticComponent<DataTablePaginationTriggerProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/data-table/DataTablePagination.js

@@ -0,0 +1,75 @@
+import { jsx as r, Fragment as f } from "react/jsx-runtime";
+import { c } from "../../_virtual/compiler-runtime.js";
+import i from "react";
+import "../../utils/contextStore.js";
+import { mergeComponentProps as x } from "../../utils/component.js";
+import "js-md5";
+const h = i.createContext(null), d = () => {
+  const a = i.useContext(h);
+  if (!a)
+    throw new Error("DataTablePagination components must be rendered inside a paginated <DataTable/>");
+  return a;
+}, V = (a) => {
+  const e = c.c(4);
+  let t;
+  e[0] !== a ? (t = x("data-table__pagination", a), e[0] = a, e[1] = t) : t = e[1];
+  let n;
+  return e[2] !== t ? (n = /* @__PURE__ */ r("div", { ...t }), e[2] = t, e[3] = n) : n = e[3], n;
+}, y = () => {
+  const a = c.c(2), {
+    page: e
+  } = d(), t = e + 1;
+  let n;
+  return a[0] !== t ? (n = /* @__PURE__ */ r(f, { children: t }), a[0] = t, a[1] = n) : n = a[1], n;
+}, B = () => {
+  const a = c.c(2), {
+    pageCount: e
+  } = d();
+  let t;
+  return a[0] !== e ? (t = /* @__PURE__ */ r(f, { children: e }), a[0] = e, a[1] = t) : t = a[1], t;
+}, T = i.forwardRef((a, e) => {
+  const {
+    page: t,
+    pageCount: n,
+    setPage: w
+  } = d(), {
+    direction: g,
+    asChild: C,
+    onClick: u,
+    disabled: P,
+    children: l,
+    ...p
+  } = a, D = g === "forward" ? t >= n - 1 : t <= 0, s = P ?? D, m = () => {
+    s || w((o) => g === "forward" ? Math.min(n - 1, o + 1) : Math.max(0, o - 1));
+  };
+  if (C && i.isValidElement(l)) {
+    const o = l;
+    return i.cloneElement(o, {
+      ref: e,
+      disabled: o.props.disabled ?? s,
+      onClick: (b) => {
+        o.props.onClick?.(b), u?.(b), m();
+      }
+    });
+  }
+  return /* @__PURE__ */ r("button", { ...p, ref: e, type: "button", disabled: s, onClick: (o) => {
+    u?.(o), m();
+  }, children: l });
+}), F = i.forwardRef((a, e) => {
+  const t = c.c(3);
+  let n;
+  return t[0] !== a || t[1] !== e ? (n = /* @__PURE__ */ r(T, { ...a, direction: "forward", ref: e }), t[0] = a, t[1] = e, t[2] = n) : n = t[2], n;
+}), j = i.forwardRef((a, e) => {
+  const t = c.c(3);
+  let n;
+  return t[0] !== a || t[1] !== e ? (n = /* @__PURE__ */ r(T, { ...a, direction: "backward", ref: e }), t[0] = a, t[1] = e, t[2] = n) : n = t[2], n;
+});
+export {
+  B as DataTableMaxPaginationValue,
+  V as DataTablePagination,
+  j as DataTablePaginationBackwardsTrigger,
+  h as DataTablePaginationContext,
+  F as DataTablePaginationForwardTrigger,
+  y as DataTablePaginationValue,
+  d as useDataTablePagination
+};

package/dist/components/data-table/index.d.ts

@@ -1,4 +1,6 @@
 export * from './DataTable';
 export * from './DataTableColumn';
+export * from './DataTableHeader';
+export * from './DataTablePagination';
 export * from './DataTableFilterInput';
 export * from './DataTableFilterSuggestionMenu';

package/dist/components/data-table/index.js

@@ -1,11 +1,22 @@
 import { DataTable as t } from "./DataTable.js";
 import { DataTableColumn as o } from "./DataTableColumn.js";
-import { DataTableFilterInput as u, createFilterQueryLanguage as m } from "./DataTableFilterInput.js";
-import { DataTableFilterSuggestionMenu as p } from "./DataTableFilterSuggestionMenu.js";
+import { DataTableHeader as i, DataTableHeaderColumn as l } from "./DataTableHeader.js";
+import { DataTableMaxPaginationValue as T, DataTablePagination as b, DataTablePaginationBackwardsTrigger as D, DataTablePaginationContext as u, DataTablePaginationForwardTrigger as m, DataTablePaginationValue as x, useDataTablePagination as p } from "./DataTablePagination.js";
+import { DataTableFilterInput as f, createFilterQueryLanguage as d } from "./DataTableFilterInput.js";
+import { DataTableFilterSuggestionMenu as s } from "./DataTableFilterSuggestionMenu.js";
 export {
   t as DataTable,
   o as DataTableColumn,
-  u as DataTableFilterInput,
-  p as DataTableFilterSuggestionMenu,
-  m as createFilterQueryLanguage
+  f as DataTableFilterInput,
+  s as DataTableFilterSuggestionMenu,
+  i as DataTableHeader,
+  l as DataTableHeaderColumn,
+  T as DataTableMaxPaginationValue,
+  b as DataTablePagination,
+  D as DataTablePaginationBackwardsTrigger,
+  u as DataTablePaginationContext,
+  m as DataTablePaginationForwardTrigger,
+  x as DataTablePaginationValue,
+  d as createFilterQueryLanguage,
+  p as useDataTablePagination
 };

package/dist/components/form/PinInput.js

@@ -1,69 +1,66 @@
-import { jsx as r, jsxs as F, Fragment as x } from "react/jsx-runtime";
-import { c as I } from "../../_virtual/compiler-runtime.js";
-import { OneTimePasswordFieldInput as C, OneTimePasswordFieldHiddenInput as M, OneTimePasswordField as T } from "@radix-ui/react-one-time-password-field";
+import { jsx as a, jsxs as v, Fragment as F } from "react/jsx-runtime";
+import { c } from "../../_virtual/compiler-runtime.js";
+import { OneTimePasswordFieldInput as x, OneTimePasswordFieldHiddenInput as C, OneTimePasswordField as M } from "@radix-ui/react-one-time-password-field";
 import "../../utils/contextStore.js";
 import "react";
 import { mergeComponentProps as V } from "../../utils/component.js";
 import "js-md5";
-import { InputLabel as _ } from "./InputLabel.js";
-import { InputDescription as $ } from "./InputDescription.js";
-import { InputMessage as w } from "./InputMessage.js";
+import { InputLabel as T } from "./InputLabel.js";
+import { InputDescription as _ } from "./InputDescription.js";
+import { InputMessage as $ } from "./InputMessage.js";
 import '../../assets/components/form/Input.style.css';/* empty css                 */
-const B = (n) => {
-  const e = I.c(26);
-  let t, i, d, l, o, s;
+const z = (n) => {
+  const e = c.c(20);
+  let t, i, s, l, o;
   if (e[0] !== n) {
     const {
-      title: p,
-      description: c,
-      disabled: b,
-      formValidation: P,
-      ...g
-    } = n;
-    i = P === void 0 ? {
+      title: u,
+      description: f,
+      disabled: g,
+      formValidation: h,
+      ...p
+    } = n, P = g === void 0 ? !1 : g;
+    i = h === void 0 ? {
       valid: !0,
       notValidMessage: null,
-      setValue: O
-    } : P, e[7] !== p ? (o = p ? /* @__PURE__ */ r(_, { children: p }) : null, e[7] = p, e[8] = o) : o = e[8], e[9] !== c ? (s = c ? /* @__PURE__ */ r($, { children: c }) : null, e[9] = c, e[10] = s) : s = e[10];
-    const h = `${i?.valid ? "" : "input--not-valid"}`;
-    e[11] !== h ? (l = V(h, {}), e[11] = h, e[12] = l) : l = e[12], t = T, d = V("pin-input", {
-      ...g,
-      onValueChange: (v) => {
-        g.onValueChange && g.onValueChange(v), i.setValue?.(v);
+      setValue: b
+    } : h, e[6] !== u ? (l = u ? /* @__PURE__ */ a(T, { children: u }) : null, e[6] = u, e[7] = l) : l = e[7], e[8] !== f ? (o = f ? /* @__PURE__ */ a(_, { children: f }) : null, e[8] = f, e[9] = o) : o = e[9], t = M, s = V(`pin-input ${i?.valid ? "" : "pin-input--not-valid"}`, {
+      ...p,
+      disabled: P,
+      onValueChange: (I) => {
+        p.onValueChange && p.onValueChange(I), i.setValue?.(I);
       }
-    }), e[0] = n, e[1] = t, e[2] = i, e[3] = d, e[4] = l, e[5] = o, e[6] = s;
+    }), e[0] = n, e[1] = t, e[2] = i, e[3] = s, e[4] = l, e[5] = o;
   } else
-    t = e[1], i = e[2], d = e[3], l = e[4], o = e[5], s = e[6];
-  let a;
-  e[13] !== t || e[14] !== d ? (a = /* @__PURE__ */ r(t, { ...d }), e[13] = t, e[14] = d, e[15] = a) : a = e[15];
+    t = e[1], i = e[2], s = e[3], l = e[4], o = e[5];
+  let r;
+  e[10] !== t || e[11] !== s ? (r = /* @__PURE__ */ a(t, { ...s }), e[10] = t, e[11] = s, e[12] = r) : r = e[12];
+  let d;
+  e[13] !== i ? (d = !i?.valid && i?.notValidMessage ? /* @__PURE__ */ a($, { children: i.notValidMessage }) : null, e[13] = i, e[14] = d) : d = e[14];
   let m;
-  e[16] !== l || e[17] !== a ? (m = /* @__PURE__ */ r("div", { ...l, children: a }), e[16] = l, e[17] = a, e[18] = m) : m = e[18];
-  let u;
-  e[19] !== i ? (u = !i?.valid && i?.notValidMessage ? /* @__PURE__ */ r(w, { children: i.notValidMessage }) : null, e[19] = i, e[20] = u) : u = e[20];
-  let f;
-  return e[21] !== o || e[22] !== s || e[23] !== m || e[24] !== u ? (f = /* @__PURE__ */ F(x, { children: [
+  return e[15] !== l || e[16] !== o || e[17] !== r || e[18] !== d ? (m = /* @__PURE__ */ v(F, { children: [
+    l,
     o,
-    s,
-    m,
-    u
-  ] }), e[21] = o, e[22] = s, e[23] = m, e[24] = u, e[25] = f) : f = e[25], f;
-}, G = (n) => {
-  const e = I.c(4);
+    r,
+    d
+  ] }), e[15] = l, e[16] = o, e[17] = r, e[18] = d, e[19] = m) : m = e[19], m;
+}, A = (n) => {
+  const e = c.c(4);
   let t;
-  e[0] !== n ? (t = V("input pin-input__field", n), e[0] = n, e[1] = t) : t = e[1];
+  e[0] !== n ? (t = V("pin-input__field", n), e[0] = n, e[1] = t) : t = e[1];
   let i;
-  return e[2] !== t ? (i = /* @__PURE__ */ r(C, { ...t }), e[2] = t, e[3] = i) : i = e[3], i;
-}, J = (n) => {
-  const e = I.c(4);
+  return e[2] !== t ? (i = /* @__PURE__ */ a(x, { ...t }), e[2] = t, e[3] = i) : i = e[3], i;
+}, B = (n) => {
+  const e = c.c(4);
   let t;
   e[0] !== n ? (t = V("pin-input__hidden-field", n), e[0] = n, e[1] = t) : t = e[1];
   let i;
-  return e[2] !== t ? (i = /* @__PURE__ */ r(M, { ...t }), e[2] = t, e[3] = i) : i = e[3], i;
+  return e[2] !== t ? (i = /* @__PURE__ */ a(C, { ...t }), e[2] = t, e[3] = i) : i = e[3], i;
 };
-function O(n) {
+function b(n) {
 }
 export {
-  B as PinInput,
-  G as PinInputField,
-  J as PinInputHiddenField
+  z as PinInput,
+  A as PinInputField,
+  B as PinInputHiddenField
 };

package/dist/components/form/useForm.js

@@ -1,24 +1,24 @@
-import O, { useState as w, useRef as b, useCallback as M, useEffect as F } from "react";
-function d(r, e, t) {
-  return (e = R(e)) in r ? Object.defineProperty(r, e, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : r[e] = t, r;
+import y, { useState as P, useRef as v, useCallback as j, useEffect as I } from "react";
+function h(s, e, t) {
+  return (e = _(e)) in s ? Object.defineProperty(s, e, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : s[e] = t, s;
 }
-function R(r) {
-  var e = _(r, "string");
+function _(s) {
+  var e = B(s, "string");
   return typeof e == "symbol" ? e : e + "";
 }
-function _(r, e) {
-  if (typeof r != "object" || !r) return r;
-  var t = r[Symbol.toPrimitive];
+function B(s, e) {
+  if (typeof s != "object" || !s) return s;
+  var t = s[Symbol.toPrimitive];
   if (t !== void 0) {
-    var i = t.call(r, e);
-    if (typeof i != "object") return i;
+    var n = t.call(s, e);
+    if (typeof n != "object") return n;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
-  return (e === "string" ? String : Number)(r);
+  return (e === "string" ? String : Number)(s);
 }
-class p {
-  constructor(e, t, i, l = /* @__PURE__ */ new Map(), s = /* @__PURE__ */ new Map()) {
-    d(this, "changeValue", void 0), d(this, "currentValues", void 0), d(this, "currentValidations", void 0), d(this, "shouldValidate", void 0), d(this, "cachedMessages", void 0), this.changeValue = e, this.currentValues = t, this.currentValidations = i, this.shouldValidate = l, this.cachedMessages = s;
+class w {
+  constructor(e, t, n, V = /* @__PURE__ */ new Map(), l = /* @__PURE__ */ new Map(), r = /* @__PURE__ */ new Map(), a = /* @__PURE__ */ new Map()) {
+    h(this, "changeValue", void 0), h(this, "currentValues", void 0), h(this, "currentValidations", void 0), h(this, "shouldValidate", void 0), h(this, "cachedMessages", void 0), h(this, "cachedSetters", void 0), h(this, "cachedProps", void 0), this.changeValue = e, this.currentValues = t, this.currentValidations = n, this.shouldValidate = V, this.cachedMessages = l, this.cachedSetters = r, this.cachedProps = a;
   }
   isValid() {
     if (!this.currentValidations) return !0;
@@ -30,49 +30,64 @@ class p {
     return !0;
   }
   getInputProps(e) {
-    const t = this.currentValues[e], i = t ?? null, l = e, s = this.currentValidations && this.currentValidations[e] ? this.currentValidations[e] : (u) => null;
-    let a = null;
-    return this.shouldValidate.has(e) ? (a = s(t, this.currentValues), this.cachedMessages.set(e, a)) : a = this.cachedMessages.get(e) ?? null, {
+    const t = this.currentValues[e], n = t ?? null, V = e, l = this.currentValidations && this.currentValidations[e] ? this.currentValidations[e] : (d) => null;
+    let r = null;
+    this.shouldValidate.has(e) ? (r = l(t, this.currentValues), this.cachedMessages.set(e, r)) : r = this.cachedMessages.get(e) ?? null;
+    const a = !!(this.currentValidations && this.currentValidations[e]), u = this.cachedProps.get(e);
+    if (u && Object.is(u.value, n) && u.message === r && u.required === a)
+      return u.props;
+    let c = this.cachedSetters.get(e);
+    if (!c) {
+      const d = this.changeValue;
+      c = (o) => {
+        d(V, o);
+      }, this.cachedSetters.set(e, c);
+    }
+    const p = {
       // @ts-ignore – z.B. wenn dein Input `defaultValue` kennt
-      defaultValue: i ?? void 0,
-      initialValue: i ?? void 0,
+      defaultValue: n ?? void 0,
+      initialValue: n ?? void 0,
       formValidation: {
-        setValue: (u) => {
-          this.changeValue(l, u);
-        },
-        notValidMessage: a,
-        valid: a === null
+        setValue: c,
+        notValidMessage: r,
+        valid: r === null
       },
-      ...this.currentValidations && this.currentValidations[e] ? {
+      ...a ? {
         required: !0
       } : {}
     };
+    return this.cachedProps.set(e, {
+      value: n,
+      message: r,
+      required: a,
+      props: p
+    }), p;
   }
 }
-const I = (r) => {
+const N = (s) => {
   const {
     initialValues: e,
     validate: t = {},
-    truthyValidationBeforeSubmit: i = !0,
-    useInitialValidation: l = !0,
-    onSubmit: s
-  } = r, a = O.useMemo(() => e, [e]), [u, v] = w(a), V = b(/* @__PURE__ */ new Map()), c = b(u);
-  c.current = u;
-  const h = M((n, f) => {
-    c.current = {
-      ...c.current,
-      [n]: f
-    }, v(c.current);
-  }, []), [S, m] = w(() => new p(h, u, t, l ? new Map(Object.keys(a).map((n) => [n, !0])) : /* @__PURE__ */ new Map(), V.current));
-  F(() => {
-    c.current = a, v(a), m(new p(h, a, t, l ? new Map(Object.keys(a).map((n) => [n, !0])) : /* @__PURE__ */ new Map(), V.current));
-  }, [a]);
-  const j = M((n, f = !0) => {
-    const o = c.current, y = n && new Set(Object.keys(o)).has(String(n)) ? /* @__PURE__ */ new Map([[n, !0]]) : new Map(Object.keys(o).map((P) => [String(P), !0])), g = new p(h, o, t, y, V.current);
-    m(g), f && !new Set(Object.keys(o)).has(String(n)) && s && (!i || g.isValid()) && s(o);
-  }, [h, t, s, i]);
-  return [S, j, u];
+    truthyValidationBeforeSubmit: n = !0,
+    useInitialValidation: V = !0,
+    onSubmit: l
+  } = s, r = y.useMemo(() => e, [e]), [a, u] = P(r), c = v(/* @__PURE__ */ new Map()), p = v(/* @__PURE__ */ new Map()), d = v(/* @__PURE__ */ new Map()), o = v(a);
+  o.current = a;
+  const g = j((i, m) => {
+    o.current = {
+      ...o.current,
+      [i]: m
+    }, u(o.current);
+  }, []), [O, M] = P(() => new w(g, a, t, V ? new Map(Object.keys(r).map((i) => [i, !0])) : /* @__PURE__ */ new Map(), c.current, p.current, d.current)), b = v(!1);
+  I(() => {
+    o.current = r, u(r), b.current && d.current.clear(), b.current = !0, M(new w(g, r, t, V ? new Map(Object.keys(r).map((i) => [i, !0])) : /* @__PURE__ */ new Map(), c.current, p.current, d.current));
+  }, [r]);
+  const R = j((i, m = !0) => {
+    const f = o.current, F = i && new Set(Object.keys(f)).has(String(i)) ? /* @__PURE__ */ new Map([[i, !0]]) : new Map(Object.keys(f).map((q) => [String(q), !0])), S = new w(g, f, t, F, c.current, p.current, d.current);
+    M(S), m && !new Set(Object.keys(f)).has(String(i)) && l && (!n || S.isValid()) && l(f);
+  }, [g, t, l, n]);
+  return [O, R, a];
 };
 export {
-  I as useForm
+  N as useForm
 };