lkt-menu 1.2.0 → 1.4.1

package/dist/build.d.ts

@@ -1,42 +1,59 @@
-declare class H {
-    constructor(r: any, a: any, s: any);
-    key: any;
-    href: any;
-    label: any;
-    icon: string;
-    isOpened: boolean;
-    isActive: boolean;
-    children: any[];
-    setChildren(r: any): this;
-    setOnClick(r: any): this;
-    onClick: any;
-    setIsActiveChecker(r: any): this;
-    isActiveChecker: any;
-    setIsActive(r?: boolean): this;
-    setLabel(r: any): this;
-    setIcon(r: any): this;
-    doClose(): void;
-}
-declare function Xe(e: any, r: any, a: any): {
-    key: any;
-    href: any;
-    label: any;
-    icon: string;
-    isOpened: boolean;
-    isActive: boolean;
-    children: any[];
-    setChildren: (r: any) => H;
-    setOnClick: (r: any) => H;
-    onClick: any;
-    setIsActiveChecker: (r: any) => H;
-    isActiveChecker: any;
-    setIsActive: (r?: boolean) => H;
-    setLabel: (r: any) => H;
-    setIcon: (r: any) => H;
+import { MenuEntry as be } from "lkt-vue-kernel";
+declare function Ve(u: any, m: any, o: any): {
+    key?: string | undefined;
+    href?: string | undefined;
+    label?: string | undefined;
+    icon?: string | undefined;
+    isActiveChecker?: Function | undefined;
+    isOpened?: boolean | undefined;
+    isActive?: boolean | undefined;
+    parent?: {
+        key?: string | undefined;
+        href?: string | undefined;
+        label?: string | undefined;
+        icon?: string | undefined;
+        isActiveChecker?: Function | undefined;
+        isOpened?: boolean | undefined;
+        isActive?: boolean | undefined;
+        parent?: /*elided*/ any | undefined;
+        children?: /*elided*/ any[] | undefined;
+        events?: {
+            click?: Function | undefined;
+        } | undefined;
+        onClick?: Function | undefined;
+    } | undefined;
+    children?: {
+        key?: string | undefined;
+        href?: string | undefined;
+        label?: string | undefined;
+        icon?: string | undefined;
+        isActiveChecker?: Function | undefined;
+        isOpened?: boolean | undefined;
+        isActive?: boolean | undefined;
+        parent?: /*elided*/ any | undefined;
+        children?: /*elided*/ any[] | undefined;
+        events?: {
+            click?: Function | undefined;
+        } | undefined;
+        onClick?: Function | undefined;
+    }[] | undefined;
+    events?: {
+        click?: Function | undefined;
+    } | undefined;
+    onClick?: Function | undefined;
+    setChildren: (children: z[]) => z;
+    setOnClick: (fn: Function) => z;
+    setIsActiveChecker: (fn: Function) => z;
+    setIsActive: (enabled?: boolean) => z;
+    setLabel: (str: string) => z;
+    setIcon: (str: string) => z;
     doClose: () => void;
+    feed: (data?: import("lkt-vue-kernel").LktObject, target?: z | undefined) => void;
+    assignProp: (key: string, value: any) => void;
 };
-declare namespace Qe {
-    function install(e: any): void;
+declare namespace _e {
+    function install(u: any): void;
 }
-declare function Ye(e: any): boolean;
-export { H as MenuEntry, Xe as createMenuEntry, Qe as default, Ye as setMenuToggleSlot };
+declare function Ce(u: any): boolean;
+import { MenuEntry as z } from "lkt-vue-kernel";
+export { be as MenuEntry, Ve as createMenuEntry, _e as default, Ce as setMenuToggleSlot };

package/dist/build.js

@@ -1,218 +1,208 @@
-import { defineComponent as B, ref as O, useSlots as U, computed as c, watch as x, onMounted as J, resolveComponent as z, createElementBlock as d, openBlock as i, normalizeClass as S, createElementVNode as A, createCommentVNode as k, createVNode as W, withCtx as V, renderSlot as D, unref as q, toDisplayString as G, createBlock as R, resolveDynamicComponent as Q, Fragment as F, renderList as M, createSlots as $, reactive as X } from "vue";
-import { useRouter as Y } from "vue-router";
-import "lkt-string-tools";
-import { __ as Z } from "lkt-i18n";
-import { DataState as ee } from "lkt-data-state";
-import { httpCall as te } from "lkt-http-client";
-class H {
-  constructor(r, a, s) {
-    this.key = "", this.href = "", this.label = "", this.icon = "", this.onClick = void 0, this.isActiveChecker = void 0, this.isOpened = !1, this.isActive = !1, this.parent = void 0, this.children = [], this.key = r, this.href = a, this.label = s;
-  }
-  setChildren(r) {
-    return r.forEach((a) => a.parent = this), this.children = r, this;
-  }
-  setOnClick(r) {
-    return this.onClick = r, this;
-  }
-  setIsActiveChecker(r) {
-    return this.isActiveChecker = r, this;
-  }
-  setIsActive(r = !0) {
-    return this.isActive = r, this;
-  }
-  setLabel(r) {
-    return this.label = r, this;
-  }
-  setIcon(r) {
-    return this.icon = r, this;
-  }
-  doClose() {
-    this.isOpened = !1;
-  }
-}
-const T = (e, r) => (r.forEach((a) => {
-  e.includes(a.key) || e.push(a.key), a.children.length > 0 && T(e, a.children);
-}), e), w = class w {
+import { defineComponent as K, ref as R, useSlots as T, computed as i, watch as M, onMounted as G, resolveComponent as J, createElementBlock as c, openBlock as r, normalizeClass as D, createElementVNode as A, createCommentVNode as h, createVNode as H, withCtx as j, renderSlot as x, unref as P, toDisplayString as Q, createBlock as L, resolveDynamicComponent as X, Fragment as F, renderList as E, createSlots as W, mergeDefaults as Y, reactive as Z } from "vue";
+import { MenuEntry as z, extractI18nValue as ee, getDefaultValues as te, Menu as le } from "lkt-vue-kernel";
+import { MenuEntry as be } from "lkt-vue-kernel";
+import { useRouter as ne } from "vue-router";
+import { DataState as ue } from "lkt-data-state";
+import { httpCall as oe } from "lkt-http-client";
+const U = (u, m) => (m.forEach((o) => {
+  u.includes(o.key) || u.push(o.key), o.children.length > 0 && U(u, o.children);
+}), u), I = class I {
 };
-w.toggleSlot = "", w.debugEnabled = !1;
-let y = w;
-var re = ((e) => (e.Button = "button", e.Submit = "submit", e.Reset = "reset", e.Anchor = "anchor", e.Content = "content", e.Switch = "switch", e.HiddenSwitch = "hidden-switch", e.Split = "split", e.SplitLazy = "split-lazy", e.SplitEver = "split-ever", e.Tooltip = "tooltip", e.TooltipLazy = "tooltip-lazy", e.TooltipEver = "tooltip-ever", e))(re || {}), ne = ((e) => (e.Text = "text", e.Email = "email", e.Tel = "tel", e.Password = "password", e.Search = "search", e.Number = "number", e.Color = "color", e.Range = "range", e.Textarea = "textarea", e.Html = "html", e.Date = "date", e.File = "file", e.Image = "image", e.Select = "select", e.Check = "check", e.Switch = "switch", e.Calc = "calc", e.Card = "card", e.Elements = "elements", e))(ne || {}), le = ((e) => (e.Auto = "auto", e.Always = "always", e.Lazy = "lazy", e.Ever = "ever", e))(le || {}), ae = ((e) => (e.Transform = "transform", e.Height = "height", e.Display = "display", e))(ae || {}), oe = ((e) => (e.Href = "href", e.RouterLink = "router-link", e.RouterLinkBack = "router-link-back", e.Mail = "mail", e.Tel = "tel", e.Tab = "tab", e.Download = "download", e.Action = "action", e.Legacy = "", e))(oe || {}), ie = ((e) => (e.None = "", e.Field = "field", e.Button = "button", e.Anchor = "anchor", e))(ie || {}), se = ((e) => (e.List = "list", e.Inline = "inline", e.Count = "count", e))(se || {}), ue = ((e) => (e.None = "", e.Focus = "focus", e.Blur = "blur", e.Always = "always", e))(ue || {}), ce = ((e) => (e.MinStringLength = "min-str", e.MinNumber = "min-num", e.MaxStringLength = "max-str", e.MaxNumber = "max-num", e.Email = "email", e.Empty = "empty", e.EqualTo = "equal-to", e.MinNumbers = "min-numbers", e.MaxNumbers = "max-numbers", e.MinChars = "min-chars", e.MaxChars = "max-chars", e.MinUpperChars = "min-upper-chars", e.MaxUpperChars = "max-upper-chars", e.MinLowerChars = "min-lower-chars", e.MaxLowerChars = "max-lower-chars", e.MinSpecialChars = "min-special-chars", e.MaxSpecialChars = "max-special-chars", e))(ce || {}), de = ((e) => (e.Ok = "ok", e.Ko = "ko", e.Info = "info", e))(de || {}), ve = ((e) => (e.Create = "create", e.Update = "update", e.Read = "read", e))(ve || {}), me = ((e) => (e.Inline = "inline", e.Modal = "modal", e))(me || {}), he = ((e) => (e.Top = "top", e.Bottom = "bottom", e))(he || {}), pe = ((e) => (e.Changed = "changed", e.Always = "always", e.Never = "never", e))(pe || {}), fe = ((e) => (e.Manual = "manual", e.Auto = "auto", e.Delay = "delay", e))(fe || {}), ke = ((e) => (e.Toast = "toast", e.Inline = "inline", e))(ke || {}), ye = ((e) => (e.Pages = "pages", e.PrevNext = "prev-next", e.PagesPrevNext = "pages-prev-next", e.PagesPrevNextFirstLast = "pages-prev-next-first-last", e.LoadMore = "load-more", e.Infinite = "infinite", e))(ye || {}), ge = ((e) => (e.Table = "table", e.Item = "item", e.Ul = "ul", e.Ol = "ol", e))(ge || {}), Ce = ((e) => (e[e.Auto = 0] = "Auto", e[e.PreferItem = 1] = "PreferItem", e[e.PreferCustomItem = 2] = "PreferCustomItem", e[e.PreferColumns = 3] = "PreferColumns", e))(Ce || {}), be = ((e) => (e.NotDefined = "", e.ActionIcon = "action-icon", e))(be || {}), _e = ((e) => (e.Message = "message", e.Button = "button", e))(_e || {}), Se = ((e) => (e.Left = "left", e.Center = "center", e.Right = "right", e))(Se || {}), xe = ((e) => (e.Fixed = "fixed", e.Absolute = "absolute", e))(xe || {}), Ae = ((e) => (e.Top = "top", e.Bottom = "bottom", e.Center = "center", e.ReferrerCenter = "referrer-center", e))(Ae || {}), Me = ((e) => (e.Left = "left", e.Right = "right", e.Center = "center", e.LeftCorner = "left-corner", e.RightCorner = "right-corner", e))(Me || {}), we = ((e) => (e.Refresh = "refresh", e.Close = "close", e.ReOpen = "reOpen", e.Exec = "exec", e.Open = "open", e))(we || {}), Ie = ((e) => (e.Modal = "modal", e.Confirm = "confirm", e))(Ie || {}), Ee = ((e) => (e.None = "", e.Incremental = "incremental", e.Decremental = "decremental", e))(Ee || {}), Le = ((e) => (e.NotDefined = "", e.Hidden = "hidden", e.Integer = "integer", e.Decimal = "decimal", e.Auto = "auto", e))(Le || {}), Ne = ((e) => (e.Asc = "asc", e.Desc = "desc", e))(Ne || {}), Oe = ((e) => (e.Create = "create", e.Update = "update", e.Edit = "edit", e.Drop = "drop", e.Sort = "sort", e.SwitchEditMode = "switch-edit-mode", e.InlineEdit = "inline-edit", e.InlineCreate = "inline-create", e.ModalCreate = "modal-create", e.InlineCreateEver = "inline-create-ever", e))(Oe || {}), Ve = ((e) => (e.Lazy = "lazy", e.Ever = "ever", e))(Ve || {}), De = (e) => {
-  let r = String(e);
-  return r.startsWith("__:") ? Z(r.substring(3)) : r;
-};
-const Re = { class: "lkt-menu-entry-main" }, Te = { class: "lkt-entry-content" }, Pe = {
+I.toggleSlot = "", I.debugEnabled = !1;
+let y = I;
+const re = { class: "lkt-menu-entry-main" }, ae = { class: "lkt-entry-content" }, se = {
   key: 0,
   class: "lkt-menu-entry-icon"
-}, ze = {
+}, ie = {
   key: 1,
   class: "lkt-menu-entry-text"
-}, Be = {
+}, ce = {
   key: 0,
   class: "lkt-menu-entry-children"
-}, Ue = /* @__PURE__ */ B({
+}, de = /* @__PURE__ */ K({
   __name: "MenuItem",
   props: {
-    modelValue: { default: () => new H("", "", "") }
+    modelValue: { default: () => new z() }
   },
-  emits: ["update:modelValue"],
-  setup(e, { emit: r }) {
-    const a = r, s = e, t = O(s.modelValue), u = U(), f = Y(), h = O(!1), g = () => {
-      t.value.isOpened = !t.value.isOpened;
-    }, I = () => (t.value.children.length > 0 && g(), typeof t.value.onClick == "function" && t.value.onClick({
-      entry: t.value
-    }), 1), C = c(() => u["icon-" + t.value.key] || t.value.icon !== ""), E = c(() => {
-      let l = [];
-      return C.value && l.push("has-icon"), h.value && l.push("is-active"), l.join(" ");
-    }), o = c(() => T([], t.value.children)), n = c(() => {
-      let l = [];
-      for (let v in u)
-        v.startsWith("icon-") && o.value.includes(v.substring(5)) && l.push(v);
-      return l;
-    }), m = c(() => De(t.value.label)), b = c(() => t.value.isActive ? !0 : typeof t.value.isActiveChecker == "function" ? !!t.value.isActiveChecker({
-      entry: t.value
-    }) : !1), p = c(() => !!y.toggleSlot), j = c(() => y.toggleSlot);
-    return x(() => s.modelValue, (l) => {
-      t.value = l;
-    }, { deep: !0 }), x(t, (l) => {
-      a("update:modelValue", l);
-    }, { deep: !0 }), J(() => {
-      let l = f == null ? void 0 : f.currentRoute;
-      if (l) {
-        if (l.value.path === t.value.href)
-          t.value.isOpened = !0;
-        else if (t.value.children.length > 0) {
-          let v = !1;
-          t.value.children.forEach((L) => {
-            l.value.path === L.href && (v = !0);
-          }), v && (t.value.isOpened = !0);
+  emits: [
+    "update:modelValue"
+  ],
+  setup(u, { emit: m }) {
+    const o = m, d = u, e = R(d.modelValue), s = T(), k = ne(), p = R(!1), g = () => {
+      e.value.isOpened = !e.value.isOpened;
+    }, N = () => {
+      var t, a;
+      return ((t = e.value.children) == null ? void 0 : t.length) > 0 && g(), typeof ((a = e.value.events) == null ? void 0 : a.click) == "function" ? (e.value.events.click({
+        entry: e.value
+      }), 1) : (typeof e.value.onClick == "function" && e.value.onClick({
+        entry: e.value
+      }), 1);
+    }, _ = i(() => s["icon-" + e.value.key] || e.value.icon !== ""), $ = i(() => {
+      let t = [];
+      return _.value && t.push("has-icon"), p.value && t.push("is-active"), t.join(" ");
+    }), n = i(() => U([], e.value.children)), l = i(() => {
+      let t = [];
+      for (let a in s)
+        a.startsWith("icon-") && n.value.includes(a.substring(5)) && t.push(a);
+      return t;
+    }), v = i(() => ee(e.value.label)), V = i(() => e.value.isActive ? !0 : typeof e.value.isActiveChecker == "function" ? !!e.value.isActiveChecker({
+      entry: e.value
+    }) : !1), f = i(() => !!y.toggleSlot), q = i(() => y.toggleSlot);
+    return M(() => d.modelValue, (t) => {
+      e.value = t;
+    }, { deep: !0 }), M(e, (t) => {
+      o("update:modelValue", t);
+    }, { deep: !0 }), G(() => {
+      var a, C;
+      let t = k == null ? void 0 : k.currentRoute;
+      if (t) {
+        if (t.value.path === e.value.href)
+          e.value.isOpened = !0;
+        else if (((a = e.value.children) == null ? void 0 : a.length) > 0) {
+          let S = !1;
+          (C = e.value.children) == null || C.forEach((O) => {
+            t.value.path === O.href && (S = !0);
+          }), S && (e.value.isOpened = !0);
         }
       }
-    }), (l, v) => {
-      const L = z("lkt-anchor"), K = z("menu-item", !0);
-      return i(), d("div", {
-        class: S(["lkt-menu-entry", E.value])
+    }), (t, a) => {
+      var O;
+      const C = J("lkt-anchor"), S = J("menu-item", !0);
+      return r(), c("div", {
+        class: D(["lkt-menu-entry", $.value])
       }, [
-        A("div", Re, [
-          W(L, {
-            to: t.value.href,
-            "on-click": I,
-            "is-active": b.value,
-            onActive: v[0] || (v[0] = (P) => h.value = P)
+        A("div", re, [
+          H(C, {
+            to: e.value.href,
+            "on-click": N,
+            "is-active": V.value,
+            onActive: a[0] || (a[0] = (B) => p.value = B)
           }, {
-            default: V(() => [
-              A("div", Te, [
-                C.value ? (i(), d("div", Pe, [
-                  q(u)["icon-" + t.value.key] ? D(l.$slots, "icon-" + t.value.key, {
-                    key: t.value.key,
-                    entry: t.value
-                  }) : t.value.icon !== "" ? (i(), d("i", {
+            default: j(() => [
+              A("div", ae, [
+                _.value ? (r(), c("div", se, [
+                  P(s)["icon-" + e.value.key] ? x(t.$slots, "icon-" + e.value.key, {
+                    key: e.value.key,
+                    entry: e.value
+                  }) : e.value.icon !== "" ? (r(), c("i", {
                     key: 1,
-                    class: S(t.value.icon)
-                  }, null, 2)) : k("", !0)
-                ])) : k("", !0),
-                t.value.label !== "" ? (i(), d("div", ze, G(m.value), 1)) : k("", !0)
+                    class: D(e.value.icon)
+                  }, null, 2)) : h("", !0)
+                ])) : h("", !0),
+                e.value.label !== "" ? (r(), c("div", ie, Q(v.value), 1)) : h("", !0)
               ])
             ]),
             _: 3
           }, 8, ["to", "is-active"]),
-          t.value.children.length > 0 ? (i(), d("div", {
+          ((O = e.value.children) == null ? void 0 : O.length) > 0 ? (r(), c("div", {
             key: 0,
             class: "lkt-menu-entry-toggle",
             onClick: g
           }, [
-            p.value ? (i(), R(Q(j.value), {
+            f.value ? (r(), L(X(q.value), {
               key: 0,
-              class: S(["lkt-menu-entry-toggle-inner", t.value.isOpened ? "is-opened" : ""])
-            }, null, 8, ["class"])) : (i(), d("div", {
+              class: D(["lkt-menu-entry-toggle-inner", e.value.isOpened ? "is-opened" : ""])
+            }, null, 8, ["class"])) : (r(), c("div", {
               key: 1,
-              class: S(["lkt-menu-entry-toggle-inner lkt-menu-entry-toggle-triangle", t.value.isOpened ? "is-opened" : ""])
+              class: D(["lkt-menu-entry-toggle-inner lkt-menu-entry-toggle-triangle", e.value.isOpened ? "is-opened" : ""])
             }, null, 2))
-          ])) : k("", !0)
+          ])) : h("", !0)
         ]),
-        t.value.isOpened ? (i(), d("div", Be, [
-          (i(!0), d(F, null, M(t.value.children, (P, N) => (i(), R(K, {
-            modelValue: t.value.children[N],
-            "onUpdate:modelValue": (_) => t.value.children[N] = _,
-            key: t.value.children[N].key
-          }, $({ _: 2 }, [
-            M(n.value, (_) => ({
-              name: _,
-              fn: V(() => [
-                D(l.$slots, _)
+        e.value.isOpened ? (r(), c("div", ce, [
+          (r(!0), c(F, null, E(e.value.children, (B, w) => (r(), L(S, {
+            modelValue: e.value.children[w],
+            "onUpdate:modelValue": (b) => e.value.children[w] = b,
+            key: e.value.children[w].key
+          }, W({ _: 2 }, [
+            E(l.value, (b) => ({
+              name: b,
+              fn: j(() => [
+                x(t.$slots, b)
               ])
             }))
           ]), 1032, ["modelValue", "onUpdate:modelValue"]))), 128))
-        ])) : k("", !0)
+        ])) : h("", !0)
       ], 2);
     };
   }
-}), Fe = { class: "lkt-menu-container" }, $e = { class: "lkt-menu" }, He = /* @__PURE__ */ B({
+}), ve = { class: "lkt-menu-container" }, me = { class: "lkt-menu" }, pe = /* @__PURE__ */ K({
   __name: "LktMenu",
-  props: {
-    modelValue: { default: () => [] },
-    resource: { default: "" },
-    resourceData: { default: () => ({}) }
-  },
-  emits: ["update:modelValue", "click-outside", "loading", "results", "response", "error"],
-  setup(e, { emit: r }) {
-    const a = e, s = r, t = U(), u = O(a.modelValue), f = (o) => {
-      let n = {};
-      typeof o == "object" && Object.keys(o).length > 0 && (n = JSON.parse(JSON.stringify(o)));
-      for (let m in n)
-        (Array.isArray(n[m]) || typeof n[m] == "object") && (n[m] = JSON.stringify(n[m]));
-      return n;
+  props: /* @__PURE__ */ Y({
+    modelValue: {},
+    resource: {},
+    resourceData: {}
+  }, te(le)),
+  emits: [
+    "update:modelValue",
+    "click-outside",
+    "loading",
+    "results",
+    "response",
+    "error"
+  ],
+  setup(u, { emit: m }) {
+    const o = u, d = m, e = T(), s = R(o.modelValue), k = (n) => {
+      let l = {};
+      typeof n == "object" && Object.keys(n).length > 0 && (l = JSON.parse(JSON.stringify(n)));
+      for (let v in l)
+        (Array.isArray(l[v]) || typeof l[v] == "object") && (l[v] = JSON.stringify(l[v]));
+      return l;
     };
-    let h = new ee({});
-    h.increment(f(a.resourceData));
-    const g = c(() => T([], u.value)), I = c(() => {
-      let o = [];
-      for (let n in t)
-        n.startsWith("icon-") && g.value.includes(n.substring(5)) && o.push(n);
-      return o;
-    }), C = () => {
-      if (!a.resource) return;
-      let o = h.getData();
-      s("loading"), te(a.resource, o).then((n) => {
-        h.turnStoredIntoOriginal(), u.value = n.data, s("results", n.data), s("response", n);
-      }).catch((n) => {
-        s("error", n);
+    let p = new ue({});
+    p.increment(k(o.resourceData));
+    const g = i(() => U([], s.value)), N = i(() => {
+      let n = [];
+      for (let l in e)
+        l.startsWith("icon-") && g.value.includes(l.substring(5)) && n.push(l);
+      return n;
+    }), _ = () => {
+      if (!o.resource) return;
+      let n = p.getData();
+      d("loading"), oe(o.resource, n).then((l) => {
+        p.turnStoredIntoOriginal(), s.value = l.data, d("results", l.data), d("response", l);
+      }).catch((l) => {
+        d("error", l);
       });
-    }, E = () => {
-      s("click-outside");
+    }, $ = () => {
+      d("click-outside");
     };
-    return x(() => a.modelValue, (o) => {
-      u.value = o;
-    }, { deep: !0 }), x(u, (o) => {
-      s("update:modelValue", o);
-    }, { deep: !0 }), C(), (o, n) => (i(), d("div", Fe, [
-      A("div", $e, [
-        (i(!0), d(F, null, M(u.value, (m, b) => (i(), R(Ue, {
-          modelValue: u.value[b],
-          "onUpdate:modelValue": (p) => u.value[b] = p,
-          key: m.key
-        }, $({ _: 2 }, [
-          M(I.value, (p) => ({
-            name: p,
-            fn: V(() => [
-              D(o.$slots, p)
+    return M(() => o.modelValue, (n) => {
+      s.value = n;
+    }, { deep: !0 }), M(s, (n) => {
+      d("update:modelValue", n);
+    }, { deep: !0 }), _(), (n, l) => (r(), c("div", ve, [
+      A("div", me, [
+        (r(!0), c(F, null, E(s.value, (v, V) => (r(), L(de, {
+          modelValue: s.value[V],
+          "onUpdate:modelValue": (f) => s.value[V] = f,
+          key: v.key
+        }, W({ _: 2 }, [
+          E(N.value, (f) => ({
+            name: f,
+            fn: j(() => [
+              x(n.$slots, f)
             ])
           }))
         ]), 1032, ["modelValue", "onUpdate:modelValue"]))), 128))
       ]),
       A("div", {
         class: "lkt-menu-outside",
-        onClick: E
+        onClick: $
       })
     ]));
   }
-}), Qe = {
-  install: (e) => {
-    e.component("lkt-menu") === void 0 && e.component("lkt-menu", He);
+}), _e = {
+  install: (u) => {
+    u.component("lkt-menu") === void 0 && u.component("lkt-menu", pe);
   }
-}, Xe = (e, r, a) => X(new H(e, r, a)), Ye = (e) => (y.toggleSlot = e, !0);
+}, Ve = (u, m, o) => Z(new z({
+  key: u,
+  href: m,
+  label: o
+})), Ce = (u) => (y.toggleSlot = u, !0);
 export {
-  H as MenuEntry,
-  Xe as createMenuEntry,
-  Qe as default,
-  Ye as setMenuToggleSlot
+  be as MenuEntry,
+  Ve as createMenuEntry,
+  _e as default,
+  Ce as setMenuToggleSlot
 };

package/dist/components/MenuItem.vue.d.ts

@@ -1,19 +1,49 @@
-import { MenuEntry } from '../classes/MenuEntry';
-import { LktObject } from 'lkt-ts-interfaces';
+import { LktObject, MenuEntry } from 'lkt-vue-kernel';
 type __VLS_Props = {
     modelValue?: MenuEntry;
 };
 declare const entry: import("vue").Ref<{
-    key: string;
-    href: string;
-    label: string;
-    icon: string;
-    onClick: Function | undefined;
-    isActiveChecker: Function | undefined;
-    isOpened: boolean;
-    isActive: boolean;
-    parent: /*elided*/ any | undefined;
-    children: /*elided*/ any[];
+    key?: string | undefined;
+    href?: string | undefined;
+    label?: string | undefined;
+    icon?: string | undefined;
+    isActiveChecker?: Function | undefined;
+    isOpened?: boolean | undefined;
+    isActive?: boolean | undefined;
+    parent?: {
+        key?: string | undefined;
+        href?: string | undefined;
+        label?: string | undefined;
+        icon?: string | undefined;
+        isActiveChecker?: Function | undefined;
+        isOpened?: boolean | undefined;
+        isActive?: boolean | undefined;
+        parent?: /*elided*/ any | undefined;
+        children?: /*elided*/ any[] | undefined;
+        events?: {
+            click?: Function | undefined;
+        } | undefined;
+        onClick?: Function | undefined;
+    } | undefined;
+    children?: {
+        key?: string | undefined;
+        href?: string | undefined;
+        label?: string | undefined;
+        icon?: string | undefined;
+        isActiveChecker?: Function | undefined;
+        isOpened?: boolean | undefined;
+        isActive?: boolean | undefined;
+        parent?: /*elided*/ any | undefined;
+        children?: /*elided*/ any[] | undefined;
+        events?: {
+            click?: Function | undefined;
+        } | undefined;
+        onClick?: Function | undefined;
+    }[] | undefined;
+    events?: {
+        click?: Function | undefined;
+    } | undefined;
+    onClick?: Function | undefined;
     setChildren: (children: MenuEntry[]) => MenuEntry;
     setOnClick: (fn: Function) => MenuEntry;
     setIsActiveChecker: (fn: Function) => MenuEntry;
@@ -21,17 +51,50 @@ declare const entry: import("vue").Ref<{
     setLabel: (str: string) => MenuEntry;
     setIcon: (str: string) => MenuEntry;
     doClose: () => void;
+    feed: (data?: LktObject, target?: MenuEntry | undefined) => void;
+    assignProp: (key: string, value: any) => void;
 }, MenuEntry | {
-    key: string;
-    href: string;
-    label: string;
-    icon: string;
-    onClick: Function | undefined;
-    isActiveChecker: Function | undefined;
-    isOpened: boolean;
-    isActive: boolean;
-    parent: /*elided*/ any | undefined;
-    children: /*elided*/ any[];
+    key?: string | undefined;
+    href?: string | undefined;
+    label?: string | undefined;
+    icon?: string | undefined;
+    isActiveChecker?: Function | undefined;
+    isOpened?: boolean | undefined;
+    isActive?: boolean | undefined;
+    parent?: {
+        key?: string | undefined;
+        href?: string | undefined;
+        label?: string | undefined;
+        icon?: string | undefined;
+        isActiveChecker?: Function | undefined;
+        isOpened?: boolean | undefined;
+        isActive?: boolean | undefined;
+        parent?: /*elided*/ any | undefined;
+        children?: /*elided*/ any[] | undefined;
+        events?: {
+            click?: Function | undefined;
+        } | undefined;
+        onClick?: Function | undefined;
+    } | undefined;
+    children?: {
+        key?: string | undefined;
+        href?: string | undefined;
+        label?: string | undefined;
+        icon?: string | undefined;
+        isActiveChecker?: Function | undefined;
+        isOpened?: boolean | undefined;
+        isActive?: boolean | undefined;
+        parent?: /*elided*/ any | undefined;
+        children?: /*elided*/ any[] | undefined;
+        events?: {
+            click?: Function | undefined;
+        } | undefined;
+        onClick?: Function | undefined;
+    }[] | undefined;
+    events?: {
+        click?: Function | undefined;
+    } | undefined;
+    onClick?: Function | undefined;
     setChildren: (children: MenuEntry[]) => MenuEntry;
     setOnClick: (fn: Function) => MenuEntry;
     setIsActiveChecker: (fn: Function) => MenuEntry;
@@ -39,6 +102,8 @@ declare const entry: import("vue").Ref<{
     setLabel: (str: string) => MenuEntry;
     setIcon: (str: string) => MenuEntry;
     doClose: () => void;
+    feed: (data?: LktObject, target?: MenuEntry | undefined) => void;
+    assignProp: (key: string, value: any) => void;
 }>, slots: Readonly<{
     [name: string]: import("vue").Slot<any> | undefined;
 }>, isActive: import("vue").Ref<boolean, boolean>;
@@ -46,19 +111,50 @@ declare const onClickToggle: () => void, onClick: () => number;
 declare const canRenderIcon: import("vue").ComputedRef<boolean | import("vue").Slot<any>>, classes: import("vue").ComputedRef<string>;
 declare const entryIconSlots: import("vue").ComputedRef<LktObject>, computedLabel: import("vue").ComputedRef<any>, computedIsActive: import("vue").ComputedRef<boolean>, hasToggleSlot: import("vue").ComputedRef<boolean>, toggleSlot: import("vue").ComputedRef<string | import("vue").Component>;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
-declare var __VLS_10: string, __VLS_11: {
-    key: string;
+declare var __VLS_9: string, __VLS_10: {
+    key: string | undefined;
     entry: {
-        key: string;
-        href: string;
-        label: string;
-        icon: string;
-        onClick: Function | undefined;
-        isActiveChecker: Function | undefined;
-        isOpened: boolean;
-        isActive: boolean;
-        parent: /*elided*/ any | undefined;
-        children: /*elided*/ any[];
+        key?: string | undefined;
+        href?: string | undefined;
+        label?: string | undefined;
+        icon?: string | undefined;
+        isActiveChecker?: Function | undefined;
+        isOpened?: boolean | undefined;
+        isActive?: boolean | undefined;
+        parent?: {
+            key?: string | undefined;
+            href?: string | undefined;
+            label?: string | undefined;
+            icon?: string | undefined;
+            isActiveChecker?: Function | undefined;
+            isOpened?: boolean | undefined;
+            isActive?: boolean | undefined;
+            parent?: /*elided*/ any | undefined;
+            children?: /*elided*/ any[] | undefined;
+            events?: {
+                click?: Function | undefined;
+            } | undefined;
+            onClick?: Function | undefined;
+        } | undefined;
+        children?: {
+            key?: string | undefined;
+            href?: string | undefined;
+            label?: string | undefined;
+            icon?: string | undefined;
+            isActiveChecker?: Function | undefined;
+            isOpened?: boolean | undefined;
+            isActive?: boolean | undefined;
+            parent?: /*elided*/ any | undefined;
+            children?: /*elided*/ any[] | undefined;
+            events?: {
+                click?: Function | undefined;
+            } | undefined;
+            onClick?: Function | undefined;
+        }[] | undefined;
+        events?: {
+            click?: Function | undefined;
+        } | undefined;
+        onClick?: Function | undefined;
         setChildren: (children: MenuEntry[]) => MenuEntry;
         setOnClick: (fn: Function) => MenuEntry;
         setIsActiveChecker: (fn: Function) => MenuEntry;
@@ -66,12 +162,14 @@ declare var __VLS_10: string, __VLS_11: {
         setLabel: (str: string) => MenuEntry;
         setIcon: (str: string) => MenuEntry;
         doClose: () => void;
+        feed: (data?: LktObject, target?: MenuEntry | undefined) => void;
+        assignProp: (key: string, value: any) => void;
     };
-}, __VLS_22: any, __VLS_23: {};
+}, __VLS_24: any, __VLS_25: {};
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
-    [K in NonNullable<typeof __VLS_10>]?: (props: typeof __VLS_11) => any;
+    [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
 } & {
-    [K in NonNullable<typeof __VLS_22>]?: (props: typeof __VLS_23) => any;
+    [K in NonNullable<typeof __VLS_24>]?: (props: typeof __VLS_25) => any;
 }>;
 declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
     entry: typeof entry;

package/dist/functions/helpers.d.ts

@@ -1,2 +1,2 @@
-import { MenuEntry } from "../classes/MenuEntry";
+import { MenuEntry } from "lkt-vue-kernel";
 export declare const fetchKeys: (r: string[], entries: MenuEntry[]) => string[];

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { Component, Plugin } from 'vue';
 import "../style.css";
-import { MenuEntry } from "./classes/MenuEntry";
+import { MenuEntry } from "lkt-vue-kernel";
 declare const LktMenu: Plugin;
 export default LktMenu;
 export declare const createMenuEntry: (key: string, href: string, label: string) => MenuEntry;

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

@@ -1,56 +1,42 @@
-import { MenuEntry } from "../classes/MenuEntry";
-import MenuItem from "../components/MenuItem.vue";
-import { LktObject } from "lkt-ts-interfaces";
-type __VLS_Props = {
-    modelValue?: MenuEntry[];
-    resource?: string;
-    resourceData: LktObject;
-};
+import MenuItem from '../components/MenuItem.vue';
+import { LktObject, MenuConfig } from 'lkt-vue-kernel';
 declare const entries: import("vue").Ref<{
-    key: string;
-    href: string;
-    label: string;
-    icon: string;
-    onClick: Function | undefined;
-    isActiveChecker: Function | undefined;
-    isOpened: boolean;
-    isActive: boolean;
-    parent: /*elided*/ any | undefined;
-    children: /*elided*/ any[];
-    setChildren: (children: MenuEntry[]) => MenuEntry;
-    setOnClick: (fn: Function) => MenuEntry;
-    setIsActiveChecker: (fn: Function) => MenuEntry;
-    setIsActive: (enabled?: boolean) => MenuEntry;
-    setLabel: (str: string) => MenuEntry;
-    setIcon: (str: string) => MenuEntry;
-    doClose: () => void;
-}[], MenuEntry[] | {
-    key: string;
-    href: string;
-    label: string;
-    icon: string;
-    onClick: Function | undefined;
-    isActiveChecker: Function | undefined;
-    isOpened: boolean;
-    isActive: boolean;
-    parent: /*elided*/ any | undefined;
-    children: /*elided*/ any[];
-    setChildren: (children: MenuEntry[]) => MenuEntry;
-    setOnClick: (fn: Function) => MenuEntry;
-    setIsActiveChecker: (fn: Function) => MenuEntry;
-    setIsActive: (enabled?: boolean) => MenuEntry;
-    setLabel: (str: string) => MenuEntry;
-    setIcon: (str: string) => MenuEntry;
-    doClose: () => void;
+    key?: string | undefined;
+    href?: string | undefined;
+    label?: string | undefined;
+    icon?: string | undefined;
+    isActiveChecker?: Function | undefined;
+    isOpened?: boolean | undefined;
+    isActive?: boolean | undefined;
+    parent?: /*elided*/ any | undefined;
+    children?: /*elided*/ any[] | undefined;
+    events?: {
+        click?: Function | undefined;
+    } | undefined;
+    onClick?: Function | undefined;
+}[], import("lkt-vue-kernel").MenuEntryConfig[] | {
+    key?: string | undefined;
+    href?: string | undefined;
+    label?: string | undefined;
+    icon?: string | undefined;
+    isActiveChecker?: Function | undefined;
+    isOpened?: boolean | undefined;
+    isActive?: boolean | undefined;
+    parent?: /*elided*/ any | undefined;
+    children?: /*elided*/ any[] | undefined;
+    events?: {
+        click?: Function | undefined;
+    } | undefined;
+    onClick?: Function | undefined;
 }[]>;
 declare const entryIconSlots: import("vue").ComputedRef<LktObject>;
 declare const onClickOutside: () => void;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
-declare var __VLS_5: any, __VLS_6: {};
+declare var __VLS_8: any, __VLS_9: {};
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
-    [K in NonNullable<typeof __VLS_5>]?: (props: typeof __VLS_6) => any;
+    [K in NonNullable<typeof __VLS_8>]?: (props: typeof __VLS_9) => any;
 }>;
-declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
+declare const __VLS_self: import("vue").DefineComponent<MenuConfig, {
     MenuItem: typeof MenuItem;
     entries: typeof entries;
     entryIconSlots: typeof entryIconSlots;
@@ -62,7 +48,7 @@ declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
     "update:modelValue": (...args: any[]) => void;
     "click-outside": (...args: any[]) => void;
     response: (...args: any[]) => void;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<MenuConfig> & Readonly<{
     onError?: ((...args: any[]) => any) | undefined;
     onLoading?: ((...args: any[]) => any) | undefined;
     onResults?: ((...args: any[]) => any) | undefined;
@@ -72,16 +58,16 @@ declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
 }>, {
     resource: string;
     resourceData: LktObject;
-    modelValue: MenuEntry[];
+    modelValue: import("lkt-vue-kernel").MenuEntryConfig[];
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<MenuConfig, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     error: (...args: any[]) => void;
     loading: (...args: any[]) => void;
     results: (...args: any[]) => void;
     "update:modelValue": (...args: any[]) => void;
     "click-outside": (...args: any[]) => void;
     response: (...args: any[]) => void;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<MenuConfig> & Readonly<{
     onError?: ((...args: any[]) => any) | undefined;
     onLoading?: ((...args: any[]) => any) | undefined;
     onResults?: ((...args: any[]) => any) | undefined;
@@ -91,7 +77,7 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
 }>, {
     resource: string;
     resourceData: LktObject;
-    modelValue: MenuEntry[];
+    modelValue: import("lkt-vue-kernel").MenuEntryConfig[];
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lkt-menu",
-  "version": "1.2.0",
+  "version": "1.4.1",
   "description": "",
   "keywords": [
     "lkt",
@@ -50,11 +50,11 @@
     "vue-tsc": "^2.2.0"
   },
   "peerDependencies": {
-    "lkt-anchor": "^1.1.4",
-    "lkt-data-state": "^1.0.10",
-    "lkt-http-client": "^1.0.31",
-    "lkt-i18n": "^1.0.4",
-    "lkt-vue-kernel": "^1.0.0",
+    "lkt-anchor": "^1.2.4",
+    "lkt-data-state": "^1.0.11",
+    "lkt-http-client": "^1.0.34",
+    "lkt-i18n": "^1.0.6",
+    "lkt-vue-kernel": "1.0.44",
     "vue": "^3.3.0",
     "vue-router": "^4.3.3"
   }

package/src/components/MenuItem.vue

@@ -1,18 +1,18 @@
 <script setup lang="ts">
-  import { MenuEntry } from '../classes/MenuEntry';
+  import { extractI18nValue, LktObject, MenuEntry } from 'lkt-vue-kernel';
   import { computed, onMounted, ref, useSlots, watch } from 'vue';
-  import { LktObject } from 'lkt-ts-interfaces';
   import { fetchKeys } from '../functions/helpers';
   import { useRouter } from 'vue-router';
   import { Settings } from '../settings/Settings';
-  import { extractI18nValue } from 'lkt-vue-kernel';
 
-  const emit = defineEmits(['update:modelValue']);
+  const emit = defineEmits([
+    'update:modelValue'
+  ]);
 
 const props = withDefaults(defineProps<{
     modelValue?: MenuEntry
 }>(), {
-    modelValue: () => (new MenuEntry('', '', ''))
+    modelValue: () => (new MenuEntry())
 });
 
 const entry = ref(props.modelValue),
@@ -24,7 +24,15 @@ const onClickToggle = () => {
         entry.value.isOpened = !entry.value.isOpened;
     },
     onClick = () => {
-        if (entry.value.children.length > 0) onClickToggle();
+        if (entry.value.children?.length > 0) onClickToggle();
+
+        if (typeof entry.value.events?.click === 'function') {
+          entry.value.events.click({
+            entry: entry.value
+          });
+          return 1;
+        }
+
         if (typeof entry.value.onClick === 'function') {
             entry.value.onClick({
                 entry: entry.value
@@ -95,9 +103,9 @@ onMounted(() => {
       if (currentRoute.value.path === entry.value.href) {
           entry.value.isOpened = true;
 
-      } else if (entry.value.children.length > 0) {
+      } else if (entry.value.children?.length > 0) {
           let opened = false;
-          entry.value.children.forEach((child) => {
+          entry.value.children?.forEach((child) => {
               if (currentRoute.value.path === child.href) opened = true;
           });
 
@@ -133,7 +141,7 @@ onMounted(() => {
                 </div>
             </lkt-anchor>
 
-            <div class="lkt-menu-entry-toggle" v-if="entry.children.length > 0" @click="onClickToggle">
+            <div class="lkt-menu-entry-toggle" v-if="entry.children?.length > 0" @click="onClickToggle">
                 <template v-if="hasToggleSlot">
                     <component :is="toggleSlot" class="lkt-menu-entry-toggle-inner" :class="entry.isOpened ? 'is-opened' : '' "/>
                 </template>

package/src/lib-components/LktMenu.vue

@@ -1,23 +1,21 @@
 <script setup lang="ts">
-import {MenuEntry} from "../classes/MenuEntry";
-import MenuItem from "../components/MenuItem.vue";
-import {computed, ref, useSlots, watch} from "vue";
-import {LktObject} from "lkt-ts-interfaces";
-import {fetchKeys} from "../functions/helpers";
-import {DataState} from "lkt-data-state";
-import {httpCall, HTTPResponse} from "lkt-http-client";
+  import MenuItem from '../components/MenuItem.vue';
+  import { computed, ref, useSlots, watch } from 'vue';
+  import { getDefaultValues, LktObject, Menu, MenuConfig } from 'lkt-vue-kernel';
+  import { fetchKeys } from '../functions/helpers';
+  import { DataState } from 'lkt-data-state';
+  import { httpCall, HTTPResponse } from 'lkt-http-client';
 
-const props = withDefaults(defineProps<{
-    modelValue?: MenuEntry[]
-    resource?: string
-    resourceData: LktObject
-}>(), {
-    modelValue: () => [],
-    resource: '',
-    resourceData: () => ({}),
-});
+  const props = withDefaults(defineProps<MenuConfig>(), getDefaultValues(Menu));
 
-const emit = defineEmits(['update:modelValue', 'click-outside', 'loading', 'results', 'response', 'error']);
+const emit = defineEmits([
+  'update:modelValue',
+  'click-outside',
+  'loading',
+  'results',
+  'response',
+  'error'
+]);
 
 const slots = useSlots();