@adyen/bento-vue2 1.62.0 → 1.63.0

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.
Files changed (145) hide show
  1. package/dist/@types/index.d.ts +181 -235
  2. package/dist/accordion.js +1 -1
  3. package/dist/action-bar.js +1 -1
  4. package/dist/assets/accordion-item.css +1 -1
  5. package/dist/assets/action-bar.css +1 -1
  6. package/dist/assets/base-modal.css +1 -1
  7. package/dist/assets/card.css +1 -1
  8. package/dist/assets/checkbox-input.css +1 -1
  9. package/dist/assets/data-grid.css +1 -1
  10. package/dist/assets/date-range-picker.css +1 -1
  11. package/dist/assets/dialog-page.css +1 -1
  12. package/dist/assets/file-uploader.css +1 -1
  13. package/dist/assets/header-with-views.css +1 -1
  14. package/dist/assets/inspector.css +1 -1
  15. package/dist/assets/listbox-option-tag.css +1 -1
  16. package/dist/assets/menu.css +1 -1
  17. package/dist/assets/modal-fullscreen.css +1 -1
  18. package/dist/assets/popover.css +1 -1
  19. package/dist/assets/sidepanel.css +1 -1
  20. package/dist/assets/use-cached-selected-values.css +1 -1
  21. package/dist/card.js +1 -1
  22. package/dist/checkbox.js +3 -3
  23. package/dist/chunks/{accordion-item.D1t0oHlP.js → accordion-item.BNtdoVto.js} +9 -8
  24. package/dist/chunks/{accordion-item.D1t0oHlP.js.map → accordion-item.BNtdoVto.js.map} +1 -1
  25. package/dist/chunks/{action-bar.whU1em8H.js → action-bar.Dsp7iRxz.js} +2 -2
  26. package/dist/chunks/{action-bar.whU1em8H.js.map → action-bar.Dsp7iRxz.js.map} +1 -1
  27. package/dist/chunks/{button-actions-with-menu.RoaQFPKT.js → button-actions-with-menu.CtW_16tY.js} +2 -2
  28. package/dist/chunks/{button-actions-with-menu.RoaQFPKT.js.map → button-actions-with-menu.CtW_16tY.js.map} +1 -1
  29. package/dist/chunks/{calendar.DoOFNX-Z.js → calendar.DbTC35rM.js} +2 -2
  30. package/dist/chunks/{calendar.DoOFNX-Z.js.map → calendar.DbTC35rM.js.map} +1 -1
  31. package/dist/chunks/card.CypgT0Ji.js +136 -0
  32. package/dist/chunks/card.CypgT0Ji.js.map +1 -0
  33. package/dist/chunks/{checkbox-group.B0IGYf1q.js → checkbox-group.6y92U6AF.js} +2 -2
  34. package/dist/chunks/{checkbox-group.B0IGYf1q.js.map → checkbox-group.6y92U6AF.js.map} +1 -1
  35. package/dist/chunks/checkbox-input.CNWigbX4.js +117 -0
  36. package/dist/chunks/checkbox-input.CNWigbX4.js.map +1 -0
  37. package/dist/chunks/{checkbox.DkCukYh0.js → checkbox.C9nJVvMq.js} +9 -8
  38. package/dist/chunks/{checkbox.DkCukYh0.js.map → checkbox.C9nJVvMq.js.map} +1 -1
  39. package/dist/chunks/chevron-down.eYtgv5ly.js +24 -0
  40. package/dist/chunks/chevron-down.eYtgv5ly.js.map +1 -0
  41. package/dist/chunks/{chevron-left.BS24hEFa.js → chevron-right.C--ZOC9j.js} +5 -5
  42. package/dist/chunks/chevron-right.C--ZOC9j.js.map +1 -0
  43. package/dist/chunks/chevron-up.d8cwIlA_.js +24 -0
  44. package/dist/chunks/chevron-up.d8cwIlA_.js.map +1 -0
  45. package/dist/chunks/{code-snippet.n93oYvH4.js → code-snippet.CBU8Tlbs.js} +2 -2
  46. package/dist/chunks/{code-snippet.n93oYvH4.js.map → code-snippet.CBU8Tlbs.js.map} +1 -1
  47. package/dist/chunks/{dashboard-section.BEw-n-XQ.js → dashboard-section.CspNW0CA.js} +3 -3
  48. package/dist/chunks/{dashboard-section.BEw-n-XQ.js.map → dashboard-section.CspNW0CA.js.map} +1 -1
  49. package/dist/chunks/{data-grid-template.DGFmCUII.js → data-grid-template.BhzgqkZp.js} +3 -3
  50. package/dist/chunks/{data-grid-template.DGFmCUII.js.map → data-grid-template.BhzgqkZp.js.map} +1 -1
  51. package/dist/chunks/{data-grid.BcGRXt9C.js → data-grid.BfsBhYpW.js} +451 -452
  52. package/dist/chunks/data-grid.BfsBhYpW.js.map +1 -0
  53. package/dist/chunks/{date-picker.Dc_HdQnr.js → date-picker.CPQ6WLZE.js} +3 -3
  54. package/dist/chunks/{date-picker.Dc_HdQnr.js.map → date-picker.CPQ6WLZE.js.map} +1 -1
  55. package/dist/chunks/date-range-picker.CNB28UaM.js +1005 -0
  56. package/dist/chunks/date-range-picker.CNB28UaM.js.map +1 -0
  57. package/dist/chunks/{dropdown-default-textbox.7PMxHqoa.js → dropdown-default-textbox.BNuuA4ES.js} +15 -14
  58. package/dist/chunks/{dropdown-default-textbox.7PMxHqoa.js.map → dropdown-default-textbox.BNuuA4ES.js.map} +1 -1
  59. package/dist/chunks/{dropdown-tag.qKSu6xYY.js → dropdown-tag.DmVsDrL_.js} +3 -3
  60. package/dist/chunks/{dropdown-tag.qKSu6xYY.js.map → dropdown-tag.DmVsDrL_.js.map} +1 -1
  61. package/dist/chunks/{dropdown.BNLPzKbr.js → dropdown.B_PWXFtT.js} +3 -3
  62. package/dist/chunks/{dropdown.BNLPzKbr.js.map → dropdown.B_PWXFtT.js.map} +1 -1
  63. package/dist/chunks/es6.n1ewaW31.js.map +1 -1
  64. package/dist/chunks/{filter-bar.TiqZofNt.js → filter-bar.D6HeYnzZ.js} +15 -14
  65. package/dist/chunks/{filter-bar.TiqZofNt.js.map → filter-bar.D6HeYnzZ.js.map} +1 -1
  66. package/dist/chunks/{fixed-scroller.Ctz5dFqz.js → fixed-scroller.XN-jvWqb.js} +12 -12
  67. package/dist/chunks/fixed-scroller.XN-jvWqb.js.map +1 -0
  68. package/dist/chunks/{header-with-views.MFHmiIXb.js → header-with-views.Dkn8IDew.js} +270 -270
  69. package/dist/chunks/header-with-views.Dkn8IDew.js.map +1 -0
  70. package/dist/chunks/{header.B1PrBQG0.js → header.DNzQO7u-.js} +2 -2
  71. package/dist/chunks/{header.B1PrBQG0.js.map → header.DNzQO7u-.js.map} +1 -1
  72. package/dist/chunks/{input-field-password.BlX3Icgt.js → input-field-password.CY3eRVpe.js} +3 -3
  73. package/dist/chunks/{input-field-password.BlX3Icgt.js.map → input-field-password.CY3eRVpe.js.map} +1 -1
  74. package/dist/chunks/{input-field-phone-number.Ofvi2A48.js → input-field-phone-number.CN5qZ0VL.js} +3 -3
  75. package/dist/chunks/{input-field-phone-number.Ofvi2A48.js.map → input-field-phone-number.CN5qZ0VL.js.map} +1 -1
  76. package/dist/chunks/{input-field.Dck9dAeK.js → input-field.DKhsSYF8.js} +2 -2
  77. package/dist/chunks/{input-field.Dck9dAeK.js.map → input-field.DKhsSYF8.js.map} +1 -1
  78. package/dist/chunks/{listbox-option-tag.EzSkn_lM.js → listbox-option-tag.DFmB_TuD.js} +9 -9
  79. package/dist/chunks/listbox-option-tag.DFmB_TuD.js.map +1 -0
  80. package/dist/chunks/menu.W_kuhRKI.js +514 -0
  81. package/dist/chunks/menu.W_kuhRKI.js.map +1 -0
  82. package/dist/chunks/minus-small.DJacLGTw.js +27 -0
  83. package/dist/chunks/minus-small.DJacLGTw.js.map +1 -0
  84. package/dist/chunks/{pagination.BvhUFgsT.js → pagination.DvP8FqiW.js} +2 -2
  85. package/dist/chunks/{pagination.BvhUFgsT.js.map → pagination.DvP8FqiW.js.map} +1 -1
  86. package/dist/chunks/{rich-text-editor.BTJpOiYL.js → rich-text-editor.aSOSl4Rz.js} +2 -2
  87. package/dist/chunks/{rich-text-editor.BTJpOiYL.js.map → rich-text-editor.aSOSl4Rz.js.map} +1 -1
  88. package/dist/chunks/{search-bar.Ch1dLZAb.js → search-bar.Sh4A8UId.js} +3 -3
  89. package/dist/chunks/{search-bar.Ch1dLZAb.js.map → search-bar.Sh4A8UId.js.map} +1 -1
  90. package/dist/chunks/{secondary-nav.DBssP9fQ.js → secondary-nav.BFtGx_IN.js} +2 -2
  91. package/dist/chunks/{secondary-nav.DBssP9fQ.js.map → secondary-nav.BFtGx_IN.js.map} +1 -1
  92. package/dist/chunks/{selection-card-group.CjFm-cAm.js → selection-card-group.CrWy35QU.js} +2 -2
  93. package/dist/chunks/{selection-card-group.CjFm-cAm.js.map → selection-card-group.CrWy35QU.js.map} +1 -1
  94. package/dist/chunks/{tabs.zkTl2PQR.js → tabs.Dx6teJGW.js} +2 -2
  95. package/dist/chunks/{tabs.zkTl2PQR.js.map → tabs.Dx6teJGW.js.map} +1 -1
  96. package/dist/chunks/{tutorial.C9PYfB4z.js → tutorial.BNZh6N3h.js} +2 -2
  97. package/dist/chunks/{tutorial.C9PYfB4z.js.map → tutorial.BNZh6N3h.js.map} +1 -1
  98. package/dist/chunks/{use-cached-selected-values.Da6xbfzO.js → use-cached-selected-values.CDBmVxYM.js} +514 -481
  99. package/dist/chunks/use-cached-selected-values.CDBmVxYM.js.map +1 -0
  100. package/dist/code-snippet.js +1 -1
  101. package/dist/dashboard-template.js +1 -1
  102. package/dist/data-grid-template.js +1 -1
  103. package/dist/data-grid.js +1 -1
  104. package/dist/date-picker.js +2 -2
  105. package/dist/date-range-picker.js +2 -2
  106. package/dist/dropdown.js +4 -4
  107. package/dist/filter-bar.js +1 -1
  108. package/dist/header-with-views.js +1 -1
  109. package/dist/header.js +1 -1
  110. package/dist/index.js +31 -31
  111. package/dist/input-field-password.js +1 -1
  112. package/dist/input-field-phone-number.js +1 -1
  113. package/dist/input-field.js +1 -1
  114. package/dist/internal.js +5 -5
  115. package/dist/menu.js +1 -1
  116. package/dist/pagination.js +1 -1
  117. package/dist/rich-text-editor.js +1 -1
  118. package/dist/search-bar.js +2 -2
  119. package/dist/secondary-nav.js +1 -1
  120. package/dist/selection-card.js +1 -1
  121. package/dist/styles/bento-dark.css +4 -0
  122. package/dist/styles/bento-light.css +4 -0
  123. package/dist/styles/bento.css +4 -0
  124. package/dist/styles/legacy.css +4 -0
  125. package/dist/styles/styleguide.css +4 -0
  126. package/dist/tabs.js +1 -1
  127. package/dist/tutorial.js +1 -1
  128. package/dist/web-types.json +176 -120
  129. package/package.json +7 -7
  130. package/dist/chunks/card.Cu6MicVI.js +0 -123
  131. package/dist/chunks/card.Cu6MicVI.js.map +0 -1
  132. package/dist/chunks/checkbox-input.B-4Rw5mp.js +0 -137
  133. package/dist/chunks/checkbox-input.B-4Rw5mp.js.map +0 -1
  134. package/dist/chunks/chevron-left.BS24hEFa.js.map +0 -1
  135. package/dist/chunks/chevron-up.CHK1E4p9.js +0 -43
  136. package/dist/chunks/chevron-up.CHK1E4p9.js.map +0 -1
  137. package/dist/chunks/data-grid.BcGRXt9C.js.map +0 -1
  138. package/dist/chunks/date-range-picker.D6xJAHoB.js +0 -977
  139. package/dist/chunks/date-range-picker.D6xJAHoB.js.map +0 -1
  140. package/dist/chunks/fixed-scroller.Ctz5dFqz.js.map +0 -1
  141. package/dist/chunks/header-with-views.MFHmiIXb.js.map +0 -1
  142. package/dist/chunks/listbox-option-tag.EzSkn_lM.js.map +0 -1
  143. package/dist/chunks/menu.CTVbNfuo.js +0 -601
  144. package/dist/chunks/menu.CTVbNfuo.js.map +0 -1
  145. package/dist/chunks/use-cached-selected-values.Da6xbfzO.js.map +0 -1
