@code0-tech/pictor 0.7.1 → 0.7.2

package/dist/assets/components/form/EditorInput.style.css

@@ -1 +1 @@
-.editor-input{width:100%;flex:1 1 auto;overflow:hidden;padding:.59rem 0;position:relative;align-self:stretch}.editor-input .cm-editor{height:100%;outline:none!important}.editor-input .cm-content{padding:0;position:relative}.editor-input .cm-line{align-self:stretch;padding-left:0}
+.editor-input{width:100%;flex:1 1 auto;overflow:hidden;padding:.59rem 0;position:relative;align-self:stretch}.editor-input .cm-editor{height:100%;outline:none!important}.editor-input .cm-content{padding:0;position:relative}.editor-input .cm-line{align-self:stretch;padding-left:0}.editor-input .cm-cursor{border-width:2px;border-radius:50rem;border-color:#fff}

package/dist/assets/components/form/InputWrapper.style.css

@@ -1 +1 @@
-.input-wrapper{display:flex;z-index:1;width:100%;align-items:start;box-sizing:border-box;gap:.175rem}.input-wrapper{background:#201e2c;box-shadow:inset 0 1px 1px #ffffff1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.input-wrapper:hover{background:#bfbfbf26;box-shadow:inset 0 1px 1px #ffffff1a}.input-wrapper:active,.input-wrapper:focus,.input-wrapper[aria-selected=true],.input-wrapper[data-state=open]{background:#bfbfbf33;box-shadow:inset 0 1px 1px #ffffff1a;outline:none}.input-wrapper{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px;border-radius:1rem}.input-wrapper:has(.input-wrapper__control:focus){background:#bfbfbf33;box-shadow:inset 0 1px 1px #ffffff1a;outline:none}.input-wrapper--not-valid{background:#1c0516;box-shadow:inset 0 1px 1px #d904291a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.input-wrapper>:first-child{padding-left:.7rem}.input-wrapper__left,.input-wrapper__right{display:flex;align-items:center;justify-content:center;min-height:30px;gap:.7rem;margin:.175rem}.input-wrapper__left>button,.input-wrapper__right>button{height:100%;padding-left:0;padding-right:0}.input-wrapper__left--action,.input-wrapper__right--action{padding:0}.input-wrapper__left--placeholder,.input-wrapper__right--placeholder{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px;border-radius:.825rem;padding:.7rem;box-shadow:none}.input-wrapper__left--icon,.input-wrapper__right--icon{align-items:center}
+.input-wrapper{display:flex;z-index:1;width:100%;align-items:start;box-sizing:border-box;gap:.175rem}.input-wrapper{background:#201e2c;box-shadow:inset 0 1px 1px #ffffff1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.input-wrapper:hover{background:#bfbfbf26;box-shadow:inset 0 1px 1px #ffffff1a}.input-wrapper:active,.input-wrapper:focus,.input-wrapper[aria-selected=true],.input-wrapper[data-state=open]{background:#bfbfbf33;box-shadow:inset 0 1px 1px #ffffff1a;outline:none}.input-wrapper{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px;border-radius:1rem}.input-wrapper:has(.input-wrapper__control:focus){background:#bfbfbf33;box-shadow:inset 0 1px 1px #ffffff1a;outline:none}.input-wrapper--not-valid{background:#1c0516;box-shadow:inset 0 1px 1px #d904291a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.input-wrapper>:first-child{padding-left:.7rem}.input-wrapper__left,.input-wrapper__right{display:flex;align-items:center;justify-content:center;min-height:30px;gap:.7rem;margin:.175rem}.input-wrapper__left--action,.input-wrapper__right--action{padding:0}.input-wrapper__left--placeholder,.input-wrapper__right--placeholder{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px;border-radius:.825rem;padding:.7rem;box-shadow:none}.input-wrapper__left--icon,.input-wrapper__right--icon{align-items:center}

package/dist/assets/components/form/SelectInput.style.css

@@ -1 +1 @@
-.select-input__content{padding:.35rem;position:relative;box-sizing:border-box;z-index:999}.select-input__content{border-radius:1rem}.select-input__item{border-radius:.65rem;padding:.35rem .7rem;gap:.7rem;cursor:pointer;width:100%;display:flex;align-items:center;font-size:.8rem}.select-input__item{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.select-input__item:focus{outline:none}.select-input__item{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px}.select-input__item:disabled,.select-input__item[data-disabled],.select-input__item[aria-disabled=true],.select-input__item--disabled{cursor:not-allowed;opacity:25%;pointer-events:unset}.select-input__item{box-shadow:none}.select-input__item:focus,.select-input__item[data-focus=true]{background:#191825;box-shadow:inset 0 1px 1px #ffffff1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;box-shadow:none;width:100%}.select-input__trigger{height:-webkit-fill-available;height:stretch;width:100%;position:relative;align-self:stretch;cursor:pointer}.select-input__content--primary{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--secondary{background:#191825;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--tertiary{background:#201e2c;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--success{background:#0a1814;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--warning{background:#201813;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--error{background:#1c0516;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--info{background:#121e24;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}
+.select-input__content{padding:.35rem;position:relative;box-sizing:border-box;z-index:999}.select-input__content{border-radius:1rem}.select-input__item{border-radius:.65rem;padding:.35rem .7rem;gap:.7rem;cursor:pointer;width:100%;display:flex;align-items:center;font-size:.8rem}.select-input__item{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.select-input__item:focus{outline:none}.select-input__item{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px}.select-input__item:disabled,.select-input__item[data-disabled],.select-input__item[aria-disabled=true],.select-input__item--disabled{cursor:not-allowed;opacity:25%;pointer-events:unset}.select-input__item{box-shadow:none}.select-input__item:focus,.select-input__item[data-focus=true]{background:#191825;box-shadow:inset 0 1px 1px #ffffff1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;box-shadow:none;width:100%}.select-input__trigger{width:100%;position:relative;align-self:stretch;cursor:pointer}.select-input__content--primary{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--secondary{background:#191825;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--tertiary{background:#201e2c;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--success{background:#0a1814;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--warning{background:#201813;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--error{background:#1c0516;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}.select-input__content--info{background:#121e24;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:rgb(25.4,23.6,37.1) 2px solid}

package/dist/components/editor/Editor.js

@@ -296,7 +296,7 @@ const De = (i) => me(i) || typeof i == "string" || typeof i == "number" || Array
         if (I(e), t === "json")
           try {
             const d = JSON.parse(e);
-            q?.(d), Z?.setValue(d);
+            q?.(d), Z?.setValue?.(d);
           } catch {
           }
         else

package/dist/components/form/CheckboxInput.js

@@ -26,7 +26,7 @@ const ee = (l) => {
   const i = x, [t, R] = z.useState(l.initialValue ?? "indeterminate");
   let g;
   e[2] !== t || e[3] !== i ? (g = () => {
-    i.setValue(t);
+    i.setValue?.(t);
   }, e[2] = t, e[3] = i, e[4] = g) : g = e[4];
   let v;
   e[5] !== t ? (v = [t], e[5] = t, e[6] = v) : v = e[6], z.useEffect(g, v);

package/dist/components/form/EditorInput.js

@@ -56,7 +56,7 @@ const N = (i) => {
     }, ...r]
   }), [r]);
   return /* @__PURE__ */ a(y, { title: g, description: u, right: s, left: m, rightType: l, leftType: c, formValidation: o, children: /* @__PURE__ */ a(T, { extensions: d, onChange: (n) => {
-    o?.setValue(n), f?.(n);
+    o?.setValue?.(n), f?.(n);
   }, theme: k, ...C("editor-input", b), basicSetup: {
     lineNumbers: !1,
     foldGutter: !1,

package/dist/components/form/PinInput.js

@@ -29,7 +29,7 @@ const B = (n) => {
     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);
+        g.onValueChange && g.onValueChange(v), i.setValue?.(v);
       }
     }), e[0] = n, e[1] = t, e[2] = i, e[3] = d, e[4] = l, e[5] = o, e[6] = s;
   } else

package/dist/components/form/RadioGroup.js

@@ -27,7 +27,7 @@ const y = (s) => {
     } : V, e[7] !== d ? (i = d ? /* @__PURE__ */ f(G, { children: d }) : null, e[7] = d, e[8] = i) : i = e[8], e[9] !== p ? (l = p ? /* @__PURE__ */ f(I, { children: p }) : null, e[9] = p, e[10] = l) : l = e[10], o = M.RadioGroup, r = h ?? s.defaultValue, a = v("radio-group", {
       ...c,
       onValueChange: (g) => {
-        c.onValueChange && c.onValueChange(g), t.setValue(g);
+        c.onValueChange && c.onValueChange(g), t.setValue?.(g);
       }
     }), e[0] = s, e[1] = o, e[2] = t, e[3] = r, e[4] = a, e[5] = i, e[6] = l;
   } else

package/dist/components/form/SelectInput.js

@@ -5,81 +5,81 @@ import "../../utils/contextStore.js";
 import "react";
 import { mergeComponentProps as f } from "../../utils/component.js";
 import "js-md5";
-import { InputWrapper as p } from "./InputWrapper.js";
+import { InputWrapper as R } from "./InputWrapper.js";
 import '../../assets/components/form/SelectInput.style.css';/* empty css                       */
-const A = (n) => {
+const A = (i) => {
   const t = r.c(24);
-  let e, l, i, c, m, u, a, _, g, T;
-  if (t[0] !== n) {
+  let e, l, n, c, m, u, a, _, g, T;
+  if (t[0] !== i) {
     const {
-      title: C,
-      description: I,
-      left: y,
-      leftType: w,
-      rightType: P,
-      right: R,
+      title: I,
+      description: y,
+      left: C,
+      leftType: p,
+      rightType: w,
+      right: P,
       formValidation: h,
       ...x
-    } = n;
-    l = p, c = C, m = I, u = y, a = w, _ = R, g = P, T = h, e = s.Root, i = f("select-input", {
+    } = i;
+    l = R, c = I, m = y, u = C, a = p, _ = P, g = w, T = h, e = s.Root, n = f("select-input", {
       ...x,
       onValueChange: (d) => {
-        h?.setValue(d), x.onValueChange?.(d), n.onChange?.({});
+        h?.setValue?.(d), x.onValueChange?.(d);
       }
-    }), t[0] = n, t[1] = e, t[2] = l, t[3] = i, t[4] = c, t[5] = m, t[6] = u, t[7] = a, t[8] = _, t[9] = g, t[10] = T;
+    }), t[0] = i, t[1] = e, t[2] = l, t[3] = n, t[4] = c, t[5] = m, t[6] = u, t[7] = a, t[8] = _, t[9] = g, t[10] = T;
   } else
-    e = t[1], l = t[2], i = t[3], c = t[4], m = t[5], u = t[6], a = t[7], _ = t[8], g = t[9], T = t[10];
-  const $ = i;
+    e = t[1], l = t[2], n = t[3], c = t[4], m = t[5], u = t[6], a = t[7], _ = t[8], g = t[9], T = t[10];
+  const $ = n;
   let S;
   t[11] !== e || t[12] !== $ ? (S = /* @__PURE__ */ o(e, { ...$ }), t[11] = e, t[12] = $, t[13] = S) : S = t[13];
   let V;
   return t[14] !== l || t[15] !== c || t[16] !== m || t[17] !== u || t[18] !== a || t[19] !== _ || t[20] !== g || t[21] !== T || t[22] !== S ? (V = /* @__PURE__ */ o(l, { title: c, description: m, left: u, leftType: a, right: _, rightType: g, formValidation: T, children: S }), t[14] = l, t[15] = c, t[16] = m, t[17] = u, t[18] = a, t[19] = _, t[20] = g, t[21] = T, t[22] = S, t[23] = V) : V = t[23], V;
-}, B = (n) => {
+}, B = (i) => {
   const t = r.c(4);
   let e;
-  t[0] !== n ? (e = f("select-input__trigger", n), t[0] = n, t[1] = e) : e = t[1];
+  t[0] !== i ? (e = f("select-input__trigger", i), t[0] = i, t[1] = e) : e = t[1];
   let l;
   return t[2] !== e ? (l = /* @__PURE__ */ o(s.Trigger, { ...e }), t[2] = e, t[3] = l) : l = t[3], l;
-}, D = (n) => {
+}, D = (i) => {
   const t = r.c(4);
   let e;
-  t[0] !== n ? (e = f("select-input__value", n), t[0] = n, t[1] = e) : e = t[1];
+  t[0] !== i ? (e = f("select-input__value", i), t[0] = i, t[1] = e) : e = t[1];
   let l;
   return t[2] !== e ? (l = /* @__PURE__ */ o(s.Value, { ...e }), t[2] = e, t[3] = l) : l = t[3], l;
-}, F = (n) => {
-  const t = r.c(5), e = `select-input__content select-input__content--${n.color ?? "primary"}`;
+}, F = (i) => {
+  const t = r.c(5), e = `select-input__content select-input__content--${i.color ?? "primary"}`;
   let l;
-  t[0] !== n || t[1] !== e ? (l = f(e, n), t[0] = n, t[1] = e, t[2] = l) : l = t[2];
-  const i = l;
+  t[0] !== i || t[1] !== e ? (l = f(e, i), t[0] = i, t[1] = e, t[2] = l) : l = t[2];
+  const n = l;
   let c;
-  return t[3] !== i ? (c = /* @__PURE__ */ o(s.Content, { ...i }), t[3] = i, t[4] = c) : c = t[4], c;
-}, G = (n) => {
+  return t[3] !== n ? (c = /* @__PURE__ */ o(s.Content, { ...n }), t[3] = n, t[4] = c) : c = t[4], c;
+}, G = (i) => {
   const t = r.c(4);
   let e;
-  t[0] !== n ? (e = f("select-input__portal", n), t[0] = n, t[1] = e) : e = t[1];
+  t[0] !== i ? (e = f("select-input__portal", i), t[0] = i, t[1] = e) : e = t[1];
   const l = e;
-  let i;
-  return t[2] !== l ? (i = /* @__PURE__ */ o(s.Portal, { ...l }), t[2] = l, t[3] = i) : i = t[3], i;
-}, H = (n) => {
+  let n;
+  return t[2] !== l ? (n = /* @__PURE__ */ o(s.Portal, { ...l }), t[2] = l, t[3] = n) : n = t[3], n;
+}, H = (i) => {
   const t = r.c(4);
   let e;
-  t[0] !== n ? (e = f("select-input__viewport", n), t[0] = n, t[1] = e) : e = t[1];
+  t[0] !== i ? (e = f("select-input__viewport", i), t[0] = i, t[1] = e) : e = t[1];
   let l;
   return t[2] !== e ? (l = /* @__PURE__ */ o(s.Viewport, { ...e }), t[2] = e, t[3] = l) : l = t[3], l;
-}, J = (n) => {
+}, J = (i) => {
   const t = r.c(4);
   let e;
-  t[0] !== n ? (e = f("select-input__item", n), t[0] = n, t[1] = e) : e = t[1];
+  t[0] !== i ? (e = f("select-input__item", i), t[0] = i, t[1] = e) : e = t[1];
   const l = e;
-  let i;
-  return t[2] !== l ? (i = /* @__PURE__ */ o(s.Item, { ...l }), t[2] = l, t[3] = i) : i = t[3], i;
-}, K = (n) => {
+  let n;
+  return t[2] !== l ? (n = /* @__PURE__ */ o(s.Item, { ...l }), t[2] = l, t[3] = n) : n = t[3], n;
+}, K = (i) => {
   const t = r.c(4);
   let e;
-  t[0] !== n ? (e = f("select-input__item-text", n), t[0] = n, t[1] = e) : e = t[1];
+  t[0] !== i ? (e = f("select-input__item-text", i), t[0] = i, t[1] = e) : e = t[1];
   const l = e;
-  let i;
-  return t[2] !== l ? (i = /* @__PURE__ */ o(s.ItemText, { ...l }), t[2] = l, t[3] = i) : i = t[3], i;
+  let n;
+  return t[2] !== l ? (n = /* @__PURE__ */ o(s.ItemText, { ...l }), t[2] = l, t[3] = n) : n = t[3], n;
 };
 export {
   F as SelectContent,

package/dist/components/form/useForm.d.ts

@@ -14,7 +14,7 @@ export interface ValidationProps<Value> {
     value?: Value | undefined;
     required?: boolean;
     formValidation?: {
-        setValue: (value: any) => void;
+        setValue?: (value: any) => void;
         valid?: boolean;
         notValidMessage?: string | null;
     };
@@ -22,7 +22,7 @@ export interface ValidationProps<Value> {
 export type ValidationsProps<Values> = Partial<{
     [Key in keyof Values]: ValidationProps<Values[Key]>;
 }>;
-export type FormValidationReturn<Values> = [IValidation<Values>, <Key extends keyof Values>(key?: Key | any) => void];
+export type FormValidationReturn<Values> = [IValidation<Values>, <Key extends keyof Values>(key?: Key | any, submit?: boolean) => void, Values];
 export interface IValidation<Values> {
     getInputProps<Key extends keyof Values>(key: Key): ValidationProps<Values[Key]>;
     isValid(): boolean;

package/dist/components/form/useForm.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@code0-tech/pictor",
-  "version": "0.7.1",
+  "version": "0.7.2",
   "type": "module",
   "description": "A simple template for a custom React component library",
   "scripts": {