lkt-menu 2.0.12 → 2.0.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/build.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- declare namespace $e {
1
+ declare namespace Se {
2
2
  function install(s: any): void;
3
3
  }
4
- declare function Oe(s: any): boolean;
5
- export { $e as default, Oe as setMenuToggleSlot };
4
+ declare function Me(s: any): boolean;
5
+ export { Se as default, Me as setMenuToggleSlot };
package/dist/build.js CHANGED
@@ -1,158 +1,173 @@
1
- import { defineComponent as X, ref as T, useSlots as Y, computed as r, watch as S, onMounted as Z, resolveComponent as E, createElementBlock as d, openBlock as u, normalizeClass as g, createElementVNode as _, createCommentVNode as f, createBlock as y, unref as p, normalizeProps as H, mergeProps as I, createSlots as q, withCtx as h, renderSlot as k, toDisplayString as ee, resolveDynamicComponent as te, Fragment as x, renderList as j, mergeDefaults as le } from "vue";
2
- import { MenuEntryType as R, MenuController as W, MenuType as Q, getDefaultValues as ne, Menu as oe } from "lkt-vue-kernel";
3
- import { useRouter as ue } from "vue-router";
4
- import { DataState as se } from "lkt-data-state";
5
- import { httpCall as ie } from "lkt-http-client";
1
+ import { defineComponent as Z, ref as L, useSlots as x, computed as d, watch as M, onMounted as ee, resolveComponent as I, createElementBlock as r, openBlock as u, normalizeClass as C, createElementVNode as K, createCommentVNode as g, createBlock as f, unref as c, normalizeProps as W, mergeProps as R, createSlots as q, withCtx as _, renderSlot as y, toDisplayString as le, resolveDynamicComponent as ne, Fragment as te, renderList as P, mergeDefaults as oe } from "vue";
2
+ import { MenuEntryType as T, MenuController as j, MenuType as Y, getDefaultValues as ue, Menu as se } from "lkt-vue-kernel";
3
+ import { useRouter as ie } from "vue-router";
4
+ import { DataState as ae } from "lkt-data-state";
5
+ import { httpCall as re } from "lkt-http-client";
6
6
  const G = (s, V) => (V.forEach((o) => {
7
7
  o.key && !s.includes(o.key) && s.push(o.key), o.children && o.children.length > 0 && G(s, o.children);
8
- }), s), L = class L {
8
+ }), s), U = class U {
9
9
  };
