@keenmate/web-multiselect 1.0.0-rc11 → 1.1.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.
- package/README.md +554 -89
- package/dist/multiselect.js +1508 -1267
- package/dist/multiselect.umd.js +42 -47
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/scss/_badges-display.scss +229 -0
- package/src/scss/_base.scss +2 -2
- package/src/scss/_css-variables.scss +364 -218
- package/src/scss/_input-dropdown.scss +82 -69
- package/src/scss/_modifiers.scss +38 -38
- package/src/scss/_options.scss +83 -65
- package/src/scss/_rtl.scss +35 -35
- package/src/scss/_tooltips-popover.scss +69 -57
- package/src/scss/_variables.scss +61 -56
- package/src/scss/main.scss +4 -4
- package/src/scss/_pills-display.scss +0 -228
package/dist/multiselect.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var
|
|
4
|
-
const
|
|
5
|
-
x:
|
|
6
|
-
y:
|
|
7
|
-
}),
|
|
1
|
+
var lt = Object.defineProperty;
|
|
2
|
+
var ct = (s, e, t) => e in s ? lt(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t;
|
|
3
|
+
var p = (s, e, t) => ct(s, typeof e != "symbol" ? e + "" : e, t);
|
|
4
|
+
const ce = Math.min, H = Math.max, de = Math.round, re = Math.floor, E = (s) => ({
|
|
5
|
+
x: s,
|
|
6
|
+
y: s
|
|
7
|
+
}), dt = {
|
|
8
8
|
left: "right",
|
|
9
9
|
right: "left",
|
|
10
10
|
bottom: "top",
|
|
@@ -13,50 +13,50 @@ const ae = Math.min, B = Math.max, ce = Math.round, le = Math.floor, M = (i) =>
|
|
|
13
13
|
start: "end",
|
|
14
14
|
end: "start"
|
|
15
15
|
};
|
|
16
|
-
function Ee(
|
|
17
|
-
return
|
|
16
|
+
function Ee(s, e, t) {
|
|
17
|
+
return H(s, ce(e, t));
|
|
18
18
|
}
|
|
19
|
-
function me(
|
|
20
|
-
return typeof
|
|
19
|
+
function me(s, e) {
|
|
20
|
+
return typeof s == "function" ? s(e) : s;
|
|
21
21
|
}
|
|
22
|
-
function
|
|
23
|
-
return
|
|
22
|
+
function F(s) {
|
|
23
|
+
return s.split("-")[0];
|
|
24
24
|
}
|
|
25
|
-
function ue(
|
|
26
|
-
return
|
|
25
|
+
function ue(s) {
|
|
26
|
+
return s.split("-")[1];
|
|
27
27
|
}
|
|
28
|
-
function
|
|
29
|
-
return
|
|
28
|
+
function Fe(s) {
|
|
29
|
+
return s === "x" ? "y" : "x";
|
|
30
30
|
}
|
|
31
|
-
function Ge(
|
|
32
|
-
return
|
|
31
|
+
function Ge(s) {
|
|
32
|
+
return s === "y" ? "height" : "width";
|
|
33
33
|
}
|
|
34
|
-
const
|
|
35
|
-
function
|
|
36
|
-
return
|
|
34
|
+
const pt = /* @__PURE__ */ new Set(["top", "bottom"]);
|
|
35
|
+
function B(s) {
|
|
36
|
+
return pt.has(F(s)) ? "y" : "x";
|
|
37
37
|
}
|
|
38
|
-
function
|
|
39
|
-
return
|
|
38
|
+
function We(s) {
|
|
39
|
+
return Fe(B(s));
|
|
40
40
|
}
|
|
41
|
-
function
|
|
41
|
+
function mt(s, e, t) {
|
|
42
42
|
t === void 0 && (t = !1);
|
|
43
|
-
const
|
|
44
|
-
let
|
|
45
|
-
return e.reference[
|
|
43
|
+
const i = ue(s), o = We(s), n = Ge(o);
|
|
44
|
+
let r = o === "x" ? i === (t ? "end" : "start") ? "right" : "left" : i === "start" ? "bottom" : "top";
|
|
45
|
+
return e.reference[n] > e.floating[n] && (r = he(r)), [r, he(r)];
|
|
46
46
|
}
|
|
47
|
-
function
|
|
48
|
-
const e =
|
|
49
|
-
return [Ce(
|
|
47
|
+
function ut(s) {
|
|
48
|
+
const e = he(s);
|
|
49
|
+
return [Ce(s), e, Ce(e)];
|
|
50
50
|
}
|
|
51
|
-
function Ce(
|
|
52
|
-
return
|
|
51
|
+
function Ce(s) {
|
|
52
|
+
return s.replace(/start|end/g, (e) => ht[e]);
|
|
53
53
|
}
|
|
54
|
-
const
|
|
55
|
-
function
|
|
56
|
-
switch (
|
|
54
|
+
const Me = ["left", "right"], Ve = ["right", "left"], gt = ["top", "bottom"], bt = ["bottom", "top"];
|
|
55
|
+
function ft(s, e, t) {
|
|
56
|
+
switch (s) {
|
|
57
57
|
case "top":
|
|
58
58
|
case "bottom":
|
|
59
|
-
return t ? e ?
|
|
59
|
+
return t ? e ? Ve : Me : e ? Me : Ve;
|
|
60
60
|
case "left":
|
|
61
61
|
case "right":
|
|
62
62
|
return e ? gt : bt;
|
|
@@ -64,272 +64,272 @@ function vt(i, e, t) {
|
|
|
64
64
|
return [];
|
|
65
65
|
}
|
|
66
66
|
}
|
|
67
|
-
function
|
|
68
|
-
const o = ue(
|
|
69
|
-
let
|
|
70
|
-
return o && (
|
|
67
|
+
function vt(s, e, t, i) {
|
|
68
|
+
const o = ue(s);
|
|
69
|
+
let n = ft(F(s), t === "start", i);
|
|
70
|
+
return o && (n = n.map((r) => r + "-" + o), e && (n = n.concat(n.map(Ce)))), n;
|
|
71
71
|
}
|
|
72
|
-
function
|
|
73
|
-
return
|
|
72
|
+
function he(s) {
|
|
73
|
+
return s.replace(/left|right|bottom|top/g, (e) => dt[e]);
|
|
74
74
|
}
|
|
75
|
-
function
|
|
75
|
+
function wt(s) {
|
|
76
76
|
return {
|
|
77
77
|
top: 0,
|
|
78
78
|
right: 0,
|
|
79
79
|
bottom: 0,
|
|
80
80
|
left: 0,
|
|
81
|
-
...
|
|
81
|
+
...s
|
|
82
82
|
};
|
|
83
83
|
}
|
|
84
|
-
function yt(
|
|
85
|
-
return typeof
|
|
86
|
-
top:
|
|
87
|
-
right:
|
|
88
|
-
bottom:
|
|
89
|
-
left:
|
|
84
|
+
function yt(s) {
|
|
85
|
+
return typeof s != "number" ? wt(s) : {
|
|
86
|
+
top: s,
|
|
87
|
+
right: s,
|
|
88
|
+
bottom: s,
|
|
89
|
+
left: s
|
|
90
90
|
};
|
|
91
91
|
}
|
|
92
|
-
function pe(
|
|
92
|
+
function pe(s) {
|
|
93
93
|
const {
|
|
94
94
|
x: e,
|
|
95
95
|
y: t,
|
|
96
|
-
width:
|
|
96
|
+
width: i,
|
|
97
97
|
height: o
|
|
98
|
-
} =
|
|
98
|
+
} = s;
|
|
99
99
|
return {
|
|
100
|
-
width:
|
|
100
|
+
width: i,
|
|
101
101
|
height: o,
|
|
102
102
|
top: t,
|
|
103
103
|
left: e,
|
|
104
|
-
right: e +
|
|
104
|
+
right: e + i,
|
|
105
105
|
bottom: t + o,
|
|
106
106
|
x: e,
|
|
107
107
|
y: t
|
|
108
108
|
};
|
|
109
109
|
}
|
|
110
|
-
function
|
|
110
|
+
function Pe(s, e, t) {
|
|
111
111
|
let {
|
|
112
|
-
reference:
|
|
112
|
+
reference: i,
|
|
113
113
|
floating: o
|
|
114
|
-
} =
|
|
115
|
-
const
|
|
114
|
+
} = s;
|
|
115
|
+
const n = B(e), r = We(e), a = Ge(r), l = F(e), c = n === "y", d = i.x + i.width / 2 - o.width / 2, m = i.y + i.height / 2 - o.height / 2, u = i[a] / 2 - o[a] / 2;
|
|
116
116
|
let h;
|
|
117
|
-
switch (
|
|
117
|
+
switch (l) {
|
|
118
118
|
case "top":
|
|
119
119
|
h = {
|
|
120
|
-
x:
|
|
121
|
-
y:
|
|
120
|
+
x: d,
|
|
121
|
+
y: i.y - o.height
|
|
122
122
|
};
|
|
123
123
|
break;
|
|
124
124
|
case "bottom":
|
|
125
125
|
h = {
|
|
126
|
-
x:
|
|
127
|
-
y:
|
|
126
|
+
x: d,
|
|
127
|
+
y: i.y + i.height
|
|
128
128
|
};
|
|
129
129
|
break;
|
|
130
130
|
case "right":
|
|
131
131
|
h = {
|
|
132
|
-
x:
|
|
132
|
+
x: i.x + i.width,
|
|
133
133
|
y: m
|
|
134
134
|
};
|
|
135
135
|
break;
|
|
136
136
|
case "left":
|
|
137
137
|
h = {
|
|
138
|
-
x:
|
|
138
|
+
x: i.x - o.width,
|
|
139
139
|
y: m
|
|
140
140
|
};
|
|
141
141
|
break;
|
|
142
142
|
default:
|
|
143
143
|
h = {
|
|
144
|
-
x:
|
|
145
|
-
y:
|
|
144
|
+
x: i.x,
|
|
145
|
+
y: i.y
|
|
146
146
|
};
|
|
147
147
|
}
|
|
148
148
|
switch (ue(e)) {
|
|
149
149
|
case "start":
|
|
150
|
-
h[
|
|
150
|
+
h[r] -= u * (t && c ? -1 : 1);
|
|
151
151
|
break;
|
|
152
152
|
case "end":
|
|
153
|
-
h[
|
|
153
|
+
h[r] += u * (t && c ? -1 : 1);
|
|
154
154
|
break;
|
|
155
155
|
}
|
|
156
156
|
return h;
|
|
157
157
|
}
|
|
158
|
-
const
|
|
158
|
+
const _t = async (s, e, t) => {
|
|
159
159
|
const {
|
|
160
|
-
placement:
|
|
160
|
+
placement: i = "bottom",
|
|
161
161
|
strategy: o = "absolute",
|
|
162
|
-
middleware:
|
|
163
|
-
platform:
|
|
164
|
-
} = t,
|
|
165
|
-
let
|
|
166
|
-
reference:
|
|
162
|
+
middleware: n = [],
|
|
163
|
+
platform: r
|
|
164
|
+
} = t, a = n.filter(Boolean), l = await (r.isRTL == null ? void 0 : r.isRTL(e));
|
|
165
|
+
let c = await r.getElementRects({
|
|
166
|
+
reference: s,
|
|
167
167
|
floating: e,
|
|
168
168
|
strategy: o
|
|
169
169
|
}), {
|
|
170
|
-
x:
|
|
170
|
+
x: d,
|
|
171
171
|
y: m
|
|
172
|
-
} =
|
|
173
|
-
for (let
|
|
172
|
+
} = Pe(c, i, l), u = i, h = {}, g = 0;
|
|
173
|
+
for (let b = 0; b < a.length; b++) {
|
|
174
174
|
const {
|
|
175
|
-
name:
|
|
176
|
-
fn:
|
|
177
|
-
} =
|
|
178
|
-
x:
|
|
179
|
-
y:
|
|
180
|
-
data:
|
|
181
|
-
reset:
|
|
182
|
-
} = await
|
|
183
|
-
x:
|
|
175
|
+
name: v,
|
|
176
|
+
fn: w
|
|
177
|
+
} = a[b], {
|
|
178
|
+
x: y,
|
|
179
|
+
y: C,
|
|
180
|
+
data: k,
|
|
181
|
+
reset: x
|
|
182
|
+
} = await w({
|
|
183
|
+
x: d,
|
|
184
184
|
y: m,
|
|
185
|
-
initialPlacement:
|
|
186
|
-
placement:
|
|
185
|
+
initialPlacement: i,
|
|
186
|
+
placement: u,
|
|
187
187
|
strategy: o,
|
|
188
188
|
middlewareData: h,
|
|
189
|
-
rects:
|
|
190
|
-
platform:
|
|
189
|
+
rects: c,
|
|
190
|
+
platform: r,
|
|
191
191
|
elements: {
|
|
192
|
-
reference:
|
|
192
|
+
reference: s,
|
|
193
193
|
floating: e
|
|
194
194
|
}
|
|
195
195
|
});
|
|
196
|
-
|
|
196
|
+
d = y ?? d, m = C ?? m, h = {
|
|
197
197
|
...h,
|
|
198
|
-
[
|
|
199
|
-
...h[
|
|
200
|
-
...
|
|
198
|
+
[v]: {
|
|
199
|
+
...h[v],
|
|
200
|
+
...k
|
|
201
201
|
}
|
|
202
|
-
},
|
|
203
|
-
reference:
|
|
202
|
+
}, x && g <= 50 && (g++, typeof x == "object" && (x.placement && (u = x.placement), x.rects && (c = x.rects === !0 ? await r.getElementRects({
|
|
203
|
+
reference: s,
|
|
204
204
|
floating: e,
|
|
205
205
|
strategy: o
|
|
206
|
-
}) :
|
|
207
|
-
x:
|
|
206
|
+
}) : x.rects), {
|
|
207
|
+
x: d,
|
|
208
208
|
y: m
|
|
209
|
-
} =
|
|
209
|
+
} = Pe(c, u, l)), b = -1);
|
|
210
210
|
}
|
|
211
211
|
return {
|
|
212
|
-
x:
|
|
212
|
+
x: d,
|
|
213
213
|
y: m,
|
|
214
|
-
placement:
|
|
214
|
+
placement: u,
|
|
215
215
|
strategy: o,
|
|
216
216
|
middlewareData: h
|
|
217
217
|
};
|
|
218
218
|
};
|
|
219
|
-
async function
|
|
219
|
+
async function je(s, e) {
|
|
220
220
|
var t;
|
|
221
221
|
e === void 0 && (e = {});
|
|
222
222
|
const {
|
|
223
|
-
x:
|
|
223
|
+
x: i,
|
|
224
224
|
y: o,
|
|
225
|
-
platform:
|
|
226
|
-
rects:
|
|
227
|
-
elements:
|
|
228
|
-
strategy:
|
|
229
|
-
} =
|
|
230
|
-
boundary:
|
|
231
|
-
rootBoundary:
|
|
225
|
+
platform: n,
|
|
226
|
+
rects: r,
|
|
227
|
+
elements: a,
|
|
228
|
+
strategy: l
|
|
229
|
+
} = s, {
|
|
230
|
+
boundary: c = "clippingAncestors",
|
|
231
|
+
rootBoundary: d = "viewport",
|
|
232
232
|
elementContext: m = "floating",
|
|
233
|
-
altBoundary:
|
|
233
|
+
altBoundary: u = !1,
|
|
234
234
|
padding: h = 0
|
|
235
|
-
} = me(e,
|
|
236
|
-
element: (t = await (
|
|
237
|
-
boundary:
|
|
238
|
-
rootBoundary:
|
|
239
|
-
strategy:
|
|
240
|
-
})),
|
|
241
|
-
x:
|
|
235
|
+
} = me(e, s), g = yt(h), v = a[u ? m === "floating" ? "reference" : "floating" : m], w = pe(await n.getClippingRect({
|
|
236
|
+
element: (t = await (n.isElement == null ? void 0 : n.isElement(v))) == null || t ? v : v.contextElement || await (n.getDocumentElement == null ? void 0 : n.getDocumentElement(a.floating)),
|
|
237
|
+
boundary: c,
|
|
238
|
+
rootBoundary: d,
|
|
239
|
+
strategy: l
|
|
240
|
+
})), y = m === "floating" ? {
|
|
241
|
+
x: i,
|
|
242
242
|
y: o,
|
|
243
|
-
width:
|
|
244
|
-
height:
|
|
245
|
-
} :
|
|
243
|
+
width: r.floating.width,
|
|
244
|
+
height: r.floating.height
|
|
245
|
+
} : r.reference, C = await (n.getOffsetParent == null ? void 0 : n.getOffsetParent(a.floating)), k = await (n.isElement == null ? void 0 : n.isElement(C)) ? await (n.getScale == null ? void 0 : n.getScale(C)) || {
|
|
246
246
|
x: 1,
|
|
247
247
|
y: 1
|
|
248
248
|
} : {
|
|
249
249
|
x: 1,
|
|
250
250
|
y: 1
|
|
251
|
-
},
|
|
252
|
-
elements:
|
|
253
|
-
rect:
|
|
254
|
-
offsetParent:
|
|
255
|
-
strategy:
|
|
256
|
-
}) :
|
|
251
|
+
}, x = pe(n.convertOffsetParentRelativeRectToViewportRelativeRect ? await n.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
252
|
+
elements: a,
|
|
253
|
+
rect: y,
|
|
254
|
+
offsetParent: C,
|
|
255
|
+
strategy: l
|
|
256
|
+
}) : y);
|
|
257
257
|
return {
|
|
258
|
-
top: (
|
|
259
|
-
bottom: (
|
|
260
|
-
left: (
|
|
261
|
-
right: (
|
|
258
|
+
top: (w.top - x.top + g.top) / k.y,
|
|
259
|
+
bottom: (x.bottom - w.bottom + g.bottom) / k.y,
|
|
260
|
+
left: (w.left - x.left + g.left) / k.x,
|
|
261
|
+
right: (x.right - w.right + g.right) / k.x
|
|
262
262
|
};
|
|
263
263
|
}
|
|
264
|
-
const Ct = function(
|
|
265
|
-
return
|
|
264
|
+
const Ct = function(s) {
|
|
265
|
+
return s === void 0 && (s = {}), {
|
|
266
266
|
name: "flip",
|
|
267
|
-
options:
|
|
267
|
+
options: s,
|
|
268
268
|
async fn(e) {
|
|
269
|
-
var t,
|
|
269
|
+
var t, i;
|
|
270
270
|
const {
|
|
271
271
|
placement: o,
|
|
272
|
-
middlewareData:
|
|
273
|
-
rects:
|
|
274
|
-
initialPlacement:
|
|
275
|
-
platform:
|
|
276
|
-
elements:
|
|
272
|
+
middlewareData: n,
|
|
273
|
+
rects: r,
|
|
274
|
+
initialPlacement: a,
|
|
275
|
+
platform: l,
|
|
276
|
+
elements: c
|
|
277
277
|
} = e, {
|
|
278
|
-
mainAxis:
|
|
278
|
+
mainAxis: d = !0,
|
|
279
279
|
crossAxis: m = !0,
|
|
280
|
-
fallbackPlacements:
|
|
280
|
+
fallbackPlacements: u,
|
|
281
281
|
fallbackStrategy: h = "bestFit",
|
|
282
|
-
fallbackAxisSideDirection:
|
|
283
|
-
flipAlignment:
|
|
284
|
-
...
|
|
285
|
-
} = me(
|
|
286
|
-
if ((t =
|
|
282
|
+
fallbackAxisSideDirection: g = "none",
|
|
283
|
+
flipAlignment: b = !0,
|
|
284
|
+
...v
|
|
285
|
+
} = me(s, e);
|
|
286
|
+
if ((t = n.arrow) != null && t.alignmentOffset)
|
|
287
287
|
return {};
|
|
288
|
-
const
|
|
289
|
-
!
|
|
290
|
-
const
|
|
291
|
-
let
|
|
292
|
-
if (
|
|
293
|
-
const
|
|
294
|
-
|
|
288
|
+
const w = F(o), y = B(a), C = F(a) === a, k = await (l.isRTL == null ? void 0 : l.isRTL(c.floating)), x = u || (C || !b ? [he(a)] : ut(a)), J = g !== "none";
|
|
289
|
+
!u && J && x.push(...vt(a, b, g, k));
|
|
290
|
+
const W = [a, ...x], we = await je(e, v), ne = [];
|
|
291
|
+
let j = ((i = n.flip) == null ? void 0 : i.overflows) || [];
|
|
292
|
+
if (d && ne.push(we[w]), m) {
|
|
293
|
+
const z = mt(o, r, k);
|
|
294
|
+
ne.push(we[z[0]], we[z[1]]);
|
|
295
295
|
}
|
|
296
|
-
if (
|
|
296
|
+
if (j = [...j, {
|
|
297
297
|
placement: o,
|
|
298
|
-
overflows:
|
|
299
|
-
}], !
|
|
300
|
-
var
|
|
301
|
-
const
|
|
302
|
-
if (
|
|
298
|
+
overflows: ne
|
|
299
|
+
}], !ne.every((z) => z <= 0)) {
|
|
300
|
+
var Oe, Le;
|
|
301
|
+
const z = (((Oe = n.flip) == null ? void 0 : Oe.index) || 0) + 1, ye = W[z];
|
|
302
|
+
if (ye && (!(m === "alignment" ? y !== B(ye) : !1) || // We leave the current main axis only if every placement on that axis
|
|
303
303
|
// overflows the main axis.
|
|
304
|
-
|
|
304
|
+
j.every((T) => B(T.placement) === y ? T.overflows[0] > 0 : !0)))
|
|
305
305
|
return {
|
|
306
306
|
data: {
|
|
307
|
-
index:
|
|
308
|
-
overflows:
|
|
307
|
+
index: z,
|
|
308
|
+
overflows: j
|
|
309
309
|
},
|
|
310
310
|
reset: {
|
|
311
|
-
placement:
|
|
311
|
+
placement: ye
|
|
312
312
|
}
|
|
313
313
|
};
|
|
314
|
-
let X = (
|
|
314
|
+
let X = (Le = j.filter((R) => R.overflows[0] <= 0).sort((R, T) => R.overflows[1] - T.overflows[1])[0]) == null ? void 0 : Le.placement;
|
|
315
315
|
if (!X)
|
|
316
316
|
switch (h) {
|
|
317
317
|
case "bestFit": {
|
|
318
|
-
var
|
|
319
|
-
const
|
|
318
|
+
var $e;
|
|
319
|
+
const R = ($e = j.filter((T) => {
|
|
320
320
|
if (J) {
|
|
321
|
-
const
|
|
322
|
-
return
|
|
321
|
+
const P = B(T.placement);
|
|
322
|
+
return P === y || // Create a bias to the `y` side axis due to horizontal
|
|
323
323
|
// reading directions favoring greater width.
|
|
324
|
-
|
|
324
|
+
P === "y";
|
|
325
325
|
}
|
|
326
326
|
return !0;
|
|
327
|
-
}).map((
|
|
328
|
-
|
|
327
|
+
}).map((T) => [T.placement, T.overflows.filter((P) => P > 0).reduce((P, at) => P + at, 0)]).sort((T, P) => T[1] - P[1])[0]) == null ? void 0 : $e[0];
|
|
328
|
+
R && (X = R);
|
|
329
329
|
break;
|
|
330
330
|
}
|
|
331
331
|
case "initialPlacement":
|
|
332
|
-
X =
|
|
332
|
+
X = a;
|
|
333
333
|
break;
|
|
334
334
|
}
|
|
335
335
|
if (o !== X)
|
|
@@ -342,17 +342,17 @@ const Ct = function(i) {
|
|
|
342
342
|
return {};
|
|
343
343
|
}
|
|
344
344
|
};
|
|
345
|
-
},
|
|
346
|
-
async function
|
|
345
|
+
}, xt = /* @__PURE__ */ new Set(["left", "top"]);
|
|
346
|
+
async function kt(s, e) {
|
|
347
347
|
const {
|
|
348
348
|
placement: t,
|
|
349
|
-
platform:
|
|
349
|
+
platform: i,
|
|
350
350
|
elements: o
|
|
351
|
-
} =
|
|
351
|
+
} = s, n = await (i.isRTL == null ? void 0 : i.isRTL(o.floating)), r = F(t), a = ue(t), l = B(t) === "y", c = xt.has(r) ? -1 : 1, d = n && l ? -1 : 1, m = me(e, s);
|
|
352
352
|
let {
|
|
353
|
-
mainAxis:
|
|
353
|
+
mainAxis: u,
|
|
354
354
|
crossAxis: h,
|
|
355
|
-
alignmentAxis:
|
|
355
|
+
alignmentAxis: g
|
|
356
356
|
} = typeof m == "number" ? {
|
|
357
357
|
mainAxis: m,
|
|
358
358
|
crossAxis: 0,
|
|
@@ -362,154 +362,154 @@ async function St(i, e) {
|
|
|
362
362
|
crossAxis: m.crossAxis || 0,
|
|
363
363
|
alignmentAxis: m.alignmentAxis
|
|
364
364
|
};
|
|
365
|
-
return
|
|
366
|
-
x: h *
|
|
367
|
-
y:
|
|
365
|
+
return a && typeof g == "number" && (h = a === "end" ? g * -1 : g), l ? {
|
|
366
|
+
x: h * d,
|
|
367
|
+
y: u * c
|
|
368
368
|
} : {
|
|
369
|
-
x:
|
|
370
|
-
y: h *
|
|
369
|
+
x: u * c,
|
|
370
|
+
y: h * d
|
|
371
371
|
};
|
|
372
372
|
}
|
|
373
|
-
const
|
|
374
|
-
return
|
|
373
|
+
const St = function(s) {
|
|
374
|
+
return s === void 0 && (s = 0), {
|
|
375
375
|
name: "offset",
|
|
376
|
-
options:
|
|
376
|
+
options: s,
|
|
377
377
|
async fn(e) {
|
|
378
|
-
var t,
|
|
378
|
+
var t, i;
|
|
379
379
|
const {
|
|
380
380
|
x: o,
|
|
381
|
-
y:
|
|
382
|
-
placement:
|
|
383
|
-
middlewareData:
|
|
384
|
-
} = e,
|
|
385
|
-
return
|
|
386
|
-
x: o +
|
|
387
|
-
y:
|
|
381
|
+
y: n,
|
|
382
|
+
placement: r,
|
|
383
|
+
middlewareData: a
|
|
384
|
+
} = e, l = await kt(e, s);
|
|
385
|
+
return r === ((t = a.offset) == null ? void 0 : t.placement) && (i = a.arrow) != null && i.alignmentOffset ? {} : {
|
|
386
|
+
x: o + l.x,
|
|
387
|
+
y: n + l.y,
|
|
388
388
|
data: {
|
|
389
|
-
...
|
|
390
|
-
placement:
|
|
389
|
+
...l,
|
|
390
|
+
placement: r
|
|
391
391
|
}
|
|
392
392
|
};
|
|
393
393
|
}
|
|
394
394
|
};
|
|
395
|
-
},
|
|
396
|
-
return
|
|
395
|
+
}, At = function(s) {
|
|
396
|
+
return s === void 0 && (s = {}), {
|
|
397
397
|
name: "shift",
|
|
398
|
-
options:
|
|
398
|
+
options: s,
|
|
399
399
|
async fn(e) {
|
|
400
400
|
const {
|
|
401
401
|
x: t,
|
|
402
|
-
y:
|
|
402
|
+
y: i,
|
|
403
403
|
placement: o
|
|
404
404
|
} = e, {
|
|
405
|
-
mainAxis:
|
|
406
|
-
crossAxis:
|
|
407
|
-
limiter:
|
|
408
|
-
fn: (
|
|
405
|
+
mainAxis: n = !0,
|
|
406
|
+
crossAxis: r = !1,
|
|
407
|
+
limiter: a = {
|
|
408
|
+
fn: (v) => {
|
|
409
409
|
let {
|
|
410
|
-
x:
|
|
411
|
-
y
|
|
412
|
-
} =
|
|
410
|
+
x: w,
|
|
411
|
+
y
|
|
412
|
+
} = v;
|
|
413
413
|
return {
|
|
414
|
-
x:
|
|
415
|
-
y
|
|
414
|
+
x: w,
|
|
415
|
+
y
|
|
416
416
|
};
|
|
417
417
|
}
|
|
418
418
|
},
|
|
419
|
-
...
|
|
420
|
-
} = me(
|
|
419
|
+
...l
|
|
420
|
+
} = me(s, e), c = {
|
|
421
421
|
x: t,
|
|
422
|
-
y:
|
|
423
|
-
},
|
|
424
|
-
let h =
|
|
425
|
-
if (s) {
|
|
426
|
-
const g = p === "y" ? "top" : "left", b = p === "y" ? "bottom" : "right", _ = h + c[g], x = h - c[b];
|
|
427
|
-
h = Ee(_, h, x);
|
|
428
|
-
}
|
|
422
|
+
y: i
|
|
423
|
+
}, d = await je(e, l), m = B(F(o)), u = Fe(m);
|
|
424
|
+
let h = c[u], g = c[m];
|
|
429
425
|
if (n) {
|
|
430
|
-
const
|
|
431
|
-
|
|
426
|
+
const v = u === "y" ? "top" : "left", w = u === "y" ? "bottom" : "right", y = h + d[v], C = h - d[w];
|
|
427
|
+
h = Ee(y, h, C);
|
|
428
|
+
}
|
|
429
|
+
if (r) {
|
|
430
|
+
const v = m === "y" ? "top" : "left", w = m === "y" ? "bottom" : "right", y = g + d[v], C = g - d[w];
|
|
431
|
+
g = Ee(y, g, C);
|
|
432
432
|
}
|
|
433
|
-
const
|
|
433
|
+
const b = a.fn({
|
|
434
434
|
...e,
|
|
435
|
-
[
|
|
436
|
-
[m]:
|
|
435
|
+
[u]: h,
|
|
436
|
+
[m]: g
|
|
437
437
|
});
|
|
438
438
|
return {
|
|
439
|
-
...
|
|
439
|
+
...b,
|
|
440
440
|
data: {
|
|
441
|
-
x:
|
|
442
|
-
y:
|
|
441
|
+
x: b.x - t,
|
|
442
|
+
y: b.y - i,
|
|
443
443
|
enabled: {
|
|
444
|
-
[
|
|
445
|
-
[m]:
|
|
444
|
+
[u]: n,
|
|
445
|
+
[m]: r
|
|
446
446
|
}
|
|
447
447
|
}
|
|
448
448
|
};
|
|
449
449
|
}
|
|
450
450
|
};
|
|
451
451
|
};
|
|
452
|
-
function
|
|
452
|
+
function ge() {
|
|
453
453
|
return typeof window < "u";
|
|
454
454
|
}
|
|
455
|
-
function
|
|
456
|
-
return
|
|
455
|
+
function Y(s) {
|
|
456
|
+
return Ue(s) ? (s.nodeName || "").toLowerCase() : "#document";
|
|
457
457
|
}
|
|
458
|
-
function
|
|
458
|
+
function I(s) {
|
|
459
459
|
var e;
|
|
460
|
-
return (
|
|
460
|
+
return (s == null || (e = s.ownerDocument) == null ? void 0 : e.defaultView) || window;
|
|
461
461
|
}
|
|
462
|
-
function
|
|
462
|
+
function V(s) {
|
|
463
463
|
var e;
|
|
464
|
-
return (e = (
|
|
464
|
+
return (e = (Ue(s) ? s.ownerDocument : s.document) || window.document) == null ? void 0 : e.documentElement;
|
|
465
465
|
}
|
|
466
|
-
function
|
|
467
|
-
return
|
|
466
|
+
function Ue(s) {
|
|
467
|
+
return ge() ? s instanceof Node || s instanceof I(s).Node : !1;
|
|
468
468
|
}
|
|
469
|
-
function
|
|
470
|
-
return
|
|
469
|
+
function L(s) {
|
|
470
|
+
return ge() ? s instanceof Element || s instanceof I(s).Element : !1;
|
|
471
471
|
}
|
|
472
|
-
function
|
|
473
|
-
return
|
|
472
|
+
function M(s) {
|
|
473
|
+
return ge() ? s instanceof HTMLElement || s instanceof I(s).HTMLElement : !1;
|
|
474
474
|
}
|
|
475
|
-
function
|
|
476
|
-
return !
|
|
475
|
+
function Be(s) {
|
|
476
|
+
return !ge() || typeof ShadowRoot > "u" ? !1 : s instanceof ShadowRoot || s instanceof I(s).ShadowRoot;
|
|
477
477
|
}
|
|
478
478
|
const It = /* @__PURE__ */ new Set(["inline", "contents"]);
|
|
479
|
-
function
|
|
479
|
+
function oe(s) {
|
|
480
480
|
const {
|
|
481
481
|
overflow: e,
|
|
482
482
|
overflowX: t,
|
|
483
|
-
overflowY:
|
|
483
|
+
overflowY: i,
|
|
484
484
|
display: o
|
|
485
|
-
} =
|
|
486
|
-
return /auto|scroll|overlay|hidden|clip/.test(e +
|
|
485
|
+
} = $(s);
|
|
486
|
+
return /auto|scroll|overlay|hidden|clip/.test(e + i + t) && !It.has(o);
|
|
487
487
|
}
|
|
488
|
-
const
|
|
489
|
-
function
|
|
490
|
-
return
|
|
488
|
+
const Tt = /* @__PURE__ */ new Set(["table", "td", "th"]);
|
|
489
|
+
function Ot(s) {
|
|
490
|
+
return Tt.has(Y(s));
|
|
491
491
|
}
|
|
492
492
|
const Lt = [":popover-open", ":modal"];
|
|
493
|
-
function
|
|
493
|
+
function be(s) {
|
|
494
494
|
return Lt.some((e) => {
|
|
495
495
|
try {
|
|
496
|
-
return
|
|
496
|
+
return s.matches(e);
|
|
497
497
|
} catch {
|
|
498
498
|
return !1;
|
|
499
499
|
}
|
|
500
500
|
});
|
|
501
501
|
}
|
|
502
|
-
const
|
|
503
|
-
function
|
|
504
|
-
const e = Ie(), t =
|
|
505
|
-
return
|
|
502
|
+
const $t = ["transform", "translate", "scale", "rotate", "perspective"], Et = ["transform", "translate", "scale", "rotate", "perspective", "filter"], Mt = ["paint", "layout", "strict", "content"];
|
|
503
|
+
function Ae(s) {
|
|
504
|
+
const e = Ie(), t = L(s) ? $(s) : s;
|
|
505
|
+
return $t.some((i) => t[i] ? t[i] !== "none" : !1) || (t.containerType ? t.containerType !== "normal" : !1) || !e && (t.backdropFilter ? t.backdropFilter !== "none" : !1) || !e && (t.filter ? t.filter !== "none" : !1) || Et.some((i) => (t.willChange || "").includes(i)) || Mt.some((i) => (t.contain || "").includes(i));
|
|
506
506
|
}
|
|
507
|
-
function
|
|
508
|
-
let e = D(
|
|
509
|
-
for (;
|
|
510
|
-
if (
|
|
507
|
+
function Vt(s) {
|
|
508
|
+
let e = D(s);
|
|
509
|
+
for (; M(e) && !K(e); ) {
|
|
510
|
+
if (Ae(e))
|
|
511
511
|
return e;
|
|
512
|
-
if (
|
|
512
|
+
if (be(e))
|
|
513
513
|
return null;
|
|
514
514
|
e = D(e);
|
|
515
515
|
}
|
|
@@ -518,624 +518,624 @@ function $t(i) {
|
|
|
518
518
|
function Ie() {
|
|
519
519
|
return typeof CSS > "u" || !CSS.supports ? !1 : CSS.supports("-webkit-backdrop-filter", "none");
|
|
520
520
|
}
|
|
521
|
-
const
|
|
522
|
-
function
|
|
523
|
-
return
|
|
521
|
+
const Pt = /* @__PURE__ */ new Set(["html", "body", "#document"]);
|
|
522
|
+
function K(s) {
|
|
523
|
+
return Pt.has(Y(s));
|
|
524
524
|
}
|
|
525
|
-
function
|
|
526
|
-
return
|
|
525
|
+
function $(s) {
|
|
526
|
+
return I(s).getComputedStyle(s);
|
|
527
527
|
}
|
|
528
|
-
function
|
|
529
|
-
return
|
|
530
|
-
scrollLeft:
|
|
531
|
-
scrollTop:
|
|
528
|
+
function fe(s) {
|
|
529
|
+
return L(s) ? {
|
|
530
|
+
scrollLeft: s.scrollLeft,
|
|
531
|
+
scrollTop: s.scrollTop
|
|
532
532
|
} : {
|
|
533
|
-
scrollLeft:
|
|
534
|
-
scrollTop:
|
|
533
|
+
scrollLeft: s.scrollX,
|
|
534
|
+
scrollTop: s.scrollY
|
|
535
535
|
};
|
|
536
536
|
}
|
|
537
|
-
function D(
|
|
538
|
-
if (
|
|
539
|
-
return
|
|
537
|
+
function D(s) {
|
|
538
|
+
if (Y(s) === "html")
|
|
539
|
+
return s;
|
|
540
540
|
const e = (
|
|
541
541
|
// Step into the shadow DOM of the parent of a slotted node.
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
542
|
+
s.assignedSlot || // DOM Element detected.
|
|
543
|
+
s.parentNode || // ShadowRoot detected.
|
|
544
|
+
Be(s) && s.host || // Fallback.
|
|
545
|
+
V(s)
|
|
546
546
|
);
|
|
547
|
-
return
|
|
547
|
+
return Be(e) ? e.host : e;
|
|
548
548
|
}
|
|
549
|
-
function
|
|
550
|
-
const e = D(
|
|
551
|
-
return
|
|
549
|
+
function Ke(s) {
|
|
550
|
+
const e = D(s);
|
|
551
|
+
return K(e) ? s.ownerDocument ? s.ownerDocument.body : s.body : M(e) && oe(e) ? e : Ke(e);
|
|
552
552
|
}
|
|
553
|
-
function
|
|
554
|
-
var
|
|
553
|
+
function se(s, e, t) {
|
|
554
|
+
var i;
|
|
555
555
|
e === void 0 && (e = []), t === void 0 && (t = !0);
|
|
556
|
-
const o =
|
|
557
|
-
if (
|
|
558
|
-
const
|
|
559
|
-
return e.concat(
|
|
556
|
+
const o = Ke(s), n = o === ((i = s.ownerDocument) == null ? void 0 : i.body), r = I(o);
|
|
557
|
+
if (n) {
|
|
558
|
+
const a = xe(r);
|
|
559
|
+
return e.concat(r, r.visualViewport || [], oe(o) ? o : [], a && t ? se(a) : []);
|
|
560
560
|
}
|
|
561
|
-
return e.concat(o,
|
|
561
|
+
return e.concat(o, se(o, [], t));
|
|
562
562
|
}
|
|
563
|
-
function
|
|
564
|
-
return
|
|
563
|
+
function xe(s) {
|
|
564
|
+
return s.parent && Object.getPrototypeOf(s.parent) ? s.frameElement : null;
|
|
565
565
|
}
|
|
566
|
-
function
|
|
567
|
-
const e =
|
|
568
|
-
let t = parseFloat(e.width) || 0,
|
|
569
|
-
const o =
|
|
570
|
-
return
|
|
566
|
+
function Ye(s) {
|
|
567
|
+
const e = $(s);
|
|
568
|
+
let t = parseFloat(e.width) || 0, i = parseFloat(e.height) || 0;
|
|
569
|
+
const o = M(s), n = o ? s.offsetWidth : t, r = o ? s.offsetHeight : i, a = de(t) !== n || de(i) !== r;
|
|
570
|
+
return a && (t = n, i = r), {
|
|
571
571
|
width: t,
|
|
572
|
-
height:
|
|
573
|
-
$:
|
|
572
|
+
height: i,
|
|
573
|
+
$: a
|
|
574
574
|
};
|
|
575
575
|
}
|
|
576
|
-
function
|
|
577
|
-
return
|
|
576
|
+
function Te(s) {
|
|
577
|
+
return L(s) ? s : s.contextElement;
|
|
578
578
|
}
|
|
579
|
-
function
|
|
580
|
-
const e =
|
|
581
|
-
if (!
|
|
582
|
-
return
|
|
579
|
+
function U(s) {
|
|
580
|
+
const e = Te(s);
|
|
581
|
+
if (!M(e))
|
|
582
|
+
return E(1);
|
|
583
583
|
const t = e.getBoundingClientRect(), {
|
|
584
|
-
width:
|
|
584
|
+
width: i,
|
|
585
585
|
height: o,
|
|
586
|
-
$:
|
|
587
|
-
} =
|
|
588
|
-
let
|
|
589
|
-
return (!
|
|
590
|
-
x:
|
|
591
|
-
y:
|
|
586
|
+
$: n
|
|
587
|
+
} = Ye(e);
|
|
588
|
+
let r = (n ? de(t.width) : t.width) / i, a = (n ? de(t.height) : t.height) / o;
|
|
589
|
+
return (!r || !Number.isFinite(r)) && (r = 1), (!a || !Number.isFinite(a)) && (a = 1), {
|
|
590
|
+
x: r,
|
|
591
|
+
y: a
|
|
592
592
|
};
|
|
593
593
|
}
|
|
594
|
-
const
|
|
595
|
-
function
|
|
596
|
-
const e =
|
|
597
|
-
return !Ie() || !e.visualViewport ?
|
|
594
|
+
const Bt = /* @__PURE__ */ E(0);
|
|
595
|
+
function Je(s) {
|
|
596
|
+
const e = I(s);
|
|
597
|
+
return !Ie() || !e.visualViewport ? Bt : {
|
|
598
598
|
x: e.visualViewport.offsetLeft,
|
|
599
599
|
y: e.visualViewport.offsetTop
|
|
600
600
|
};
|
|
601
601
|
}
|
|
602
|
-
function
|
|
603
|
-
return e === void 0 && (e = !1), !t || e && t !==
|
|
602
|
+
function Dt(s, e, t) {
|
|
603
|
+
return e === void 0 && (e = !1), !t || e && t !== I(s) ? !1 : e;
|
|
604
604
|
}
|
|
605
|
-
function
|
|
605
|
+
function G(s, e, t, i) {
|
|
606
606
|
e === void 0 && (e = !1), t === void 0 && (t = !1);
|
|
607
|
-
const o =
|
|
608
|
-
let
|
|
609
|
-
e && (
|
|
610
|
-
const
|
|
611
|
-
let
|
|
612
|
-
if (
|
|
613
|
-
const
|
|
614
|
-
let
|
|
615
|
-
for (;
|
|
616
|
-
const
|
|
617
|
-
|
|
607
|
+
const o = s.getBoundingClientRect(), n = Te(s);
|
|
608
|
+
let r = E(1);
|
|
609
|
+
e && (i ? L(i) && (r = U(i)) : r = U(s));
|
|
610
|
+
const a = Dt(n, t, i) ? Je(n) : E(0);
|
|
611
|
+
let l = (o.left + a.x) / r.x, c = (o.top + a.y) / r.y, d = o.width / r.x, m = o.height / r.y;
|
|
612
|
+
if (n) {
|
|
613
|
+
const u = I(n), h = i && L(i) ? I(i) : i;
|
|
614
|
+
let g = u, b = xe(g);
|
|
615
|
+
for (; b && i && h !== g; ) {
|
|
616
|
+
const v = U(b), w = b.getBoundingClientRect(), y = $(b), C = w.left + (b.clientLeft + parseFloat(y.paddingLeft)) * v.x, k = w.top + (b.clientTop + parseFloat(y.paddingTop)) * v.y;
|
|
617
|
+
l *= v.x, c *= v.y, d *= v.x, m *= v.y, l += C, c += k, g = I(b), b = xe(g);
|
|
618
618
|
}
|
|
619
619
|
}
|
|
620
620
|
return pe({
|
|
621
|
-
width:
|
|
621
|
+
width: d,
|
|
622
622
|
height: m,
|
|
623
|
-
x:
|
|
624
|
-
y:
|
|
623
|
+
x: l,
|
|
624
|
+
y: c
|
|
625
625
|
});
|
|
626
626
|
}
|
|
627
|
-
function ve(
|
|
628
|
-
const t =
|
|
629
|
-
return e ? e.left + t :
|
|
627
|
+
function ve(s, e) {
|
|
628
|
+
const t = fe(s).scrollLeft;
|
|
629
|
+
return e ? e.left + t : G(V(s)).left + t;
|
|
630
630
|
}
|
|
631
|
-
function
|
|
632
|
-
const t =
|
|
631
|
+
function Xe(s, e) {
|
|
632
|
+
const t = s.getBoundingClientRect(), i = t.left + e.scrollLeft - ve(s, t), o = t.top + e.scrollTop;
|
|
633
633
|
return {
|
|
634
|
-
x:
|
|
634
|
+
x: i,
|
|
635
635
|
y: o
|
|
636
636
|
};
|
|
637
637
|
}
|
|
638
|
-
function
|
|
638
|
+
function zt(s) {
|
|
639
639
|
let {
|
|
640
640
|
elements: e,
|
|
641
641
|
rect: t,
|
|
642
|
-
offsetParent:
|
|
642
|
+
offsetParent: i,
|
|
643
643
|
strategy: o
|
|
644
|
-
} =
|
|
645
|
-
const
|
|
646
|
-
if (
|
|
644
|
+
} = s;
|
|
645
|
+
const n = o === "fixed", r = V(i), a = e ? be(e.floating) : !1;
|
|
646
|
+
if (i === r || a && n)
|
|
647
647
|
return t;
|
|
648
|
-
let
|
|
648
|
+
let l = {
|
|
649
649
|
scrollLeft: 0,
|
|
650
650
|
scrollTop: 0
|
|
651
|
-
},
|
|
652
|
-
const
|
|
653
|
-
if ((m || !m && !
|
|
654
|
-
const h =
|
|
655
|
-
|
|
651
|
+
}, c = E(1);
|
|
652
|
+
const d = E(0), m = M(i);
|
|
653
|
+
if ((m || !m && !n) && ((Y(i) !== "body" || oe(r)) && (l = fe(i)), M(i))) {
|
|
654
|
+
const h = G(i);
|
|
655
|
+
c = U(i), d.x = h.x + i.clientLeft, d.y = h.y + i.clientTop;
|
|
656
656
|
}
|
|
657
|
-
const
|
|
657
|
+
const u = r && !m && !n ? Xe(r, l) : E(0);
|
|
658
658
|
return {
|
|
659
|
-
width: t.width *
|
|
660
|
-
height: t.height *
|
|
661
|
-
x: t.x *
|
|
662
|
-
y: t.y *
|
|
659
|
+
width: t.width * c.x,
|
|
660
|
+
height: t.height * c.y,
|
|
661
|
+
x: t.x * c.x - l.scrollLeft * c.x + d.x + u.x,
|
|
662
|
+
y: t.y * c.y - l.scrollTop * c.y + d.y + u.y
|
|
663
663
|
};
|
|
664
664
|
}
|
|
665
|
-
function
|
|
666
|
-
return Array.from(
|
|
665
|
+
function Rt(s) {
|
|
666
|
+
return Array.from(s.getClientRects());
|
|
667
667
|
}
|
|
668
|
-
function
|
|
669
|
-
const e =
|
|
670
|
-
let
|
|
671
|
-
const
|
|
672
|
-
return
|
|
668
|
+
function Nt(s) {
|
|
669
|
+
const e = V(s), t = fe(s), i = s.ownerDocument.body, o = H(e.scrollWidth, e.clientWidth, i.scrollWidth, i.clientWidth), n = H(e.scrollHeight, e.clientHeight, i.scrollHeight, i.clientHeight);
|
|
670
|
+
let r = -t.scrollLeft + ve(s);
|
|
671
|
+
const a = -t.scrollTop;
|
|
672
|
+
return $(i).direction === "rtl" && (r += H(e.clientWidth, i.clientWidth) - o), {
|
|
673
673
|
width: o,
|
|
674
|
-
height: s,
|
|
675
|
-
x: n,
|
|
676
|
-
y: r
|
|
677
|
-
};
|
|
678
|
-
}
|
|
679
|
-
const Fe = 25;
|
|
680
|
-
function Bt(i, e) {
|
|
681
|
-
const t = P(i), l = E(i), o = t.visualViewport;
|
|
682
|
-
let s = l.clientWidth, n = l.clientHeight, r = 0, a = 0;
|
|
683
|
-
if (o) {
|
|
684
|
-
s = o.width, n = o.height;
|
|
685
|
-
const c = Ie();
|
|
686
|
-
(!c || c && e === "fixed") && (r = o.offsetLeft, a = o.offsetTop);
|
|
687
|
-
}
|
|
688
|
-
const d = ve(l);
|
|
689
|
-
if (d <= 0) {
|
|
690
|
-
const c = l.ownerDocument, m = c.body, p = getComputedStyle(m), h = c.compatMode === "CSS1Compat" && parseFloat(p.marginLeft) + parseFloat(p.marginRight) || 0, f = Math.abs(l.clientWidth - m.clientWidth - h);
|
|
691
|
-
f <= Fe && (s -= f);
|
|
692
|
-
} else d <= Fe && (s += d);
|
|
693
|
-
return {
|
|
694
|
-
width: s,
|
|
695
674
|
height: n,
|
|
696
675
|
x: r,
|
|
697
676
|
y: a
|
|
698
677
|
};
|
|
699
678
|
}
|
|
700
|
-
const
|
|
701
|
-
function
|
|
702
|
-
const t =
|
|
679
|
+
const De = 25;
|
|
680
|
+
function Ht(s, e) {
|
|
681
|
+
const t = I(s), i = V(s), o = t.visualViewport;
|
|
682
|
+
let n = i.clientWidth, r = i.clientHeight, a = 0, l = 0;
|
|
683
|
+
if (o) {
|
|
684
|
+
n = o.width, r = o.height;
|
|
685
|
+
const d = Ie();
|
|
686
|
+
(!d || d && e === "fixed") && (a = o.offsetLeft, l = o.offsetTop);
|
|
687
|
+
}
|
|
688
|
+
const c = ve(i);
|
|
689
|
+
if (c <= 0) {
|
|
690
|
+
const d = i.ownerDocument, m = d.body, u = getComputedStyle(m), h = d.compatMode === "CSS1Compat" && parseFloat(u.marginLeft) + parseFloat(u.marginRight) || 0, g = Math.abs(i.clientWidth - m.clientWidth - h);
|
|
691
|
+
g <= De && (n -= g);
|
|
692
|
+
} else c <= De && (n += c);
|
|
703
693
|
return {
|
|
704
694
|
width: n,
|
|
705
695
|
height: r,
|
|
706
696
|
x: a,
|
|
707
|
-
y:
|
|
697
|
+
y: l
|
|
698
|
+
};
|
|
699
|
+
}
|
|
700
|
+
const Ft = /* @__PURE__ */ new Set(["absolute", "fixed"]);
|
|
701
|
+
function Gt(s, e) {
|
|
702
|
+
const t = G(s, !0, e === "fixed"), i = t.top + s.clientTop, o = t.left + s.clientLeft, n = M(s) ? U(s) : E(1), r = s.clientWidth * n.x, a = s.clientHeight * n.y, l = o * n.x, c = i * n.y;
|
|
703
|
+
return {
|
|
704
|
+
width: r,
|
|
705
|
+
height: a,
|
|
706
|
+
x: l,
|
|
707
|
+
y: c
|
|
708
708
|
};
|
|
709
709
|
}
|
|
710
|
-
function
|
|
711
|
-
let
|
|
710
|
+
function ze(s, e, t) {
|
|
711
|
+
let i;
|
|
712
712
|
if (e === "viewport")
|
|
713
|
-
|
|
713
|
+
i = Ht(s, t);
|
|
714
714
|
else if (e === "document")
|
|
715
|
-
|
|
716
|
-
else if (
|
|
717
|
-
|
|
715
|
+
i = Nt(V(s));
|
|
716
|
+
else if (L(e))
|
|
717
|
+
i = Gt(e, t);
|
|
718
718
|
else {
|
|
719
|
-
const o =
|
|
720
|
-
|
|
719
|
+
const o = Je(s);
|
|
720
|
+
i = {
|
|
721
721
|
x: e.x - o.x,
|
|
722
722
|
y: e.y - o.y,
|
|
723
723
|
width: e.width,
|
|
724
724
|
height: e.height
|
|
725
725
|
};
|
|
726
726
|
}
|
|
727
|
-
return pe(
|
|
727
|
+
return pe(i);
|
|
728
728
|
}
|
|
729
|
-
function
|
|
730
|
-
const t = D(
|
|
731
|
-
return t === e || !
|
|
729
|
+
function qe(s, e) {
|
|
730
|
+
const t = D(s);
|
|
731
|
+
return t === e || !L(t) || K(t) ? !1 : $(t).position === "fixed" || qe(t, e);
|
|
732
732
|
}
|
|
733
|
-
function
|
|
734
|
-
const t = e.get(
|
|
733
|
+
function Wt(s, e) {
|
|
734
|
+
const t = e.get(s);
|
|
735
735
|
if (t)
|
|
736
736
|
return t;
|
|
737
|
-
let
|
|
738
|
-
const
|
|
739
|
-
let
|
|
740
|
-
for (;
|
|
741
|
-
const
|
|
742
|
-
!
|
|
737
|
+
let i = se(s, [], !1).filter((a) => L(a) && Y(a) !== "body"), o = null;
|
|
738
|
+
const n = $(s).position === "fixed";
|
|
739
|
+
let r = n ? D(s) : s;
|
|
740
|
+
for (; L(r) && !K(r); ) {
|
|
741
|
+
const a = $(r), l = Ae(r);
|
|
742
|
+
!l && a.position === "fixed" && (o = null), (n ? !l && !o : !l && a.position === "static" && !!o && Ft.has(o.position) || oe(r) && !l && qe(s, r)) ? i = i.filter((d) => d !== r) : o = a, r = D(r);
|
|
743
743
|
}
|
|
744
|
-
return e.set(
|
|
744
|
+
return e.set(s, i), i;
|
|
745
745
|
}
|
|
746
|
-
function
|
|
746
|
+
function jt(s) {
|
|
747
747
|
let {
|
|
748
748
|
element: e,
|
|
749
749
|
boundary: t,
|
|
750
|
-
rootBoundary:
|
|
750
|
+
rootBoundary: i,
|
|
751
751
|
strategy: o
|
|
752
|
-
} =
|
|
753
|
-
const
|
|
754
|
-
const m =
|
|
755
|
-
return
|
|
756
|
-
},
|
|
752
|
+
} = s;
|
|
753
|
+
const r = [...t === "clippingAncestors" ? be(e) ? [] : Wt(e, this._c) : [].concat(t), i], a = r[0], l = r.reduce((c, d) => {
|
|
754
|
+
const m = ze(e, d, o);
|
|
755
|
+
return c.top = H(m.top, c.top), c.right = ce(m.right, c.right), c.bottom = ce(m.bottom, c.bottom), c.left = H(m.left, c.left), c;
|
|
756
|
+
}, ze(e, a, o));
|
|
757
757
|
return {
|
|
758
|
-
width:
|
|
759
|
-
height:
|
|
760
|
-
x:
|
|
761
|
-
y:
|
|
758
|
+
width: l.right - l.left,
|
|
759
|
+
height: l.bottom - l.top,
|
|
760
|
+
x: l.left,
|
|
761
|
+
y: l.top
|
|
762
762
|
};
|
|
763
763
|
}
|
|
764
|
-
function
|
|
764
|
+
function Ut(s) {
|
|
765
765
|
const {
|
|
766
766
|
width: e,
|
|
767
767
|
height: t
|
|
768
|
-
} =
|
|
768
|
+
} = Ye(s);
|
|
769
769
|
return {
|
|
770
770
|
width: e,
|
|
771
771
|
height: t
|
|
772
772
|
};
|
|
773
773
|
}
|
|
774
|
-
function
|
|
775
|
-
const
|
|
776
|
-
let
|
|
774
|
+
function Kt(s, e, t) {
|
|
775
|
+
const i = M(e), o = V(e), n = t === "fixed", r = G(s, !0, n, e);
|
|
776
|
+
let a = {
|
|
777
777
|
scrollLeft: 0,
|
|
778
778
|
scrollTop: 0
|
|
779
779
|
};
|
|
780
|
-
const
|
|
781
|
-
function
|
|
782
|
-
|
|
783
|
-
}
|
|
784
|
-
if (
|
|
785
|
-
if ((
|
|
786
|
-
const h =
|
|
787
|
-
|
|
788
|
-
} else o &&
|
|
789
|
-
|
|
790
|
-
const
|
|
780
|
+
const l = E(0);
|
|
781
|
+
function c() {
|
|
782
|
+
l.x = ve(o);
|
|
783
|
+
}
|
|
784
|
+
if (i || !i && !n)
|
|
785
|
+
if ((Y(e) !== "body" || oe(o)) && (a = fe(e)), i) {
|
|
786
|
+
const h = G(e, !0, n, e);
|
|
787
|
+
l.x = h.x + e.clientLeft, l.y = h.y + e.clientTop;
|
|
788
|
+
} else o && c();
|
|
789
|
+
n && !i && o && c();
|
|
790
|
+
const d = o && !i && !n ? Xe(o, a) : E(0), m = r.left + a.scrollLeft - l.x - d.x, u = r.top + a.scrollTop - l.y - d.y;
|
|
791
791
|
return {
|
|
792
792
|
x: m,
|
|
793
|
-
y:
|
|
794
|
-
width:
|
|
795
|
-
height:
|
|
793
|
+
y: u,
|
|
794
|
+
width: r.width,
|
|
795
|
+
height: r.height
|
|
796
796
|
};
|
|
797
797
|
}
|
|
798
|
-
function
|
|
799
|
-
return
|
|
798
|
+
function _e(s) {
|
|
799
|
+
return $(s).position === "static";
|
|
800
800
|
}
|
|
801
|
-
function
|
|
802
|
-
if (!
|
|
801
|
+
function Re(s, e) {
|
|
802
|
+
if (!M(s) || $(s).position === "fixed")
|
|
803
803
|
return null;
|
|
804
804
|
if (e)
|
|
805
|
-
return e(
|
|
806
|
-
let t =
|
|
807
|
-
return
|
|
805
|
+
return e(s);
|
|
806
|
+
let t = s.offsetParent;
|
|
807
|
+
return V(s) === t && (t = t.ownerDocument.body), t;
|
|
808
808
|
}
|
|
809
|
-
function
|
|
810
|
-
const t =
|
|
811
|
-
if (
|
|
809
|
+
function Ze(s, e) {
|
|
810
|
+
const t = I(s);
|
|
811
|
+
if (be(s))
|
|
812
812
|
return t;
|
|
813
|
-
if (!
|
|
814
|
-
let o = D(
|
|
815
|
-
for (; o && !
|
|
816
|
-
if (
|
|
813
|
+
if (!M(s)) {
|
|
814
|
+
let o = D(s);
|
|
815
|
+
for (; o && !K(o); ) {
|
|
816
|
+
if (L(o) && !_e(o))
|
|
817
817
|
return o;
|
|
818
818
|
o = D(o);
|
|
819
819
|
}
|
|
820
820
|
return t;
|
|
821
821
|
}
|
|
822
|
-
let
|
|
823
|
-
for (;
|
|
824
|
-
|
|
825
|
-
return
|
|
822
|
+
let i = Re(s, e);
|
|
823
|
+
for (; i && Ot(i) && _e(i); )
|
|
824
|
+
i = Re(i, e);
|
|
825
|
+
return i && K(i) && _e(i) && !Ae(i) ? t : i || Vt(s) || t;
|
|
826
826
|
}
|
|
827
|
-
const
|
|
828
|
-
const e = this.getOffsetParent ||
|
|
827
|
+
const Yt = async function(s) {
|
|
828
|
+
const e = this.getOffsetParent || Ze, t = this.getDimensions, i = await t(s.floating);
|
|
829
829
|
return {
|
|
830
|
-
reference:
|
|
830
|
+
reference: Kt(s.reference, await e(s.floating), s.strategy),
|
|
831
831
|
floating: {
|
|
832
832
|
x: 0,
|
|
833
833
|
y: 0,
|
|
834
|
-
width:
|
|
835
|
-
height:
|
|
834
|
+
width: i.width,
|
|
835
|
+
height: i.height
|
|
836
836
|
}
|
|
837
837
|
};
|
|
838
838
|
};
|
|
839
|
-
function Jt(
|
|
840
|
-
return
|
|
839
|
+
function Jt(s) {
|
|
840
|
+
return $(s).direction === "rtl";
|
|
841
841
|
}
|
|
842
842
|
const Xt = {
|
|
843
|
-
convertOffsetParentRelativeRectToViewportRelativeRect:
|
|
844
|
-
getDocumentElement:
|
|
845
|
-
getClippingRect:
|
|
846
|
-
getOffsetParent:
|
|
847
|
-
getElementRects:
|
|
848
|
-
getClientRects:
|
|
849
|
-
getDimensions:
|
|
850
|
-
getScale:
|
|
851
|
-
isElement:
|
|
843
|
+
convertOffsetParentRelativeRectToViewportRelativeRect: zt,
|
|
844
|
+
getDocumentElement: V,
|
|
845
|
+
getClippingRect: jt,
|
|
846
|
+
getOffsetParent: Ze,
|
|
847
|
+
getElementRects: Yt,
|
|
848
|
+
getClientRects: Rt,
|
|
849
|
+
getDimensions: Ut,
|
|
850
|
+
getScale: U,
|
|
851
|
+
isElement: L,
|
|
852
852
|
isRTL: Jt
|
|
853
853
|
};
|
|
854
|
-
function
|
|
855
|
-
return
|
|
856
|
-
}
|
|
857
|
-
function
|
|
858
|
-
let t = null,
|
|
859
|
-
const o =
|
|
860
|
-
function
|
|
861
|
-
var
|
|
862
|
-
clearTimeout(
|
|
863
|
-
}
|
|
864
|
-
function
|
|
865
|
-
|
|
866
|
-
const
|
|
867
|
-
left:
|
|
854
|
+
function Qe(s, e) {
|
|
855
|
+
return s.x === e.x && s.y === e.y && s.width === e.width && s.height === e.height;
|
|
856
|
+
}
|
|
857
|
+
function qt(s, e) {
|
|
858
|
+
let t = null, i;
|
|
859
|
+
const o = V(s);
|
|
860
|
+
function n() {
|
|
861
|
+
var a;
|
|
862
|
+
clearTimeout(i), (a = t) == null || a.disconnect(), t = null;
|
|
863
|
+
}
|
|
864
|
+
function r(a, l) {
|
|
865
|
+
a === void 0 && (a = !1), l === void 0 && (l = 1), n();
|
|
866
|
+
const c = s.getBoundingClientRect(), {
|
|
867
|
+
left: d,
|
|
868
868
|
top: m,
|
|
869
|
-
width:
|
|
869
|
+
width: u,
|
|
870
870
|
height: h
|
|
871
|
-
} =
|
|
872
|
-
if (
|
|
871
|
+
} = c;
|
|
872
|
+
if (a || e(), !u || !h)
|
|
873
873
|
return;
|
|
874
|
-
const
|
|
875
|
-
rootMargin: -
|
|
876
|
-
threshold:
|
|
874
|
+
const g = re(m), b = re(o.clientWidth - (d + u)), v = re(o.clientHeight - (m + h)), w = re(d), C = {
|
|
875
|
+
rootMargin: -g + "px " + -b + "px " + -v + "px " + -w + "px",
|
|
876
|
+
threshold: H(0, ce(1, l)) || 1
|
|
877
877
|
};
|
|
878
|
-
let
|
|
879
|
-
function
|
|
880
|
-
const
|
|
881
|
-
if (
|
|
882
|
-
if (!
|
|
883
|
-
return
|
|
884
|
-
|
|
885
|
-
|
|
878
|
+
let k = !0;
|
|
879
|
+
function x(J) {
|
|
880
|
+
const W = J[0].intersectionRatio;
|
|
881
|
+
if (W !== l) {
|
|
882
|
+
if (!k)
|
|
883
|
+
return r();
|
|
884
|
+
W ? r(!1, W) : i = setTimeout(() => {
|
|
885
|
+
r(!1, 1e-7);
|
|
886
886
|
}, 1e3);
|
|
887
887
|
}
|
|
888
|
-
|
|
888
|
+
W === 1 && !Qe(c, s.getBoundingClientRect()) && r(), k = !1;
|
|
889
889
|
}
|
|
890
890
|
try {
|
|
891
|
-
t = new IntersectionObserver(
|
|
892
|
-
...
|
|
891
|
+
t = new IntersectionObserver(x, {
|
|
892
|
+
...C,
|
|
893
893
|
// Handle <iframe>s
|
|
894
894
|
root: o.ownerDocument
|
|
895
895
|
});
|
|
896
896
|
} catch {
|
|
897
|
-
t = new IntersectionObserver(
|
|
897
|
+
t = new IntersectionObserver(x, C);
|
|
898
898
|
}
|
|
899
|
-
t.observe(
|
|
899
|
+
t.observe(s);
|
|
900
900
|
}
|
|
901
|
-
return
|
|
901
|
+
return r(!0), n;
|
|
902
902
|
}
|
|
903
|
-
function
|
|
904
|
-
|
|
903
|
+
function q(s, e, t, i) {
|
|
904
|
+
i === void 0 && (i = {});
|
|
905
905
|
const {
|
|
906
906
|
ancestorScroll: o = !0,
|
|
907
|
-
ancestorResize:
|
|
908
|
-
elementResize:
|
|
909
|
-
layoutShift:
|
|
910
|
-
animationFrame:
|
|
911
|
-
} =
|
|
912
|
-
|
|
913
|
-
o &&
|
|
907
|
+
ancestorResize: n = !0,
|
|
908
|
+
elementResize: r = typeof ResizeObserver == "function",
|
|
909
|
+
layoutShift: a = typeof IntersectionObserver == "function",
|
|
910
|
+
animationFrame: l = !1
|
|
911
|
+
} = i, c = Te(s), d = o || n ? [...c ? se(c) : [], ...se(e)] : [];
|
|
912
|
+
d.forEach((w) => {
|
|
913
|
+
o && w.addEventListener("scroll", t, {
|
|
914
914
|
passive: !0
|
|
915
|
-
}),
|
|
915
|
+
}), n && w.addEventListener("resize", t);
|
|
916
916
|
});
|
|
917
|
-
const m =
|
|
918
|
-
let
|
|
919
|
-
|
|
920
|
-
let [
|
|
921
|
-
|
|
922
|
-
var
|
|
923
|
-
(
|
|
917
|
+
const m = c && a ? qt(c, t) : null;
|
|
918
|
+
let u = -1, h = null;
|
|
919
|
+
r && (h = new ResizeObserver((w) => {
|
|
920
|
+
let [y] = w;
|
|
921
|
+
y && y.target === c && h && (h.unobserve(e), cancelAnimationFrame(u), u = requestAnimationFrame(() => {
|
|
922
|
+
var C;
|
|
923
|
+
(C = h) == null || C.observe(e);
|
|
924
924
|
})), t();
|
|
925
|
-
}),
|
|
926
|
-
let
|
|
927
|
-
|
|
928
|
-
function
|
|
929
|
-
const
|
|
930
|
-
|
|
925
|
+
}), c && !l && h.observe(c), h.observe(e));
|
|
926
|
+
let g, b = l ? G(s) : null;
|
|
927
|
+
l && v();
|
|
928
|
+
function v() {
|
|
929
|
+
const w = G(s);
|
|
930
|
+
b && !Qe(b, w) && t(), b = w, g = requestAnimationFrame(v);
|
|
931
931
|
}
|
|
932
932
|
return t(), () => {
|
|
933
|
-
var
|
|
934
|
-
|
|
935
|
-
o &&
|
|
936
|
-
}), m == null || m(), (
|
|
933
|
+
var w;
|
|
934
|
+
d.forEach((y) => {
|
|
935
|
+
o && y.removeEventListener("scroll", t), n && y.removeEventListener("resize", t);
|
|
936
|
+
}), m == null || m(), (w = h) == null || w.disconnect(), h = null, l && cancelAnimationFrame(g);
|
|
937
937
|
};
|
|
938
938
|
}
|
|
939
|
-
const
|
|
940
|
-
const
|
|
939
|
+
const Z = St, Q = At, ae = Ct, ee = (s, e, t) => {
|
|
940
|
+
const i = /* @__PURE__ */ new Map(), o = {
|
|
941
941
|
platform: Xt,
|
|
942
942
|
...t
|
|
943
|
-
},
|
|
943
|
+
}, n = {
|
|
944
944
|
...o.platform,
|
|
945
|
-
_c:
|
|
945
|
+
_c: i
|
|
946
946
|
};
|
|
947
|
-
return
|
|
947
|
+
return _t(s, e, {
|
|
948
948
|
...o,
|
|
949
|
-
platform:
|
|
949
|
+
platform: n
|
|
950
950
|
});
|
|
951
951
|
};
|
|
952
|
-
var
|
|
953
|
-
}, O = "undefined",
|
|
952
|
+
var et = function() {
|
|
953
|
+
}, O = "undefined", Zt = typeof window !== O && typeof window.navigator !== O && /Trident\/|MSIE /.test(window.navigator.userAgent), ke = [
|
|
954
954
|
"trace",
|
|
955
955
|
"debug",
|
|
956
956
|
"info",
|
|
957
957
|
"warn",
|
|
958
958
|
"error"
|
|
959
|
-
],
|
|
960
|
-
function
|
|
961
|
-
var t =
|
|
959
|
+
], ie = {}, _ = null;
|
|
960
|
+
function Ne(s, e) {
|
|
961
|
+
var t = s[e];
|
|
962
962
|
if (typeof t.bind == "function")
|
|
963
|
-
return t.bind(
|
|
963
|
+
return t.bind(s);
|
|
964
964
|
try {
|
|
965
|
-
return Function.prototype.bind.call(t,
|
|
965
|
+
return Function.prototype.bind.call(t, s);
|
|
966
966
|
} catch {
|
|
967
967
|
return function() {
|
|
968
|
-
return Function.prototype.apply.apply(t, [
|
|
968
|
+
return Function.prototype.apply.apply(t, [s, arguments]);
|
|
969
969
|
};
|
|
970
970
|
}
|
|
971
971
|
}
|
|
972
|
-
function
|
|
972
|
+
function Qt() {
|
|
973
973
|
console.log && (console.log.apply ? console.log.apply(console, arguments) : Function.prototype.apply.apply(console.log, [console, arguments])), console.trace && console.trace();
|
|
974
974
|
}
|
|
975
|
-
function
|
|
976
|
-
return
|
|
975
|
+
function es(s) {
|
|
976
|
+
return s === "debug" && (s = "log"), typeof console === O ? !1 : s === "trace" && Zt ? Qt : console[s] !== void 0 ? Ne(console, s) : console.log !== void 0 ? Ne(console, "log") : et;
|
|
977
977
|
}
|
|
978
|
-
function
|
|
979
|
-
for (var
|
|
980
|
-
var t =
|
|
981
|
-
this[t] = e <
|
|
978
|
+
function te() {
|
|
979
|
+
for (var s = this.getLevel(), e = 0; e < ke.length; e++) {
|
|
980
|
+
var t = ke[e];
|
|
981
|
+
this[t] = e < s ? et : this.methodFactory(t, s, this.name);
|
|
982
982
|
}
|
|
983
|
-
if (this.log = this.debug, typeof console === O &&
|
|
983
|
+
if (this.log = this.debug, typeof console === O && s < this.levels.SILENT)
|
|
984
984
|
return "No console available for logging";
|
|
985
985
|
}
|
|
986
|
-
function
|
|
986
|
+
function ts(s) {
|
|
987
987
|
return function() {
|
|
988
|
-
typeof console !== O && (
|
|
988
|
+
typeof console !== O && (te.call(this), this[s].apply(this, arguments));
|
|
989
989
|
};
|
|
990
990
|
}
|
|
991
|
-
function
|
|
992
|
-
return
|
|
991
|
+
function ss(s, e, t) {
|
|
992
|
+
return es(s) || ts.apply(this, arguments);
|
|
993
993
|
}
|
|
994
|
-
function
|
|
995
|
-
var t = this,
|
|
996
|
-
typeof
|
|
997
|
-
function
|
|
998
|
-
var h = (
|
|
999
|
-
if (!(typeof window === O || !
|
|
994
|
+
function tt(s, e) {
|
|
995
|
+
var t = this, i, o, n, r = "loglevel";
|
|
996
|
+
typeof s == "string" ? r += ":" + s : typeof s == "symbol" && (r = void 0);
|
|
997
|
+
function a(u) {
|
|
998
|
+
var h = (ke[u] || "silent").toUpperCase();
|
|
999
|
+
if (!(typeof window === O || !r)) {
|
|
1000
1000
|
try {
|
|
1001
|
-
window.localStorage[
|
|
1001
|
+
window.localStorage[r] = h;
|
|
1002
1002
|
return;
|
|
1003
1003
|
} catch {
|
|
1004
1004
|
}
|
|
1005
1005
|
try {
|
|
1006
|
-
window.document.cookie = encodeURIComponent(
|
|
1006
|
+
window.document.cookie = encodeURIComponent(r) + "=" + h + ";";
|
|
1007
1007
|
} catch {
|
|
1008
1008
|
}
|
|
1009
1009
|
}
|
|
1010
1010
|
}
|
|
1011
|
-
function
|
|
1012
|
-
var
|
|
1013
|
-
if (!(typeof window === O || !
|
|
1011
|
+
function l() {
|
|
1012
|
+
var u;
|
|
1013
|
+
if (!(typeof window === O || !r)) {
|
|
1014
1014
|
try {
|
|
1015
|
-
|
|
1015
|
+
u = window.localStorage[r];
|
|
1016
1016
|
} catch {
|
|
1017
1017
|
}
|
|
1018
|
-
if (typeof
|
|
1018
|
+
if (typeof u === O)
|
|
1019
1019
|
try {
|
|
1020
|
-
var h = window.document.cookie,
|
|
1021
|
-
|
|
1022
|
-
h.slice(
|
|
1020
|
+
var h = window.document.cookie, g = encodeURIComponent(r), b = h.indexOf(g + "=");
|
|
1021
|
+
b !== -1 && (u = /^([^;]+)/.exec(
|
|
1022
|
+
h.slice(b + g.length + 1)
|
|
1023
1023
|
)[1]);
|
|
1024
1024
|
} catch {
|
|
1025
1025
|
}
|
|
1026
|
-
return t.levels[
|
|
1026
|
+
return t.levels[u] === void 0 && (u = void 0), u;
|
|
1027
1027
|
}
|
|
1028
1028
|
}
|
|
1029
|
-
function
|
|
1030
|
-
if (!(typeof window === O || !
|
|
1029
|
+
function c() {
|
|
1030
|
+
if (!(typeof window === O || !r)) {
|
|
1031
1031
|
try {
|
|
1032
|
-
window.localStorage.removeItem(
|
|
1032
|
+
window.localStorage.removeItem(r);
|
|
1033
1033
|
} catch {
|
|
1034
1034
|
}
|
|
1035
1035
|
try {
|
|
1036
|
-
window.document.cookie = encodeURIComponent(
|
|
1036
|
+
window.document.cookie = encodeURIComponent(r) + "=; expires=Thu, 01 Jan 1970 00:00:00 UTC";
|
|
1037
1037
|
} catch {
|
|
1038
1038
|
}
|
|
1039
1039
|
}
|
|
1040
1040
|
}
|
|
1041
|
-
function
|
|
1042
|
-
var h =
|
|
1041
|
+
function d(u) {
|
|
1042
|
+
var h = u;
|
|
1043
1043
|
if (typeof h == "string" && t.levels[h.toUpperCase()] !== void 0 && (h = t.levels[h.toUpperCase()]), typeof h == "number" && h >= 0 && h <= t.levels.SILENT)
|
|
1044
1044
|
return h;
|
|
1045
|
-
throw new TypeError("log.setLevel() called with invalid level: " +
|
|
1045
|
+
throw new TypeError("log.setLevel() called with invalid level: " + u);
|
|
1046
1046
|
}
|
|
1047
|
-
t.name =
|
|
1047
|
+
t.name = s, t.levels = {
|
|
1048
1048
|
TRACE: 0,
|
|
1049
1049
|
DEBUG: 1,
|
|
1050
1050
|
INFO: 2,
|
|
1051
1051
|
WARN: 3,
|
|
1052
1052
|
ERROR: 4,
|
|
1053
1053
|
SILENT: 5
|
|
1054
|
-
}, t.methodFactory = e ||
|
|
1055
|
-
return
|
|
1056
|
-
}, t.setLevel = function(
|
|
1057
|
-
return
|
|
1058
|
-
}, t.setDefaultLevel = function(
|
|
1059
|
-
o =
|
|
1054
|
+
}, t.methodFactory = e || ss, t.getLevel = function() {
|
|
1055
|
+
return n ?? o ?? i;
|
|
1056
|
+
}, t.setLevel = function(u, h) {
|
|
1057
|
+
return n = d(u), h !== !1 && a(n), te.call(t);
|
|
1058
|
+
}, t.setDefaultLevel = function(u) {
|
|
1059
|
+
o = d(u), l() || t.setLevel(u, !1);
|
|
1060
1060
|
}, t.resetLevel = function() {
|
|
1061
|
-
|
|
1062
|
-
}, t.enableAll = function(
|
|
1063
|
-
t.setLevel(t.levels.TRACE,
|
|
1064
|
-
}, t.disableAll = function(
|
|
1065
|
-
t.setLevel(t.levels.SILENT,
|
|
1061
|
+
n = null, c(), te.call(t);
|
|
1062
|
+
}, t.enableAll = function(u) {
|
|
1063
|
+
t.setLevel(t.levels.TRACE, u);
|
|
1064
|
+
}, t.disableAll = function(u) {
|
|
1065
|
+
t.setLevel(t.levels.SILENT, u);
|
|
1066
1066
|
}, t.rebuild = function() {
|
|
1067
|
-
if (
|
|
1068
|
-
for (var
|
|
1069
|
-
|
|
1070
|
-
},
|
|
1071
|
-
|
|
1067
|
+
if (_ !== t && (i = d(_.getLevel())), te.call(t), _ === t)
|
|
1068
|
+
for (var u in ie)
|
|
1069
|
+
ie[u].rebuild();
|
|
1070
|
+
}, i = d(
|
|
1071
|
+
_ ? _.getLevel() : "WARN"
|
|
1072
1072
|
);
|
|
1073
|
-
var m =
|
|
1074
|
-
m != null && (
|
|
1073
|
+
var m = l();
|
|
1074
|
+
m != null && (n = d(m)), te.call(t);
|
|
1075
1075
|
}
|
|
1076
|
-
|
|
1077
|
-
|
|
1076
|
+
_ = new tt();
|
|
1077
|
+
_.getLogger = function(e) {
|
|
1078
1078
|
if (typeof e != "symbol" && typeof e != "string" || e === "")
|
|
1079
1079
|
throw new TypeError("You must supply a name when creating a logger.");
|
|
1080
|
-
var t =
|
|
1081
|
-
return t || (t =
|
|
1080
|
+
var t = ie[e];
|
|
1081
|
+
return t || (t = ie[e] = new tt(
|
|
1082
1082
|
e,
|
|
1083
|
-
|
|
1083
|
+
_.methodFactory
|
|
1084
1084
|
)), t;
|
|
1085
1085
|
};
|
|
1086
|
-
var
|
|
1087
|
-
|
|
1088
|
-
return typeof window !== O && window.log ===
|
|
1086
|
+
var is = typeof window !== O ? window.log : void 0;
|
|
1087
|
+
_.noConflict = function() {
|
|
1088
|
+
return typeof window !== O && window.log === _ && (window.log = is), _;
|
|
1089
1089
|
};
|
|
1090
|
-
|
|
1091
|
-
return
|
|
1090
|
+
_.getLoggers = function() {
|
|
1091
|
+
return ie;
|
|
1092
1092
|
};
|
|
1093
|
-
|
|
1094
|
-
var
|
|
1095
|
-
for (var e = 1, t = arguments.length,
|
|
1096
|
-
for (
|
|
1097
|
-
Object.prototype.hasOwnProperty.call(arguments[e],
|
|
1098
|
-
return
|
|
1099
|
-
},
|
|
1093
|
+
_.default = _;
|
|
1094
|
+
var os = function(s) {
|
|
1095
|
+
for (var e = 1, t = arguments.length, i; e < t; e++)
|
|
1096
|
+
for (i in arguments[e])
|
|
1097
|
+
Object.prototype.hasOwnProperty.call(arguments[e], i) && (s[i] = arguments[e][i]);
|
|
1098
|
+
return s;
|
|
1099
|
+
}, ns = {
|
|
1100
1100
|
template: "[%t] %l:",
|
|
1101
|
-
levelFormatter: function(
|
|
1102
|
-
return
|
|
1101
|
+
levelFormatter: function(s) {
|
|
1102
|
+
return s.toUpperCase();
|
|
1103
1103
|
},
|
|
1104
|
-
nameFormatter: function(
|
|
1105
|
-
return
|
|
1104
|
+
nameFormatter: function(s) {
|
|
1105
|
+
return s || "root";
|
|
1106
1106
|
},
|
|
1107
|
-
timestampFormatter: function(
|
|
1108
|
-
return
|
|
1107
|
+
timestampFormatter: function(s) {
|
|
1108
|
+
return s.toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");
|
|
1109
1109
|
},
|
|
1110
1110
|
format: void 0
|
|
1111
|
-
},
|
|
1112
|
-
if (!
|
|
1111
|
+
}, st, N = {}, rs = function(s) {
|
|
1112
|
+
if (!s || !s.getLogger)
|
|
1113
1113
|
throw new TypeError("Argument is not a root logger");
|
|
1114
|
-
|
|
1115
|
-
},
|
|
1116
|
-
if (!
|
|
1114
|
+
st = s;
|
|
1115
|
+
}, as = function(s, e) {
|
|
1116
|
+
if (!s || !s.setLevel)
|
|
1117
1117
|
throw new TypeError("Argument is not a logger");
|
|
1118
|
-
var t =
|
|
1119
|
-
function
|
|
1120
|
-
var
|
|
1118
|
+
var t = s.methodFactory, i = s.name || "", o = N[i] || N[""] || ns;
|
|
1119
|
+
function n(r, a, l) {
|
|
1120
|
+
var c = t(r, a, l), d = N[l] || N[""], m = d.template.indexOf("%t") !== -1, u = d.template.indexOf("%l") !== -1, h = d.template.indexOf("%n") !== -1;
|
|
1121
1121
|
return function() {
|
|
1122
|
-
for (var
|
|
1123
|
-
|
|
1124
|
-
if (
|
|
1125
|
-
var
|
|
1126
|
-
|
|
1122
|
+
for (var g = "", b = arguments.length, v = Array(b), w = 0; w < b; w++)
|
|
1123
|
+
v[w] = arguments[w];
|
|
1124
|
+
if (i || !N[l]) {
|
|
1125
|
+
var y = d.timestampFormatter(/* @__PURE__ */ new Date()), C = d.levelFormatter(r), k = d.nameFormatter(l);
|
|
1126
|
+
d.format ? g += d.format(C, k, y) : (g += d.template, m && (g = g.replace(/%t/, y)), u && (g = g.replace(/%l/, C)), h && (g = g.replace(/%n/, k))), v.length && typeof v[0] == "string" ? v[0] = g + " " + v[0] : v.unshift(g);
|
|
1127
1127
|
}
|
|
1128
|
-
|
|
1128
|
+
c.apply(void 0, v);
|
|
1129
1129
|
};
|
|
1130
1130
|
}
|
|
1131
|
-
return N[
|
|
1131
|
+
return N[i] || (s.methodFactory = n), e = e || {}, e.template && (e.format = void 0), N[i] = os({}, o, e), s.setLevel(s.getLevel()), st || s.warn(
|
|
1132
1132
|
"It is necessary to call the function reg() of loglevel-plugin-prefix before calling apply. From the next release, it will throw an error. See more: https://github.com/kutuluk/loglevel-plugin-prefix/blob/master/README.md"
|
|
1133
|
-
),
|
|
1134
|
-
},
|
|
1135
|
-
reg:
|
|
1136
|
-
apply:
|
|
1133
|
+
), s;
|
|
1134
|
+
}, it = {
|
|
1135
|
+
reg: rs,
|
|
1136
|
+
apply: as
|
|
1137
1137
|
};
|
|
1138
|
-
const
|
|
1138
|
+
const ot = {
|
|
1139
1139
|
debug: "#0ea5e9",
|
|
1140
1140
|
// Blue
|
|
1141
1141
|
info: "#10b981",
|
|
@@ -1145,109 +1145,79 @@ const he = {
|
|
|
1145
1145
|
error: "#ef4444"
|
|
1146
1146
|
// Red
|
|
1147
1147
|
};
|
|
1148
|
-
|
|
1149
|
-
|
|
1150
|
-
format(
|
|
1151
|
-
return
|
|
1148
|
+
it.reg(_);
|
|
1149
|
+
it.apply(_, {
|
|
1150
|
+
format(s, e, t) {
|
|
1151
|
+
return ot[s.toLowerCase()], `%c[${t}]%c %c[${s}]%c ${e ? `%c[${e}]%c ` : ""}`;
|
|
1152
1152
|
},
|
|
1153
|
-
timestampFormatter(
|
|
1154
|
-
return
|
|
1153
|
+
timestampFormatter(s) {
|
|
1154
|
+
return s.toTimeString().split(" ")[0] + "." + s.getMilliseconds().toString().padStart(3, "0");
|
|
1155
1155
|
}
|
|
1156
1156
|
});
|
|
1157
|
-
const
|
|
1158
|
-
|
|
1159
|
-
const
|
|
1157
|
+
const ls = _.methodFactory;
|
|
1158
|
+
_.methodFactory = function(s, e, t) {
|
|
1159
|
+
const i = ls(s, e, t);
|
|
1160
1160
|
return function(...o) {
|
|
1161
1161
|
if (o.length > 0 && typeof o[0] == "string" && o[0].includes("%c")) {
|
|
1162
|
-
const
|
|
1162
|
+
const n = ot[s] || "#666", r = [
|
|
1163
1163
|
o[0],
|
|
1164
|
-
`color: ${
|
|
1164
|
+
`color: ${n}; font-weight: bold;`,
|
|
1165
1165
|
// timestamp color
|
|
1166
1166
|
"color: inherit;",
|
|
1167
1167
|
// reset
|
|
1168
|
-
`color: ${
|
|
1168
|
+
`color: ${n}; font-weight: bold;`,
|
|
1169
1169
|
// level color
|
|
1170
1170
|
"color: inherit;",
|
|
1171
1171
|
// reset
|
|
1172
1172
|
...t ? [
|
|
1173
|
-
`color: ${
|
|
1173
|
+
`color: ${n}; font-weight: bold;`,
|
|
1174
1174
|
// name color
|
|
1175
1175
|
"color: inherit;"
|
|
1176
1176
|
// reset
|
|
1177
1177
|
] : [],
|
|
1178
1178
|
...o.slice(1)
|
|
1179
1179
|
];
|
|
1180
|
-
|
|
1180
|
+
i(...r);
|
|
1181
1181
|
} else
|
|
1182
|
-
|
|
1182
|
+
i(...o);
|
|
1183
1183
|
};
|
|
1184
1184
|
};
|
|
1185
|
-
|
|
1186
|
-
const
|
|
1187
|
-
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1195
|
-
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
|
|
1200
|
-
|
|
1201
|
-
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
"color: inherit;",
|
|
1206
|
-
`color: ${r}; font-weight: bold;`,
|
|
1207
|
-
// level
|
|
1208
|
-
"color: inherit;",
|
|
1209
|
-
`color: ${r}; font-weight: bold;`,
|
|
1210
|
-
// category name
|
|
1211
|
-
"color: inherit;",
|
|
1212
|
-
...n.slice(1)
|
|
1213
|
-
];
|
|
1214
|
-
s(...a);
|
|
1215
|
-
} else
|
|
1216
|
-
s(...n);
|
|
1217
|
-
};
|
|
1218
|
-
}, i.setLevel("silent");
|
|
1219
|
-
});
|
|
1220
|
-
const st = (i) => {
|
|
1221
|
-
y.setLevel(i), H.setLevel(i), C.setLevel(i), v.setLevel(i), k.setLevel(i);
|
|
1222
|
-
}, ui = () => {
|
|
1223
|
-
st("debug");
|
|
1224
|
-
}, fi = () => {
|
|
1225
|
-
st("silent");
|
|
1226
|
-
}, gi = (i, e = "debug") => {
|
|
1227
|
-
({
|
|
1228
|
-
INIT: H,
|
|
1229
|
-
DATA: C,
|
|
1230
|
-
UI: v,
|
|
1231
|
-
INTERACTION: k
|
|
1232
|
-
})[i].setLevel(e);
|
|
1233
|
-
};
|
|
1234
|
-
class We {
|
|
1185
|
+
_.setLevel("silent");
|
|
1186
|
+
const le = _.getLogger("MULTISELECT:INIT"), S = _.getLogger("MULTISELECT:DATA"), f = _.getLogger("MULTISELECT:UI"), A = _.getLogger("MULTISELECT:INTERACTION"), cs = [
|
|
1187
|
+
"MULTISELECT:INIT",
|
|
1188
|
+
"MULTISELECT:DATA",
|
|
1189
|
+
"MULTISELECT:UI",
|
|
1190
|
+
"MULTISELECT:INTERACTION"
|
|
1191
|
+
];
|
|
1192
|
+
function ds() {
|
|
1193
|
+
_.setLevel("debug");
|
|
1194
|
+
}
|
|
1195
|
+
function hs() {
|
|
1196
|
+
_.setLevel("silent");
|
|
1197
|
+
}
|
|
1198
|
+
function ps(s) {
|
|
1199
|
+
_.setLevel(s);
|
|
1200
|
+
}
|
|
1201
|
+
function ms(s, e) {
|
|
1202
|
+
_.getLogger(s).setLevel(e);
|
|
1203
|
+
}
|
|
1204
|
+
class He {
|
|
1235
1205
|
constructor(e) {
|
|
1236
|
-
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
|
|
1244
|
-
|
|
1245
|
-
|
|
1246
|
-
|
|
1247
|
-
|
|
1248
|
-
|
|
1249
|
-
|
|
1250
|
-
|
|
1206
|
+
p(this, "container");
|
|
1207
|
+
p(this, "wrapper");
|
|
1208
|
+
p(this, "viewport");
|
|
1209
|
+
p(this, "itemHeight");
|
|
1210
|
+
p(this, "items");
|
|
1211
|
+
p(this, "renderItem");
|
|
1212
|
+
p(this, "bufferSize");
|
|
1213
|
+
p(this, "onVisibleRangeChange");
|
|
1214
|
+
p(this, "onScroll");
|
|
1215
|
+
p(this, "scrollTop", 0);
|
|
1216
|
+
p(this, "viewportHeight", 0);
|
|
1217
|
+
p(this, "visibleStart", 0);
|
|
1218
|
+
p(this, "visibleEnd", 0);
|
|
1219
|
+
p(this, "scrollHandler");
|
|
1220
|
+
p(this, "resizeObserver");
|
|
1251
1221
|
this.container = e.container, this.itemHeight = e.itemHeight, this.items = e.items, this.renderItem = e.renderItem, this.bufferSize = e.bufferSize ?? 10, this.onVisibleRangeChange = e.onVisibleRangeChange, this.onScroll = e.onScroll, this.scrollHandler = this.handleScroll.bind(this), this.init();
|
|
1252
1222
|
}
|
|
1253
1223
|
/**
|
|
@@ -1260,7 +1230,7 @@ class We {
|
|
|
1260
1230
|
* └─ items (position: absolute, top: index * itemHeight)
|
|
1261
1231
|
*/
|
|
1262
1232
|
init() {
|
|
1263
|
-
this.container.innerHTML = "", this.wrapper = document.createElement("div"), this.wrapper.style.position = "relative", this.wrapper.style.width = "100%", this.wrapper.style.height = `${this.items.length * this.itemHeight}px`, this.wrapper.className = "
|
|
1233
|
+
this.container.innerHTML = "", this.wrapper = document.createElement("div"), this.wrapper.style.position = "relative", this.wrapper.style.width = "100%", this.wrapper.style.height = `${this.items.length * this.itemHeight}px`, this.wrapper.className = "ms__virtual-scroll-wrapper", this.viewport = document.createElement("div"), this.viewport.style.position = "absolute", this.viewport.style.top = "0", this.viewport.style.left = "0", this.viewport.style.right = "0", this.viewport.style.width = "100%", this.viewport.className = "ms__virtual-scroll-viewport", this.wrapper.appendChild(this.viewport), this.container.appendChild(this.wrapper), this.container.addEventListener("scroll", this.scrollHandler), typeof ResizeObserver < "u" && (this.resizeObserver = new ResizeObserver(() => {
|
|
1264
1234
|
this.updateViewportHeight(), this.render();
|
|
1265
1235
|
}), this.resizeObserver.observe(this.container)), this.updateViewportHeight(), this.render();
|
|
1266
1236
|
}
|
|
@@ -1280,8 +1250,8 @@ class We {
|
|
|
1280
1250
|
* Calculate visible range based on scroll position
|
|
1281
1251
|
*/
|
|
1282
1252
|
calculateVisibleRange() {
|
|
1283
|
-
const e = Math.floor(this.scrollTop / this.itemHeight), t = Math.ceil((this.scrollTop + this.viewportHeight) / this.itemHeight),
|
|
1284
|
-
return { start:
|
|
1253
|
+
const e = Math.floor(this.scrollTop / this.itemHeight), t = Math.ceil((this.scrollTop + this.viewportHeight) / this.itemHeight), i = Math.max(0, e - this.bufferSize), o = Math.min(this.items.length, t + this.bufferSize);
|
|
1254
|
+
return { start: i, end: o };
|
|
1285
1255
|
}
|
|
1286
1256
|
/**
|
|
1287
1257
|
* Render visible items
|
|
@@ -1291,12 +1261,12 @@ class We {
|
|
|
1291
1261
|
if (e === this.visibleStart && t === this.visibleEnd)
|
|
1292
1262
|
return;
|
|
1293
1263
|
this.visibleStart = e, this.visibleEnd = t, this.onVisibleRangeChange && this.onVisibleRangeChange(e, t);
|
|
1294
|
-
let
|
|
1264
|
+
let i = "";
|
|
1295
1265
|
for (let o = e; o < t; o++) {
|
|
1296
|
-
const
|
|
1297
|
-
|
|
1266
|
+
const n = this.items[o], r = this.renderItem(n, o), a = o * this.itemHeight;
|
|
1267
|
+
i += `<div class="ms__virtual-item" style="position: absolute; top: ${a}px; left: 0; right: 0; height: ${this.itemHeight}px;" data-index="${o}">`, i += r, i += "</div>";
|
|
1298
1268
|
}
|
|
1299
|
-
this.viewport.innerHTML =
|
|
1269
|
+
this.viewport.innerHTML = i;
|
|
1300
1270
|
}
|
|
1301
1271
|
/**
|
|
1302
1272
|
* Update items and re-render
|
|
@@ -1350,74 +1320,75 @@ class We {
|
|
|
1350
1320
|
this.container.removeEventListener("scroll", this.scrollHandler), this.resizeObserver && this.resizeObserver.disconnect(), this.container.innerHTML = "";
|
|
1351
1321
|
}
|
|
1352
1322
|
}
|
|
1353
|
-
class
|
|
1323
|
+
class us {
|
|
1354
1324
|
constructor(e, t = {}) {
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1358
|
-
|
|
1359
|
-
|
|
1360
|
-
|
|
1361
|
-
|
|
1362
|
-
|
|
1363
|
-
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
|
|
1367
|
-
|
|
1368
|
-
|
|
1369
|
-
|
|
1370
|
-
|
|
1371
|
-
|
|
1372
|
-
|
|
1373
|
-
|
|
1325
|
+
p(this, "element");
|
|
1326
|
+
p(this, "instanceId");
|
|
1327
|
+
p(this, "options");
|
|
1328
|
+
p(this, "isOpen", !1);
|
|
1329
|
+
p(this, "selectedValues", /* @__PURE__ */ new Set());
|
|
1330
|
+
p(this, "selectedOptions", /* @__PURE__ */ new Map());
|
|
1331
|
+
p(this, "allOptions", []);
|
|
1332
|
+
p(this, "filteredOptions", []);
|
|
1333
|
+
p(this, "hiddenInputs", []);
|
|
1334
|
+
p(this, "focusedIndex", -1);
|
|
1335
|
+
p(this, "matchingIndices", /* @__PURE__ */ new Set());
|
|
1336
|
+
p(this, "searchTerm", "");
|
|
1337
|
+
p(this, "isLoading", !1);
|
|
1338
|
+
p(this, "showSelectedPopover", !1);
|
|
1339
|
+
p(this, "selectedPopoverPlacement", null);
|
|
1340
|
+
p(this, "dropdownPlacement", null);
|
|
1341
|
+
p(this, "isRTL", !1);
|
|
1342
|
+
p(this, "effectiveBadgesPosition", "bottom");
|
|
1343
|
+
p(this, "justClosedViaClick", !1);
|
|
1374
1344
|
// Floating UI cleanup functions
|
|
1375
|
-
|
|
1376
|
-
|
|
1377
|
-
|
|
1378
|
-
//
|
|
1379
|
-
|
|
1380
|
-
|
|
1345
|
+
p(this, "dropdownCleanup", null);
|
|
1346
|
+
p(this, "hintCleanup", null);
|
|
1347
|
+
p(this, "selectedPopoverCleanup", null);
|
|
1348
|
+
// Badge tooltip storage
|
|
1349
|
+
p(this, "badgeTooltips", /* @__PURE__ */ new Map());
|
|
1350
|
+
p(this, "badgeTooltipCleanups", /* @__PURE__ */ new Map());
|
|
1351
|
+
// Action button tooltip storage
|
|
1352
|
+
p(this, "actionButtonTooltips", /* @__PURE__ */ new Map());
|
|
1353
|
+
p(this, "actionButtonTooltipCleanups", /* @__PURE__ */ new Map());
|
|
1381
1354
|
// Virtual scroll instance
|
|
1382
|
-
|
|
1383
|
-
|
|
1384
|
-
|
|
1385
|
-
|
|
1355
|
+
p(this, "virtualScroll", null);
|
|
1356
|
+
p(this, "optionsContainer", null);
|
|
1357
|
+
p(this, "selectedPopoverVirtualScroll", null);
|
|
1358
|
+
p(this, "selectedPopoverContainer", null);
|
|
1386
1359
|
// DOM elements
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
1360
|
+
p(this, "input");
|
|
1361
|
+
p(this, "dropdown");
|
|
1362
|
+
p(this, "badgesContainer");
|
|
1363
|
+
p(this, "counter");
|
|
1364
|
+
p(this, "hint");
|
|
1365
|
+
p(this, "selectedPopover");
|
|
1393
1366
|
this.element = e, this.instanceId = `MS-${Math.random().toString(36).substr(2, 9)}`, this.options = {
|
|
1394
1367
|
// String options
|
|
1395
1368
|
searchHint: e.dataset.searchHint || "",
|
|
1396
1369
|
searchPlaceholder: e.dataset.searchPlaceholder || "Search...",
|
|
1397
1370
|
dropdownMinWidth: e.dataset.dropdownMinWidth || void 0,
|
|
1398
|
-
|
|
1399
|
-
|
|
1400
|
-
|
|
1371
|
+
badgesDisplayMode: e.dataset.badgesDisplayMode || "badges",
|
|
1372
|
+
badgesPosition: e.dataset.badgesPosition || "bottom",
|
|
1373
|
+
badgesThresholdMode: e.dataset.badgesThresholdMode || "count",
|
|
1401
1374
|
maxHeight: e.dataset.maxHeight || "20rem",
|
|
1402
1375
|
emptyMessage: e.dataset.emptyMessage || "No results found",
|
|
1403
1376
|
loadingMessage: e.dataset.loadingMessage || "Loading...",
|
|
1404
1377
|
searchInputMode: e.dataset.searchInputMode || "normal",
|
|
1405
1378
|
searchMode: e.dataset.searchMode || "filter",
|
|
1406
1379
|
// Number options
|
|
1407
|
-
|
|
1380
|
+
badgesThreshold: e.dataset.badgesThreshold ? parseInt(e.dataset.badgesThreshold) : void 0,
|
|
1408
1381
|
minSearchLength: parseInt(e.dataset.minSearchLength || "0") || 0,
|
|
1409
1382
|
// Boolean options (internal names with 'is' prefix)
|
|
1410
1383
|
isMultipleEnabled: e.dataset.multiple !== "false",
|
|
1411
1384
|
isGroupsAllowed: e.dataset.allowGroups !== "false",
|
|
1412
|
-
isSelectAllAllowed: e.dataset.allowSelectAll !== "false",
|
|
1413
|
-
isClearAllAllowed: e.dataset.allowClearAll !== "false",
|
|
1414
1385
|
isCheckboxesShown: e.dataset.showCheckboxes !== "false",
|
|
1415
1386
|
isActionsSticky: e.dataset.stickyActions !== "false",
|
|
1416
1387
|
isCloseOnSelect: e.dataset.closeOnSelect === "true",
|
|
1417
1388
|
isPlacementLocked: e.dataset.lockPlacement !== "false",
|
|
1418
1389
|
isSearchEnabled: e.dataset.enableSearch !== "false",
|
|
1419
1390
|
isAddNewAllowed: e.dataset.allowAddNew === "true",
|
|
1420
|
-
|
|
1391
|
+
isCounterShown: e.dataset.showCounter === "true",
|
|
1421
1392
|
isKeepOptionsOnSearch: e.dataset.keepOptionsOnSearch !== "false",
|
|
1422
1393
|
// Data and callbacks
|
|
1423
1394
|
options: [],
|
|
@@ -1444,12 +1415,12 @@ class di {
|
|
|
1444
1415
|
return Array.isArray(e) && e.length === 2 ? String(e[1]) : this.options.displayValueMember && e[this.options.displayValueMember] !== void 0 ? String(e[this.options.displayValueMember]) : this.options.getDisplayValueCallback ? this.options.getDisplayValueCallback(e) : "[N/A]";
|
|
1445
1416
|
}
|
|
1446
1417
|
/**
|
|
1447
|
-
* Extract
|
|
1448
|
-
* Precedence:
|
|
1449
|
-
* This allows customizing
|
|
1418
|
+
* Extract badge display value from item
|
|
1419
|
+
* Precedence: getBadgeDisplayCallback -> getItemDisplayValue()
|
|
1420
|
+
* This allows customizing badge text separately from dropdown display text
|
|
1450
1421
|
*/
|
|
1451
|
-
|
|
1452
|
-
return this.options.
|
|
1422
|
+
getItemBadgeDisplayValue(e) {
|
|
1423
|
+
return this.options.getBadgeDisplayCallback ? this.options.getBadgeDisplayCallback(e) : this.getItemDisplayValue(e);
|
|
1453
1424
|
}
|
|
1454
1425
|
/**
|
|
1455
1426
|
* Extract search value from item
|
|
@@ -1498,13 +1469,11 @@ class di {
|
|
|
1498
1469
|
return Array.isArray(e) ? !1 : this.options.disabledMember && e[this.options.disabledMember] !== void 0 ? !!e[this.options.disabledMember] : this.options.getDisabledCallback ? this.options.getDisabledCallback(e) : !1;
|
|
1499
1470
|
}
|
|
1500
1471
|
init() {
|
|
1501
|
-
this.parseOptions(), this.buildHTML(), this.attachEvents(), this.parseInitialSelection(),
|
|
1472
|
+
this.parseOptions(), this.buildHTML(), this.attachEvents(), this.parseInitialSelection(), le.debug(`Initialized [${this.instanceId}] with options:`, {
|
|
1502
1473
|
placeholder: this.options.searchPlaceholder,
|
|
1503
1474
|
totalOptions: this.allOptions.length,
|
|
1504
1475
|
isCloseOnSelect: this.options.isCloseOnSelect,
|
|
1505
|
-
dataAttribute: this.element.dataset.closeOnSelect
|
|
1506
|
-
isSelectAllAllowed: this.options.isSelectAllAllowed,
|
|
1507
|
-
isClearAllAllowed: this.options.isClearAllAllowed
|
|
1476
|
+
dataAttribute: this.element.dataset.closeOnSelect
|
|
1508
1477
|
});
|
|
1509
1478
|
}
|
|
1510
1479
|
parseOptions() {
|
|
@@ -1513,27 +1482,27 @@ class di {
|
|
|
1513
1482
|
try {
|
|
1514
1483
|
this.allOptions = JSON.parse(e);
|
|
1515
1484
|
} catch (t) {
|
|
1516
|
-
|
|
1485
|
+
S.error(`[${this.instanceId}] Failed to parse data-options:`, t), this.allOptions = [];
|
|
1517
1486
|
}
|
|
1518
1487
|
else this.options.options && (this.allOptions = this.options.options);
|
|
1519
1488
|
this.filteredOptions = [...this.allOptions];
|
|
1520
1489
|
}
|
|
1521
1490
|
buildHTML() {
|
|
1522
|
-
const e = this.options.container || document.body, t = this.element.getRootNode(),
|
|
1523
|
-
this.isRTL = o ||
|
|
1491
|
+
const e = this.options.container || document.body, t = this.element.getRootNode(), i = t instanceof ShadowRoot ? t.host : this.element, o = i.getAttribute("dir") === "rtl", n = i.closest('[dir="rtl"]') !== null;
|
|
1492
|
+
this.isRTL = o || n, le.debug(`[${this.instanceId}] RTL Debug:`, {
|
|
1524
1493
|
isShadowRoot: t instanceof ShadowRoot,
|
|
1525
|
-
hostElement:
|
|
1526
|
-
elementDir:
|
|
1494
|
+
hostElement: i,
|
|
1495
|
+
elementDir: i.getAttribute("dir"),
|
|
1527
1496
|
hasElementDir: o,
|
|
1528
|
-
hasAncestorDir:
|
|
1497
|
+
hasAncestorDir: n,
|
|
1529
1498
|
isRTL: this.isRTL
|
|
1530
|
-
}), this.
|
|
1531
|
-
const
|
|
1532
|
-
|
|
1533
|
-
const
|
|
1534
|
-
|
|
1535
|
-
const
|
|
1536
|
-
|
|
1499
|
+
}), this.effectiveBadgesPosition = this.options.badgesPosition || "bottom", this.isRTL && (this.effectiveBadgesPosition === "left" ? this.effectiveBadgesPosition = "right" : this.effectiveBadgesPosition === "right" && (this.effectiveBadgesPosition = "left")), this.element.classList.add("ml"), this.isRTL && (this.element.classList.add("ms--rtl"), le.debug(`[${this.instanceId}] Added ms--rtl class to element`)), (!this.options.isCheckboxesShown || !this.options.isMultipleEnabled) && this.element.classList.add("ms--no-checkboxes");
|
|
1500
|
+
const r = document.createElement("div");
|
|
1501
|
+
r.className = "ms__input-wrapper", this.input = document.createElement("input"), this.input.type = "text", this.input.className = "ms__input", this.input.placeholder = this.options.searchPlaceholder, this.input.autocomplete = "off", this.options.searchInputMode === "readonly" ? this.input.readOnly = !0 : this.options.searchInputMode === "hidden" && (this.input.style.display = "none");
|
|
1502
|
+
const a = document.createElement("span");
|
|
1503
|
+
a.className = "ms__toggle", a.innerHTML = "▼", this.counter = document.createElement("span"), this.counter.className = "ms__counter", this.counter.style.display = "none", r.appendChild(this.input), r.appendChild(this.counter), r.appendChild(a), this.badgesContainer = document.createElement("div"), this.badgesContainer.className = "ms__badges";
|
|
1504
|
+
const l = document.createElement("div");
|
|
1505
|
+
l.className = "ml-wrapper", (this.effectiveBadgesPosition === "left" || this.effectiveBadgesPosition === "right") && l.classList.add("ml-wrapper--inline"), l.appendChild(r), l.appendChild(this.badgesContainer), this.element.appendChild(l), this.dropdown = document.createElement("div"), this.dropdown.className = "ms__dropdown", e.appendChild(this.dropdown), this.options.searchHint && (this.hint = document.createElement("div"), this.hint.className = "ms__hint", this.hint.textContent = this.options.searchHint, e.appendChild(this.hint)), this.selectedPopover = document.createElement("div"), this.selectedPopover.className = "ms__selected-popover", e.appendChild(this.selectedPopover), this.renderDropdown();
|
|
1537
1506
|
}
|
|
1538
1507
|
/**
|
|
1539
1508
|
* Check if virtual scroll should be used
|
|
@@ -1553,162 +1522,232 @@ class di {
|
|
|
1553
1522
|
});
|
|
1554
1523
|
}
|
|
1555
1524
|
renderDropdown() {
|
|
1556
|
-
if (this.shouldUseVirtualScroll()) {
|
|
1557
|
-
this.dropdown.classList.add("
|
|
1525
|
+
if (this.destroyAllActionButtonTooltips(), this.shouldUseVirtualScroll()) {
|
|
1526
|
+
this.dropdown.classList.add("ms__dropdown--virtual"), this.renderDropdownVirtual();
|
|
1558
1527
|
return;
|
|
1559
1528
|
}
|
|
1560
|
-
this.dropdown.classList.remove("
|
|
1529
|
+
this.dropdown.classList.remove("ms__dropdown--virtual");
|
|
1561
1530
|
let e = "";
|
|
1562
1531
|
if (this.isLoading) {
|
|
1563
|
-
e += '<div class="
|
|
1532
|
+
e += '<div class="ms__loader">', e += '<div class="pa-loader pa-loader--sm"></div>', e += `<div class="ms__loading-text">${this.options.loadingMessage}</div>`, e += "</div>", this.dropdown.innerHTML = e;
|
|
1564
1533
|
return;
|
|
1565
1534
|
}
|
|
1566
|
-
if (this.options.isMultipleEnabled &&
|
|
1567
|
-
const t = this.options.isActionsSticky ? "
|
|
1568
|
-
e += `<div class="
|
|
1535
|
+
if (this.options.isMultipleEnabled && this.options.actionButtons && this.options.actionButtons.length > 0) {
|
|
1536
|
+
const t = this.options.isActionsSticky ? " ms__actions--sticky" : "", i = this.options.actionsLayout === "wrap" ? " ms__actions--wrap" : "";
|
|
1537
|
+
e += `<div class="ms__actions${t}${i}">`, this.options.actionButtons.forEach((o) => {
|
|
1538
|
+
if (!(o.isVisibleCallback ? o.isVisibleCallback(this) : o.isVisible ?? !0))
|
|
1539
|
+
return;
|
|
1540
|
+
const a = (o.isDisabledCallback ? o.isDisabledCallback(this) : o.isDisabled ?? !1) ? " disabled" : "", l = o.getTextCallback ? o.getTextCallback(this) : o.text;
|
|
1541
|
+
let c = "";
|
|
1542
|
+
if (o.getClassCallback) {
|
|
1543
|
+
const d = o.getClassCallback(this);
|
|
1544
|
+
c = Array.isArray(d) ? ` ${d.join(" ")}` : d ? ` ${d}` : "";
|
|
1545
|
+
} else o.cssClass && (c = ` ${o.cssClass}`);
|
|
1546
|
+
e += `<button type="button"${a} class="ms__action-btn${c}" data-action="${o.action}">${l}</button>`;
|
|
1547
|
+
}), e += "</div>";
|
|
1569
1548
|
}
|
|
1570
|
-
if (e += '<div class="
|
|
1571
|
-
e += `<div class="
|
|
1549
|
+
if (e += '<div class="ms__options">', this.filteredOptions.length === 0)
|
|
1550
|
+
e += `<div class="ms__empty">${this.options.emptyMessage}</div>`;
|
|
1572
1551
|
else if (this.options.isGroupsAllowed) {
|
|
1573
1552
|
const t = this.groupOptions(this.filteredOptions);
|
|
1574
|
-
Object.keys(t).forEach((
|
|
1575
|
-
e += '<div class="
|
|
1576
|
-
|
|
1553
|
+
Object.keys(t).forEach((i) => {
|
|
1554
|
+
if (e += '<div class="ms__group">', i !== "__ungrouped__")
|
|
1555
|
+
if (this.options.renderGroupLabelContentCallback) {
|
|
1556
|
+
const o = this.options.renderGroupLabelContentCallback(i);
|
|
1557
|
+
if (o instanceof HTMLElement) {
|
|
1558
|
+
const n = document.createElement("div");
|
|
1559
|
+
n.className = "ms__group-label", n.appendChild(o), e += n.outerHTML;
|
|
1560
|
+
} else
|
|
1561
|
+
e += `<div class="ms__group-label">${o}</div>`;
|
|
1562
|
+
} else
|
|
1563
|
+
e += `<div class="ms__group-label">${i}</div>`;
|
|
1564
|
+
t[i].forEach((o, n) => {
|
|
1565
|
+
e += this.renderOption(o, n);
|
|
1577
1566
|
}), e += "</div>";
|
|
1578
1567
|
});
|
|
1579
1568
|
} else
|
|
1580
|
-
this.filteredOptions.forEach((t,
|
|
1581
|
-
e += this.renderOption(t,
|
|
1569
|
+
this.filteredOptions.forEach((t, i) => {
|
|
1570
|
+
e += this.renderOption(t, i);
|
|
1582
1571
|
});
|
|
1583
|
-
e += "</div>", this.dropdown.innerHTML = e;
|
|
1572
|
+
e += "</div>", this.dropdown.innerHTML = e, this.attachActionButtonTooltips();
|
|
1584
1573
|
}
|
|
1585
1574
|
/**
|
|
1586
1575
|
* Render dropdown with virtual scrolling
|
|
1587
1576
|
*/
|
|
1588
1577
|
renderDropdownVirtual() {
|
|
1589
|
-
if (!this.virtualScroll) {
|
|
1590
|
-
let
|
|
1591
|
-
if (this.options.isMultipleEnabled &&
|
|
1592
|
-
const
|
|
1593
|
-
|
|
1578
|
+
if (this.destroyAllActionButtonTooltips(), !this.virtualScroll) {
|
|
1579
|
+
let i = "";
|
|
1580
|
+
if (this.options.isMultipleEnabled && this.options.actionButtons && this.options.actionButtons.length > 0) {
|
|
1581
|
+
const r = this.options.isActionsSticky ? " ms__actions--sticky" : "", a = this.options.actionsLayout === "wrap" ? " ms__actions--wrap" : "";
|
|
1582
|
+
i += `<div class="ms__actions${r}${a}">`, this.options.actionButtons.forEach((l) => {
|
|
1583
|
+
if (!(l.isVisibleCallback ? l.isVisibleCallback(this) : l.isVisible ?? !0))
|
|
1584
|
+
return;
|
|
1585
|
+
const m = (l.isDisabledCallback ? l.isDisabledCallback(this) : l.isDisabled ?? !1) ? " disabled" : "", u = l.getTextCallback ? l.getTextCallback(this) : l.text;
|
|
1586
|
+
let h = "";
|
|
1587
|
+
if (l.getClassCallback) {
|
|
1588
|
+
const g = l.getClassCallback(this);
|
|
1589
|
+
h = Array.isArray(g) ? ` ${g.join(" ")}` : g ? ` ${g}` : "";
|
|
1590
|
+
} else l.cssClass && (h = ` ${l.cssClass}`);
|
|
1591
|
+
i += `<button type="button"${m} class="ms__action-btn${h}" data-action="${l.action}">${u}</button>`;
|
|
1592
|
+
}), i += "</div>";
|
|
1594
1593
|
}
|
|
1595
|
-
const o = this.options.maxHeight || "20rem";
|
|
1596
|
-
|
|
1594
|
+
const o = this.options.maxHeight || "20rem", n = this.options.optionHeight ?? 50;
|
|
1595
|
+
i += `<div class="ms__options ms__options--virtual" style="height: ${o}; max-height: ${o}; overflow-y: auto; position: relative; --ml-option-height: ${n}px;"></div>`, this.dropdown.innerHTML = i, this.optionsContainer = this.dropdown.querySelector(".ms__options");
|
|
1597
1596
|
}
|
|
1598
1597
|
if (this.filteredOptions.length === 0) {
|
|
1599
|
-
this.optionsContainer.innerHTML = `<div class="
|
|
1598
|
+
this.optionsContainer.innerHTML = `<div class="ms__empty">${this.options.emptyMessage}</div>`;
|
|
1600
1599
|
return;
|
|
1601
1600
|
}
|
|
1602
1601
|
const e = this.options.optionHeight ?? 50, t = this.options.virtualScrollBuffer ?? 10;
|
|
1603
1602
|
requestAnimationFrame(() => {
|
|
1604
|
-
this.optionsContainer && (this.virtualScroll ? this.virtualScroll.setItems(this.filteredOptions) : this.virtualScroll = new
|
|
1603
|
+
this.optionsContainer && (this.virtualScroll ? this.virtualScroll.setItems(this.filteredOptions) : this.virtualScroll = new He({
|
|
1605
1604
|
container: this.optionsContainer,
|
|
1606
1605
|
itemHeight: e,
|
|
1607
1606
|
items: this.filteredOptions,
|
|
1608
|
-
renderItem: (
|
|
1607
|
+
renderItem: (i, o) => this.renderOption(i, o),
|
|
1609
1608
|
bufferSize: t
|
|
1610
|
-
}));
|
|
1609
|
+
}), this.attachActionButtonTooltips());
|
|
1611
1610
|
});
|
|
1612
1611
|
}
|
|
1613
1612
|
renderOption(e, t) {
|
|
1614
|
-
const
|
|
1615
|
-
|
|
1616
|
-
|
|
1617
|
-
|
|
1613
|
+
const i = this.getItemValue(e), o = this.getItemDisplayValue(e), n = this.getItemIcon(e), r = this.getItemSubtitle(e), a = this.getItemDisabled(e), l = this.selectedValues.has(String(i)), c = t === this.focusedIndex, d = this.matchingIndices.has(t), m = ["ms__option"];
|
|
1614
|
+
l && m.push("ms__option--selected"), c && m.push("ms__option--focused"), d && m.push("ms__option--matched"), a && m.push("ms__option--disabled");
|
|
1615
|
+
const u = this.options.checkboxAlign && this.options.checkboxAlign !== "top" ? ` data-checkbox-align="${this.options.checkboxAlign}"` : "";
|
|
1616
|
+
let h = `<div class="${m.join(" ")}" data-value="${i}" data-index="${t}"${u}>`;
|
|
1617
|
+
if (this.options.isCheckboxesShown && this.options.isMultipleEnabled && (h += `<input type="checkbox" class="ms__checkbox" ${l ? "checked" : ""} ${a ? "disabled" : ""}>`), h += '<div class="ms__option-content">', this.options.renderOptionContentCallback) {
|
|
1618
|
+
const g = {
|
|
1619
|
+
index: t,
|
|
1620
|
+
isSelected: l,
|
|
1621
|
+
isFocused: c,
|
|
1622
|
+
isMatched: d,
|
|
1623
|
+
isDisabled: a
|
|
1624
|
+
}, b = this.options.renderOptionContentCallback(e, g);
|
|
1625
|
+
typeof b == "string" ? h += b : h += b.outerHTML;
|
|
1626
|
+
} else
|
|
1627
|
+
n && (h += `<span class="ms__option-icon">${n}</span>`), h += '<div class="ms__option-text">', h += `<div class="ms__option-title">${this.highlightMatch(o, this.searchTerm)}</div>`, r && (h += `<div class="ms__option-subtitle">${r}</div>`), h += "</div>";
|
|
1628
|
+
return h += "</div>", h += "</div>", h;
|
|
1618
1629
|
}
|
|
1619
1630
|
highlightMatch(e, t) {
|
|
1620
1631
|
if (!t) return e;
|
|
1621
|
-
const
|
|
1622
|
-
return e.replace(
|
|
1632
|
+
const i = new RegExp(`(${t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")})`, "gi");
|
|
1633
|
+
return e.replace(i, "<mark>$1</mark>");
|
|
1623
1634
|
}
|
|
1624
1635
|
groupOptions(e) {
|
|
1625
1636
|
const t = {};
|
|
1626
|
-
return e.forEach((
|
|
1627
|
-
const o = this.getItemGroup(
|
|
1628
|
-
t[o] || (t[o] = []), t[o].push(
|
|
1637
|
+
return e.forEach((i) => {
|
|
1638
|
+
const o = this.getItemGroup(i) || "__ungrouped__";
|
|
1639
|
+
t[o] || (t[o] = []), t[o].push(i);
|
|
1629
1640
|
}), t;
|
|
1630
1641
|
}
|
|
1631
|
-
|
|
1632
|
-
this.
|
|
1642
|
+
renderBadges() {
|
|
1643
|
+
this.destroyAllBadgeTooltips();
|
|
1633
1644
|
const e = Array.from(this.selectedOptions.values()), t = this.selectedValues.size;
|
|
1634
1645
|
if (!this.options.isMultipleEnabled) {
|
|
1635
|
-
this.
|
|
1636
|
-
|
|
1637
|
-
|
|
1646
|
+
this.badgesContainer.innerHTML = "", this.counter.style.display = "none";
|
|
1647
|
+
let n;
|
|
1648
|
+
e[0] && (this.options.renderSelectedContentCallback ? n = this.options.renderSelectedContentCallback(e[0]) : n = this.getItemDisplayValue(e[0])), f.warn(`[${this.instanceId}] renderBadges() single-select mode`, {
|
|
1638
1649
|
isOpen: this.isOpen,
|
|
1639
1650
|
count: t,
|
|
1640
1651
|
selectedOptionsLength: e.length,
|
|
1641
1652
|
willSetValue: !this.isOpen && t > 0 && e.length > 0,
|
|
1642
|
-
selectedLabel:
|
|
1643
|
-
}), !this.isOpen && t > 0 && e.length > 0 ? (
|
|
1653
|
+
selectedLabel: n
|
|
1654
|
+
}), !this.isOpen && t > 0 && e.length > 0 ? (f.info(`[${this.instanceId}] ✅ SETTING input.value = "${n}"`), this.input.value = n, f.info(`[${this.instanceId}] 🔍 VERIFY input.value = "${this.input.value}"`)) : this.isOpen ? f.info(`[${this.instanceId}] ⏭️ SKIPPING input update (dropdown is open)`) : (f.info(`[${this.instanceId}] ❌ CLEARING input.value (no selection)`), this.input.value = "");
|
|
1644
1655
|
return;
|
|
1645
1656
|
}
|
|
1646
|
-
let
|
|
1647
|
-
if (this.options.
|
|
1648
|
-
if (t > 0 &&
|
|
1649
|
-
const
|
|
1650
|
-
this.input.placeholder =
|
|
1657
|
+
let i = this.options.badgesDisplayMode;
|
|
1658
|
+
if (this.options.badgesThreshold !== null && t > this.options.badgesThreshold && i !== "none" && (i = this.options.badgesThresholdMode || "count"), !this.isOpen)
|
|
1659
|
+
if (t > 0 && i === "count") {
|
|
1660
|
+
const n = this.options.getCounterCallback ? this.options.getCounterCallback(t) : `${t} selected`;
|
|
1661
|
+
this.input.placeholder = n;
|
|
1651
1662
|
} else
|
|
1652
1663
|
this.input.placeholder = this.options.searchPlaceholder;
|
|
1653
|
-
if (this.options.
|
|
1654
|
-
this.
|
|
1664
|
+
if (this.options.isCounterShown && t > 0 ? (this.counter.textContent = `[${t}]`, this.counter.style.display = "") : this.counter.style.display = "none", i === "none") {
|
|
1665
|
+
this.badgesContainer.innerHTML = "";
|
|
1655
1666
|
return;
|
|
1656
1667
|
}
|
|
1657
|
-
if (
|
|
1658
|
-
this.
|
|
1659
|
-
const
|
|
1668
|
+
if (i === "badges")
|
|
1669
|
+
this.badgesContainer.className = `ms__badges ms__badges--${this.effectiveBadgesPosition}`, this.badgesContainer.innerHTML = e.map((n) => {
|
|
1670
|
+
const r = this.getItemValue(n);
|
|
1671
|
+
let a;
|
|
1672
|
+
if (this.options.renderBadgeContentCallback) {
|
|
1673
|
+
const c = {
|
|
1674
|
+
displayMode: "badges",
|
|
1675
|
+
isInPopover: !1
|
|
1676
|
+
}, d = this.options.renderBadgeContentCallback(n, c);
|
|
1677
|
+
a = typeof d == "string" ? d : d.outerHTML;
|
|
1678
|
+
} else
|
|
1679
|
+
a = this.getItemBadgeDisplayValue(n);
|
|
1680
|
+
let l = "ms__badge";
|
|
1681
|
+
if (this.options.getBadgeClassCallback) {
|
|
1682
|
+
const c = this.options.getBadgeClassCallback(n), d = Array.isArray(c) ? c : [c];
|
|
1683
|
+
l += " " + d.filter((m) => m).join(" ");
|
|
1684
|
+
}
|
|
1660
1685
|
return `
|
|
1661
|
-
<div class="
|
|
1662
|
-
<span class="
|
|
1663
|
-
<button type="button" class="
|
|
1686
|
+
<div class="${l}">
|
|
1687
|
+
<span class="ms__badge-text">${a}</span>
|
|
1688
|
+
<button type="button" class="ms__badge-remove" data-value="${r}" aria-label="Remove ${this.getItemBadgeDisplayValue(n)}"></button>
|
|
1664
1689
|
</div>
|
|
1665
1690
|
`;
|
|
1666
1691
|
}).join("");
|
|
1667
|
-
else if (
|
|
1668
|
-
this.
|
|
1669
|
-
const
|
|
1670
|
-
const m = this.getItemValue(
|
|
1692
|
+
else if (i === "partial") {
|
|
1693
|
+
this.badgesContainer.className = `ms__badges ms__badges--${this.effectiveBadgesPosition}`;
|
|
1694
|
+
const n = this.options.badgesMaxVisible || 3, r = e.slice(0, n), a = t - n, l = r.map((d) => {
|
|
1695
|
+
const m = this.getItemValue(d);
|
|
1696
|
+
let u;
|
|
1697
|
+
if (this.options.renderBadgeContentCallback) {
|
|
1698
|
+
const g = {
|
|
1699
|
+
displayMode: "partial",
|
|
1700
|
+
isInPopover: !1
|
|
1701
|
+
}, b = this.options.renderBadgeContentCallback(d, g);
|
|
1702
|
+
u = typeof b == "string" ? b : b.outerHTML;
|
|
1703
|
+
} else
|
|
1704
|
+
u = this.getItemBadgeDisplayValue(d);
|
|
1705
|
+
let h = "ms__badge";
|
|
1706
|
+
if (this.options.getBadgeClassCallback) {
|
|
1707
|
+
const g = this.options.getBadgeClassCallback(d), b = Array.isArray(g) ? g : [g];
|
|
1708
|
+
h += " " + b.filter((v) => v).join(" ");
|
|
1709
|
+
}
|
|
1671
1710
|
return `
|
|
1672
|
-
<div class="
|
|
1673
|
-
<span class="
|
|
1674
|
-
<button type="button" class="
|
|
1711
|
+
<div class="${h}">
|
|
1712
|
+
<span class="ms__badge-text">${u}</span>
|
|
1713
|
+
<button type="button" class="ms__badge-remove" data-value="${m}" aria-label="Remove ${this.getItemBadgeDisplayValue(d)}"></button>
|
|
1675
1714
|
</div>
|
|
1676
1715
|
`;
|
|
1677
1716
|
}).join("");
|
|
1678
|
-
let
|
|
1679
|
-
|
|
1680
|
-
<div class="
|
|
1681
|
-
<span class="
|
|
1682
|
-
<button type="button" class="
|
|
1717
|
+
let c = "";
|
|
1718
|
+
a > 0 && (c = `
|
|
1719
|
+
<div class="ms__badge ms__badge--counter ms__badge--more" data-action="show-selected">
|
|
1720
|
+
<span class="ms__badge-text">${this.options.getCounterCallback ? this.options.getCounterCallback(t, a) : `+${a} more`}</span>
|
|
1721
|
+
<button type="button" class="ms__badge-remove" data-action="remove-hidden" aria-label="Remove ${a} hidden items"></button>
|
|
1683
1722
|
</div>
|
|
1684
|
-
`), this.
|
|
1685
|
-
} else if (
|
|
1686
|
-
if (this.
|
|
1687
|
-
const
|
|
1688
|
-
let
|
|
1689
|
-
if (
|
|
1690
|
-
const
|
|
1691
|
-
|
|
1723
|
+
`), this.badgesContainer.innerHTML = l + c;
|
|
1724
|
+
} else if (i === "compact")
|
|
1725
|
+
if (this.badgesContainer.className = `ms__badges ms__badges--${this.effectiveBadgesPosition}`, t > 0) {
|
|
1726
|
+
const n = e[0], r = this.getItemBadgeDisplayValue(n), a = t - 1;
|
|
1727
|
+
let l = r;
|
|
1728
|
+
if (a > 0) {
|
|
1729
|
+
const c = this.options.getCounterCallback ? this.options.getCounterCallback(t, a) : `+${a} more`;
|
|
1730
|
+
l = `${r} (${c})`;
|
|
1692
1731
|
}
|
|
1693
|
-
this.
|
|
1694
|
-
<div class="
|
|
1695
|
-
<span class="
|
|
1696
|
-
<button type="button" class="
|
|
1732
|
+
this.badgesContainer.innerHTML = `
|
|
1733
|
+
<div class="ms__badge ms__badge--counter" data-action="show-selected">
|
|
1734
|
+
<span class="ms__badge-text">${l}</span>
|
|
1735
|
+
<button type="button" class="ms__badge-remove" data-action="clear-count" aria-label="Clear all selections"></button>
|
|
1697
1736
|
</div>
|
|
1698
1737
|
`;
|
|
1699
1738
|
} else
|
|
1700
|
-
this.
|
|
1701
|
-
else if (this.
|
|
1702
|
-
const
|
|
1703
|
-
this.
|
|
1704
|
-
<div class="
|
|
1705
|
-
<span class="
|
|
1706
|
-
<button type="button" class="
|
|
1739
|
+
this.badgesContainer.innerHTML = "";
|
|
1740
|
+
else if (this.badgesContainer.className = `ms__badges ms__badges--${this.effectiveBadgesPosition}`, t > 0) {
|
|
1741
|
+
const n = this.options.getCounterCallback ? this.options.getCounterCallback(t) : `${t} selected`;
|
|
1742
|
+
this.badgesContainer.innerHTML = `
|
|
1743
|
+
<div class="ms__badge ms__badge--counter" data-action="show-selected">
|
|
1744
|
+
<span class="ms__badge-text">${n}</span>
|
|
1745
|
+
<button type="button" class="ms__badge-remove" data-action="clear-count" aria-label="Clear all selections"></button>
|
|
1707
1746
|
</div>
|
|
1708
1747
|
`;
|
|
1709
1748
|
} else
|
|
1710
|
-
this.
|
|
1711
|
-
this.
|
|
1749
|
+
this.badgesContainer.innerHTML = "";
|
|
1750
|
+
this.attachBadgeTooltips();
|
|
1712
1751
|
}
|
|
1713
1752
|
attachEvents() {
|
|
1714
1753
|
this.input.addEventListener("mousedown", (e) => {
|
|
@@ -1725,13 +1764,13 @@ class di {
|
|
|
1725
1764
|
}, 0), this.dropdown.addEventListener("click", (e) => this.handleDropdownClick(e)), this.dropdown.addEventListener("wheel", (e) => {
|
|
1726
1765
|
if (this.virtualScroll)
|
|
1727
1766
|
return;
|
|
1728
|
-
const t = e.currentTarget,
|
|
1729
|
-
(e.deltaY < 0 &&
|
|
1730
|
-
}, { passive: !1 }), this.
|
|
1767
|
+
const t = e.currentTarget, i = t.scrollTop === 0, o = t.scrollTop + t.clientHeight >= t.scrollHeight;
|
|
1768
|
+
(e.deltaY < 0 && i || e.deltaY > 0 && o) && e.preventDefault(), e.stopPropagation();
|
|
1769
|
+
}, { passive: !1 }), this.badgesContainer.addEventListener("mousedown", (e) => {
|
|
1731
1770
|
e.target.closest('[data-action="show-selected"]') && !this.showSelectedPopover && e.stopPropagation();
|
|
1732
|
-
}), this.
|
|
1771
|
+
}), this.badgesContainer.addEventListener("click", (e) => this.handleBadgeClick(e)), this.counter.addEventListener("mousedown", (e) => {
|
|
1733
1772
|
this.showSelectedPopover || e.stopPropagation();
|
|
1734
|
-
}), this.
|
|
1773
|
+
}), this.counter.addEventListener("click", (e) => {
|
|
1735
1774
|
e.stopPropagation(), this.toggleSelectedPopover();
|
|
1736
1775
|
}), this.selectedPopover.addEventListener("click", (e) => this.handleSelectedPopoverClick(e));
|
|
1737
1776
|
}
|
|
@@ -1740,41 +1779,41 @@ class di {
|
|
|
1740
1779
|
return;
|
|
1741
1780
|
let t = e;
|
|
1742
1781
|
if (this.options.beforeSearchCallback) {
|
|
1743
|
-
const
|
|
1744
|
-
if (
|
|
1745
|
-
|
|
1782
|
+
const i = this.options.beforeSearchCallback(e);
|
|
1783
|
+
if (i === null) {
|
|
1784
|
+
S.debug(`[${this.instanceId}] beforeSearchCallback blocked search for term:`, e), this.filteredOptions = [...this.allOptions], this.matchingIndices.clear(), this.renderDropdown();
|
|
1746
1785
|
return;
|
|
1747
1786
|
}
|
|
1748
|
-
t =
|
|
1787
|
+
t = i, t !== e && S.debug(`[${this.instanceId}] beforeSearchCallback transformed: "${e}" -> "${t}"`);
|
|
1749
1788
|
}
|
|
1750
1789
|
if (this.options.searchCallback) {
|
|
1751
1790
|
if (t.length < this.options.minSearchLength) {
|
|
1752
|
-
this.isLoading = !1, this.options.isKeepOptionsOnSearch ? (this.filteredOptions = [...this.allOptions],
|
|
1791
|
+
this.isLoading = !1, this.options.isKeepOptionsOnSearch ? (this.filteredOptions = [...this.allOptions], S.debug(`[${this.instanceId}] Search term below minimum, showing ${this.allOptions.length} initial options`)) : this.filteredOptions = [], this.matchingIndices.clear(), this.renderDropdown();
|
|
1753
1792
|
return;
|
|
1754
1793
|
}
|
|
1755
|
-
this.isLoading = !0, this.renderDropdown(),
|
|
1794
|
+
this.isLoading = !0, this.renderDropdown(), S.debug(`[${this.instanceId}] Loading data for search term:`, t);
|
|
1756
1795
|
try {
|
|
1757
|
-
const
|
|
1796
|
+
const i = await this.options.searchCallback(t);
|
|
1758
1797
|
if (this.searchTerm === e) {
|
|
1759
|
-
const o =
|
|
1760
|
-
this.filteredOptions = [...o], this.isLoading = !1, this.matchingIndices.clear(), this.focusedIndex = this.options.isSearchEnabled && this.filteredOptions.length > 0 ? 0 : -1, this.renderDropdown(),
|
|
1798
|
+
const o = i || [];
|
|
1799
|
+
this.filteredOptions = [...o], this.isLoading = !1, this.matchingIndices.clear(), this.focusedIndex = this.options.isSearchEnabled && this.filteredOptions.length > 0 ? 0 : -1, this.renderDropdown(), S.debug(`[${this.instanceId}] Loaded ${o.length} results`);
|
|
1761
1800
|
}
|
|
1762
|
-
} catch (
|
|
1763
|
-
|
|
1801
|
+
} catch (i) {
|
|
1802
|
+
S.error(`[${this.instanceId}] Error loading data:`, i), this.isLoading = !1, this.options.isKeepOptionsOnSearch ? this.filteredOptions = [...this.allOptions] : this.filteredOptions = [], this.matchingIndices.clear(), this.renderDropdown();
|
|
1764
1803
|
}
|
|
1765
1804
|
} else {
|
|
1766
1805
|
if (!t)
|
|
1767
1806
|
this.filteredOptions = [...this.allOptions], this.matchingIndices.clear(), this.focusedIndex = this.filteredOptions.length > 0 ? 0 : -1;
|
|
1768
1807
|
else {
|
|
1769
|
-
const
|
|
1770
|
-
if (
|
|
1771
|
-
this.filteredOptions = this.allOptions.filter((
|
|
1808
|
+
const i = this.options.searchMode || "filter", o = t.toLowerCase();
|
|
1809
|
+
if (i === "filter")
|
|
1810
|
+
this.filteredOptions = this.allOptions.filter((n) => this.getItemSearchValue(n).toLowerCase().includes(o)), this.matchingIndices.clear(), this.focusedIndex = this.filteredOptions.length > 0 ? 0 : -1, S.debug(`[${this.instanceId}] Filter mode: ${this.filteredOptions.length} matches for "${t}"`);
|
|
1772
1811
|
else {
|
|
1773
1812
|
this.filteredOptions = [...this.allOptions], this.matchingIndices.clear();
|
|
1774
|
-
let
|
|
1775
|
-
this.allOptions.forEach((
|
|
1776
|
-
this.getItemSearchValue(
|
|
1777
|
-
}),
|
|
1813
|
+
let n = -1;
|
|
1814
|
+
this.allOptions.forEach((r, a) => {
|
|
1815
|
+
this.getItemSearchValue(r).toLowerCase().includes(o) && (this.matchingIndices.add(a), n === -1 && (n = a));
|
|
1816
|
+
}), n >= 0 ? (this.focusedIndex = n, S.debug(`[${this.instanceId}] Navigate mode: ${this.matchingIndices.size} matches, jumped to index ${n}`)) : S.debug(`[${this.instanceId}] Navigate mode: No matches found, keeping previous focus`);
|
|
1778
1817
|
}
|
|
1779
1818
|
}
|
|
1780
1819
|
this.renderDropdown(), this.options.searchMode === "navigate" && this.focusedIndex >= 0 && this.scrollToFocused();
|
|
@@ -1786,8 +1825,8 @@ class di {
|
|
|
1786
1825
|
return;
|
|
1787
1826
|
}
|
|
1788
1827
|
if (!this.options.isSearchEnabled) {
|
|
1789
|
-
const t = e.key.length === 1 || e.key === "Backspace" || e.key === "Delete",
|
|
1790
|
-
if (t && !
|
|
1828
|
+
const t = e.key.length === 1 || e.key === "Backspace" || e.key === "Delete", i = ["ArrowUp", "ArrowDown", "PageUp", "PageDown", "Home", "End", "Enter", "Escape", "Tab"].includes(e.key);
|
|
1829
|
+
if (t && !i) {
|
|
1791
1830
|
e.preventDefault();
|
|
1792
1831
|
return;
|
|
1793
1832
|
}
|
|
@@ -1823,48 +1862,61 @@ class di {
|
|
|
1823
1862
|
}
|
|
1824
1863
|
}
|
|
1825
1864
|
handleDropdownClick(e) {
|
|
1826
|
-
|
|
1865
|
+
var o;
|
|
1866
|
+
A.debug(`[${this.instanceId}] Dropdown clicked`, { target: e.target.className }), e.stopPropagation();
|
|
1827
1867
|
const t = e.target.closest("[data-action]");
|
|
1828
1868
|
if (t) {
|
|
1829
1869
|
e.preventDefault();
|
|
1830
|
-
const
|
|
1831
|
-
|
|
1870
|
+
const n = t.dataset.action;
|
|
1871
|
+
if (A.debug(`[${this.instanceId}] Action button clicked:`, n), n === "select-all")
|
|
1872
|
+
this.selectAll();
|
|
1873
|
+
else if (n === "clear-all")
|
|
1874
|
+
this.clearAll();
|
|
1875
|
+
else if (n === "custom") {
|
|
1876
|
+
const r = (o = this.options.actionButtons) == null ? void 0 : o.find(
|
|
1877
|
+
(a) => {
|
|
1878
|
+
var l;
|
|
1879
|
+
return a.action === "custom" && a.text === ((l = t.textContent) == null ? void 0 : l.trim());
|
|
1880
|
+
}
|
|
1881
|
+
);
|
|
1882
|
+
r != null && r.onClick && r.onClick(this);
|
|
1883
|
+
}
|
|
1832
1884
|
return;
|
|
1833
1885
|
}
|
|
1834
|
-
const
|
|
1835
|
-
if (
|
|
1886
|
+
const i = e.target.closest(".ms__option");
|
|
1887
|
+
if (i && !i.classList.contains("ms__option--disabled")) {
|
|
1836
1888
|
e.preventDefault();
|
|
1837
|
-
const
|
|
1838
|
-
|
|
1839
|
-
value:
|
|
1889
|
+
const n = i.dataset.value, r = this.filteredOptions.find((a) => String(this.getItemValue(a)) === n);
|
|
1890
|
+
A.debug(`[${this.instanceId}] Option clicked:`, {
|
|
1891
|
+
value: n,
|
|
1840
1892
|
closeOnSelect: this.options.isCloseOnSelect,
|
|
1841
1893
|
placeholder: this.options.searchPlaceholder
|
|
1842
|
-
}),
|
|
1894
|
+
}), r && this.toggleOption(r);
|
|
1843
1895
|
}
|
|
1844
1896
|
}
|
|
1845
|
-
|
|
1897
|
+
handleBadgeClick(e) {
|
|
1846
1898
|
if (e.target.closest('[data-action="clear-count"]')) {
|
|
1847
|
-
e.preventDefault(), e.stopPropagation(),
|
|
1899
|
+
e.preventDefault(), e.stopPropagation(), A.debug(`[${this.instanceId}] Clear count button clicked`), this.clearAll();
|
|
1848
1900
|
return;
|
|
1849
1901
|
}
|
|
1850
1902
|
if (e.target.closest('[data-action="show-selected"]')) {
|
|
1851
1903
|
e.preventDefault(), e.stopPropagation(), this.toggleSelectedPopover();
|
|
1852
1904
|
return;
|
|
1853
1905
|
}
|
|
1854
|
-
const o = e.target.closest(".
|
|
1906
|
+
const o = e.target.closest(".ms__badge-remove");
|
|
1855
1907
|
if (o) {
|
|
1856
1908
|
if (e.preventDefault(), e.stopPropagation(), o.dataset.action === "remove-hidden") {
|
|
1857
|
-
|
|
1858
|
-
const
|
|
1859
|
-
Array.from(this.selectedOptions.values()).slice(
|
|
1909
|
+
A.debug(`[${this.instanceId}] Remove hidden items button clicked`);
|
|
1910
|
+
const l = this.options.badgesMaxVisible || 3;
|
|
1911
|
+
Array.from(this.selectedOptions.values()).slice(l).forEach((m) => this.deselectOption(m));
|
|
1860
1912
|
return;
|
|
1861
1913
|
}
|
|
1862
|
-
const
|
|
1863
|
-
|
|
1914
|
+
const r = o.dataset.value, a = this.selectedOptions.get(r);
|
|
1915
|
+
a && this.deselectOption(a);
|
|
1864
1916
|
return;
|
|
1865
1917
|
}
|
|
1866
|
-
if (e.target.closest(".
|
|
1867
|
-
e.preventDefault(), e.stopPropagation(),
|
|
1918
|
+
if (e.target.closest(".ms__badge--more") && !e.target.closest(".ms__badge-remove")) {
|
|
1919
|
+
e.preventDefault(), e.stopPropagation(), A.debug(`[${this.instanceId}] '+X more' badge clicked, showing popover`), this.toggleSelectedPopover();
|
|
1868
1920
|
return;
|
|
1869
1921
|
}
|
|
1870
1922
|
}
|
|
@@ -1872,25 +1924,25 @@ class di {
|
|
|
1872
1924
|
var o;
|
|
1873
1925
|
const t = e.composedPath();
|
|
1874
1926
|
if (this.showSelectedPopover && !t.some(
|
|
1875
|
-
(
|
|
1927
|
+
(r) => r instanceof Node && (this.selectedPopover.contains(r) || this.counter.contains(r) || r.closest && r.closest('[data-action="show-selected"]'))
|
|
1876
1928
|
)) {
|
|
1877
|
-
|
|
1929
|
+
f.debug(`[${this.instanceId}] Closing selected popover due to click outside`), this.hideSelectedPopover();
|
|
1878
1930
|
return;
|
|
1879
1931
|
}
|
|
1880
1932
|
if (!this.isOpen) return;
|
|
1881
|
-
const
|
|
1882
|
-
(
|
|
1933
|
+
const i = t.some(
|
|
1934
|
+
(n) => n instanceof Node && (this.element.contains(n) || this.dropdown.contains(n) || this.hint && this.hint.contains(n))
|
|
1883
1935
|
);
|
|
1884
|
-
|
|
1936
|
+
A.debug(`[${this.instanceId}] handleClickOutside`, {
|
|
1885
1937
|
target: e.target.className,
|
|
1886
1938
|
targetTag: e.target.tagName,
|
|
1887
|
-
clickedInside:
|
|
1939
|
+
clickedInside: i,
|
|
1888
1940
|
pathLength: t.length,
|
|
1889
1941
|
firstInPath: (o = t[0]) == null ? void 0 : o.tagName,
|
|
1890
|
-
elementContains: t.some((
|
|
1891
|
-
dropdownContains: t.some((
|
|
1942
|
+
elementContains: t.some((n) => n instanceof Node && this.element.contains(n)),
|
|
1943
|
+
dropdownContains: t.some((n) => n instanceof Node && this.dropdown.contains(n)),
|
|
1892
1944
|
isConnected: this.dropdown.isConnected
|
|
1893
|
-
}),
|
|
1945
|
+
}), i || (A.warn(`[${this.instanceId}] Closing dropdown due to click outside`), this.close());
|
|
1894
1946
|
}
|
|
1895
1947
|
focusNext() {
|
|
1896
1948
|
this.filteredOptions.length !== 0 && (this.focusedIndex = Math.min(this.filteredOptions.length - 1, this.focusedIndex + 1), this.renderDropdown(), this.scrollToFocused());
|
|
@@ -1906,13 +1958,13 @@ class di {
|
|
|
1906
1958
|
}
|
|
1907
1959
|
focusNextMatch() {
|
|
1908
1960
|
if (this.matchingIndices.size === 0) return;
|
|
1909
|
-
const e = Array.from(this.matchingIndices).sort((o,
|
|
1910
|
-
this.focusedIndex = e[
|
|
1961
|
+
const e = Array.from(this.matchingIndices).sort((o, n) => o - n), t = e.findIndex((o) => o === this.focusedIndex), i = (t + 1) % e.length;
|
|
1962
|
+
this.focusedIndex = e[i], this.renderDropdown(), this.scrollToFocused(), A.debug(`[${this.instanceId}] Jumped to next match: index ${this.focusedIndex} (${t + 1} of ${e.length})`);
|
|
1911
1963
|
}
|
|
1912
1964
|
focusPreviousMatch() {
|
|
1913
1965
|
if (this.matchingIndices.size === 0) return;
|
|
1914
|
-
const e = Array.from(this.matchingIndices).sort((o,
|
|
1915
|
-
this.focusedIndex = e[
|
|
1966
|
+
const e = Array.from(this.matchingIndices).sort((o, n) => o - n), t = e.findIndex((o) => o === this.focusedIndex), i = t <= 0 ? e.length - 1 : t - 1;
|
|
1967
|
+
this.focusedIndex = e[i], this.renderDropdown(), this.scrollToFocused(), A.debug(`[${this.instanceId}] Jumped to previous match: index ${this.focusedIndex} (${t + 1} of ${e.length})`);
|
|
1916
1968
|
}
|
|
1917
1969
|
focusPageUp() {
|
|
1918
1970
|
this.filteredOptions.length !== 0 && (this.focusedIndex = Math.max(0, this.focusedIndex - 10), this.renderDropdown(), this.scrollToFocused());
|
|
@@ -1924,107 +1976,107 @@ class di {
|
|
|
1924
1976
|
if (this.virtualScroll && this.focusedIndex >= 0)
|
|
1925
1977
|
this.virtualScroll.scrollToIndex(this.focusedIndex);
|
|
1926
1978
|
else {
|
|
1927
|
-
const e = this.dropdown.querySelector(".
|
|
1979
|
+
const e = this.dropdown.querySelector(".ms__option--focused");
|
|
1928
1980
|
e && e.scrollIntoView({ block: "nearest", behavior: "smooth" });
|
|
1929
1981
|
}
|
|
1930
1982
|
}
|
|
1931
1983
|
toggleOption(e) {
|
|
1932
|
-
const t = this.getItemValue(e),
|
|
1933
|
-
if (
|
|
1934
|
-
this.selectedValues.has(
|
|
1984
|
+
const t = this.getItemValue(e), i = String(t);
|
|
1985
|
+
if (A.debug(`[${this.instanceId}] toggleOption called`, { value: t, multiple: this.options.isMultipleEnabled }), !this.options.isMultipleEnabled) {
|
|
1986
|
+
this.selectedValues.has(i) ? (A.debug(`[${this.instanceId}] Deselecting option in single-select mode`, { value: t }), this.deselectOption(e)) : (A.debug(`[${this.instanceId}] Clearing previous selections and selecting new option`, { value: t }), this.selectedValues.clear(), this.selectedOptions.clear(), this.selectOption(e)), f.info(`[${this.instanceId}] ❌ Closing dropdown (single-select mode)`), this.close();
|
|
1935
1987
|
return;
|
|
1936
1988
|
}
|
|
1937
|
-
this.selectedValues.has(
|
|
1989
|
+
this.selectedValues.has(i) ? (A.debug(`[${this.instanceId}] Deselecting option`, { value: t }), this.deselectOption(e)) : (A.debug(`[${this.instanceId}] Selecting option`, { value: t }), this.selectOption(e)), A.debug(`[${this.instanceId}] Checking closeOnSelect`, {
|
|
1938
1990
|
closeOnSelect: this.options.isCloseOnSelect,
|
|
1939
1991
|
willClose: this.options.isCloseOnSelect === !0,
|
|
1940
1992
|
placeholder: this.options.searchPlaceholder
|
|
1941
|
-
}), this.options.isCloseOnSelect ? (
|
|
1993
|
+
}), this.options.isCloseOnSelect ? (f.info(`[${this.instanceId}] ❌ Closing dropdown (closeOnSelect=true)`), this.close()) : f.info(`[${this.instanceId}] ✅ Keeping dropdown open (closeOnSelect=false)`);
|
|
1942
1994
|
}
|
|
1943
1995
|
async handleAddNew(e) {
|
|
1944
1996
|
if (this.options.addNewCallback)
|
|
1945
1997
|
try {
|
|
1946
|
-
|
|
1998
|
+
S.debug(`[${this.instanceId}] Adding new option:`, e);
|
|
1947
1999
|
const t = await this.options.addNewCallback(e);
|
|
1948
|
-
this.allOptions.push(t), this.filteredOptions.push(t), this.selectOption(t), this.input.value = "", this.renderDropdown(), this.
|
|
2000
|
+
this.allOptions.push(t), this.filteredOptions.push(t), this.selectOption(t), this.input.value = "", this.renderDropdown(), this.renderBadges(), this.options.isCloseOnSelect && this.close();
|
|
1949
2001
|
} catch (t) {
|
|
1950
|
-
|
|
2002
|
+
S.error(`[${this.instanceId}] Error adding new option:`, t);
|
|
1951
2003
|
}
|
|
1952
2004
|
}
|
|
1953
2005
|
selectOption(e) {
|
|
1954
|
-
const t = this.getItemValue(e),
|
|
1955
|
-
this.selectedValues.add(
|
|
2006
|
+
const t = this.getItemValue(e), i = String(t);
|
|
2007
|
+
this.selectedValues.add(i), this.selectedOptions.set(i, e), this.renderDropdown(), this.renderBadges(), this.updateHiddenInput(), this.options.selectCallback && this.options.selectCallback(e), this.options.changeCallback && this.options.changeCallback(this.getSelected());
|
|
1956
2008
|
}
|
|
1957
2009
|
deselectOption(e) {
|
|
1958
|
-
const t = this.getItemValue(e),
|
|
1959
|
-
this.selectedValues.delete(
|
|
2010
|
+
const t = this.getItemValue(e), i = String(t);
|
|
2011
|
+
this.selectedValues.delete(i), this.selectedOptions.delete(i), this.renderDropdown(), this.renderBadges(), this.updateHiddenInput(), this.options.deselectCallback && this.options.deselectCallback(e), this.options.changeCallback && this.options.changeCallback(this.getSelected());
|
|
1960
2012
|
}
|
|
1961
2013
|
selectAll() {
|
|
1962
2014
|
this.filteredOptions.forEach((e) => {
|
|
1963
2015
|
if (!this.getItemDisabled(e)) {
|
|
1964
|
-
const t = this.getItemValue(e),
|
|
1965
|
-
this.selectedValues.add(
|
|
2016
|
+
const t = this.getItemValue(e), i = String(t);
|
|
2017
|
+
this.selectedValues.add(i), this.selectedOptions.set(i, e);
|
|
1966
2018
|
}
|
|
1967
|
-
}), this.renderDropdown(), this.
|
|
2019
|
+
}), this.renderDropdown(), this.renderBadges(), this.updateHiddenInput(), this.options.changeCallback && this.options.changeCallback(this.getSelected());
|
|
1968
2020
|
}
|
|
1969
2021
|
clearAll() {
|
|
1970
|
-
this.selectedValues.clear(), this.selectedOptions.clear(), this.renderDropdown(), this.
|
|
2022
|
+
this.selectedValues.clear(), this.selectedOptions.clear(), this.renderDropdown(), this.renderBadges(), this.updateHiddenInput(), this.options.changeCallback && this.options.changeCallback(this.getSelected());
|
|
1971
2023
|
}
|
|
1972
2024
|
open() {
|
|
1973
|
-
|
|
2025
|
+
f.debug(`[${this.instanceId}] open() called`, { isOpen: this.isOpen }), !this.isOpen && (this.isOpen = !0, this.element.classList.add("ms--open"), this.dropdown.classList.add("ms__dropdown--visible"), f.info(`[${this.instanceId}] Dropdown opened`), this.input.placeholder = this.options.searchPlaceholder, !this.options.isMultipleEnabled && this.options.isSearchEnabled && (this.input.value = ""), this.options.searchCallback && this.options.isKeepOptionsOnSearch && !this.searchTerm && (this.filteredOptions = [...this.allOptions], f.debug(`[${this.instanceId}] Showing ${this.allOptions.length} initial options on open`)), this.renderDropdown(), this.positionDropdown(), this.hint && (this.hint.classList.add("ms__hint--visible"), this.positionHint()));
|
|
1974
2026
|
}
|
|
1975
2027
|
close() {
|
|
1976
|
-
if (
|
|
1977
|
-
this.isOpen = !1, this.element.classList.remove("
|
|
2028
|
+
if (f.debug(`[${this.instanceId}] close() called`, { isOpen: this.isOpen }), !this.isOpen) return;
|
|
2029
|
+
this.isOpen = !1, this.element.classList.remove("ms--open"), this.dropdown.classList.remove("ms__dropdown--visible"), this.hint && this.hint.classList.remove("ms__hint--visible"), this.searchTerm = "";
|
|
1978
2030
|
const e = this.options.isMultipleEnabled || this.options.isSearchEnabled;
|
|
1979
|
-
|
|
2031
|
+
f.warn(`[${this.instanceId}] close() - input clearing decision`, {
|
|
1980
2032
|
multiple: this.options.isMultipleEnabled,
|
|
1981
2033
|
enableSearch: this.options.isSearchEnabled,
|
|
1982
2034
|
willClearInput: e,
|
|
1983
2035
|
currentInputValue: this.input.value
|
|
1984
|
-
}), e ? (
|
|
2036
|
+
}), e ? (f.info(`[${this.instanceId}] 🧹 close() CLEARING input.value`), this.input.value = "") : f.info(`[${this.instanceId}] 🔒 close() KEEPING input.value = "${this.input.value}"`), this.filteredOptions = [...this.allOptions], this.focusedIndex = -1, f.info(`[${this.instanceId}] 📞 close() CALLING renderBadges()`), this.renderBadges(), f.info(`[${this.instanceId}] ✅ close() AFTER renderBadges(), input.value = "${this.input.value}"`), this.dropdownCleanup && (this.dropdownCleanup(), this.dropdownCleanup = null), this.hintCleanup && (this.hintCleanup(), this.hintCleanup = null), this.dropdownPlacement = null, f.info(`[${this.instanceId}] Dropdown closed. Stack trace:`), f.trace();
|
|
1985
2037
|
}
|
|
1986
2038
|
positionDropdown() {
|
|
1987
|
-
this.dropdownCleanup =
|
|
2039
|
+
this.dropdownCleanup = q(
|
|
1988
2040
|
this.input,
|
|
1989
2041
|
this.dropdown,
|
|
1990
2042
|
() => {
|
|
1991
2043
|
const e = this.options.isPlacementLocked && this.dropdownPlacement ? this.dropdownPlacement : "bottom-start", t = [
|
|
1992
|
-
|
|
1993
|
-
...this.options.isPlacementLocked && this.dropdownPlacement ? [] : [
|
|
1994
|
-
|
|
2044
|
+
Z(4),
|
|
2045
|
+
...this.options.isPlacementLocked && this.dropdownPlacement ? [] : [ae()],
|
|
2046
|
+
Q({ padding: 8 })
|
|
1995
2047
|
];
|
|
1996
|
-
|
|
2048
|
+
ee(this.input, this.dropdown, {
|
|
1997
2049
|
placement: e,
|
|
1998
2050
|
middleware: t
|
|
1999
|
-
}).then(({ x:
|
|
2000
|
-
this.options.isPlacementLocked && !this.dropdownPlacement && (this.dropdownPlacement =
|
|
2001
|
-
const
|
|
2002
|
-
left: `${
|
|
2051
|
+
}).then(({ x: i, y: o, placement: n }) => {
|
|
2052
|
+
this.options.isPlacementLocked && !this.dropdownPlacement && (this.dropdownPlacement = n, f.debug(`[${this.instanceId}] Locked dropdown placement:`, n));
|
|
2053
|
+
const r = {
|
|
2054
|
+
left: `${i}px`,
|
|
2003
2055
|
top: `${o}px`,
|
|
2004
2056
|
width: `${this.input.offsetWidth}px`
|
|
2005
2057
|
};
|
|
2006
|
-
this.options.dropdownMinWidth && (
|
|
2058
|
+
this.options.dropdownMinWidth && (r.minWidth = this.options.dropdownMinWidth), Object.assign(this.dropdown.style, r), this.hint && this.isOpen && this.positionHint();
|
|
2007
2059
|
});
|
|
2008
2060
|
}
|
|
2009
2061
|
);
|
|
2010
2062
|
}
|
|
2011
2063
|
positionHint() {
|
|
2012
|
-
this.hint && (this.hintCleanup && this.hintCleanup(), this.hintCleanup =
|
|
2064
|
+
this.hint && (this.hintCleanup && this.hintCleanup(), this.hintCleanup = q(
|
|
2013
2065
|
this.input,
|
|
2014
2066
|
this.hint,
|
|
2015
2067
|
() => {
|
|
2016
2068
|
let e = "top-start";
|
|
2017
|
-
this.dropdownPlacement && (this.dropdownPlacement.startsWith("bottom") ? e = this.dropdownPlacement.replace("bottom", "top") : this.dropdownPlacement.startsWith("top") && (e = this.dropdownPlacement.replace("top", "bottom"))),
|
|
2069
|
+
this.dropdownPlacement && (this.dropdownPlacement.startsWith("bottom") ? e = this.dropdownPlacement.replace("bottom", "top") : this.dropdownPlacement.startsWith("top") && (e = this.dropdownPlacement.replace("top", "bottom"))), ee(this.input, this.hint, {
|
|
2018
2070
|
placement: e,
|
|
2019
2071
|
middleware: [
|
|
2020
|
-
|
|
2072
|
+
Z(4),
|
|
2021
2073
|
// Don't use flip() - we want hint to stay opposite of dropdown
|
|
2022
|
-
|
|
2074
|
+
Q({ padding: 8 })
|
|
2023
2075
|
]
|
|
2024
|
-
}).then(({ x: t, y:
|
|
2076
|
+
}).then(({ x: t, y: i }) => {
|
|
2025
2077
|
Object.assign(this.hint.style, {
|
|
2026
2078
|
left: `${t}px`,
|
|
2027
|
-
top: `${
|
|
2079
|
+
top: `${i}px`
|
|
2028
2080
|
});
|
|
2029
2081
|
});
|
|
2030
2082
|
}
|
|
@@ -2034,24 +2086,24 @@ class di {
|
|
|
2034
2086
|
const e = this.element.dataset.initialValues;
|
|
2035
2087
|
if (e)
|
|
2036
2088
|
try {
|
|
2037
|
-
JSON.parse(e).forEach((
|
|
2038
|
-
const o = String(
|
|
2089
|
+
JSON.parse(e).forEach((i) => {
|
|
2090
|
+
const o = String(i);
|
|
2039
2091
|
this.selectedValues.add(o);
|
|
2040
|
-
const
|
|
2041
|
-
|
|
2042
|
-
}), this.
|
|
2092
|
+
const n = this.allOptions.find((r) => String(this.getItemValue(r)) === o);
|
|
2093
|
+
n && this.selectedOptions.set(o, n);
|
|
2094
|
+
}), this.renderBadges();
|
|
2043
2095
|
} catch (t) {
|
|
2044
|
-
|
|
2096
|
+
S.error(`[${this.instanceId}] Failed to parse initial values:`, t);
|
|
2045
2097
|
}
|
|
2046
2098
|
}
|
|
2047
2099
|
toggleSelectedPopover() {
|
|
2048
2100
|
this.showSelectedPopover ? this.hideSelectedPopover() : this.showPopover();
|
|
2049
2101
|
}
|
|
2050
2102
|
showPopover() {
|
|
2051
|
-
|
|
2103
|
+
f.debug(`[${this.instanceId}] showPopover() called`), this.isOpen && this.close(), this.showSelectedPopover = !0, this.renderSelectedPopover(), this.selectedPopover.classList.add("ms__selected-popover--visible"), this.selectedValues.size >= 100 && this.selectedPopover.classList.add("ms__selected-popover--virtual"), this.positionSelectedPopover();
|
|
2052
2104
|
}
|
|
2053
2105
|
hideSelectedPopover() {
|
|
2054
|
-
|
|
2106
|
+
f.debug(`[${this.instanceId}] hideSelectedPopover() called`), this.showSelectedPopover = !1, this.selectedPopover.classList.remove("ms__selected-popover--visible"), this.selectedPopover.classList.remove("ms__selected-popover--virtual"), this.selectedPopoverPlacement = null, this.selectedPopoverVirtualScroll && (this.selectedPopoverVirtualScroll.destroy(), this.selectedPopoverVirtualScroll = null, this.selectedPopoverContainer = null), this.selectedPopoverCleanup && (this.selectedPopoverCleanup(), this.selectedPopoverCleanup = null);
|
|
2055
2107
|
}
|
|
2056
2108
|
renderSelectedPopover() {
|
|
2057
2109
|
const e = Array.from(this.selectedOptions.values()), t = this.selectedValues.size;
|
|
@@ -2060,91 +2112,101 @@ class di {
|
|
|
2060
2112
|
return;
|
|
2061
2113
|
}
|
|
2062
2114
|
this.selectedPopover.innerHTML = `
|
|
2063
|
-
<div class="
|
|
2115
|
+
<div class="ms__selected-popover-header">
|
|
2064
2116
|
<span>Selected Items (${t})</span>
|
|
2065
|
-
<button type="button" class="
|
|
2117
|
+
<button type="button" class="ms__selected-popover-close" aria-label="Close">×</button>
|
|
2066
2118
|
</div>
|
|
2067
|
-
<div class="
|
|
2068
|
-
${e.map((o) =>
|
|
2069
|
-
const s = this.getItemValue(o), n = this.getItemPillDisplayValue(o);
|
|
2070
|
-
return `
|
|
2071
|
-
<div class="ml__pill">
|
|
2072
|
-
<span class="ml__pill-text">${n}</span>
|
|
2073
|
-
<button type="button" class="ml__pill-remove" data-value="${s}" aria-label="Remove ${n}"></button>
|
|
2074
|
-
</div>
|
|
2075
|
-
`;
|
|
2076
|
-
}).join("")}
|
|
2119
|
+
<div class="ms__selected-popover-body">
|
|
2120
|
+
${e.map((o) => this.renderBadgeForPopover(o)).join("")}
|
|
2077
2121
|
</div>
|
|
2078
2122
|
`;
|
|
2079
2123
|
}
|
|
2080
2124
|
renderSelectedPopoverVirtual(e, t) {
|
|
2081
2125
|
if (this.selectedPopoverVirtualScroll) {
|
|
2082
|
-
const
|
|
2083
|
-
|
|
2126
|
+
const a = this.selectedPopover.querySelector(".ms__selected-popover-header span");
|
|
2127
|
+
a && (a.textContent = `Selected Items (${t})`);
|
|
2084
2128
|
} else {
|
|
2085
|
-
const
|
|
2086
|
-
<div class="
|
|
2129
|
+
const a = this.options.badgeHeight ?? 36, l = `
|
|
2130
|
+
<div class="ms__selected-popover-header">
|
|
2087
2131
|
<span>Selected Items (${t})</span>
|
|
2088
|
-
<button type="button" class="
|
|
2132
|
+
<button type="button" class="ms__selected-popover-close" aria-label="Close">×</button>
|
|
2089
2133
|
</div>
|
|
2090
|
-
<div class="
|
|
2134
|
+
<div class="ms__selected-popover-body ms__selected-popover-body--virtual" style="height: 18rem; overflow-y: auto; position: relative; --ml-badge-height-virtual: ${a}px;"></div>
|
|
2091
2135
|
`;
|
|
2092
|
-
this.selectedPopover.innerHTML =
|
|
2136
|
+
this.selectedPopover.innerHTML = l, this.selectedPopoverContainer = this.selectedPopover.querySelector(".ms__selected-popover-body");
|
|
2093
2137
|
}
|
|
2094
2138
|
if (!this.selectedPopoverContainer) return;
|
|
2095
|
-
const
|
|
2139
|
+
const n = (this.options.badgeHeight ?? 36) + 4, r = this.options.virtualScrollBuffer ?? 10;
|
|
2096
2140
|
requestAnimationFrame(() => {
|
|
2097
|
-
this.selectedPopoverContainer && (this.selectedPopoverVirtualScroll ? this.selectedPopoverVirtualScroll.setItems(e) : this.selectedPopoverVirtualScroll = new
|
|
2141
|
+
this.selectedPopoverContainer && (this.selectedPopoverVirtualScroll ? this.selectedPopoverVirtualScroll.setItems(e) : this.selectedPopoverVirtualScroll = new He({
|
|
2098
2142
|
container: this.selectedPopoverContainer,
|
|
2099
|
-
itemHeight:
|
|
2143
|
+
itemHeight: n,
|
|
2100
2144
|
items: e,
|
|
2101
|
-
renderItem: (
|
|
2102
|
-
bufferSize:
|
|
2145
|
+
renderItem: (a) => this.renderBadgeForPopover(a),
|
|
2146
|
+
bufferSize: r
|
|
2103
2147
|
}));
|
|
2104
2148
|
});
|
|
2105
2149
|
}
|
|
2106
|
-
|
|
2107
|
-
const t = this.getItemValue(e)
|
|
2150
|
+
renderBadgeForPopover(e) {
|
|
2151
|
+
const t = this.getItemValue(e);
|
|
2152
|
+
let i;
|
|
2153
|
+
if (this.options.renderSelectedItemContentCallback) {
|
|
2154
|
+
const r = this.options.renderSelectedItemContentCallback(e);
|
|
2155
|
+
i = typeof r == "string" ? r : r.outerHTML;
|
|
2156
|
+
} else if (this.options.renderBadgeContentCallback) {
|
|
2157
|
+
const r = {
|
|
2158
|
+
displayMode: this.options.badgesDisplayMode || "badges",
|
|
2159
|
+
isInPopover: !0
|
|
2160
|
+
}, a = this.options.renderBadgeContentCallback(e, r);
|
|
2161
|
+
i = typeof a == "string" ? a : a.outerHTML;
|
|
2162
|
+
} else
|
|
2163
|
+
i = this.getItemBadgeDisplayValue(e);
|
|
2164
|
+
let o = "ms__badge";
|
|
2165
|
+
const n = this.options.getSelectedItemClassCallback || this.options.getBadgeClassCallback;
|
|
2166
|
+
if (n) {
|
|
2167
|
+
const r = n(e), a = Array.isArray(r) ? r : [r];
|
|
2168
|
+
o += " " + a.filter((l) => l).join(" ");
|
|
2169
|
+
}
|
|
2108
2170
|
return `
|
|
2109
|
-
<div class="
|
|
2110
|
-
<span class="
|
|
2111
|
-
<button type="button" class="
|
|
2171
|
+
<div class="${o}">
|
|
2172
|
+
<span class="ms__badge-text">${i}</span>
|
|
2173
|
+
<button type="button" class="ms__badge-remove" data-value="${t}" aria-label="Remove ${this.getItemBadgeDisplayValue(e)}"></button>
|
|
2112
2174
|
</div>
|
|
2113
2175
|
`;
|
|
2114
2176
|
}
|
|
2115
2177
|
handleSelectedPopoverClick(e) {
|
|
2116
|
-
if (e.stopPropagation(), e.target.closest(".
|
|
2178
|
+
if (e.stopPropagation(), e.target.closest(".ms__selected-popover-close")) {
|
|
2117
2179
|
e.preventDefault(), this.hideSelectedPopover();
|
|
2118
2180
|
return;
|
|
2119
2181
|
}
|
|
2120
|
-
const
|
|
2121
|
-
if (
|
|
2182
|
+
const i = e.target.closest(".ms__badge-remove");
|
|
2183
|
+
if (i) {
|
|
2122
2184
|
e.preventDefault();
|
|
2123
|
-
const o =
|
|
2124
|
-
|
|
2185
|
+
const o = i.dataset.value, n = this.selectedOptions.get(o);
|
|
2186
|
+
n && (this.deselectOption(n), this.renderSelectedPopover(), this.selectedValues.size === 0 && this.hideSelectedPopover());
|
|
2125
2187
|
}
|
|
2126
2188
|
}
|
|
2127
2189
|
positionSelectedPopover() {
|
|
2128
|
-
this.selectedPopoverCleanup =
|
|
2190
|
+
this.selectedPopoverCleanup = q(
|
|
2129
2191
|
this.input,
|
|
2130
2192
|
this.selectedPopover,
|
|
2131
2193
|
() => {
|
|
2132
2194
|
const e = this.selectedPopoverPlacement || "bottom-start";
|
|
2133
|
-
|
|
2195
|
+
ee(this.input, this.selectedPopover, {
|
|
2134
2196
|
placement: e,
|
|
2135
2197
|
middleware: [
|
|
2136
|
-
|
|
2137
|
-
...this.selectedPopoverPlacement ? [] : [
|
|
2138
|
-
|
|
2198
|
+
Z(4),
|
|
2199
|
+
...this.selectedPopoverPlacement ? [] : [ae()],
|
|
2200
|
+
Q({ padding: 8 })
|
|
2139
2201
|
]
|
|
2140
|
-
}).then(({ x: t, y:
|
|
2141
|
-
this.selectedPopoverPlacement || (this.selectedPopoverPlacement = o,
|
|
2142
|
-
const
|
|
2202
|
+
}).then(({ x: t, y: i, placement: o }) => {
|
|
2203
|
+
this.selectedPopoverPlacement || (this.selectedPopoverPlacement = o, f.debug(`[${this.instanceId}] Locked popover placement:`, o));
|
|
2204
|
+
const n = {
|
|
2143
2205
|
left: `${t}px`,
|
|
2144
|
-
top: `${
|
|
2206
|
+
top: `${i}px`,
|
|
2145
2207
|
width: `${this.input.offsetWidth}px`
|
|
2146
2208
|
};
|
|
2147
|
-
this.options.dropdownMinWidth && (
|
|
2209
|
+
this.options.dropdownMinWidth && (n.minWidth = this.options.dropdownMinWidth), Object.assign(this.selectedPopover.style, n);
|
|
2148
2210
|
});
|
|
2149
2211
|
}
|
|
2150
2212
|
);
|
|
@@ -2155,19 +2217,19 @@ class di {
|
|
|
2155
2217
|
updateHiddenInput() {
|
|
2156
2218
|
if (!this.options.formFieldId) return;
|
|
2157
2219
|
this.hiddenInputs.forEach((o) => o.remove()), this.hiddenInputs = [];
|
|
2158
|
-
const e = this.options.valueFormat || "json", t = Array.from(this.selectedOptions.values()).map((o) => this.getItemValue(o)),
|
|
2220
|
+
const e = this.options.valueFormat || "json", t = Array.from(this.selectedOptions.values()).map((o) => this.getItemValue(o)), i = this.options.hostElement || this.element;
|
|
2159
2221
|
if (e === "array")
|
|
2160
2222
|
t.forEach((o) => {
|
|
2161
|
-
const
|
|
2162
|
-
|
|
2223
|
+
const n = document.createElement("input");
|
|
2224
|
+
n.type = "hidden", n.name = `${this.options.formFieldId}[]`, n.value = String(o), i.appendChild(n), this.hiddenInputs.push(n);
|
|
2163
2225
|
});
|
|
2164
2226
|
else {
|
|
2165
2227
|
const o = document.createElement("input");
|
|
2166
|
-
o.type = "hidden", o.name = this.options.formFieldId, o.id = this.options.formFieldId, o.value = this.getFormValue(),
|
|
2228
|
+
o.type = "hidden", o.name = this.options.formFieldId, o.id = this.options.formFieldId, o.value = this.getFormValue(), i.appendChild(o), this.hiddenInputs.push(o);
|
|
2167
2229
|
}
|
|
2168
2230
|
}
|
|
2169
2231
|
getFormValue() {
|
|
2170
|
-
const e = Array.from(this.selectedOptions.values()).map((
|
|
2232
|
+
const e = Array.from(this.selectedOptions.values()).map((i) => this.getItemValue(i));
|
|
2171
2233
|
return this.options.getValueFormatCallback ? this.options.getValueFormatCallback(e) : (this.options.valueFormat || "json") === "csv" ? e.join(",") : JSON.stringify(e);
|
|
2172
2234
|
}
|
|
2173
2235
|
// ========================================================================
|
|
@@ -2178,9 +2240,9 @@ class di {
|
|
|
2178
2240
|
}
|
|
2179
2241
|
setSelected(e) {
|
|
2180
2242
|
this.selectedValues = new Set(e.map((t) => String(t))), this.selectedOptions.clear(), e.forEach((t) => {
|
|
2181
|
-
const
|
|
2182
|
-
o && this.selectedOptions.set(
|
|
2183
|
-
}), this.renderDropdown(), this.
|
|
2243
|
+
const i = String(t), o = this.allOptions.find((n) => String(this.getItemValue(n)) === i);
|
|
2244
|
+
o && this.selectedOptions.set(i, o);
|
|
2245
|
+
}), this.renderDropdown(), this.renderBadges(), this.updateHiddenInput();
|
|
2184
2246
|
}
|
|
2185
2247
|
get selectedItem() {
|
|
2186
2248
|
return this.selectedOptions.size === 0 ? null : Array.from(this.selectedOptions.values())[0];
|
|
@@ -2200,92 +2262,92 @@ class di {
|
|
|
2200
2262
|
return this.options.isMultipleEnabled ? e : e[0] ?? null;
|
|
2201
2263
|
}
|
|
2202
2264
|
// ========================================================================
|
|
2203
|
-
//
|
|
2265
|
+
// BADGE TOOLTIP METHODS
|
|
2204
2266
|
// ========================================================================
|
|
2205
|
-
|
|
2206
|
-
if (!this.options.
|
|
2207
|
-
|
|
2267
|
+
attachBadgeTooltips() {
|
|
2268
|
+
if (!this.options.isBadgeTooltipsEnabled) {
|
|
2269
|
+
f.debug(`[${this.instanceId}] Tooltips disabled - isBadgeTooltipsEnabled is false`);
|
|
2208
2270
|
return;
|
|
2209
2271
|
}
|
|
2210
|
-
const e = this.
|
|
2211
|
-
|
|
2212
|
-
const o =
|
|
2213
|
-
if (!
|
|
2214
|
-
const
|
|
2215
|
-
if (!
|
|
2216
|
-
const
|
|
2217
|
-
|
|
2218
|
-
const
|
|
2219
|
-
this.createRemoveButtonTooltip(
|
|
2272
|
+
const e = this.badgesContainer.querySelectorAll(".ms__badge:not(.ms__badge--more)");
|
|
2273
|
+
f.debug(`[${this.instanceId}] Found ${e.length} badges to attach tooltips to`), e.forEach((i) => {
|
|
2274
|
+
const o = i, n = o.querySelector(".ms__badge-remove");
|
|
2275
|
+
if (!n) return;
|
|
2276
|
+
const r = n.dataset.value, a = this.selectedOptions.get(r);
|
|
2277
|
+
if (!a) return;
|
|
2278
|
+
const l = o.querySelector(".ms__badge-text");
|
|
2279
|
+
l && this.createTooltipForElement(l, a, r);
|
|
2280
|
+
const c = this.getItemBadgeDisplayValue(a);
|
|
2281
|
+
this.createRemoveButtonTooltip(n, c, r);
|
|
2220
2282
|
});
|
|
2221
|
-
const t = this.
|
|
2283
|
+
const t = this.badgesContainer.querySelector(".ms__badge--more");
|
|
2222
2284
|
if (t) {
|
|
2223
|
-
const
|
|
2224
|
-
if (
|
|
2225
|
-
const o = this.options.
|
|
2226
|
-
this.createRemoveButtonTooltip(
|
|
2285
|
+
const i = t.querySelector(".ms__badge-remove");
|
|
2286
|
+
if (i && i.dataset.action === "remove-hidden") {
|
|
2287
|
+
const o = this.options.badgesMaxVisible || 3, r = Array.from(this.selectedOptions.values()).length - o;
|
|
2288
|
+
this.createRemoveButtonTooltip(i, `${r} hidden items`, "more-badge-remove");
|
|
2227
2289
|
}
|
|
2228
2290
|
}
|
|
2229
2291
|
}
|
|
2230
|
-
createTooltipForElement(e, t,
|
|
2292
|
+
createTooltipForElement(e, t, i) {
|
|
2231
2293
|
const o = document.createElement("div");
|
|
2232
|
-
o.className = "
|
|
2233
|
-
let
|
|
2234
|
-
if (this.options.
|
|
2235
|
-
|
|
2294
|
+
o.className = "ms__badge-tooltip";
|
|
2295
|
+
let n;
|
|
2296
|
+
if (this.options.getBadgeTooltipCallback)
|
|
2297
|
+
n = this.options.getBadgeTooltipCallback(t), f.debug(`[${this.instanceId}] Using custom callback for tooltip content`);
|
|
2236
2298
|
else {
|
|
2237
|
-
const m = this.
|
|
2238
|
-
|
|
2239
|
-
${
|
|
2299
|
+
const m = this.getItemBadgeDisplayValue(t), u = this.getItemSubtitle(t);
|
|
2300
|
+
n = u ? `${m}
|
|
2301
|
+
${u}` : m, f.debug(`[${this.instanceId}] Using default content: "${n}"`);
|
|
2240
2302
|
}
|
|
2241
|
-
typeof
|
|
2242
|
-
let
|
|
2243
|
-
const
|
|
2244
|
-
clearTimeout(
|
|
2245
|
-
|
|
2246
|
-
}, this.options.
|
|
2247
|
-
},
|
|
2248
|
-
clearTimeout(
|
|
2249
|
-
o.classList.remove("
|
|
2303
|
+
typeof n == "string" ? o.textContent = n : o.appendChild(n), (this.options.container || document.body).appendChild(o), f.debug(`[${this.instanceId}] Tooltip element created and appended for "${i}"`), this.badgeTooltips.set(i, o);
|
|
2304
|
+
let a, l;
|
|
2305
|
+
const c = () => {
|
|
2306
|
+
clearTimeout(l), f.debug(`[${this.instanceId}] Mouse entered badge "${i}", will show tooltip in ${this.options.badgeTooltipDelay || 300}ms`), a = window.setTimeout(() => {
|
|
2307
|
+
f.debug(`[${this.instanceId}] Showing tooltip for "${i}"`), o.classList.add("ms__badge-tooltip--visible"), this.positionBadgeTooltip(e, o, i);
|
|
2308
|
+
}, this.options.badgeTooltipDelay || 300);
|
|
2309
|
+
}, d = () => {
|
|
2310
|
+
clearTimeout(a), l = window.setTimeout(() => {
|
|
2311
|
+
o.classList.remove("ms__badge-tooltip--visible"), this.cleanupBadgeTooltip(i);
|
|
2250
2312
|
}, 100);
|
|
2251
2313
|
};
|
|
2252
|
-
e.addEventListener("mouseenter",
|
|
2314
|
+
e.addEventListener("mouseenter", c), e.addEventListener("mouseleave", d);
|
|
2253
2315
|
}
|
|
2254
|
-
createRemoveButtonTooltip(e, t,
|
|
2316
|
+
createRemoveButtonTooltip(e, t, i) {
|
|
2255
2317
|
const o = document.createElement("div");
|
|
2256
|
-
o.className = "
|
|
2257
|
-
const
|
|
2258
|
-
this.
|
|
2259
|
-
let
|
|
2260
|
-
const
|
|
2261
|
-
clearTimeout(
|
|
2262
|
-
const m = this.
|
|
2263
|
-
m && m.classList.remove("
|
|
2264
|
-
o.classList.add("
|
|
2265
|
-
}, this.options.
|
|
2266
|
-
},
|
|
2267
|
-
clearTimeout(
|
|
2268
|
-
o.classList.remove("
|
|
2318
|
+
o.className = "ms__badge-tooltip", o.textContent = `Remove ${t}`, (this.options.container || document.body).appendChild(o);
|
|
2319
|
+
const r = `${i}-remove`;
|
|
2320
|
+
this.badgeTooltips.set(r, o);
|
|
2321
|
+
let a, l;
|
|
2322
|
+
const c = () => {
|
|
2323
|
+
clearTimeout(l);
|
|
2324
|
+
const m = this.badgeTooltips.get(i);
|
|
2325
|
+
m && m.classList.remove("ms__badge-tooltip--visible"), a = window.setTimeout(() => {
|
|
2326
|
+
o.classList.add("ms__badge-tooltip--visible"), this.positionBadgeTooltip(e, o, r);
|
|
2327
|
+
}, this.options.badgeTooltipDelay || 300);
|
|
2328
|
+
}, d = () => {
|
|
2329
|
+
clearTimeout(a), l = window.setTimeout(() => {
|
|
2330
|
+
o.classList.remove("ms__badge-tooltip--visible"), this.cleanupBadgeTooltip(r);
|
|
2269
2331
|
}, 100);
|
|
2270
2332
|
};
|
|
2271
|
-
e.addEventListener("mouseenter",
|
|
2333
|
+
e.addEventListener("mouseenter", c), e.addEventListener("mouseleave", d);
|
|
2272
2334
|
}
|
|
2273
|
-
|
|
2274
|
-
const o =
|
|
2275
|
-
|
|
2276
|
-
placement: this.options.
|
|
2335
|
+
positionBadgeTooltip(e, t, i) {
|
|
2336
|
+
const o = q(e, t, () => {
|
|
2337
|
+
ee(e, t, {
|
|
2338
|
+
placement: this.options.badgeTooltipPlacement || "top",
|
|
2277
2339
|
strategy: "fixed",
|
|
2278
2340
|
middleware: [
|
|
2279
|
-
|
|
2280
|
-
|
|
2281
|
-
|
|
2341
|
+
Z(this.options.badgeTooltipOffset || 8),
|
|
2342
|
+
ae(),
|
|
2343
|
+
Q({ padding: 8 })
|
|
2282
2344
|
]
|
|
2283
|
-
}).then(({ x:
|
|
2345
|
+
}).then(({ x: n, y: r }) => {
|
|
2284
2346
|
Object.assign(t.style, {
|
|
2285
|
-
left: `${
|
|
2286
|
-
top: `${
|
|
2287
|
-
}),
|
|
2288
|
-
placement: this.options.
|
|
2347
|
+
left: `${n}px`,
|
|
2348
|
+
top: `${r}px`
|
|
2349
|
+
}), f.debug(`[${this.instanceId}] Positioned tooltip "${i}" at x:${n}, y:${r}`, {
|
|
2350
|
+
placement: this.options.badgeTooltipPlacement || "top",
|
|
2289
2351
|
tooltipClasses: t.className,
|
|
2290
2352
|
tooltipDisplay: window.getComputedStyle(t).display,
|
|
2291
2353
|
tooltipOpacity: window.getComputedStyle(t).opacity,
|
|
@@ -2295,68 +2357,140 @@ ${p}` : m, v.debug(`[${this.instanceId}] Using default content: "${s}"`);
|
|
|
2295
2357
|
});
|
|
2296
2358
|
});
|
|
2297
2359
|
});
|
|
2298
|
-
this.
|
|
2360
|
+
this.badgeTooltipCleanups.set(i, o);
|
|
2299
2361
|
}
|
|
2300
|
-
|
|
2301
|
-
const t = this.
|
|
2302
|
-
t && (t(), this.
|
|
2362
|
+
cleanupBadgeTooltip(e) {
|
|
2363
|
+
const t = this.badgeTooltipCleanups.get(e);
|
|
2364
|
+
t && (t(), this.badgeTooltipCleanups.delete(e));
|
|
2303
2365
|
}
|
|
2304
|
-
|
|
2305
|
-
this.
|
|
2366
|
+
destroyAllBadgeTooltips() {
|
|
2367
|
+
this.badgeTooltipCleanups.forEach((e) => e()), this.badgeTooltipCleanups.clear(), this.badgeTooltips.forEach((e) => e.remove()), this.badgeTooltips.clear();
|
|
2368
|
+
}
|
|
2369
|
+
// ========================================================================
|
|
2370
|
+
// ACTION BUTTON TOOLTIP METHODS
|
|
2371
|
+
// ========================================================================
|
|
2372
|
+
attachActionButtonTooltips() {
|
|
2373
|
+
const e = this.dropdown.querySelectorAll(".ms__action-btn");
|
|
2374
|
+
f.debug(`[${this.instanceId}] Found ${e.length} action buttons to attach tooltips to`), e.forEach((t) => {
|
|
2375
|
+
var l;
|
|
2376
|
+
const i = t, o = i.dataset.action;
|
|
2377
|
+
if (!o) return;
|
|
2378
|
+
const n = (l = this.options.actionButtons) == null ? void 0 : l.find((c) => c.action === "custom" ? i.dataset.customAction === i.dataset.action : c.action === o);
|
|
2379
|
+
if (!n) return;
|
|
2380
|
+
let r;
|
|
2381
|
+
if (n.getTooltipCallback ? (r = n.getTooltipCallback(this), f.debug(`[${this.instanceId}] Using getTooltipCallback for action button "${o}": "${r}"`)) : (r = n.tooltip, f.debug(`[${this.instanceId}] Using static tooltip for action button "${o}": "${r}"`)), !r) {
|
|
2382
|
+
f.debug(`[${this.instanceId}] No tooltip for action button "${o}"`);
|
|
2383
|
+
return;
|
|
2384
|
+
}
|
|
2385
|
+
const a = `action-${o}-${Date.now()}`;
|
|
2386
|
+
this.createActionButtonTooltip(i, r, a);
|
|
2387
|
+
});
|
|
2388
|
+
}
|
|
2389
|
+
createActionButtonTooltip(e, t, i) {
|
|
2390
|
+
const o = document.createElement("div");
|
|
2391
|
+
o.className = "ms__badge-tooltip", o.textContent = t, (this.options.container || document.body).appendChild(o), f.debug(`[${this.instanceId}] Tooltip element created for action button "${i}"`), this.actionButtonTooltips.set(i, o);
|
|
2392
|
+
let r, a;
|
|
2393
|
+
const l = () => {
|
|
2394
|
+
clearTimeout(a), f.debug(`[${this.instanceId}] Mouse entered action button "${i}", will show tooltip in ${this.options.badgeTooltipDelay || 300}ms`), r = window.setTimeout(() => {
|
|
2395
|
+
f.debug(`[${this.instanceId}] Showing tooltip for action button "${i}"`), o.classList.add("ms__badge-tooltip--visible"), this.positionActionButtonTooltip(e, o, i);
|
|
2396
|
+
}, this.options.badgeTooltipDelay || 300);
|
|
2397
|
+
}, c = () => {
|
|
2398
|
+
clearTimeout(r), a = window.setTimeout(() => {
|
|
2399
|
+
o.classList.remove("ms__badge-tooltip--visible"), this.cleanupActionButtonTooltip(i);
|
|
2400
|
+
}, 100);
|
|
2401
|
+
};
|
|
2402
|
+
e.addEventListener("mouseenter", l), e.addEventListener("mouseleave", c);
|
|
2403
|
+
}
|
|
2404
|
+
positionActionButtonTooltip(e, t, i) {
|
|
2405
|
+
const o = q(e, t, () => {
|
|
2406
|
+
ee(e, t, {
|
|
2407
|
+
placement: this.options.badgeTooltipPlacement || "top",
|
|
2408
|
+
strategy: "fixed",
|
|
2409
|
+
middleware: [
|
|
2410
|
+
Z(this.options.badgeTooltipOffset || 8),
|
|
2411
|
+
ae(),
|
|
2412
|
+
Q({ padding: 8 })
|
|
2413
|
+
]
|
|
2414
|
+
}).then(({ x: n, y: r }) => {
|
|
2415
|
+
Object.assign(t.style, {
|
|
2416
|
+
left: `${n}px`,
|
|
2417
|
+
top: `${r}px`
|
|
2418
|
+
}), f.debug(`[${this.instanceId}] Positioned action button tooltip "${i}" at x:${n}, y:${r}`);
|
|
2419
|
+
});
|
|
2420
|
+
});
|
|
2421
|
+
this.actionButtonTooltipCleanups.set(i, o);
|
|
2422
|
+
}
|
|
2423
|
+
cleanupActionButtonTooltip(e) {
|
|
2424
|
+
const t = this.actionButtonTooltipCleanups.get(e);
|
|
2425
|
+
t && (t(), this.actionButtonTooltipCleanups.delete(e));
|
|
2426
|
+
}
|
|
2427
|
+
destroyAllActionButtonTooltips() {
|
|
2428
|
+
this.actionButtonTooltipCleanups.forEach((e) => e()), this.actionButtonTooltipCleanups.clear(), this.actionButtonTooltips.forEach((e) => e.remove()), this.actionButtonTooltips.clear();
|
|
2306
2429
|
}
|
|
2307
2430
|
// ========================================================================
|
|
2308
2431
|
// PUBLIC API
|
|
2309
2432
|
// ========================================================================
|
|
2310
2433
|
destroy() {
|
|
2311
|
-
this.
|
|
2434
|
+
this.destroyAllBadgeTooltips(), this.destroyAllActionButtonTooltips(), this.dropdownCleanup && this.dropdownCleanup(), this.hintCleanup && this.hintCleanup(), this.selectedPopoverCleanup && this.selectedPopoverCleanup(), this.virtualScroll && (this.virtualScroll.destroy(), this.virtualScroll = null), this.dropdown && this.dropdown.remove(), this.hint && this.hint.remove(), this.selectedPopover && this.selectedPopover.remove(), this.element.innerHTML = "", this.element.classList.remove("ml", "ms--open", "ms--no-checkboxes"), le.info(`[${this.instanceId}] Component destroyed`);
|
|
2312
2435
|
}
|
|
2313
2436
|
}
|
|
2314
|
-
const pi = '@charset "UTF-8";:host{--ml-accent-color: #3b82f6;--ml-accent-color-hover: #2563eb;--ml-accent-color-active: #1d4ed8;--ml-text-primary: #111827;--ml-text-secondary: #6b7280;--ml-text-white: #ffffff;--ml-primary-bg: #f3f4f6;--ml-primary-bg-hover: #e5e7eb;--ml-border-color: #e5e7eb;--ml-input-padding: .5rem .75rem;--ml-input-padding-right: 2.5rem;--ml-input-font-size: .875rem;--ml-input-border-style: 1px solid #d1d5db;--ml-input-border-radius: .375rem;--ml-input-bg: #ffffff;--ml-input-text: #111827;--ml-input-focus-border-color: #3b82f6;--ml-input-placeholder-color: #6b7280;--ml-input-bg-disabled: rgba(107, 114, 128, .05);--ml-toggle-right: .75rem;--ml-toggle-color: #6b7280;--ml-transform-center-y: translateY(-50%);--ml-transform-rotate-180: 180deg;--ml-count-badge-offset: 2rem;--ml-count-badge-padding: .125rem .25rem;--ml-count-badge-bg: #3b82f6;--ml-count-badge-color: #ffffff;--ml-count-badge-font-size: .75rem;--ml-count-badge-font-weight: 600;--ml-count-badge-border-radius: .25rem;--ml-count-badge-bg-hover: #2563eb;--ml-transform-scale-hover: 1.1;--ml-hint-padding: .5rem .75rem;--ml-hint-bg: #ffffff;--ml-hint-border: 1px solid #e5e7eb;--ml-hint-border-radius: .375rem;--ml-hint-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--ml-hint-font-size: .75rem;--ml-hint-color: #6b7280;--ml-line-height-relaxed: 1.4;--ml-dropdown-bg: #ffffff;--ml-dropdown-border: 1px solid #e5e7eb;--ml-dropdown-border-radius: .375rem;--ml-dropdown-box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--ml-dropdown-max-height: 20rem;--ml-dropdown-color: #111827;--ml-z-index-dropdown: 9999;--ml-z-index-sticky: 1;--ml-actions-gap: .25rem;--ml-actions-padding: .5rem;--ml-actions-border-bottom: 1px solid #e5e7eb;--ml-actions-bg: #ffffff;--ml-action-btn-padding: .25rem .5rem;--ml-action-btn-font-size: .75rem;--ml-action-btn-border: 1px solid #e5e7eb;--ml-action-btn-border-radius: .25rem;--ml-action-btn-bg: transparent;--ml-action-btn-color: inherit;--ml-action-btn-bg-hover: #f3f4f6;--ml-action-btn-border-color-hover: #3b82f6;--ml-transform-scale-active: .98;--ml-options-padding: .25rem 0;--ml-group-border-top: 1px solid #e5e7eb;--ml-group-margin-top: .25rem;--ml-group-padding-top: .25rem;--ml-group-label-padding: .25rem .75rem;--ml-group-label-font-size: .75rem;--ml-group-label-font-weight: 600;--ml-group-label-color: #6b7280;--ml-group-label-transform: uppercase;--ml-group-label-letter-spacing: .05em;--ml-option-gap: .5rem;--ml-option-padding: .5rem .75rem;--ml-option-padding-h: .75rem;--ml-option-bg: transparent;--ml-option-bg-hover: #f9fafb;--ml-option-bg-focused: #f9fafb;--ml-option-outline-focused: 2px solid #3b82f6;--ml-option-focus-outline-offset: -2px;--ml-option-bg-matched: rgba(59, 130, 246, .08);--ml-option-border-matched: 3px solid rgba(59, 130, 246, .4);--ml-option-bg-selected: rgba(59, 130, 246, .1);--ml-disabled-opacity: .5;--ml-option-content-gap: .5rem;--ml-option-icon-size: 1.25rem;--ml-option-icon-font-size: 1rem;--ml-option-title-font-size: .875rem;--ml-option-title-color: inherit;--ml-option-mark-bg: rgba(59, 130, 246, .2);--ml-option-mark-color: inherit;--ml-option-mark-font-weight: 600;--ml-option-subtitle-margin-top: .25rem;--ml-option-subtitle-font-size: .75rem;--ml-option-subtitle-color: #6b7280;--ml-option-subtitle-line-height: 1.3;--ml-checkbox-margin-top: .125rem;--ml-empty-padding: 1rem .75rem;--ml-empty-font-size: .875rem;--ml-empty-color: #6b7280;--ml-loader-padding: 1rem;--ml-loader-gap: .5rem;--ml-loading-text-font-size: .875rem;--ml-loading-text-color: #6b7280;--ml-pills-gap: .5rem;--ml-pills-margin-bottom: .5rem;--ml-pills-margin-top: .5rem;--ml-pills-margin-left: .25rem;--ml-pills-margin-right: .25rem;--ml-pill-gap: .5rem;--ml-pill-height: 1.5rem;--ml-pill-font-size: .75rem;--ml-pill-font-weight: 600;--ml-pill-border-radius: .375rem;--ml-pill-bg: #eff6ff;--ml-pill-bg-hover: #ffffff;--ml-pill-bg-active: #e0f2fe;--ml-order-first: -1;--ml-pill-text-padding: 0 .5rem;--ml-pill-text-bg: #eff6ff;--ml-pill-text-color: #3b82f6;--ml-pill-remove-width: 1.5rem;--ml-pill-remove-bg: #3b82f6;--ml-pill-remove-color: #ffffff;--ml-pill-remove-border: none;--ml-pill-remove-font-size: .75rem;--ml-pill-remove-bg-hover: #2563eb;--ml-pill-remove-box-shadow-focus: 0 0 0 2px rgba(59, 130, 246, .5);--ml-icon-remove: "×";--ml-pill-indicator-bg: transparent;--ml-pill-indicator-border: 1px solid #e5e7eb;--ml-pill-indicator-border-radius: .25rem;--ml-pill-indicator-text-color: #6b7280;--ml-pill-indicator-text-bg: #d1d5db;--ml-pill-indicator-remove-bg: #6b7280;--ml-pill-indicator-remove-color: #ffffff;--ml-pill-indicator-remove-bg-hover: #111827;--ml-more-badge-bg: #eff6ff;--ml-more-badge-hover-bg: #ffffff;--ml-more-badge-active-bg: #e0f2fe;--ml-count-display-margin-bottom: .5rem;--ml-count-display-margin-top: .5rem;--ml-count-display-margin-left: .5rem;--ml-count-display-margin-right: .5rem;--ml-count-badge-wrapper-bg: transparent;--ml-count-badge-wrapper-border: 1px solid #e5e7eb;--ml-count-badge-wrapper-border-radius: .25rem;--ml-count-badge-wrapper-padding: .25rem .5rem;--ml-count-badge-wrapper-gap: .25rem;--ml-count-badge-wrapper-bg-hover: #f9fafb;--ml-count-badge-wrapper-border-color-hover: #3b82f6;--ml-count-text-bg: transparent;--ml-count-text-border: none;--ml-count-text-font-size: .875rem;--ml-count-text-color: #111827;--ml-count-clear-size: 1rem;--ml-count-clear-bg: transparent;--ml-count-clear-color: #6b7280;--ml-count-clear-font-size: 1.125rem;--ml-count-clear-border-radius: 50%;--ml-count-clear-bg-hover: rgba(59, 130, 246, .2);--ml-count-clear-color-hover: #3b82f6;--ml-icon-clear: "×";--ml-tooltip-bg: #333;--ml-tooltip-color: #fff;--ml-tooltip-padding: .5rem .75rem;--ml-tooltip-border-radius: .375rem;--ml-tooltip-font-size: .875rem;--ml-tooltip-max-width: 20rem;--ml-tooltip-shadow: 0 2px 8px rgba(0, 0, 0, .15);--ml-tooltip-z-index: 10000;--ml-z-index-popover: 10000;--ml-selected-popover-width: 20rem;--ml-selected-popover-max-height: 20rem;--ml-selected-popover-bg: #ffffff;--ml-selected-popover-border: 1px solid #e5e7eb;--ml-selected-popover-border-radius: .375rem;--ml-selected-popover-box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--ml-selected-popover-header-padding: .5rem .75rem;--ml-selected-popover-header-bg: rgba(59, 130, 246, .1);--ml-selected-popover-header-border-bottom: 1px solid #e5e7eb;--ml-selected-popover-header-font-size: .875rem;--ml-selected-popover-header-font-weight: 600;--ml-selected-popover-header-color: #111827;--ml-popover-close-size: 1.5rem;--ml-selected-popover-close-bg: transparent;--ml-selected-popover-close-color: #6b7280;--ml-selected-popover-close-font-size: 1.25rem;--ml-selected-popover-close-border-radius: 50%;--ml-selected-popover-close-bg-hover: rgba(59, 130, 246, .2);--ml-selected-popover-close-color-hover: #3b82f6;--ml-selected-popover-body-gap: .25rem;--ml-selected-popover-body-padding: .5rem;--ml-selected-popover-body-max-height: 18rem;--ml-font-size-2xs: .625rem;--ml-font-size-xs: .75rem;--ml-font-size-sm: .875rem;--ml-font-size-base: 1rem;--ml-font-size-lg: 1.125rem;--ml-font-weight-medium: 500;--ml-font-weight-semibold: 600;--ml-line-height-none: 1;--ml-spacing-xs: .25rem;--ml-spacing-sm: .5rem;--ml-spacing-md: .75rem;--ml-spacing-lg: 1rem;--ml-transition-fast: .15s;--ml-transition-normal: .2s;--ml-easing-snappy: cubic-bezier(.4, 0, .2, 1);--ml-placeholder-opacity: .6;--ml-disabled-input-opacity: .6}multi-select:not(:defined){display:block;min-height:2.5rem;color:transparent!important;background:transparent}.ml-wrapper{display:flex;flex-direction:column;align-items:stretch}.ml-wrapper--inline{flex-direction:row;align-items:flex-start}.ml{position:relative;width:100%}.ml__input-wrapper{position:relative;display:flex;align-items:center}.ml__input{width:100%;padding:var(--ml-input-padding, .5rem .75rem);padding-right:var(--ml-input-padding-right, 2.5rem);font-size:var(--ml-input-font-size, .875rem);border:var(--ml-input-border-style, 1px solid #d1d5db);border-radius:var(--ml-input-border-radius, .375rem);background:var(--ml-input-bg, #ffffff);color:var(--ml-input-text, #111827);cursor:pointer;transition:border-color var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ml__input:focus{outline:none;border-color:var(--ml-input-focus-border-color, #3b82f6)}.ml__input::placeholder{color:var(--ml-input-placeholder-color, #6b7280);opacity:0;transition:opacity var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}:host([data-ready]) .ml__input::placeholder{opacity:var(--ml-placeholder-opacity, .6)}.ml__toggle{position:absolute;right:var(--ml-toggle-right, .75rem);top:50%;transform:var(--ml-transform-center-y, translateY(-50%));pointer-events:none;color:var(--ml-toggle-color, #6b7280);transition:transform var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ml--open .ml__toggle{transform:var(--ml-transform-center-y, translateY(-50%)) rotate(var(--ml-transform-rotate-180, 180deg))}.ml__count-badge{position:absolute;right:var(--ml-count-badge-offset, 2rem);top:50%;transform:var(--ml-transform-center-y, translateY(-50%));padding:var(--ml-count-badge-padding, .125rem .25rem);background:var(--ml-count-badge-bg, #3b82f6);color:var(--ml-count-badge-color, #ffffff);font-size:var(--ml-count-badge-font-size, .75rem);font-weight:var(--ml-count-badge-font-weight, 600);border-radius:var(--ml-count-badge-border-radius, .25rem);cursor:pointer;transition:all var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ml__count-badge:hover{background:var(--ml-count-badge-bg-hover, #2563eb);transform:var(--ml-transform-center-y, translateY(-50%)) scale(var(--ml-transform-scale-hover, 1.1))}.ml__hint{display:none;position:absolute;z-index:var(--ml-z-index-popover, 10000);padding:var(--ml-hint-padding, .5rem .75rem);background:var(--ml-hint-bg, #ffffff);border:var(--ml-hint-border, 1px solid #e5e7eb);border-radius:var(--ml-hint-border-radius, .375rem);box-shadow:var(--ml-hint-box-shadow, 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1));font-size:var(--ml-hint-font-size, .75rem);color:var(--ml-hint-color, #6b7280);line-height:var(--ml-line-height-relaxed, 1.4);max-width:100%}.ml__hint--visible{display:block}.ml__dropdown{display:none;position:absolute;z-index:var(--ml-z-index-dropdown, 9999);background:var(--ml-dropdown-bg, #ffffff);border:var(--ml-dropdown-border, 1px solid #e5e7eb);border-radius:var(--ml-dropdown-border-radius, .375rem);box-shadow:var(--ml-dropdown-box-shadow, 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1));max-height:var(--ml-dropdown-max-height, 20rem);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;color:var(--ml-dropdown-color, #111827)}.ml__dropdown--visible{display:block}.ml__dropdown--virtual{overflow-y:visible;max-height:none}.ml__actions{display:flex;gap:var(--ml-actions-gap, .25rem);padding:var(--ml-actions-padding, .5rem);border-bottom:var(--ml-actions-border-bottom, 1px solid #e5e7eb)}.ml__actions--sticky{position:sticky;top:0;z-index:var(--ml-z-index-sticky, 1);background:var(--ml-actions-bg, #ffffff)}.ml__action-btn{flex:1;padding:var(--ml-action-btn-padding, .25rem .5rem);font-size:var(--ml-action-btn-font-size, .75rem);border:var(--ml-action-btn-border, 1px solid #e5e7eb);border-radius:var(--ml-action-btn-border-radius, .25rem);background:var(--ml-action-btn-bg, transparent);color:var(--ml-action-btn-color, inherit);cursor:pointer;transition:all var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ml__action-btn:hover{background:var(--ml-action-btn-bg-hover, #f3f4f6);border-color:var(--ml-action-btn-border-color-hover, #3b82f6)}.ml__action-btn:active{transform:scale(var(--ml-transform-scale-active, .98))}.ml__options{padding:var(--ml-options-padding, .25rem 0)}.ml__options--virtual .ml__option{height:var(--ml-option-height, 50px);min-height:var(--ml-option-height, 50px);max-height:var(--ml-option-height, 50px);overflow:hidden;box-sizing:border-box}.ml__group+.ml__group{border-top:var(--ml-group-border-top, 1px solid #e5e7eb);margin-top:var(--ml-group-margin-top, .25rem);padding-top:var(--ml-group-padding-top, .25rem)}.ml__group-label{padding:var(--ml-group-label-padding, .25rem .75rem);font-size:var(--ml-group-label-font-size, .75rem);font-weight:var(--ml-group-label-font-weight, 600);color:var(--ml-group-label-color, #6b7280);text-transform:var(--ml-group-label-transform, uppercase);letter-spacing:var(--ml-group-label-letter-spacing, .05em)}.ml__option{display:flex;align-items:flex-start;gap:var(--ml-option-gap, .5rem);padding:var(--ml-option-padding, .5rem .75rem);cursor:pointer;transition:background-color var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ml__option:hover{background:var(--ml-option-bg-hover, #f9fafb)}.ml__option--focused{background:var(--ml-option-bg-focused, #f9fafb);outline:var(--ml-option-outline-focused, 2px solid #3b82f6);outline-offset:var(--ml-option-focus-outline-offset, -2px)}.ml__option--matched{background:var(--ml-option-bg-matched, rgba(59, 130, 246, .08));border-left:var(--ml-option-border-matched, 3px solid rgba(59, 130, 246, .4))}.ml__option--selected{background:var(--ml-option-bg-selected, rgba(59, 130, 246, .1))}.ml__option--selected:hover{background:var(--ml-option-bg-selected-hover, var(--ml-option-bg-selected, rgba(59, 130, 246, .1)))}.ml__option--disabled{opacity:var(--ml-disabled-opacity, .5);cursor:not-allowed}.ml__option--disabled:hover{background:var(--ml-option-bg, transparent)}.ml__checkbox{flex-shrink:0;margin-top:var(--ml-checkbox-margin-top, .125rem);cursor:pointer}.ml__option--disabled .ml__checkbox{cursor:not-allowed}.ml__option-content{flex:1;display:flex;align-items:flex-start;gap:var(--ml-option-content-gap, .5rem);min-width:0}.ml__option-icon{flex-shrink:0;width:var(--ml-option-icon-size, 1.25rem);height:var(--ml-option-icon-size, 1.25rem);display:flex;align-items:center;justify-content:center;font-size:var(--ml-option-icon-font-size, 1rem)}.ml__option-icon svg{width:100%;height:100%;fill:currentColor}.ml__option-text{flex:1;min-width:0}.ml__option-title{font-size:var(--ml-option-title-font-size, .875rem);color:var(--ml-option-title-color, inherit);line-height:var(--ml-line-height-relaxed, 1.4)}.ml__option-title mark{background:var(--ml-option-mark-bg, rgba(59, 130, 246, .2));color:var(--ml-option-mark-color, inherit);font-weight:var(--ml-option-mark-font-weight, 600)}.ml__option-subtitle{margin-top:var(--ml-option-subtitle-margin-top, .25rem);font-size:var(--ml-option-subtitle-font-size, .75rem);color:var(--ml-option-subtitle-color, #6b7280);line-height:var(--ml-option-subtitle-line-height, 1.3)}.ml__empty{padding:var(--ml-empty-padding, 1rem .75rem);text-align:center;font-size:var(--ml-empty-font-size, .875rem);color:var(--ml-empty-color, #6b7280)}.ml__loader{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ml-loader-padding, 1rem);gap:var(--ml-loader-gap, .5rem)}.ml__loading-text{font-size:var(--ml-loading-text-font-size, .875rem);color:var(--ml-loading-text-color, #6b7280)}.ml__pills{display:flex;flex-wrap:wrap;gap:var(--ml-pills-gap, .5rem);padding:0}.ml__pills:empty{display:none}.ml__pills--bottom{margin-top:var(--ml-pills-margin-bottom, .5rem)}.ml__pills--top{margin-bottom:var(--ml-pills-margin-top, .5rem);order:var(--ml-order-first, -1)}.ml__pills--left{order:var(--ml-order-first, -1);margin-right:var(--ml-pills-margin-left, .25rem);justify-content:flex-end}.ml__pills--right{margin-left:var(--ml-pills-margin-right, .25rem);justify-content:flex-start}.ml__count-display{display:flex;align-items:center}.ml__count-display:empty{display:none}.ml__count-display--bottom{margin-top:var(--ml-count-display-margin-bottom, .5rem)}.ml__count-display--top{margin-bottom:var(--ml-count-display-margin-top, .5rem);order:var(--ml-order-first, -1)}.ml__count-display--left{order:var(--ml-order-first, -1);margin-right:var(--ml-count-display-margin-left, .5rem);justify-content:flex-start}.ml__count-display--right{margin-left:var(--ml-count-display-margin-right, .5rem);justify-content:flex-end}.ml__count-badge-wrapper{display:inline-flex;align-items:center;gap:var(--ml-count-badge-wrapper-gap, .25rem);background:var(--ml-count-badge-wrapper-bg, transparent);border:var(--ml-count-badge-wrapper-border, 1px solid #e5e7eb);border-radius:var(--ml-count-badge-wrapper-border-radius, .25rem);padding:var(--ml-count-badge-wrapper-padding, .25rem .5rem);transition:all var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ml__count-badge-wrapper:hover{background:var(--ml-count-badge-wrapper-bg-hover, #f9fafb);border-color:var(--ml-count-badge-wrapper-border-color-hover, #3b82f6)}.ml__count-text{display:inline-flex;align-items:center;background:var(--ml-count-text-bg, transparent);border:var(--ml-count-text-border, none);padding:0;font-size:var(--ml-count-text-font-size, .875rem);color:var(--ml-count-text-color, #111827);cursor:pointer;transition:color var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ml__count-clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:var(--ml-count-clear-size, 1rem);height:var(--ml-count-clear-size, 1rem);padding:0;border:none;background:var(--ml-count-clear-bg, transparent);color:var(--ml-count-clear-color, #6b7280);font-size:var(--ml-count-clear-font-size, 1.125rem);line-height:var(--ml-line-height-none, 1);cursor:pointer;border-radius:var(--ml-count-clear-border-radius, 50%);transition:all var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ml__count-clear:hover{background:var(--ml-count-clear-bg-hover, rgba(59, 130, 246, .2));color:var(--ml-count-clear-color-hover, #3b82f6)}.ml__count-clear:before{content:var(--ml-icon-clear, "×")}.ml__pill{display:inline-flex;align-items:center;height:var(--ml-pill-height, 1.5rem);font-size:var(--ml-pill-font-size, .75rem);font-weight:var(--ml-pill-font-weight, 600);line-height:var(--ml-line-height-none, 1);border-radius:var(--ml-pill-border-radius, .375rem);overflow:hidden;max-width:100%}.ml__pill-text{display:flex;align-items:center;height:100%;padding:var(--ml-pill-text-padding, 0 .5rem);background:var(--ml-pill-text-bg, #eff6ff);color:var(--ml-pill-text-color, #3b82f6);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:background-color var(--ml-transition-normal, .2s) ease}.ml__pill-remove{display:flex;align-items:center;justify-content:center;width:var(--ml-pill-remove-width, 1.5rem);height:100%;flex-shrink:0;background:var(--ml-pill-remove-bg, #3b82f6);color:var(--ml-pill-remove-color, #ffffff);border:var(--ml-pill-remove-border, none);cursor:pointer;transition:background-color var(--ml-transition-normal, .2s) ease;font-size:var(--ml-pill-remove-font-size, .75rem)}.ml__pill-remove:hover{background:var(--ml-pill-remove-bg-hover, #2563eb)}.ml__pill-remove:focus{outline:none;box-shadow:var(--ml-pill-remove-box-shadow-focus, 0 0 0 2px rgba(59, 130, 246, .5))}.ml__pill-remove:before{content:var(--ml-icon-remove, "×");font-size:var(--ml-font-size-base, 1rem);line-height:var(--ml-line-height-none, 1)}.ml__pill--indicator{border:var(--ml-pill-indicator-border, 1px solid #e5e7eb)}.ml__pill--indicator .ml__pill-text{background:var(--ml-pill-indicator-text-bg, #d1d5db);color:var(--ml-pill-indicator-text-color, #6b7280)}.ml__pill--indicator .ml__pill-remove{background:var(--ml-pill-indicator-remove-bg, #6b7280);color:var(--ml-pill-indicator-remove-color, #ffffff)}.ml__pill--indicator .ml__pill-remove:hover{background:var(--ml-pill-indicator-remove-bg-hover, #111827)}.ml__pill--more{cursor:pointer}.ml__pill-tooltip{position:fixed;z-index:var(--ml-tooltip-z-index, 10000);opacity:0;visibility:hidden;transition:opacity var(--ml-transition-normal, .2s) ease,visibility var(--ml-transition-normal, .2s) ease;background:var(--ml-tooltip-bg, #333);color:var(--ml-tooltip-color, #fff);padding:var(--ml-tooltip-padding, .5rem .75rem);border-radius:var(--ml-tooltip-border-radius, .375rem);font-size:var(--ml-tooltip-font-size, .875rem);line-height:var(--ml-line-height-relaxed, 1.4);max-width:var(--ml-tooltip-max-width, 20rem);word-wrap:break-word;white-space:pre-wrap;box-shadow:var(--ml-tooltip-shadow, 0 2px 8px rgba(0, 0, 0, .15));pointer-events:none}.ml__pill-tooltip--visible{opacity:1;visibility:visible}.ml__selected-popover{display:none;position:absolute;z-index:var(--ml-z-index-popover, 10000);background:var(--ml-selected-popover-bg, #ffffff);border:var(--ml-selected-popover-border, 1px solid #e5e7eb);border-radius:var(--ml-selected-popover-border-radius, .375rem);box-shadow:var(--ml-selected-popover-box-shadow, 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1));width:var(--ml-selected-popover-width, 20rem);max-height:var(--ml-selected-popover-max-height, 20rem);overflow:hidden}.ml__selected-popover--visible{display:flex;flex-direction:column}.ml__selected-popover--virtual{display:block;overflow:visible;max-height:none}.ml__selected-popover-header{display:flex;align-items:center;justify-content:space-between;padding:var(--ml-selected-popover-header-padding, .5rem .75rem);background:var(--ml-selected-popover-header-bg, rgba(59, 130, 246, .1));border-bottom:var(--ml-selected-popover-header-border-bottom, 1px solid #e5e7eb);font-size:var(--ml-selected-popover-header-font-size, .875rem);font-weight:var(--ml-selected-popover-header-font-weight, 600);color:var(--ml-selected-popover-header-color, #111827)}.ml__selected-popover-close{display:flex;align-items:center;justify-content:center;width:var(--ml-popover-close-size, 1.5rem);height:var(--ml-popover-close-size, 1.5rem);padding:0;border:none;background:var(--ml-selected-popover-close-bg, transparent);color:var(--ml-selected-popover-close-color, #6b7280);font-size:var(--ml-selected-popover-close-font-size, 1.25rem);line-height:var(--ml-line-height-none, 1);cursor:pointer;border-radius:var(--ml-selected-popover-close-border-radius, 50%);transition:all var(--ml-transition-fast, .15s) var(--ml-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ml__selected-popover-close:hover{background:var(--ml-selected-popover-close-bg-hover, rgba(59, 130, 246, .2));color:var(--ml-selected-popover-close-color-hover, #3b82f6)}.ml__selected-popover-body{display:flex;flex-direction:column;gap:var(--ml-selected-popover-body-gap, .25rem);padding:var(--ml-selected-popover-body-padding, .5rem);overflow-y:auto;max-height:var(--ml-selected-popover-body-max-height, 18rem)}.ml__selected-popover-body .ml__pill{width:100%}.ml__selected-popover-body .ml__pill-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.ml__selected-popover-body--virtual{display:block;max-height:none;padding:0}.ml__selected-popover-body--virtual .ml__pill{height:var(--ml-pill-height-virtual, 36px);min-height:var(--ml-pill-height-virtual, 36px);max-height:var(--ml-pill-height-virtual, 36px);margin-bottom:var(--ml-selected-popover-body-gap, .25rem);overflow:hidden;box-sizing:border-box}.ml--rtl .ml__input-wrapper{direction:rtl}.ml--rtl .ml__input{text-align:right;padding-left:var(--ml-input-padding-right, 2.5rem);padding-right:var(--ml-input-padding-h, .75rem)}.ml--rtl .ml__toggle{left:var(--ml-toggle-right, .75rem)!important;right:auto!important}.ml--rtl .ml__count-badge{left:var(--ml-count-badge-offset, 2rem)!important;right:auto!important}.ml--rtl .ml__dropdown{direction:rtl;text-align:right}.ml--rtl .ml__option{flex-direction:row-reverse}.ml--rtl .ml__checkbox{margin-left:var(--ml-spacing-sm, .5rem);margin-right:0}.ml--rtl .ml__option-content{text-align:right}.ml--rtl .ml__option-icon{margin-left:var(--ml-spacing-xs, .25rem);margin-right:0}.ml--rtl .ml__pills{direction:rtl}.ml--rtl .ml__pill{flex-direction:row-reverse}.ml--rtl .ml__pill-remove{border-radius:var(--ml-pill-remove-border-radius-rtl, .375rem) 0 0 var(--ml-pill-remove-border-radius-rtl, .375rem);border-left:var(--ml-pill-remove-border, none);border-right:none}.ml--rtl .ml__pill-text{border-radius:0 var(--ml-pill-text-border-radius-rtl, .375rem) var(--ml-pill-text-border-radius-rtl, .375rem) 0}.ml--rtl .ml__count-display{direction:rtl}.ml--rtl .ml__count-badge-wrapper{flex-direction:row-reverse}.ml--rtl .ml__selected-popover{direction:rtl;text-align:right}.ml--rtl .ml__actions{direction:rtl}.ml--rtl .ml__group-label,.ml--rtl .ml__empty{text-align:right}.ml--rtl .ml__hint{direction:rtl;text-align:right}.ml--xs .ml__input{font-size:var(--ml-font-size-xs, .75rem)}.ml--xs .ml__option{padding:var(--ml-spacing-xs, .25rem) var(--ml-spacing-sm, .5rem)}.ml--xs .ml__option-title{font-size:var(--ml-font-size-xs, .75rem)}.ml--xs .ml__pill{font-size:var(--ml-font-size-2xs, .625rem)}.ml--sm .ml__input,.ml--sm .ml__option-title{font-size:var(--ml-font-size-xs, .75rem)}.ml--lg .ml__input,.ml--lg .ml__option-title{font-size:var(--ml-font-size-base, 1rem)}.ml--lg .ml__pill{font-size:var(--ml-font-size-sm, .875rem)}.ml--xl .ml__input,.ml--xl .ml__option-title{font-size:var(--ml-font-size-lg, 1.125rem)}.ml--xl .ml__pill{font-size:var(--ml-font-size-base, 1rem)}.ml--disabled .ml__input{opacity:var(--ml-disabled-input-opacity, .6);cursor:not-allowed;background:var(--ml-input-bg-disabled, rgba(107, 114, 128, .05))}.ml--disabled .ml__toggle{opacity:var(--ml-disabled-input-opacity, .6)}.ml--no-checkboxes .ml__option{gap:0;padding-left:var(--ml-option-padding-h, .75rem)}.ml--no-checkboxes .ml__option-content{padding-left:0}.ml-debug-info{margin-top:.25rem;padding:.25rem;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:.375rem;font-size:.75rem;color:#111827}.ml-debug-info details summary{cursor:pointer;font-weight:600;color:#2563eb;-webkit-user-select:none;user-select:none;padding:.25rem;border-radius:.25rem}.ml-debug-info details summary:hover{background-color:#f3f4f6}.ml-debug-info details summary:focus{outline:2px solid #3b82f6;outline-offset:2px}.ml-debug-info .ml-debug-stats{display:flex;flex-direction:column;gap:.25rem;margin-top:.25rem;padding:.25rem;background-color:#fff;border-radius:.25rem}.ml-debug-info .ml-debug-stats span{display:flex;justify-content:space-between;padding:2px 4px;font-family:monospace;font-size:.625rem}.ml-debug-info .ml-debug-stats span:before{content:"•";margin-right:.25rem;color:#3b82f6}', hi = typeof HTMLElement < "u" ? HTMLElement : class {
|
|
2315
|
-
},
|
|
2437
|
+
const gs = '@charset "UTF-8";:host{--ms-accent-color: #3b82f6;--ms-accent-color-hover: #2563eb;--ms-accent-color-active: #1d4ed8;--ms-text-primary: #111827;--ms-text-secondary: #6b7280;--ms-text-white: #ffffff;--ms-primary-bg: #f3f4f6;--ms-primary-bg-hover: #e5e7eb;--ms-border-color: #e5e7eb;--ms-input-background: var(--ms-input-bg);--ms-input-color: var(--ms-text-primary);--ms-input-border-color: var(--ms-border-color);--ms-input-border-color-focus: var(--ms-accent-color);--ms-input-placeholder-color: var(--ms-text-secondary);--ms-input-background-disabled: var(--ms-input-bg-disabled);--ms-toggle-icon-color: var(--ms-text-secondary);--ms-toggle-icon-color-open: var(--ms-text-secondary);--ms-counter-badge-background: var(--ms-accent-color);--ms-counter-badge-background-hover: var(--ms-accent-color-hover);--ms-counter-badge-color: var(--ms-text-white);--ms-hint-background: var(--ms-hint-bg);--ms-hint-color: var(--ms-text-secondary);--ms-hint-border-color: var(--ms-border-color);--ms-dropdown-background: var(--ms-dropdown-bg);--ms-dropdown-text-color: var(--ms-text-primary);--ms-dropdown-border-color: var(--ms-border-color);--ms-actions-background: var(--ms-dropdown-bg);--ms-actions-border-color: var(--ms-border-color);--ms-action-button-background: transparent;--ms-action-button-background-hover: var(--ms-primary-bg);--ms-action-button-border-color: var(--ms-border-color);--ms-action-button-border-color-hover: var(--ms-accent-color);--ms-action-button-color: var(--ms-text-primary);--ms-group-border-color: var(--ms-border-color);--ms-group-label-color: var(--ms-text-secondary);--ms-option-text-color: var(--ms-text-primary);--ms-option-background: transparent;--ms-option-background-hover: var(--ms-primary-bg);--ms-option-background-focused: var(--ms-primary-bg);--ms-option-outline-color-focused: var(--ms-accent-color);--ms-option-background-selected: var(--ms-option-bg-selected);--ms-option-background-matched: var(--ms-option-bg-matched);--ms-option-border-matched-color: var(--ms-option-border-matched);--ms-option-title-color: var(--ms-text-primary);--ms-option-subtitle-color: var(--ms-text-secondary);--ms-option-mark-background: var(--ms-option-mark-bg);--ms-empty-color: var(--ms-text-secondary);--ms-loading-color: var(--ms-text-secondary);--ms-badge-background: var(--ms-badge-bg);--ms-badge-background-hover: var(--ms-badge-bg-hover);--ms-badge-background-active: var(--ms-badge-bg-active);--ms-badge-text-background: var(--ms-badge-text-bg);--ms-badge-text-color: var(--ms-accent-color);--ms-badge-remove-background: var(--ms-accent-color);--ms-badge-remove-background-hover: var(--ms-accent-color-hover);--ms-badge-remove-color: var(--ms-text-white);--ms-badge-counter-border-color: var(--ms-border-color);--ms-badge-counter-text-background: var(--ms-badge-counter-text-bg);--ms-badge-counter-text-color: var(--ms-text-secondary);--ms-badge-counter-remove-background: var(--ms-badge-counter-remove-bg);--ms-badge-counter-remove-background-hover: var(--ms-badge-counter-remove-bg-hover);--ms-badge-counter-remove-color: var(--ms-badge-counter-remove-color);--ms-counter-wrapper-background: transparent;--ms-counter-wrapper-background-hover: var(--ms-primary-bg);--ms-counter-wrapper-border-color: var(--ms-border-color);--ms-counter-wrapper-border-color-hover: var(--ms-accent-color);--ms-count-text-color: var(--ms-text-primary);--ms-count-clear-background: transparent;--ms-count-clear-background-hover: var(--ms-accent-color);--ms-count-clear-color: var(--ms-text-secondary);--ms-count-clear-color-hover: var(--ms-accent-color);--ms-tooltip-background: var(--ms-tooltip-bg);--ms-tooltip-text-color: var(--ms-tooltip-color);--ms-selected-popover-background: var(--ms-dropdown-bg);--ms-selected-popover-border-color: var(--ms-border-color);--ms-selected-popover-header-background: var(--ms-selected-popover-header-bg);--ms-selected-popover-header-color: var(--ms-text-primary);--ms-selected-popover-header-border-color: var(--ms-border-color);--ms-selected-popover-close-background: transparent;--ms-selected-popover-close-background-hover: var(--ms-accent-color);--ms-selected-popover-close-color: var(--ms-text-secondary);--ms-selected-popover-close-color-hover: var(--ms-accent-color);--ms-input-padding: .5rem .75rem;--ms-input-padding-right: 2.5rem;--ms-input-font-size: .875rem;--ms-input-border-style: 1px solid #d1d5db;--ms-input-border-radius: .375rem;--ms-input-bg: #ffffff;--ms-input-text: #111827;--ms-input-focus-border-color: #3b82f6;--ms-input-placeholder-color: #6b7280;--ms-input-bg-disabled: rgba(107, 114, 128, .05);--ms-toggle-right: .75rem;--ms-toggle-color: #6b7280;--ms-transform-center-y: translateY(-50%);--ms-transform-rotate-180: 180deg;--ms-counter-offset: 2rem;--ms-counter-padding: .125rem .25rem;--ms-counter-bg: #3b82f6;--ms-counter-color: #ffffff;--ms-counter-font-size: .75rem;--ms-counter-font-weight: 600;--ms-counter-border-radius: .25rem;--ms-counter-bg-hover: #2563eb;--ms-transform-scale-hover: 1.1;--ms-hint-padding: .5rem .75rem;--ms-hint-bg: #ffffff;--ms-hint-border: 1px solid #e5e7eb;--ms-hint-border-radius: .375rem;--ms-hint-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--ms-hint-font-size: .75rem;--ms-hint-color: #6b7280;--ms-line-height-relaxed: 1.4;--ms-dropdown-bg: #ffffff;--ms-dropdown-border: 1px solid #e5e7eb;--ms-dropdown-border-radius: .375rem;--ms-dropdown-box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--ms-options-max-height: 20rem;--ms-option-color: #111827;--ms-z-index-dropdown: 9999;--ms-z-index-sticky: 1;--ms-actions-gap: .25rem;--ms-actions-padding: .5rem;--ms-actions-border-bottom: 1px solid #e5e7eb;--ms-actions-bg: #ffffff;--ms-action-btn-padding: .25rem .5rem;--ms-action-btn-font-size: .75rem;--ms-action-btn-border: 1px solid #e5e7eb;--ms-action-btn-border-radius: .25rem;--ms-action-btn-bg: transparent;--ms-action-btn-color: inherit;--ms-action-btn-bg-hover: #f3f4f6;--ms-action-btn-border-color-hover: #3b82f6;--ms-transform-scale-active: .98;--ms-options-padding: .25rem 0;--ms-group-border-top: 1px solid #e5e7eb;--ms-group-margin-top: .25rem;--ms-group-padding-top: .25rem;--ms-group-label-padding: .25rem .75rem;--ms-group-label-font-size: .75rem;--ms-group-label-font-weight: 600;--ms-group-label-color: #6b7280;--ms-group-label-transform: uppercase;--ms-group-label-letter-spacing: .05em;--ms-option-gap: .5rem;--ms-option-padding: .5rem .75rem;--ms-option-padding-h: .75rem;--ms-option-bg: transparent;--ms-option-bg-hover: #f9fafb;--ms-option-bg-focused: #f9fafb;--ms-option-outline-focused: 2px solid #3b82f6;--ms-option-focus-outline-offset: -2px;--ms-option-bg-matched: rgba(59, 130, 246, .08);--ms-option-border-matched: 3px solid rgba(59, 130, 246, .4);--ms-option-bg-selected: rgba(59, 130, 246, .1);--ms-disabled-opacity: .5;--ms-option-content-gap: .5rem;--ms-option-icon-size: 1.25rem;--ms-option-icon-font-size: 1rem;--ms-option-title-font-size: .875rem;--ms-option-title-color: inherit;--ms-option-mark-bg: rgba(59, 130, 246, .2);--ms-option-mark-color: inherit;--ms-option-mark-font-weight: 600;--ms-option-subtitle-margin-top: .25rem;--ms-option-subtitle-font-size: .75rem;--ms-option-subtitle-color: #6b7280;--ms-option-subtitle-line-height: 1.3;--ms-checkbox-margin-top: .125rem;--ms-checkbox-margin-right: 0;--ms-checkbox-margin-bottom: 0;--ms-checkbox-margin-left: 0;--ms-checkbox-size: 16px;--ms-checkbox-scale: 1;--ms-checkbox-align: flex-start;--ms-empty-padding: 1rem .75rem;--ms-empty-font-size: .875rem;--ms-empty-color: #6b7280;--ms-loader-padding: 1rem;--ms-loader-gap: .5rem;--ms-loading-text-font-size: .875rem;--ms-loading-text-color: #6b7280;--ms-badges-gap: .5rem;--ms-badges-margin-bottom: .5rem;--ms-badges-margin-top: .5rem;--ms-badges-margin-left: .25rem;--ms-badges-margin-right: .25rem;--ms-badge-gap: .5rem;--ms-badge-height: 1.7rem;--ms-badge-font-size: .75rem;--ms-badge-font-weight: 600;--ms-badge-border-radius: .375rem;--ms-badge-bg: #eff6ff;--ms-badge-bg-hover: #ffffff;--ms-badge-bg-active: #e0f2fe;--ms-order-first: -1;--ms-badge-text-padding: 0 .5rem;--ms-badge-text-bg: #eff6ff;--ms-badge-text-color: #3b82f6;--ms-badge-remove-width: 1.7rem;--ms-badge-remove-bg: #3b82f6;--ms-badge-remove-color: #ffffff;--ms-badge-remove-border: none;--ms-badge-remove-font-size: .75rem;--ms-badge-remove-bg-hover: #2563eb;--ms-badge-remove-box-shadow-focus: 0 0 0 2px rgba(59, 130, 246, .5);--ms-icon-remove: "×";--ms-badge-counter-bg: transparent;--ms-badge-counter-border: 1px solid #e5e7eb;--ms-badge-counter-border-radius: .25rem;--ms-badge-counter-text-color: #6b7280;--ms-badge-counter-text-bg: #d1d5db;--ms-badge-counter-remove-bg: #6b7280;--ms-badge-counter-remove-color: #ffffff;--ms-badge-counter-remove-bg-hover: #111827;--ms-more-badge-bg: #eff6ff;--ms-more-badge-hover-bg: #ffffff;--ms-more-badge-active-bg: #e0f2fe;--ms-count-display-margin-bottom: .5rem;--ms-count-display-margin-top: .5rem;--ms-count-display-margin-left: .5rem;--ms-count-display-margin-right: .5rem;--ms-counter-wrapper-bg: transparent;--ms-counter-wrapper-border: 1px solid #e5e7eb;--ms-counter-wrapper-border-radius: .25rem;--ms-counter-wrapper-padding: .25rem .5rem;--ms-counter-wrapper-gap: .25rem;--ms-counter-wrapper-bg-hover: #f9fafb;--ms-counter-wrapper-border-color-hover: #3b82f6;--ms-count-text-bg: transparent;--ms-count-text-border: none;--ms-count-text-font-size: .875rem;--ms-count-text-color: #111827;--ms-count-clear-size: 1rem;--ms-count-clear-bg: transparent;--ms-count-clear-color: #6b7280;--ms-count-clear-font-size: 1.125rem;--ms-count-clear-border-radius: 50%;--ms-count-clear-bg-hover: rgba(59, 130, 246, .2);--ms-count-clear-color-hover: #3b82f6;--ms-icon-clear: "×";--ms-tooltip-bg: #333;--ms-tooltip-color: #fff;--ms-tooltip-padding: .5rem .75rem;--ms-tooltip-border-radius: .375rem;--ms-tooltip-font-size: .875rem;--ms-tooltip-max-width: 20rem;--ms-tooltip-shadow: 0 2px 8px rgba(0, 0, 0, .15);--ms-tooltip-z-index: 10000;--ms-z-index-popover: 10000;--ms-selected-popover-width: 20rem;--ms-selected-popover-max-height: 20rem;--ms-selected-popover-bg: #ffffff;--ms-selected-popover-border: 1px solid #e5e7eb;--ms-selected-popover-border-radius: .375rem;--ms-selected-popover-box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--ms-selected-popover-header-padding: .5rem .75rem;--ms-selected-popover-header-bg: rgba(59, 130, 246, .1);--ms-selected-popover-header-border-bottom: 1px solid #e5e7eb;--ms-selected-popover-header-font-size: .875rem;--ms-selected-popover-header-font-weight: 600;--ms-selected-popover-header-color: #111827;--ms-popover-close-size: 1.5rem;--ms-selected-popover-close-bg: transparent;--ms-selected-popover-close-color: #6b7280;--ms-selected-popover-close-font-size: 1.25rem;--ms-selected-popover-close-border-radius: 50%;--ms-selected-popover-close-bg-hover: rgba(59, 130, 246, .2);--ms-selected-popover-close-color-hover: #3b82f6;--ms-selected-popover-body-gap: .25rem;--ms-selected-popover-body-padding: .5rem;--ms-selected-popover-body-max-height: 18rem;--ms-font-size-2xs: .625rem;--ms-font-size-xs: .75rem;--ms-font-size-sm: .875rem;--ms-font-size-base: 1rem;--ms-font-size-lg: 1.125rem;--ms-font-weight-medium: 500;--ms-font-weight-semibold: 600;--ms-line-height-none: 1;--ms-spacing-xs: .25rem;--ms-spacing-sm: .5rem;--ms-spacing-md: .75rem;--ms-spacing-lg: 1rem;--ms-transition-fast: .15s;--ms-transition-normal: .2s;--ms-easing-snappy: cubic-bezier(.4, 0, .2, 1);--ms-placeholder-opacity: .6;--ms-disabled-input-opacity: .6}multi-select:not(:defined){display:block;min-height:2.5rem;color:transparent!important;background:transparent}.ml-wrapper{display:flex;flex-direction:column;align-items:stretch}.ml-wrapper--inline{flex-direction:row;align-items:flex-start}.ml{position:relative;width:100%}.ms__input-wrapper{position:relative;display:flex;align-items:center}.ms__input{width:100%;padding:var(--ms-input-padding, .5rem .75rem);padding-right:var(--ms-input-padding-right, 2.5rem);font-size:var(--ms-input-font-size, .875rem);border:var(--ms-input-border-style, 1px solid #d1d5db);border-radius:var(--ms-input-border-radius, .375rem);background:var(--ms-input-background, #ffffff);color:var(--ms-input-color, #111827);cursor:pointer;transition:border-color var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ms__input:focus{outline:none;border-color:var(--ms-input-border-color-focus, #3b82f6)}.ms__input::placeholder{color:var(--ms-input-placeholder-color, #6b7280);opacity:0;transition:opacity var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}:host([data-ready]) .ms__input::placeholder{opacity:var(--ms-placeholder-opacity, .6)}.ms__toggle{position:absolute;right:var(--ms-toggle-right, .75rem);top:50%;transform:var(--ms-transform-center-y, translateY(-50%));pointer-events:none;color:var(--ms-toggle-icon-color, #6b7280);transition:transform var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ms--open .ms__toggle{transform:var(--ms-transform-center-y, translateY(-50%)) rotate(var(--ms-transform-rotate-180, 180deg));color:var(--ms-toggle-icon-color-open, #6b7280)}.ms__counter{position:absolute;right:var(--ms-counter-offset, 2rem);top:50%;transform:var(--ms-transform-center-y, translateY(-50%));padding:var(--ms-counter-padding, .125rem .25rem);background:var(--ms-counter-badge-background, #3b82f6);color:var(--ms-counter-badge-color, #ffffff);font-size:var(--ms-counter-font-size, .75rem);font-weight:var(--ms-counter-font-weight, 600);border-radius:var(--ms-counter-border-radius, .25rem);cursor:pointer;transition:all var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ms__counter:hover{background:var(--ms-counter-badge-background-hover, #2563eb);transform:var(--ms-transform-center-y, translateY(-50%)) scale(var(--ms-transform-scale-hover, 1.1))}.ms__hint{display:none;position:absolute;z-index:var(--ms-z-index-popover, 10000);padding:var(--ms-hint-padding, .5rem .75rem);background:var(--ms-hint-background, #ffffff);border:var(--ms-hint-border, 1px solid #e5e7eb);border-radius:var(--ms-hint-border-radius, .375rem);box-shadow:var(--ms-hint-box-shadow, 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1));font-size:var(--ms-hint-font-size, .75rem);color:var(--ms-hint-color, #6b7280);line-height:var(--ms-line-height-relaxed, 1.4);max-width:100%}.ms__hint--visible{display:block}.ms__dropdown{display:none;position:absolute;z-index:var(--ms-z-index-dropdown, 9999);background:var(--ms-dropdown-background, #ffffff);border:var(--ms-dropdown-border, 1px solid #e5e7eb);border-radius:var(--ms-dropdown-border-radius, .375rem);box-shadow:var(--ms-dropdown-box-shadow, 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1));max-height:var(--ms-options-max-height, 20rem);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;color:var(--ms-dropdown-text-color, #111827)}.ms__dropdown--visible{display:block}.ms__dropdown--virtual{overflow-y:visible;max-height:none}.ms__actions{display:flex;flex-wrap:nowrap;gap:var(--ms-actions-gap, .25rem);padding:var(--ms-actions-padding, .5rem);border-bottom:var(--ms-actions-border-bottom, 1px solid #e5e7eb)}.ms__actions--wrap{flex-wrap:wrap}.ms__actions--sticky{position:sticky;top:0;z-index:var(--ms-z-index-sticky, 1);background:var(--ms-actions-background, #ffffff)}.ms__action-btn{flex:1;padding:var(--ms-action-btn-padding, .25rem .5rem);font-size:var(--ms-action-btn-font-size, .75rem);border:var(--ms-action-btn-border, 1px solid #e5e7eb);border-radius:var(--ms-action-btn-border-radius, .25rem);background:var(--ms-action-button-background, transparent);color:var(--ms-action-button-color, inherit);cursor:pointer;transition:all var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ms__action-btn:hover{background:var(--ms-action-button-background-hover, #f3f4f6);border-color:var(--ms-action-button-border-color-hover, #3b82f6)}.ms__action-btn:active{transform:scale(var(--ms-transform-scale-active, .98))}.ms__action-btn:disabled,.ms__action-btn[disabled]{opacity:var(--ms-disabled-opacity, .5);cursor:not-allowed;pointer-events:none}.ms__options{padding:var(--ms-options-padding, .25rem 0)}.ms__options--virtual .ms__option{height:var(--ms-option-height, 50px);min-height:var(--ms-option-height, 50px);max-height:var(--ms-option-height, 50px);overflow:hidden;box-sizing:border-box}.ms__group+.ms__group{border-top:var(--ms-group-border-top, 1px solid #e5e7eb);margin-top:var(--ms-group-margin-top, .25rem);padding-top:var(--ms-group-padding-top, .25rem)}.ms__group-label{padding:var(--ms-group-label-padding, .25rem .75rem);font-size:var(--ms-group-label-font-size, .75rem);font-weight:var(--ms-group-label-font-weight, 600);color:var(--ms-group-label-color, #6b7280);text-transform:var(--ms-group-label-transform, uppercase);letter-spacing:var(--ms-group-label-letter-spacing, .05em)}.ms__option{display:flex;align-items:var(--ms-checkbox-align, flex-start);gap:var(--ms-option-gap, .5rem);padding:var(--ms-option-padding, .5rem .75rem);color:var(--ms-option-text-color, #111827);background:var(--ms-option-background, transparent);cursor:pointer;transition:background-color var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ms__option:hover{background:var(--ms-option-background-hover, #f9fafb)}.ms__option--focused{background:var(--ms-option-background-focused, #f9fafb);outline:var(--ms-option-outline-focused, 2px solid #3b82f6);outline-offset:var(--ms-option-focus-outline-offset, -2px)}.ms__option--matched{background:var(--ms-option-background-matched, rgba(59, 130, 246, .08));border-left:var(--ms-option-border-matched, 3px solid rgba(59, 130, 246, .4))}.ms__option--selected{background:var(--ms-option-background-selected, rgba(59, 130, 246, .1))}.ms__option--selected:hover{background:var(--ms-option-bg-selected-hover, var(--ms-option-background-selected, rgba(59, 130, 246, .1)))}.ms__option--disabled{opacity:var(--ms-disabled-opacity, .5);cursor:not-allowed}.ms__option--disabled:hover{background:var(--ms-option-background, transparent)}.ms__option[data-checkbox-align=center]{--ms-checkbox-align: center}.ms__option[data-checkbox-align=bottom]{--ms-checkbox-align: flex-end}.ms__checkbox{flex-shrink:0;margin-top:var(--ms-checkbox-margin-top, .125rem);margin-right:var(--ms-checkbox-margin-right, 0);margin-bottom:var(--ms-checkbox-margin-bottom, 0);margin-left:var(--ms-checkbox-margin-left, 0);width:var(--ms-checkbox-size, 16px);height:var(--ms-checkbox-size, 16px);transform:scale(var(--ms-checkbox-scale, 1));transform-origin:top left;cursor:pointer}.ms__option--disabled .ms__checkbox{cursor:not-allowed}.ms__option-content{flex:1;display:flex;align-items:flex-start;gap:var(--ms-option-content-gap, .5rem);min-width:0}.ms__option-icon{flex-shrink:0;width:var(--ms-option-icon-size, 1.25rem);height:var(--ms-option-icon-size, 1.25rem);display:flex;align-items:center;justify-content:center;font-size:var(--ms-option-icon-font-size, 1rem)}.ms__option-icon svg{width:100%;height:100%;fill:currentColor}.ms__option-text{flex:1;min-width:0}.ms__option-title{font-size:var(--ms-option-title-font-size, .875rem);color:var(--ms-option-title-color, inherit);line-height:var(--ms-line-height-relaxed, 1.4)}.ms__option-title mark{background:var(--ms-option-mark-background, rgba(59, 130, 246, .2));color:var(--ms-option-mark-color, inherit);font-weight:var(--ms-option-mark-font-weight, 600)}.ms__option-subtitle{margin-top:var(--ms-option-subtitle-margin-top, .25rem);font-size:var(--ms-option-subtitle-font-size, .75rem);color:var(--ms-option-subtitle-color, #6b7280);line-height:var(--ms-option-subtitle-line-height, 1.3)}.ms__empty{padding:var(--ms-empty-padding, 1rem .75rem);text-align:center;font-size:var(--ms-empty-font-size, .875rem);color:var(--ms-empty-color, #6b7280)}.ms__loader{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ms-loader-padding, 1rem);gap:var(--ms-loader-gap, .5rem)}.ms__loading-text{font-size:var(--ms-loading-text-font-size, .875rem);color:var(--ms-loading-color, #6b7280)}.ms__badges{display:flex;flex-wrap:wrap;gap:var(--ms-badges-gap, .5rem);padding:0}.ms__badges:empty{display:none}.ms__badges--bottom{margin-top:var(--ms-badges-margin-bottom, .5rem)}.ms__badges--top{margin-bottom:var(--ms-badges-margin-top, .5rem);order:var(--ms-order-first, -1)}.ms__badges--left{order:var(--ms-order-first, -1);margin-right:var(--ms-badges-margin-left, .25rem);justify-content:flex-end}.ms__badges--right{margin-left:var(--ms-badges-margin-right, .25rem);justify-content:flex-start}.ms__count-display{display:flex;align-items:center}.ms__count-display:empty{display:none}.ms__count-display--bottom{margin-top:var(--ms-count-display-margin-bottom, .5rem)}.ms__count-display--top{margin-bottom:var(--ms-count-display-margin-top, .5rem);order:var(--ms-order-first, -1)}.ms__count-display--left{order:var(--ms-order-first, -1);margin-right:var(--ms-count-display-margin-left, .5rem);justify-content:flex-start}.ms__count-display--right{margin-left:var(--ms-count-display-margin-right, .5rem);justify-content:flex-end}.ms__counter-wrapper{display:inline-flex;align-items:center;gap:var(--ms-counter-wrapper-gap, .25rem);background:var(--ms-counter-wrapper-background, transparent);border:var(--ms-counter-wrapper-border, 1px solid #e5e7eb);border-radius:var(--ms-counter-wrapper-border-radius, .25rem);padding:var(--ms-counter-wrapper-padding, .25rem .5rem);transition:all var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ms__counter-wrapper:hover{background:var(--ms-counter-wrapper-background-hover, #f9fafb);border-color:var(--ms-counter-wrapper-border-color-hover, #3b82f6)}.ms__count-text{display:inline-flex;align-items:center;background:var(--ms-count-text-bg, transparent);border:var(--ms-count-text-border, none);padding:0;font-size:var(--ms-count-text-font-size, .875rem);color:var(--ms-count-text-color, #111827);cursor:pointer;transition:color var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ms__count-clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:var(--ms-count-clear-size, 1rem);height:var(--ms-count-clear-size, 1rem);padding:0;border:none;background:var(--ms-count-clear-background, transparent);color:var(--ms-count-clear-color, #6b7280);font-size:var(--ms-count-clear-font-size, 1.125rem);line-height:var(--ms-line-height-none, 1);cursor:pointer;border-radius:var(--ms-count-clear-border-radius, 50%);transition:all var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ms__count-clear:hover{background:var(--ms-count-clear-background-hover, rgba(59, 130, 246, .2));color:var(--ms-count-clear-color-hover, #3b82f6)}.ms__count-clear:before{content:var(--ms-icon-clear, "×")}.ms__badge{display:inline-flex;align-items:center;height:var(--ms-badge-height, 1.7rem);font-size:var(--ms-badge-font-size, .75rem);font-weight:var(--ms-badge-font-weight, 600);line-height:var(--ms-line-height-none, 1);border-radius:var(--ms-badge-border-radius, .375rem);overflow:hidden;max-width:100%}.ms__badge-text{display:flex;align-items:center;height:100%;padding:var(--ms-badge-text-padding, 0 .5rem);background:var(--ms-badge-text-background, #eff6ff);color:var(--ms-badge-text-color, #3b82f6);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:background-color var(--ms-transition-normal, .2s) ease}.ms__badge-remove{display:flex;align-items:center;justify-content:center;width:var(--ms-badge-remove-width, 1.7rem);height:100%;flex-shrink:0;background:var(--ms-badge-remove-background, #3b82f6);color:var(--ms-badge-remove-color, #ffffff);border:var(--ms-badge-remove-border, none);cursor:pointer;transition:background-color var(--ms-transition-normal, .2s) ease;font-size:var(--ms-badge-remove-font-size, .75rem)}.ms__badge-remove:hover{background:var(--ms-badge-remove-background-hover, #2563eb)}.ms__badge-remove:focus{outline:none;box-shadow:var(--ms-badge-remove-box-shadow-focus, 0 0 0 2px rgba(59, 130, 246, .5))}.ms__badge-remove:before{content:var(--ms-icon-remove, "×");font-size:var(--ms-font-size-base, 1rem);line-height:var(--ms-line-height-none, 1)}.ms__badge--counter{border:var(--ms-badge-counter-border, 1px solid #e5e7eb);cursor:pointer}.ms__badge--counter .ms__badge-text{background:var(--ms-badge-counter-text-background, #d1d5db);color:var(--ms-badge-counter-text-color, #6b7280)}.ms__badge--counter .ms__badge-remove{background:var(--ms-badge-counter-remove-background, #6b7280);color:var(--ms-badge-counter-remove-color, #ffffff)}.ms__badge--counter .ms__badge-remove:hover{background:var(--ms-badge-counter-remove-background-hover, #111827)}.ms__badge--more{cursor:pointer}.ms__badge-tooltip{position:fixed;z-index:var(--ms-tooltip-z-index, 10000);opacity:0;visibility:hidden;transition:opacity var(--ms-transition-normal, .2s) ease,visibility var(--ms-transition-normal, .2s) ease;background:var(--ms-tooltip-background, #333);color:var(--ms-tooltip-text-color, #fff);padding:var(--ms-tooltip-padding, .5rem .75rem);border-radius:var(--ms-tooltip-border-radius, .375rem);font-size:var(--ms-tooltip-font-size, .875rem);line-height:var(--ms-line-height-relaxed, 1.4);max-width:var(--ms-tooltip-max-width, 20rem);word-wrap:break-word;white-space:pre-wrap;box-shadow:var(--ms-tooltip-shadow, 0 2px 8px rgba(0, 0, 0, .15));pointer-events:none}.ms__badge-tooltip--visible{opacity:1;visibility:visible}.ms__selected-popover{display:none;position:absolute;z-index:var(--ms-z-index-popover, 10000);background:var(--ms-selected-popover-background, #ffffff);border:var(--ms-selected-popover-border, 1px solid #e5e7eb);border-radius:var(--ms-selected-popover-border-radius, .375rem);box-shadow:var(--ms-selected-popover-box-shadow, 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1));width:var(--ms-selected-popover-width, 20rem);max-height:var(--ms-selected-popover-max-height, 20rem);overflow:hidden}.ms__selected-popover--visible{display:flex;flex-direction:column}.ms__selected-popover--virtual{display:block;overflow:visible;max-height:none}.ms__selected-popover-header{display:flex;align-items:center;justify-content:space-between;padding:var(--ms-selected-popover-header-padding, .5rem .75rem);background:var(--ms-selected-popover-header-background, rgba(59, 130, 246, .1));border-bottom:var(--ms-selected-popover-header-border-bottom, 1px solid #e5e7eb);font-size:var(--ms-selected-popover-header-font-size, .875rem);font-weight:var(--ms-selected-popover-header-font-weight, 600);color:var(--ms-selected-popover-header-color, #111827)}.ms__selected-popover-close{display:flex;align-items:center;justify-content:center;width:var(--ms-popover-close-size, 1.5rem);height:var(--ms-popover-close-size, 1.5rem);padding:0;border:none;background:var(--ms-selected-popover-close-background, transparent);color:var(--ms-selected-popover-close-color, #6b7280);font-size:var(--ms-selected-popover-close-font-size, 1.25rem);line-height:var(--ms-line-height-none, 1);cursor:pointer;border-radius:var(--ms-selected-popover-close-border-radius, 50%);transition:all var(--ms-transition-fast, .15s) var(--ms-easing-snappy, cubic-bezier(.4, 0, .2, 1))}.ms__selected-popover-close:hover{background:var(--ms-selected-popover-close-background-hover, rgba(59, 130, 246, .2));color:var(--ms-selected-popover-close-color-hover, #3b82f6)}.ms__selected-popover-body{display:flex;flex-direction:column;gap:var(--ms-selected-popover-body-gap, .25rem);padding:var(--ms-selected-popover-body-padding, .5rem);overflow-y:auto;max-height:var(--ms-selected-popover-body-max-height, 18rem)}.ms__selected-popover-body .ms__badge{width:100%;min-height:fit-content;line-height:var(--ms-line-height-relaxed, 1.4)}.ms__selected-popover-body .ms__badge-text{flex:1;min-width:0;white-space:normal;word-wrap:break-word}.ms__selected-popover-body--virtual{display:block;max-height:none;padding:0}.ms__selected-popover-body--virtual .ms__badge{height:var(--ms-badge-height-virtual, 36px);min-height:var(--ms-badge-height-virtual, 36px);max-height:var(--ms-badge-height-virtual, 36px);margin-bottom:var(--ms-selected-popover-body-gap, .25rem);overflow:hidden;box-sizing:border-box}.ms__selected-popover-body--virtual .ms__badge-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ms--rtl .ms__input-wrapper{direction:rtl}.ms--rtl .ms__input{text-align:right;padding-left:var(--ms-input-padding-right, 2.5rem);padding-right:var(--ms-input-padding-h, .75rem)}.ms--rtl .ms__toggle{left:var(--ms-toggle-right, .75rem)!important;right:auto!important}.ms--rtl .ms__counter{left:var(--ms-counter-offset, 2rem)!important;right:auto!important}.ms--rtl .ms__dropdown{direction:rtl;text-align:right}.ms--rtl .ms__option{flex-direction:row-reverse}.ms--rtl .ms__checkbox{margin-left:var(--ms-spacing-sm, .5rem);margin-right:0}.ms--rtl .ms__option-content{text-align:right}.ms--rtl .ms__option-icon{margin-left:var(--ms-spacing-xs, .25rem);margin-right:0}.ms--rtl .ms__badges{direction:rtl}.ms--rtl .ms__badge{flex-direction:row-reverse}.ms--rtl .ms__badge-remove{border-radius:var(--ms-badge-remove-border-radius-rtl, .375rem) 0 0 var(--ms-badge-remove-border-radius-rtl, .375rem);border-left:var(--ms-badge-remove-border, none);border-right:none}.ms--rtl .ms__badge-text{border-radius:0 var(--ms-badge-text-border-radius-rtl, .375rem) var(--ms-badge-text-border-radius-rtl, .375rem) 0}.ms--rtl .ms__count-display{direction:rtl}.ms--rtl .ms__counter-wrapper{flex-direction:row-reverse}.ms--rtl .ms__selected-popover{direction:rtl;text-align:right}.ms--rtl .ms__actions{direction:rtl}.ms--rtl .ms__group-label,.ms--rtl .ms__empty{text-align:right}.ms--rtl .ms__hint{direction:rtl;text-align:right}.ms--xs .ms__input{font-size:var(--ms-font-size-xs, .75rem)}.ms--xs .ms__option{padding:var(--ms-spacing-xs, .25rem) var(--ms-spacing-sm, .5rem)}.ms--xs .ms__option-title{font-size:var(--ms-font-size-xs, .75rem)}.ms--xs .ms__badge{font-size:var(--ms-font-size-2xs, .625rem)}.ms--sm .ms__input,.ms--sm .ms__option-title{font-size:var(--ms-font-size-xs, .75rem)}.ms--lg .ms__input,.ms--lg .ms__option-title{font-size:var(--ms-font-size-base, 1rem)}.ms--lg .ms__badge{font-size:var(--ms-font-size-sm, .875rem)}.ms--xl .ms__input,.ms--xl .ms__option-title{font-size:var(--ms-font-size-lg, 1.125rem)}.ms--xl .ms__badge{font-size:var(--ms-font-size-base, 1rem)}.ms--disabled .ms__input{opacity:var(--ms-disabled-input-opacity, .6);cursor:not-allowed;background:var(--ms-input-bg-disabled, rgba(107, 114, 128, .05))}.ms--disabled .ms__toggle{opacity:var(--ms-disabled-input-opacity, .6)}.ms--no-checkboxes .ms__option{gap:0;padding-left:var(--ms-option-padding-h, .75rem)}.ms--no-checkboxes .ms__option-content{padding-left:0}.ml-debug-info{margin-top:.25rem;padding:.25rem;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:.375rem;font-size:.75rem;color:#111827}.ml-debug-info details summary{cursor:pointer;font-weight:600;color:#2563eb;-webkit-user-select:none;user-select:none;padding:.25rem;border-radius:.25rem}.ml-debug-info details summary:hover{background-color:#f3f4f6}.ml-debug-info details summary:focus{outline:2px solid #3b82f6;outline-offset:2px}.ml-debug-info .ml-debug-stats{display:flex;flex-direction:column;gap:.25rem;margin-top:.25rem;padding:.25rem;background-color:#fff;border-radius:.25rem}.ml-debug-info .ml-debug-stats span{display:flex;justify-content:space-between;padding:2px 4px;font-family:monospace;font-size:.625rem}.ml-debug-info .ml-debug-stats span:before{content:"•";margin-right:.25rem;color:#3b82f6}', bs = typeof HTMLElement < "u" ? HTMLElement : class {
|
|
2438
|
+
}, Se = /* @__PURE__ */ new Set();
|
|
2316
2439
|
function nt() {
|
|
2317
|
-
return Array.from(
|
|
2440
|
+
return Array.from(Se);
|
|
2318
2441
|
}
|
|
2319
|
-
class rt extends
|
|
2442
|
+
class rt extends bs {
|
|
2320
2443
|
constructor() {
|
|
2321
2444
|
super();
|
|
2322
|
-
|
|
2323
|
-
|
|
2324
|
-
|
|
2445
|
+
p(this, "picker");
|
|
2446
|
+
p(this, "containerElement");
|
|
2447
|
+
p(this, "shadow");
|
|
2325
2448
|
// Properties for complex data (not attributes)
|
|
2326
|
-
|
|
2449
|
+
p(this, "_options");
|
|
2327
2450
|
// Member/Callback properties
|
|
2328
|
-
|
|
2329
|
-
|
|
2330
|
-
|
|
2331
|
-
|
|
2332
|
-
|
|
2333
|
-
|
|
2334
|
-
|
|
2335
|
-
|
|
2336
|
-
|
|
2337
|
-
|
|
2338
|
-
|
|
2339
|
-
|
|
2340
|
-
|
|
2341
|
-
|
|
2342
|
-
|
|
2451
|
+
p(this, "_valueMember");
|
|
2452
|
+
p(this, "_getValueCallback");
|
|
2453
|
+
p(this, "_displayValueMember");
|
|
2454
|
+
p(this, "_getDisplayValueCallback");
|
|
2455
|
+
p(this, "_getBadgeDisplayCallback");
|
|
2456
|
+
p(this, "_getBadgeClassCallback");
|
|
2457
|
+
p(this, "_customStylesCallback");
|
|
2458
|
+
p(this, "_searchValueMember");
|
|
2459
|
+
p(this, "_getSearchValueCallback");
|
|
2460
|
+
p(this, "_iconMember");
|
|
2461
|
+
p(this, "_getIconCallback");
|
|
2462
|
+
p(this, "_subtitleMember");
|
|
2463
|
+
p(this, "_getSubtitleCallback");
|
|
2464
|
+
p(this, "_groupMember");
|
|
2465
|
+
p(this, "_getGroupCallback");
|
|
2466
|
+
p(this, "_renderGroupLabelContentCallback");
|
|
2467
|
+
p(this, "_disabledMember");
|
|
2468
|
+
p(this, "_getDisabledCallback");
|
|
2343
2469
|
// Value formatting callbacks
|
|
2344
|
-
|
|
2470
|
+
p(this, "_getValueFormatCallback");
|
|
2345
2471
|
// Tooltip callbacks
|
|
2346
|
-
|
|
2347
|
-
//
|
|
2348
|
-
|
|
2472
|
+
p(this, "_getBadgeTooltipCallback");
|
|
2473
|
+
// Custom rendering callbacks
|
|
2474
|
+
p(this, "_renderOptionContentCallback");
|
|
2475
|
+
p(this, "_renderBadgeContentCallback");
|
|
2476
|
+
p(this, "_renderSelectedItemContentCallback");
|
|
2477
|
+
p(this, "_getSelectedItemClassCallback");
|
|
2478
|
+
p(this, "_renderSelectedContentCallback");
|
|
2479
|
+
// Count badge callback
|
|
2480
|
+
p(this, "_getCounterCallback");
|
|
2481
|
+
// Action buttons
|
|
2482
|
+
p(this, "_actionButtons");
|
|
2349
2483
|
// Event callbacks
|
|
2350
|
-
|
|
2351
|
-
|
|
2352
|
-
|
|
2353
|
-
|
|
2354
|
-
|
|
2355
|
-
|
|
2356
|
-
|
|
2484
|
+
p(this, "_beforeSearchCallback");
|
|
2485
|
+
p(this, "_searchCallback");
|
|
2486
|
+
p(this, "_addNewCallback");
|
|
2487
|
+
p(this, "_selectCallback");
|
|
2488
|
+
p(this, "_deselectCallback");
|
|
2489
|
+
p(this, "_changeCallback");
|
|
2490
|
+
p(this, "_declarativeSelectedValues");
|
|
2357
2491
|
this.shadow = this.attachShadow({ mode: "open" });
|
|
2358
2492
|
const t = document.createElement("style");
|
|
2359
|
-
t.textContent =
|
|
2493
|
+
t.textContent = gs, this.shadow.appendChild(t), requestAnimationFrame(() => {
|
|
2360
2494
|
this.setAttribute("data-ready", "");
|
|
2361
2495
|
});
|
|
2362
2496
|
}
|
|
@@ -2367,19 +2501,17 @@ class rt extends hi {
|
|
|
2367
2501
|
"search-placeholder",
|
|
2368
2502
|
"multiple",
|
|
2369
2503
|
"allow-groups",
|
|
2370
|
-
"allow-select-all",
|
|
2371
|
-
"allow-clear-all",
|
|
2372
2504
|
"show-checkboxes",
|
|
2373
2505
|
"sticky-actions",
|
|
2374
2506
|
"close-on-select",
|
|
2375
2507
|
"lock-placement",
|
|
2376
2508
|
"dropdown-min-width",
|
|
2377
|
-
"
|
|
2378
|
-
"
|
|
2379
|
-
"
|
|
2380
|
-
"
|
|
2381
|
-
"
|
|
2382
|
-
"show-
|
|
2509
|
+
"badges-display-mode",
|
|
2510
|
+
"badges-threshold",
|
|
2511
|
+
"badges-max-visible",
|
|
2512
|
+
"badges-threshold-mode",
|
|
2513
|
+
"badges-position",
|
|
2514
|
+
"show-counter",
|
|
2383
2515
|
"keep-options-on-search",
|
|
2384
2516
|
"max-height",
|
|
2385
2517
|
"empty-message",
|
|
@@ -2388,13 +2520,14 @@ class rt extends hi {
|
|
|
2388
2520
|
"enable-search",
|
|
2389
2521
|
"search-input-mode",
|
|
2390
2522
|
"search-mode",
|
|
2523
|
+
"actions-layout",
|
|
2391
2524
|
"allow-add-new",
|
|
2392
2525
|
"initial-values",
|
|
2393
2526
|
// Virtual scroll options
|
|
2394
2527
|
"enable-virtual-scroll",
|
|
2395
2528
|
"virtual-scroll-threshold",
|
|
2396
2529
|
"option-height",
|
|
2397
|
-
"
|
|
2530
|
+
"badge-height",
|
|
2398
2531
|
"virtual-scroll-buffer",
|
|
2399
2532
|
// New member properties
|
|
2400
2533
|
"value-member",
|
|
@@ -2408,22 +2541,22 @@ class rt extends hi {
|
|
|
2408
2541
|
"name",
|
|
2409
2542
|
"value-format",
|
|
2410
2543
|
// Tooltip options
|
|
2411
|
-
"enable-
|
|
2412
|
-
"
|
|
2544
|
+
"enable-badge-tooltips",
|
|
2545
|
+
"badge-tooltip-placement",
|
|
2413
2546
|
// Debug
|
|
2414
2547
|
"show-debug-info"
|
|
2415
2548
|
];
|
|
2416
2549
|
}
|
|
2417
2550
|
connectedCallback() {
|
|
2418
|
-
|
|
2551
|
+
Se.add(this), this.render();
|
|
2419
2552
|
const t = this.parseDeclarativeOptions();
|
|
2420
|
-
t && (this._options && this._options.length > 0 &&
|
|
2553
|
+
t && (this._options && this._options.length > 0 && S.warn("[MultiSelectElement] Both declarative <option> elements and programmatic .options detected. Using declarative options."), this._options = t), this.initializePicker();
|
|
2421
2554
|
}
|
|
2422
2555
|
disconnectedCallback() {
|
|
2423
|
-
|
|
2556
|
+
Se.delete(this), this.picker && this.picker.destroy();
|
|
2424
2557
|
}
|
|
2425
|
-
attributeChangedCallback(t,
|
|
2426
|
-
|
|
2558
|
+
attributeChangedCallback(t, i, o) {
|
|
2559
|
+
i !== o && this.picker && t !== "initial-values" && (this.picker.destroy(), this.initializePicker());
|
|
2427
2560
|
}
|
|
2428
2561
|
render() {
|
|
2429
2562
|
this.containerElement = document.createElement("div"), this.containerElement.setAttribute("data-multiselect", ""), this.className && (this.containerElement.className = this.className), this.shadow.appendChild(this.containerElement), this.getAttribute("show-debug-info") === "true" && this.renderDebugInfo();
|
|
@@ -2431,26 +2564,26 @@ class rt extends hi {
|
|
|
2431
2564
|
renderDebugInfo() {
|
|
2432
2565
|
const t = this.shadow.querySelector(".ml-debug-info");
|
|
2433
2566
|
t && t.remove();
|
|
2434
|
-
const
|
|
2435
|
-
|
|
2436
|
-
const o = document.createElement("details"),
|
|
2437
|
-
|
|
2438
|
-
const
|
|
2439
|
-
|
|
2567
|
+
const i = document.createElement("div");
|
|
2568
|
+
i.className = "ml-debug-info";
|
|
2569
|
+
const o = document.createElement("details"), n = document.createElement("summary");
|
|
2570
|
+
n.textContent = "Debug Info";
|
|
2571
|
+
const r = document.createElement("div");
|
|
2572
|
+
r.className = "ml-debug-stats", o.appendChild(n), o.appendChild(r), i.appendChild(o), this.shadow.appendChild(i), this.updateDebugInfo();
|
|
2440
2573
|
}
|
|
2441
2574
|
updateDebugInfo() {
|
|
2442
|
-
var h,
|
|
2575
|
+
var h, g;
|
|
2443
2576
|
const t = this.shadow.querySelector(".ml-debug-stats");
|
|
2444
2577
|
if (!t || !this.picker) return;
|
|
2445
|
-
const
|
|
2578
|
+
const i = "1.1.0", o = nt().length, r = this.picker.getSelected().length, a = ((h = this._options) == null ? void 0 : h.length) || 0, l = this.picker, c = l.isOpen || !1, d = l.searchTerm || "", m = l.isLoading || !1, u = ((g = l.filteredOptions) == null ? void 0 : g.length) || 0;
|
|
2446
2579
|
t.innerHTML = `
|
|
2447
|
-
<span>Version: ${
|
|
2580
|
+
<span>Version: ${i}</span>
|
|
2448
2581
|
<span>Total Instances: ${o}</span>
|
|
2449
|
-
<span>Options: ${
|
|
2450
|
-
<span>Filtered: ${
|
|
2451
|
-
<span>Selected: ${
|
|
2452
|
-
<span>Dropdown: ${
|
|
2453
|
-
<span>Search: ${
|
|
2582
|
+
<span>Options: ${a}</span>
|
|
2583
|
+
<span>Filtered: ${u}</span>
|
|
2584
|
+
<span>Selected: ${r}</span>
|
|
2585
|
+
<span>Dropdown: ${c ? "Open" : "Closed"}</span>
|
|
2586
|
+
<span>Search: ${d || "none"}</span>
|
|
2454
2587
|
<span>Loading: ${m ? "Yes" : "No"}</span>
|
|
2455
2588
|
`, setTimeout(() => {
|
|
2456
2589
|
this.getAttribute("show-debug-info") === "true" && this.updateDebugInfo();
|
|
@@ -2461,82 +2594,85 @@ class rt extends hi {
|
|
|
2461
2594
|
* Returns array of options in the format expected by the picker
|
|
2462
2595
|
*/
|
|
2463
2596
|
parseDeclarativeOptions() {
|
|
2464
|
-
var
|
|
2465
|
-
const t = [],
|
|
2466
|
-
if (
|
|
2597
|
+
var n, r, a, l;
|
|
2598
|
+
const t = [], i = Array.from(this.children);
|
|
2599
|
+
if (i.length === 0)
|
|
2467
2600
|
return null;
|
|
2468
2601
|
let o = !1;
|
|
2469
|
-
for (const
|
|
2470
|
-
if (
|
|
2471
|
-
const
|
|
2472
|
-
value:
|
|
2473
|
-
label: ((
|
|
2602
|
+
for (const c of i)
|
|
2603
|
+
if (c.tagName === "OPTION") {
|
|
2604
|
+
const d = c, m = {
|
|
2605
|
+
value: d.value || ((n = d.textContent) == null ? void 0 : n.trim()) || "",
|
|
2606
|
+
label: ((r = d.textContent) == null ? void 0 : r.trim()) || d.value || ""
|
|
2474
2607
|
};
|
|
2475
|
-
|
|
2476
|
-
} else if (
|
|
2477
|
-
const
|
|
2478
|
-
for (const h of
|
|
2479
|
-
const
|
|
2480
|
-
value: h.value || ((
|
|
2481
|
-
label: ((
|
|
2608
|
+
d.hasAttribute("selected") && (this._declarativeSelectedValues || (this._declarativeSelectedValues = []), this._declarativeSelectedValues.push(m.value)), d.hasAttribute("disabled") && (m.disabled = !0), d.hasAttribute("data-icon") && (m.icon = d.getAttribute("data-icon")), d.hasAttribute("data-subtitle") && (m.subtitle = d.getAttribute("data-subtitle")), t.push(m), o = !0;
|
|
2609
|
+
} else if (c.tagName === "OPTGROUP") {
|
|
2610
|
+
const d = c, m = d.label || d.getAttribute("label") || "Group", u = Array.from(d.querySelectorAll("option"));
|
|
2611
|
+
for (const h of u) {
|
|
2612
|
+
const g = {
|
|
2613
|
+
value: h.value || ((a = h.textContent) == null ? void 0 : a.trim()) || "",
|
|
2614
|
+
label: ((l = h.textContent) == null ? void 0 : l.trim()) || h.value || "",
|
|
2482
2615
|
group: m
|
|
2483
2616
|
};
|
|
2484
|
-
h.hasAttribute("selected") && (this._declarativeSelectedValues || (this._declarativeSelectedValues = []), this._declarativeSelectedValues.push(
|
|
2617
|
+
h.hasAttribute("selected") && (this._declarativeSelectedValues || (this._declarativeSelectedValues = []), this._declarativeSelectedValues.push(g.value)), h.hasAttribute("disabled") && (g.disabled = !0), h.hasAttribute("data-icon") && (g.icon = h.getAttribute("data-icon")), h.hasAttribute("data-subtitle") && (g.subtitle = h.getAttribute("data-subtitle")), t.push(g), o = !0;
|
|
2485
2618
|
}
|
|
2486
2619
|
}
|
|
2487
|
-
return o ? (
|
|
2488
|
-
(
|
|
2620
|
+
return o ? (S.debug(`[MultiSelectElement] Parsed ${t.length} declarative options from Light DOM`), i.forEach((c) => {
|
|
2621
|
+
(c.tagName === "OPTION" || c.tagName === "OPTGROUP") && c.remove();
|
|
2489
2622
|
}), t) : null;
|
|
2490
2623
|
}
|
|
2491
2624
|
initializePicker() {
|
|
2492
2625
|
if (!this.containerElement) return;
|
|
2493
2626
|
let t;
|
|
2494
2627
|
if (this._declarativeSelectedValues && this._declarativeSelectedValues.length > 0)
|
|
2495
|
-
t = this._declarativeSelectedValues,
|
|
2628
|
+
t = this._declarativeSelectedValues, S.debug(`[MultiSelectElement] Using ${t.length} declaratively selected values`);
|
|
2496
2629
|
else {
|
|
2497
2630
|
const o = this.getAttribute("initial-values");
|
|
2498
2631
|
if (o)
|
|
2499
2632
|
try {
|
|
2500
2633
|
t = JSON.parse(o);
|
|
2501
|
-
} catch (
|
|
2502
|
-
|
|
2634
|
+
} catch (n) {
|
|
2635
|
+
S.error("[MultiSelectElement] Failed to parse initial-values:", n);
|
|
2503
2636
|
}
|
|
2504
2637
|
}
|
|
2505
|
-
const
|
|
2638
|
+
const i = {
|
|
2506
2639
|
// String options
|
|
2507
2640
|
searchHint: this.getAttribute("search-hint") || void 0,
|
|
2508
2641
|
searchPlaceholder: this.getAttribute("search-placeholder") || "Search...",
|
|
2509
2642
|
dropdownMinWidth: this.getAttribute("dropdown-min-width") || void 0,
|
|
2510
|
-
|
|
2511
|
-
|
|
2512
|
-
|
|
2643
|
+
badgesDisplayMode: this.getAttribute("badges-display-mode") || "badges",
|
|
2644
|
+
badgesPosition: this.getAttribute("badges-position") || "bottom",
|
|
2645
|
+
badgesThresholdMode: this.getAttribute("badges-threshold-mode") || "count",
|
|
2513
2646
|
maxHeight: this.getAttribute("max-height") || "20rem",
|
|
2514
2647
|
emptyMessage: this.getAttribute("empty-message") || "No results found",
|
|
2515
2648
|
loadingMessage: this.getAttribute("loading-message") || "Loading...",
|
|
2516
2649
|
searchInputMode: this.getAttribute("search-input-mode") || "normal",
|
|
2517
2650
|
searchMode: this.getAttribute("search-mode") || "filter",
|
|
2651
|
+
actionsLayout: this.getAttribute("actions-layout") || "nowrap",
|
|
2518
2652
|
// Number options
|
|
2519
|
-
|
|
2520
|
-
|
|
2653
|
+
badgesThreshold: this.getAttribute("badges-threshold") ? parseInt(this.getAttribute("badges-threshold")) : void 0,
|
|
2654
|
+
badgesMaxVisible: this.getAttribute("badges-max-visible") ? parseInt(this.getAttribute("badges-max-visible")) : void 0,
|
|
2521
2655
|
minSearchLength: this.getAttribute("min-search-length") ? parseInt(this.getAttribute("min-search-length")) : 0,
|
|
2522
2656
|
// Boolean options (map external to internal with 'is' prefix)
|
|
2523
2657
|
isMultipleEnabled: this.getAttribute("multiple") !== "false",
|
|
2524
2658
|
isGroupsAllowed: this.getAttribute("allow-groups") !== "false",
|
|
2525
|
-
isSelectAllAllowed: this.getAttribute("allow-select-all") !== "false",
|
|
2526
|
-
isClearAllAllowed: this.getAttribute("allow-clear-all") !== "false",
|
|
2527
2659
|
isCheckboxesShown: this.getAttribute("show-checkboxes") !== "false",
|
|
2528
2660
|
isActionsSticky: this.getAttribute("sticky-actions") !== "false",
|
|
2529
2661
|
isCloseOnSelect: this.getAttribute("close-on-select") === "true",
|
|
2530
2662
|
isPlacementLocked: this.getAttribute("lock-placement") !== "false",
|
|
2531
2663
|
isSearchEnabled: this.getAttribute("enable-search") !== "false",
|
|
2532
2664
|
isAddNewAllowed: this.getAttribute("allow-add-new") === "true",
|
|
2533
|
-
|
|
2665
|
+
isCounterShown: this.getAttribute("show-counter") === "true",
|
|
2534
2666
|
isKeepOptionsOnSearch: this.getAttribute("keep-options-on-search") !== "false",
|
|
2535
2667
|
isVirtualScrollEnabled: this.getAttribute("enable-virtual-scroll") === "true",
|
|
2668
|
+
// Action buttons
|
|
2669
|
+
actionButtons: this._actionButtons,
|
|
2670
|
+
// Checkbox options
|
|
2671
|
+
checkboxAlign: this.getAttribute("checkbox-align") || "center",
|
|
2536
2672
|
// Virtual scroll options
|
|
2537
2673
|
virtualScrollThreshold: this.getAttribute("virtual-scroll-threshold") ? parseInt(this.getAttribute("virtual-scroll-threshold")) : 100,
|
|
2538
2674
|
optionHeight: this.getAttribute("option-height") ? parseInt(this.getAttribute("option-height")) : 50,
|
|
2539
|
-
|
|
2675
|
+
badgeHeight: this.getAttribute("badge-height") ? parseInt(this.getAttribute("badge-height")) : 36,
|
|
2540
2676
|
virtualScrollBuffer: this.getAttribute("virtual-scroll-buffer") ? parseInt(this.getAttribute("virtual-scroll-buffer")) : 10,
|
|
2541
2677
|
// Member properties
|
|
2542
2678
|
valueMember: this.getAttribute("value-member") || this._valueMember,
|
|
@@ -2549,55 +2685,75 @@ class rt extends hi {
|
|
|
2549
2685
|
// Callback properties (JavaScript only)
|
|
2550
2686
|
getValueCallback: this._getValueCallback,
|
|
2551
2687
|
getDisplayValueCallback: this._getDisplayValueCallback,
|
|
2552
|
-
|
|
2688
|
+
getBadgeDisplayCallback: this._getBadgeDisplayCallback,
|
|
2689
|
+
getBadgeClassCallback: this._getBadgeClassCallback,
|
|
2690
|
+
customStylesCallback: this._customStylesCallback,
|
|
2553
2691
|
getSearchValueCallback: this._getSearchValueCallback,
|
|
2554
2692
|
getIconCallback: this._getIconCallback,
|
|
2555
2693
|
getSubtitleCallback: this._getSubtitleCallback,
|
|
2556
2694
|
getGroupCallback: this._getGroupCallback,
|
|
2695
|
+
renderGroupLabelContentCallback: this._renderGroupLabelContentCallback,
|
|
2557
2696
|
getDisabledCallback: this._getDisabledCallback,
|
|
2697
|
+
// Custom rendering callbacks
|
|
2698
|
+
renderOptionContentCallback: this._renderOptionContentCallback,
|
|
2699
|
+
renderBadgeContentCallback: this._renderBadgeContentCallback,
|
|
2700
|
+
renderSelectedItemContentCallback: this._renderSelectedItemContentCallback,
|
|
2701
|
+
getSelectedItemClassCallback: this._getSelectedItemClassCallback,
|
|
2702
|
+
renderSelectedContentCallback: this._renderSelectedContentCallback,
|
|
2558
2703
|
// Form integration & value formatting
|
|
2559
2704
|
formFieldId: this.getAttribute("name") || void 0,
|
|
2560
2705
|
valueFormat: this.getAttribute("value-format") || "json",
|
|
2561
2706
|
getValueFormatCallback: this._getValueFormatCallback,
|
|
2562
2707
|
// Tooltip options
|
|
2563
|
-
|
|
2564
|
-
|
|
2565
|
-
|
|
2566
|
-
|
|
2567
|
-
|
|
2568
|
-
// Count
|
|
2569
|
-
|
|
2708
|
+
isBadgeTooltipsEnabled: this.getAttribute("enable-badge-tooltips") === "true",
|
|
2709
|
+
getBadgeTooltipCallback: this._getBadgeTooltipCallback,
|
|
2710
|
+
badgeTooltipPlacement: this.getAttribute("badge-tooltip-placement") || "top",
|
|
2711
|
+
badgeTooltipDelay: parseInt(this.getAttribute("badge-tooltip-delay") || "300"),
|
|
2712
|
+
badgeTooltipOffset: parseInt(this.getAttribute("badge-tooltip-offset") || "8"),
|
|
2713
|
+
// Count badge callback
|
|
2714
|
+
getCounterCallback: this._getCounterCallback || ((o, n) => n !== void 0 ? `+${n} more` : `${o} selected`),
|
|
2570
2715
|
// Data and callbacks
|
|
2571
2716
|
options: this._options,
|
|
2572
2717
|
beforeSearchCallback: this._beforeSearchCallback,
|
|
2573
2718
|
searchCallback: this._searchCallback,
|
|
2574
2719
|
addNewCallback: this._addNewCallback,
|
|
2575
2720
|
selectCallback: (o) => {
|
|
2576
|
-
var
|
|
2721
|
+
var n;
|
|
2577
2722
|
this._selectCallback && this._selectCallback(o), this.dispatchEvent(new CustomEvent("select", {
|
|
2578
2723
|
detail: {
|
|
2579
2724
|
option: o,
|
|
2580
|
-
selectedOptions: (
|
|
2581
|
-
selectedValues:
|
|
2725
|
+
selectedOptions: (n = this.picker) == null ? void 0 : n.getSelected(),
|
|
2726
|
+
selectedValues: (() => {
|
|
2727
|
+
var a;
|
|
2728
|
+
const r = (a = this.picker) == null ? void 0 : a.getValue();
|
|
2729
|
+
return r == null ? [] : Array.isArray(r) ? r : [r];
|
|
2730
|
+
})()
|
|
2582
2731
|
}
|
|
2583
2732
|
}));
|
|
2584
2733
|
},
|
|
2585
2734
|
deselectCallback: (o) => {
|
|
2586
|
-
var
|
|
2735
|
+
var n;
|
|
2587
2736
|
this._deselectCallback && this._deselectCallback(o), this.dispatchEvent(new CustomEvent("deselect", {
|
|
2588
2737
|
detail: {
|
|
2589
2738
|
option: o,
|
|
2590
|
-
selectedOptions: (
|
|
2591
|
-
selectedValues:
|
|
2739
|
+
selectedOptions: (n = this.picker) == null ? void 0 : n.getSelected(),
|
|
2740
|
+
selectedValues: (() => {
|
|
2741
|
+
var a;
|
|
2742
|
+
const r = (a = this.picker) == null ? void 0 : a.getValue();
|
|
2743
|
+
return r == null ? [] : Array.isArray(r) ? r : [r];
|
|
2744
|
+
})()
|
|
2592
2745
|
}
|
|
2593
2746
|
}));
|
|
2594
2747
|
},
|
|
2595
2748
|
changeCallback: (o) => {
|
|
2596
|
-
var s;
|
|
2597
2749
|
this._changeCallback && this._changeCallback(o), this.dispatchEvent(new CustomEvent("change", {
|
|
2598
2750
|
detail: {
|
|
2599
2751
|
selectedOptions: o,
|
|
2600
|
-
selectedValues:
|
|
2752
|
+
selectedValues: (() => {
|
|
2753
|
+
var r;
|
|
2754
|
+
const n = (r = this.picker) == null ? void 0 : r.getValue();
|
|
2755
|
+
return n == null ? [] : Array.isArray(n) ? n : [n];
|
|
2756
|
+
})()
|
|
2601
2757
|
}
|
|
2602
2758
|
}));
|
|
2603
2759
|
},
|
|
@@ -2606,7 +2762,13 @@ class rt extends hi {
|
|
|
2606
2762
|
// Pass host element (this) for hidden inputs in light DOM
|
|
2607
2763
|
hostElement: this
|
|
2608
2764
|
};
|
|
2609
|
-
t && (this.containerElement.dataset.initialValues = JSON.stringify(t)), this.picker = new
|
|
2765
|
+
if (t && (this.containerElement.dataset.initialValues = JSON.stringify(t)), this.picker = new us(this.containerElement, i), this._customStylesCallback) {
|
|
2766
|
+
const o = this._customStylesCallback();
|
|
2767
|
+
if (o) {
|
|
2768
|
+
const n = document.createElement("style");
|
|
2769
|
+
n.className = "ml-custom-styles", n.textContent = o, this.shadow.appendChild(n);
|
|
2770
|
+
}
|
|
2771
|
+
}
|
|
2610
2772
|
}
|
|
2611
2773
|
reinitialize() {
|
|
2612
2774
|
this.picker && (this.picker.destroy(), this.initializePicker());
|
|
@@ -2677,11 +2839,31 @@ class rt extends hi {
|
|
|
2677
2839
|
get getDisplayValueCallback() {
|
|
2678
2840
|
return this._getDisplayValueCallback;
|
|
2679
2841
|
}
|
|
2680
|
-
set
|
|
2681
|
-
this.
|
|
2842
|
+
set getBadgeDisplayCallback(t) {
|
|
2843
|
+
this._getBadgeDisplayCallback = t, this.reinitialize();
|
|
2844
|
+
}
|
|
2845
|
+
get getBadgeDisplayCallback() {
|
|
2846
|
+
return this._getBadgeDisplayCallback;
|
|
2847
|
+
}
|
|
2848
|
+
set getBadgeClassCallback(t) {
|
|
2849
|
+
this._getBadgeClassCallback = t, this.reinitialize();
|
|
2850
|
+
}
|
|
2851
|
+
get getBadgeClassCallback() {
|
|
2852
|
+
return this._getBadgeClassCallback;
|
|
2853
|
+
}
|
|
2854
|
+
set customStylesCallback(t) {
|
|
2855
|
+
if (this._customStylesCallback = t, this.picker && t) {
|
|
2856
|
+
const i = t();
|
|
2857
|
+
if (i) {
|
|
2858
|
+
const o = this.shadow.querySelector("style.ml-custom-styles");
|
|
2859
|
+
o && o.remove();
|
|
2860
|
+
const n = document.createElement("style");
|
|
2861
|
+
n.className = "ml-custom-styles", n.textContent = i, this.shadow.appendChild(n), this.picker.renderBadges();
|
|
2862
|
+
}
|
|
2863
|
+
}
|
|
2682
2864
|
}
|
|
2683
|
-
get
|
|
2684
|
-
return this.
|
|
2865
|
+
get customStylesCallback() {
|
|
2866
|
+
return this._customStylesCallback;
|
|
2685
2867
|
}
|
|
2686
2868
|
set getSearchValueCallback(t) {
|
|
2687
2869
|
this._getSearchValueCallback = t, this.reinitialize();
|
|
@@ -2707,12 +2889,49 @@ class rt extends hi {
|
|
|
2707
2889
|
get getGroupCallback() {
|
|
2708
2890
|
return this._getGroupCallback;
|
|
2709
2891
|
}
|
|
2892
|
+
set renderGroupLabelContentCallback(t) {
|
|
2893
|
+
this._renderGroupLabelContentCallback = t, this.reinitialize();
|
|
2894
|
+
}
|
|
2895
|
+
get renderGroupLabelContentCallback() {
|
|
2896
|
+
return this._renderGroupLabelContentCallback;
|
|
2897
|
+
}
|
|
2710
2898
|
set getDisabledCallback(t) {
|
|
2711
2899
|
this._getDisabledCallback = t, this.reinitialize();
|
|
2712
2900
|
}
|
|
2713
2901
|
get getDisabledCallback() {
|
|
2714
2902
|
return this._getDisabledCallback;
|
|
2715
2903
|
}
|
|
2904
|
+
// Custom rendering callbacks
|
|
2905
|
+
set renderOptionContentCallback(t) {
|
|
2906
|
+
this._renderOptionContentCallback = t, this.reinitialize();
|
|
2907
|
+
}
|
|
2908
|
+
get renderOptionContentCallback() {
|
|
2909
|
+
return this._renderOptionContentCallback;
|
|
2910
|
+
}
|
|
2911
|
+
set renderBadgeContentCallback(t) {
|
|
2912
|
+
this._renderBadgeContentCallback = t, this.reinitialize();
|
|
2913
|
+
}
|
|
2914
|
+
get renderBadgeContentCallback() {
|
|
2915
|
+
return this._renderBadgeContentCallback;
|
|
2916
|
+
}
|
|
2917
|
+
set renderSelectedItemContentCallback(t) {
|
|
2918
|
+
this._renderSelectedItemContentCallback = t, this.reinitialize();
|
|
2919
|
+
}
|
|
2920
|
+
get renderSelectedItemContentCallback() {
|
|
2921
|
+
return this._renderSelectedItemContentCallback;
|
|
2922
|
+
}
|
|
2923
|
+
set getSelectedItemClassCallback(t) {
|
|
2924
|
+
this._getSelectedItemClassCallback = t, this.reinitialize();
|
|
2925
|
+
}
|
|
2926
|
+
get getSelectedItemClassCallback() {
|
|
2927
|
+
return this._getSelectedItemClassCallback;
|
|
2928
|
+
}
|
|
2929
|
+
set renderSelectedContentCallback(t) {
|
|
2930
|
+
this._renderSelectedContentCallback = t, this.reinitialize();
|
|
2931
|
+
}
|
|
2932
|
+
get renderSelectedContentCallback() {
|
|
2933
|
+
return this._renderSelectedContentCallback;
|
|
2934
|
+
}
|
|
2716
2935
|
// Form integration
|
|
2717
2936
|
set name(t) {
|
|
2718
2937
|
t ? this.setAttribute("name", t) : this.removeAttribute("name");
|
|
@@ -2732,44 +2951,51 @@ class rt extends hi {
|
|
|
2732
2951
|
get getValueFormatCallback() {
|
|
2733
2952
|
return this._getValueFormatCallback;
|
|
2734
2953
|
}
|
|
2735
|
-
//
|
|
2954
|
+
// Badges display options
|
|
2736
2955
|
set thresholdMode(t) {
|
|
2737
2956
|
t ? this.setAttribute("threshold-mode", t) : this.removeAttribute("threshold-mode");
|
|
2738
2957
|
}
|
|
2739
2958
|
get thresholdMode() {
|
|
2740
2959
|
return this.getAttribute("threshold-mode");
|
|
2741
2960
|
}
|
|
2742
|
-
set
|
|
2743
|
-
t !== null ? this.setAttribute("
|
|
2961
|
+
set badgesMaxVisible(t) {
|
|
2962
|
+
t !== null ? this.setAttribute("badges-max-visible", String(t)) : this.removeAttribute("badges-max-visible");
|
|
2744
2963
|
}
|
|
2745
|
-
get
|
|
2746
|
-
const t = this.getAttribute("
|
|
2964
|
+
get badgesMaxVisible() {
|
|
2965
|
+
const t = this.getAttribute("badges-max-visible");
|
|
2747
2966
|
return t ? parseInt(t) : null;
|
|
2748
2967
|
}
|
|
2968
|
+
// Checkbox options
|
|
2969
|
+
set checkboxAlign(t) {
|
|
2970
|
+
t ? this.setAttribute("checkbox-align", t) : this.removeAttribute("checkbox-align");
|
|
2971
|
+
}
|
|
2972
|
+
get checkboxAlign() {
|
|
2973
|
+
return this.getAttribute("checkbox-align");
|
|
2974
|
+
}
|
|
2749
2975
|
// Tooltip options
|
|
2750
|
-
set
|
|
2751
|
-
t ? this.setAttribute("enable-
|
|
2976
|
+
set enableBadgeTooltips(t) {
|
|
2977
|
+
t ? this.setAttribute("enable-badge-tooltips", "true") : this.removeAttribute("enable-badge-tooltips");
|
|
2752
2978
|
}
|
|
2753
|
-
get
|
|
2754
|
-
return this.getAttribute("enable-
|
|
2979
|
+
get enableBadgeTooltips() {
|
|
2980
|
+
return this.getAttribute("enable-badge-tooltips") === "true";
|
|
2755
2981
|
}
|
|
2756
|
-
set
|
|
2757
|
-
t ? this.setAttribute("
|
|
2982
|
+
set badgeTooltipPlacement(t) {
|
|
2983
|
+
t ? this.setAttribute("badge-tooltip-placement", t) : this.removeAttribute("badge-tooltip-placement");
|
|
2758
2984
|
}
|
|
2759
|
-
get
|
|
2760
|
-
return this.getAttribute("
|
|
2985
|
+
get badgeTooltipPlacement() {
|
|
2986
|
+
return this.getAttribute("badge-tooltip-placement");
|
|
2761
2987
|
}
|
|
2762
|
-
set
|
|
2763
|
-
this.
|
|
2988
|
+
set getBadgeTooltipCallback(t) {
|
|
2989
|
+
this._getBadgeTooltipCallback = t, this.reinitialize();
|
|
2764
2990
|
}
|
|
2765
|
-
get
|
|
2766
|
-
return this.
|
|
2991
|
+
get getBadgeTooltipCallback() {
|
|
2992
|
+
return this._getBadgeTooltipCallback;
|
|
2767
2993
|
}
|
|
2768
|
-
set
|
|
2769
|
-
this.
|
|
2994
|
+
set getCounterCallback(t) {
|
|
2995
|
+
this._getCounterCallback = t, this.reinitialize();
|
|
2770
2996
|
}
|
|
2771
|
-
get
|
|
2772
|
-
return this.
|
|
2997
|
+
get getCounterCallback() {
|
|
2998
|
+
return this._getCounterCallback;
|
|
2773
2999
|
}
|
|
2774
3000
|
// Event callbacks
|
|
2775
3001
|
get beforeSearchCallback() {
|
|
@@ -2808,6 +3034,13 @@ class rt extends hi {
|
|
|
2808
3034
|
set changeCallback(t) {
|
|
2809
3035
|
this._changeCallback = t;
|
|
2810
3036
|
}
|
|
3037
|
+
// Action buttons
|
|
3038
|
+
get actionButtons() {
|
|
3039
|
+
return this._actionButtons;
|
|
3040
|
+
}
|
|
3041
|
+
set actionButtons(t) {
|
|
3042
|
+
this._actionButtons = t, this.reinitialize();
|
|
3043
|
+
}
|
|
2811
3044
|
// New public properties
|
|
2812
3045
|
get selectedValue() {
|
|
2813
3046
|
var t;
|
|
@@ -2834,30 +3067,38 @@ class rt extends hi {
|
|
|
2834
3067
|
}
|
|
2835
3068
|
}
|
|
2836
3069
|
typeof window < "u" && typeof customElements < "u" && (customElements.get("web-multiselect") || customElements.define("web-multiselect", rt));
|
|
2837
|
-
typeof window < "u" && (window.
|
|
2838
|
-
version: () => "1.
|
|
3070
|
+
typeof window < "u" && (window.components = window.components || {}, window.components["web-multiselect"] = {
|
|
3071
|
+
version: () => "1.1.0",
|
|
2839
3072
|
config: {
|
|
2840
3073
|
name: "@keenmate/web-multiselect",
|
|
2841
|
-
version: "1.
|
|
3074
|
+
version: "1.1.0",
|
|
2842
3075
|
author: "Keenmate",
|
|
2843
3076
|
license: "MIT",
|
|
2844
3077
|
repository: "git+https://github.com/keenmate/web-multiselect.git",
|
|
2845
3078
|
homepage: "https://github.com/keenmate/web-multiselect#readme"
|
|
2846
3079
|
},
|
|
3080
|
+
logging: {
|
|
3081
|
+
enableLogging: ds,
|
|
3082
|
+
disableLogging: hs,
|
|
3083
|
+
setLogLevel: ps,
|
|
3084
|
+
setCategoryLevel: ms,
|
|
3085
|
+
getCategories: () => [...cs]
|
|
3086
|
+
},
|
|
2847
3087
|
register: () => {
|
|
2848
3088
|
typeof customElements < "u" && !customElements.get("web-multiselect") && customElements.define("web-multiselect", rt);
|
|
2849
3089
|
},
|
|
2850
3090
|
getInstances: () => nt()
|
|
2851
3091
|
});
|
|
2852
3092
|
export {
|
|
3093
|
+
cs as LOGGING_CATEGORIES,
|
|
2853
3094
|
rt as MultiSelectElement,
|
|
2854
|
-
|
|
2855
|
-
|
|
2856
|
-
|
|
2857
|
-
|
|
2858
|
-
|
|
2859
|
-
|
|
2860
|
-
|
|
2861
|
-
|
|
2862
|
-
|
|
3095
|
+
us as WebMultiSelect,
|
|
3096
|
+
S as dataLogger,
|
|
3097
|
+
hs as disableLogging,
|
|
3098
|
+
ds as enableLogging,
|
|
3099
|
+
le as initLogger,
|
|
3100
|
+
A as interactionLogger,
|
|
3101
|
+
ms as setCategoryLevel,
|
|
3102
|
+
ps as setLogLevel,
|
|
3103
|
+
f as uiLogger
|
|
2863
3104
|
};
|