@adyen/bento-vue3 1.68.1 → 1.68.2
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/@types/index.d.ts +3 -1
- package/dist/action-bar.js +1 -1
- package/dist/assets/accordion-item.css +1 -1
- package/dist/assets/action-bar.css +1 -1
- package/dist/assets/base-modal.css +1 -1
- package/dist/assets/card.css +1 -1
- package/dist/assets/data-grid.css +1 -1
- package/dist/assets/dialog-page.css +1 -1
- package/dist/assets/file-uploader.css +1 -1
- package/dist/assets/inspector.css +1 -1
- package/dist/assets/menu.css +1 -1
- package/dist/assets/modal-fullscreen.css +1 -1
- package/dist/assets/popover.css +1 -1
- package/dist/assets/sidepanel.css +1 -1
- package/dist/chunks/{action-bar.C93kgr7l.js → action-bar.CflF49oL.js} +2 -2
- package/dist/chunks/{action-bar.C93kgr7l.js.map → action-bar.CflF49oL.js.map} +1 -1
- package/dist/chunks/{button-actions-with-menu.DUccmaB2.js → button-actions-with-menu.8ZYh7-9s.js} +2 -2
- package/dist/chunks/{button-actions-with-menu.DUccmaB2.js.map → button-actions-with-menu.8ZYh7-9s.js.map} +1 -1
- package/dist/chunks/{dashboard-section.CUcq2ahu.js → dashboard-section.Bhd5Lsy2.js} +2 -2
- package/dist/chunks/{dashboard-section.CUcq2ahu.js.map → dashboard-section.Bhd5Lsy2.js.map} +1 -1
- package/dist/chunks/{data-grid-template.CDsV2GFG.js → data-grid-template.DSwj7e1E.js} +2 -2
- package/dist/chunks/{data-grid-template.CDsV2GFG.js.map → data-grid-template.DSwj7e1E.js.map} +1 -1
- package/dist/chunks/{data-grid.BbZSu-mA.js → data-grid.BEdELRNZ.js} +6 -7
- package/dist/chunks/data-grid.BEdELRNZ.js.map +1 -0
- package/dist/chunks/{header-with-views.C9ql_Wem.js → header-with-views.BUed3ocZ.js} +3 -3
- package/dist/chunks/{header-with-views.C9ql_Wem.js.map → header-with-views.BUed3ocZ.js.map} +1 -1
- package/dist/chunks/{header.wiq0wlgm.js → header.CwKjDgKv.js} +2 -2
- package/dist/chunks/{header.wiq0wlgm.js.map → header.CwKjDgKv.js.map} +1 -1
- package/dist/chunks/{menu.C-3obPGl.js → menu.EtjeOPXX.js} +182 -183
- package/dist/chunks/menu.EtjeOPXX.js.map +1 -0
- package/dist/chunks/{tutorial.vue_vue_type_script_setup_true_lang.nYHtTHqy.js → tutorial.vue_vue_type_script_setup_true_lang.Dmf8fGaM.js} +2 -2
- package/dist/chunks/{tutorial.vue_vue_type_script_setup_true_lang.nYHtTHqy.js.map → tutorial.vue_vue_type_script_setup_true_lang.Dmf8fGaM.js.map} +1 -1
- package/dist/dashboard-template.js +1 -1
- package/dist/data-grid-template.js +1 -1
- package/dist/data-grid.js +1 -1
- package/dist/header-with-views.js +1 -1
- package/dist/header.js +1 -1
- package/dist/index.js +8 -8
- package/dist/internal.js +1 -1
- package/dist/menu.js +1 -1
- package/dist/tutorial.js +1 -1
- package/dist/web-types.json +1 -1
- package/package.json +4 -4
- package/dist/chunks/data-grid.BbZSu-mA.js.map +0 -1
- package/dist/chunks/menu.C-3obPGl.js.map +0 -1
|
@@ -1,54 +1,54 @@
|
|
|
1
|
-
import { createElementBlock as
|
|
2
|
-
import { B as
|
|
3
|
-
import { B as
|
|
4
|
-
import { B as
|
|
5
|
-
import { u as
|
|
6
|
-
import { u as
|
|
7
|
-
import { g as
|
|
8
|
-
import { u as
|
|
9
|
-
import { B as
|
|
10
|
-
import { C as
|
|
1
|
+
import { createElementBlock as L, openBlock as p, mergeProps as X, createCommentVNode as w, createElementVNode as P, toDisplayString as V, defineComponent as W, computed as E, resolveComponent as B, createBlock as S, normalizeClass as Q, createSlots as ee, withCtx as I, createVNode as $, createTextVNode as j, resolveDynamicComponent as re, ref as c, inject as te, toHandlers as ce, renderSlot as G, onMounted as ne, Transition as de, withKeys as g, withModifiers as U, Fragment as oe, renderList as se, watch as me, nextTick as q, normalizeStyle as le, useSlots as fe, provide as pe, unref as h } from "vue";
|
|
2
|
+
import { B as ie, D as ve } from "./divider.qUOSAbU6.js";
|
|
3
|
+
import { B as be } from "./popover.DYgCCUCJ.js";
|
|
4
|
+
import { B as ye } from "./popover.types.V8old-GW.js";
|
|
5
|
+
import { u as Ce } from "./use-click-outside.BnhTgpSt.js";
|
|
6
|
+
import { u as he } from "./use-has-slot.B7eQSabc.js";
|
|
7
|
+
import { g as _e } from "./generate-uid.NJ8tVoha.js";
|
|
8
|
+
import { u as Ie } from "./i18n.B6g5VX0q.js";
|
|
9
|
+
import { B as ge, p as ke } from "./typography.DN5eC5ch.js";
|
|
10
|
+
import { C as Me } from "./chevron-down.DCQ6ZLaq.js";
|
|
11
11
|
/* empty css */
|
|
12
12
|
import { _ as R } from "./_plugin-vue_export-helper.CHgC5LLL.js";
|
|
13
|
-
import { B as
|
|
14
|
-
import { B as
|
|
15
|
-
import { a as
|
|
16
|
-
import { a as
|
|
17
|
-
import { t as
|
|
13
|
+
import { B as Be } from "./toggle-button.NQwrfSr1.js";
|
|
14
|
+
import { B as Se } from "./teleport.CfGWjxe2.js";
|
|
15
|
+
import { a as $e, C as z } from "./chevron-right.Brdj0WlO.js";
|
|
16
|
+
import { a as J, B as Ee } from "./base-button.DdNFlbgH.js";
|
|
17
|
+
import { t as Le } from "./truncate.BfIl_-71.js";
|
|
18
18
|
import "../assets/menu.css";
|
|
19
|
-
const
|
|
20
|
-
let
|
|
21
|
-
const
|
|
19
|
+
const Te = Symbol("menu inverse style injection key");
|
|
20
|
+
let Z = 0;
|
|
21
|
+
const we = {
|
|
22
22
|
beforeCreate() {
|
|
23
|
-
this.uuid =
|
|
23
|
+
this.uuid = Z.toString(), Z += 1;
|
|
24
24
|
}
|
|
25
|
-
},
|
|
26
|
-
function
|
|
27
|
-
return p(),
|
|
25
|
+
}, Oe = { key: 0 };
|
|
26
|
+
function Ne(e, o, v, s, d, b) {
|
|
27
|
+
return p(), L("svg", X({ role: "img" }, e.$attrs, {
|
|
28
28
|
class: "ui-assets-icons-16",
|
|
29
29
|
xmlns: "http://www.w3.org/2000/svg",
|
|
30
30
|
width: "16",
|
|
31
31
|
height: "16",
|
|
32
32
|
fill: "none"
|
|
33
33
|
}), [
|
|
34
|
-
e.$attrs["svg-title"] ? (p(),
|
|
35
|
-
o[0] || (o[0] =
|
|
34
|
+
e.$attrs["svg-title"] ? (p(), L("title", Oe, V(e.$attrs["svg-title"]), 1)) : w("", !0),
|
|
35
|
+
o[0] || (o[0] = P("path", {
|
|
36
36
|
fill: "#001222",
|
|
37
37
|
d: "M8 4C8.29667 4 8.58668 3.91203 8.83335 3.74721C9.08003 3.58238 9.27229 3.34811 9.38582 3.07403C9.49935 2.79994 9.52906 2.49834 9.47118 2.20737C9.4133 1.91639 9.27044 1.64912 9.06066 1.43934C8.85088 1.22956 8.58361 1.0867 8.29264 1.02882C8.00167 0.970945 7.70006 1.00065 7.42598 1.11418C7.15189 1.22771 6.91762 1.41997 6.7528 1.66665C6.58797 1.91332 6.5 2.20333 6.5 2.5C6.5 2.89783 6.65803 3.27936 6.93934 3.56066C7.22064 3.84197 7.60218 4 8 4Z"
|
|
38
38
|
}, null, -1)),
|
|
39
|
-
o[1] || (o[1] =
|
|
39
|
+
o[1] || (o[1] = P("path", {
|
|
40
40
|
fill: "#001222",
|
|
41
41
|
d: "M8 15C8.29667 15 8.58668 14.912 8.83335 14.7472C9.08003 14.5824 9.27229 14.3481 9.38582 14.074C9.49935 13.7999 9.52906 13.4983 9.47118 13.2074C9.4133 12.9164 9.27044 12.6491 9.06066 12.4393C8.85088 12.2296 8.58361 12.0867 8.29264 12.0288C8.00167 11.9709 7.70006 12.0007 7.42598 12.1142C7.15189 12.2277 6.91762 12.42 6.7528 12.6666C6.58797 12.9133 6.5 13.2033 6.5 13.5C6.5 13.8978 6.65803 14.2794 6.93934 14.5607C7.22064 14.842 7.60218 15 8 15Z"
|
|
42
42
|
}, null, -1)),
|
|
43
|
-
o[2] || (o[2] =
|
|
43
|
+
o[2] || (o[2] = P("path", {
|
|
44
44
|
fill: "#001222",
|
|
45
45
|
d: "M8.83335 9.24721C8.58668 9.41203 8.29667 9.5 8 9.5C7.60218 9.5 7.22064 9.34197 6.93934 9.06066C6.65803 8.77936 6.5 8.39783 6.5 8C6.5 7.70333 6.58797 7.41332 6.7528 7.16665C6.91762 6.91997 7.15189 6.72771 7.42598 6.61418C7.70006 6.50065 8.00167 6.47094 8.29264 6.52882C8.58361 6.5867 8.85088 6.72956 9.06066 6.93934C9.27044 7.14912 9.4133 7.41639 9.47118 7.70737C9.52906 7.99834 9.49935 8.29994 9.38582 8.57403C9.27229 8.84811 9.08003 9.08238 8.83335 9.24721Z"
|
|
46
46
|
}, null, -1))
|
|
47
47
|
], 16);
|
|
48
48
|
}
|
|
49
|
-
const
|
|
49
|
+
const Re = /* @__PURE__ */ R(we, [["render", Ne]]), De = W({
|
|
50
50
|
name: "menu-item",
|
|
51
|
-
components: { BaseButton:
|
|
51
|
+
components: { BaseButton: Ee, BentoTypography: ge, ChevronRightIcon: $e },
|
|
52
52
|
props: {
|
|
53
53
|
/**
|
|
54
54
|
* menu-item text that gets displayed as the main label
|
|
@@ -116,41 +116,41 @@ const De = /* @__PURE__ */ R(Oe, [["render", Re]]), Pe = A({
|
|
|
116
116
|
default: !1
|
|
117
117
|
}
|
|
118
118
|
},
|
|
119
|
-
emits: [
|
|
119
|
+
emits: [J.CLICK],
|
|
120
120
|
setup(e, { emit: o }) {
|
|
121
121
|
const s = E(() => ({
|
|
122
122
|
"b-menu-item--critical": e.critical,
|
|
123
123
|
"b-menu-item--indent": e.indent
|
|
124
|
-
})),
|
|
124
|
+
})), d = E(() => Le(e.secondaryText, 10));
|
|
125
125
|
return {
|
|
126
126
|
// Values
|
|
127
127
|
conditionalClasses: s,
|
|
128
|
-
computedSecondaryText:
|
|
128
|
+
computedSecondaryText: d,
|
|
129
129
|
// Methods
|
|
130
130
|
onClick: (i) => {
|
|
131
|
-
i.stopPropagation(), e.handler(), o(
|
|
131
|
+
i.stopPropagation(), e.handler(), o(J.CLICK);
|
|
132
132
|
}
|
|
133
133
|
};
|
|
134
134
|
}
|
|
135
135
|
});
|
|
136
|
-
function
|
|
136
|
+
function Pe(e, o, v, s, d, b) {
|
|
137
137
|
const i = B("bento-typography"), a = B("chevron-right-icon"), u = B("base-button");
|
|
138
138
|
return p(), S(u, {
|
|
139
|
-
class:
|
|
139
|
+
class: Q(["b-menu-item", e.conditionalClasses]),
|
|
140
140
|
role: "menuitem",
|
|
141
141
|
disabled: e.disabled,
|
|
142
142
|
tabindex: "-1",
|
|
143
143
|
onClick: e.onClick
|
|
144
|
-
},
|
|
145
|
-
default:
|
|
144
|
+
}, ee({
|
|
145
|
+
default: I(() => [
|
|
146
146
|
$(i, {
|
|
147
147
|
el: "span",
|
|
148
148
|
variant: "body",
|
|
149
149
|
stronger: e.isTitle,
|
|
150
150
|
class: "b-menu-item__primary-text"
|
|
151
151
|
}, {
|
|
152
|
-
default:
|
|
153
|
-
|
|
152
|
+
default: I(() => [
|
|
153
|
+
j(V(e.text), 1)
|
|
154
154
|
]),
|
|
155
155
|
_: 1
|
|
156
156
|
}, 8, ["stronger"]),
|
|
@@ -160,18 +160,18 @@ function We(e, o, v, s, c, b) {
|
|
|
160
160
|
variant: "body",
|
|
161
161
|
class: "b-menu-item__secondary-text"
|
|
162
162
|
}, {
|
|
163
|
-
default:
|
|
164
|
-
|
|
163
|
+
default: I(() => [
|
|
164
|
+
j(V(e.computedSecondaryText), 1)
|
|
165
165
|
]),
|
|
166
166
|
_: 1
|
|
167
|
-
})) :
|
|
167
|
+
})) : w("", !0)
|
|
168
168
|
]),
|
|
169
169
|
_: 2
|
|
170
170
|
}, [
|
|
171
171
|
e.icon ? {
|
|
172
172
|
name: "iconLeft",
|
|
173
|
-
fn:
|
|
174
|
-
(p(), S(
|
|
173
|
+
fn: I(() => [
|
|
174
|
+
(p(), S(re(e.icon), {
|
|
175
175
|
class: "b-menu-item__icon-left",
|
|
176
176
|
"aria-hidden": "true"
|
|
177
177
|
}))
|
|
@@ -180,48 +180,48 @@ function We(e, o, v, s, c, b) {
|
|
|
180
180
|
} : void 0,
|
|
181
181
|
e.chevron ? {
|
|
182
182
|
name: "iconRight",
|
|
183
|
-
fn:
|
|
183
|
+
fn: I(() => [
|
|
184
184
|
$(a, { "aria-hidden": "true" })
|
|
185
185
|
]),
|
|
186
186
|
key: "1"
|
|
187
187
|
} : void 0
|
|
188
188
|
]), 1032, ["class", "disabled", "onClick"]);
|
|
189
189
|
}
|
|
190
|
-
const
|
|
190
|
+
const ue = /* @__PURE__ */ R(De, [["render", Pe], ["__scopeId", "data-v-4cecac65"]]);
|
|
191
191
|
var M = /* @__PURE__ */ ((e) => (e.BACK = "back", e.CLOSE = "close", e.OPEN = "open", e))(M || {});
|
|
192
|
-
const
|
|
192
|
+
const We = Symbol("menu registering injection key"), Ke = {
|
|
193
193
|
name: "bento-menu-list-container"
|
|
194
|
-
},
|
|
194
|
+
}, Ae = /* @__PURE__ */ W({
|
|
195
195
|
...Ke,
|
|
196
196
|
setup(e) {
|
|
197
|
-
const o =
|
|
198
|
-
|
|
197
|
+
const o = c(), v = c({}), s = te(
|
|
198
|
+
We,
|
|
199
199
|
!1
|
|
200
200
|
);
|
|
201
201
|
if (s) {
|
|
202
|
-
const { registerMenuContainerElement:
|
|
203
|
-
|
|
202
|
+
const { registerMenuContainerElement: d } = s;
|
|
203
|
+
d(o), v.value = {
|
|
204
204
|
mouseleave: s == null ? void 0 : s.menuMouseLeave
|
|
205
205
|
};
|
|
206
206
|
}
|
|
207
|
-
return (
|
|
207
|
+
return (d, b) => (p(), L("div", X({
|
|
208
208
|
ref_key: "menuListContainerRef",
|
|
209
209
|
ref: o,
|
|
210
210
|
class: "b-menu-list-container",
|
|
211
211
|
"data-testid": "menu-list-container"
|
|
212
|
-
},
|
|
213
|
-
|
|
212
|
+
}, ce(v.value, !0)), [
|
|
213
|
+
G(d.$slots, "default", {}, void 0, !0)
|
|
214
214
|
], 16));
|
|
215
215
|
}
|
|
216
|
-
}),
|
|
216
|
+
}), ae = /* @__PURE__ */ R(Ae, [["__scopeId", "data-v-02a3ca45"]]), Y = {
|
|
217
217
|
"en-US": {
|
|
218
218
|
backButton: "Go back",
|
|
219
219
|
menuButton: "Open menu"
|
|
220
220
|
}
|
|
221
|
-
}, xe =
|
|
222
|
-
i18n: { messages:
|
|
221
|
+
}, xe = W({
|
|
222
|
+
i18n: { messages: Y },
|
|
223
223
|
name: "sub-menu-item-list",
|
|
224
|
-
components: { BentoDivider:
|
|
224
|
+
components: { BentoDivider: ie, MenuItem: ue, MenuListContainer: ae },
|
|
225
225
|
props: {
|
|
226
226
|
items: {
|
|
227
227
|
type: Array,
|
|
@@ -234,7 +234,7 @@ const Ae = Symbol("menu registering injection key"), Ke = {
|
|
|
234
234
|
},
|
|
235
235
|
emits: [M.CLOSE, M.BACK],
|
|
236
236
|
setup(e, { emit: o }) {
|
|
237
|
-
const v =
|
|
237
|
+
const v = c(null), s = c(0), d = c(e.items.length), b = () => o(M.CLOSE), i = () => o(M.BACK), a = E(() => {
|
|
238
238
|
var m;
|
|
239
239
|
const l = (m = e.items) == null ? void 0 : m.map((f) => ({
|
|
240
240
|
...f,
|
|
@@ -247,7 +247,7 @@ const Ae = Symbol("menu registering injection key"), Ke = {
|
|
|
247
247
|
text: e.title,
|
|
248
248
|
secondaryText: null,
|
|
249
249
|
critical: !1,
|
|
250
|
-
icon:
|
|
250
|
+
icon: z,
|
|
251
251
|
isTitle: !0,
|
|
252
252
|
disabled: !1,
|
|
253
253
|
indent: !1,
|
|
@@ -261,13 +261,13 @@ const Ae = Symbol("menu registering injection key"), Ke = {
|
|
|
261
261
|
var l, m, f, y, k;
|
|
262
262
|
(k = (y = (f = (m = (l = v.value) == null ? void 0 : l.children) == null ? void 0 : m[s.value]) == null ? void 0 : f.children) == null ? void 0 : y[0]) == null || k.focus();
|
|
263
263
|
};
|
|
264
|
-
|
|
264
|
+
ne(async () => {
|
|
265
265
|
setTimeout(() => u(), 150);
|
|
266
266
|
});
|
|
267
267
|
const n = () => {
|
|
268
|
-
s.value > 0 ? (s.value -= 1, a.value[s.value].disabled && n()) : s.value =
|
|
268
|
+
s.value > 0 ? (s.value -= 1, a.value[s.value].disabled && n()) : s.value = d.value, u();
|
|
269
269
|
}, t = () => {
|
|
270
|
-
s.value <
|
|
270
|
+
s.value < d.value ? (s.value += 1, a.value[s.value].disabled && t()) : s.value = 0, u();
|
|
271
271
|
};
|
|
272
272
|
return {
|
|
273
273
|
// Enums
|
|
@@ -275,7 +275,7 @@ const Ae = Symbol("menu registering injection key"), Ke = {
|
|
|
275
275
|
// Values
|
|
276
276
|
subMenuItemListRefLocal: v,
|
|
277
277
|
subMenuFocusedIndex: s,
|
|
278
|
-
ChevronLeftIcon:
|
|
278
|
+
ChevronLeftIcon: z,
|
|
279
279
|
computedItems: a,
|
|
280
280
|
// Methods
|
|
281
281
|
closeMenu: b,
|
|
@@ -285,26 +285,26 @@ const Ae = Symbol("menu registering injection key"), Ke = {
|
|
|
285
285
|
};
|
|
286
286
|
}
|
|
287
287
|
});
|
|
288
|
-
function
|
|
288
|
+
function He(e, o, v, s, d, b) {
|
|
289
289
|
const i = B("menu-item"), a = B("bento-divider"), u = B("menu-list-container");
|
|
290
|
-
return p(), S(
|
|
290
|
+
return p(), S(de, {
|
|
291
291
|
name: "b-sub-menu-item-list__transition",
|
|
292
292
|
appear: ""
|
|
293
293
|
}, {
|
|
294
|
-
default:
|
|
294
|
+
default: I(() => [
|
|
295
295
|
$(u, { class: "b-sub-menu-item-list" }, {
|
|
296
|
-
default:
|
|
297
|
-
|
|
296
|
+
default: I(() => [
|
|
297
|
+
P("ul", {
|
|
298
298
|
ref: "subMenuItemListRefLocal",
|
|
299
299
|
role: "menu",
|
|
300
300
|
class: "b-sub-menu-item-list__list",
|
|
301
301
|
onKeydown: [
|
|
302
|
-
o[0] || (o[0] = g(
|
|
303
|
-
o[1] || (o[1] = g(
|
|
304
|
-
o[2] || (o[2] = g(
|
|
302
|
+
o[0] || (o[0] = g(U((...n) => e.focusNext && e.focusNext(...n), ["stop"]), ["down"])),
|
|
303
|
+
o[1] || (o[1] = g(U((...n) => e.focusPrevious && e.focusPrevious(...n), ["stop"]), ["up"])),
|
|
304
|
+
o[2] || (o[2] = g(U((...n) => e.onBackButton && e.onBackButton(...n), ["stop"]), ["esc"]))
|
|
305
305
|
]
|
|
306
306
|
}, [
|
|
307
|
-
(p(!0),
|
|
307
|
+
(p(!0), L(oe, null, se(e.computedItems, (n, t) => (p(), L("li", {
|
|
308
308
|
key: `sub-menu-item-list-item-${t}`,
|
|
309
309
|
role: "none"
|
|
310
310
|
}, [
|
|
@@ -323,7 +323,7 @@ function Fe(e, o, v, s, c, b) {
|
|
|
323
323
|
n.addDivider ? (p(), S(a, {
|
|
324
324
|
key: 0,
|
|
325
325
|
class: "b-sub-menu-item-list__divider"
|
|
326
|
-
})) :
|
|
326
|
+
})) : w("", !0)
|
|
327
327
|
]))), 128))
|
|
328
328
|
], 544)
|
|
329
329
|
]),
|
|
@@ -333,9 +333,9 @@ function Fe(e, o, v, s, c, b) {
|
|
|
333
333
|
_: 1
|
|
334
334
|
});
|
|
335
335
|
}
|
|
336
|
-
const
|
|
337
|
-
function
|
|
338
|
-
const b =
|
|
336
|
+
const Fe = /* @__PURE__ */ R(xe, [["render", He], ["__scopeId", "data-v-621db243"]]);
|
|
337
|
+
function Ue(e, o, v) {
|
|
338
|
+
const b = c(0), i = c(0), a = (n) => {
|
|
339
339
|
if (!n || !n.parentElement)
|
|
340
340
|
return;
|
|
341
341
|
const t = n.parentElement, l = n.cloneNode(!0);
|
|
@@ -345,10 +345,10 @@ function Ve(e, o, v) {
|
|
|
345
345
|
const y = l.offsetHeight;
|
|
346
346
|
i.value = y, t.removeChild(l), i.value = y;
|
|
347
347
|
};
|
|
348
|
-
return
|
|
348
|
+
return me([o, v], async ([n]) => {
|
|
349
349
|
var t, l;
|
|
350
350
|
if (n !== null) {
|
|
351
|
-
await
|
|
351
|
+
await q();
|
|
352
352
|
const m = (l = (t = e.value) == null ? void 0 : t[0]) == null ? void 0 : l.$el;
|
|
353
353
|
m && a(m);
|
|
354
354
|
} else
|
|
@@ -358,9 +358,9 @@ function Ve(e, o, v) {
|
|
|
358
358
|
return v.value && (i.value > 0 && (n.height = `${i.value}px`), b.value > 0 && (n.width = `${b.value}px`)), n;
|
|
359
359
|
}) };
|
|
360
360
|
}
|
|
361
|
-
const
|
|
361
|
+
const Ve = W({
|
|
362
362
|
name: "menu-item-list",
|
|
363
|
-
components: { BentoDivider:
|
|
363
|
+
components: { BentoDivider: ie, MenuItem: ue, MenuListContainer: ae, SubMenuItemList: Fe },
|
|
364
364
|
props: {
|
|
365
365
|
/**
|
|
366
366
|
* The data to be displayed in the list
|
|
@@ -393,29 +393,29 @@ const Ge = A({
|
|
|
393
393
|
},
|
|
394
394
|
emits: [M.CLOSE, "menu-item-click"],
|
|
395
395
|
setup(e, { emit: o, expose: v }) {
|
|
396
|
-
const s =
|
|
397
|
-
let
|
|
398
|
-
return C.icon || (
|
|
396
|
+
const s = c(null), d = c(null), b = c(null), i = c(null), a = c(!1), u = c(null), n = c(e.focusLastElement ? e.data.length - 1 : 0), t = c(0), l = c(e.data.length - 1), m = E(() => e.data.some((C) => C.icon)), f = E(() => e.indentItems || m.value ? e.data.map((C) => {
|
|
397
|
+
let _ = !1;
|
|
398
|
+
return C.icon || (_ = !0), {
|
|
399
399
|
...C,
|
|
400
|
-
indent:
|
|
400
|
+
indent: _
|
|
401
401
|
};
|
|
402
402
|
}) : e.data), y = async () => {
|
|
403
|
-
var C,
|
|
404
|
-
await
|
|
405
|
-
}, k = () => o(M.CLOSE),
|
|
403
|
+
var C, _, r;
|
|
404
|
+
await q(), (r = (_ = (C = d.value) == null ? void 0 : C.children[n.value]) == null ? void 0 : _.children[0]) == null || r.focus();
|
|
405
|
+
}, k = () => o(M.CLOSE), O = (C, _) => {
|
|
406
406
|
if (C.items) {
|
|
407
|
-
u.value =
|
|
407
|
+
u.value = _, a.value = !0;
|
|
408
408
|
return;
|
|
409
409
|
}
|
|
410
|
-
u.value =
|
|
410
|
+
u.value = _, a.value = !1, !C.skipClose && e.closeMenuOnItemSelect !== !1 && k(), o("menu-item-click");
|
|
411
411
|
}, K = () => {
|
|
412
412
|
n.value > 0 ? (n.value -= 1, f.value[n.value].disabled && K()) : n.value = l.value, y();
|
|
413
|
-
},
|
|
414
|
-
n.value < l.value ? (n.value += 1, f.value[n.value].disabled &&
|
|
415
|
-
},
|
|
416
|
-
var
|
|
417
|
-
(
|
|
418
|
-
},
|
|
413
|
+
}, N = () => {
|
|
414
|
+
n.value < l.value ? (n.value += 1, f.value[n.value].disabled && N()) : n.value = 0, y();
|
|
415
|
+
}, T = (C, _) => {
|
|
416
|
+
var r;
|
|
417
|
+
(r = C == null ? void 0 : C.items) != null && r.length && (u.value = _, a.value = !0);
|
|
418
|
+
}, A = () => {
|
|
419
419
|
u.value && a.value && (u.value = null, a.value = !1);
|
|
420
420
|
}, x = () => {
|
|
421
421
|
a.value = !1, u.value = null, y();
|
|
@@ -423,38 +423,38 @@ const Ge = A({
|
|
|
423
423
|
v({
|
|
424
424
|
focusItem: y
|
|
425
425
|
});
|
|
426
|
-
const { computedStyle:
|
|
426
|
+
const { computedStyle: H } = Ue(i, u, a);
|
|
427
427
|
return {
|
|
428
428
|
// Values
|
|
429
|
-
menuItemListRef:
|
|
429
|
+
menuItemListRef: d,
|
|
430
430
|
menuItemListWrapperRef: b,
|
|
431
431
|
subMenuItemListRef: i,
|
|
432
432
|
menuItemRef: s,
|
|
433
433
|
computedData: f,
|
|
434
|
-
computedStyle:
|
|
434
|
+
computedStyle: H,
|
|
435
435
|
focusedIndex: n,
|
|
436
436
|
subMenuFocusedIndex: t,
|
|
437
437
|
showSubMenu: a,
|
|
438
438
|
visibleSubMenuIndex: u,
|
|
439
439
|
// Methods
|
|
440
|
-
menuItemClick:
|
|
440
|
+
menuItemClick: O,
|
|
441
441
|
closeMenu: k,
|
|
442
442
|
focusPrevious: K,
|
|
443
|
-
focusNext:
|
|
444
|
-
focusRight:
|
|
445
|
-
focusLeft:
|
|
443
|
+
focusNext: N,
|
|
444
|
+
focusRight: T,
|
|
445
|
+
focusLeft: A,
|
|
446
446
|
onBackButton: x
|
|
447
447
|
};
|
|
448
448
|
}
|
|
449
|
-
}),
|
|
450
|
-
function
|
|
449
|
+
}), Ge = ["onKeydown"];
|
|
450
|
+
function Xe(e, o, v, s, d, b) {
|
|
451
451
|
const i = B("menu-item"), a = B("bento-divider"), u = B("sub-menu-item-list"), n = B("menu-list-container");
|
|
452
452
|
return p(), S(n, {
|
|
453
453
|
ref: "menuItemListWrapperRef",
|
|
454
|
-
style:
|
|
454
|
+
style: le(e.computedStyle)
|
|
455
455
|
}, {
|
|
456
|
-
default:
|
|
457
|
-
|
|
456
|
+
default: I(() => [
|
|
457
|
+
P("ul", {
|
|
458
458
|
ref: "menuItemListRef",
|
|
459
459
|
class: "b-menu-item-list",
|
|
460
460
|
role: "menu",
|
|
@@ -465,17 +465,17 @@ function qe(e, o, v, s, c, b) {
|
|
|
465
465
|
o[4] || (o[4] = g((...t) => e.closeMenu && e.closeMenu(...t), ["tab"]))
|
|
466
466
|
]
|
|
467
467
|
}, [
|
|
468
|
-
(p(!0),
|
|
468
|
+
(p(!0), L(oe, null, se(e.computedData, (t, l) => {
|
|
469
469
|
var m, f, y, k;
|
|
470
|
-
return p(),
|
|
470
|
+
return p(), L("li", {
|
|
471
471
|
key: `menu-item-${l}`,
|
|
472
472
|
ref_for: !0,
|
|
473
473
|
ref: "menuItemRef",
|
|
474
474
|
class: "b-menu-item-list__item",
|
|
475
475
|
role: "none",
|
|
476
476
|
onKeydown: [
|
|
477
|
-
g((
|
|
478
|
-
o[0] || (o[0] = g((
|
|
477
|
+
g((O) => e.focusRight(t, l), ["right"]),
|
|
478
|
+
o[0] || (o[0] = g((O) => e.focusLeft(), ["left"]))
|
|
479
479
|
]
|
|
480
480
|
}, [
|
|
481
481
|
$(i, {
|
|
@@ -490,12 +490,12 @@ function qe(e, o, v, s, c, b) {
|
|
|
490
490
|
tabindex: l === e.subMenuFocusedIndex ? "0" : "-1",
|
|
491
491
|
"aria-haspopup": !!((y = t.items) != null && y.length),
|
|
492
492
|
"aria-expanded": e.showSubMenu && e.visibleSubMenuIndex === l,
|
|
493
|
-
onClick: (
|
|
493
|
+
onClick: (O) => e.menuItemClick(t, l)
|
|
494
494
|
}, null, 8, ["text", "handler", "secondary-text", "icon", "chevron", "disabled", "critical", "indent", "tabindex", "aria-haspopup", "aria-expanded", "onClick"]),
|
|
495
495
|
t.addDivider ? (p(), S(a, {
|
|
496
496
|
key: 0,
|
|
497
497
|
class: "b-menu-item-list__divider"
|
|
498
|
-
})) :
|
|
498
|
+
})) : w("", !0),
|
|
499
499
|
(k = t.items) != null && k.length && e.showSubMenu && e.visibleSubMenuIndex === l ? (p(), S(u, {
|
|
500
500
|
key: 1,
|
|
501
501
|
ref_for: !0,
|
|
@@ -504,19 +504,19 @@ function qe(e, o, v, s, c, b) {
|
|
|
504
504
|
title: t.text,
|
|
505
505
|
onBack: e.onBackButton,
|
|
506
506
|
onClose: e.closeMenu
|
|
507
|
-
}, null, 8, ["items", "title", "onBack", "onClose"])) :
|
|
508
|
-
], 40,
|
|
507
|
+
}, null, 8, ["items", "title", "onBack", "onClose"])) : w("", !0)
|
|
508
|
+
], 40, Ge);
|
|
509
509
|
}), 128))
|
|
510
510
|
], 544)
|
|
511
511
|
]),
|
|
512
512
|
_: 1
|
|
513
513
|
}, 8, ["style"]);
|
|
514
514
|
}
|
|
515
|
-
const
|
|
516
|
-
i18n: { messages:
|
|
515
|
+
const qe = /* @__PURE__ */ R(Ve, [["render", Xe], ["__scopeId", "data-v-999aa4e9"]]), Ye = {
|
|
516
|
+
i18n: { messages: Y },
|
|
517
517
|
name: "bento-menu"
|
|
518
|
-
},
|
|
519
|
-
...
|
|
518
|
+
}, je = /* @__PURE__ */ W({
|
|
519
|
+
...Ye,
|
|
520
520
|
props: {
|
|
521
521
|
button: { default: () => ({
|
|
522
522
|
variant: "secondary"
|
|
@@ -524,7 +524,7 @@ const Ye = /* @__PURE__ */ R(Ge, [["render", qe], ["__scopeId", "data-v-999aa4e9
|
|
|
524
524
|
closeMenuOnItemSelect: { type: Boolean, default: !0 },
|
|
525
525
|
data: {},
|
|
526
526
|
disableArrowDownOpeningMenu: { type: Boolean, default: !1 },
|
|
527
|
-
menuPosition: { default:
|
|
527
|
+
menuPosition: { default: ye.BOTTOM_START },
|
|
528
528
|
menuFixedPositioning: { type: Boolean, default: !1 },
|
|
529
529
|
menuWidth: { default: null },
|
|
530
530
|
revertFocusToButton: { type: Boolean, default: !0 },
|
|
@@ -533,74 +533,73 @@ const Ye = /* @__PURE__ */ R(Ge, [["render", qe], ["__scopeId", "data-v-999aa4e9
|
|
|
533
533
|
},
|
|
534
534
|
emits: ["menu-item-click", "click-outside"],
|
|
535
535
|
setup(e, { expose: o, emit: v }) {
|
|
536
|
-
var
|
|
537
|
-
const s = e,
|
|
538
|
-
ve
|
|
536
|
+
var _;
|
|
537
|
+
const s = e, d = v, b = fe(), i = he(b), { t: a } = Ie({ messages: Y }), u = c(null), n = c(null), t = c(!1), l = c(!1), m = c(null), f = _e("menu"), y = te(Te, c(!1));
|
|
538
|
+
pe(ve, y);
|
|
539
539
|
const k = E(() => ({
|
|
540
540
|
"b-menu--inverse": y.value
|
|
541
|
-
})),
|
|
541
|
+
})), O = E(() => s.menuWidth ? { width: `${s.menuWidth}px` } : null), K = E(() => {
|
|
542
542
|
if (s != null && s.button)
|
|
543
543
|
return {
|
|
544
544
|
variant: "secondary",
|
|
545
545
|
...s.button
|
|
546
546
|
};
|
|
547
|
-
}),
|
|
548
|
-
t.value = !0,
|
|
549
|
-
},
|
|
550
|
-
var
|
|
551
|
-
t.value && (t.value = !1,
|
|
552
|
-
},
|
|
553
|
-
|
|
554
|
-
},
|
|
555
|
-
|
|
556
|
-
},
|
|
557
|
-
|
|
558
|
-
},
|
|
559
|
-
|
|
547
|
+
}), N = () => {
|
|
548
|
+
t.value = !0, d(M.OPEN);
|
|
549
|
+
}, T = async (r = s.revertFocusToButton) => {
|
|
550
|
+
var D, F;
|
|
551
|
+
t.value && (t.value = !1, r && (await q(), (F = (D = u.value) == null ? void 0 : D.$el) == null || F.focus()), d(M.CLOSE));
|
|
552
|
+
}, A = (r) => {
|
|
553
|
+
r.stopPropagation(), t.value ? T() : N();
|
|
554
|
+
}, x = (r) => {
|
|
555
|
+
r.preventDefault(), l.value = !1, s.disableArrowDownOpeningMenu || N();
|
|
556
|
+
}, H = (r) => {
|
|
557
|
+
r.preventDefault(), l.value = !0, N();
|
|
558
|
+
}, C = () => {
|
|
559
|
+
d("menu-item-click");
|
|
560
560
|
};
|
|
561
|
-
return
|
|
561
|
+
return Ce(
|
|
562
562
|
m,
|
|
563
563
|
() => {
|
|
564
|
-
|
|
564
|
+
T(), d("click-outside");
|
|
565
565
|
},
|
|
566
566
|
{
|
|
567
567
|
...s.closeOnClickOutsideOptions,
|
|
568
|
-
ignore: [u, ...((
|
|
568
|
+
ignore: [u, ...((_ = s.closeOnClickOutsideOptions) == null ? void 0 : _.ignore) ?? []]
|
|
569
569
|
}
|
|
570
570
|
), o({
|
|
571
571
|
/**
|
|
572
572
|
* Control to enable programmatic closing of the menu
|
|
573
573
|
*/
|
|
574
|
-
closeMenu:
|
|
575
|
-
}),
|
|
576
|
-
i("iconRight") &&
|
|
574
|
+
closeMenu: T
|
|
575
|
+
}), ne(() => {
|
|
576
|
+
i("iconRight") && ke(
|
|
577
577
|
'"bento-menu" no longer supports the "iconRight" slot. The right-aligned icon is now fixed by design.'
|
|
578
578
|
);
|
|
579
|
-
}), (
|
|
580
|
-
class:
|
|
579
|
+
}), (r, D) => (p(), L("div", {
|
|
580
|
+
class: Q([k.value, "b-menu"]),
|
|
581
581
|
"data-testid": "menu",
|
|
582
582
|
onKeydown: [
|
|
583
|
-
g(
|
|
584
|
-
g(
|
|
585
|
-
|
|
583
|
+
g(x, ["down"]),
|
|
584
|
+
g(H, ["up"]),
|
|
585
|
+
D[0] || (D[0] = g((F) => T(), ["esc"]))
|
|
586
586
|
]
|
|
587
587
|
}, [
|
|
588
|
-
$(h(
|
|
588
|
+
$(h(Be), X({
|
|
589
589
|
ref_key: "menuButtonRef",
|
|
590
590
|
ref: u,
|
|
591
591
|
"aria-haspopup": "true"
|
|
592
592
|
}, K.value, {
|
|
593
593
|
"aria-controls": t.value ? h(f) : null,
|
|
594
|
-
"aria-label": H(d.$attrs),
|
|
595
594
|
toggled: t.value,
|
|
596
595
|
inverse: h(y),
|
|
597
|
-
onClick:
|
|
598
|
-
}),
|
|
596
|
+
onClick: A
|
|
597
|
+
}), ee({ _: 2 }, [
|
|
599
598
|
!h(i)("default") || h(i)("iconLeft") ? {
|
|
600
599
|
name: "iconLeft",
|
|
601
|
-
fn:
|
|
602
|
-
|
|
603
|
-
$(h(
|
|
600
|
+
fn: I(() => [
|
|
601
|
+
G(r.$slots, "iconLeft", {}, () => [
|
|
602
|
+
$(h(Re), {
|
|
604
603
|
title: h(a)("menuButton")
|
|
605
604
|
}, null, 8, ["title"])
|
|
606
605
|
], !0)
|
|
@@ -609,25 +608,25 @@ const Ye = /* @__PURE__ */ R(Ge, [["render", qe], ["__scopeId", "data-v-999aa4e9
|
|
|
609
608
|
} : void 0,
|
|
610
609
|
h(i)("default") ? {
|
|
611
610
|
name: "default",
|
|
612
|
-
fn:
|
|
613
|
-
|
|
611
|
+
fn: I(() => [
|
|
612
|
+
G(r.$slots, "default", {}, void 0, !0)
|
|
614
613
|
]),
|
|
615
614
|
key: "1"
|
|
616
615
|
} : void 0,
|
|
617
616
|
h(i)("default") ? {
|
|
618
617
|
name: "iconRight",
|
|
619
|
-
fn:
|
|
620
|
-
$(h(
|
|
618
|
+
fn: I(() => [
|
|
619
|
+
$(h(Me))
|
|
621
620
|
]),
|
|
622
621
|
key: "2"
|
|
623
622
|
} : void 0
|
|
624
|
-
]), 1040, ["aria-controls", "
|
|
625
|
-
u.value ? (p(), S(h(
|
|
623
|
+
]), 1040, ["aria-controls", "toggled", "inverse"]),
|
|
624
|
+
u.value ? (p(), S(h(Se), {
|
|
626
625
|
key: 0,
|
|
627
|
-
disabled: !
|
|
626
|
+
disabled: !r.teleport
|
|
628
627
|
}, {
|
|
629
|
-
default:
|
|
630
|
-
u.value ? (p(), S(h(
|
|
628
|
+
default: I(() => [
|
|
629
|
+
u.value ? (p(), S(h(be), {
|
|
631
630
|
key: 0,
|
|
632
631
|
id: h(f),
|
|
633
632
|
ref_key: "popoverRef",
|
|
@@ -635,10 +634,10 @@ const Ye = /* @__PURE__ */ R(Ge, [["render", qe], ["__scopeId", "data-v-999aa4e9
|
|
|
635
634
|
role: null,
|
|
636
635
|
open: t.value,
|
|
637
636
|
class: "b-menu__popover",
|
|
638
|
-
style:
|
|
637
|
+
style: le(O.value),
|
|
639
638
|
"target-element": u.value,
|
|
640
|
-
position:
|
|
641
|
-
"fixed-positioning":
|
|
639
|
+
position: r.menuPosition,
|
|
640
|
+
"fixed-positioning": r.menuFixedPositioning,
|
|
642
641
|
"fallback-position": [
|
|
643
642
|
"bottom-start",
|
|
644
643
|
"bottom-end",
|
|
@@ -649,33 +648,33 @@ const Ye = /* @__PURE__ */ R(Ge, [["render", qe], ["__scopeId", "data-v-999aa4e9
|
|
|
649
648
|
"left-start",
|
|
650
649
|
"left-end"
|
|
651
650
|
],
|
|
652
|
-
teleport:
|
|
651
|
+
teleport: r.teleport,
|
|
653
652
|
"without-space": ""
|
|
654
653
|
}, {
|
|
655
|
-
default:
|
|
656
|
-
$(h(
|
|
654
|
+
default: I(() => [
|
|
655
|
+
$(h(qe), {
|
|
657
656
|
ref_key: "menuItemListRef",
|
|
658
657
|
ref: n,
|
|
659
|
-
"close-menu-on-item-select":
|
|
660
|
-
data:
|
|
658
|
+
"close-menu-on-item-select": r.closeMenuOnItemSelect,
|
|
659
|
+
data: r.data,
|
|
661
660
|
"focus-last-element": l.value,
|
|
662
|
-
onClose:
|
|
663
|
-
onMenuItemClick:
|
|
661
|
+
onClose: T,
|
|
662
|
+
onMenuItemClick: C
|
|
664
663
|
}, null, 8, ["close-menu-on-item-select", "data", "focus-last-element"])
|
|
665
664
|
]),
|
|
666
665
|
_: 1
|
|
667
|
-
}, 8, ["id", "open", "style", "target-element", "position", "fixed-positioning", "teleport"])) :
|
|
666
|
+
}, 8, ["id", "open", "style", "target-element", "position", "fixed-positioning", "teleport"])) : w("", !0)
|
|
668
667
|
]),
|
|
669
668
|
_: 1
|
|
670
|
-
}, 8, ["disabled"])) :
|
|
669
|
+
}, 8, ["disabled"])) : w("", !0)
|
|
671
670
|
], 34));
|
|
672
671
|
}
|
|
673
|
-
}),
|
|
672
|
+
}), ft = /* @__PURE__ */ R(je, [["__scopeId", "data-v-6f029bdb"]]);
|
|
674
673
|
export {
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
674
|
+
ft as B,
|
|
675
|
+
We as D,
|
|
676
|
+
Te as M,
|
|
677
|
+
Re as O,
|
|
679
678
|
M as a
|
|
680
679
|
};
|
|
681
|
-
//# sourceMappingURL=menu.
|
|
680
|
+
//# sourceMappingURL=menu.EtjeOPXX.js.map
|