@@ -1,601 +0,0 @@
1
- import { defineComponent as M, computed as C, ref as i, inject as P, onMounted as K, watch as j, nextTick as A, provide as q } from "vue";
2
- import { g as L } from "./generate-uid.NJ8tVoha.js";
3
- import { a as R, B as G } from "./popover.B05xkQ4e.js";
4
- import { B as F, D as X } from "./divider.Cc4JFWG_.js";
5
- import { u as Y } from "./use-click-outside.BnhTgpSt.js";
6
- import { u as V } from "./use-has-slot.C9lQZ6nz.js";
7
- import { u as J } from "./i18n.BQkEbtPM.js";
8
- /* empty css */
9
- import { n as I } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
10
- import "./index.Cl4_42j5.js";
11
- import { C as Z, a as T } from "./chevron-left.BS24hEFa.js";
12
- import { a as D, B as z } from "./base-button.-gx_u8Bd.js";
13
- import { B as $ } from "./typography.J1v_SPG3.js";
14
- import { t as Q } from "./truncate.BfIl_-71.js";
15
- import { B as ee } from "./teleport.BV6zrDjA.js";
16
- import { B as te } from "./toggle-button.DEVVvpkw.js";
17
- import "../assets/menu.css";
18
- const ne = Symbol("menu inverse style injection key"), oe = M({
19
- name: "menu-item",
20
- components: { BaseButton: z, BentoTypography: $, ChevronRightIcon: Z },
21
- props: {
22
- /**
23
- * menu-item text that gets displayed as the main label
24
- */
25
- text: {
26
- type: String,
27
- required: !0
28
- },
29
- /**
30
- * menu-item action that gets executed when the MeniItem is clicked
31
- */
32
- handler: {
33
- type: Function,
34
- required: !0
35
- },
36
- /**
37
- * menu-item text that gets displayed as the secondary label
38
- */
39
- secondaryText: {
40
- type: String,
41
- default: null
42
- },
43
- /**
44
- * Optional chevron icon displayed to the right of the menu-item
45
- */
46
- chevron: {
47
- type: Boolean,
48
- default: !1
49
- },
50
- /**
51
- * Optional icon displayed to the left of the menu-item
52
- */
53
- icon: {
54
- // Types for Vue2 (Object) and Vue3 (Function)
55
- // TODO: Remove Object when fully migrated to Vue3
56
- type: [Object, Function],
57
- default: null
58
- },
59
- /**
60
- * Disables menu-item button functionality
61
- */
62
- disabled: {
63
- type: Boolean,
64
- default: !1
65
- },
66
- /**
67
- * Displays an indent variant od the menu-item
68
- */
69
- indent: {
70
- type: Boolean,
71
- default: !1
72
- },
73
- /**
74
- * Displays menu-item button as critical
75
- */
76
- critical: {
77
- type: Boolean,
78
- default: !1
79
- },
80
- /**
81
- * Renders the text in a bold variant
82
- */
83
- isTitle: {
84
- type: Boolean,
85
- default: !1
86
- }
87
- },
88
- emits: [D.CLICK],
89
- setup(o, { emit: e }) {
90
- const t = C(() => ({
91
- "b-menu-item--critical": o.critical,
92
- "b-menu-item--indent": o.indent
93
- })), l = C(() => Q(o.secondaryText, 10));
94
- return {
95
- // Values
96
- conditionalClasses: t,
97
- computedSecondaryText: l,
98
- // Methods
99
- onClick: (f) => {
100
- f.stopPropagation(), o.handler(), e(D.CLICK);
101
- }
102
- };
103
- }
104
- });
105
- var se = function() {
106
- var e = this, n = e._self._c;
107
- return e._self._setupProxy, n("base-button", { staticClass: "b-menu-item", class: e.conditionalClasses, attrs: { role: "menuitem", disabled: e.disabled, tabindex: "-1" }, on: { click: e.onClick }, scopedSlots: e._u([e.icon ? { key: "iconLeft", fn: function() {
108
- return [n(e.icon, { tag: "component", staticClass: "b-menu-item__icon-left", attrs: { "aria-hidden": "true" } })];
109
- }, proxy: !0 } : null, { key: "default", fn: function() {
110
- return [n("bento-typography", { staticClass: "b-menu-item__primary-text", attrs: { el: "span", variant: "body", stronger: e.isTitle } }, [e._v(" " + e._s(e.text) + " ")]), e.computedSecondaryText ? n("bento-typography", { staticClass: "b-menu-item__secondary-text", attrs: { el: "span", variant: "body" } }, [e._v(" " + e._s(e.computedSecondaryText) + " ")]) : e._e()];
111
- }, proxy: !0 }, e.chevron ? { key: "iconRight", fn: function() {
112
- return [n("chevron-right-icon", { attrs: { "aria-hidden": "true" } })];
113
- }, proxy: !0 } : null], null, !0) });
114
- }, ue = [], le = /* @__PURE__ */ I(
115
- oe,
116
- se,
117
- ue,
118
- !1,
119
- null,
120
- "1e289ecc"
121
- );
122
- const W = le.exports;
123
- var b = /* @__PURE__ */ ((o) => (o.BACK = "back", o.CLOSE = "close", o.OPEN = "open", o))(b || {});
124
- const ae = Symbol("menu registering injection key"), ie = {
125
- name: "bento-menu-list-container"
126
- }, re = /* @__PURE__ */ M({
127
- ...ie,
128
- setup(o) {
129
- const e = i(), n = i({}), t = P(
130
- ae,
131
- !1
132
- );
133
- if (t) {
134
- const { registerMenuContainerElement: l } = t;
135
- l(e), n.value = {
136
- mouseleave: t == null ? void 0 : t.menuMouseLeave
137
- };
138
- }
139
- return { __sfc: !0, menuListContainerRef: e, menuListContainerEvents: n, registeringAndMousingOut: t };
140
- }
141
- });
142
- var ce = function() {
143
- var e = this, n = e._self._c, t = e._self._setupProxy;
144
- return n("div", e._g({ ref: "menuListContainerRef", staticClass: "b-menu-list-container", attrs: { "data-testid": "menu-list-container" } }, t.menuListContainerEvents), [e._t("default")], 2);
145
- }, fe = [], de = /* @__PURE__ */ I(
146
- re,
147
- ce,
148
- fe,
149
- !1,
150
- null,
151
- "f5d01392"
152
- );
153
- const U = de.exports, H = {
154
- "en-US": {
155
- backButton: "Go back",
156
- menuButton: "Open menu"
157
- }
158
- }, me = M({
159
- i18n: { messages: H },
160
- name: "sub-menu-item-list",
161
- components: { BentoDivider: F, MenuItem: W, MenuListContainer: U },
162
- props: {
163
- items: {
164
- type: Array,
165
- required: !0
166
- },
167
- title: {
168
- type: String,
169
- required: !0
170
- }
171
- },
172
- emits: [b.CLOSE, b.BACK],
173
- setup(o, { emit: e }) {
174
- const n = i(null), t = i(0), l = i(o.items.length), d = () => e(b.CLOSE), f = () => e(b.BACK), u = C(() => {
175
- var m;
176
- const r = (m = o.items) == null ? void 0 : m.map((p) => ({
177
- ...p,
178
- indent: !p.icon,
179
- isTitle: !1,
180
- clickHandler: d
181
- }));
182
- return [
183
- {
184
- text: o.title,
185
- secondaryText: null,
186
- critical: !1,
187
- icon: T,
188
- isTitle: !0,
189
- disabled: !1,
190
- indent: !1,
191
- handler: f,
192
- clickHandler: f,
193
- addDivider: !0
194
- },
195
- ...r
196
- ];
197
- }), c = async () => {
198
- var r, m, p, v, k;
199
- (k = (v = (p = (m = (r = n.value) == null ? void 0 : r.children) == null ? void 0 : m[t.value]) == null ? void 0 : p.children) == null ? void 0 : v[0]) == null || k.focus();
200
- };
201
- K(async () => {
202
- setTimeout(() => c(), 150);
203
- });
204
- const s = () => {
205
- t.value > 0 ? (t.value -= 1, u.value[t.value].disabled && s()) : t.value = l.value, c();
206
- }, y = () => {
207
- t.value < l.value ? (t.value += 1, u.value[t.value].disabled && y()) : t.value = 0, c();
208
- };
209
- return {
210
- // Enums
211
- BentoMenuEvent: b,
212
- // Values
213
- subMenuItemListRefLocal: n,
214
- subMenuFocusedIndex: t,
215
- ChevronLeftIcon: T,
216
- computedItems: u,
217
- // Methods
218
- closeMenu: d,
219
- onBackButton: f,
220
- focusPrevious: s,
221
- focusNext: y
222
- };
223
- }
224
- });
225
- var pe = function() {
226
- var e = this, n = e._self._c;
227
- return e._self._setupProxy, n("transition", { attrs: { name: "b-sub-menu-item-list__transition", appear: "" } }, [n("menu-list-container", { staticClass: "b-sub-menu-item-list" }, [n("ul", { ref: "subMenuItemListRefLocal", staticClass: "b-sub-menu-item-list__list", attrs: { role: "menu" }, on: { keydown: [function(t) {
228
- return !t.type.indexOf("key") && e._k(t.keyCode, "down", 40, t.key, ["Down", "ArrowDown"]) ? null : (t.stopPropagation(), e.focusNext.apply(null, arguments));
229
- }, function(t) {
230
- return !t.type.indexOf("key") && e._k(t.keyCode, "up", 38, t.key, ["Up", "ArrowUp"]) ? null : (t.stopPropagation(), e.focusPrevious.apply(null, arguments));
231
- }, function(t) {
232
- return !t.type.indexOf("key") && e._k(t.keyCode, "esc", 27, t.key, ["Esc", "Escape"]) ? null : (t.stopPropagation(), e.onBackButton.apply(null, arguments));
233
- }] } }, e._l(e.computedItems, function(t, l) {
234
- return n("li", { key: `sub-menu-item-list-item-${l}`, attrs: { role: "none" } }, [n("menu-item", { attrs: { text: t.text, handler: t.handler, "secondary-text": t.secondaryText, icon: t.icon, "is-title": t.isTitle, disabled: t.disabled, critical: t.critical, indent: t.indent, tabindex: l === e.subMenuFocusedIndex ? "0" : "-1" }, on: { click: t.clickHandler } }), t.addDivider ? n("bento-divider", { staticClass: "b-sub-menu-item-list__divider" }) : e._e()], 1);
235
- }), 0)])], 1);
236
- }, _e = [], ye = /* @__PURE__ */ I(
237
- me,
238
- pe,
239
- _e,
240
- !1,
241
- null,
242
- "25195627"
243
- );
244
- const ve = ye.exports;
245
- function be(o, e, n) {
246
- const d = i(0), f = i(0), u = (s) => {
247
- if (!s || !s.parentElement)
248
- return;
249
- const y = s.parentElement, r = s.cloneNode(!0);
250
- r.style.position = "absolute", r.style.visibility = "hidden", y.appendChild(r), r.style.width = "max-content";
251
- const m = r.offsetWidth, p = Math.max(150, Math.min(m, 350));
252
- d.value = p, r.style.width = `${p}px`;
253
- const v = r.offsetHeight;
254
- f.value = v, y.removeChild(r), f.value = v;
255
- };
256
- return j([e, n], async ([s]) => {
257
- var y, r;
258
- if (s !== null) {
259
- await A();
260
- const m = (r = (y = o.value) == null ? void 0 : y[0]) == null ? void 0 : r.$el;
261
- m && u(m);
262
- } else
263
- d.value = 0, f.value = 0;
264
- }), { computedStyle: C(() => {
265
- const s = { width: "max-content" };
266
- return n.value && (f.value > 0 && (s.height = `${f.value}px`), d.value > 0 && (s.width = `${d.value}px`)), s;
267
- }) };
268
- }
269
- const Ce = M({
270
- name: "menu-item-list",
271
- components: { BentoDivider: F, MenuItem: W, MenuListContainer: U, SubMenuItemList: ve },
272
- props: {
273
- /**
274
- * The data to be displayed in the list
275
- */
276
- data: {
277
- type: Array,
278
- required: !0
279
- },
280
- /**
281
- * Displays the menu-items of the list in the indent variant. Only applies to elements that don't have an icon to their left.
282
- */
283
- indentItems: {
284
- type: Boolean,
285
- default: !1
286
- },
287
- /**
288
- * If set to true, focuses the last item on the list instead of the first. Used for accessibility purposes when the menu is opened with the 'up' arrow key.
289
- */
290
- focusLastElement: {
291
- type: Boolean,
292
- default: !1
293
- },
294
- /**
295
- * If set to true, closes the menu when an item is clicked.
296
- */
297
- closeMenuOnItemSelect: {
298
- type: Boolean,
299
- default: !0
300
- }
301
- },
302
- emits: [b.CLOSE, "menu-item-click"],
303
- setup(o, { emit: e, expose: n }) {
304
- const t = i(null), l = i(null), d = i(null), f = i(null), u = i(!1), c = i(null), s = i(o.focusLastElement ? o.data.length - 1 : 0), y = i(0), r = i(o.data.length - 1), m = C(() => o.data.some((a) => a.icon)), p = C(() => o.indentItems || m.value ? o.data.map((a) => {
305
- let _ = !1;
306
- return a.icon || (_ = !0), {
307
- ...a,
308
- indent: _
309
- };
310
- }) : o.data), v = async () => {
311
- var a, _, h;
312
- (h = (_ = (a = l.value) == null ? void 0 : a.children[s.value]) == null ? void 0 : _.children[0]) == null || h.focus();
313
- }, k = () => e(b.CLOSE), x = (a, _) => {
314
- if (a.items) {
315
- c.value = _, u.value = !0;
316
- return;
317
- }
318
- c.value = _, u.value = !1, !a.skipClose && o.closeMenuOnItemSelect !== !1 && k(), e("menu-item-click");
319
- }, g = () => {
320
- s.value > 0 ? (s.value -= 1, p.value[s.value].disabled && g()) : s.value = r.value, v();
321
- }, B = () => {
322
- s.value < r.value ? (s.value += 1, p.value[s.value].disabled && B()) : s.value = 0, v();
323
- }, S = (a, _) => {
324
- var h;
325
- (h = a == null ? void 0 : a.items) != null && h.length && (c.value = _, u.value = !0);
326
- }, E = () => {
327
- c.value && u.value && (c.value = null, u.value = !1);
328
- }, w = () => {
329
- u.value = !1, c.value = null, v();
330
- };
331
- n({
332
- focusItem: v
333
- });
334
- const { computedStyle: O } = be(f, c, u);
335
- return {
336
- // Values
337
- menuItemListRef: l,
338
- menuItemListWrapperRef: d,
339
- subMenuItemListRef: f,
340
- menuItemRef: t,
341
- computedData: p,
342
- computedStyle: O,
343
- focusedIndex: s,
344
- subMenuFocusedIndex: y,
345
- showSubMenu: u,
346
- visibleSubMenuIndex: c,
347
- // Methods
348
- menuItemClick: x,
349
- closeMenu: k,
350
- focusPrevious: g,
351
- focusNext: B,
352
- focusRight: S,
353
- focusLeft: E,
354
- onBackButton: w
355
- };
356
- }
357
- });
358
- var he = function() {
359
- var e = this, n = e._self._c;
360
- return e._self._setupProxy, n("menu-list-container", { ref: "menuItemListWrapperRef", style: e.computedStyle }, [n("ul", { ref: "menuItemListRef", staticClass: "b-menu-item-list", attrs: { role: "menu" }, on: { keydown: [function(t) {
361
- return !t.type.indexOf("key") && e._k(t.keyCode, "down", 40, t.key, ["Down", "ArrowDown"]) ? null : e.focusNext.apply(null, arguments);
362
- }, function(t) {
363
- return !t.type.indexOf("key") && e._k(t.keyCode, "up", 38, t.key, ["Up", "ArrowUp"]) ? null : e.focusPrevious.apply(null, arguments);
364
- }, function(t) {
365
- return !t.type.indexOf("key") && e._k(t.keyCode, "esc", 27, t.key, ["Esc", "Escape"]) ? null : e.closeMenu.apply(null, arguments);
366
- }, function(t) {
367
- return !t.type.indexOf("key") && e._k(t.keyCode, "tab", 9, t.key, "Tab") ? null : e.closeMenu.apply(null, arguments);
368
- }] } }, e._l(e.computedData, function(t, l) {
369
- var d, f, u, c;
370
- return n("li", { key: `menu-item-${l}`, ref: "menuItemRef", refInFor: !0, staticClass: "b-menu-item-list__item", attrs: { role: "none" }, on: { keydown: [function(s) {
371
- return !s.type.indexOf("key") && e._k(s.keyCode, "right", 39, s.key, ["Right", "ArrowRight"]) || "button" in s && s.button !== 2 ? null : e.focusRight(t, l);
372
- }, function(s) {
373
- return !s.type.indexOf("key") && e._k(s.keyCode, "left", 37, s.key, ["Left", "ArrowLeft"]) || "button" in s && s.button !== 0 ? null : e.focusLeft();
374
- }] } }, [n("menu-item", { attrs: { text: t.text, handler: (d = t.items) != null && d.length ? () => null : t.handler, "secondary-text": t.secondaryText, icon: t.icon, chevron: !!((f = t.items) != null && f.length), disabled: t.disabled, critical: t.critical, indent: t.indent, tabindex: l === e.subMenuFocusedIndex ? "0" : "-1", "aria-haspopup": !!((u = t.items) != null && u.length), "aria-expanded": e.showSubMenu && e.visibleSubMenuIndex === l }, on: { click: function(s) {
375
- return e.menuItemClick(t, l);
376
- } } }), t.addDivider ? n("bento-divider", { staticClass: "b-menu-item-list__divider" }) : e._e(), (c = t.items) != null && c.length && e.showSubMenu && e.visibleSubMenuIndex === l ? n("sub-menu-item-list", { ref: "subMenuItemListRef", refInFor: !0, attrs: { items: t.items, title: t.text }, on: { back: e.onBackButton, close: e.closeMenu } }) : e._e()], 1);
377
- }), 0)]);
378
- }, ke = [], ge = /* @__PURE__ */ I(
379
- Ce,
380
- he,
381
- ke,
382
- !1,
383
- null,
384
- "a94a192f"
385
- );
386
- const Ie = ge.exports;
387
- let N = 0;
388
- const xe = {
389
- beforeCreate() {
390
- this.uuid = N.toString(), N += 1;
391
- }
392
- };
393
- var Me = function() {
394
- var e = this, n = e._self._c;
395
- return n("svg", e._b({ staticClass: "ui-assets-icons-16", attrs: { role: "img", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "none" } }, "svg", e.$attrs, !1), [e.$attrs["svg-title"] ? n("title", [e._v(e._s(e.$attrs["svg-title"]))]) : e._e(), n("path", { attrs: { fill: "#001222", 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" } }), n("path", { attrs: { fill: "#001222", 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" } }), n("path", { attrs: { fill: "#001222", 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" } })]);
396
- }, Be = [], Oe = /* @__PURE__ */ I(
397
- xe,
398
- Me,
399
- Be,
400
- !1,
401
- null,
402
- null
403
- );
404
- const Se = Oe.exports, Ee = M({
405
- i18n: { messages: H },
406
- name: "bento-menu",
407
- components: { BentoToggleButton: te, BentoPopover: G, BentoTeleport: ee, MenuItemList: Ie, OptionsVerticalIcon: Se },
408
- props: {
409
- /**
410
- * Object containing props to change the menu button appearance. Accepts the same props present in BentoButton.
411
- */
412
- button: {
413
- type: Object,
414
- default: () => ({
415
- variant: "secondary"
416
- })
417
- },
418
- /**
419
- * Controls if the menu should close when an item is clicked.
420
- * Defaults to `true`.
421
- */
422
- closeMenuOnItemSelect: {
423
- type: Boolean,
424
- default: !0
425
- },
426
- /**
427
- * The data to be displayed in the list
428
- */
429
- data: {
430
- type: Array,
431
- required: !0
432
- },
433
- /**
434
- * Disables opening the menu when the down arrow key is pressed.
435
- */
436
- disableArrowDownOpeningMenu: {
437
- type: Boolean,
438
- default: !1
439
- },
440
- /**
441
- * The position of where the menu should open.
442
- */
443
- menuPosition: {
444
- type: String,
445
- default: R.BOTTOM_START,
446
- validator: (o) => Object.values(R).includes(o)
447
- },
448
- /**
449
- * Instructs the menu popover to be visible outside of the containing container.
450
- * @see {@link https://floating-ui.com/docs/usefloating#strategy}
451
- */
452
- menuFixedPositioning: {
453
- type: Boolean,
454
- default: !1
455
- },
456
- /**
457
- * Sets a custom width for the menu popover.
458
- */
459
- menuWidth: {
460
- type: Number,
461
- default: null
462
- },
463
- /**
464
- * Returns focus to the menu button after popover is closed.
465
- * Disable if focus management is delegated to the parent component.
466
- * Defaults to `true`.
467
- */
468
- revertFocusToButton: {
469
- type: Boolean,
470
- default: !0
471
- },
472
- /**
473
- * Can be used to set the inner teleport component to render the menu's popover in the root `body` DOM node
474
- * (or `dialog` if popover is inside a dialog).
475
- */
476
- teleport: {
477
- type: Boolean,
478
- default: !1
479
- },
480
- /**
481
- * Can be used to set the inner teleport component to render the menu's popover in the root `body` DOM node
482
- * (or `dialog` if popover is inside a dialog).
483
- *
484
- * @see {@link OnClickOutsideOptions}
485
- */
486
- closeOnClickOutsideOptions: {
487
- type: Object,
488
- default: void 0
489
- }
490
- },
491
- emits: [b.CLOSE, b.OPEN, "menu-item-click", "click-outside"],
492
- setup(o, { emit: e, expose: n, slots: t }) {
493
- var O;
494
- const { t: l } = J(), d = i(null), f = i(null), u = i(!1), c = i(!1), s = i(null), y = L("menu"), r = L("menu-popover"), m = P(ne, i(!1));
495
- q(X, m);
496
- const p = C(() => ({
497
- "b-menu--inverse": m.value
498
- })), v = C(() => o.menuWidth ? { width: `${o.menuWidth}px` } : null), k = C(() => {
499
- if (o != null && o.button)
500
- return {
501
- variant: "secondary",
502
- ...o.button
503
- };
504
- }), x = () => {
505
- u.value = !0, e(b.OPEN);
506
- }, g = async (a = o.revertFocusToButton) => {
507
- var _, h;
508
- u.value && (u.value = !1, a && (await A(), (h = (_ = d.value) == null ? void 0 : _.$el) == null || h.focus()), e(b.CLOSE));
509
- }, B = (a) => {
510
- a.stopPropagation(), u.value ? g() : x();
511
- }, S = (a) => {
512
- a.preventDefault(), c.value = !1, o.disableArrowDownOpeningMenu || x();
513
- }, E = (a) => {
514
- a.preventDefault(), c.value = !0, x();
515
- }, w = () => {
516
- e("menu-item-click");
517
- };
518
- return Y(
519
- s,
520
- () => {
521
- g(), e("click-outside");
522
- },
523
- {
524
- ...o.closeOnClickOutsideOptions,
525
- ignore: [d, ...((O = o.closeOnClickOutsideOptions) == null ? void 0 : O.ignore) ?? []]
526
- }
527
- ), n({
528
- /**
529
- * Control to enable programmatic closing of the menu
530
- */
531
- closeMenu: g
532
- }), {
533
- // Refs
534
- popoverRef: s,
535
- menuButtonRef: d,
536
- menuItemListRef: f,
537
- // Values
538
- menuId: y,
539
- popoverId: r,
540
- showMenu: u,
541
- computedButtonPropsWithDefaults: k,
542
- computedMenuWidth: v,
543
- isLastElementFocused: c,
544
- // Classes
545
- computedClasses: p,
546
- isInverseColorSet: m,
547
- // Methods
548
- hasSlot: V(t),
549
- onKeyDown: S,
550
- onKeyUp: E,
551
- closeMenu: g,
552
- menuItemClick: w,
553
- toggleShowMenu: B,
554
- // Translations
555
- t: l
556
- };
557
- }
558
- });
559
- var we = function() {
560
- var e = this, n = e._self._c;
561
- return e._self._setupProxy, n("div", { staticClass: "b-menu", class: e.computedClasses, attrs: { "data-testid": "menu" }, on: { keydown: [function(t) {
562
- return !t.type.indexOf("key") && e._k(t.keyCode, "down", 40, t.key, ["Down", "ArrowDown"]) ? null : e.onKeyDown.apply(null, arguments);
563
- }, function(t) {
564
- return !t.type.indexOf("key") && e._k(t.keyCode, "up", 38, t.key, ["Up", "ArrowUp"]) ? null : e.onKeyUp.apply(null, arguments);
565
- }, function(t) {
566
- return !t.type.indexOf("key") && e._k(t.keyCode, "esc", 27, t.key, ["Esc", "Escape"]) ? null : e.closeMenu();
567
- }] } }, [n("bento-toggle-button", e._b({ ref: "menuButtonRef", attrs: { "aria-haspopup": "true", "aria-controls": e.showMenu ? e.menuId : null, toggled: e.showMenu, inverse: e.isInverseColorSet }, on: { click: e.toggleShowMenu }, scopedSlots: e._u([!e.hasSlot("default") || e.hasSlot("iconLeft") ? { key: "iconLeft", fn: function() {
568
- return [e._t("iconLeft", function() {
569
- return [n("options-vertical-icon", { attrs: { title: e.t("menuButton") } })];
570
- })];
571
- }, proxy: !0 } : null, e.hasSlot("default") ? { key: "default", fn: function() {
572
- return [e._t("default")];
573
- }, proxy: !0 } : null, e.hasSlot("iconRight") ? { key: "iconRight", fn: function() {
574
- return [e._t("iconRight")];
575
- }, proxy: !0 } : null], null, !0) }, "bento-toggle-button", e.computedButtonPropsWithDefaults, !1)), e.menuButtonRef ? n("bento-teleport", { attrs: { disabled: !e.teleport } }, [e.menuButtonRef ? n("bento-popover", { ref: "popoverRef", staticClass: "b-menu__popover", style: e.computedMenuWidth, attrs: { id: e.menuId, role: null, open: e.showMenu, "target-element": e.menuButtonRef, position: e.menuPosition, "fixed-positioning": e.menuFixedPositioning, "fallback-position": [
576
- "bottom-start",
577
- "bottom-end",
578
- "top-start",
579
- "top-end",
580
- "right-start",
581
- "right-end",
582
- "left-start",
583
- "left-end"
584
- ], teleport: e.teleport, "without-space": "" } }, [n("menu-item-list", { ref: "menuItemListRef", attrs: { "close-menu-on-item-select": e.closeMenuOnItemSelect, data: e.data, "focus-last-element": e.isLastElementFocused }, on: { close: e.closeMenu, "menu-item-click": e.menuItemClick } })], 1) : e._e()], 1) : e._e()], 1);
585
- }, Le = [], Re = /* @__PURE__ */ I(
586
- Ee,
587
- we,
588
- Le,
589
- !1,
590
- null,
591
- "b976c2e8"
592
- );
593
- const Je = Re.exports;
594
- export {
595
- Je as B,
596
- ae as D,
597
- ne as M,
598
- Se as O,
599
- b as a
600
- };
601
- //# sourceMappingURL=menu.CTVbNfuo.js.map