lkt-item-crud 2.0.23 → 2.0.24

package/dist/build.d.ts

@@ -1,7 +1,7 @@
-declare function Et(A?: boolean): void;
-declare namespace Ot {
+declare function Ot(A?: boolean): void;
+declare namespace Lt {
     function install(A: any, ce?: {}): void;
 }
+declare function $t(A: any): void;
 declare function Nt(A: any): void;
-declare function Lt(A: any): void;
-export { Et as debugLktItemCrud, Ot as default, Nt as setItemCrudDefaultDropIcon, Lt as setItemCrudDefaultSaveIcon };
+export { Ot as debugLktItemCrud, Lt as default, $t as setItemCrudDefaultDropIcon, Nt as setItemCrudDefaultSaveIcon };

package/dist/build.js

@@ -1,32 +1,32 @@
-import { defineComponent as Xe, ref as d, watch as p, useSlots as Ke, computed as g, resolveComponent as ye, createElementBlock as W, createCommentVNode as v, openBlock as c, createBlock as R, Fragment as je, renderSlot as S, withDirectives as X, mergeProps as U, normalizeProps as Ve, unref as i, createVNode as J, vShow as K, withCtx as q, mergeDefaults as Qe, nextTick as Ye, onMounted as Ze, resolveDynamicComponent as _e, createSlots as pe, createElementVNode as xe, toDisplayString as et, renderList as tt } from "vue";
-import { httpCall as ot } from "lkt-http-client";
-import { DataState as Te } from "lkt-data-state";
-import { ModificationView as k, ItemCrudMode as T, ItemCrudButtonNavVisibility as Fe, ButtonType as Ie, TablePermission as Re, ensureButtonConfig as Q, LktSettings as s, getFormDataState as at, ItemCrudView as Pe, getFormSlotKeys as nt, ItemCrudButtonNavPosition as Ae, NotificationType as _, getDefaultValues as ut, ItemCrud as it, ToastPositionX as le } from "lkt-vue-kernel";
-import { closeModal as lt, updateModalKey as dt } from "lkt-modal";
-import { __ as rt } from "lkt-i18n";
-import { openToast as de } from "lkt-toast";
-import { useRouter as st } from "vue-router";
+import { defineComponent as We, ref as d, watch as p, useSlots as He, computed as g, resolveComponent as ye, createElementBlock as H, createCommentVNode as v, openBlock as c, createBlock as R, Fragment as Fe, renderSlot as w, withDirectives as K, mergeProps as S, normalizeProps as Te, unref as i, createVNode as Y, vShow as W, withCtx as q, mergeDefaults as Ze, nextTick as Pe, onMounted as _e, resolveDynamicComponent as xe, createSlots as pe, createElementVNode as et, toDisplayString as tt, renderList as ot } from "vue";
+import { httpCall as at } from "lkt-http-client";
+import { DataState as Re } from "lkt-data-state";
+import { ModificationView as k, ItemCrudMode as V, ItemCrudButtonNavVisibility as Xe, ButtonType as Ae, TablePermission as Ee, ensureButtonConfig as Z, LktSettings as s, getFormDataState as nt, ItemCrudView as Ke, getFormSlotKeys as ut, ItemCrudButtonNavPosition as Oe, NotificationType as te, getDefaultValues as it, ItemCrud as lt, ToastPositionX as de } from "lkt-vue-kernel";
+import { closeModal as dt, updateModalKey as rt } from "lkt-modal";
+import { __ as st } from "lkt-i18n";
+import { openToast as re } from "lkt-toast";
+import { useRouter as pt } from "vue-router";
 const ve = class ve {
 };
 ve.debugEnabled = !1, ve.defaultSaveIcon = "", ve.defaultDropIcon = "";
-let re = ve;
+let se = ve;
 const D = (...A) => {
-  re.debugEnabled && console.info("[LktItemCrud] ", ...A);
-}, Et = (A = !0) => {
-  re.debugEnabled = A;
-}, pt = {
-  key: 0,
-  class: "lkt-item-crud-buttons"
+  se.debugEnabled && console.info("[LktItemCrud] ", ...A);
+}, Ot = (A = !0) => {
+  se.debugEnabled = A;
 }, vt = {
   key: 0,
   class: "lkt-item-crud-buttons"
 }, ct = {
-  key: 1,
+  key: 0,
   class: "lkt-item-crud-buttons"
 }, ft = {
+  key: 1,
+  class: "lkt-item-crud-buttons"
+}, mt = {
   key: 2,
   class: "lkt-item-crud-buttons"
-}, Ee = /* @__PURE__ */ Xe({
+}, Le = /* @__PURE__ */ We({
   __name: "ButtonNav",
   props: {
     item: { default: () => ({}) },
@@ -67,7 +67,7 @@ const D = (...A) => {
   setup(A, { expose: ce, emit: ke }) {
     const o = ke, n = A, C = d(n.pickedModificationView);
     p(() => n.pickedModificationView, (t) => C.value = t), p(C, (t) => o("update:pickedModificationView", t));
-    const f = Ke(), r = d(null), l = d(null), m = d(n.loading);
+    const f = He(), r = d(null), l = d(null), m = d(n.loading);
     p(() => n.loading, (t) => m.value = t), p(m, (t) => o("update:loading", t));
     const E = d(n.editing);
     p(() => n.editing, (t) => E.value = t), p(E, (t) => o("update:editing", t));
@@ -75,12 +75,12 @@ const D = (...A) => {
       m.value = !0;
     }, B = () => {
       m.value = !1;
-    }, Y = (t, w) => {
-      typeof t > "u" || o("create", t, w);
-    }, x = (t, w) => {
-      typeof t > "u" || o("save", t, w);
-    }, L = (t, w) => {
-      typeof t > "u" || o("drop", t, w);
+    }, _ = (t, T) => {
+      typeof t > "u" || o("create", t, T);
+    }, z = (t, T) => {
+      typeof t > "u" || o("save", t, T);
+    }, L = (t, T) => {
+      typeof t > "u" || o("drop", t, T);
     }, $ = g(() => n.editableView === k.Modifications ? n.modifications : n.item);
     ce({
       doSave: () => {
@@ -90,14 +90,14 @@ const D = (...A) => {
         l.value && typeof l.value.click == "function" && l.value.click();
       }
     });
-    const G = g(() => !n.canDrop || n.dropButton === !1 ? !1 : !n.canUpdate && n.canDrop ? !0 : !m.value && n.editing && n.httpSuccessRead), h = g(() => n.mode === T.Create && n.createButton === !1 || n.mode === T.Update && n.updateButton === !1 || m.value ? !1 : n.editing && n.httpSuccessRead), Z = g(() => n.editModeButton === !1 || !n.canSwitchEditMode || !n.canUpdate && !n.canDrop || !n.canUpdate && n.canDrop ? !1 : !m.value && n.mode !== T.Create && n.httpSuccessRead), H = g(() => n.buttonNavVisibility === Fe.Always || f["prev-buttons-ever"] ? !0 : n.buttonNavVisibility === Fe.Never ? !1 : h.value || G.value || Z.value), j = g(() => n.modificationView === !1 ? [] : n.modificationView === !0 ? [
+    const j = g(() => !n.canDrop || n.dropButton === !1 ? !1 : !n.canUpdate && n.canDrop ? !0 : !m.value && n.editing && n.httpSuccessRead), h = g(() => n.mode === V.Create && n.createButton === !1 || n.mode === V.Update && n.updateButton === !1 || m.value ? !1 : n.editing && n.httpSuccessRead), x = g(() => n.editModeButton === !1 || !n.canSwitchEditMode || !n.canUpdate && !n.canDrop || !n.canUpdate && n.canDrop ? !1 : !m.value && n.mode !== V.Create && n.httpSuccessRead), G = g(() => n.buttonNavVisibility === Xe.Always || f["prev-buttons-ever"] ? !0 : n.buttonNavVisibility === Xe.Never ? !1 : h.value || j.value || x.value), F = g(() => n.modificationView === !1 ? [] : n.modificationView === !0 ? [
       k.Current,
       k.Modifications,
       k.SplitView,
       k.Differences
     ] : Array.isArray(n.modificationView) ? n.modificationView : []), ue = g(() => {
       let t = [];
-      return j.value.includes(k.Current) && t.push({
+      return F.value.includes(k.Current) && t.push({
         text: "Current",
         icon: "lkt-icn-see",
         disabled: C.value === k.Current,
@@ -106,7 +106,7 @@ const D = (...A) => {
             C.value = k.Current;
           }
         }
-      }), j.value.includes(k.Modifications) && t.push({
+      }), F.value.includes(k.Modifications) && t.push({
         text: "Modifications",
         icon: "lkt-icn-edit",
         disabled: C.value === k.Modifications,
@@ -115,7 +115,7 @@ const D = (...A) => {
             C.value = k.Modifications;
           }
         }
-      }), j.value.includes(k.SplitView) && t.push({
+      }), F.value.includes(k.SplitView) && t.push({
         text: "Split View",
         icon: "lkt-icn-columns",
         disabled: C.value === k.SplitView,
@@ -124,7 +124,7 @@ const D = (...A) => {
             C.value = k.SplitView;
           }
         }
-      }), j.value.includes(k.Differences) && t.push({
+      }), F.value.includes(k.Differences) && t.push({
         text: "Differences",
         icon: "lkt-icn-balance",
         disabled: C.value === k.Differences,
@@ -135,18 +135,18 @@ const D = (...A) => {
         }
       }), t;
     });
-    return (t, w) => {
-      var ie, N, F, P;
+    return (t, T) => {
+      var Q, ie, N, P;
       const y = ye("lkt-button");
-      return H.value ? (c(), W("div", pt, [
-        t.grouped && t.groupButtonAsModalActions ? (c(), W(je, { key: 0 }, [
-          Z.value ? (c(), R(y, U({ key: 0 }, t.editModeButton, {
+      return G.value ? (c(), H("div", vt, [
+        t.grouped && t.groupButtonAsModalActions ? (c(), H(Fe, { key: 0 }, [
+          x.value ? (c(), R(y, S({ key: 0 }, t.editModeButton, {
             checked: E.value,
-            "onUpdate:checked": w[0] || (w[0] = (M) => E.value = M),
+            "onUpdate:checked": T[0] || (T[0] = (U) => E.value = U),
             class: "lkt-item-crud--switch-mode-button"
           }), null, 16, ["checked"])) : v("", !0),
-          j.value.length > 0 ? (c(), R(y, Ve(U({ key: 1 }, {
-            type: i(Ie).Tooltip,
+          F.value.length > 0 ? (c(), R(y, Te(S({ key: 1 }, {
+            type: i(Ae).Tooltip,
             icon: "lkt-icn-cross-arrows",
             class: "lkt-item-crud--modifications-button",
             splitButtons: ue.value,
@@ -154,53 +154,53 @@ const D = (...A) => {
               contentClass: "lkt-flex-column"
             }
           })), null, 16)) : v("", !0),
-          i(f)["prev-buttons-ever"] ? S(t.$slots, "prev-buttons-ever", {
+          i(f)["prev-buttons-ever"] ? w(t.$slots, "prev-buttons-ever", {
             key: 2,
             canUpdate: t.canUpdate,
             canDrop: t.canDrop,
             perms: t.perms
           }) : v("", !0),
-          i(f)["prev-buttons"] ? S(t.$slots, "prev-buttons", {
+          i(f)["prev-buttons"] ? w(t.$slots, "prev-buttons", {
             key: 3,
             canUpdate: t.canUpdate,
             canDrop: t.canDrop,
             perms: t.perms
           }) : v("", !0),
-          X(J(y, U({
+          K(Y(y, S({
             ref_key: "saveButtonRef",
             ref: r
           }, {
             ...t.updateButton,
             resourceData: {
-              ...(ie = t.updateButton) == null ? void 0 : ie.resourceData,
+              ...(Q = t.updateButton) == null ? void 0 : Q.resourceData,
               ...$.value
             },
             disabled: !t.ableToUpdate
           }, {
             onLoading: b,
             onLoaded: B,
-            onClick: x
+            onClick: z
           }), null, 16), [
-            [K, t.mode === i(T).Update && h.value]
+            [W, t.mode === i(V).Update && h.value]
           ]),
-          X(J(y, U({
+          K(Y(y, S({
             ref_key: "saveButtonRef",
             ref: r
           }, {
             ...t.createButton,
             resourceData: {
-              ...(N = t.createButton) == null ? void 0 : N.resourceData,
+              ...(ie = t.createButton) == null ? void 0 : ie.resourceData,
               ...$.value
             },
             disabled: !t.ableToCreate
           }, {
             onLoading: b,
             onLoaded: B,
-            onClick: Y
+            onClick: _
           }), null, 16), [
-            [K, t.mode === i(T).Create && h.value]
+            [W, t.mode === i(V).Create && h.value]
           ]),
-          X(J(y, U({
+          K(Y(y, S({
             ref_key: "dropButtonRef",
             ref: l
           }, t.dropButton, {
@@ -209,23 +209,23 @@ const D = (...A) => {
             onLoaded: B,
             onClick: L
           }), null, 16, ["disabled"]), [
-            [K, G.value && t.mode !== i(T).Create]
+            [W, j.value && t.mode !== i(V).Create]
           ]),
-          i(f).buttons ? S(t.$slots, "buttons", { key: 4 }) : v("", !0)
-        ], 64)) : t.grouped ? (c(), R(y, U({
+          i(f).buttons ? w(t.$slots, "buttons", { key: 4 }) : v("", !0)
+        ], 64)) : t.grouped ? (c(), R(y, S({
           key: 1,
           ref: "groupButton"
         }, t.groupButton, { class: "lkt-item-crud-group-button" }), {
           split: q(() => {
-            var M, ee;
+            var U, X;
             return [
-              Z.value ? (c(), R(y, U({ key: 0 }, t.editModeButton, {
+              x.value ? (c(), R(y, S({ key: 0 }, t.editModeButton, {
                 checked: E.value,
-                "onUpdate:checked": w[1] || (w[1] = (se) => E.value = se),
+                "onUpdate:checked": T[1] || (T[1] = (le) => E.value = le),
                 class: "lkt-item-crud--switch-mode-button"
               }), null, 16, ["checked"])) : v("", !0),
-              j.value.length > 0 ? (c(), R(y, Ve(U({ key: 1 }, {
-                type: i(Ie).Tooltip,
+              F.value.length > 0 ? (c(), R(y, Te(S({ key: 1 }, {
+                type: i(Ae).Tooltip,
                 icon: "lkt-icn-cross-arrows",
                 class: "lkt-item-crud--modifications-button",
                 splitButtons: ue.value,
@@ -233,42 +233,42 @@ const D = (...A) => {
                   contentClass: "lkt-flex-column"
                 }
               })), null, 16)) : v("", !0),
-              i(f)["prev-buttons-ever"] ? S(t.$slots, "prev-buttons-ever", {
+              i(f)["prev-buttons-ever"] ? w(t.$slots, "prev-buttons-ever", {
                 key: 2,
                 canUpdate: t.canUpdate,
                 canDrop: t.canDrop,
                 perms: t.perms
               }) : v("", !0),
-              i(f)["prev-buttons"] ? S(t.$slots, "prev-buttons", {
+              i(f)["prev-buttons"] ? w(t.$slots, "prev-buttons", {
                 key: 3,
                 canUpdate: t.canUpdate,
                 canDrop: t.canDrop,
                 perms: t.perms
               }) : v("", !0),
-              X(J(y, U({
+              K(Y(y, S({
                 ref_key: "saveButtonRef",
                 ref: r
               }, {
                 ...t.updateButton,
                 resourceData: {
-                  ...(M = t.updateButton) == null ? void 0 : M.resourceData,
+                  ...(U = t.updateButton) == null ? void 0 : U.resourceData,
                   ...$.value
                 },
                 disabled: !t.ableToUpdate
               }, {
                 onLoading: b,
                 onLoaded: B,
-                onClick: x
+                onClick: z
               }), null, 16), [
-                [K, t.mode === i(T).Update && h.value]
+                [W, t.mode === i(V).Update && h.value]
               ]),
-              X(J(y, U({
+              K(Y(y, S({
                 ref_key: "saveButtonRef",
                 ref: r
               }, {
                 ...t.createButton,
                 resourceData: {
-                  ...(ee = t.createButton) == null ? void 0 : ee.resourceData,
+                  ...(X = t.createButton) == null ? void 0 : X.resourceData,
                   ...$.value
                 },
                 disabled: !t.ableToCreate
@@ -276,11 +276,11 @@ const D = (...A) => {
                 disabled: !t.ableToCreate,
                 onLoading: b,
                 onLoaded: B,
-                onClick: Y
+                onClick: _
               }), null, 16, ["disabled"]), [
-                [K, t.mode === i(T).Create && h.value]
+                [W, t.mode === i(V).Create && h.value]
               ]),
-              X(J(y, U({
+              K(Y(y, S({
                 ref_key: "dropButtonRef",
                 ref: l
               }, t.dropButton, {
@@ -289,49 +289,49 @@ const D = (...A) => {
                 onLoaded: B,
                 onClick: L
               }), null, 16, ["disabled"]), [
-                [K, G.value && t.mode !== i(T).Create]
+                [W, j.value && t.mode !== i(V).Create]
               ]),
-              i(f).buttons ? S(t.$slots, "buttons", { key: 4 }) : v("", !0)
+              i(f).buttons ? w(t.$slots, "buttons", { key: 4 }) : v("", !0)
             ];
           }),
           _: 3
-        }, 16)) : (c(), W(je, { key: 2 }, [
-          i(f)["prev-buttons-ever"] ? X((c(), W("div", vt, [
-            S(t.$slots, "prev-buttons-ever", {
+        }, 16)) : (c(), H(Fe, { key: 2 }, [
+          i(f)["prev-buttons-ever"] ? K((c(), H("div", ct, [
+            w(t.$slots, "prev-buttons-ever", {
               canUpdate: t.canUpdate,
               canDrop: t.canDrop,
               perms: t.perms
             })
           ], 512)), [
-            [K, !m.value]
+            [W, !m.value]
           ]) : v("", !0),
-          i(f)["prev-buttons"] ? X((c(), W("div", ct, [
-            S(t.$slots, "prev-buttons", {
+          i(f)["prev-buttons"] ? K((c(), H("div", ft, [
+            w(t.$slots, "prev-buttons", {
               canUpdate: t.canUpdate,
               canDrop: t.canDrop,
               perms: t.perms
             })
           ], 512)), [
-            [K, E.value && !m.value]
+            [W, E.value && !m.value]
           ]) : v("", !0),
-          X(J(y, U({
+          K(Y(y, S({
             ref_key: "saveButtonRef",
             ref: r
           }, {
             ...t.updateButton,
             resourceData: {
-              ...(F = t.updateButton) == null ? void 0 : F.resourceData,
+              ...(N = t.updateButton) == null ? void 0 : N.resourceData,
               ...$.value
             },
             disabled: !t.ableToUpdate
           }, {
             onLoading: b,
             onLoaded: B,
-            onClick: x
+            onClick: z
           }), null, 16), [
-            [K, t.mode === i(T).Update && h.value]
+            [W, t.mode === i(V).Update && h.value]
           ]),
-          X(J(y, U({
+          K(Y(y, S({
             ref_key: "saveButtonRef",
             ref: r
           }, {
@@ -344,11 +344,11 @@ const D = (...A) => {
           }, {
             onLoading: b,
             onLoaded: B,
-            onClick: Y
+            onClick: _
           }), null, 16), [
-            [K, t.mode === i(T).Create && h.value]
+            [W, t.mode === i(V).Create && h.value]
           ]),
-          X(J(y, U({
+          K(Y(y, S({
             ref_key: "dropButtonRef",
             ref: l
           }, t.dropButton, {
@@ -357,15 +357,15 @@ const D = (...A) => {
             onLoaded: B,
             onClick: L
           }), null, 16, ["disabled"]), [
-            [K, G.value && t.mode !== i(T).Create]
+            [W, j.value && t.mode !== i(V).Create]
           ]),
-          i(f).buttons ? X((c(), W("div", ft, [
-            S(t.$slots, "buttons")
+          i(f).buttons ? K((c(), H("div", mt, [
+            w(t.$slots, "buttons")
           ], 512)), [
-            [K, E.value && !m.value]
+            [W, E.value && !m.value]
           ]) : v("", !0),
-          j.value.length > 0 ? (c(), R(y, Ve(U({ key: 3 }, {
-            type: i(Ie).Tooltip,
+          F.value.length > 0 ? (c(), R(y, Te(S({ key: 3 }, {
+            type: i(Ae).Tooltip,
             icon: "lkt-icn-cross-arrows",
             class: "lkt-item-crud--modifications-button",
             splitButtons: ue.value,
@@ -373,36 +373,36 @@ const D = (...A) => {
               contentClass: "lkt-flex-column"
             }
           })), null, 16)) : v("", !0),
-          Z.value ? (c(), R(y, U({ key: 4 }, t.editModeButton, {
+          x.value ? (c(), R(y, S({ key: 4 }, t.editModeButton, {
             checked: E.value,
-            "onUpdate:checked": w[2] || (w[2] = (M) => E.value = M),
+            "onUpdate:checked": T[2] || (T[2] = (U) => E.value = U),
             class: "lkt-item-crud--switch-mode-button"
           }), null, 16, ["checked"])) : v("", !0)
         ], 64))
       ])) : v("", !0);
     };
   }
-}), mt = { class: "lkt-item-crud" }, bt = {
+}), bt = { class: "lkt-item-crud" }, gt = {
   key: 0,
   class: "lkt-item-crud_header"
-}, gt = {
+}, yt = {
   key: 0,
   class: "lkt-item-crud_header-slot"
-}, yt = {
+}, kt = {
   key: 1,
   class: "lkt-item-crud_header-title"
-}, kt = {
+}, Bt = {
   key: 2,
   class: "lkt-item-crud_header-slot"
-}, Bt = {
+}, Ct = {
   key: 2,
   class: "lkt-item-crud_content"
-}, Ct = {
+}, Dt = {
   key: 0,
   class: "lkt-grid-1"
-}, Dt = /* @__PURE__ */ Xe({
+}, ht = /* @__PURE__ */ We({
   __name: "LktItemCrud",
-  props: /* @__PURE__ */ Qe({
+  props: /* @__PURE__ */ Ze({
     modelValue: {},
     modifications: {},
     editing: { type: Boolean },
@@ -435,7 +435,7 @@ const D = (...A) => {
     redirectOnDrop: { type: [String, Function] },
     differencesTableConfig: { type: [Object, Function] },
     events: {}
-  }, ut(it)),
+  }, it(lt)),
   emits: [
     "update:modelValue",
     "update:editing",
@@ -453,13 +453,13 @@ const D = (...A) => {
     "modified-data"
   ],
   setup(A, { expose: ce, emit: ke }) {
-    const o = A, n = st(), C = Ke(), f = ke, r = d(!0), l = d(o.modelValue), m = d(o.modifications), E = d(o.customData), b = d(o.perms), B = d(o.editing), Y = d(!1), x = d(!1), L = d(!1), $ = d(!1), z = d(200), I = d(new Te(l.value, o.dataStateConfig)), G = d(new Te(m.value, o.dataStateConfig)), h = d(!1), Z = d(new Te(o.readData)), H = d(o.mode === T.Create), j = d(!1), ue = d(!1), t = d(null), w = g(() => !H.value && Array.isArray(b.value) && b.value.includes(Re.Update)), y = g(() => !H.value && Array.isArray(b.value) && b.value.includes(Re.Drop)), ie = g(() => !H.value && Array.isArray(b.value) && b.value.includes(Re.SwitchEditMode)), N = d(o.visibleView);
+    const o = A, n = pt(), C = He(), f = ke, r = d(!0), l = d(o.modelValue), m = d(o.modifications), E = d(o.customData), b = d(o.perms), B = d(o.editing), _ = d(!1), z = d(!1), L = d(!1), $ = d(!1), J = d(200), I = d(new Re(l.value, o.dataStateConfig)), j = d(new Re(m.value, o.dataStateConfig)), h = d(!1), x = d(new Re(o.readData)), G = d(o.mode === V.Create), F = d(!1), ue = d(!1), t = d(null), T = d(null), y = g(() => !G.value && Array.isArray(b.value) && b.value.includes(Ee.Update)), Q = g(() => !G.value && Array.isArray(b.value) && b.value.includes(Ee.Drop)), ie = g(() => !G.value && Array.isArray(b.value) && b.value.includes(Ee.SwitchEditMode)), N = d(o.visibleView);
     p(() => o.visibleView, (e) => {
       N.value = e;
     }), p(N, (e) => {
       f("update:modificationView", e);
     }), p(() => o.mode, (e) => {
-      H.value = e === T.Create;
+      G.value = e === V.Create;
     }), p(() => o.perms, (e) => {
       b.value = e;
     }), p(b, (e) => {
@@ -469,41 +469,43 @@ const D = (...A) => {
     }), p(E, (e) => {
       f("update:customData", e);
     }), p(() => o.modifications, (e) => {
-      G.value.increment(e), m.value = e;
+      j.value.increment(e), m.value = e;
     }, { deep: !0 }), p(m, (e) => {
-      Le(), G.value.increment(e), oe.value === k.Modifications && (h.value = G.value.changed()), f("update:modifications", e);
+      Ce(), j.value.increment(e), oe.value === k.Modifications && (h.value = j.value.changed()), f("update:modifications", e);
     }, { deep: !0 });
-    const F = d(Q(o.createButton, s.defaultCreateButton)), P = d(Q(o.updateButton, s.defaultUpdateButton)), M = d(Q(o.dropButton, s.defaultDropButton)), ee = d(Q(o.editModeButton, s.defaultEditModeButton)), se = d(Q(o.groupButton, s.defaultGroupButton));
+    const P = d(Z(o.createButton, s.defaultCreateButton)), U = d(Z(o.updateButton, s.defaultUpdateButton)), X = d(Z(o.dropButton, s.defaultDropButton)), le = d(Z(o.editModeButton, s.defaultEditModeButton)), Be = d(Z(o.groupButton, s.defaultGroupButton));
     p(() => o.createButton, (e) => {
-      F.value = Q(e, s.defaultCreateButton);
+      P.value = Z(e, s.defaultCreateButton);
     }, { deep: !0 }), p(() => o.updateButton, (e) => {
-      P.value = Q(e, s.defaultUpdateButton);
+      U.value = Z(e, s.defaultUpdateButton);
     }, { deep: !0 }), p(() => o.dropButton, (e) => {
-      M.value = Q(e, s.defaultDropButton);
+      X.value = Z(e, s.defaultDropButton);
     }, { deep: !0 }), p(() => o.editModeButton, (e) => {
-      ee.value = Q(e, s.defaultEditModeButton);
+      le.value = Z(e, s.defaultEditModeButton);
     }, { deep: !0 });
     const fe = async () => {
       var e, a, O;
-      D("fetchItem"), r.value = !0, z.value = -1, $.value = !1, typeof ((e = o.events) == null ? void 0 : e.httpStart) == "function" && o.events.httpStart();
+      D("fetchItem"), r.value = !0, J.value = -1, $.value = !1, typeof ((e = o.events) == null ? void 0 : e.httpStart) == "function" && o.events.httpStart();
       try {
-        const V = await ot(o.readResource, o.readData);
-        if (D("fetchItem -> response", V), r.value = !1, z.value = V.httpStatus, E.value = V.custom, !V.success) {
-          L.value = !1, z.value = V.httpStatus, typeof ((a = o.events) == null ? void 0 : a.httpEnd) == "function" && o.events.httpEnd({
-            httpResponse: V
-          }), f("error", V.httpStatus);
+        const M = await at(o.readResource, o.readData);
+        if (D("fetchItem -> response", M), r.value = !1, J.value = M.httpStatus, E.value = M.custom, !M.success) {
+          L.value = !1, J.value = M.httpStatus, typeof ((a = o.events) == null ? void 0 : a.httpEnd) == "function" && o.events.httpEnd({
+            httpResponse: M
+          }), f("error", M.httpStatus);
           return;
         }
-        L.value = !0, l.value = V.data, m.value = Array.isArray(V.modifications) ? {} : V.modifications, b.value = V.perms, I.value.increment(l.value).turnStoredIntoOriginal(), G.value.increment(m.value).turnStoredIntoOriginal(), h.value = I.value.changed(), Z.value.turnStoredIntoOriginal(), Object.keys(m.value).length > 0 && (N.value = k.Modifications), typeof ((O = o.events) == null ? void 0 : O.httpEnd) == "function" && o.events.httpEnd({
-          httpResponse: V
-        }), f("read", V);
+        L.value = !0, l.value = M.data, m.value = Array.isArray(M.modifications) ? {} : M.modifications, b.value = M.perms, I.value.increment(l.value).turnStoredIntoOriginal(), j.value.increment(m.value).turnStoredIntoOriginal(), h.value = I.value.changed(), x.value.turnStoredIntoOriginal(), Object.keys(m.value).length > 0 && (N.value = k.Modifications), ee.value && (Ce(), Pe(() => {
+          T.value.turnStoredIntoOriginal();
+        })), typeof ((O = o.events) == null ? void 0 : O.httpEnd) == "function" && o.events.httpEnd({
+          httpResponse: M
+        }), f("read", M);
       } catch {
-        r.value = !1, L.value = !1, z.value = 404, f("error", 404);
+        r.value = !1, L.value = !1, J.value = 404, f("error", 404);
         return;
       }
     };
-    p(j, (e) => {
-      e && Ye(() => j.value = !1);
+    p(F, (e) => {
+      e && Pe(() => F.value = !1);
     }), p(() => o.modelValue, (e) => {
       l.value = e, I.value.increment(e);
     }, { deep: !0 }), p(l, (e) => {
@@ -512,83 +514,83 @@ const D = (...A) => {
         let a = o.beforeEmitUpdate(l.value);
         D("item updated -> override with: ", a), typeof a == "object" && (l.value = a);
       }
-      te.value && Le(), f("update:modelValue", l.value), D("item updated -> update dataState"), I.value.increment(e), oe.value === k.Current && (h.value = I.value.changed()), j.value = !0;
+      ee.value && Ce(), f("update:modelValue", l.value), D("item updated -> update dataState"), I.value.increment(e), oe.value === k.Current && (h.value = I.value.changed()), F.value = !0;
     }, { deep: !0 }), p(b, () => f("perms", b.value)), p(h, (e) => {
       f("modified-data", e);
     }), p(() => o.readData, (e) => {
-      Z.value.increment(e), Z.value.changed() && fe();
+      x.value.increment(e), x.value.changed() && fe();
     }), p(() => o.editing, (e) => {
       D("editing updated -> updating editMode", e), B.value = e;
     }), p(B, (e) => {
       D("editMode updated -> emit update", e), f("update:editing", e);
     });
-    const Oe = d(void 0), Le = () => {
-      te.value && (Oe.value = at(l.value, m.value, o.form));
+    const Ne = d(void 0), Ce = () => {
+      ee.value && (Ne.value = nt(l.value, m.value, o.form));
     };
-    Ze(() => {
-      o.readResource && !H.value ? fe() : (H.value, L.value = !0, B.value = !0, r.value = !1, I.value.increment(l.value).turnStoredIntoOriginal(), h.value = I.value.changed());
+    _e(() => {
+      o.readResource && !G.value ? fe() : (G.value, L.value = !0, B.value = !0, r.value = !1, I.value.increment(l.value).turnStoredIntoOriginal(), h.value = I.value.changed());
     });
-    const Be = (e, a) => {
+    const De = (e, a) => {
       if (a) {
-        if (r.value = !1, typeof e < "u" && (z.value = e.httpStatus, !e.success))
+        if (r.value = !1, typeof e < "u" && (J.value = e.httpStatus, !e.success))
           return $.value = !0, f("error", e.httpStatus), !1;
         $.value = !0;
       }
       return !0;
-    }, Ne = (e, a) => {
+    }, $e = (e, a) => {
       if (D("doAutoReloadId -> enter: ", e), typeof e < "u" && e.autoReloadId)
         if (D("doAutoReloadId -> autoReloadId detected: ", e.autoReloadId), typeof a < "u") {
           let O = a;
           typeof a == "function" && (O = a(e.autoReloadId)), n.push(O);
-        } else Se.value ? (D("doAutoReloadId -> insideModal: ", o), dt(o.modalConfig.modalName, o.modalConfig.modalKey, e.autoReloadId)) : (D("doAutoReloadId -> outsideModal"), o.readData.id = e.autoReloadId, D("doAutoReloadId -> turning off create mode"), H.value = !1, fe());
-    }, Ce = (e, a) => {
-      if (D("onCreate"), !Be(a, F.value.resource)) {
-        o.notificationType === _.Toast && de({
+        } else Me.value ? (D("doAutoReloadId -> insideModal: ", o), rt(o.modalConfig.modalName, o.modalConfig.modalKey, e.autoReloadId)) : (D("doAutoReloadId -> outsideModal"), o.readData.id = e.autoReloadId, D("doAutoReloadId -> turning off create mode"), G.value = !1, fe());
+    }, he = (e, a) => {
+      if (D("onCreate"), !De(a, P.value.resource)) {
+        o.notificationType === te.Toast && re({
           text: s.defaultCreateErrorText,
           details: s.defaultCreateErrorDetails,
           icon: s.defaultCreateErrorIcon,
-          positionX: le.Right
+          positionX: de.Right
         });
         return;
       }
-      ue.value = !0, D("onCreate -> turn stored data into original"), I.value.increment(l.value).turnStoredIntoOriginal(), o.notificationType === _.Toast && de({
+      ue.value = !0, D("onCreate -> turn stored data into original"), I.value.increment(l.value).turnStoredIntoOriginal(), j.value.turnStoredIntoOriginal(), o.notificationType === te.Toast && re({
         text: s.defaultCreateSuccessText,
         details: s.defaultCreateSuccessDetails,
         icon: s.defaultCreateSuccessIcon,
-        positionX: le.Right
-      }), Ne(a, o.redirectOnCreate), D("onCreate -> beforeEmitCreate"), f("create", a);
-    }, De = (e, a) => {
-      if (D("onUpdate"), !Be(a, P.value.resource)) {
-        o.notificationType === _.Toast && de({
+        positionX: de.Right
+      }), $e(a, o.redirectOnCreate), D("onCreate -> beforeEmitCreate"), f("create", a);
+    }, we = (e, a) => {
+      if (D("onUpdate"), !De(a, U.value.resource)) {
+        o.notificationType === te.Toast && re({
           text: s.defaultUpdateErrorText,
           details: s.defaultUpdateErrorDetails,
           icon: s.defaultUpdateErrorIcon,
-          positionX: le.Right
+          positionX: de.Right
         });
         return;
       }
-      D("onUpdate -> turn stored data into original"), I.value.turnStoredIntoOriginal(), o.notificationType === _.Toast && de({
+      D("onUpdate -> turn stored data into original"), I.value.turnStoredIntoOriginal(), j.value.turnStoredIntoOriginal(), o.notificationType === te.Toast && re({
         text: s.defaultUpdateSuccessText,
         details: s.defaultUpdateSuccessDetails,
         icon: s.defaultUpdateSuccessIcon,
-        positionX: le.Right
-      }), Ne(a), f("update", a);
-    }, he = (e, a) => {
-      if (D("onDrop"), !Be(a, M.value.resource)) {
-        o.notificationType === _.Toast && de({
+        positionX: de.Right
+      }), $e(a), f("update", a);
+    }, Se = (e, a) => {
+      if (D("onDrop"), !De(a, X.value.resource)) {
+        o.notificationType === te.Toast && re({
           text: s.defaultDropErrorText,
           details: s.defaultDropErrorDetails,
           icon: s.defaultDropErrorIcon,
-          positionX: le.Right
+          positionX: de.Right
         });
         return;
       }
-      if (o.notificationType === _.Toast && de({
+      if (o.notificationType === te.Toast && re({
         text: s.defaultDropSuccessText,
         details: s.defaultDropSuccessDetails,
         icon: s.defaultDropSuccessIcon,
-        positionX: le.Right
-      }), f("drop", a), o.view === Pe.Modal && (D("onDrop -> close modal"), lt(o.modalConfig.modalName, o.modalConfig.modalKey)), typeof o.redirectOnDrop < "u") {
+        positionX: de.Right
+      }), f("drop", a), o.view === Ke.Modal && (D("onDrop -> close modal"), dt(o.modalConfig.modalName, o.modalConfig.modalKey)), typeof o.redirectOnDrop < "u") {
         let O = o.redirectOnDrop;
         typeof o.redirectOnDrop == "function" && (O = o.redirectOnDrop()), n.push(O);
       }
@@ -606,62 +608,62 @@ const D = (...A) => {
       },
       hasModifiedData: () => I.value.changed()
     });
-    const We = g(() => {
+    const Ge = g(() => {
       var e, a, O;
-      return ge.value ? te.value ? x.value ? (e = o.modalConfig) == null ? void 0 : e.closeConfirm : "" : oe.value === k.Modifications ? G.value.changed() ? (a = o.modalConfig) == null ? void 0 : a.closeConfirm : "" : I.value.changed() ? (O = o.modalConfig) == null ? void 0 : O.closeConfirm : "" : "";
-    }), He = (e) => {
+      return ge.value ? ee.value ? z.value ? (e = o.modalConfig) == null ? void 0 : e.closeConfirm : "" : oe.value === k.Modifications ? j.value.changed() ? (a = o.modalConfig) == null ? void 0 : a.closeConfirm : "" : I.value.changed() ? (O = o.modalConfig) == null ? void 0 : O.closeConfirm : "" : "";
+    }), qe = (e) => {
       var a;
       if (typeof ((a = o.modalConfig) == null ? void 0 : a.beforeClose) == "function")
         return o.modalConfig.beforeClose({
           ...e,
           itemCreated: ue.value
         });
-    }, we = g(() => o.title.startsWith("__:") ? String(rt(o.title.substring(3))) : o.title), Ge = g(() => r.value ? !1 : we.value.length > 0 || !!C["post-title"]), Se = g(() => o.view === Pe.Modal), $e = g(() => Se.value ? "lkt-modal" : "section"), me = g(() => {
+    }, Ue = g(() => o.title.startsWith("__:") ? String(st(o.title.substring(3))) : o.title), ze = g(() => r.value ? !1 : Ue.value.length > 0 || !!C["post-title"]), Me = g(() => o.view === Ke.Modal), je = g(() => Me.value ? "lkt-modal" : "section"), me = g(() => {
       var e, a;
-      return o.mode !== T.Update || !w.value || !o.enabledSaveWithoutChanges && !h.value || te.value && !Y.value ? !1 : typeof ((e = P.value) == null ? void 0 : e.disabled) == "function" ? !P.value.disabled({
+      return o.mode !== V.Update || !y.value || !o.enabledSaveWithoutChanges && !h.value || ee.value && (!_.value || !z.value) ? !1 : typeof ((e = U.value) == null ? void 0 : e.disabled) == "function" ? !U.value.disabled({
         prop: l.value
-      }) : typeof ((a = P.value) == null ? void 0 : a.disabled) == "boolean" ? !P.value.disabled : !0;
+      }) : typeof ((a = U.value) == null ? void 0 : a.disabled) == "boolean" ? !U.value.disabled : !0;
     }), be = g(() => {
       var e, a;
-      return o.mode !== T.Create || !o.enabledSaveWithoutChanges && !h.value || te.value && !Y.value ? !1 : typeof ((e = F.value) == null ? void 0 : e.disabled) == "function" ? !F.value.disabled({
+      return o.mode !== V.Create || !o.enabledSaveWithoutChanges && !h.value || ee.value && !_.value && !z.value ? !1 : typeof ((e = P.value) == null ? void 0 : e.disabled) == "function" ? !P.value.disabled({
         prop: l.value
-      }) : typeof ((a = F.value) == null ? void 0 : a.disabled) == "boolean" ? !F.value.disabled : !0;
-    }), Ue = g(() => {
+      }) : typeof ((a = P.value) == null ? void 0 : a.disabled) == "boolean" ? !P.value.disabled : !0;
+    }), Ve = g(() => {
       var e, a;
-      return y.value ? typeof ((e = M.value) == null ? void 0 : e.disabled) == "function" ? !M.value.disabled({
+      return Q.value ? typeof ((e = X.value) == null ? void 0 : e.disabled) == "function" ? !X.value.disabled({
         prop: l.value
-      }) : typeof ((a = M.value) == null ? void 0 : a.disabled) == "boolean" ? !M.value.disabled : !0 : !1;
-    }), qe = g(() => $e.value === "lkt-modal" ? {
+      }) : typeof ((a = X.value) == null ? void 0 : a.disabled) == "boolean" ? !X.value.disabled : !0 : !1;
+    }), Je = g(() => je.value === "lkt-modal" ? {
       title: o.title,
       item: l.value,
       ...o.modalConfig,
-      beforeClose: He,
-      closeConfirm: We.value,
+      beforeClose: qe,
+      closeConfirm: Ge.value,
       headerActionsButton: o.groupButton !== !1 ? {
         dot: be.value || me.value
       } : !1
-    } : {}), te = g(() => typeof o.form == "object" && Object.keys(o.form).length > 0), Me = g(() => Object.keys(m.value).length === 0 ? [] : o.modificationViews), oe = g(() => Object.keys(m.value).length === 0 ? k.Current : k.Modifications), ge = g(() => H.value || w.value || y.value), ze = g(() => te.value ? nt(o.form) : []);
+    } : {}), ee = g(() => typeof o.form == "object" && Object.keys(o.form).length > 0), Ie = g(() => Object.keys(m.value).length === 0 ? [] : o.modificationViews), oe = g(() => Object.keys(m.value).length === 0 ? k.Current : k.Modifications), ge = g(() => G.value || y.value || Q.value), Qe = g(() => ee.value ? ut(o.form) : []);
     return (e, a) => {
-      const O = ye("lkt-http-info"), V = ye("lkt-form"), Je = ye("lkt-loader");
-      return c(), R(_e($e.value), U(qe.value, { class: "lkt-item-crud" }), pe({
+      const O = ye("lkt-http-info"), M = ye("lkt-form"), Ye = ye("lkt-loader");
+      return c(), R(xe(je.value), S(Je.value, { class: "lkt-item-crud" }), pe({
         default: q(() => [
-          xe("article", mt, [
-            !Se.value && Ge.value ? (c(), W("header", bt, [
-              i(C)["pre-title"] ? (c(), W("div", gt, [
-                S(e.$slots, "pre-title", {
+          et("article", bt, [
+            !Me.value && ze.value ? (c(), H("header", gt, [
+              i(C)["pre-title"] ? (c(), H("div", yt, [
+                w(e.$slots, "pre-title", {
                   item: l.value,
                   loading: r.value
                 })
               ])) : v("", !0),
-              we.value.length > 0 ? (c(), W("h1", yt, et(we.value), 1)) : v("", !0),
-              i(C)["post-title"] ? (c(), W("div", kt, [
-                S(e.$slots, "post-title", {
+              Ue.value.length > 0 ? (c(), H("h1", kt, tt(Ue.value), 1)) : v("", !0),
+              i(C)["post-title"] ? (c(), H("div", Bt, [
+                w(e.$slots, "post-title", {
                   item: l.value,
                   loading: r.value
                 })
               ])) : v("", !0)
             ])) : v("", !0),
-            e.buttonNavPosition === i(Ae).Top && (e.groupButton === !1 || !e.groupButtonAsModalActions) && ge.value ? (c(), R(Ee, {
+            e.buttonNavPosition === i(Oe).Top && (e.groupButton === !1 || !e.groupButtonAsModalActions) && ge.value ? (c(), R(Le, {
               key: 1,
               ref_key: "buttonNav",
               ref: t,
@@ -677,31 +679,31 @@ const D = (...A) => {
               view: e.view,
               grouped: e.groupButton !== !1,
               "button-nav-visibility": e.buttonNavVisibility,
-              "create-button": F.value,
-              "update-button": P.value,
-              "drop-button": M.value,
-              "edit-mode-button": ee.value,
-              "group-button": se.value,
+              "create-button": P.value,
+              "update-button": U.value,
+              "drop-button": X.value,
+              "edit-mode-button": le.value,
+              "group-button": Be.value,
               "data-changed": h.value,
               "http-success-read": L.value,
-              "can-update": w.value,
-              "can-drop": y.value,
+              "can-update": y.value,
+              "can-drop": Q.value,
               "can-switch-edit-mode": ie.value,
               "group-button-as-modal-actions": e.groupButtonAsModalActions,
               "able-to-create": be.value,
               "able-to-update": me.value,
-              "able-to-drop": Ue.value,
+              "able-to-drop": Ve.value,
               perms: b.value,
-              "modification-view": Me.value,
+              "modification-view": Ie.value,
               "editable-view": oe.value,
-              onCreate: Ce,
-              onSave: De,
-              onDrop: he
+              onCreate: he,
+              onSave: we,
+              onDrop: Se
             }, pe({ _: 2 }, [
               i(C)["prev-buttons-ever"] ? {
                 name: "prev-buttons-ever",
                 fn: q(({ canUpdate: u, canDrop: ae, perms: ne }) => [
-                  S(e.$slots, "prev-buttons-ever", {
+                  w(e.$slots, "prev-buttons-ever", {
                     canUpdate: u,
                     canDrop: ae,
                     perms: ne
@@ -712,7 +714,7 @@ const D = (...A) => {
               i(C)["prev-buttons"] ? {
                 name: "prev-buttons",
                 fn: q(({ canUpdate: u, canDrop: ae, perms: ne }) => [
-                  S(e.$slots, "prev-buttons", {
+                  w(e.$slots, "prev-buttons", {
                     canUpdate: u,
                     canDrop: ae,
                     perms: ne
@@ -721,59 +723,61 @@ const D = (...A) => {
                 key: "1"
               } : void 0
             ]), 1032, ["loading", "editing", "picked-modification-view", "item", "modifications", "mode", "view", "grouped", "button-nav-visibility", "create-button", "update-button", "drop-button", "edit-mode-button", "group-button", "data-changed", "http-success-read", "can-update", "can-drop", "can-switch-edit-mode", "group-button-as-modal-actions", "able-to-create", "able-to-update", "able-to-drop", "perms", "modification-view", "editable-view"])) : v("", !0),
-            r.value ? v("", !0) : (c(), W("div", Bt, [
-              L.value ? (c(), W("div", Ct, [
-                $.value && e.notificationType === i(_).Inline ? (c(), R(O, {
+            r.value ? v("", !0) : (c(), H("div", Ct, [
+              L.value ? (c(), H("div", Dt, [
+                $.value && e.notificationType === i(te).Inline ? (c(), R(O, {
                   key: 0,
-                  code: z.value,
-                  palette: z.value === 200 ? "success" : "danger",
+                  code: J.value,
+                  palette: J.value === 200 ? "success" : "danger",
                   quick: "",
                   "can-close": "",
                   onClose: a[6] || (a[6] = (u) => $.value = !1)
                 }, null, 8, ["code", "palette"])) : v("", !0),
-                te.value ? (c(), R(V, U({
+                ee.value ? (c(), R(M, S({
                   key: 1,
+                  ref_key: "formRef",
+                  ref: T,
                   modelValue: l.value,
                   "onUpdate:modelValue": a[7] || (a[7] = (u) => l.value = u),
                   modifications: m.value,
                   "onUpdate:modifications": a[8] || (a[8] = (u) => m.value = u),
-                  valid: Y.value,
-                  "onUpdate:valid": a[9] || (a[9] = (u) => Y.value = u),
-                  changed: x.value,
-                  "onUpdate:changed": a[10] || (a[10] = (u) => x.value = u)
+                  valid: _.value,
+                  "onUpdate:valid": a[9] || (a[9] = (u) => _.value = u),
+                  changed: z.value,
+                  "onUpdate:changed": a[10] || (a[10] = (u) => z.value = u)
                 }, {
                   ...e.formUiConfig,
                   form: e.form,
                   differencesTableConfig: e.differencesTableConfig,
                   visibleView: N.value,
-                  modificationDataState: Oe.value,
+                  modificationDataState: Ne.value,
                   editableViews: [oe.value],
                   disabled: !B.value
                 }), pe({ _: 2 }, [
-                  tt(ze.value, (u) => ({
+                  ot(Qe.value, (u) => ({
                     name: u,
                     fn: q(({}) => [
-                      S(e.$slots, u)
+                      w(e.$slots, u)
                     ])
                   }))
-                ]), 1040, ["modelValue", "modifications", "valid", "changed"])) : S(e.$slots, "item", {
+                ]), 1040, ["modelValue", "modifications", "valid", "changed"])) : w(e.$slots, "item", {
                   key: 2,
                   item: l.value,
                   loading: r.value,
                   editMode: B.value,
-                  isCreate: H.value,
-                  canUpdate: w.value,
-                  canDrop: y.value,
-                  itemBeingEdited: j.value,
+                  isCreate: G.value,
+                  canUpdate: y.value,
+                  canDrop: Q.value,
+                  itemBeingEdited: F.value,
                   perms: b.value
                 })
-              ])) : e.notificationType === i(_).Inline ? (c(), R(O, {
+              ])) : e.notificationType === i(te).Inline ? (c(), R(O, {
                 key: 1,
-                code: z.value
+                code: J.value
               }, null, 8, ["code"])) : v("", !0)
             ])),
-            r.value ? (c(), R(Je, { key: 3 })) : v("", !0),
-            e.buttonNavPosition === i(Ae).Bottom && (e.groupButton === !1 || !e.groupButtonAsModalActions) && ge.value ? (c(), R(Ee, {
+            r.value ? (c(), R(Ye, { key: 3 })) : v("", !0),
+            e.buttonNavPosition === i(Oe).Bottom && (e.groupButton === !1 || !e.groupButtonAsModalActions) && ge.value ? (c(), R(Le, {
               key: 4,
               ref_key: "buttonNav",
               ref: t,
@@ -789,38 +793,38 @@ const D = (...A) => {
               view: e.view,
               grouped: e.groupButton !== !1,
               "button-nav-visibility": e.buttonNavVisibility,
-              "create-button": F.value,
-              "update-button": P.value,
-              "drop-button": M.value,
-              "edit-mode-button": ee.value,
-              "group-button": se.value,
+              "create-button": P.value,
+              "update-button": U.value,
+              "drop-button": X.value,
+              "edit-mode-button": le.value,
+              "group-button": Be.value,
               "data-changed": h.value,
               "http-success-read": L.value,
-              "can-update": w.value,
-              "can-drop": y.value,
+              "can-update": y.value,
+              "can-drop": Q.value,
               "can-switch-edit-mode": ie.value,
               "group-button-as-modal-actions": e.groupButtonAsModalActions,
               "able-to-create": be.value,
               "able-to-update": me.value,
-              "able-to-drop": Ue.value,
+              "able-to-drop": Ve.value,
               perms: b.value,
-              "modification-view": Me.value,
+              "modification-view": Ie.value,
               "editable-view": oe.value,
-              onCreate: Ce,
-              onSave: De,
-              onDrop: he
+              onCreate: he,
+              onSave: we,
+              onDrop: Se
             }, pe({ _: 2 }, [
               i(C)["prev-buttons-ever"] ? {
                 name: "prev-buttons-ever",
                 fn: q(() => [
-                  S(e.$slots, "prev-buttons-ever")
+                  w(e.$slots, "prev-buttons-ever")
                 ]),
                 key: "0"
               } : void 0,
               i(C)["prev-buttons"] ? {
                 name: "prev-buttons-ever",
                 fn: q(() => [
-                  S(e.$slots, "prev-buttons")
+                  w(e.$slots, "prev-buttons")
                 ]),
                 key: "1"
               } : void 0
@@ -832,7 +836,7 @@ const D = (...A) => {
         e.groupButton !== !1 && e.groupButtonAsModalActions && ge.value ? {
           name: "header-actions",
           fn: q(() => [
-            e.buttonNavPosition === i(Ae).Top ? (c(), R(Ee, {
+            e.buttonNavPosition === i(Oe).Top ? (c(), R(Le, {
               key: 0,
               ref_key: "buttonNav",
               ref: t,
@@ -848,31 +852,31 @@ const D = (...A) => {
               view: e.view,
               grouped: !0,
               "button-nav-visibility": e.buttonNavVisibility,
-              "create-button": F.value,
-              "update-button": P.value,
-              "drop-button": M.value,
-              "edit-mode-button": ee.value,
-              "group-button": se.value,
+              "create-button": P.value,
+              "update-button": U.value,
+              "drop-button": X.value,
+              "edit-mode-button": le.value,
+              "group-button": Be.value,
               "data-changed": h.value,
               "http-success-read": L.value,
-              "can-update": w.value,
-              "can-drop": y.value,
+              "can-update": y.value,
+              "can-drop": Q.value,
               "can-switch-edit-mode": ie.value,
               "group-button-as-modal-actions": e.groupButtonAsModalActions,
               "able-to-create": be.value,
               "able-to-update": me.value,
-              "able-to-drop": Ue.value,
+              "able-to-drop": Ve.value,
               perms: b.value,
-              "modification-view": Me.value,
+              "modification-view": Ie.value,
               "editable-view": oe.value,
-              onCreate: Ce,
-              onSave: De,
-              onDrop: he
+              onCreate: he,
+              onSave: we,
+              onDrop: Se
             }, pe({ _: 2 }, [
               i(C)["prev-buttons-ever"] ? {
                 name: "prev-buttons-ever",
                 fn: q(({ canUpdate: u, canDrop: ae, perms: ne }) => [
-                  S(e.$slots, "prev-buttons-ever", {
+                  w(e.$slots, "prev-buttons-ever", {
                     canUpdate: u,
                     canDrop: ae,
                     perms: ne
@@ -883,7 +887,7 @@ const D = (...A) => {
               i(C)["prev-buttons"] ? {
                 name: "prev-buttons",
                 fn: q(({ canUpdate: u, canDrop: ae, perms: ne }) => [
-                  S(e.$slots, "prev-buttons", {
+                  w(e.$slots, "prev-buttons", {
                     canUpdate: u,
                     canDrop: ae,
                     perms: ne
@@ -898,18 +902,18 @@ const D = (...A) => {
       ]), 1040);
     };
   }
-}), Ot = {
+}), Lt = {
   install: (A, ce = {}) => {
-    A.component("lkt-item-crud") === void 0 && A.component("lkt-item-crud", Dt);
+    A.component("lkt-item-crud") === void 0 && A.component("lkt-item-crud", ht);
   }
-}, Lt = (A) => {
-  re.defaultSaveIcon = A;
 }, Nt = (A) => {
-  re.defaultDropIcon = A;
+  se.defaultSaveIcon = A;
+}, $t = (A) => {
+  se.defaultDropIcon = A;
 };
 export {
-  Et as debugLktItemCrud,
-  Ot as default,
-  Nt as setItemCrudDefaultDropIcon,
-  Lt as setItemCrudDefaultSaveIcon
+  Ot as debugLktItemCrud,
+  Lt as default,
+  $t as setItemCrudDefaultDropIcon,
+  Nt as setItemCrudDefaultSaveIcon
 };

package/dist/lib-components/LktItemCrud.vue.d.ts

@@ -21,7 +21,7 @@ declare var __VLS_17: {
     canUpdate: boolean | undefined;
     canDrop: boolean | undefined;
     perms: string[] | undefined;
-}, __VLS_53: string, __VLS_54: {}, __VLS_56: {
+}, __VLS_55: string, __VLS_56: {}, __VLS_58: {
     item: LktObject;
     loading: false;
     editMode: boolean;
@@ -30,9 +30,9 @@ declare var __VLS_17: {
     canDrop: boolean;
     itemBeingEdited: boolean;
     perms: string[];
-}, __VLS_77: {}, __VLS_79: {};
+}, __VLS_79: {}, __VLS_81: {};
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_53>]?: (props: typeof __VLS_54) => any;
+    [K in NonNullable<typeof __VLS_55>]?: (props: typeof __VLS_56) => any;
 } & {
     'prev-buttons-ever'?: (props: typeof __VLS_17) => any;
 } & {
@@ -46,11 +46,11 @@ type __VLS_Slots = {} & {
 } & {
     'prev-buttons'?: (props: typeof __VLS_38) => any;
 } & {
-    item?: (props: typeof __VLS_56) => any;
+    item?: (props: typeof __VLS_58) => any;
 } & {
-    'prev-buttons-ever'?: (props: typeof __VLS_77) => any;
+    'prev-buttons-ever'?: (props: typeof __VLS_79) => any;
 } & {
-    'prev-buttons'?: (props: typeof __VLS_79) => any;
+    'prev-buttons'?: (props: typeof __VLS_81) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<ItemCrudConfig, {
     doDrop: () => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lkt-item-crud",
-  "version": "2.0.23",
+  "version": "2.0.24",
   "description": "",
   "type": "module",
   "module": "./dist/build.js",

package/src/lib-components/LktItemCrud.vue

@@ -74,6 +74,7 @@
         itemBeingEdited = ref(false),
         itemCreated = ref(false),
         buttonNav = ref(null),
+        formRef = ref(null),
         canUpdate = computed(() => !createMode.value && Array.isArray(permissions.value) && permissions.value.includes(TablePermission.Update)),
         canDrop = computed(() => !createMode.value && Array.isArray(permissions.value) && permissions.value.includes(TablePermission.Drop)),
         canSwitchEditMode = computed(() => !createMode.value && Array.isArray(permissions.value) && permissions.value.includes(TablePermission.SwitchEditMode));
@@ -176,6 +177,13 @@
                 pickedModificationView.value = ModificationView.Modifications;
             }
 
+            if (computedHasForm.value) {
+                resetFormDifferencesChecker();
+                nextTick(() => {
+                    formRef.value.turnStoredIntoOriginal();
+                })
+            }
+
             if (typeof props.events?.httpEnd === 'function') {
                 props.events.httpEnd({
                     httpResponse: r,
@@ -320,6 +328,7 @@
             itemCreated.value = true;
             debug('onCreate -> turn stored data into original');
             dataState.value.increment(item.value).turnStoredIntoOriginal();
+            modificationsDataState.value.turnStoredIntoOriginal();
             if (props.notificationType === NotificationType.Toast) {
                 openToast(<ToastConfig>{
                     text: LktSettings.defaultCreateSuccessText,
@@ -347,6 +356,7 @@
             }
             debug('onUpdate -> turn stored data into original');
             dataState.value.turnStoredIntoOriginal();
+            modificationsDataState.value.turnStoredIntoOriginal();
             if (props.notificationType === NotificationType.Toast) {
                 openToast(<ToastConfig>{
                     text: LktSettings.defaultUpdateSuccessText,
@@ -453,7 +463,7 @@
         ableToUpdate = computed(() => {
             if (props.mode !== ItemCrudMode.Update || !canUpdate.value) return false;
             if (!props.enabledSaveWithoutChanges && !dataChanged.value) return false;
-            if (computedHasForm.value && !validForm.value) return false;
+            if (computedHasForm.value && (!validForm.value || !changedForm.value)) return false;
 
             if (typeof safeUpdateButton.value?.disabled === 'function') return !safeUpdateButton.value.disabled({
                 prop: item.value
@@ -465,7 +475,7 @@
         ableToCreate = computed(() => {
             if (props.mode !== ItemCrudMode.Create) return false;
             if (!props.enabledSaveWithoutChanges && !dataChanged.value) return false;
-            if (computedHasForm.value && !validForm.value) return false;
+            if (computedHasForm.value && !validForm.value && !changedForm.value) return false;
 
             if (typeof safeCreateButton.value?.disabled === 'function') return !safeCreateButton.value.disabled({
                 prop: item.value
@@ -658,6 +668,7 @@
 
                     <template v-if="computedHasForm">
                         <lkt-form
+                            ref="formRef"
                             v-model="item"
                             v-model:modifications="itemModifications"
                             v-model:valid="validForm"