@oneb/ui-vue 0.3.13 → 0.3.15

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 (75) hide show
  1. package/dist/CheckIcon-09b84cf5.cjs +1 -0
  2. package/dist/CheckIcon-f1c94824.js +20 -0
  3. package/dist/ChevronDownIcon-6805ce6c.js +20 -0
  4. package/dist/ChevronDownIcon-6889ac87.cjs +1 -0
  5. package/dist/{ChevronRightIcon-8df1af46.js → ChevronRightIcon-4549a26b.js} +4 -21
  6. package/dist/ChevronRightIcon-7a2f0c20.cjs +1 -0
  7. package/dist/NoSymbolIcon-5d326416.cjs +1 -0
  8. package/dist/NoSymbolIcon-e58a9aee.js +71 -0
  9. package/dist/OneHelpMenu-66a2d4c2.cjs +1 -0
  10. package/dist/OneHelpMenu-d7a39a69.js +856 -0
  11. package/dist/OneMarkdown.vue_vue_type_style_index_0_lang-0ea8fbf8.cjs +1 -0
  12. package/dist/OneMarkdown.vue_vue_type_style_index_0_lang-4ed993c7.js +1 -0
  13. package/dist/{SpinnerIcon-516264ba.js → SpinnerIcon-74648c98.js} +6 -5
  14. package/dist/SpinnerIcon-ccb6f3fc.cjs +1 -0
  15. package/dist/SpinnerIcon.vue_vue_type_style_index_0_lang-0ea8fbf8.cjs +1 -0
  16. package/dist/SpinnerIcon.vue_vue_type_style_index_0_lang-4ed993c7.js +1 -0
  17. package/dist/button/index.cjs +1 -1
  18. package/dist/button/index.js +17 -16
  19. package/dist/buttonGroup/index.cjs +1 -0
  20. package/dist/buttonGroup/index.js +31 -0
  21. package/dist/checkbox/index.cjs +1 -0
  22. package/dist/checkbox/index.js +124 -0
  23. package/dist/collapse/index.cjs +1 -0
  24. package/dist/collapse/index.js +58 -0
  25. package/dist/common/index.cjs +1 -16
  26. package/dist/common/index.js +14 -3120
  27. package/dist/dataTable/index.cjs +1 -1
  28. package/dist/dataTable/index.js +846 -9
  29. package/dist/dropdown/index.cjs +1 -1
  30. package/dist/dropdown/index.js +792 -17
  31. package/dist/entityPicker/index.cjs +1 -0
  32. package/dist/entityPicker/index.js +584 -0
  33. package/dist/errorsPage/index.cjs +1 -0
  34. package/dist/errorsPage/index.js +63 -0
  35. package/dist/floating-ui.dom-2121a4fd.cjs +1 -0
  36. package/dist/floating-ui.dom-4509432e.js +941 -0
  37. package/dist/i18n/index.cjs +1 -0
  38. package/dist/{useI18n-2103b39e.js → i18n/index.js} +4 -4
  39. package/dist/index.cjs +1 -1
  40. package/dist/index.js +114 -10295
  41. package/dist/indicators/index.cjs +1 -0
  42. package/dist/indicators/index.js +84 -0
  43. package/dist/infobox/index.cjs +1 -0
  44. package/dist/infobox/index.js +111 -0
  45. package/dist/label/index.cjs +1 -0
  46. package/dist/label/index.js +47 -0
  47. package/dist/layout/index.cjs +1 -1
  48. package/dist/layout/index.js +115 -109
  49. package/dist/modal/index.cjs +1 -0
  50. package/dist/modal/index.js +41 -0
  51. package/dist/periodPicker/index.cjs +1 -0
  52. package/dist/periodPicker/index.js +1323 -0
  53. package/dist/radio/index.cjs +1 -0
  54. package/dist/radio/index.js +73 -0
  55. package/dist/skeleton/index.cjs +1 -0
  56. package/dist/skeleton/index.js +46 -0
  57. package/dist/style.css +1 -1
  58. package/dist/switch/index.cjs +1 -0
  59. package/dist/switch/index.js +142 -0
  60. package/dist/toast/index.cjs +1 -0
  61. package/dist/toast/index.js +140 -0
  62. package/dist/tooltip/index.cjs +1 -0
  63. package/dist/tooltip/index.js +20 -0
  64. package/dist/useModal-85f57682.js +177 -0
  65. package/dist/useModal-98810f6a.cjs +1 -0
  66. package/package.json +4 -4
  67. package/dist/ChevronRightIcon-6aa413c4.cjs +0 -1
  68. package/dist/OneHelpMenu-8e315cb3.js +0 -1791
  69. package/dist/OneHelpMenu-95ae3d5a.cjs +0 -1
  70. package/dist/SpinnerIcon-01be39fe.cjs +0 -1
  71. package/dist/index-19e93dfb.js +0 -954
  72. package/dist/index-85e729ab.cjs +0 -1
  73. package/dist/index-8b41a099.cjs +0 -1
  74. package/dist/index-98daa7ed.js +0 -862
  75. package/dist/useI18n-bcf9c640.cjs +0 -1