10
- L.toggleSlot = "", L.debugEnabled = !1;
11
- let M = L;
12
- const ae = ["id"], re = { class: "lkt-menu-entry-main" }, ce = { class: "lkt-entry-content" }, de = {
10
+ U.toggleSlot = "", U.debugEnabled = !1;
11
+ let E = U;
12
+ const ce = ["id"], de = { class: "lkt-menu-entry-main" }, ve = { class: "lkt-entry-content" }, pe = {
13
13
  key: 0,
14
14
  class: "lkt-menu-entry-icon"
15
- }, pe = {
15
+ }, me = {
16
16
  key: 1,
17
17
  class: "lkt-menu-entry-text"
18
- }, ve = {
18
+ }, ye = {
19
19
  key: 0,
20
20
  class: "lkt-menu-entry-children"
21
- }, me = /* @__PURE__ */ X({
21
+ }, ke = /* @__PURE__ */ Z({
22
22
  __name: "MenuItem",
23
23
  props: {
24
- modelValue: { default: () => ({}) }
24
+ modelValue: { default: () => ({}) },
25
+ menuKey: {},
26
+ closeOnClickEntry: { type: Boolean }
25
27
  },
26
28
  emits: [
27
29
  "update:modelValue"
28
30
  ],
29
31
  setup(s, { emit: V }) {
30
- const o = V, v = s, e = T(v.modelValue), c = Y(), a = ue(), A = T(!1), K = () => {
32
+ const o = V, v = s, e = L(v.modelValue), p = x(), a = ie(), A = L(!1), B = () => {
31
33
  e.value.isOpened = !e.value.isOpened;
32
34
  }, b = () => {
33
35
  var t, l;
34
- return typeof e.value.children < "u" && ((t = e.value.children) == null ? void 0 : t.length) > 0 && !e.value.keepOpenOnChildClick && K(), typeof ((l = e.value.events) == null ? void 0 : l.click) == "function" && e.value.events.click({
36
+ return typeof e.value.children < "u" && ((t = e.value.children) == null ? void 0 : t.length) > 0 && !e.value.keepOpenOnChildClick && B(), typeof ((l = e.value.events) == null ? void 0 : l.click) == "function" && e.value.events.click({
35
37
  entry: e.value
36
38
  }), 1;
37
- }, D = r(() => c["icon-" + e.value.key] || e.value.icon !== ""), P = r(() => {
39
+ }, D = d(() => p["icon-" + e.value.key] || e.value.icon !== ""), w = d(() => {
38
40
  let t = [];
39
41
  return D.value && t.push("has-icon"), A.value && t.push("is-active"), e.value.type && t.push(`is-${e.value.type}`), t.join(" ");
40
- }), U = r(() => {
42
+ }), F = d(() => {
41
43
  var l;
42
44
  return G([], ((l = e.value) == null ? void 0 : l.children) ?? []);
43
- }), w = r(() => {
45
+ }), J = d(() => {
44
46
  let t = [];
45
- for (let l in c)
46
- l.startsWith("icon-") && U.value.includes(l.substring(5)) && t.push(l);
47
+ for (let l in p)
48
+ l.startsWith("icon-") && F.value.includes(l.substring(5)) && t.push(l);
47
49
  return t;
48
- }), F = r(() => e.value.isActive ? !0 : typeof e.value.isActiveChecker == "function" ? !!e.value.isActiveChecker({
50
+ }), z = d(() => e.value.isActive ? !0 : typeof e.value.isActiveChecker == "function" ? !!e.value.isActiveChecker({
49
51
  entry: e.value
50
- }) : !1), N = r(() => !!M.toggleSlot), n = r(() => M.toggleSlot);
51
- return S(() => v.modelValue, (t) => {
52
+ }) : !1), N = d(() => !!E.toggleSlot), n = d(() => E.toggleSlot);
53
+ return M(() => v.modelValue, (t) => {
52
54
  e.value = t;
53
- }, { deep: !0 }), S(e, (t) => {
55
+ }, { deep: !0 }), M(e, (t) => {
54
56
  o("update:modelValue", t);
55
- }, { deep: !0 }), Z(() => {
57
+ }, { deep: !0 }), ee(() => {
56
58
  var l, i, m;
57
59
  let t = a == null ? void 0 : a.currentRoute;
58
60
  if (t) {
59
61
  if (t.value.path === ((l = e.value.anchor) == null ? void 0 : l.to))
60
62
  e.value.isOpened = !0;
61
63
  else if (typeof e.value.children < "u" && ((i = e.value.children) == null ? void 0 : i.length) > 0) {
62
- let C = !1;
63
- (m = e.value.children) == null || m.forEach((J) => {
64
- var $;
65
- t.value.path === (($ = J.anchor) == null ? void 0 : $.to) && (C = !0);
66
- }), C && (e.value.isOpened = !0);
64
+ let $ = !1;
65
+ (m = e.value.children) == null || m.forEach((H) => {
66
+ var S;
67
+ t.value.path === ((S = H.anchor) == null ? void 0 : S.to) && ($ = !0);
68
+ }), $ && (e.value.isOpened = !0);
67
69
  }
68
70
  }
69
71
  }), (t, l) => {
70
- var $;
71
- const i = E("lkt-button"), m = E("lkt-header"), C = E("lkt-anchor"), J = E("menu-item", !0);
72
- return u(), d("div", {
73
- class: g(["lkt-menu-entry", P.value]),
72
+ var S;
73
+ const i = I("lkt-button"), m = I("lkt-header"), $ = I("lkt-anchor"), H = I("menu-item", !0);
74
+ return u(), r("div", {
75
+ class: C(["lkt-menu-entry", w.value]),
74
76
  id: `entry-${e.value.key}`
75
77
  }, [
76
- _("div", re, [
77
- e.value.type === p(R).Button ? (u(), y(i, H(I({ key: 0 }, e.value.button)), q({ _: 2 }, [
78
- p(c).tooltip ? {
78
+ K("div", de, [
79
+ e.value.type === c(T).Button ? (u(), f(i, W(R({ key: 0 }, e.value.button)), q({ _: 2 }, [
80
+ c(p).tooltip ? {
79
81
  name: "tooltip",
80
- fn: h(() => [
81
- k(t.$slots, "tooltip")
82
+ fn: _(() => [
83
+ y(t.$slots, "tooltip")
82
84
  ]),
83
85
  key: "0"
84
86
  } : void 0,
85
- p(c).split ? {
87
+ c(p).split ? {
86
88
  name: "split",
87
- fn: h(() => [
88
- k(t.$slots, "split")
89
+ fn: _(() => [
90
+ y(t.$slots, "split")
89
91
  ]),
90
92
  key: "1"
91
93
  } : void 0
92
- ]), 1040)) : e.value.type === p(R).Header ? (u(), y(m, H(I({ key: 1 }, e.value.header)), null, 16)) : e.value.type === p(R).Anchor ? (u(), y(C, H(I({ key: 2 }, e.value.anchor)), null, 16)) : (u(), y(C, I({ key: 3 }, e.value.anchor, {
94
+ ]), 1040)) : e.value.type === c(T).Header ? (u(), f(m, W(R({ key: 1 }, e.value.header)), null, 16)) : e.value.type === c(T).Anchor ? (u(), f($, W(R({ key: 2 }, {
95
+ ...e.value.anchor
96
+ })), null, 16)) : (u(), f($, R({ key: 3 }, {
97
+ ...e.value.anchor,
98
+ events: {
99
+ ...e.value.anchor.events,
100
+ click: (k) => {
101
+ var O, h, Q, X;
102
+ t.closeOnClickEntry && c(j).closeMenu(v.menuKey), typeof ((h = (O = e.value.anchor) == null ? void 0 : O.events) == null ? void 0 : h.click) == "function" && ((X = (Q = e.value.anchor) == null ? void 0 : Q.events) == null || X.click(k));
103
+ }
104
+ }
105
+ }, {
93
106
  "on-click": b,
94
- "is-active": F.value,
95
- onActive: l[0] || (l[0] = (O) => A.value = O)
107
+ "is-active": z.value,
108
+ onActive: l[0] || (l[0] = (k) => A.value = k)
96
109
  }), {
97
- text: h(({ text: O }) => [
98
- _("div", ce, [
99
- D.value ? (u(), d("div", de, [
100
- p(c)["icon-" + e.value.key] ? k(t.$slots, "icon-" + e.value.key, {
110
+ text: _(({ text: k }) => [
111
+ K("div", ve, [
112
+ D.value ? (u(), r("div", pe, [
113
+ c(p)["icon-" + e.value.key] ? y(t.$slots, "icon-" + e.value.key, {
101
114
  key: e.value.key,
102
115
  entry: e.value
103
- }) : e.value.icon !== "" ? (u(), d("i", {
116
+ }) : e.value.icon !== "" ? (u(), r("i", {
104
117
  key: 1,
105
- class: g(e.value.icon)
106
- }, null, 2)) : f("", !0)
107
- ])) : f("", !0),
108
- O !== "" ? (u(), d("div", pe, ee(O), 1)) : f("", !0)
118
+ class: C(e.value.icon)
119
+ }, null, 2)) : g("", !0)
120
+ ])) : g("", !0),
121
+ k !== "" ? (u(), r("div", me, le(k), 1)) : g("", !0)
109
122
  ])
110
123
  ]),
111
124
  _: 3
112
125
  }, 16, ["is-active"])),
113
- e.value.type !== p(R).Button && e.value.children && (($ = e.value.children) == null ? void 0 : $.length) > 0 ? (u(), d("div", {
126
+ e.value.type !== c(T).Button && e.value.children && ((S = e.value.children) == null ? void 0 : S.length) > 0 ? (u(), r("div", {
114
127
  key: 4,
115
128
  class: "lkt-menu-entry-toggle",
116
- onClick: K
129
+ onClick: B
117
130
  }, [
118
- N.value ? (u(), y(te(n.value), {
131
+ N.value ? (u(), f(ne(n.value), {
119
132
  key: 0,
120
- class: g(["lkt-menu-entry-toggle-inner", e.value.isOpened ? "is-opened" : ""])
121
- }, null, 8, ["class"])) : (u(), d("div", {
133
+ class: C(["lkt-menu-entry-toggle-inner", e.value.isOpened ? "is-opened" : ""])
134
+ }, null, 8, ["class"])) : (u(), r("div", {
122
135
  key: 1,
123
- class: g(["lkt-menu-entry-toggle-inner", e.value.isOpened ? "is-opened" : ""])
136
+ class: C(["lkt-menu-entry-toggle-inner", e.value.isOpened ? "is-opened" : ""])
124
137
  }, l[1] || (l[1] = [
125
- _("i", { class: "lkt-icn-angle-bottom" }, null, -1)
138
+ K("i", { class: "lkt-icn-angle-bottom" }, null, -1)
126
139
  ]), 2))
127
- ])) : f("", !0)
140
+ ])) : g("", !0)
128
141
  ]),
129
- e.value.isOpened ? (u(), d("div", ve, [
130
- (u(!0), d(x, null, j(e.value.children, (O, z) => (u(), y(J, {
131
- modelValue: e.value.children[z],
132
- "onUpdate:modelValue": (B) => e.value.children[z] = B,
133
- key: e.value.children[z].key
142
+ e.value.isOpened ? (u(), r("div", ye, [
143
+ (u(!0), r(te, null, P(e.value.children, (k, O) => (u(), f(H, {
144
+ modelValue: e.value.children[O],
145
+ "onUpdate:modelValue": (h) => e.value.children[O] = h,
146
+ key: e.value.children[O].key
134
147
  }, q({ _: 2 }, [
135
- j(w.value, (B) => ({
136
- name: B,
137
- fn: h(() => [
138
- k(t.$slots, B)
148
+ P(J.value, (h) => ({
149
+ name: h,
150
+ fn: _(() => [
151
+ y(t.$slots, h)
139
152
  ])
140
153
  }))
141
154
  ]), 1032, ["modelValue", "onUpdate:modelValue"]))), 128))
142
- ])) : f("", !0)
143
- ], 10, ae);
155
+ ])) : g("", !0)
156
+ ], 10, ce);
144
157
  };
145
158
  }
146
- }), ke = ["role"], ye = { class: "lkt-menu-main" }, he = { class: "lkt-menu-entries" }, fe = /* @__PURE__ */ X({
159
+ }), he = ["role"], fe = { class: "lkt-menu-main" }, ge = { class: "lkt-menu-entries" }, _e = /* @__PURE__ */ Z({
147
160
  __name: "LktMenu",
148
- props: /* @__PURE__ */ le({
161
+ props: /* @__PURE__ */ oe({
149
162
  modelValue: {},
150
163
  type: {},
151
164
  menuKey: { type: [String, Number, Function] },
152
165
  hiddenPosition: {},
166
+ renderOutside: { type: Boolean },
153
167
  closeOnClickOutside: { type: Boolean },
168
+ closeOnClickEntry: { type: Boolean },
154
169
  http: {}
155
- }, ne(oe)),
170
+ }, ue(se)),
156
171
  emits: [
157
172
  "update:modelValue",
158
173
  "click-outside",
@@ -163,97 +178,100 @@ const ae = ["id"], re = { class: "lkt-menu-entry-main" }, ce = { class: "lkt-ent
163
178
  ],
164
179
  setup(s, { emit: V }) {
165
180
  var N;
166
- const o = s, v = V, e = T(!1), c = Y(), a = T(o.modelValue), A = (n) => {
181
+ const o = s, v = V, e = L(!1), p = x(), a = L(o.modelValue), A = (n) => {
167
182
  let t = {};
168
183
  typeof n == "object" && Object.keys(n).length > 0 && (t = JSON.parse(JSON.stringify(n)));
169
184
  for (let l in t)
170
185
  (Array.isArray(t[l]) || typeof t[l] == "object") && (t[l] = JSON.stringify(t[l]));
171
186
  return t;
172
187
  };
173
- S(() => W.config.value, (n) => {
188
+ M(() => j.config.value, (n) => {
174
189
  }, { deep: !0 });
175
- const K = r(() => {
190
+ const B = d(() => {
176
191
  let n = [
177
192
  `type-${o.type}`
178
193
  ];
179
- return o.menuKey && n.push(o.menuKey), e.value && n.push("is-visible"), o.type === Q.Hidden && n.push(`${o.hiddenPosition}-hidden`), n.join(" ");
194
+ return o.menuKey && n.push(o.menuKey), e.value && n.push("is-visible"), o.type === Y.Hidden && n.push(`${o.hiddenPosition}-hidden`), n.join(" ");
180
195
  });
181
- let b = new se({});
196
+ let b = new ae({});
182
197
  b.increment(A(((N = o.http) == null ? void 0 : N.data) ?? {}));
183
- const D = r(() => G([], a.value)), P = r(() => {
198
+ const D = d(() => G([], a.value)), w = d(() => {
184
199
  let n = [];
185
- for (let t in c)
200
+ for (let t in p)
186
201
  t.startsWith("icon-") && D.value.includes(t.substring(5)) && n.push(t);
187
202
  return n;
188
- }), U = () => {
203
+ }), F = () => {
189
204
  var t, l;
190
205
  if (!((t = o.http) != null && t.resource)) return;
191
206
  let n = b.getData();
192
- v("loading"), ie((l = o.http) == null ? void 0 : l.resource, n).then((i) => {
207
+ v("loading"), re((l = o.http) == null ? void 0 : l.resource, n).then((i) => {
193
208
  b.turnStoredIntoOriginal(), a.value = i.data, v("results", i.data), v("response", i);
194
209
  }).catch((i) => {
195
210
  v("error", i);
196
211
  });
197
- }, w = () => {
198
- o.closeOnClickOutside && W.closeMenu(o.menuKey), v("click-outside");
212
+ }, J = () => {
213
+ o.closeOnClickOutside && j.closeMenu(o.menuKey), v("click-outside");
199
214
  };
200
- S(() => o.modelValue, (n) => {
215
+ M(() => o.modelValue, (n) => {
201
216
  a.value = n;
202
- }, { deep: !0 }), S(a, (n) => {
217
+ }, { deep: !0 }), M(a, (n) => {
203
218
  v("update:modelValue", n);
204
- }, { deep: !0 }), Z(() => {
205
- W.addMenu(o.menuKey, e), U();
219
+ }, { deep: !0 }), ee(() => {
220
+ j.addMenu(o.menuKey, e), F();
206
221
  });
207
- const F = r(() => {
208
- if (o.type === Q.TabList) return "tablist";
222
+ const z = d(() => {
223
+ if (o.type === Y.TabList) return "tablist";
209
224
  });
210
- return (n, t) => (u(), d("div", {
211
- class: g(["lkt-menu", K.value]),
212
- role: F.value
225
+ return (n, t) => (u(), r("div", {
226
+ class: C(["lkt-menu", B.value]),
227
+ role: z.value
213
228
  }, [
214
- _("div", ye, [
215
- p(c).before ? k(n.$slots, "before", { key: 0 }) : f("", !0),
216
- _("div", he, [
217
- (u(!0), d(x, null, j(a.value, (l, i) => (u(), y(me, {
229
+ K("div", fe, [
230
+ c(p).before ? y(n.$slots, "before", { key: 0 }) : g("", !0),
231
+ K("div", ge, [
232
+ (u(!0), r(te, null, P(a.value, (l, i) => (u(), f(ke, {
218
233
  modelValue: a.value[i],
219
234
  "onUpdate:modelValue": (m) => a.value[i] = m,
220
- class: g(l.class)
235
+ class: C(l.class),
236
+ "menu-key": n.menuKey,
237
+ "close-on-click-entry": n.closeOnClickEntry
221
238
  }, q({ _: 2 }, [
222
- j(P.value, (m) => ({
239
+ P(w.value, (m) => ({
223
240
  name: m,
224
- fn: h(() => [
225
- k(n.$slots, m)
241
+ fn: _(() => [
242
+ y(n.$slots, m)
226
243
  ])
227
244
  })),
228
- p(c)[`tooltip-${l.key}`] ? {
245
+ c(p)[`tooltip-${l.key}`] ? {
229
246
  name: "tooltip",
230
- fn: h(() => [
231
- k(n.$slots, `tooltip-${l.key}`)
247
+ fn: _(() => [
248
+ y(n.$slots, `tooltip-${l.key}`)
232
249
  ]),
233
250
  key: "0"
234
251
  } : void 0,
235
- p(c)[`split-${l.key}`] ? {
252
+ c(p)[`split-${l.key}`] ? {
236
253
  name: "split",
237
- fn: h(() => [
238
- k(n.$slots, `split-${l.key}`)
254
+ fn: _(() => [
255
+ y(n.$slots, `split-${l.key}`)
239
256
  ]),
240
257
  key: "1"
241
258
  } : void 0
242
- ]), 1032, ["modelValue", "onUpdate:modelValue", "class"]))), 256))
259
+ ]), 1032, ["modelValue", "onUpdate:modelValue", "class", "menu-key", "close-on-click-entry"]))), 256))
243
260
  ])
244
261
  ]),
245
- _("div", {
262
+ n.renderOutside ? (u(), r("div", {
263
+ key: 0,
246
264
  class: "lkt-menu-outside",
247
- onClick: w
248
- })
249
- ], 10, ke));
265
+ onClick: J
266
+ })) : g("", !0)
267
+ ], 10, he));
250
268
  }
251
- }), $e = {
269
+ }), Se = {
252
270
  install: (s) => {
253
- s.component("lkt-menu") === void 0 && s.component("lkt-menu", fe);
271
+ s.component("lkt-menu") === void 0 && s.component("lkt-menu", _e);
254
272
  }
255
- }, Oe = (s) => (M.toggleSlot = s, !0);
273
+ }, Me = (s) => (E.toggleSlot = s, !0);
256
274
  export {
257
- $e as default,
258
- Oe as setMenuToggleSlot
275
+ Se as default,
276
+ Me as setMenuToggleSlot
259
277
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "lkt-menu",
3
- "version": "2.0.12",
3
+ "version": "2.0.14",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "lkt",