lkt-menu 1.0.11 → 1.4.0

package/dist/build.d.ts

@@ -1,42 +1,162 @@
-declare class x {
-    constructor(t: any, r: any, i: any);
-    key: any;
-    href: any;
-    label: any;
-    icon: string;
-    isOpened: boolean;
-    isActive: boolean;
-    children: any[];
-    setChildren(t: any): this;
-    setOnClick(t: any): this;
+declare var F: {
+    new (t?: {}): {
+        setChildren(t: any): /*elided*/ any;
+        children: any;
+        setOnClick(t: any): /*elided*/ any;
+        onClick: any;
+        setIsActiveChecker(t: any): /*elided*/ any;
+        isActiveChecker: any;
+        setIsActive(t?: boolean): /*elided*/ any;
+        isActive: boolean | undefined;
+        setLabel(t: any): /*elided*/ any;
+        label: any;
+        setIcon(t: any): /*elided*/ any;
+        icon: any;
+        doClose(): void;
+        isOpened: boolean | undefined;
+        feed(t?: {}, l?: /*elided*/ any): void;
+        assignProp(t: any, l: any): void;
+    };
+};
+declare function dt(e: any, t: any, l: any): {
+    setChildren: (t: any) => {
+        setChildren(t: any): /*elided*/ any;
+        children: any;
+        setOnClick(t: any): /*elided*/ any;
+        onClick: any;
+        setIsActiveChecker(t: any): /*elided*/ any;
+        isActiveChecker: any;
+        setIsActive(t?: boolean): /*elided*/ any;
+        isActive: boolean | undefined;
+        setLabel(t: any): /*elided*/ any;
+        label: any;
+        setIcon(t: any): /*elided*/ any;
+        icon: any;
+        doClose(): void;
+        isOpened: boolean | undefined;
+        feed(t?: {}, l?: /*elided*/ any): void;
+        assignProp(t: any, l: any): void;
+    };
+    children: any;
+    setOnClick: (t: any) => {
+        setChildren(t: any): /*elided*/ any;
+        children: any;
+        setOnClick(t: any): /*elided*/ any;
+        onClick: any;
+        setIsActiveChecker(t: any): /*elided*/ any;
+        isActiveChecker: any;
+        setIsActive(t?: boolean): /*elided*/ any;
+        isActive: boolean | undefined;
+        setLabel(t: any): /*elided*/ any;
+        label: any;
+        setIcon(t: any): /*elided*/ any;
+        icon: any;
+        doClose(): void;
+        isOpened: boolean | undefined;
+        feed(t?: {}, l?: /*elided*/ any): void;
+        assignProp(t: any, l: any): void;
+    };
     onClick: any;
-    setIsActiveChecker(t: any): this;
+    setIsActiveChecker: (t: any) => {
+        setChildren(t: any): /*elided*/ any;
+        children: any;
+        setOnClick(t: any): /*elided*/ any;
+        onClick: any;
+        setIsActiveChecker(t: any): /*elided*/ any;
+        isActiveChecker: any;
+        setIsActive(t?: boolean): /*elided*/ any;
+        isActive: boolean | undefined;
+        setLabel(t: any): /*elided*/ any;
+        label: any;
+        setIcon(t: any): /*elided*/ any;
+        icon: any;
+        doClose(): void;
+        isOpened: boolean | undefined;
+        feed(t?: {}, l?: /*elided*/ any): void;
+        assignProp(t: any, l: any): void;
+    };
     isActiveChecker: any;
-    setIsActive(t?: boolean): this;
-    setLabel(t: any): this;
-    setIcon(t: any): this;
-    doClose(): void;
-}
-declare function ke(o: any, t: any, r: any): {
-    key: any;
-    href: any;
+    setIsActive: (t?: boolean) => {
+        setChildren(t: any): /*elided*/ any;
+        children: any;
+        setOnClick(t: any): /*elided*/ any;
+        onClick: any;
+        setIsActiveChecker(t: any): /*elided*/ any;
+        isActiveChecker: any;
+        setIsActive(t?: boolean): /*elided*/ any;
+        isActive: boolean | undefined;
+        setLabel(t: any): /*elided*/ any;
+        label: any;
+        setIcon(t: any): /*elided*/ any;
+        icon: any;
+        doClose(): void;
+        isOpened: boolean | undefined;
+        feed(t?: {}, l?: /*elided*/ any): void;
+        assignProp(t: any, l: any): void;
+    };
+    isActive: boolean | undefined;
+    setLabel: (t: any) => {
+        setChildren(t: any): /*elided*/ any;
+        children: any;
+        setOnClick(t: any): /*elided*/ any;
+        onClick: any;
+        setIsActiveChecker(t: any): /*elided*/ any;
+        isActiveChecker: any;
+        setIsActive(t?: boolean): /*elided*/ any;
+        isActive: boolean | undefined;
+        setLabel(t: any): /*elided*/ any;
+        label: any;
+        setIcon(t: any): /*elided*/ any;
+        icon: any;
+        doClose(): void;
+        isOpened: boolean | undefined;
+        feed(t?: {}, l?: /*elided*/ any): void;
+        assignProp(t: any, l: any): void;
+    };
     label: any;
-    icon: string;
-    isOpened: boolean;
-    isActive: boolean;
-    children: any[];
-    setChildren: (t: any) => x;
-    setOnClick: (t: any) => x;
-    onClick: any;
-    setIsActiveChecker: (t: any) => x;
-    isActiveChecker: any;
-    setIsActive: (t?: boolean) => x;
-    setLabel: (t: any) => x;
-    setIcon: (t: any) => x;
+    setIcon: (t: any) => {
+        setChildren(t: any): /*elided*/ any;
+        children: any;
+        setOnClick(t: any): /*elided*/ any;
+        onClick: any;
+        setIsActiveChecker(t: any): /*elided*/ any;
+        isActiveChecker: any;
+        setIsActive(t?: boolean): /*elided*/ any;
+        isActive: boolean | undefined;
+        setLabel(t: any): /*elided*/ any;
+        label: any;
+        setIcon(t: any): /*elided*/ any;
+        icon: any;
+        doClose(): void;
+        isOpened: boolean | undefined;
+        feed(t?: {}, l?: /*elided*/ any): void;
+        assignProp(t: any, l: any): void;
+    };
+    icon: any;
     doClose: () => void;
+    isOpened: boolean | undefined;
+    feed: (t?: {}, l?: {
+        setChildren(t: any): /*elided*/ any;
+        children: any;
+        setOnClick(t: any): /*elided*/ any;
+        onClick: any;
+        setIsActiveChecker(t: any): /*elided*/ any;
+        isActiveChecker: any;
+        setIsActive(t?: boolean): /*elided*/ any;
+        isActive: boolean | undefined;
+        setLabel(t: any): /*elided*/ any;
+        label: any;
+        setIcon(t: any): /*elided*/ any;
+        icon: any;
+        doClose(): void;
+        isOpened: boolean | undefined;
+        feed(t?: {}, l?: /*elided*/ any): void;
+        assignProp(t: any, l: any): void;
+    }) => void;
+    assignProp: (t: any, l: any) => void;
 };
-declare namespace fe {
-    function install(o: any): void;
+declare namespace ct {
+    function install(e: any): void;
 }
-declare function ye(o: any): boolean;
-export { x as MenuEntry, ke as createMenuEntry, fe as default, ye as setMenuToggleSlot };
+declare function vt(e: any): boolean;
+export { F as MenuEntry, dt as createMenuEntry, ct as default, vt as setMenuToggleSlot };

package/dist/build.js

@@ -1,14 +1,45 @@
-import { defineComponent as J, ref as $, useSlots as K, computed as c, watch as O, onMounted as q, resolveComponent as B, openBlock as u, createElementBlock as d, normalizeClass as b, createElementVNode as S, createVNode as G, withCtx as w, unref as H, renderSlot as L, createCommentVNode as k, toDisplayString as P, createBlock as R, resolveDynamicComponent as Q, Fragment as T, renderList as A, createSlots as W, reactive as X } from "vue";
-import { __ as Y } from "lkt-i18n";
-import { useRouter as Z } from "vue-router";
-import { DataState as ee } from "lkt-data-state";
-import { httpCall as te } from "lkt-http-client";
-class x {
-  constructor(t, r, i) {
-    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 = t, this.href = r, this.label = i;
+var Y = Object.defineProperty;
+var Z = (e, t, l) => t in e ? Y(e, t, { enumerable: !0, configurable: !0, writable: !0, value: l }) : e[t] = l;
+var n = (e, t, l) => Z(e, typeof t != "symbol" ? t + "" : t, l);
+import { defineComponent as J, ref as B, useSlots as W, computed as m, watch as M, onMounted as ee, resolveComponent as K, createElementBlock as h, openBlock as u, normalizeClass as D, createElementVNode as E, createCommentVNode as g, createVNode as te, withCtx as U, renderSlot as z, unref as re, toDisplayString as le, createBlock as j, resolveDynamicComponent as ae, Fragment as q, renderList as I, createSlots as G, mergeDefaults as ne, reactive as oe } from "vue";
+import "lkt-string-tools";
+import { __ as se } from "lkt-i18n";
+import { useRouter as ie } from "vue-router";
+import { DataState as ue } from "lkt-data-state";
+import { httpCall as ce } from "lkt-http-client";
+var de = ((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))(de || {}), ve = ((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))(ve || {}), me = ["lktDateProps", "lktStrictItem", "lktExcludedProps"], d, Q = (d = class {
+  constructor(t) {
+  }
+  feed(t = {}, l = this) {
+    if (typeof t == "object") for (let [s, r] of Object.entries(t)) l.assignProp(s, r);
+  }
+  assignProp(t, l) {
+    if (!(me.includes(t) || d.lktExcludedProps.includes(t))) {
+      if (d.lktDateProps.includes(t)) {
+        this[t] = new Date(l);
+        return;
+      }
+      this[t] = l;
+    }
+  }
+}, n(d, "lktAllowUndefinedProps", []), n(d, "lktExcludedProps", []), n(d, "lktDateProps", []), n(d, "lktStrictItem", !1), n(d, "lktDefaultValues", []), d), he = ((e) => (e.Auto = "auto", e.Always = "always", e.Lazy = "lazy", e.Ever = "ever", e))(he || {}), pe = ((e) => (e.Transform = "transform", e.Height = "height", e.Display = "display", e))(pe || {}), fe = ((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))(fe || {}), ke = ((e) => (e.None = "", e.Field = "field", e.Button = "button", e.Anchor = "anchor", e))(ke || {}), ye = ((e) => (e.List = "list", e.Inline = "inline", e.Count = "count", e))(ye || {}), ge = ((e) => (e.None = "", e.Focus = "focus", e.Blur = "blur", e.Always = "always", e))(ge || {}), 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 || {}), be = ((e) => (e.Ok = "ok", e.Ko = "ko", e.Info = "info", e))(be || {}), xe = ((e) => (e.NotDefined = "", e.Button = "button", e))(xe || {}), Ae = ((e) => (e.Create = "create", e.Update = "update", e.Read = "read", e))(Ae || {}), Se = ((e) => (e.Inline = "inline", e.Modal = "modal", e))(Se || {}), we = ((e) => (e.Top = "top", e.Bottom = "bottom", e))(we || {}), Ve = ((e) => (e.Changed = "changed", e.Always = "always", e.Never = "never", e))(Ve || {}), _e = ((e) => (e.Manual = "manual", e.Auto = "auto", e.Delay = "delay", e))(_e || {}), De = ((e) => (e.Toast = "toast", e.Inline = "inline", e))(De || {}), R, F = (R = class extends Q {
+  constructor(t = {}) {
+    super();
+    n(this, "key", "");
+    n(this, "href", "");
+    n(this, "label", "");
+    n(this, "icon", "");
+    n(this, "isActiveChecker");
+    n(this, "isOpened", !1);
+    n(this, "isActive", !1);
+    n(this, "parent");
+    n(this, "children");
+    n(this, "events", {});
+    n(this, "onClick");
+    this.feed(t);
   }
   setChildren(t) {
-    return t.forEach((r) => r.parent = this), this.children = t, this;
+    return t.forEach((l) => l.parent = this), this.children = t, this;
   }
   setOnClick(t) {
     return this.onClick = t, this;
@@ -28,186 +59,224 @@ class x {
   doClose() {
     this.isOpened = !1;
   }
+}, n(R, "lktDefaultValues", ["key", "href", "label", "icon", "isActiveChecker", "isOpened", "isActive", "parent", "children", "events", "onClick"]), R), T, Me = (T = class extends Q {
+  constructor(t = {}) {
+    var l;
+    super();
+    n(this, "modelValue", []);
+    n(this, "resource", "");
+    n(this, "resourceData", {});
+    this.feed(t), this.modelValue = ((l = this.modelValue) == null ? void 0 : l.map((s) => new F(s))) || [];
+  }
+}, n(T, "lktDefaultValues", ["modelValue", "resource", "resourceData"]), T), Ee = ((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))(Ee || {}), Ie = ((e) => (e.None = "", e.Incremental = "incremental", e.Decremental = "decremental", e))(Ie || {}), Oe = ((e) => (e.NotDefined = "", e.Hidden = "hidden", e.Integer = "integer", e.Decimal = "decimal", e.Auto = "auto", e))(Oe || {}), Le = ((e) => (e.Table = "table", e.Item = "item", e.Ul = "ul", e.Ol = "ol", e))(Le || {}), Ne = ((e) => (e[e.Auto = 0] = "Auto", e[e.PreferItem = 1] = "PreferItem", e[e.PreferCustomItem = 2] = "PreferCustomItem", e[e.PreferColumns = 3] = "PreferColumns", e))(Ne || {}), Pe = ((e) => (e.NotDefined = "", e.ActionIcon = "action-icon", e))(Pe || {}), Re = ((e) => (e.Message = "message", e.Button = "button", e))(Re || {}), Te = ((e) => (e.Left = "left", e.Center = "center", e.Right = "right", e))(Te || {}), Be = ((e) => (e.Fixed = "fixed", e.Absolute = "absolute", e))(Be || {}), Ue = ((e) => (e.Top = "top", e.Bottom = "bottom", e.Center = "center", e.ReferrerCenter = "referrer-center", e))(Ue || {}), ze = ((e) => (e.Left = "left", e.Right = "right", e.Center = "center", e.LeftCorner = "left-corner", e.RightCorner = "right-corner", e))(ze || {}), je = ((e) => (e.Refresh = "refresh", e.Close = "close", e.ReOpen = "reOpen", e.Exec = "exec", e.Open = "open", e))(je || {}), Fe = ((e) => (e.Modal = "modal", e.Confirm = "confirm", e))(Fe || {}), $e = ((e) => (e.Asc = "asc", e.Desc = "desc", e))($e || {}), He = ((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))(He || {}), Ke = ((e) => (e.Lazy = "lazy", e.Ever = "ever", e))(Ke || {}), Je = (e) => {
+  let t = String(e);
+  return t.startsWith("__:") ? se(t.substring(3)) : t;
+};
+function We(e) {
+  let t = new e(), l = {};
+  if (!Array.isArray(e.lktDefaultValues)) throw new Error("lktDefaultValues must be a keys array.");
+  for (let s of e.lktDefaultValues) s in t && (l[s] = t[s]);
+  return l;
 }
-const j = (o, t) => (t.forEach((r) => {
-  o.includes(r.key) || o.push(r.key), r.children.length > 0 && j(o, r.children);
-}), o), I = class I {
+const $ = (e, t) => (t.forEach((l) => {
+  e.includes(l.key) || e.push(l.key), l.children.length > 0 && $(e, l.children);
+}), e), O = class O {
 };
-I.toggleSlot = "", I.debugEnabled = !1;
-let y = I;
-const le = { class: "lkt-menu-entry-main" }, ne = { class: "lkt-entry-content" }, re = {
+O.toggleSlot = "", O.debugEnabled = !1;
+let C = O;
+const qe = { class: "lkt-menu-entry-main" }, Ge = { class: "lkt-entry-content" }, Qe = {
   key: 0,
   class: "lkt-menu-entry-icon"
-}, se = {
+}, Xe = {
   key: 1,
   class: "lkt-menu-entry-text"
-}, oe = {
+}, Ye = {
   key: 0,
   class: "lkt-menu-entry-children"
-}, ue = /* @__PURE__ */ J({
+}, Ze = /* @__PURE__ */ J({
   __name: "MenuItem",
   props: {
-    modelValue: { default: () => new x("", "", "") }
+    modelValue: { default: () => new F() }
   },
-  emits: ["update:modelValue"],
-  setup(o, { emit: t }) {
-    const r = t, i = o, e = $(i.modelValue), a = K(), f = Z(), m = $(!1), g = () => {
-      e.value.isOpened = !e.value.isOpened;
-    }, E = () => (e.value.children.length > 0 && g(), typeof e.value.onClick == "function" && e.value.onClick({
-      entry: e.value
-    }), 1), _ = c(() => a["icon-" + e.value.key] || e.value.icon !== ""), D = c(() => {
-      let n = [];
-      return _.value && n.push("has-icon"), m.value && n.push("is-active"), n.join(" ");
-    }), s = c(() => j([], e.value.children)), l = c(() => {
-      let n = [];
-      for (let v in a)
-        v.startsWith("icon-") && s.value.includes(v.substring(5)) && n.push(v);
-      return n;
-    }), h = c(() => e.value.label.startsWith("__:") ? Y(e.value.label.substring(3)) : e.value.label), C = c(() => e.value.isActive ? !0 : typeof e.value.isActiveChecker == "function" ? !!e.value.isActiveChecker({
-      entry: e.value
-    }) : !1), p = c(() => !!y.toggleSlot), F = c(() => y.toggleSlot);
-    return O(() => i.modelValue, (n) => {
-      e.value = n;
-    }, { deep: !0 }), O(e, (n) => {
-      r("update:modelValue", n);
-    }, { deep: !0 }), q(() => {
-      let n = f == null ? void 0 : f.currentRoute;
-      if (n) {
-        if (n.value.path === e.value.href)
-          e.value.isOpened = !0;
-        else if (e.value.children.length > 0) {
-          let v = !1;
-          e.value.children.forEach((M) => {
-            n.value.path === M.href && (v = !0);
-          }), v && (e.value.isOpened = !0);
+  emits: [
+    "update:modelValue"
+  ],
+  setup(e, { emit: t }) {
+    const l = t, s = e, r = B(s.modelValue), v = W(), y = ie(), f = B(!1), b = () => {
+      r.value.isOpened = !r.value.isOpened;
+    }, L = () => {
+      var a, c;
+      return ((a = r.value.children) == null ? void 0 : a.length) > 0 && b(), typeof ((c = r.value.events) == null ? void 0 : c.click) == "function" ? (r.value.events.click({
+        entry: r.value
+      }), 1) : (typeof r.value.onClick == "function" && r.value.onClick({
+        entry: r.value
+      }), 1);
+    }, x = m(() => v["icon-" + r.value.key] || r.value.icon !== ""), N = m(() => {
+      let a = [];
+      return x.value && a.push("has-icon"), f.value && a.push("is-active"), a.join(" ");
+    }), i = m(() => $([], r.value.children)), o = m(() => {
+      let a = [];
+      for (let c in v)
+        c.startsWith("icon-") && i.value.includes(c.substring(5)) && a.push(c);
+      return a;
+    }), p = m(() => Je(r.value.label)), A = m(() => r.value.isActive ? !0 : typeof r.value.isActiveChecker == "function" ? !!r.value.isActiveChecker({
+      entry: r.value
+    }) : !1), k = m(() => !!C.toggleSlot), X = m(() => C.toggleSlot);
+    return M(() => s.modelValue, (a) => {
+      r.value = a;
+    }, { deep: !0 }), M(r, (a) => {
+      l("update:modelValue", a);
+    }, { deep: !0 }), ee(() => {
+      var c, S;
+      let a = y == null ? void 0 : y.currentRoute;
+      if (a) {
+        if (a.value.path === r.value.href)
+          r.value.isOpened = !0;
+        else if (((c = r.value.children) == null ? void 0 : c.length) > 0) {
+          let w = !1;
+          (S = r.value.children) == null || S.forEach((V) => {
+            a.value.path === V.href && (w = !0);
+          }), w && (r.value.isOpened = !0);
         }
       }
-    }), (n, v) => {
-      const M = B("lkt-anchor"), z = B("menu-item", !0);
-      return u(), d("div", {
-        class: b(["lkt-menu-entry", D.value])
+    }), (a, c) => {
+      var V;
+      const S = K("lkt-anchor"), w = K("menu-item", !0);
+      return u(), h("div", {
+        class: D(["lkt-menu-entry", N.value])
       }, [
-        S("div", le, [
-          G(M, {
-            to: e.value.href,
-            "on-click": E,
-            "is-active": C.value,
-            onActive: v[0] || (v[0] = (U) => m.value = U)
+        E("div", qe, [
+          te(S, {
+            to: r.value.href,
+            "on-click": L,
+            "is-active": A.value,
+            onActive: c[0] || (c[0] = (H) => f.value = H)
           }, {
-            default: w(() => [
-              S("div", ne, [
-                _.value ? (u(), d("div", re, [
-                  H(a)["icon-" + e.value.key] ? L(n.$slots, "icon-" + e.value.key, {
-                    key: e.value.key,
-                    entry: e.value
-                  }) : e.value.icon !== "" ? (u(), d("i", {
+            default: U(() => [
+              E("div", Ge, [
+                x.value ? (u(), h("div", Qe, [
+                  re(v)["icon-" + r.value.key] ? z(a.$slots, "icon-" + r.value.key, {
+                    key: r.value.key,
+                    entry: r.value
+                  }) : r.value.icon !== "" ? (u(), h("i", {
                     key: 1,
-                    class: b(e.value.icon)
-                  }, null, 2)) : k("", !0)
-                ])) : k("", !0),
-                e.value.label !== "" ? (u(), d("div", se, P(h.value), 1)) : k("", !0)
+                    class: D(r.value.icon)
+                  }, null, 2)) : g("", !0)
+                ])) : g("", !0),
+                r.value.label !== "" ? (u(), h("div", Xe, le(p.value), 1)) : g("", !0)
               ])
             ]),
             _: 3
           }, 8, ["to", "is-active"]),
-          e.value.children.length > 0 ? (u(), d("div", {
+          ((V = r.value.children) == null ? void 0 : V.length) > 0 ? (u(), h("div", {
             key: 0,
             class: "lkt-menu-entry-toggle",
-            onClick: g
+            onClick: b
           }, [
-            p.value ? (u(), R(Q(F.value), {
+            k.value ? (u(), j(ae(X.value), {
               key: 0,
-              class: b(["lkt-menu-entry-toggle-inner", e.value.isOpened ? "is-opened" : ""])
-            }, null, 8, ["class"])) : (u(), d("div", {
+              class: D(["lkt-menu-entry-toggle-inner", r.value.isOpened ? "is-opened" : ""])
+            }, null, 8, ["class"])) : (u(), h("div", {
               key: 1,
-              class: b(["lkt-menu-entry-toggle-inner lkt-menu-entry-toggle-triangle", e.value.isOpened ? "is-opened" : ""])
+              class: D(["lkt-menu-entry-toggle-inner lkt-menu-entry-toggle-triangle", r.value.isOpened ? "is-opened" : ""])
             }, null, 2))
-          ])) : k("", !0)
+          ])) : g("", !0)
         ]),
-        e.value.isOpened ? (u(), d("div", oe, [
-          (u(!0), d(T, null, A(e.value.children, (U, N) => (u(), R(z, {
-            modelValue: e.value.children[N],
-            "onUpdate:modelValue": (V) => e.value.children[N] = V,
-            key: e.value.children[N].key
-          }, W({ _: 2 }, [
-            A(l.value, (V) => ({
-              name: V,
-              fn: w(() => [
-                L(n.$slots, V)
+        r.value.isOpened ? (u(), h("div", Ye, [
+          (u(!0), h(q, null, I(r.value.children, (H, P) => (u(), j(w, {
+            modelValue: r.value.children[P],
+            "onUpdate:modelValue": (_) => r.value.children[P] = _,
+            key: r.value.children[P].key
+          }, G({ _: 2 }, [
+            I(o.value, (_) => ({
+              name: _,
+              fn: U(() => [
+                z(a.$slots, _)
               ])
             }))
           ]), 1032, ["modelValue", "onUpdate:modelValue"]))), 128))
-        ])) : k("", !0)
+        ])) : g("", !0)
       ], 2);
     };
   }
-}), ie = { class: "lkt-menu-container" }, ae = { class: "lkt-menu" }, ce = /* @__PURE__ */ J({
+}), et = { class: "lkt-menu-container" }, tt = { class: "lkt-menu" }, rt = /* @__PURE__ */ J({
   __name: "LktMenu",
-  props: {
-    modelValue: { default: () => [] },
-    resource: { default: "" },
-    resourceData: { default: () => ({}) }
-  },
-  emits: ["update:modelValue", "click-outside", "loading", "results", "response", "error"],
-  setup(o, { emit: t }) {
-    const r = o, i = t, e = K(), a = $(r.modelValue), f = (s) => {
-      let l = {};
-      typeof s == "object" && Object.keys(s).length > 0 && (l = JSON.parse(JSON.stringify(s)));
-      for (let h in l)
-        (Array.isArray(l[h]) || typeof l[h] == "object") && (l[h] = JSON.stringify(l[h]));
-      return l;
+  props: /* @__PURE__ */ ne({
+    modelValue: {},
+    resource: {},
+    resourceData: {}
+  }, We(Me)),
+  emits: [
+    "update:modelValue",
+    "click-outside",
+    "loading",
+    "results",
+    "response",
+    "error"
+  ],
+  setup(e, { emit: t }) {
+    const l = e, s = t, r = W(), v = B(l.modelValue), y = (i) => {
+      let o = {};
+      typeof i == "object" && Object.keys(i).length > 0 && (o = JSON.parse(JSON.stringify(i)));
+      for (let p in o)
+        (Array.isArray(o[p]) || typeof o[p] == "object") && (o[p] = JSON.stringify(o[p]));
+      return o;
     };
-    let m = new ee({});
-    m.increment(f(r.resourceData));
-    const g = c(() => j([], a.value)), E = c(() => {
-      let s = [];
-      for (let l in e)
-        l.startsWith("icon-") && g.value.includes(l.substring(5)) && s.push(l);
-      return s;
-    }), _ = () => {
-      if (!r.resource) return;
-      let s = m.getData();
-      i("loading"), te(r.resource, s).then((l) => {
-        m.turnStoredIntoOriginal(), a.value = l.data, i("results", l.data), i("response", l);
-      }).catch((l) => {
-        i("error", l);
+    let f = new ue({});
+    f.increment(y(l.resourceData));
+    const b = m(() => $([], v.value)), L = m(() => {
+      let i = [];
+      for (let o in r)
+        o.startsWith("icon-") && b.value.includes(o.substring(5)) && i.push(o);
+      return i;
+    }), x = () => {
+      if (!l.resource) return;
+      let i = f.getData();
+      s("loading"), ce(l.resource, i).then((o) => {
+        f.turnStoredIntoOriginal(), v.value = o.data, s("results", o.data), s("response", o);
+      }).catch((o) => {
+        s("error", o);
       });
-    }, D = () => {
-      i("click-outside");
+    }, N = () => {
+      s("click-outside");
     };
-    return O(() => r.modelValue, (s) => {
-      a.value = s;
-    }, { deep: !0 }), O(a, (s) => {
-      i("update:modelValue", s);
-    }, { deep: !0 }), _(), (s, l) => (u(), d("div", ie, [
-      S("div", ae, [
-        (u(!0), d(T, null, A(a.value, (h, C) => (u(), R(ue, {
-          modelValue: a.value[C],
-          "onUpdate:modelValue": (p) => a.value[C] = p,
-          key: h.key
-        }, W({ _: 2 }, [
-          A(E.value, (p) => ({
-            name: p,
-            fn: w(() => [
-              L(s.$slots, p)
+    return M(() => l.modelValue, (i) => {
+      v.value = i;
+    }, { deep: !0 }), M(v, (i) => {
+      s("update:modelValue", i);
+    }, { deep: !0 }), x(), (i, o) => (u(), h("div", et, [
+      E("div", tt, [
+        (u(!0), h(q, null, I(v.value, (p, A) => (u(), j(Ze, {
+          modelValue: v.value[A],
+          "onUpdate:modelValue": (k) => v.value[A] = k,
+          key: p.key
+        }, G({ _: 2 }, [
+          I(L.value, (k) => ({
+            name: k,
+            fn: U(() => [
+              z(i.$slots, k)
             ])
           }))
         ]), 1032, ["modelValue", "onUpdate:modelValue"]))), 128))
       ]),
-      S("div", {
+      E("div", {
         class: "lkt-menu-outside",
-        onClick: D
+        onClick: N
       })
     ]));
   }
-}), fe = {
-  install: (o) => {
-    o.component("lkt-menu") === void 0 && o.component("lkt-menu", ce);
+}), ct = {
+  install: (e) => {
+    e.component("lkt-menu") === void 0 && e.component("lkt-menu", rt);
   }
-}, ke = (o, t, r) => X(new x(o, t, r)), ye = (o) => (y.toggleSlot = o, !0);
+}, dt = (e, t, l) => oe(new F({
+  key: e,
+  href: t,
+  label: l
+})), vt = (e) => (C.toggleSlot = e, !0);
 export {
-  x as MenuEntry,
-  ke as createMenuEntry,
-  fe as default,
-  ye as setMenuToggleSlot
+  F as MenuEntry,
+  dt as createMenuEntry,
+  ct as default,
+  vt as setMenuToggleSlot
 };

package/dist/classes/MenuEntry.d.ts

@@ -0,0 +1,20 @@
+export declare class MenuEntry {
+    key: string;
+    href: string;
+    label: string;
+    icon: string;
+    onClick: Function | undefined;
+    isActiveChecker: Function | undefined;
+    isOpened: boolean;
+    isActive: boolean;
+    parent: MenuEntry | undefined;
+    children: MenuEntry[];
+    constructor(key: string, href: string, label: string);
+    setChildren(children: MenuEntry[]): this;
+    setOnClick(fn: Function): this;
+    setIsActiveChecker(fn: Function): this;
+    setIsActive(enabled?: boolean): this;
+    setLabel(str: string): this;
+    setIcon(str: string): this;
+    doClose(): void;
+}

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

@@ -0,0 +1,207 @@
+import { LktObject, MenuEntry } from 'lkt-vue-kernel';
+type __VLS_Props = {
+    modelValue?: MenuEntry;
+};
+declare const entry: import("vue").Ref<{
+    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;
+    setIsActive: (enabled?: boolean) => MenuEntry;
+    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 | 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;
+    setIsActive: (enabled?: boolean) => MenuEntry;
+    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>;
+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_9: string, __VLS_10: {
+    key: string | undefined;
+    entry: {
+        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;
+        setIsActive: (enabled?: boolean) => MenuEntry;
+        setLabel: (str: string) => MenuEntry;
+        setIcon: (str: string) => MenuEntry;
+        doClose: () => void;
+        feed: (data?: LktObject, target?: MenuEntry | undefined) => void;
+        assignProp: (key: string, value: any) => void;
+    };
+}, __VLS_24: any, __VLS_25: {};
+type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+    [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
+} & {
+    [K in NonNullable<typeof __VLS_24>]?: (props: typeof __VLS_25) => any;
+}>;
+declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
+    entry: typeof entry;
+    slots: typeof slots;
+    isActive: typeof isActive;
+    onClickToggle: typeof onClickToggle;
+    onClick: typeof onClick;
+    canRenderIcon: typeof canRenderIcon;
+    classes: typeof classes;
+    entryIconSlots: typeof entryIconSlots;
+    computedLabel: typeof computedLabel;
+    computedIsActive: typeof computedIsActive;
+    hasToggleSlot: typeof hasToggleSlot;
+    toggleSlot: typeof toggleSlot;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}>, {
+    modelValue: MenuEntry;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}>, {
+    modelValue: MenuEntry;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/functions/helpers.d.ts

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

package/dist/index.d.ts

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

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

@@ -0,0 +1,89 @@
+import MenuItem from '../components/MenuItem.vue';
+import { LktObject } from 'lkt-ts-interfaces';
+import { MenuConfig } from 'lkt-vue-kernel';
+declare const entries: import("vue").Ref<{
+    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_8: any, __VLS_9: {};
+type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+    [K in NonNullable<typeof __VLS_8>]?: (props: typeof __VLS_9) => any;
+}>;
+declare const __VLS_self: import("vue").DefineComponent<MenuConfig, {
+    MenuItem: typeof MenuItem;
+    entries: typeof entries;
+    entryIconSlots: typeof entryIconSlots;
+    onClickOutside: typeof onClickOutside;
+}, {}, {}, {}, 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<MenuConfig> & Readonly<{
+    onError?: ((...args: any[]) => any) | undefined;
+    onLoading?: ((...args: any[]) => any) | undefined;
+    onResults?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    "onClick-outside"?: ((...args: any[]) => any) | undefined;
+    onResponse?: ((...args: any[]) => any) | undefined;
+}>, {
+    resource: string;
+    resourceData: import("lkt-vue-kernel").LktObject;
+    modelValue: import("lkt-vue-kernel").MenuEntryConfig[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+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<MenuConfig> & Readonly<{
+    onError?: ((...args: any[]) => any) | undefined;
+    onLoading?: ((...args: any[]) => any) | undefined;
+    onResults?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    "onClick-outside"?: ((...args: any[]) => any) | undefined;
+    onResponse?: ((...args: any[]) => any) | undefined;
+}>, {
+    resource: string;
+    resourceData: import("lkt-vue-kernel").LktObject;
+    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;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/settings/Settings.d.ts

@@ -0,0 +1,5 @@
+import { Component } from "vue";
+export declare class Settings {
+    static toggleSlot: string | Component;
+    static debugEnabled: boolean;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lkt-menu",
-  "version": "1.0.11",
+  "version": "1.4.0",
   "description": "",
   "keywords": [
     "lkt",
@@ -18,7 +18,7 @@
     ".": {
       "import": "./dist/build.js"
     },
-    "./styles": "./dist/style.css",
+    "./styles": "./dist/build.css",
     "./theme": "./theme/default.css",
     "./theme/default": "./theme/default.css"
   },
@@ -31,34 +31,30 @@
   "license": "MIT",
   "sideEffects": false,
   "scripts": {
-    "build": "rm -rf dist/*; vue-tsc --declaration --emitDeclarationOnly; vite build; tsc --project tsconfig.build.json; cp build/* dist/"
+    "build": "vue-tsc --declaration --emitDeclarationOnly; vite build; tsc --project tsconfig.build.json; cp build/* dist/",
+    "rebuild": "rm -rf dist/*; vue-tsc --declaration --emitDeclarationOnly; vite build; tsc --project tsconfig.build.json; cp build/* dist/"
   },
   "author": "Antonio Ibáñez",
+  "engines": {
+    "node": ">=18"
+  },
   "devDependencies": {
     "@babel/types": "^7.23.6",
     "@types/node": "^20.11.19",
     "@types/rollup": "^0.54.0",
     "@vitejs/plugin-vue": "^5.0.4",
-    "rollup": "^4.9.6",
-    "typescript": "^5.3.3",
-    "vite": "^5.1.3",
+    "rollup": "^4.34.8",
+    "typescript": "^5.7.3",
+    "vite": "^6.1.1",
     "vue": "^3.3.0",
-    "vue-tsc": "^1.8.27"
-  },
-  "engines": {
-    "node": ">=18"
+    "vue-tsc": "^2.2.0"
   },
-  "dependencies": {
-    "lkt-anchor": "^1.1.4",
-    "lkt-control-tools": "^1.0.3",
-    "lkt-data-state": "^1.0.10",
-    "lkt-events": "^1.0.2",
-    "lkt-http-client": "^1.0.31",
-    "lkt-i18n": "^1.0.4",
-    "lkt-loader": "^1.0.1",
-    "lkt-modal-confirm": "^1.0.0",
-    "lkt-string-tools": "^1.0.1",
-    "lkt-ts-interfaces": "^1.0.0",
+  "peerDependencies": {
+    "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.32",
     "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 {computed, onMounted, ref, useSlots, watch} from "vue";
-import {LktObject} from "lkt-ts-interfaces";
-import {fetchKeys} from "../functions/helpers";
-import {__} from "lkt-i18n";
-import {useRouter} from "vue-router";
-import {Settings} from "../settings/Settings";
+  import { extractI18nValue, LktObject, MenuEntry } from 'lkt-vue-kernel';
+  import { computed, onMounted, ref, useSlots, watch } from 'vue';
+  import { fetchKeys } from '../functions/helpers';
+  import { useRouter } from 'vue-router';
+  import { Settings } from '../settings/Settings';
 
-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
@@ -60,10 +68,7 @@ const availableKeys = computed(() => {
         return r;
     }),
     computedLabel = computed(() => {
-        if (entry.value.label.startsWith('__:')) {
-            return __(entry.value.label.substring(3));
-        }
-        return entry.value.label;
+        return extractI18nValue(entry.value.label);
     }),
     computedIsActive = computed(() => {
         if (entry.value.isActive) return true;
@@ -98,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;
           });
 
@@ -136,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,22 @@
 <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";
-
-const props = withDefaults(defineProps<{
-    modelValue?: MenuEntry[],
-    resource?: string
-    resourceData: LktObject,
-}>(), {
-    modelValue: () => [],
-    resource: '',
-    resourceData: () => ({}),
-});
-
-const emit = defineEmits(['update:modelValue', 'click-outside', 'loading', 'results', 'response', 'error']);
+  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 { getDefaultValues, Menu, MenuConfig } from 'lkt-vue-kernel';
+
+  const props = withDefaults(defineProps<MenuConfig>(), getDefaultValues(Menu));
+
+const emit = defineEmits([
+  'update:modelValue',
+  'click-outside',
+  'loading',
+  'results',
+  'response',
+  'error'
+]);
 
 const slots = useSlots();
 
@@ -97,8 +96,4 @@ loadResource();
         </div>
         <div class="lkt-menu-outside" v-on:click="onClickOutside"/>
     </div>
-</template>
-
-<style scoped>
-
-</style>
+</template>