@@ -1,954 +0,0 @@
1
- import { g as ge, c as oe, o as ne, f as re, s as ae, a as be, h as ke, _ as xe, r as Ce, i as _e } from "./OneHelpMenu-8e315cb3.js";
2
- import { defineComponent as q, ref as _, watch as pe, onBeforeUnmount as ve, provide as $e, computed as A, openBlock as s, createElementBlock as l, createElementVNode as t, renderSlot as M, normalizeProps as P, guardReactiveProps as T, createBlock as U, Teleport as Me, createCommentVNode as y, withDirectives as X, normalizeClass as b, toDisplayString as p, vShow as Ve, withCtx as R, createVNode as H, unref as C, normalizeStyle as N, Fragment as B, renderList as D, onMounted as me, onUnmounted as Ke, vModelText as ie, mergeProps as W, createTextVNode as ue, nextTick as J } from "vue";
3
- import { _ as fe } from "./_plugin-vue_export-helper-dad06003.js";
4
- import { _ as de } from "./OneAvatar.vue_vue_type_script_setup_true_lang-08ab80dd.js";
5
- import { u as Oe } from "./useI18n-2103b39e.js";
6
- const Le = ["data-opened"], je = {
7
- key: 0,
8
- class: "text-sm text-secondary-content px-3 py-2 text-left"
9
- }, Ae = /* @__PURE__ */ q({
10
- __name: "OneDropdownAuto",
11
- props: ge,
12
- emits: ["open", "close"],
13
- setup(K, { emit: f }) {
14
- const n = K, a = _(!1), m = _(null), k = _(null);
15
- let g = null;
16
- pe(a, (v) => {
17
- v && k.value && m.value ? (oe(k.value, m.value, {
18
- placement: n.stick ? n.stick : "bottom-start",
19
- strategy: "fixed",
20
- middleware: [ne(5), re(), ae({ padding: 8 })]
21
- }).then(({ x: c, y: $ }) => {
22
- Object.assign(m.value.style, {
23
- left: `${c}px`,
24
- top: `${$}px`
25
- });
26
- }), g = be(k.value, m.value, () => {
27
- oe(k.value, m.value, {
28
- placement: n.stick ? n.stick : "bottom-start",
29
- strategy: "fixed",
30
- middleware: [ne(4), re(), ae({ padding: 8 })]
31
- }).then(({ x: c, y: $ }) => {
32
- Object.assign(m.value.style, {
33
- left: `${c}px`,
34
- top: `${$}px`
35
- });
36
- });
37
- })) : g && (g(), g = null);
38
- }), ve(() => {
39
- g && g();
40
- });
41
- const d = f, h = () => {
42
- a.value = !a.value, a.value ? d("open") : d("close");
43
- };
44
- $e("OneDropdown", {
45
- onToggle: h
46
- });
47
- const V = A(() => [
48
- "fixed z-[10000] w-fit rounded-md bg-white",
49
- "py-1 shadow-lg ring-black ring-opacity-5 focus:outline-none",
50
- "overflow-auto max-h-[540px] min-w-[150px] max-w-[540px]"
51
- ]);
52
- return (v, c) => (s(), l("div", {
53
- class: "relative inline-block",
54
- "data-opened": a.value
55
- }, [
56
- t("div", {
57
- ref_key: "buttonRef",
58
- ref: k
59
- }, [
60
- M(v.$slots, "button", P(T({ onToggle: h, isExpanded: a.value })))
61
- ], 512),
62
- (s(), U(Me, { to: "body" }, [
63
- a.value ? (s(), l("div", {
64
- key: 0,
65
- class: "fixed top-0 left-0 w-screen h-screen z-[9999]",
66
- onClick: h
67
- })) : y("", !0),
68
- X(t("div", {
69
- ref_key: "menuRef",
70
- ref: m,
71
- class: b(["menu", V.value]),
72
- role: "menu",
73
- "aria-orientation": "vertical",
74
- tabindex: "-1",
75
- style: { display: "none" }
76
- }, [
77
- v.title ? (s(), l("div", je, p(v.title), 1)) : y("", !0),
78
- M(v.$slots, "menu", P(T({ onToggle: h })))
79
- ], 2), [
80
- [Ve, a.value]
81
- ])
82
- ]))
83
- ], 8, Le));
84
- }
85
- }), Se = {}, Be = { class: "border-t border-secondary-stroke my-1" };
86
- function Ie(K, f) {
87
- return s(), l("div", Be);
88
- }
89
- const Ht = /* @__PURE__ */ fe(Se, [["render", Ie]]), ze = ["onClick"], Ee = { class: "grid" }, De = { class: "font-semibold px-3" }, Re = { class: "rounded-lg m-3 border" }, Fe = {
90
- class: "space-x-2 flex items-center px-3 py-2",
91
- style: { width: "300px" }
92
- }, We = { class: "flex-shrink-0" }, Pe = { class: "w-full text-left" }, Te = { class: "flex-shrink-0" }, Ue = { class: "px-3 py-2" }, Ne = { class: "text-secondary-content text-left pb-1 text-sm uppercase" }, qe = {
93
- key: 0,
94
- class: "space-y-2"
95
- }, Ge = ["onClick"], He = { class: "pl-2" }, Je = { class: "text-sm mt-1" }, Xe = { class: "text-xs mt-1" }, ce = 3, Jt = /* @__PURE__ */ q({
96
- __name: "OneBrowserMenuGrid",
97
- props: ke,
98
- setup(K) {
99
- const f = K, n = () => {
100
- typeof f.onChange == "function" && f.onChange();
101
- }, a = _(!1), m = A(() => f.apps ? a.value ? f.apps : f.apps.slice(0, ce) : []), k = () => {
102
- a.value = !a.value;
103
- }, g = (d) => {
104
- typeof f.onApp == "function" && f.onApp(d);
105
- };
106
- return (d, h) => (s(), U(xe, { stick: "right" }, {
107
- button: R(({ onToggle: V, isExpanded: v }) => [
108
- t("button", {
109
- onClick: V,
110
- class: b(["p-1 rounded-md hover:bg-secondary-10", [v ? "bg-secondary-25" : ""]])
111
- }, [
112
- H(C(Ce), {
113
- class: "text-secondary-base",
114
- style: N(`width: ${d.iconSize}px; height: ${d.iconSize}px`)
115
- }, null, 8, ["style"])
116
- ], 10, ze)
117
- ]),
118
- menu: R(() => {
119
- var V, v, c, $;
120
- return [
121
- t("div", Ee, [
122
- t("div", De, p((V = d.workspace) == null ? void 0 : V.title), 1),
123
- t("div", Re, [
124
- t("div", Fe, [
125
- t("div", We, [
126
- H(de, {
127
- text: ((v = d.workspace) == null ? void 0 : v.name) || "",
128
- src: (c = d.workspace) == null ? void 0 : c.photo_url,
129
- size: 44,
130
- rounded: !1,
131
- class: "mx-auto"
132
- }, null, 8, ["text", "src"])
133
- ]),
134
- t("div", Pe, p(($ = d.workspace) == null ? void 0 : $.name), 1),
135
- t("div", Te, [
136
- t("button", {
137
- class: "text-sm border border-secondary-stroke rounded px-2 py-0.5 text-secondary-content hover:text-primary-content",
138
- onClick: n
139
- }, p(d.changeLabel), 1)
140
- ])
141
- ]),
142
- h[0] || (h[0] = t("hr", null, null, -1))
143
- ])
144
- ]),
145
- t("div", Ue, [
146
- t("div", Ne, p(d.appsTitle), 1),
147
- t("div", null, [
148
- d.apps && d.apps.length ? (s(), l("div", qe, [
149
- (s(!0), l(B, null, D(m.value, (I) => (s(), l("div", {
150
- key: I.id,
151
- onClick: (i) => g(I),
152
- class: "flex items-center rounded-lg hover:bg-secondary-10 border p-2 bg-[#FAFAFA] cursor-pointer"
153
- }, [
154
- H(de, {
155
- text: I.name,
156
- src: I.photo_url,
157
- size: 44,
158
- rounded: !1
159
- }, null, 8, ["text", "src"]),
160
- t("div", He, [
161
- t("p", Je, p(I.name), 1),
162
- t("p", Xe, p(I.short), 1)
163
- ])
164
- ], 8, Ge))), 128))
165
- ])) : y("", !0),
166
- d.apps && d.apps.length > ce ? (s(), l("button", {
167
- key: 1,
168
- onClick: k,
169
- class: "mt-2 w-full bg-[#FAFAFA] hover:bg-secondary-10 p-2 rounded-lg mb-5 text-xs"
170
- }, p(a.value ? "Приховати" : "Дивитися всі"), 1)) : y("", !0)
171
- ])
172
- ])
173
- ];
174
- }),
175
- _: 1
176
- }));
177
- }
178
- }), Ye = {
179
- useModal: {
180
- required: !0,
181
- type: Object
182
- },
183
- title: {
184
- required: !1,
185
- type: String
186
- },
187
- size: {
188
- type: String,
189
- default: "medium"
190
- },
191
- onClose: {
192
- type: Function
193
- },
194
- classModal: {
195
- type: Boolean,
196
- default: !1
197
- },
198
- titleCenter: {
199
- type: Boolean,
200
- default: !1
201
- },
202
- classTitle: {
203
- type: String,
204
- default: ""
205
- },
206
- canClose: {
207
- type: Function,
208
- default: () => !0
209
- },
210
- customWidth: {
211
- type: String,
212
- default: ""
213
- }
214
- }, Ze = {
215
- "3xs": ["max-w-xs"],
216
- xs: ["max-w-sm"],
217
- sm: ["max-w-md"],
218
- small: ["max-w-lg"],
219
- md: ["max-w-xl"],
220
- medium: ["max-w-xl"],
221
- large: ["max-w-2xl"],
222
- xl: ["max-w-3xl"],
223
- "2xl": ["max-w-4xl"],
224
- "3xl": ["max-w-4xl"],
225
- "4xl": ["max-w-5xl"],
226
- "5xl": ["max-w-5xl"],
227
- "7xl": ["max-w-7xl"]
228
- }, Qe = (K = "medium") => {
229
- const f = [];
230
- return f.push(...Ze[K] ?? []), f;
231
- }, et = { class: "relative bg-white rounded-lg shadow h-full" }, tt = /* @__PURE__ */ q({
232
- __name: "OneModal",
233
- props: Ye,
234
- emits: ["isOpen", "closed"],
235
- setup(K, { expose: f, emit: n }) {
236
- const a = K, m = n, k = A(() => {
237
- var x, O;
238
- const i = a.useModal;
239
- return ((x = i == null ? void 0 : i.isOpened) == null ? void 0 : x.value) ?? ((O = i == null ? void 0 : i.isOpen) == null ? void 0 : O.value) ?? !1;
240
- }), g = A(() => Qe(a.size)), d = A(() => a.customWidth ? { width: a.customWidth } : {}), h = _(null), V = _(!1);
241
- function v(i) {
242
- V.value = !1, h.value && !h.value.contains(i.target) && (V.value = !0);
243
- }
244
- function c(i) {
245
- V.value && h.value && !h.value.contains(i.target) && $();
246
- }
247
- const $ = () => {
248
- var x, O;
249
- if (a.canClose && !a.canClose())
250
- return;
251
- const i = a.useModal;
252
- (x = i == null ? void 0 : i.close) == null || x.call(i), (O = a.onClose) == null || O.call(a), m("closed"), m("isOpen");
253
- };
254
- return f({
255
- open: () => {
256
- var x;
257
- const i = a.useModal;
258
- (x = i == null ? void 0 : i.open) == null || x.call(i), m("isOpen");
259
- },
260
- close: $
261
- }), (i, x) => k.value ? (s(), l("div", {
262
- key: 0,
263
- tabindex: "-1",
264
- onMousedown: v,
265
- onMouseup: c,
266
- class: b(["modal backdrop !m-0", { "modal-mobile": i.classModal }])
267
- }, [
268
- t("div", {
269
- class: b([
270
- "relative w-full max-h-full",
271
- g.value,
272
- { "fixed bottom-0 left-0 right-0 w-full bg-white rounded-t-xl mobile-modal": i.classModal }
273
- ]),
274
- style: N(d.value),
275
- ref_key: "modalContent",
276
- ref: h
277
- }, [
278
- t("div", et, [
279
- i.title ? (s(), l("div", {
280
- key: 0,
281
- class: b([
282
- i.titleCenter ? "grid grid-cols-4" : "flex items-start justify-between",
283
- "p-3 border-b rounded-t",
284
- i.classTitle
285
- ])
286
- }, [
287
- t("h3", {
288
- class: b(["text-xl font-semibold text-gray-900 whitespace-nowrap overflow-hidden text-ellipsis", i.titleCenter ? "col-span-2 text-center col-start-2" : ""])
289
- }, p(i.title), 3),
290
- t("button", {
291
- type: "button",
292
- class: "text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center",
293
- onClick: $
294
- }, [...x[0] || (x[0] = [
295
- t("svg", {
296
- xmlns: "http://www.w3.org/2000/svg",
297
- fill: "none",
298
- viewBox: "0 0 24 24",
299
- "stroke-width": "1.8",
300
- stroke: "currentColor",
301
- "aria-hidden": "true",
302
- class: "w-5 h-5"
303
- }, [
304
- t("path", {
305
- "stroke-linecap": "round",
306
- "stroke-linejoin": "round",
307
- d: "M6 18L18 6M6 6l12 12"
308
- })
309
- ], -1)
310
- ])])
311
- ], 2)) : y("", !0),
312
- M(i.$slots, "header", {}, void 0, !0),
313
- M(i.$slots, "body", {}, void 0, !0),
314
- M(i.$slots, "default", {}, void 0, !0),
315
- M(i.$slots, "footer", { close: $ }, void 0, !0)
316
- ])
317
- ], 6)
318
- ], 34)) : y("", !0);
319
- }
320
- });
321
- const st = /* @__PURE__ */ fe(tt, [["__scopeId", "data-v-3560b61e"]]);
322
- function lt(K = !1) {
323
- const f = _(K), n = _(void 0);
324
- let a = null;
325
- const m = () => {
326
- a && (clearTimeout(a), a = null), f.value = !1, n.value = void 0;
327
- }, k = (h) => {
328
- n.value = h, f.value = !0;
329
- }, g = (h) => {
330
- a && clearTimeout(a), a = setTimeout(m, h * 1e3);
331
- }, d = (h) => {
332
- h.key === "Escape" && f.value && m();
333
- };
334
- return me(() => {
335
- document.addEventListener("keydown", d);
336
- }), ve(() => {
337
- document.removeEventListener("keydown", d), a && clearTimeout(a);
338
- }), {
339
- isOpened: f,
340
- isOpen: f,
341
- // alias for backward compatibility
342
- data: n,
343
- open: k,
344
- close: m,
345
- closeWithDelay: g
346
- };
347
- }
348
- const ot = ["onClick"], nt = ["onKeydown"], rt = {
349
- key: 0,
350
- class: "text-sm font-medium text-gray-700 px-3 pt-2.5 pb-1.5"
351
- }, at = {
352
- key: 1,
353
- class: "px-3 py-2"
354
- }, it = { class: "relative" }, ut = ["placeholder"], dt = {
355
- key: 2,
356
- class: "border-b border-gray-100"
357
- }, ct = ["onClick"], pt = {
358
- key: 3,
359
- class: "flex items-center justify-between px-3 py-1.5 border-b border-gray-100"
360
- }, vt = {
361
- key: 4,
362
- class: "flex justify-center py-4"
363
- }, mt = ["aria-selected", "onClick"], ft = {
364
- key: 0,
365
- xmlns: "http://www.w3.org/2000/svg",
366
- fill: "none",
367
- viewBox: "0 0 24 24",
368
- "stroke-width": "1.5",
369
- stroke: "currentColor",
370
- class: "w-4 h-4 text-blue-600 shrink-0"
371
- }, ht = {
372
- key: 1,
373
- class: "w-4 h-4 shrink-0"
374
- }, yt = ["aria-selected", "onClick", "onMouseenter"], wt = {
375
- key: 0,
376
- xmlns: "http://www.w3.org/2000/svg",
377
- fill: "none",
378
- viewBox: "0 0 24 24",
379
- "stroke-width": "1.5",
380
- stroke: "currentColor",
381
- class: "w-4 h-4 text-blue-600 shrink-0"
382
- }, gt = {
383
- key: 1,
384
- class: "w-4 h-4 shrink-0"
385
- }, bt = ["aria-selected", "onClick", "onMouseenter"], kt = {
386
- key: 0,
387
- xmlns: "http://www.w3.org/2000/svg",
388
- fill: "none",
389
- viewBox: "0 0 24 24",
390
- "stroke-width": "1.5",
391
- stroke: "currentColor",
392
- class: "w-4 h-4 text-blue-600 shrink-0"
393
- }, xt = {
394
- key: 1,
395
- class: "w-4 h-4 shrink-0"
396
- }, Ct = {
397
- key: 3,
398
- class: "px-3 py-4 text-sm text-gray-500 text-center"
399
- }, _t = { class: "pb-6" }, $t = {
400
- key: 0,
401
- class: "relative px-3 py-3"
402
- }, Mt = { class: "relative" }, Vt = ["placeholder"], Kt = {
403
- key: 1,
404
- class: "px-3 py-2"
405
- }, Ot = {
406
- key: 2,
407
- class: "flex items-center justify-between px-3 py-2 border-b border-gray-100"
408
- }, Lt = {
409
- key: 3,
410
- class: "flex justify-center py-8"
411
- }, jt = {
412
- key: 4,
413
- class: "overflow-auto h-[60dvh] divide-y",
414
- role: "listbox"
415
- }, At = ["aria-selected"], St = {
416
- key: 0,
417
- xmlns: "http://www.w3.org/2000/svg",
418
- fill: "none",
419
- viewBox: "0 0 24 24",
420
- "stroke-width": "1.5",
421
- stroke: "currentColor",
422
- class: "w-5 h-5 text-blue-600 shrink-0"
423
- }, Bt = {
424
- key: 1,
425
- class: "w-5 h-5 shrink-0"
426
- }, It = {
427
- key: 0,
428
- class: "px-3 pt-3 pb-2 text-xs font-semibold text-gray-400 uppercase tracking-wide"
429
- }, zt = ["aria-selected", "onClick"], Et = {
430
- key: 0,
431
- xmlns: "http://www.w3.org/2000/svg",
432
- fill: "none",
433
- viewBox: "0 0 24 24",
434
- "stroke-width": "1.5",
435
- stroke: "currentColor",
436
- class: "w-5 h-5 text-blue-600 shrink-0"
437
- }, Dt = {
438
- key: 1,
439
- class: "w-5 h-5 shrink-0"
440
- }, Rt = ["aria-selected", "onClick"], Ft = {
441
- key: 0,
442
- xmlns: "http://www.w3.org/2000/svg",
443
- fill: "none",
444
- viewBox: "0 0 24 24",
445
- "stroke-width": "1.5",
446
- stroke: "currentColor",
447
- class: "w-5 h-5 text-blue-600 shrink-0"
448
- }, Wt = {
449
- key: 1,
450
- class: "w-5 h-5 shrink-0"
451
- }, Pt = {
452
- key: 3,
453
- class: "px-3 py-8 text-sm text-gray-500 text-center"
454
- }, Xt = /* @__PURE__ */ q({
455
- __name: "OneDropdownSelect",
456
- props: _e,
457
- emits: ["update:modelValue", "search", "create"],
458
- setup(K, { emit: f }) {
459
- const n = K, a = Oe(), m = f, k = _(!1);
460
- let g = null;
461
- me(() => {
462
- g = window.matchMedia("(max-width: 767px)"), k.value = g.matches;
463
- const e = (o) => {
464
- k.value = o.matches;
465
- };
466
- g.addEventListener("change", e), Ke(() => {
467
- g == null || g.removeEventListener("change", e);
468
- });
469
- });
470
- const d = lt(), h = _(null), V = () => {
471
- v.value = "", c.value = -1, d.open(), J(() => {
472
- var e;
473
- (e = h.value) == null || e.focus();
474
- });
475
- }, v = _(""), c = _(-1), $ = _(null), I = _(null), i = _({}), x = (e, o) => {
476
- e && (i.value[o] = e);
477
- }, O = A(() => n.allowEmpty ? 1 : 0), E = A(() => {
478
- if (!v.value.trim())
479
- return n.items;
480
- const e = v.value.toLowerCase();
481
- return n.items.filter(
482
- (o) => String(o[n.labelKey] ?? "").toLowerCase().includes(e)
483
- );
484
- }), Y = A(() => {
485
- if (!n.groupKey)
486
- return [];
487
- const e = [], o = /* @__PURE__ */ new Map();
488
- let u = O.value;
489
- for (const r of E.value) {
490
- const j = String(r[n.groupKey] ?? "");
491
- let w = o.get(j);
492
- w || (w = { label: j, entries: [] }, o.set(j, w), e.push(w)), w.entries.push({ item: r, flatIndex: u }), u++;
493
- }
494
- return e;
495
- }), S = A(() => n.multiple ? (n.modelValue ?? []).length > 0 : n.modelValue !== null && n.modelValue !== void 0), F = A(() => {
496
- if (n.multiple) {
497
- const e = n.modelValue ?? [];
498
- return e.length === 0 ? n.placeholder : e.length === 1 ? e[0][n.labelKey] ?? n.placeholder : `${e[0][n.labelKey]} +${e.length - 1}`;
499
- }
500
- return n.modelValue === null || n.modelValue === void 0 ? n.placeholder : n.modelValue[n.labelKey] ?? n.placeholder;
501
- }), L = (e) => n.modelValue ? n.multiple ? n.modelValue.some((u) => u[n.valueKey] === e[n.valueKey]) : n.modelValue[n.valueKey] === e[n.valueKey] : !1, Z = A(() => E.value.length + O.value), z = (e, o) => {
502
- if (n.multiple) {
503
- const u = (n.modelValue ?? []).slice();
504
- if (e === null) {
505
- m("update:modelValue", []);
506
- return;
507
- }
508
- const r = u.findIndex((j) => j[n.valueKey] === e[n.valueKey]);
509
- r >= 0 ? u.splice(r, 1) : u.push(e), m("update:modelValue", u);
510
- return;
511
- }
512
- m("update:modelValue", e), o();
513
- }, Q = () => {
514
- m("update:modelValue", [...n.items]);
515
- }, ee = () => {
516
- m("update:modelValue", []);
517
- }, te = (e) => {
518
- m("create", v.value), e();
519
- }, he = () => {
520
- v.value = "", c.value = -1, J(() => {
521
- var e;
522
- (e = $.value) == null || e.focus();
523
- });
524
- }, ye = () => {
525
- v.value = "", c.value = -1;
526
- }, se = () => {
527
- c.value = 0, m("search", v.value);
528
- }, le = () => {
529
- J(() => {
530
- const e = i.value[c.value];
531
- e && e.scrollIntoView({ block: "nearest" });
532
- });
533
- }, we = (e, o) => {
534
- switch (e.key) {
535
- case "ArrowDown":
536
- e.preventDefault(), c.value < Z.value - 1 ? c.value++ : c.value = 0, le();
537
- break;
538
- case "ArrowUp":
539
- e.preventDefault(), c.value > 0 ? c.value-- : c.value = Z.value - 1, le();
540
- break;
541
- case "Enter":
542
- if (e.preventDefault(), c.value >= 0)
543
- if (n.allowEmpty && c.value === 0)
544
- z(null, o);
545
- else {
546
- const u = c.value - O.value, r = E.value[u];
547
- r && z(r, o);
548
- }
549
- break;
550
- case "Escape":
551
- e.preventDefault(), o();
552
- break;
553
- }
554
- };
555
- return pe(v, () => {
556
- c.value = 0;
557
- }), (e, o) => k.value ? (s(), l(B, { key: 1 }, [
558
- M(e.$slots, "button", P(T({ onToggle: V, isExpanded: C(d).isOpened.value, selectedLabel: F.value })), () => [
559
- t("button", {
560
- class: b(["inline-flex items-center justify-between gap-2 text-sm transition-colors", [
561
- e.view === "pill" ? "rounded-full bg-gray-100 px-3.5 py-1.5 hover:bg-gray-200 text-gray-700" : "rounded-lg border border-gray-300 bg-white px-3 py-2 hover:bg-gray-50 min-w-[180px]"
562
- ]]),
563
- style: N(e.maxWidth ? { maxWidth: e.maxWidth } : void 0),
564
- onClick: V
565
- }, [
566
- t("span", {
567
- class: b(["truncate", e.view === "pill" ? "" : S.value ? "text-gray-900" : "text-gray-500"])
568
- }, p(F.value), 3),
569
- o[12] || (o[12] = t("svg", {
570
- xmlns: "http://www.w3.org/2000/svg",
571
- fill: "none",
572
- viewBox: "0 0 24 24",
573
- "stroke-width": "1.5",
574
- stroke: "currentColor",
575
- class: "w-4 h-4 text-gray-400 shrink-0"
576
- }, [
577
- t("path", {
578
- "stroke-linecap": "round",
579
- "stroke-linejoin": "round",
580
- d: "M19.5 8.25l-7.5 7.5-7.5-7.5"
581
- })
582
- ], -1))
583
- ], 6)
584
- ]),
585
- C(d).isOpened.value ? (s(), U(C(st), {
586
- key: 0,
587
- useModal: C(d),
588
- title: e.title || e.placeholder,
589
- size: "sm",
590
- classModal: !0,
591
- titleCenter: !0
592
- }, {
593
- default: R(() => [
594
- t("div", _t, [
595
- e.searchable ? (s(), l("div", $t, [
596
- t("div", Mt, [
597
- o[13] || (o[13] = t("svg", {
598
- xmlns: "http://www.w3.org/2000/svg",
599
- fill: "none",
600
- viewBox: "0 0 24 24",
601
- "stroke-width": "1.5",
602
- stroke: "currentColor",
603
- class: "absolute left-2.5 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400"
604
- }, [
605
- t("path", {
606
- "stroke-linecap": "round",
607
- "stroke-linejoin": "round",
608
- d: "M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z"
609
- })
610
- ], -1)),
611
- X(t("input", {
612
- ref_key: "mobileSearchInputRef",
613
- ref: h,
614
- "onUpdate:modelValue": o[2] || (o[2] = (u) => v.value = u),
615
- type: "text",
616
- placeholder: e.searchPlaceholder,
617
- class: "w-full rounded-md border border-gray-300 py-2 pl-8 pr-3 text-sm outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent",
618
- onInput: se
619
- }, null, 40, Vt), [
620
- [ie, v.value]
621
- ])
622
- ])
623
- ])) : y("", !0),
624
- e.createLabel ? (s(), l("div", Kt, [
625
- t("button", {
626
- class: "w-full flex items-center justify-center gap-2 py-2 text-sm text-blue-700 hover:text-blue-500",
627
- onClick: o[3] || (o[3] = (u) => te(() => C(d).close()))
628
- }, [
629
- o[14] || (o[14] = t("svg", {
630
- xmlns: "http://www.w3.org/2000/svg",
631
- fill: "none",
632
- viewBox: "0 0 24 24",
633
- "stroke-width": "1.5",
634
- stroke: "currentColor",
635
- class: "w-4 h-4"
636
- }, [
637
- t("path", {
638
- "stroke-linecap": "round",
639
- "stroke-linejoin": "round",
640
- d: "M12 4.5v15m7.5-7.5h-15"
641
- })
642
- ], -1)),
643
- t("span", null, p(e.createLabel), 1)
644
- ])
645
- ])) : y("", !0),
646
- e.multiple ? (s(), l("div", Ot, [
647
- t("button", {
648
- class: "text-sm text-blue-600 hover:text-blue-800 transition-colors",
649
- onClick: Q
650
- }, p(C(a)("ui.dropdown.selectAll")), 1),
651
- S.value ? (s(), l("button", {
652
- key: 0,
653
- class: "text-sm text-gray-500 hover:text-gray-700 transition-colors",
654
- onClick: ee
655
- }, p(C(a)("ui.dropdown.clear")), 1)) : y("", !0)
656
- ])) : y("", !0),
657
- e.isLoading ? (s(), l("div", Lt, [...o[15] || (o[15] = [
658
- t("div", { class: "animate-spin w-6 h-6 border-2 border-blue-500 border-t-transparent rounded-full" }, null, -1)
659
- ])])) : (s(), l("div", jt, [
660
- e.allowEmpty ? (s(), l("button", {
661
- key: 0,
662
- class: b(["flex items-center gap-3 w-full px-3 py-3 text-sm text-left hover:bg-gray-50 transition-colors", S.value ? "" : "bg-gray-50 font-medium"]),
663
- role: "option",
664
- "aria-selected": !S.value,
665
- onClick: o[4] || (o[4] = (u) => z(null, () => C(d).close()))
666
- }, [
667
- S.value ? (s(), l("span", Bt)) : (s(), l("svg", St, [...o[16] || (o[16] = [
668
- t("path", {
669
- "stroke-linecap": "round",
670
- "stroke-linejoin": "round",
671
- d: "M4.5 12.75l6 6 9-13.5"
672
- }, null, -1)
673
- ])])),
674
- t("span", null, p(e.emptyLabel ?? e.placeholder), 1)
675
- ], 10, At)) : y("", !0),
676
- e.groupKey ? (s(!0), l(B, { key: 1 }, D(Y.value, (u) => (s(), l(B, {
677
- key: u.label
678
- }, [
679
- u.label ? (s(), l("div", It, p(u.label), 1)) : y("", !0),
680
- (s(!0), l(B, null, D(u.entries, (r) => (s(), l("button", {
681
- key: r.item[e.valueKey],
682
- class: b(["flex items-center gap-3 w-full px-3 py-3 text-sm text-left hover:bg-gray-50 transition-colors break-words", L(r.item) ? "bg-gray-50 font-medium" : ""]),
683
- role: "option",
684
- "aria-selected": L(r.item),
685
- onClick: (j) => z(r.item, () => C(d).close())
686
- }, [
687
- L(r.item) ? (s(), l("svg", Et, [...o[17] || (o[17] = [
688
- t("path", {
689
- "stroke-linecap": "round",
690
- "stroke-linejoin": "round",
691
- d: "M4.5 12.75l6 6 9-13.5"
692
- }, null, -1)
693
- ])])) : (s(), l("span", Dt)),
694
- M(e.$slots, "item", W({ ref_for: !0 }, { item: r.item }), () => [
695
- t("span", null, p(r.item[e.labelKey]), 1)
696
- ])
697
- ], 10, zt))), 128))
698
- ], 64))), 128)) : (s(!0), l(B, { key: 2 }, D(E.value, (u) => (s(), l("button", {
699
- key: u[e.valueKey],
700
- class: b(["flex items-center gap-3 w-full px-3 py-3 text-sm text-left hover:bg-gray-50 transition-colors break-words", L(u) ? "bg-gray-50 font-medium" : ""]),
701
- role: "option",
702
- "aria-selected": L(u),
703
- onClick: (r) => z(u, () => C(d).close())
704
- }, [
705
- L(u) ? (s(), l("svg", Ft, [...o[18] || (o[18] = [
706
- t("path", {
707
- "stroke-linecap": "round",
708
- "stroke-linejoin": "round",
709
- d: "M4.5 12.75l6 6 9-13.5"
710
- }, null, -1)
711
- ])])) : (s(), l("span", Wt)),
712
- M(e.$slots, "item", W({ ref_for: !0 }, { item: u }), () => [
713
- t("span", null, p(u[e.labelKey]), 1)
714
- ])
715
- ], 10, Rt))), 128)),
716
- E.value.length === 0 && !e.allowEmpty ? (s(), l("div", Pt, [
717
- M(e.$slots, "empty", {}, () => [
718
- ue(p(C(a)("ui.dropdown.nothingFound")), 1)
719
- ])
720
- ])) : y("", !0)
721
- ]))
722
- ])
723
- ]),
724
- _: 3
725
- }, 8, ["useModal", "title"])) : y("", !0)
726
- ], 64)) : (s(), U(Ae, {
727
- key: 0,
728
- stick: e.stick,
729
- onOpen: he,
730
- onClose: ye
731
- }, {
732
- button: R(({ onToggle: u, isExpanded: r }) => [
733
- M(e.$slots, "button", P(T({ onToggle: u, isExpanded: r, selectedLabel: F.value })), () => [
734
- t("button", {
735
- class: b(["inline-flex items-center justify-between gap-2 text-sm transition-colors", [
736
- e.view === "pill" ? "rounded-full bg-gray-100 px-3.5 py-1.5 hover:bg-gray-200 text-gray-700" : "rounded-lg border border-gray-300 bg-white px-3 py-2 hover:bg-gray-50 min-w-[180px]",
737
- e.view === "default" && r ? "ring-1 ring-blue-500 border-blue-500" : ""
738
- ]]),
739
- style: N(e.maxWidth ? { maxWidth: e.maxWidth } : void 0),
740
- onClick: u
741
- }, [
742
- t("span", {
743
- class: b(["truncate", e.view === "pill" ? "" : S.value ? "text-gray-900" : "text-gray-500"])
744
- }, p(F.value), 3),
745
- (s(), l("svg", {
746
- xmlns: "http://www.w3.org/2000/svg",
747
- fill: "none",
748
- viewBox: "0 0 24 24",
749
- "stroke-width": "1.5",
750
- stroke: "currentColor",
751
- class: b(["w-4 h-4 text-gray-400 transition-transform shrink-0", r ? "rotate-180" : ""])
752
- }, [...o[5] || (o[5] = [
753
- t("path", {
754
- "stroke-linecap": "round",
755
- "stroke-linejoin": "round",
756
- d: "M19.5 8.25l-7.5 7.5-7.5-7.5"
757
- }, null, -1)
758
- ])], 2))
759
- ], 14, ot)
760
- ])
761
- ]),
762
- menu: R(({ onToggle: u }) => [
763
- t("div", {
764
- class: "min-w-[240px] w-full",
765
- onKeydown: (r) => we(r, u)
766
- }, [
767
- e.title ? (s(), l("div", rt, p(e.title), 1)) : y("", !0),
768
- e.searchable ? (s(), l("div", at, [
769
- t("div", it, [
770
- o[6] || (o[6] = t("svg", {
771
- xmlns: "http://www.w3.org/2000/svg",
772
- fill: "none",
773
- viewBox: "0 0 24 24",
774
- "stroke-width": "1.5",
775
- stroke: "currentColor",
776
- class: "absolute left-2.5 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400"
777
- }, [
778
- t("path", {
779
- "stroke-linecap": "round",
780
- "stroke-linejoin": "round",
781
- d: "M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z"
782
- })
783
- ], -1)),
784
- X(t("input", {
785
- ref_key: "searchInputRef",
786
- ref: $,
787
- "onUpdate:modelValue": o[0] || (o[0] = (r) => v.value = r),
788
- type: "text",
789
- placeholder: e.searchPlaceholder,
790
- class: "w-full rounded-md border border-gray-300 py-1.5 pl-8 pr-3 text-sm outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500",
791
- onInput: se
792
- }, null, 40, ut), [
793
- [ie, v.value]
794
- ])
795
- ])
796
- ])) : y("", !0),
797
- e.createLabel ? (s(), l("div", dt, [
798
- t("button", {
799
- class: "flex items-center gap-2 w-full px-3 py-2 text-sm text-blue-700 hover:bg-gray-50 transition-colors",
800
- onClick: (r) => te(u)
801
- }, [
802
- o[7] || (o[7] = t("svg", {
803
- xmlns: "http://www.w3.org/2000/svg",
804
- fill: "none",
805
- viewBox: "0 0 24 24",
806
- "stroke-width": "1.5",
807
- stroke: "currentColor",
808
- class: "w-4 h-4"
809
- }, [
810
- t("path", {
811
- "stroke-linecap": "round",
812
- "stroke-linejoin": "round",
813
- d: "M12 4.5v15m7.5-7.5h-15"
814
- })
815
- ], -1)),
816
- t("span", null, p(e.createLabel), 1)
817
- ], 8, ct)
818
- ])) : y("", !0),
819
- e.multiple ? (s(), l("div", pt, [
820
- t("button", {
821
- class: "text-xs text-blue-600 hover:text-blue-800 transition-colors",
822
- onClick: Q
823
- }, p(C(a)("ui.dropdown.selectAll")), 1),
824
- S.value ? (s(), l("button", {
825
- key: 0,
826
- class: "text-xs text-gray-500 hover:text-gray-700 transition-colors",
827
- onClick: ee
828
- }, p(C(a)("ui.dropdown.clear")), 1)) : y("", !0)
829
- ])) : y("", !0),
830
- e.isLoading ? (s(), l("div", vt, [...o[8] || (o[8] = [
831
- t("svg", {
832
- class: "animate-spin h-5 w-5 text-gray-400",
833
- xmlns: "http://www.w3.org/2000/svg",
834
- fill: "none",
835
- viewBox: "0 0 24 24"
836
- }, [
837
- t("circle", {
838
- class: "opacity-25",
839
- cx: "12",
840
- cy: "12",
841
- r: "10",
842
- stroke: "currentColor",
843
- "stroke-width": "4"
844
- }),
845
- t("path", {
846
- class: "opacity-75",
847
- fill: "currentColor",
848
- d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"
849
- })
850
- ], -1)
851
- ])])) : (s(), l("div", {
852
- key: 5,
853
- ref_key: "listRef",
854
- ref: I,
855
- class: "max-h-[300px] overflow-y-auto",
856
- role: "listbox"
857
- }, [
858
- e.allowEmpty ? (s(), l("button", {
859
- key: 0,
860
- ref: (r) => x(r, 0),
861
- class: b(["flex items-center gap-2 w-full px-3 py-2 text-sm text-left transition-colors", [
862
- S.value ? "hover:bg-gray-50" : "bg-gray-100 font-medium",
863
- c.value === 0 ? "bg-gray-50" : ""
864
- ]]),
865
- role: "option",
866
- "aria-selected": !S.value,
867
- onClick: (r) => z(null, u),
868
- onMouseenter: o[1] || (o[1] = (r) => c.value = 0)
869
- }, [
870
- S.value ? (s(), l("span", ht)) : (s(), l("svg", ft, [...o[9] || (o[9] = [
871
- t("path", {
872
- "stroke-linecap": "round",
873
- "stroke-linejoin": "round",
874
- d: "M4.5 12.75l6 6 9-13.5"
875
- }, null, -1)
876
- ])])),
877
- t("span", null, p(e.emptyLabel ?? e.placeholder), 1)
878
- ], 42, mt)) : y("", !0),
879
- e.groupKey ? (s(!0), l(B, { key: 1 }, D(Y.value, (r, j) => (s(), l(B, {
880
- key: r.label
881
- }, [
882
- r.label ? (s(), l("div", {
883
- key: 0,
884
- class: b(["px-3 pt-2 pb-1 text-xs font-semibold text-gray-500 uppercase tracking-wide", j > 0 ? "border-t border-gray-100 mt-1" : ""])
885
- }, p(r.label), 3)) : y("", !0),
886
- (s(!0), l(B, null, D(r.entries, (w) => (s(), l("button", {
887
- key: w.item[e.valueKey],
888
- ref_for: !0,
889
- ref: (G) => x(G, w.flatIndex),
890
- class: b(["flex items-center gap-2 w-full px-3 py-2 text-sm text-left transition-colors break-words", [
891
- L(w.item) ? "bg-gray-100 font-medium" : "hover:bg-gray-50",
892
- c.value === w.flatIndex ? "bg-gray-50" : ""
893
- ]]),
894
- role: "option",
895
- "aria-selected": L(w.item),
896
- onClick: (G) => z(w.item, u),
897
- onMouseenter: (G) => c.value = w.flatIndex
898
- }, [
899
- L(w.item) ? (s(), l("svg", wt, [...o[10] || (o[10] = [
900
- t("path", {
901
- "stroke-linecap": "round",
902
- "stroke-linejoin": "round",
903
- d: "M4.5 12.75l6 6 9-13.5"
904
- }, null, -1)
905
- ])])) : (s(), l("span", gt)),
906
- M(e.$slots, "item", W({ ref_for: !0 }, { item: w.item }), () => [
907
- t("span", null, p(w.item[e.labelKey]), 1)
908
- ])
909
- ], 42, yt))), 128))
910
- ], 64))), 128)) : (s(!0), l(B, { key: 2 }, D(E.value, (r, j) => (s(), l("button", {
911
- key: r[e.valueKey],
912
- ref_for: !0,
913
- ref: (w) => x(w, O.value + j),
914
- class: b(["flex items-center gap-2 w-full px-3 py-2 text-sm text-left transition-colors break-words", [
915
- L(r) ? "bg-gray-100 font-medium" : "hover:bg-gray-50",
916
- c.value === O.value + j ? "bg-gray-50" : ""
917
- ]]),
918
- role: "option",
919
- "aria-selected": L(r),
920
- onClick: (w) => z(r, u),
921
- onMouseenter: (w) => c.value = O.value + j
922
- }, [
923
- L(r) ? (s(), l("svg", kt, [...o[11] || (o[11] = [
924
- t("path", {
925
- "stroke-linecap": "round",
926
- "stroke-linejoin": "round",
927
- d: "M4.5 12.75l6 6 9-13.5"
928
- }, null, -1)
929
- ])])) : (s(), l("span", xt)),
930
- M(e.$slots, "item", W({ ref_for: !0 }, { item: r }), () => [
931
- t("span", null, p(r[e.labelKey]), 1)
932
- ])
933
- ], 42, bt))), 128)),
934
- E.value.length === 0 && !e.allowEmpty ? (s(), l("div", Ct, [
935
- M(e.$slots, "empty", {}, () => [
936
- ue(p(C(a)("ui.dropdown.nothingFound")), 1)
937
- ])
938
- ])) : y("", !0)
939
- ], 512))
940
- ], 40, nt)
941
- ]),
942
- _: 3
943
- }, 8, ["stick"]));
944
- }
945
- });
946
- export {
947
- st as O,
948
- Ae as _,
949
- Ht as a,
950
- Jt as b,
951
- Xt as c,
952
- Ye as m,
953
- lt as u
954
- };