lkt-item-crud 2.0.20 → 2.0.21

package/dist/build.d.ts

@@ -1,7 +1,7 @@
-declare function Tt(B?: boolean): void;
-declare namespace It {
+declare function It(B?: boolean): void;
+declare namespace Rt {
     function install(B: any, K?: {}): void;
 }
+declare function Ot(B: any): void;
 declare function At(B: any): void;
-declare function Rt(B: any): void;
-export { Tt as debugLktItemCrud, It as default, At as setItemCrudDefaultDropIcon, Rt as setItemCrudDefaultSaveIcon };
+export { It as debugLktItemCrud, Rt as default, Ot as setItemCrudDefaultDropIcon, At as setItemCrudDefaultSaveIcon };

package/dist/build.js

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

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

@@ -1,4 +1,4 @@
-import { ButtonConfig, ItemCrudButtonNavPosition, ItemCrudConfig, ItemCrudMode, ItemCrudView, LktObject, ModalConfig, ModificationView, NotificationType } from 'lkt-vue-kernel';
+import { ButtonConfig, FormUiConfig, ItemCrudButtonNavPosition, ItemCrudConfig, ItemCrudMode, ItemCrudView, LktObject, ModalConfig, ModificationView, NotificationType } from 'lkt-vue-kernel';
 declare var __VLS_17: {
     canUpdate: boolean | undefined;
     canDrop: boolean | undefined;
@@ -100,6 +100,7 @@ declare const __VLS_component: import("vue").DefineComponent<ItemCrudConfig, {
     editing: boolean;
     perms: import("lkt-vue-kernel").ValidTablePermission[];
     customData: LktObject;
+    formUiConfig: Partial<FormUiConfig>;
     visibleView: ModificationView;
     modificationViews: boolean | Array<ModificationView>;
     editModeButton: ButtonConfig | false;

package/package.json

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

package/src/lib-components/LktItemCrud.vue

@@ -164,7 +164,7 @@
             }
             httpSuccessRead.value = true;
             item.value = r.data;
-            itemModifications.value = r.modifications;
+            itemModifications.value = Array.isArray(r.modifications) ? {} : r.modifications;
             permissions.value = r.perms;
             dataState.value.increment(item.value).turnStoredIntoOriginal();
             modificationsDataState.value.increment(itemModifications.value).turnStoredIntoOriginal();
@@ -407,6 +407,10 @@
 
 
     const closeConfirm = computed(() => {
+        if (!computedHasButtons.value) return '';
+        if (computedEditableView.value === ModificationView.Modifications) {
+            return modificationsDataState.value.changed() ? props.modalConfig?.closeConfirm : '';
+        }
         return dataState.value.changed() ? props.modalConfig?.closeConfirm : '';
     });
 
@@ -504,6 +508,10 @@
         if (Object.keys(itemModifications.value).length === 0) return ModificationView.Current;
         return ModificationView.Modifications;
     })
+
+    const computedHasButtons = computed(() => {
+        return createMode.value || canUpdate.value || canDrop.value;
+    })
 </script>
 
 <template>
@@ -512,7 +520,7 @@
         v-bind="computedContainerAttrs"
         class="lkt-item-crud"
     >
-        <template v-if="groupButton !== false && groupButtonAsModalActions" #header-actions>
+        <template v-if="groupButton !== false && groupButtonAsModalActions && computedHasButtons" #header-actions>
             <button-nav
                 ref="buttonNav"
                 v-if="buttonNavPosition === ItemCrudButtonNavPosition.Top"
@@ -576,7 +584,10 @@
 
             <button-nav
                 ref="buttonNav"
-                v-if="buttonNavPosition === ItemCrudButtonNavPosition.Top && (groupButton === false || !groupButtonAsModalActions)"
+                v-if="buttonNavPosition === ItemCrudButtonNavPosition.Top
+                && (groupButton === false || !groupButtonAsModalActions)
+                 && computedHasButtons
+"
                 v-model:loading="isLoading"
                 v-model:editing="editMode"
                 v-model:picked-modification-view="pickedModificationView"
@@ -639,6 +650,7 @@
                             v-model:modifications="itemModifications"
                             v-model:valid="validForm"
                             v-bind="<FormUiConfig>{
+                                ...formUiConfig,
                                 form,
                                 differencesTableConfig,
                                 visibleView: pickedModificationView,
@@ -668,7 +680,7 @@
 
             <button-nav
                 ref="buttonNav"
-                v-if="buttonNavPosition === ItemCrudButtonNavPosition.Bottom && (groupButton === false || !groupButtonAsModalActions)"
+                v-if="buttonNavPosition === ItemCrudButtonNavPosition.Bottom && (groupButton === false || !groupButtonAsModalActions) && computedHasButtons"
                 v-model:loading="isLoading"
                 v-model:editing="editMode"
                 v-model:picked-modification-view="pickedModificationView"