@keenmate/web-multiselect 1.12.0-rc04 → 1.12.0-rc05
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 +29 -5
- package/component-variables.manifest.json +1 -0
- package/dist/index.d.ts +125 -21
- package/dist/multiselect.js +766 -575
- package/dist/multiselect.umd.js +17 -16
- package/dist/style.css +1 -1
- package/docs/examples.md +46 -2
- package/docs/usage.md +32 -4
- package/package.json +1 -1
- package/src/css/controls.css +50 -4
- package/src/css/floating.css +28 -0
- package/src/css/options.css +5 -0
- package/src/css/variables.css +17 -1
package/dist/multiselect.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
var ht = Object.defineProperty;
|
|
2
2
|
var mt = (o, e, t) => e in o ? ht(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
|
|
3
3
|
var d = (o, e, t) => mt(o, typeof e != "symbol" ? e + "" : e, t);
|
|
4
|
-
const ie = Math.min, F = Math.max, re = Math.round, se = Math.floor,
|
|
4
|
+
const ie = Math.min, F = Math.max, re = Math.round, se = Math.floor, L = (o) => ({
|
|
5
5
|
x: o,
|
|
6
6
|
y: o
|
|
7
7
|
}), pt = {
|
|
@@ -13,7 +13,7 @@ const ie = Math.min, F = Math.max, re = Math.round, se = Math.floor, M = (o) =>
|
|
|
13
13
|
start: "end",
|
|
14
14
|
end: "start"
|
|
15
15
|
};
|
|
16
|
-
function
|
|
16
|
+
function De(o, e, t) {
|
|
17
17
|
return F(o, ie(e, t));
|
|
18
18
|
}
|
|
19
19
|
function le(o, e) {
|
|
@@ -32,31 +32,31 @@ function Ke(o) {
|
|
|
32
32
|
return o === "y" ? "height" : "width";
|
|
33
33
|
}
|
|
34
34
|
const bt = /* @__PURE__ */ new Set(["top", "bottom"]);
|
|
35
|
-
function
|
|
35
|
+
function V(o) {
|
|
36
36
|
return bt.has(N(o)) ? "y" : "x";
|
|
37
37
|
}
|
|
38
38
|
function qe(o) {
|
|
39
|
-
return Ge(
|
|
39
|
+
return Ge(V(o));
|
|
40
40
|
}
|
|
41
41
|
function gt(o, e, t) {
|
|
42
42
|
t === void 0 && (t = !1);
|
|
43
43
|
const s = ce(o), i = qe(o), r = Ke(i);
|
|
44
|
-
let
|
|
45
|
-
return e.reference[r] > e.floating[r] && (
|
|
44
|
+
let n = i === "x" ? s === (t ? "end" : "start") ? "right" : "left" : s === "start" ? "bottom" : "top";
|
|
45
|
+
return e.reference[r] > e.floating[r] && (n = ne(n)), [n, ne(n)];
|
|
46
46
|
}
|
|
47
47
|
function ft(o) {
|
|
48
|
-
const e =
|
|
48
|
+
const e = ne(o);
|
|
49
49
|
return [fe(o), e, fe(e)];
|
|
50
50
|
}
|
|
51
51
|
function fe(o) {
|
|
52
52
|
return o.replace(/start|end/g, (e) => ut[e]);
|
|
53
53
|
}
|
|
54
|
-
const
|
|
55
|
-
function
|
|
54
|
+
const ze = ["left", "right"], Ve = ["right", "left"], vt = ["top", "bottom"], _t = ["bottom", "top"];
|
|
55
|
+
function yt(o, e, t) {
|
|
56
56
|
switch (o) {
|
|
57
57
|
case "top":
|
|
58
58
|
case "bottom":
|
|
59
|
-
return t ? e ?
|
|
59
|
+
return t ? e ? Ve : ze : e ? ze : Ve;
|
|
60
60
|
case "left":
|
|
61
61
|
case "right":
|
|
62
62
|
return e ? vt : _t;
|
|
@@ -64,15 +64,15 @@ function kt(o, e, t) {
|
|
|
64
64
|
return [];
|
|
65
65
|
}
|
|
66
66
|
}
|
|
67
|
-
function
|
|
67
|
+
function wt(o, e, t, s) {
|
|
68
68
|
const i = ce(o);
|
|
69
|
-
let r =
|
|
70
|
-
return i && (r = r.map((
|
|
69
|
+
let r = yt(N(o), t === "start", s);
|
|
70
|
+
return i && (r = r.map((n) => n + "-" + i), e && (r = r.concat(r.map(fe)))), r;
|
|
71
71
|
}
|
|
72
|
-
function
|
|
72
|
+
function ne(o) {
|
|
73
73
|
return o.replace(/left|right|bottom|top/g, (e) => pt[e]);
|
|
74
74
|
}
|
|
75
|
-
function
|
|
75
|
+
function kt(o) {
|
|
76
76
|
return {
|
|
77
77
|
top: 0,
|
|
78
78
|
right: 0,
|
|
@@ -82,14 +82,14 @@ function wt(o) {
|
|
|
82
82
|
};
|
|
83
83
|
}
|
|
84
84
|
function xt(o) {
|
|
85
|
-
return typeof o != "number" ?
|
|
85
|
+
return typeof o != "number" ? kt(o) : {
|
|
86
86
|
top: o,
|
|
87
87
|
right: o,
|
|
88
88
|
bottom: o,
|
|
89
89
|
left: o
|
|
90
90
|
};
|
|
91
91
|
}
|
|
92
|
-
function
|
|
92
|
+
function ae(o) {
|
|
93
93
|
const {
|
|
94
94
|
x: e,
|
|
95
95
|
y: t,
|
|
@@ -112,18 +112,18 @@ function Be(o, e, t) {
|
|
|
112
112
|
reference: s,
|
|
113
113
|
floating: i
|
|
114
114
|
} = o;
|
|
115
|
-
const r =
|
|
115
|
+
const r = V(e), n = qe(e), a = Ke(n), l = N(e), h = r === "y", c = s.x + s.width / 2 - i.width / 2, p = s.y + s.height / 2 - i.height / 2, u = s[a] / 2 - i[a] / 2;
|
|
116
116
|
let m;
|
|
117
117
|
switch (l) {
|
|
118
118
|
case "top":
|
|
119
119
|
m = {
|
|
120
|
-
x:
|
|
120
|
+
x: c,
|
|
121
121
|
y: s.y - i.height
|
|
122
122
|
};
|
|
123
123
|
break;
|
|
124
124
|
case "bottom":
|
|
125
125
|
m = {
|
|
126
|
-
x:
|
|
126
|
+
x: c,
|
|
127
127
|
y: s.y + s.height
|
|
128
128
|
};
|
|
129
129
|
break;
|
|
@@ -147,10 +147,10 @@ function Be(o, e, t) {
|
|
|
147
147
|
}
|
|
148
148
|
switch (ce(e)) {
|
|
149
149
|
case "start":
|
|
150
|
-
m[
|
|
150
|
+
m[n] -= u * (t && h ? -1 : 1);
|
|
151
151
|
break;
|
|
152
152
|
case "end":
|
|
153
|
-
m[
|
|
153
|
+
m[n] += u * (t && h ? -1 : 1);
|
|
154
154
|
break;
|
|
155
155
|
}
|
|
156
156
|
return m;
|
|
@@ -160,56 +160,56 @@ const Ct = async (o, e, t) => {
|
|
|
160
160
|
placement: s = "bottom",
|
|
161
161
|
strategy: i = "absolute",
|
|
162
162
|
middleware: r = [],
|
|
163
|
-
platform:
|
|
164
|
-
} = t,
|
|
165
|
-
let
|
|
163
|
+
platform: n
|
|
164
|
+
} = t, a = r.filter(Boolean), l = await (n.isRTL == null ? void 0 : n.isRTL(e));
|
|
165
|
+
let h = await n.getElementRects({
|
|
166
166
|
reference: o,
|
|
167
167
|
floating: e,
|
|
168
168
|
strategy: i
|
|
169
169
|
}), {
|
|
170
|
-
x:
|
|
170
|
+
x: c,
|
|
171
171
|
y: p
|
|
172
|
-
} = Be(
|
|
173
|
-
for (let
|
|
172
|
+
} = Be(h, s, l), u = s, m = {}, b = 0;
|
|
173
|
+
for (let f = 0; f < a.length; f++) {
|
|
174
174
|
const {
|
|
175
|
-
name:
|
|
175
|
+
name: g,
|
|
176
176
|
fn: v
|
|
177
|
-
} =
|
|
178
|
-
x:
|
|
179
|
-
y,
|
|
177
|
+
} = a[f], {
|
|
178
|
+
x: _,
|
|
179
|
+
y: w,
|
|
180
180
|
data: C,
|
|
181
|
-
reset:
|
|
181
|
+
reset: k
|
|
182
182
|
} = await v({
|
|
183
|
-
x:
|
|
183
|
+
x: c,
|
|
184
184
|
y: p,
|
|
185
185
|
initialPlacement: s,
|
|
186
186
|
placement: u,
|
|
187
187
|
strategy: i,
|
|
188
188
|
middlewareData: m,
|
|
189
|
-
rects:
|
|
190
|
-
platform:
|
|
189
|
+
rects: h,
|
|
190
|
+
platform: n,
|
|
191
191
|
elements: {
|
|
192
192
|
reference: o,
|
|
193
193
|
floating: e
|
|
194
194
|
}
|
|
195
195
|
});
|
|
196
|
-
|
|
196
|
+
c = _ ?? c, p = w ?? p, m = {
|
|
197
197
|
...m,
|
|
198
|
-
[
|
|
199
|
-
...m[
|
|
198
|
+
[g]: {
|
|
199
|
+
...m[g],
|
|
200
200
|
...C
|
|
201
201
|
}
|
|
202
|
-
},
|
|
202
|
+
}, k && b <= 50 && (b++, typeof k == "object" && (k.placement && (u = k.placement), k.rects && (h = k.rects === !0 ? await n.getElementRects({
|
|
203
203
|
reference: o,
|
|
204
204
|
floating: e,
|
|
205
205
|
strategy: i
|
|
206
|
-
}) :
|
|
207
|
-
x:
|
|
206
|
+
}) : k.rects), {
|
|
207
|
+
x: c,
|
|
208
208
|
y: p
|
|
209
|
-
} = Be(
|
|
209
|
+
} = Be(h, u, l)), f = -1);
|
|
210
210
|
}
|
|
211
211
|
return {
|
|
212
|
-
x:
|
|
212
|
+
x: c,
|
|
213
213
|
y: p,
|
|
214
214
|
placement: u,
|
|
215
215
|
strategy: i,
|
|
@@ -223,42 +223,42 @@ async function Ye(o, e) {
|
|
|
223
223
|
x: s,
|
|
224
224
|
y: i,
|
|
225
225
|
platform: r,
|
|
226
|
-
rects:
|
|
227
|
-
elements:
|
|
226
|
+
rects: n,
|
|
227
|
+
elements: a,
|
|
228
228
|
strategy: l
|
|
229
229
|
} = o, {
|
|
230
|
-
boundary:
|
|
231
|
-
rootBoundary:
|
|
230
|
+
boundary: h = "clippingAncestors",
|
|
231
|
+
rootBoundary: c = "viewport",
|
|
232
232
|
elementContext: p = "floating",
|
|
233
233
|
altBoundary: u = !1,
|
|
234
234
|
padding: m = 0
|
|
235
|
-
} = le(e, o), b = xt(m),
|
|
236
|
-
element: (t = await (r.isElement == null ? void 0 : r.isElement(
|
|
237
|
-
boundary:
|
|
238
|
-
rootBoundary:
|
|
235
|
+
} = le(e, o), b = xt(m), g = a[u ? p === "floating" ? "reference" : "floating" : p], v = ae(await r.getClippingRect({
|
|
236
|
+
element: (t = await (r.isElement == null ? void 0 : r.isElement(g))) == null || t ? g : g.contextElement || await (r.getDocumentElement == null ? void 0 : r.getDocumentElement(a.floating)),
|
|
237
|
+
boundary: h,
|
|
238
|
+
rootBoundary: c,
|
|
239
239
|
strategy: l
|
|
240
|
-
})),
|
|
240
|
+
})), _ = p === "floating" ? {
|
|
241
241
|
x: s,
|
|
242
242
|
y: i,
|
|
243
|
-
width:
|
|
244
|
-
height:
|
|
245
|
-
} :
|
|
243
|
+
width: n.floating.width,
|
|
244
|
+
height: n.floating.height
|
|
245
|
+
} : n.reference, w = await (r.getOffsetParent == null ? void 0 : r.getOffsetParent(a.floating)), C = await (r.isElement == null ? void 0 : r.isElement(w)) ? await (r.getScale == null ? void 0 : r.getScale(w)) || {
|
|
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:
|
|
251
|
+
}, k = ae(r.convertOffsetParentRelativeRectToViewportRelativeRect ? await r.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
252
|
+
elements: a,
|
|
253
|
+
rect: _,
|
|
254
|
+
offsetParent: w,
|
|
255
255
|
strategy: l
|
|
256
|
-
}) :
|
|
256
|
+
}) : _);
|
|
257
257
|
return {
|
|
258
|
-
top: (v.top -
|
|
259
|
-
bottom: (
|
|
260
|
-
left: (v.left -
|
|
261
|
-
right: (
|
|
258
|
+
top: (v.top - k.top + b.top) / C.y,
|
|
259
|
+
bottom: (k.bottom - v.bottom + b.bottom) / C.y,
|
|
260
|
+
left: (v.left - k.left + b.left) / C.x,
|
|
261
|
+
right: (k.right - v.right + b.right) / C.x
|
|
262
262
|
};
|
|
263
263
|
}
|
|
264
264
|
const St = function(o) {
|
|
@@ -270,38 +270,38 @@ const St = function(o) {
|
|
|
270
270
|
const {
|
|
271
271
|
placement: i,
|
|
272
272
|
middlewareData: r,
|
|
273
|
-
rects:
|
|
274
|
-
initialPlacement:
|
|
273
|
+
rects: n,
|
|
274
|
+
initialPlacement: a,
|
|
275
275
|
platform: l,
|
|
276
|
-
elements:
|
|
276
|
+
elements: h
|
|
277
277
|
} = e, {
|
|
278
|
-
mainAxis:
|
|
278
|
+
mainAxis: c = !0,
|
|
279
279
|
crossAxis: p = !0,
|
|
280
280
|
fallbackPlacements: u,
|
|
281
281
|
fallbackStrategy: m = "bestFit",
|
|
282
282
|
fallbackAxisSideDirection: b = "none",
|
|
283
|
-
flipAlignment:
|
|
284
|
-
...
|
|
283
|
+
flipAlignment: f = !0,
|
|
284
|
+
...g
|
|
285
285
|
} = le(o, e);
|
|
286
286
|
if ((t = r.arrow) != null && t.alignmentOffset)
|
|
287
287
|
return {};
|
|
288
|
-
const v = N(i),
|
|
289
|
-
!u && Y &&
|
|
290
|
-
const j = [
|
|
288
|
+
const v = N(i), _ = V(a), w = N(a) === a, C = await (l.isRTL == null ? void 0 : l.isRTL(h.floating)), k = u || (w || !f ? [ne(a)] : ft(a)), Y = b !== "none";
|
|
289
|
+
!u && Y && k.push(...wt(a, f, b, C));
|
|
290
|
+
const j = [a, ...k], ue = await Ye(e, g), te = [];
|
|
291
291
|
let U = ((s = r.flip) == null ? void 0 : s.overflows) || [];
|
|
292
|
-
if (
|
|
293
|
-
const $ = gt(i,
|
|
292
|
+
if (c && te.push(ue[v]), p) {
|
|
293
|
+
const $ = gt(i, n, C);
|
|
294
294
|
te.push(ue[$[0]], ue[$[1]]);
|
|
295
295
|
}
|
|
296
296
|
if (U = [...U, {
|
|
297
297
|
placement: i,
|
|
298
298
|
overflows: te
|
|
299
299
|
}], !te.every(($) => $ <= 0)) {
|
|
300
|
-
var Pe,
|
|
300
|
+
var Pe, Le;
|
|
301
301
|
const $ = (((Pe = r.flip) == null ? void 0 : Pe.index) || 0) + 1, be = j[$];
|
|
302
|
-
if (be && (!(p === "alignment" ?
|
|
302
|
+
if (be && (!(p === "alignment" ? _ !== V(be) : !1) || // We leave the current main axis only if every placement on that axis
|
|
303
303
|
// overflows the main axis.
|
|
304
|
-
U.every((
|
|
304
|
+
U.every((O) => V(O.placement) === _ ? O.overflows[0] > 0 : !0)))
|
|
305
305
|
return {
|
|
306
306
|
data: {
|
|
307
307
|
index: $,
|
|
@@ -311,31 +311,31 @@ const St = function(o) {
|
|
|
311
311
|
placement: be
|
|
312
312
|
}
|
|
313
313
|
};
|
|
314
|
-
let
|
|
315
|
-
if (!
|
|
314
|
+
let X = (Le = U.filter((R) => R.overflows[0] <= 0).sort((R, O) => R.overflows[1] - O.overflows[1])[0]) == null ? void 0 : Le.placement;
|
|
315
|
+
if (!X)
|
|
316
316
|
switch (m) {
|
|
317
317
|
case "bestFit": {
|
|
318
318
|
var Ee;
|
|
319
|
-
const R = (Ee = U.filter((
|
|
319
|
+
const R = (Ee = U.filter((O) => {
|
|
320
320
|
if (Y) {
|
|
321
|
-
const
|
|
322
|
-
return
|
|
321
|
+
const z = V(O.placement);
|
|
322
|
+
return z === _ || // Create a bias to the `y` side axis due to horizontal
|
|
323
323
|
// reading directions favoring greater width.
|
|
324
|
-
|
|
324
|
+
z === "y";
|
|
325
325
|
}
|
|
326
326
|
return !0;
|
|
327
|
-
}).map((
|
|
328
|
-
R && (
|
|
327
|
+
}).map((O) => [O.placement, O.overflows.filter((z) => z > 0).reduce((z, dt) => z + dt, 0)]).sort((O, z) => O[1] - z[1])[0]) == null ? void 0 : Ee[0];
|
|
328
|
+
R && (X = R);
|
|
329
329
|
break;
|
|
330
330
|
}
|
|
331
331
|
case "initialPlacement":
|
|
332
|
-
|
|
332
|
+
X = a;
|
|
333
333
|
break;
|
|
334
334
|
}
|
|
335
|
-
if (i !==
|
|
335
|
+
if (i !== X)
|
|
336
336
|
return {
|
|
337
337
|
reset: {
|
|
338
|
-
placement:
|
|
338
|
+
placement: X
|
|
339
339
|
}
|
|
340
340
|
};
|
|
341
341
|
}
|
|
@@ -343,12 +343,12 @@ const St = function(o) {
|
|
|
343
343
|
}
|
|
344
344
|
};
|
|
345
345
|
}, Tt = /* @__PURE__ */ new Set(["left", "top"]);
|
|
346
|
-
async function
|
|
346
|
+
async function Ot(o, e) {
|
|
347
347
|
const {
|
|
348
348
|
placement: t,
|
|
349
349
|
platform: s,
|
|
350
350
|
elements: i
|
|
351
|
-
} = o, r = await (s.isRTL == null ? void 0 : s.isRTL(i.floating)),
|
|
351
|
+
} = o, r = await (s.isRTL == null ? void 0 : s.isRTL(i.floating)), n = N(t), a = ce(t), l = V(t) === "y", h = Tt.has(n) ? -1 : 1, c = r && l ? -1 : 1, p = le(e, o);
|
|
352
352
|
let {
|
|
353
353
|
mainAxis: u,
|
|
354
354
|
crossAxis: m,
|
|
@@ -362,15 +362,15 @@ async function It(o, e) {
|
|
|
362
362
|
crossAxis: p.crossAxis || 0,
|
|
363
363
|
alignmentAxis: p.alignmentAxis
|
|
364
364
|
};
|
|
365
|
-
return
|
|
366
|
-
x: m *
|
|
367
|
-
y: u *
|
|
365
|
+
return a && typeof b == "number" && (m = a === "end" ? b * -1 : b), l ? {
|
|
366
|
+
x: m * c,
|
|
367
|
+
y: u * h
|
|
368
368
|
} : {
|
|
369
|
-
x: u *
|
|
370
|
-
y: m *
|
|
369
|
+
x: u * h,
|
|
370
|
+
y: m * c
|
|
371
371
|
};
|
|
372
372
|
}
|
|
373
|
-
const
|
|
373
|
+
const It = function(o) {
|
|
374
374
|
return o === void 0 && (o = 0), {
|
|
375
375
|
name: "offset",
|
|
376
376
|
options: o,
|
|
@@ -379,15 +379,15 @@ const Ot = function(o) {
|
|
|
379
379
|
const {
|
|
380
380
|
x: i,
|
|
381
381
|
y: r,
|
|
382
|
-
placement:
|
|
383
|
-
middlewareData:
|
|
384
|
-
} = e, l = await
|
|
385
|
-
return
|
|
382
|
+
placement: n,
|
|
383
|
+
middlewareData: a
|
|
384
|
+
} = e, l = await Ot(e, o);
|
|
385
|
+
return n === ((t = a.offset) == null ? void 0 : t.placement) && (s = a.arrow) != null && s.alignmentOffset ? {} : {
|
|
386
386
|
x: i + l.x,
|
|
387
387
|
y: r + l.y,
|
|
388
388
|
data: {
|
|
389
389
|
...l,
|
|
390
|
-
placement:
|
|
390
|
+
placement: n
|
|
391
391
|
}
|
|
392
392
|
};
|
|
393
393
|
}
|
|
@@ -403,46 +403,46 @@ const Ot = function(o) {
|
|
|
403
403
|
placement: i
|
|
404
404
|
} = e, {
|
|
405
405
|
mainAxis: r = !0,
|
|
406
|
-
crossAxis:
|
|
407
|
-
limiter:
|
|
408
|
-
fn: (
|
|
406
|
+
crossAxis: n = !1,
|
|
407
|
+
limiter: a = {
|
|
408
|
+
fn: (g) => {
|
|
409
409
|
let {
|
|
410
410
|
x: v,
|
|
411
|
-
y:
|
|
412
|
-
} =
|
|
411
|
+
y: _
|
|
412
|
+
} = g;
|
|
413
413
|
return {
|
|
414
414
|
x: v,
|
|
415
|
-
y:
|
|
415
|
+
y: _
|
|
416
416
|
};
|
|
417
417
|
}
|
|
418
418
|
},
|
|
419
419
|
...l
|
|
420
|
-
} = le(o, e),
|
|
420
|
+
} = le(o, e), h = {
|
|
421
421
|
x: t,
|
|
422
422
|
y: s
|
|
423
|
-
},
|
|
424
|
-
let m =
|
|
423
|
+
}, c = await Ye(e, l), p = V(N(i)), u = Ge(p);
|
|
424
|
+
let m = h[u], b = h[p];
|
|
425
425
|
if (r) {
|
|
426
|
-
const
|
|
427
|
-
m =
|
|
426
|
+
const g = u === "y" ? "top" : "left", v = u === "y" ? "bottom" : "right", _ = m + c[g], w = m - c[v];
|
|
427
|
+
m = De(_, m, w);
|
|
428
428
|
}
|
|
429
|
-
if (
|
|
430
|
-
const
|
|
431
|
-
b =
|
|
429
|
+
if (n) {
|
|
430
|
+
const g = p === "y" ? "top" : "left", v = p === "y" ? "bottom" : "right", _ = b + c[g], w = b - c[v];
|
|
431
|
+
b = De(_, b, w);
|
|
432
432
|
}
|
|
433
|
-
const
|
|
433
|
+
const f = a.fn({
|
|
434
434
|
...e,
|
|
435
435
|
[u]: m,
|
|
436
436
|
[p]: b
|
|
437
437
|
});
|
|
438
438
|
return {
|
|
439
|
-
...
|
|
439
|
+
...f,
|
|
440
440
|
data: {
|
|
441
|
-
x:
|
|
442
|
-
y:
|
|
441
|
+
x: f.x - t,
|
|
442
|
+
y: f.y - s,
|
|
443
443
|
enabled: {
|
|
444
444
|
[u]: r,
|
|
445
|
-
[p]:
|
|
445
|
+
[p]: n
|
|
446
446
|
}
|
|
447
447
|
}
|
|
448
448
|
};
|
|
@@ -453,17 +453,17 @@ function de() {
|
|
|
453
453
|
return typeof window < "u";
|
|
454
454
|
}
|
|
455
455
|
function q(o) {
|
|
456
|
-
return
|
|
456
|
+
return Xe(o) ? (o.nodeName || "").toLowerCase() : "#document";
|
|
457
457
|
}
|
|
458
458
|
function T(o) {
|
|
459
459
|
var e;
|
|
460
460
|
return (o == null || (e = o.ownerDocument) == null ? void 0 : e.defaultView) || window;
|
|
461
461
|
}
|
|
462
|
-
function
|
|
462
|
+
function D(o) {
|
|
463
463
|
var e;
|
|
464
|
-
return (e = (
|
|
464
|
+
return (e = (Xe(o) ? o.ownerDocument : o.document) || window.document) == null ? void 0 : e.documentElement;
|
|
465
465
|
}
|
|
466
|
-
function
|
|
466
|
+
function Xe(o) {
|
|
467
467
|
return de() ? o instanceof Node || o instanceof T(o).Node : !1;
|
|
468
468
|
}
|
|
469
469
|
function A(o) {
|
|
@@ -475,18 +475,18 @@ function E(o) {
|
|
|
475
475
|
function $e(o) {
|
|
476
476
|
return !de() || typeof ShadowRoot > "u" ? !1 : o instanceof ShadowRoot || o instanceof T(o).ShadowRoot;
|
|
477
477
|
}
|
|
478
|
-
const
|
|
478
|
+
const Mt = /* @__PURE__ */ new Set(["inline", "contents"]);
|
|
479
479
|
function ee(o) {
|
|
480
480
|
const {
|
|
481
481
|
overflow: e,
|
|
482
482
|
overflowX: t,
|
|
483
483
|
overflowY: s,
|
|
484
484
|
display: i
|
|
485
|
-
} =
|
|
486
|
-
return /auto|scroll|overlay|hidden|clip/.test(e + s + t) && !
|
|
485
|
+
} = M(o);
|
|
486
|
+
return /auto|scroll|overlay|hidden|clip/.test(e + s + t) && !Mt.has(i);
|
|
487
487
|
}
|
|
488
488
|
const Pt = /* @__PURE__ */ new Set(["table", "td", "th"]);
|
|
489
|
-
function
|
|
489
|
+
function Lt(o) {
|
|
490
490
|
return Pt.has(q(o));
|
|
491
491
|
}
|
|
492
492
|
const Et = [":popover-open", ":modal"];
|
|
@@ -499,10 +499,10 @@ function he(o) {
|
|
|
499
499
|
}
|
|
500
500
|
});
|
|
501
501
|
}
|
|
502
|
-
const
|
|
502
|
+
const Dt = ["transform", "translate", "scale", "rotate", "perspective"], zt = ["transform", "translate", "scale", "rotate", "perspective", "filter"], Vt = ["paint", "layout", "strict", "content"];
|
|
503
503
|
function Te(o) {
|
|
504
|
-
const e =
|
|
505
|
-
return
|
|
504
|
+
const e = Oe(), t = A(o) ? M(o) : o;
|
|
505
|
+
return Dt.some((s) => t[s] ? t[s] !== "none" : !1) || (t.containerType ? t.containerType !== "normal" : !1) || !e && (t.backdropFilter ? t.backdropFilter !== "none" : !1) || !e && (t.filter ? t.filter !== "none" : !1) || zt.some((s) => (t.willChange || "").includes(s)) || Vt.some((s) => (t.contain || "").includes(s));
|
|
506
506
|
}
|
|
507
507
|
function Bt(o) {
|
|
508
508
|
let e = B(o);
|
|
@@ -515,14 +515,14 @@ function Bt(o) {
|
|
|
515
515
|
}
|
|
516
516
|
return null;
|
|
517
517
|
}
|
|
518
|
-
function
|
|
518
|
+
function Oe() {
|
|
519
519
|
return typeof CSS > "u" || !CSS.supports ? !1 : CSS.supports("-webkit-backdrop-filter", "none");
|
|
520
520
|
}
|
|
521
521
|
const $t = /* @__PURE__ */ new Set(["html", "body", "#document"]);
|
|
522
522
|
function K(o) {
|
|
523
523
|
return $t.has(q(o));
|
|
524
524
|
}
|
|
525
|
-
function
|
|
525
|
+
function M(o) {
|
|
526
526
|
return T(o).getComputedStyle(o);
|
|
527
527
|
}
|
|
528
528
|
function me(o) {
|
|
@@ -542,21 +542,21 @@ function B(o) {
|
|
|
542
542
|
o.assignedSlot || // DOM Element detected.
|
|
543
543
|
o.parentNode || // ShadowRoot detected.
|
|
544
544
|
$e(o) && o.host || // Fallback.
|
|
545
|
-
|
|
545
|
+
D(o)
|
|
546
546
|
);
|
|
547
547
|
return $e(e) ? e.host : e;
|
|
548
548
|
}
|
|
549
|
-
function
|
|
549
|
+
function Je(o) {
|
|
550
550
|
const e = B(o);
|
|
551
|
-
return K(e) ? o.ownerDocument ? o.ownerDocument.body : o.body : E(e) && ee(e) ? e :
|
|
551
|
+
return K(e) ? o.ownerDocument ? o.ownerDocument.body : o.body : E(e) && ee(e) ? e : Je(e);
|
|
552
552
|
}
|
|
553
553
|
function Z(o, e, t) {
|
|
554
554
|
var s;
|
|
555
555
|
e === void 0 && (e = []), t === void 0 && (t = !0);
|
|
556
|
-
const i =
|
|
556
|
+
const i = Je(o), r = i === ((s = o.ownerDocument) == null ? void 0 : s.body), n = T(i);
|
|
557
557
|
if (r) {
|
|
558
|
-
const
|
|
559
|
-
return e.concat(
|
|
558
|
+
const a = ve(n);
|
|
559
|
+
return e.concat(n, n.visualViewport || [], ee(i) ? i : [], a && t ? Z(a) : []);
|
|
560
560
|
}
|
|
561
561
|
return e.concat(i, Z(i, [], t));
|
|
562
562
|
}
|
|
@@ -564,37 +564,37 @@ function ve(o) {
|
|
|
564
564
|
return o.parent && Object.getPrototypeOf(o.parent) ? o.frameElement : null;
|
|
565
565
|
}
|
|
566
566
|
function Ze(o) {
|
|
567
|
-
const e =
|
|
567
|
+
const e = M(o);
|
|
568
568
|
let t = parseFloat(e.width) || 0, s = parseFloat(e.height) || 0;
|
|
569
|
-
const i = E(o), r = i ? o.offsetWidth : t,
|
|
570
|
-
return
|
|
569
|
+
const i = E(o), r = i ? o.offsetWidth : t, n = i ? o.offsetHeight : s, a = re(t) !== r || re(s) !== n;
|
|
570
|
+
return a && (t = r, s = n), {
|
|
571
571
|
width: t,
|
|
572
572
|
height: s,
|
|
573
|
-
$:
|
|
573
|
+
$: a
|
|
574
574
|
};
|
|
575
575
|
}
|
|
576
|
-
function
|
|
576
|
+
function Ie(o) {
|
|
577
577
|
return A(o) ? o : o.contextElement;
|
|
578
578
|
}
|
|
579
579
|
function G(o) {
|
|
580
|
-
const e =
|
|
580
|
+
const e = Ie(o);
|
|
581
581
|
if (!E(e))
|
|
582
|
-
return
|
|
582
|
+
return L(1);
|
|
583
583
|
const t = e.getBoundingClientRect(), {
|
|
584
584
|
width: s,
|
|
585
585
|
height: i,
|
|
586
586
|
$: r
|
|
587
587
|
} = Ze(e);
|
|
588
|
-
let
|
|
589
|
-
return (!
|
|
590
|
-
x:
|
|
591
|
-
y:
|
|
588
|
+
let n = (r ? re(t.width) : t.width) / s, a = (r ? re(t.height) : t.height) / i;
|
|
589
|
+
return (!n || !Number.isFinite(n)) && (n = 1), (!a || !Number.isFinite(a)) && (a = 1), {
|
|
590
|
+
x: n,
|
|
591
|
+
y: a
|
|
592
592
|
};
|
|
593
593
|
}
|
|
594
|
-
const Rt = /* @__PURE__ */
|
|
594
|
+
const Rt = /* @__PURE__ */ L(0);
|
|
595
595
|
function Qe(o) {
|
|
596
596
|
const e = T(o);
|
|
597
|
-
return !
|
|
597
|
+
return !Oe() || !e.visualViewport ? Rt : {
|
|
598
598
|
x: e.visualViewport.offsetLeft,
|
|
599
599
|
y: e.visualViewport.offsetTop
|
|
600
600
|
};
|
|
@@ -604,29 +604,29 @@ function Ht(o, e, t) {
|
|
|
604
604
|
}
|
|
605
605
|
function W(o, e, t, s) {
|
|
606
606
|
e === void 0 && (e = !1), t === void 0 && (t = !1);
|
|
607
|
-
const i = o.getBoundingClientRect(), r =
|
|
608
|
-
let
|
|
609
|
-
e && (s ? A(s) && (
|
|
610
|
-
const
|
|
611
|
-
let l = (i.left +
|
|
607
|
+
const i = o.getBoundingClientRect(), r = Ie(o);
|
|
608
|
+
let n = L(1);
|
|
609
|
+
e && (s ? A(s) && (n = G(s)) : n = G(o));
|
|
610
|
+
const a = Ht(r, t, s) ? Qe(r) : L(0);
|
|
611
|
+
let l = (i.left + a.x) / n.x, h = (i.top + a.y) / n.y, c = i.width / n.x, p = i.height / n.y;
|
|
612
612
|
if (r) {
|
|
613
613
|
const u = T(r), m = s && A(s) ? T(s) : s;
|
|
614
|
-
let b = u,
|
|
615
|
-
for (;
|
|
616
|
-
const
|
|
617
|
-
l *=
|
|
614
|
+
let b = u, f = ve(b);
|
|
615
|
+
for (; f && s && m !== b; ) {
|
|
616
|
+
const g = G(f), v = f.getBoundingClientRect(), _ = M(f), w = v.left + (f.clientLeft + parseFloat(_.paddingLeft)) * g.x, C = v.top + (f.clientTop + parseFloat(_.paddingTop)) * g.y;
|
|
617
|
+
l *= g.x, h *= g.y, c *= g.x, p *= g.y, l += w, h += C, b = T(f), f = ve(b);
|
|
618
618
|
}
|
|
619
619
|
}
|
|
620
|
-
return
|
|
621
|
-
width:
|
|
620
|
+
return ae({
|
|
621
|
+
width: c,
|
|
622
622
|
height: p,
|
|
623
623
|
x: l,
|
|
624
|
-
y:
|
|
624
|
+
y: h
|
|
625
625
|
});
|
|
626
626
|
}
|
|
627
627
|
function pe(o, e) {
|
|
628
628
|
const t = me(o).scrollLeft;
|
|
629
|
-
return e ? e.left + t : W(
|
|
629
|
+
return e ? e.left + t : W(D(o)).left + t;
|
|
630
630
|
}
|
|
631
631
|
function et(o, e) {
|
|
632
632
|
const t = o.getBoundingClientRect(), s = t.left + e.scrollLeft - pe(o, t), i = t.top + e.scrollTop;
|
|
@@ -642,69 +642,69 @@ function Ft(o) {
|
|
|
642
642
|
offsetParent: s,
|
|
643
643
|
strategy: i
|
|
644
644
|
} = o;
|
|
645
|
-
const r = i === "fixed",
|
|
646
|
-
if (s ===
|
|
645
|
+
const r = i === "fixed", n = D(s), a = e ? he(e.floating) : !1;
|
|
646
|
+
if (s === n || a && r)
|
|
647
647
|
return t;
|
|
648
648
|
let l = {
|
|
649
649
|
scrollLeft: 0,
|
|
650
650
|
scrollTop: 0
|
|
651
|
-
},
|
|
652
|
-
const
|
|
653
|
-
if ((p || !p && !r) && ((q(s) !== "body" || ee(
|
|
651
|
+
}, h = L(1);
|
|
652
|
+
const c = L(0), p = E(s);
|
|
653
|
+
if ((p || !p && !r) && ((q(s) !== "body" || ee(n)) && (l = me(s)), E(s))) {
|
|
654
654
|
const m = W(s);
|
|
655
|
-
|
|
655
|
+
h = G(s), c.x = m.x + s.clientLeft, c.y = m.y + s.clientTop;
|
|
656
656
|
}
|
|
657
|
-
const u =
|
|
657
|
+
const u = n && !p && !r ? et(n, l) : L(0);
|
|
658
658
|
return {
|
|
659
|
-
width: t.width *
|
|
660
|
-
height: t.height *
|
|
661
|
-
x: t.x *
|
|
662
|
-
y: t.y *
|
|
659
|
+
width: t.width * h.x,
|
|
660
|
+
height: t.height * h.y,
|
|
661
|
+
x: t.x * h.x - l.scrollLeft * h.x + c.x + u.x,
|
|
662
|
+
y: t.y * h.y - l.scrollTop * h.y + c.y + u.y
|
|
663
663
|
};
|
|
664
664
|
}
|
|
665
665
|
function Nt(o) {
|
|
666
666
|
return Array.from(o.getClientRects());
|
|
667
667
|
}
|
|
668
668
|
function Wt(o) {
|
|
669
|
-
const e =
|
|
670
|
-
let
|
|
671
|
-
const
|
|
672
|
-
return
|
|
669
|
+
const e = D(o), t = me(o), s = o.ownerDocument.body, i = F(e.scrollWidth, e.clientWidth, s.scrollWidth, s.clientWidth), r = F(e.scrollHeight, e.clientHeight, s.scrollHeight, s.clientHeight);
|
|
670
|
+
let n = -t.scrollLeft + pe(o);
|
|
671
|
+
const a = -t.scrollTop;
|
|
672
|
+
return M(s).direction === "rtl" && (n += F(e.clientWidth, s.clientWidth) - i), {
|
|
673
673
|
width: i,
|
|
674
674
|
height: r,
|
|
675
|
-
x:
|
|
676
|
-
y:
|
|
675
|
+
x: n,
|
|
676
|
+
y: a
|
|
677
677
|
};
|
|
678
678
|
}
|
|
679
679
|
const Re = 25;
|
|
680
680
|
function jt(o, e) {
|
|
681
|
-
const t = T(o), s =
|
|
682
|
-
let r = s.clientWidth,
|
|
681
|
+
const t = T(o), s = D(o), i = t.visualViewport;
|
|
682
|
+
let r = s.clientWidth, n = s.clientHeight, a = 0, l = 0;
|
|
683
683
|
if (i) {
|
|
684
|
-
r = i.width,
|
|
685
|
-
const
|
|
686
|
-
(!
|
|
684
|
+
r = i.width, n = i.height;
|
|
685
|
+
const c = Oe();
|
|
686
|
+
(!c || c && e === "fixed") && (a = i.offsetLeft, l = i.offsetTop);
|
|
687
687
|
}
|
|
688
|
-
const
|
|
689
|
-
if (
|
|
690
|
-
const
|
|
688
|
+
const h = pe(s);
|
|
689
|
+
if (h <= 0) {
|
|
690
|
+
const c = s.ownerDocument, p = c.body, u = getComputedStyle(p), m = c.compatMode === "CSS1Compat" && parseFloat(u.marginLeft) + parseFloat(u.marginRight) || 0, b = Math.abs(s.clientWidth - p.clientWidth - m);
|
|
691
691
|
b <= Re && (r -= b);
|
|
692
|
-
} else
|
|
692
|
+
} else h <= Re && (r += h);
|
|
693
693
|
return {
|
|
694
694
|
width: r,
|
|
695
|
-
height:
|
|
696
|
-
x:
|
|
695
|
+
height: n,
|
|
696
|
+
x: a,
|
|
697
697
|
y: l
|
|
698
698
|
};
|
|
699
699
|
}
|
|
700
700
|
const Ut = /* @__PURE__ */ new Set(["absolute", "fixed"]);
|
|
701
701
|
function Gt(o, e) {
|
|
702
|
-
const t = W(o, !0, e === "fixed"), s = t.top + o.clientTop, i = t.left + o.clientLeft, r = E(o) ? G(o) :
|
|
702
|
+
const t = W(o, !0, e === "fixed"), s = t.top + o.clientTop, i = t.left + o.clientLeft, r = E(o) ? G(o) : L(1), n = o.clientWidth * r.x, a = o.clientHeight * r.y, l = i * r.x, h = s * r.y;
|
|
703
703
|
return {
|
|
704
|
-
width:
|
|
705
|
-
height:
|
|
704
|
+
width: n,
|
|
705
|
+
height: a,
|
|
706
706
|
x: l,
|
|
707
|
-
y:
|
|
707
|
+
y: h
|
|
708
708
|
};
|
|
709
709
|
}
|
|
710
710
|
function He(o, e, t) {
|
|
@@ -712,7 +712,7 @@ function He(o, e, t) {
|
|
|
712
712
|
if (e === "viewport")
|
|
713
713
|
s = jt(o, t);
|
|
714
714
|
else if (e === "document")
|
|
715
|
-
s = Wt(
|
|
715
|
+
s = Wt(D(o));
|
|
716
716
|
else if (A(e))
|
|
717
717
|
s = Gt(e, t);
|
|
718
718
|
else {
|
|
@@ -724,22 +724,22 @@ function He(o, e, t) {
|
|
|
724
724
|
height: e.height
|
|
725
725
|
};
|
|
726
726
|
}
|
|
727
|
-
return
|
|
727
|
+
return ae(s);
|
|
728
728
|
}
|
|
729
729
|
function tt(o, e) {
|
|
730
730
|
const t = B(o);
|
|
731
|
-
return t === e || !A(t) || K(t) ? !1 :
|
|
731
|
+
return t === e || !A(t) || K(t) ? !1 : M(t).position === "fixed" || tt(t, e);
|
|
732
732
|
}
|
|
733
733
|
function Kt(o, e) {
|
|
734
734
|
const t = e.get(o);
|
|
735
735
|
if (t)
|
|
736
736
|
return t;
|
|
737
|
-
let s = Z(o, [], !1).filter((
|
|
738
|
-
const r =
|
|
739
|
-
let
|
|
740
|
-
for (; A(
|
|
741
|
-
const
|
|
742
|
-
!l &&
|
|
737
|
+
let s = Z(o, [], !1).filter((a) => A(a) && q(a) !== "body"), i = null;
|
|
738
|
+
const r = M(o).position === "fixed";
|
|
739
|
+
let n = r ? B(o) : o;
|
|
740
|
+
for (; A(n) && !K(n); ) {
|
|
741
|
+
const a = M(n), l = Te(n);
|
|
742
|
+
!l && a.position === "fixed" && (i = null), (r ? !l && !i : !l && a.position === "static" && !!i && Ut.has(i.position) || ee(n) && !l && tt(o, n)) ? s = s.filter((c) => c !== n) : i = a, n = B(n);
|
|
743
743
|
}
|
|
744
744
|
return e.set(o, s), s;
|
|
745
745
|
}
|
|
@@ -750,10 +750,10 @@ function qt(o) {
|
|
|
750
750
|
rootBoundary: s,
|
|
751
751
|
strategy: i
|
|
752
752
|
} = o;
|
|
753
|
-
const
|
|
754
|
-
const p = He(e,
|
|
755
|
-
return
|
|
756
|
-
}, He(e,
|
|
753
|
+
const n = [...t === "clippingAncestors" ? he(e) ? [] : Kt(e, this._c) : [].concat(t), s], a = n[0], l = n.reduce((h, c) => {
|
|
754
|
+
const p = He(e, c, i);
|
|
755
|
+
return h.top = F(p.top, h.top), h.right = ie(p.right, h.right), h.bottom = ie(p.bottom, h.bottom), h.left = F(p.left, h.left), h;
|
|
756
|
+
}, He(e, a, i));
|
|
757
757
|
return {
|
|
758
758
|
width: l.right - l.left,
|
|
759
759
|
height: l.bottom - l.top,
|
|
@@ -771,40 +771,40 @@ function Yt(o) {
|
|
|
771
771
|
height: t
|
|
772
772
|
};
|
|
773
773
|
}
|
|
774
|
-
function
|
|
775
|
-
const s = E(e), i =
|
|
776
|
-
let
|
|
774
|
+
function Xt(o, e, t) {
|
|
775
|
+
const s = E(e), i = D(e), r = t === "fixed", n = W(o, !0, r, e);
|
|
776
|
+
let a = {
|
|
777
777
|
scrollLeft: 0,
|
|
778
778
|
scrollTop: 0
|
|
779
779
|
};
|
|
780
|
-
const l =
|
|
781
|
-
function
|
|
780
|
+
const l = L(0);
|
|
781
|
+
function h() {
|
|
782
782
|
l.x = pe(i);
|
|
783
783
|
}
|
|
784
784
|
if (s || !s && !r)
|
|
785
|
-
if ((q(e) !== "body" || ee(i)) && (
|
|
785
|
+
if ((q(e) !== "body" || ee(i)) && (a = me(e)), s) {
|
|
786
786
|
const m = W(e, !0, r, e);
|
|
787
787
|
l.x = m.x + e.clientLeft, l.y = m.y + e.clientTop;
|
|
788
|
-
} else i &&
|
|
789
|
-
r && !s && i &&
|
|
790
|
-
const
|
|
788
|
+
} else i && h();
|
|
789
|
+
r && !s && i && h();
|
|
790
|
+
const c = i && !s && !r ? et(i, a) : L(0), p = n.left + a.scrollLeft - l.x - c.x, u = n.top + a.scrollTop - l.y - c.y;
|
|
791
791
|
return {
|
|
792
792
|
x: p,
|
|
793
793
|
y: u,
|
|
794
|
-
width:
|
|
795
|
-
height:
|
|
794
|
+
width: n.width,
|
|
795
|
+
height: n.height
|
|
796
796
|
};
|
|
797
797
|
}
|
|
798
798
|
function ge(o) {
|
|
799
|
-
return
|
|
799
|
+
return M(o).position === "static";
|
|
800
800
|
}
|
|
801
801
|
function Fe(o, e) {
|
|
802
|
-
if (!E(o) ||
|
|
802
|
+
if (!E(o) || M(o).position === "fixed")
|
|
803
803
|
return null;
|
|
804
804
|
if (e)
|
|
805
805
|
return e(o);
|
|
806
806
|
let t = o.offsetParent;
|
|
807
|
-
return
|
|
807
|
+
return D(o) === t && (t = t.ownerDocument.body), t;
|
|
808
808
|
}
|
|
809
809
|
function st(o, e) {
|
|
810
810
|
const t = T(o);
|
|
@@ -820,14 +820,14 @@ function st(o, e) {
|
|
|
820
820
|
return t;
|
|
821
821
|
}
|
|
822
822
|
let s = Fe(o, e);
|
|
823
|
-
for (; s &&
|
|
823
|
+
for (; s && Lt(s) && ge(s); )
|
|
824
824
|
s = Fe(s, e);
|
|
825
825
|
return s && K(s) && ge(s) && !Te(s) ? t : s || Bt(o) || t;
|
|
826
826
|
}
|
|
827
|
-
const
|
|
827
|
+
const Jt = async function(o) {
|
|
828
828
|
const e = this.getOffsetParent || st, t = this.getDimensions, s = await t(o.floating);
|
|
829
829
|
return {
|
|
830
|
-
reference:
|
|
830
|
+
reference: Xt(o.reference, await e(o.floating), o.strategy),
|
|
831
831
|
floating: {
|
|
832
832
|
x: 0,
|
|
833
833
|
y: 0,
|
|
@@ -837,14 +837,14 @@ const Xt = async function(o) {
|
|
|
837
837
|
};
|
|
838
838
|
};
|
|
839
839
|
function Zt(o) {
|
|
840
|
-
return
|
|
840
|
+
return M(o).direction === "rtl";
|
|
841
841
|
}
|
|
842
842
|
const ot = {
|
|
843
843
|
convertOffsetParentRelativeRectToViewportRelativeRect: Ft,
|
|
844
|
-
getDocumentElement:
|
|
844
|
+
getDocumentElement: D,
|
|
845
845
|
getClippingRect: qt,
|
|
846
846
|
getOffsetParent: st,
|
|
847
|
-
getElementRects:
|
|
847
|
+
getElementRects: Jt,
|
|
848
848
|
getClientRects: Nt,
|
|
849
849
|
getDimensions: Yt,
|
|
850
850
|
getScale: G,
|
|
@@ -856,87 +856,87 @@ function it(o, e) {
|
|
|
856
856
|
}
|
|
857
857
|
function Qt(o, e) {
|
|
858
858
|
let t = null, s;
|
|
859
|
-
const i =
|
|
859
|
+
const i = D(o);
|
|
860
860
|
function r() {
|
|
861
|
-
var
|
|
862
|
-
clearTimeout(s), (
|
|
861
|
+
var a;
|
|
862
|
+
clearTimeout(s), (a = t) == null || a.disconnect(), t = null;
|
|
863
863
|
}
|
|
864
|
-
function a
|
|
865
|
-
|
|
866
|
-
const
|
|
867
|
-
left:
|
|
864
|
+
function n(a, l) {
|
|
865
|
+
a === void 0 && (a = !1), l === void 0 && (l = 1), r();
|
|
866
|
+
const h = o.getBoundingClientRect(), {
|
|
867
|
+
left: c,
|
|
868
868
|
top: p,
|
|
869
869
|
width: u,
|
|
870
870
|
height: m
|
|
871
|
-
} =
|
|
872
|
-
if (
|
|
871
|
+
} = h;
|
|
872
|
+
if (a || e(), !u || !m)
|
|
873
873
|
return;
|
|
874
|
-
const b = se(p),
|
|
875
|
-
rootMargin: -b + "px " + -
|
|
874
|
+
const b = se(p), f = se(i.clientWidth - (c + u)), g = se(i.clientHeight - (p + m)), v = se(c), w = {
|
|
875
|
+
rootMargin: -b + "px " + -f + "px " + -g + "px " + -v + "px",
|
|
876
876
|
threshold: F(0, ie(1, l)) || 1
|
|
877
877
|
};
|
|
878
878
|
let C = !0;
|
|
879
|
-
function
|
|
879
|
+
function k(Y) {
|
|
880
880
|
const j = Y[0].intersectionRatio;
|
|
881
881
|
if (j !== l) {
|
|
882
882
|
if (!C)
|
|
883
|
-
return
|
|
884
|
-
j ?
|
|
885
|
-
|
|
883
|
+
return n();
|
|
884
|
+
j ? n(!1, j) : s = setTimeout(() => {
|
|
885
|
+
n(!1, 1e-7);
|
|
886
886
|
}, 1e3);
|
|
887
887
|
}
|
|
888
|
-
j === 1 && !it(
|
|
888
|
+
j === 1 && !it(h, o.getBoundingClientRect()) && n(), C = !1;
|
|
889
889
|
}
|
|
890
890
|
try {
|
|
891
|
-
t = new IntersectionObserver(
|
|
892
|
-
...
|
|
891
|
+
t = new IntersectionObserver(k, {
|
|
892
|
+
...w,
|
|
893
893
|
// Handle <iframe>s
|
|
894
894
|
root: i.ownerDocument
|
|
895
895
|
});
|
|
896
896
|
} catch {
|
|
897
|
-
t = new IntersectionObserver(
|
|
897
|
+
t = new IntersectionObserver(k, w);
|
|
898
898
|
}
|
|
899
899
|
t.observe(o);
|
|
900
900
|
}
|
|
901
|
-
return
|
|
901
|
+
return n(!0), r;
|
|
902
902
|
}
|
|
903
903
|
function _e(o, e, t, s) {
|
|
904
904
|
s === void 0 && (s = {});
|
|
905
905
|
const {
|
|
906
906
|
ancestorScroll: i = !0,
|
|
907
907
|
ancestorResize: r = !0,
|
|
908
|
-
elementResize:
|
|
909
|
-
layoutShift:
|
|
908
|
+
elementResize: n = typeof ResizeObserver == "function",
|
|
909
|
+
layoutShift: a = typeof IntersectionObserver == "function",
|
|
910
910
|
animationFrame: l = !1
|
|
911
|
-
} = s,
|
|
912
|
-
|
|
911
|
+
} = s, h = Ie(o), c = i || r ? [...h ? Z(h) : [], ...Z(e)] : [];
|
|
912
|
+
c.forEach((v) => {
|
|
913
913
|
i && v.addEventListener("scroll", t, {
|
|
914
914
|
passive: !0
|
|
915
915
|
}), r && v.addEventListener("resize", t);
|
|
916
916
|
});
|
|
917
|
-
const p =
|
|
917
|
+
const p = h && a ? Qt(h, t) : null;
|
|
918
918
|
let u = -1, m = null;
|
|
919
|
-
|
|
920
|
-
let [
|
|
921
|
-
|
|
922
|
-
var
|
|
923
|
-
(
|
|
919
|
+
n && (m = new ResizeObserver((v) => {
|
|
920
|
+
let [_] = v;
|
|
921
|
+
_ && _.target === h && m && (m.unobserve(e), cancelAnimationFrame(u), u = requestAnimationFrame(() => {
|
|
922
|
+
var w;
|
|
923
|
+
(w = m) == null || w.observe(e);
|
|
924
924
|
})), t();
|
|
925
|
-
}),
|
|
926
|
-
let b,
|
|
927
|
-
l &&
|
|
928
|
-
function
|
|
925
|
+
}), h && !l && m.observe(h), m.observe(e));
|
|
926
|
+
let b, f = l ? W(o) : null;
|
|
927
|
+
l && g();
|
|
928
|
+
function g() {
|
|
929
929
|
const v = W(o);
|
|
930
|
-
|
|
930
|
+
f && !it(f, v) && t(), f = v, b = requestAnimationFrame(g);
|
|
931
931
|
}
|
|
932
932
|
return t(), () => {
|
|
933
933
|
var v;
|
|
934
|
-
|
|
935
|
-
i &&
|
|
934
|
+
c.forEach((_) => {
|
|
935
|
+
i && _.removeEventListener("scroll", t), r && _.removeEventListener("resize", t);
|
|
936
936
|
}), p == null || p(), (v = m) == null || v.disconnect(), m = null, l && cancelAnimationFrame(b);
|
|
937
937
|
};
|
|
938
938
|
}
|
|
939
|
-
const
|
|
939
|
+
const ye = It, we = At, rt = St, ke = (o, e, t) => {
|
|
940
940
|
const s = /* @__PURE__ */ new Map(), i = {
|
|
941
941
|
platform: ot,
|
|
942
942
|
...t
|
|
@@ -949,14 +949,14 @@ const ke = Ot, ye = At, rt = St, we = (o, e, t) => {
|
|
|
949
949
|
platform: r
|
|
950
950
|
});
|
|
951
951
|
};
|
|
952
|
-
var
|
|
953
|
-
},
|
|
952
|
+
var nt = function() {
|
|
953
|
+
}, I = "undefined", es = typeof window !== I && typeof window.navigator !== I && /Trident\/|MSIE /.test(window.navigator.userAgent), xe = [
|
|
954
954
|
"trace",
|
|
955
955
|
"debug",
|
|
956
956
|
"info",
|
|
957
957
|
"warn",
|
|
958
958
|
"error"
|
|
959
|
-
], Q = {},
|
|
959
|
+
], Q = {}, y = null;
|
|
960
960
|
function Ne(o, e) {
|
|
961
961
|
var t = o[e];
|
|
962
962
|
if (typeof t.bind == "function")
|
|
@@ -973,72 +973,72 @@ function ts() {
|
|
|
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
975
|
function ss(o) {
|
|
976
|
-
return o === "debug" && (o = "log"), typeof console ===
|
|
976
|
+
return o === "debug" && (o = "log"), typeof console === I ? !1 : o === "trace" && es ? ts : console[o] !== void 0 ? Ne(console, o) : console.log !== void 0 ? Ne(console, "log") : nt;
|
|
977
977
|
}
|
|
978
|
-
function
|
|
978
|
+
function J() {
|
|
979
979
|
for (var o = this.getLevel(), e = 0; e < xe.length; e++) {
|
|
980
980
|
var t = xe[e];
|
|
981
|
-
this[t] = e < o ?
|
|
981
|
+
this[t] = e < o ? nt : this.methodFactory(t, o, this.name);
|
|
982
982
|
}
|
|
983
|
-
if (this.log = this.debug, typeof console ===
|
|
983
|
+
if (this.log = this.debug, typeof console === I && o < this.levels.SILENT)
|
|
984
984
|
return "No console available for logging";
|
|
985
985
|
}
|
|
986
986
|
function os(o) {
|
|
987
987
|
return function() {
|
|
988
|
-
typeof console !==
|
|
988
|
+
typeof console !== I && (J.call(this), this[o].apply(this, arguments));
|
|
989
989
|
};
|
|
990
990
|
}
|
|
991
991
|
function is(o, e, t) {
|
|
992
992
|
return ss(o) || os.apply(this, arguments);
|
|
993
993
|
}
|
|
994
|
-
function
|
|
995
|
-
var t = this, s, i, r,
|
|
996
|
-
typeof o == "string" ?
|
|
997
|
-
function
|
|
994
|
+
function at(o, e) {
|
|
995
|
+
var t = this, s, i, r, n = "loglevel";
|
|
996
|
+
typeof o == "string" ? n += ":" + o : typeof o == "symbol" && (n = void 0);
|
|
997
|
+
function a(u) {
|
|
998
998
|
var m = (xe[u] || "silent").toUpperCase();
|
|
999
|
-
if (!(typeof window ===
|
|
999
|
+
if (!(typeof window === I || !n)) {
|
|
1000
1000
|
try {
|
|
1001
|
-
window.localStorage[
|
|
1001
|
+
window.localStorage[n] = m;
|
|
1002
1002
|
return;
|
|
1003
1003
|
} catch {
|
|
1004
1004
|
}
|
|
1005
1005
|
try {
|
|
1006
|
-
window.document.cookie = encodeURIComponent(
|
|
1006
|
+
window.document.cookie = encodeURIComponent(n) + "=" + m + ";";
|
|
1007
1007
|
} catch {
|
|
1008
1008
|
}
|
|
1009
1009
|
}
|
|
1010
1010
|
}
|
|
1011
1011
|
function l() {
|
|
1012
1012
|
var u;
|
|
1013
|
-
if (!(typeof window ===
|
|
1013
|
+
if (!(typeof window === I || !n)) {
|
|
1014
1014
|
try {
|
|
1015
|
-
u = window.localStorage[
|
|
1015
|
+
u = window.localStorage[n];
|
|
1016
1016
|
} catch {
|
|
1017
1017
|
}
|
|
1018
|
-
if (typeof u ===
|
|
1018
|
+
if (typeof u === I)
|
|
1019
1019
|
try {
|
|
1020
|
-
var m = window.document.cookie, b = encodeURIComponent(
|
|
1021
|
-
|
|
1022
|
-
m.slice(
|
|
1020
|
+
var m = window.document.cookie, b = encodeURIComponent(n), f = m.indexOf(b + "=");
|
|
1021
|
+
f !== -1 && (u = /^([^;]+)/.exec(
|
|
1022
|
+
m.slice(f + b.length + 1)
|
|
1023
1023
|
)[1]);
|
|
1024
1024
|
} catch {
|
|
1025
1025
|
}
|
|
1026
1026
|
return t.levels[u] === void 0 && (u = void 0), u;
|
|
1027
1027
|
}
|
|
1028
1028
|
}
|
|
1029
|
-
function
|
|
1030
|
-
if (!(typeof window ===
|
|
1029
|
+
function h() {
|
|
1030
|
+
if (!(typeof window === I || !n)) {
|
|
1031
1031
|
try {
|
|
1032
|
-
window.localStorage.removeItem(
|
|
1032
|
+
window.localStorage.removeItem(n);
|
|
1033
1033
|
} catch {
|
|
1034
1034
|
}
|
|
1035
1035
|
try {
|
|
1036
|
-
window.document.cookie = encodeURIComponent(
|
|
1036
|
+
window.document.cookie = encodeURIComponent(n) + "=; expires=Thu, 01 Jan 1970 00:00:00 UTC";
|
|
1037
1037
|
} catch {
|
|
1038
1038
|
}
|
|
1039
1039
|
}
|
|
1040
1040
|
}
|
|
1041
|
-
function
|
|
1041
|
+
function c(u) {
|
|
1042
1042
|
var m = u;
|
|
1043
1043
|
if (typeof m == "string" && t.levels[m.toUpperCase()] !== void 0 && (m = t.levels[m.toUpperCase()]), typeof m == "number" && m >= 0 && m <= t.levels.SILENT)
|
|
1044
1044
|
return m;
|
|
@@ -1054,49 +1054,49 @@ function nt(o, e) {
|
|
|
1054
1054
|
}, t.methodFactory = e || is, t.getLevel = function() {
|
|
1055
1055
|
return r ?? i ?? s;
|
|
1056
1056
|
}, t.setLevel = function(u, m) {
|
|
1057
|
-
return r =
|
|
1057
|
+
return r = c(u), m !== !1 && a(r), J.call(t);
|
|
1058
1058
|
}, t.setDefaultLevel = function(u) {
|
|
1059
|
-
i =
|
|
1059
|
+
i = c(u), l() || t.setLevel(u, !1);
|
|
1060
1060
|
}, t.resetLevel = function() {
|
|
1061
|
-
r = null,
|
|
1061
|
+
r = null, h(), J.call(t);
|
|
1062
1062
|
}, t.enableAll = function(u) {
|
|
1063
1063
|
t.setLevel(t.levels.TRACE, u);
|
|
1064
1064
|
}, t.disableAll = function(u) {
|
|
1065
1065
|
t.setLevel(t.levels.SILENT, u);
|
|
1066
1066
|
}, t.rebuild = function() {
|
|
1067
|
-
if (
|
|
1067
|
+
if (y !== t && (s = c(y.getLevel())), J.call(t), y === t)
|
|
1068
1068
|
for (var u in Q)
|
|
1069
1069
|
Q[u].rebuild();
|
|
1070
|
-
}, s =
|
|
1071
|
-
|
|
1070
|
+
}, s = c(
|
|
1071
|
+
y ? y.getLevel() : "WARN"
|
|
1072
1072
|
);
|
|
1073
1073
|
var p = l();
|
|
1074
|
-
p != null && (r =
|
|
1074
|
+
p != null && (r = c(p)), J.call(t);
|
|
1075
1075
|
}
|
|
1076
|
-
|
|
1077
|
-
|
|
1076
|
+
y = new at();
|
|
1077
|
+
y.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
1080
|
var t = Q[e];
|
|
1081
|
-
return t || (t = Q[e] = new
|
|
1081
|
+
return t || (t = Q[e] = new at(
|
|
1082
1082
|
e,
|
|
1083
|
-
|
|
1083
|
+
y.methodFactory
|
|
1084
1084
|
)), t;
|
|
1085
1085
|
};
|
|
1086
|
-
var rs = typeof window !==
|
|
1087
|
-
|
|
1088
|
-
return typeof window !==
|
|
1086
|
+
var rs = typeof window !== I ? window.log : void 0;
|
|
1087
|
+
y.noConflict = function() {
|
|
1088
|
+
return typeof window !== I && window.log === y && (window.log = rs), y;
|
|
1089
1089
|
};
|
|
1090
|
-
|
|
1090
|
+
y.getLoggers = function() {
|
|
1091
1091
|
return Q;
|
|
1092
1092
|
};
|
|
1093
|
-
|
|
1094
|
-
var
|
|
1093
|
+
y.default = y;
|
|
1094
|
+
var ns = function(o) {
|
|
1095
1095
|
for (var e = 1, t = arguments.length, s; e < t; e++)
|
|
1096
1096
|
for (s in arguments[e])
|
|
1097
1097
|
Object.prototype.hasOwnProperty.call(arguments[e], s) && (o[s] = arguments[e][s]);
|
|
1098
1098
|
return o;
|
|
1099
|
-
},
|
|
1099
|
+
}, as = {
|
|
1100
1100
|
template: "[%t] %l:",
|
|
1101
1101
|
levelFormatter: function(o) {
|
|
1102
1102
|
return o.toUpperCase();
|
|
@@ -1115,20 +1115,20 @@ var as = function(o) {
|
|
|
1115
1115
|
}, cs = function(o, e) {
|
|
1116
1116
|
if (!o || !o.setLevel)
|
|
1117
1117
|
throw new TypeError("Argument is not a logger");
|
|
1118
|
-
var t = o.methodFactory, s = o.name || "", i = H[s] || H[""] ||
|
|
1119
|
-
function r(
|
|
1120
|
-
var
|
|
1118
|
+
var t = o.methodFactory, s = o.name || "", i = H[s] || H[""] || as;
|
|
1119
|
+
function r(n, a, l) {
|
|
1120
|
+
var h = t(n, a, l), c = H[l] || H[""], p = c.template.indexOf("%t") !== -1, u = c.template.indexOf("%l") !== -1, m = c.template.indexOf("%n") !== -1;
|
|
1121
1121
|
return function() {
|
|
1122
|
-
for (var b = "",
|
|
1123
|
-
|
|
1122
|
+
for (var b = "", f = arguments.length, g = Array(f), v = 0; v < f; v++)
|
|
1123
|
+
g[v] = arguments[v];
|
|
1124
1124
|
if (s || !H[l]) {
|
|
1125
|
-
var
|
|
1126
|
-
|
|
1125
|
+
var _ = c.timestampFormatter(/* @__PURE__ */ new Date()), w = c.levelFormatter(n), C = c.nameFormatter(l);
|
|
1126
|
+
c.format ? b += c.format(w, C, _) : (b += c.template, p && (b = b.replace(/%t/, _)), u && (b = b.replace(/%l/, w)), m && (b = b.replace(/%n/, C))), g.length && typeof g[0] == "string" ? g[0] = b + " " + g[0] : g.unshift(b);
|
|
1127
1127
|
}
|
|
1128
|
-
|
|
1128
|
+
h.apply(void 0, g);
|
|
1129
1129
|
};
|
|
1130
1130
|
}
|
|
1131
|
-
return H[s] || (o.methodFactory = r), e = e || {}, e.template && (e.format = void 0), H[s] =
|
|
1131
|
+
return H[s] || (o.methodFactory = r), e = e || {}, e.template && (e.format = void 0), H[s] = ns({}, i, e), o.setLevel(o.getLevel()), lt || o.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
1133
|
), o;
|
|
1134
1134
|
}, ds = {
|
|
@@ -1145,37 +1145,37 @@ const hs = {
|
|
|
1145
1145
|
error: "#ef4444"
|
|
1146
1146
|
// Red
|
|
1147
1147
|
};
|
|
1148
|
-
ds.reg(
|
|
1149
|
-
const ms = (o) => o.toTimeString().split(" ")[0] + "." + o.getMilliseconds().toString().padStart(3, "0"), ps =
|
|
1150
|
-
|
|
1151
|
-
const s = ps(o, e, t), r = `color: ${hs[o] || "#666"}; font-weight: bold;`,
|
|
1152
|
-
return function(...
|
|
1153
|
-
const l = ms(/* @__PURE__ */ new Date()),
|
|
1154
|
-
s(
|
|
1148
|
+
ds.reg(y);
|
|
1149
|
+
const ms = (o) => o.toTimeString().split(" ")[0] + "." + o.getMilliseconds().toString().padStart(3, "0"), ps = y.methodFactory;
|
|
1150
|
+
y.methodFactory = function(o, e, t) {
|
|
1151
|
+
const s = ps(o, e, t), r = `color: ${hs[o] || "#666"}; font-weight: bold;`, n = "color: inherit;";
|
|
1152
|
+
return function(...a) {
|
|
1153
|
+
const l = ms(/* @__PURE__ */ new Date()), h = o.toUpperCase(), c = t ? `%c[${l}]%c %c[${h}]%c %c[${t}]%c` : `%c[${l}]%c %c[${h}]%c`;
|
|
1154
|
+
s(c, ...t ? [r, n, r, n, r, n] : [r, n, r, n], ...a);
|
|
1155
1155
|
};
|
|
1156
1156
|
};
|
|
1157
|
-
typeof
|
|
1158
|
-
const oe =
|
|
1157
|
+
typeof y.setDefaultLevel == "function" ? y.setDefaultLevel("silent") : y.setLevel("silent", !1);
|
|
1158
|
+
const oe = y.getLogger("MULTISELECT:INIT"), x = y.getLogger("MULTISELECT:DATA"), P = y.getLogger("MULTISELECT:UI"), S = y.getLogger("MULTISELECT:INTERACTION"), us = [
|
|
1159
1159
|
"MULTISELECT:INIT",
|
|
1160
1160
|
"MULTISELECT:DATA",
|
|
1161
1161
|
"MULTISELECT:UI",
|
|
1162
1162
|
"MULTISELECT:INTERACTION"
|
|
1163
1163
|
];
|
|
1164
1164
|
function Ae() {
|
|
1165
|
-
typeof
|
|
1165
|
+
typeof y.rebuild == "function" && y.rebuild();
|
|
1166
1166
|
}
|
|
1167
1167
|
function bs() {
|
|
1168
|
-
|
|
1168
|
+
y.setLevel("debug"), Ae();
|
|
1169
1169
|
}
|
|
1170
1170
|
function gs() {
|
|
1171
|
-
|
|
1171
|
+
y.setLevel("silent"), Ae();
|
|
1172
1172
|
}
|
|
1173
1173
|
function fs(o) {
|
|
1174
|
-
|
|
1174
|
+
y.setLevel(o), Ae();
|
|
1175
1175
|
}
|
|
1176
1176
|
function vs(o, e) {
|
|
1177
1177
|
const t = o.includes(":") ? o : `MULTISELECT:${o}`;
|
|
1178
|
-
|
|
1178
|
+
y.getLogger(t).setLevel(e);
|
|
1179
1179
|
}
|
|
1180
1180
|
class We {
|
|
1181
1181
|
constructor(e) {
|
|
@@ -1240,8 +1240,8 @@ class We {
|
|
|
1240
1240
|
this.visibleStart = e, this.visibleEnd = t, this.onVisibleRangeChange && this.onVisibleRangeChange(e, t);
|
|
1241
1241
|
let s = "";
|
|
1242
1242
|
for (let i = e; i < t; i++) {
|
|
1243
|
-
const r = this.items[i],
|
|
1244
|
-
s += `<div class="ms__virtual-item" style="position: absolute; top: ${
|
|
1243
|
+
const r = this.items[i], n = this.renderItem(r, i), a = i * this.itemHeight;
|
|
1244
|
+
s += `<div class="ms__virtual-item" style="position: absolute; top: ${a}px; left: 0; right: 0; height: ${this.itemHeight}px;" data-index="${i}">`, s += n, s += "</div>";
|
|
1245
1245
|
}
|
|
1246
1246
|
this.viewport.innerHTML = s;
|
|
1247
1247
|
}
|
|
@@ -1309,13 +1309,22 @@ class _s {
|
|
|
1309
1309
|
d(this, "showDelay");
|
|
1310
1310
|
d(this, "hideDelay");
|
|
1311
1311
|
d(this, "visibleClass");
|
|
1312
|
+
d(this, "followCursor");
|
|
1312
1313
|
d(this, "onBeforeShow");
|
|
1313
1314
|
d(this, "showTimer", null);
|
|
1314
1315
|
d(this, "hideTimer", null);
|
|
1315
1316
|
d(this, "positionCleanup", null);
|
|
1317
|
+
d(this, "visible", !1);
|
|
1318
|
+
d(this, "cursorX", 0);
|
|
1319
|
+
d(this, "cursorY", 0);
|
|
1316
1320
|
d(this, "handleMouseEnter");
|
|
1317
1321
|
d(this, "handleMouseLeave");
|
|
1318
|
-
|
|
1322
|
+
d(this, "handleMouseMove");
|
|
1323
|
+
this.trigger = e.trigger, this.container = e.container, this.placement = e.placement ?? "top", this.offsetDistance = e.offsetDistance ?? 8, this.showDelay = e.showDelay ?? 100, this.hideDelay = e.hideDelay ?? 100, this.visibleClass = e.visibleClass ?? "ms__badge-tooltip--visible", this.followCursor = e.followCursor ?? !1, this.onBeforeShow = e.onBeforeShow, this.element = document.createElement("div"), this.element.className = e.cssClass ?? "ms__badge-tooltip", typeof e.content == "string" ? this.element.textContent = e.content : this.element.appendChild(e.content), this.container.appendChild(this.element), this.handleMouseEnter = (t) => {
|
|
1324
|
+
this.followCursor && (this.cursorX = t.clientX, this.cursorY = t.clientY), this.scheduleShow();
|
|
1325
|
+
}, this.handleMouseLeave = () => this.scheduleHide(), this.trigger.addEventListener("mouseenter", this.handleMouseEnter), this.trigger.addEventListener("mouseleave", this.handleMouseLeave), this.followCursor && (this.handleMouseMove = (t) => {
|
|
1326
|
+
this.cursorX = t.clientX, this.cursorY = t.clientY, this.visible && this.positionAtCursor();
|
|
1327
|
+
}, this.trigger.addEventListener("mousemove", this.handleMouseMove));
|
|
1319
1328
|
}
|
|
1320
1329
|
scheduleShow() {
|
|
1321
1330
|
this.hideTimer !== null && (clearTimeout(this.hideTimer), this.hideTimer = null), this.showTimer === null && (this.showTimer = window.setTimeout(() => {
|
|
@@ -1329,35 +1338,53 @@ class _s {
|
|
|
1329
1338
|
}
|
|
1330
1339
|
show() {
|
|
1331
1340
|
var e;
|
|
1332
|
-
(e = this.onBeforeShow) == null || e.call(this), this.element.classList.add(this.visibleClass), this.positionCleanup && this.positionCleanup(), this.positionCleanup = _e(this.trigger, this.element, () =>
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1341
|
+
(e = this.onBeforeShow) == null || e.call(this), this.visible = !0, this.element.classList.add(this.visibleClass), this.positionCleanup && (this.positionCleanup(), this.positionCleanup = null), this.followCursor ? this.positionAtCursor() : this.positionCleanup = _e(this.trigger, this.element, () => this.computeAt(this.trigger));
|
|
1342
|
+
}
|
|
1343
|
+
/** Position the tooltip relative to a reference (the trigger element or a pointer virtual element). */
|
|
1344
|
+
computeAt(e) {
|
|
1345
|
+
ke(e, this.element, {
|
|
1346
|
+
placement: this.placement,
|
|
1347
|
+
strategy: "fixed",
|
|
1348
|
+
middleware: [
|
|
1349
|
+
ye(this.offsetDistance),
|
|
1350
|
+
rt(),
|
|
1351
|
+
we({ padding: 8 })
|
|
1352
|
+
]
|
|
1353
|
+
}).then(({ x: t, y: s }) => {
|
|
1354
|
+
Object.assign(this.element.style, {
|
|
1355
|
+
left: `${t}px`,
|
|
1356
|
+
top: `${s}px`
|
|
1346
1357
|
});
|
|
1347
1358
|
});
|
|
1348
1359
|
}
|
|
1360
|
+
/** Position the tooltip relative to the last-known pointer location (follow-cursor mode). */
|
|
1361
|
+
positionAtCursor() {
|
|
1362
|
+
const e = this.cursorX, t = this.cursorY, s = {
|
|
1363
|
+
getBoundingClientRect: () => ({
|
|
1364
|
+
width: 0,
|
|
1365
|
+
height: 0,
|
|
1366
|
+
x: e,
|
|
1367
|
+
y: t,
|
|
1368
|
+
top: t,
|
|
1369
|
+
left: e,
|
|
1370
|
+
right: e,
|
|
1371
|
+
bottom: t
|
|
1372
|
+
})
|
|
1373
|
+
};
|
|
1374
|
+
this.computeAt(s);
|
|
1375
|
+
}
|
|
1349
1376
|
hide() {
|
|
1350
|
-
this.element.classList.remove(this.visibleClass), this.positionCleanup && (this.positionCleanup(), this.positionCleanup = null);
|
|
1377
|
+
this.visible = !1, this.element.classList.remove(this.visibleClass), this.positionCleanup && (this.positionCleanup(), this.positionCleanup = null);
|
|
1351
1378
|
}
|
|
1352
1379
|
/** Hide synchronously (skip the hideDelay). Used by parent tooltips when a child tooltip is about to show. */
|
|
1353
1380
|
hideImmediate() {
|
|
1354
1381
|
this.showTimer !== null && (clearTimeout(this.showTimer), this.showTimer = null), this.hideTimer !== null && (clearTimeout(this.hideTimer), this.hideTimer = null), this.hide();
|
|
1355
1382
|
}
|
|
1356
1383
|
destroy() {
|
|
1357
|
-
this.showTimer !== null && clearTimeout(this.showTimer), this.hideTimer !== null && clearTimeout(this.hideTimer), this.showTimer = null, this.hideTimer = null, this.positionCleanup && (this.positionCleanup(), this.positionCleanup = null), this.trigger.removeEventListener("mouseenter", this.handleMouseEnter), this.trigger.removeEventListener("mouseleave", this.handleMouseLeave), this.element.remove();
|
|
1384
|
+
this.showTimer !== null && clearTimeout(this.showTimer), this.hideTimer !== null && clearTimeout(this.hideTimer), this.showTimer = null, this.hideTimer = null, this.positionCleanup && (this.positionCleanup(), this.positionCleanup = null), this.trigger.removeEventListener("mouseenter", this.handleMouseEnter), this.trigger.removeEventListener("mouseleave", this.handleMouseLeave), this.handleMouseMove && this.trigger.removeEventListener("mousemove", this.handleMouseMove), this.element.remove();
|
|
1358
1385
|
}
|
|
1359
1386
|
}
|
|
1360
|
-
function
|
|
1387
|
+
function ys(o) {
|
|
1361
1388
|
let e = o;
|
|
1362
1389
|
for (; e && !(e === document.body || e === document.documentElement); ) {
|
|
1363
1390
|
if (e instanceof Element) {
|
|
@@ -1371,7 +1398,7 @@ function ks(o) {
|
|
|
1371
1398
|
}
|
|
1372
1399
|
return window;
|
|
1373
1400
|
}
|
|
1374
|
-
function
|
|
1401
|
+
function ws(o, e, t) {
|
|
1375
1402
|
let s = o;
|
|
1376
1403
|
for (; s && !(s === document.body || s === document.documentElement); ) {
|
|
1377
1404
|
if (s instanceof Element) {
|
|
@@ -1383,7 +1410,7 @@ function ys(o, e, t) {
|
|
|
1383
1410
|
}
|
|
1384
1411
|
return null;
|
|
1385
1412
|
}
|
|
1386
|
-
function
|
|
1413
|
+
function ks(o) {
|
|
1387
1414
|
const e = getComputedStyle(o), t = [];
|
|
1388
1415
|
e.transform !== "none" && t.push(`transform: ${e.transform}`), e.perspective !== "none" && t.push(`perspective: ${e.perspective}`), e.filter !== "none" && t.push(`filter: ${e.filter}`);
|
|
1389
1416
|
const s = e.backdropFilter;
|
|
@@ -1603,12 +1630,12 @@ class xs {
|
|
|
1603
1630
|
hasAncestorDir: r,
|
|
1604
1631
|
isRTL: this.isRTL
|
|
1605
1632
|
}), this.effectiveBadgesPosition = this.options.badgesPosition || "bottom", this.isRTL && (this.effectiveBadgesPosition === "left" ? this.effectiveBadgesPosition = "right" : this.effectiveBadgesPosition === "right" && (this.effectiveBadgesPosition = "left")), this.element.classList.add("ms"), this.isRTL && (this.element.classList.add("ms--rtl"), oe.debug(`[${this.instanceId}] Added ms--rtl class to element`)), (!this.options.isCheckboxesShown || !this.options.isMultipleEnabled) && this.element.classList.add("ms--no-checkboxes");
|
|
1606
|
-
const
|
|
1607
|
-
|
|
1608
|
-
const
|
|
1609
|
-
|
|
1633
|
+
const n = document.createElement("div");
|
|
1634
|
+
n.className = "ms__input-wrapper", this.input = document.createElement("input"), this.input.type = "text", this.input.className = "ms__input", this.input.placeholder = this.getPlaceholderText(), this.input.autocomplete = "off", this.options.searchInputMode === "readonly" ? this.input.readOnly = !0 : this.options.searchInputMode === "hidden" && (this.input.style.display = "none");
|
|
1635
|
+
const a = document.createElement("span");
|
|
1636
|
+
a.className = "ms__toggle", a.innerHTML = "▼", this.counter = document.createElement("span"), this.counter.className = "ms__counter", this.counter.style.display = "none", n.appendChild(this.input), n.appendChild(this.counter), n.appendChild(a), this.badgesContainer = document.createElement("div"), this.badgesContainer.className = "ms__badges";
|
|
1610
1637
|
const l = document.createElement("div");
|
|
1611
|
-
l.className = "ms__wrapper", (this.effectiveBadgesPosition === "left" || this.effectiveBadgesPosition === "right") && l.classList.add("ms__wrapper--inline"), l.appendChild(
|
|
1638
|
+
l.className = "ms__wrapper", (this.effectiveBadgesPosition === "left" || this.effectiveBadgesPosition === "right") && l.classList.add("ms__wrapper--inline"), l.appendChild(n), l.appendChild(this.badgesContainer), this.element.appendChild(l), this.dropdown = document.createElement("div"), this.dropdown.className = "ms__dropdown", this.dropdownInner = document.createElement("div"), this.dropdownInner.className = "ms__dropdown-inner", this.dropdown.appendChild(this.dropdownInner), 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();
|
|
1612
1639
|
}
|
|
1613
1640
|
/**
|
|
1614
1641
|
* Check if virtual scroll should be used
|
|
@@ -1638,30 +1665,31 @@ class xs {
|
|
|
1638
1665
|
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.dropdownInner.innerHTML = e;
|
|
1639
1666
|
return;
|
|
1640
1667
|
}
|
|
1641
|
-
|
|
1668
|
+
const t = this.renderActionsHTML(), s = this.options.actionsPosition === "bottom";
|
|
1669
|
+
if (s || (e += t), e += '<div class="ms__options">', this.filteredOptions.length === 0)
|
|
1642
1670
|
e += `<div class="ms__empty">${this.options.emptyMessage}</div>`;
|
|
1643
1671
|
else if (this.options.isGroupsAllowed) {
|
|
1644
|
-
const
|
|
1645
|
-
this.filteredOptions.forEach((
|
|
1646
|
-
if (e += '<div class="ms__group">',
|
|
1672
|
+
const i = this.groupOptions(this.filteredOptions), r = /* @__PURE__ */ new Map();
|
|
1673
|
+
this.filteredOptions.forEach((n, a) => r.set(n, a)), Object.keys(i).forEach((n) => {
|
|
1674
|
+
if (e += '<div class="ms__group">', n !== "__ungrouped__")
|
|
1647
1675
|
if (this.options.renderGroupLabelContentCallback) {
|
|
1648
|
-
const
|
|
1649
|
-
if (
|
|
1650
|
-
const
|
|
1651
|
-
|
|
1676
|
+
const a = this.options.renderGroupLabelContentCallback(n);
|
|
1677
|
+
if (a instanceof HTMLElement) {
|
|
1678
|
+
const l = document.createElement("div");
|
|
1679
|
+
l.className = "ms__group-label", l.appendChild(a), e += l.outerHTML;
|
|
1652
1680
|
} else
|
|
1653
|
-
e += `<div class="ms__group-label">${
|
|
1681
|
+
e += `<div class="ms__group-label">${a}</div>`;
|
|
1654
1682
|
} else
|
|
1655
|
-
e += `<div class="ms__group-label">${
|
|
1656
|
-
|
|
1657
|
-
e += this.renderOption(
|
|
1683
|
+
e += `<div class="ms__group-label">${n}</div>`;
|
|
1684
|
+
i[n].forEach((a) => {
|
|
1685
|
+
e += this.renderOption(a, r.get(a) ?? -1);
|
|
1658
1686
|
}), e += "</div>";
|
|
1659
1687
|
});
|
|
1660
1688
|
} else
|
|
1661
|
-
this.filteredOptions.forEach((
|
|
1662
|
-
e += this.renderOption(
|
|
1689
|
+
this.filteredOptions.forEach((i, r) => {
|
|
1690
|
+
e += this.renderOption(i, r);
|
|
1663
1691
|
});
|
|
1664
|
-
e += "</div>", this.dropdownInner.innerHTML = e, this.attachActionButtonTooltips();
|
|
1692
|
+
e += "</div>", s && (e += t), this.dropdownInner.innerHTML = e, this.attachActionButtonTooltips(), this.attachOptionTooltips();
|
|
1665
1693
|
}
|
|
1666
1694
|
/**
|
|
1667
1695
|
* Render dropdown with virtual scrolling
|
|
@@ -1669,9 +1697,10 @@ class xs {
|
|
|
1669
1697
|
renderDropdownVirtual() {
|
|
1670
1698
|
if (this.destroyAllActionButtonTooltips(), !this.virtualScroll) {
|
|
1671
1699
|
let s = "";
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
|
|
1700
|
+
const i = this.renderActionsHTML(), r = this.options.actionsPosition === "bottom";
|
|
1701
|
+
r || (s += i);
|
|
1702
|
+
const n = this.options.maxHeight || "20rem", a = this.options.optionHeight ?? 50;
|
|
1703
|
+
s += `<div class="ms__options ms__options--virtual" style="height: ${n}; max-height: ${n}; overflow-y: auto; position: relative; --ms-option-height: ${a}px;"></div>`, r && (s += i), this.dropdownInner.innerHTML = s, this.optionsContainer = this.dropdownInner.querySelector(".ms__options");
|
|
1675
1704
|
}
|
|
1676
1705
|
if (this.filteredOptions.length === 0) {
|
|
1677
1706
|
this.virtualScroll && (this.virtualScroll.destroy(), this.virtualScroll = null), this.optionsContainer.innerHTML = `<div class="ms__empty">${this.options.emptyMessage}</div>`;
|
|
@@ -1684,7 +1713,10 @@ class xs {
|
|
|
1684
1713
|
itemHeight: e,
|
|
1685
1714
|
items: this.filteredOptions,
|
|
1686
1715
|
renderItem: (s, i) => this.renderOption(s, i),
|
|
1687
|
-
bufferSize: t
|
|
1716
|
+
bufferSize: t,
|
|
1717
|
+
onVisibleRangeChange: () => {
|
|
1718
|
+
this.attachOptionTooltips();
|
|
1719
|
+
}
|
|
1688
1720
|
}), this.attachActionButtonTooltips());
|
|
1689
1721
|
});
|
|
1690
1722
|
}
|
|
@@ -1692,37 +1724,52 @@ class xs {
|
|
|
1692
1724
|
* Render the Select All / Clear All / custom action buttons row.
|
|
1693
1725
|
* Returns the empty string if multiple-select is off or no buttons are configured.
|
|
1694
1726
|
*/
|
|
1727
|
+
/**
|
|
1728
|
+
* Default enabled/disabled state for the built-in actions, applied only when the consumer hasn't
|
|
1729
|
+
* set an explicit `isDisabled` / `getIsDisabledCallback`:
|
|
1730
|
+
* - `select-all` is disabled when it would add nothing (every selectable, non-disabled filtered
|
|
1731
|
+
* option is already selected — this also covers an empty list).
|
|
1732
|
+
* - `clear-all` is disabled when nothing is selected.
|
|
1733
|
+
*/
|
|
1734
|
+
getBuiltInActionDisabled(e) {
|
|
1735
|
+
return e === "select-all" ? !this.filteredOptions.some((t) => !this.getItemDisabled(t) && !this.selectedValues.has(String(this.getItemValue(t)))) : e === "clear-all" ? this.selectedValues.size === 0 : !1;
|
|
1736
|
+
}
|
|
1695
1737
|
renderActionsHTML() {
|
|
1696
1738
|
const e = this.options.actionButtons;
|
|
1697
1739
|
if (!this.options.isMultipleEnabled || !e || e.length === 0) return "";
|
|
1698
|
-
const t = this.options.isActionsSticky ? " ms__actions--sticky" : "",
|
|
1699
|
-
|
|
1700
|
-
|
|
1701
|
-
let
|
|
1702
|
-
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1740
|
+
const t = this.options.actionsPosition === "bottom" ? "bottom" : "top", s = this.options.actionsAlign ?? "stretch", i = ` ms__actions--${t}`, r = this.options.isActionsSticky ? " ms__actions--sticky" : "", n = this.options.actionsLayout === "wrap" ? " ms__actions--wrap" : "", a = ` ms__actions--align-${s}`, l = /* @__PURE__ */ new Map();
|
|
1741
|
+
if (e.forEach((c, p) => {
|
|
1742
|
+
if (!(c.getIsVisibleCallback ? c.getIsVisibleCallback(this) : c.isVisible ?? !0)) return;
|
|
1743
|
+
let m;
|
|
1744
|
+
c.getIsDisabledCallback ? m = c.getIsDisabledCallback(this) : c.isDisabled !== void 0 ? m = c.isDisabled : m = this.getBuiltInActionDisabled(c.action);
|
|
1745
|
+
const b = m ? " disabled" : "", f = c.getTextCallback ? c.getTextCallback(this) : c.text;
|
|
1746
|
+
let g = "";
|
|
1747
|
+
if (c.getClassCallback) {
|
|
1748
|
+
const w = c.getClassCallback(this);
|
|
1749
|
+
g = Array.isArray(w) ? ` ${w.join(" ")}` : w ? ` ${w}` : "";
|
|
1750
|
+
} else c.cssClass && (g = ` ${c.cssClass}`);
|
|
1751
|
+
const v = Math.max(1, Math.floor(c.row ?? 1)), _ = `<button type="button"${b} class="ms__action-btn${g}" data-action="${c.action}" data-button-index="${p}">${f}</button>`;
|
|
1752
|
+
l.has(v) || l.set(v, []), l.get(v).push(_);
|
|
1753
|
+
}), l.size === 0) return "";
|
|
1754
|
+
const h = Array.from(l.keys()).sort((c, p) => c - p).map((c) => `<div class="ms__actions-row" data-row="${c}">${l.get(c).join("")}</div>`).join("");
|
|
1755
|
+
return `<div class="ms__actions${i}${r}${n}${a}">${h}</div>`;
|
|
1709
1756
|
}
|
|
1710
1757
|
renderOption(e, t) {
|
|
1711
|
-
const s = this.getItemValue(e), i = this.getItemDisplayValue(e), r = this.getItemIcon(e),
|
|
1712
|
-
l && p.push("ms__option--selected"),
|
|
1758
|
+
const s = this.getItemValue(e), i = this.getItemDisplayValue(e), r = this.getItemIcon(e), n = this.getItemSubtitle(e), a = this.getItemDisabled(e), l = this.selectedValues.has(String(s)), h = t === this.focusedIndex, c = this.matchingIndices.has(t), p = ["ms__option"];
|
|
1759
|
+
l && p.push("ms__option--selected"), h && p.push("ms__option--focused"), c && p.push("ms__option--matched"), a && p.push("ms__option--disabled");
|
|
1713
1760
|
const u = this.options.checkboxAlign && this.options.checkboxAlign !== "center" ? ` data-checkbox-align="${this.options.checkboxAlign}"` : "";
|
|
1714
1761
|
let m = `<div class="${p.join(" ")}" data-value="${s}" data-index="${t}"${u}>`;
|
|
1715
|
-
if (this.options.isCheckboxesShown && this.options.isMultipleEnabled && (m += `<input type="checkbox" class="ms__checkbox" ${l ? "checked" : ""} ${
|
|
1762
|
+
if (this.options.isCheckboxesShown && this.options.isMultipleEnabled && (m += `<input type="checkbox" class="ms__checkbox" ${l ? "checked" : ""} ${a ? "disabled" : ""}>`), m += '<div class="ms__option-content">', this.options.renderOptionContentCallback) {
|
|
1716
1763
|
const b = {
|
|
1717
1764
|
index: t,
|
|
1718
1765
|
isSelected: l,
|
|
1719
|
-
isFocused:
|
|
1720
|
-
isMatched:
|
|
1721
|
-
isDisabled:
|
|
1722
|
-
},
|
|
1723
|
-
typeof
|
|
1766
|
+
isFocused: h,
|
|
1767
|
+
isMatched: c,
|
|
1768
|
+
isDisabled: a
|
|
1769
|
+
}, f = this.options.renderOptionContentCallback(e, b);
|
|
1770
|
+
typeof f == "string" ? m += f : m += f.outerHTML;
|
|
1724
1771
|
} else
|
|
1725
|
-
r && (m += `<span class="ms__option-icon">${r}</span>`), m += '<div class="ms__option-text">', m += `<div class="ms__option-title">${this.highlightMatch(i, this.searchTerm)}</div>`,
|
|
1772
|
+
r && (m += `<span class="ms__option-icon">${r}</span>`), m += '<div class="ms__option-text">', m += `<div class="ms__option-title">${this.highlightMatch(i, this.searchTerm)}</div>`, n && (m += `<div class="ms__option-subtitle">${n}</div>`), m += "</div>";
|
|
1726
1773
|
return m += "</div>", m += "</div>", m;
|
|
1727
1774
|
}
|
|
1728
1775
|
highlightMatch(e, t) {
|
|
@@ -1773,21 +1820,21 @@ class xs {
|
|
|
1773
1820
|
this.badgesContainer.className = `ms__badges ms__badges--${this.effectiveBadgesPosition}`, this.badgesContainer.innerHTML = e.map((r) => this.renderBadgeHTML(r, { displayMode: "badges", isInPopover: !1 })).join("");
|
|
1774
1821
|
else if (s === "partial") {
|
|
1775
1822
|
this.badgesContainer.className = `ms__badges ms__badges--${this.effectiveBadgesPosition}`;
|
|
1776
|
-
const r = this.options.badgesMaxVisible || 3,
|
|
1777
|
-
let
|
|
1778
|
-
|
|
1823
|
+
const r = this.options.badgesMaxVisible || 3, n = e.slice(0, r), a = t - r, l = n.map((c) => this.renderBadgeHTML(c, { displayMode: "partial", isInPopover: !1 })).join("");
|
|
1824
|
+
let h = "";
|
|
1825
|
+
a > 0 && (h = `
|
|
1779
1826
|
<div class="ms__badge ms__badge--counter ms__badge--more" data-action="show-selected">
|
|
1780
|
-
<span class="ms__badge-text">${this.options.getCounterCallback ? this.options.getCounterCallback(t,
|
|
1781
|
-
<button type="button" class="ms__badge-remove" data-action="remove-hidden" aria-label="Remove ${
|
|
1827
|
+
<span class="ms__badge-text">${this.options.getCounterCallback ? this.options.getCounterCallback(t, a) : `+${a} more`}</span>
|
|
1828
|
+
<button type="button" class="ms__badge-remove" data-action="remove-hidden" aria-label="Remove ${a} hidden items"></button>
|
|
1782
1829
|
</div>
|
|
1783
|
-
`), this.badgesContainer.innerHTML = l +
|
|
1830
|
+
`), this.badgesContainer.innerHTML = l + h;
|
|
1784
1831
|
} else if (s === "compact")
|
|
1785
1832
|
if (this.badgesContainer.className = `ms__badges ms__badges--${this.effectiveBadgesPosition}`, t > 0) {
|
|
1786
|
-
const r = e[0],
|
|
1787
|
-
let l =
|
|
1788
|
-
if (
|
|
1789
|
-
const
|
|
1790
|
-
l = `${
|
|
1833
|
+
const r = e[0], n = this.getItemBadgeDisplayValue(r), a = t - 1;
|
|
1834
|
+
let l = n;
|
|
1835
|
+
if (a > 0) {
|
|
1836
|
+
const h = this.options.getCounterCallback ? this.options.getCounterCallback(t, a) : `+${a} more`;
|
|
1837
|
+
l = `${n} (${h})`;
|
|
1791
1838
|
}
|
|
1792
1839
|
this.badgesContainer.innerHTML = `
|
|
1793
1840
|
<div class="ms__badge" data-action="show-selected">
|
|
@@ -1868,8 +1915,8 @@ class xs {
|
|
|
1868
1915
|
else {
|
|
1869
1916
|
this.filteredOptions = [...this.allOptions], this.matchingIndices.clear();
|
|
1870
1917
|
let r = -1;
|
|
1871
|
-
this.allOptions.forEach((
|
|
1872
|
-
this.getItemSearchValue(
|
|
1918
|
+
this.allOptions.forEach((n, a) => {
|
|
1919
|
+
this.getItemSearchValue(n).toLowerCase().includes(i) && (this.matchingIndices.add(a), r === -1 && (r = a));
|
|
1873
1920
|
}), r >= 0 ? (this.focusedIndex = r, x.debug(`[${this.instanceId}] Navigate mode: ${this.matchingIndices.size} matches, jumped to index ${r}`)) : x.debug(`[${this.instanceId}] Navigate mode: No matches found, keeping previous focus`);
|
|
1874
1921
|
}
|
|
1875
1922
|
}
|
|
@@ -1961,21 +2008,21 @@ class xs {
|
|
|
1961
2008
|
else if (r === "clear-all")
|
|
1962
2009
|
this.clearAll();
|
|
1963
2010
|
else if (r === "custom") {
|
|
1964
|
-
const
|
|
1965
|
-
|
|
2011
|
+
const n = parseInt(t.dataset.buttonIndex || "-1"), a = (i = this.options.actionButtons) == null ? void 0 : i[n];
|
|
2012
|
+
a != null && a.onClick && a.onClick(this);
|
|
1966
2013
|
}
|
|
1967
2014
|
return;
|
|
1968
2015
|
}
|
|
1969
2016
|
const s = e.target.closest(".ms__option");
|
|
1970
2017
|
if (s && !s.classList.contains("ms__option--disabled")) {
|
|
1971
2018
|
e.preventDefault();
|
|
1972
|
-
const r = s.dataset.value,
|
|
2019
|
+
const r = s.dataset.value, n = this.filteredOptions.findIndex((a) => String(this.getItemValue(a)) === r);
|
|
1973
2020
|
S.debug(`[${this.instanceId}] Option clicked:`, {
|
|
1974
2021
|
value: r,
|
|
1975
|
-
optionIndex:
|
|
2022
|
+
optionIndex: n,
|
|
1976
2023
|
closeOnSelect: this.options.isCloseOnSelect,
|
|
1977
2024
|
placeholder: this.options.searchPlaceholder
|
|
1978
|
-
}),
|
|
2025
|
+
}), n >= 0 && (this.focusedIndex = n, this.toggleOption(this.filteredOptions[n]), this.isOpen && this.input.focus());
|
|
1979
2026
|
}
|
|
1980
2027
|
}
|
|
1981
2028
|
handleBadgeClick(e) {
|
|
@@ -1992,11 +2039,11 @@ class xs {
|
|
|
1992
2039
|
if (e.preventDefault(), e.stopPropagation(), i.dataset.action === "remove-hidden") {
|
|
1993
2040
|
S.debug(`[${this.instanceId}] Remove hidden items button clicked`);
|
|
1994
2041
|
const l = this.options.badgesMaxVisible || 3;
|
|
1995
|
-
Array.from(this.selectedOptions.values()).slice(l).forEach((p) => this.
|
|
2042
|
+
Array.from(this.selectedOptions.values()).slice(l).forEach((p) => this.interactiveDeselect(p));
|
|
1996
2043
|
return;
|
|
1997
2044
|
}
|
|
1998
|
-
const
|
|
1999
|
-
|
|
2045
|
+
const n = i.dataset.value, a = this.selectedOptions.get(n);
|
|
2046
|
+
a && this.interactiveDeselect(a);
|
|
2000
2047
|
return;
|
|
2001
2048
|
}
|
|
2002
2049
|
if (e.target.closest(".ms__badge--more") && !e.target.closest(".ms__badge-remove")) {
|
|
@@ -2008,7 +2055,7 @@ class xs {
|
|
|
2008
2055
|
var i;
|
|
2009
2056
|
const t = e.composedPath();
|
|
2010
2057
|
if (this.showSelectedPopover && !t.some(
|
|
2011
|
-
(
|
|
2058
|
+
(n) => n instanceof Node && (this.selectedPopover.contains(n) || this.counter.contains(n) || n.closest && n.closest('[data-action="show-selected"]'))
|
|
2012
2059
|
)) {
|
|
2013
2060
|
P.debug(`[${this.instanceId}] Closing selected popover due to click outside`), this.hideSelectedPopover();
|
|
2014
2061
|
return;
|
|
@@ -2080,11 +2127,28 @@ class xs {
|
|
|
2080
2127
|
return;
|
|
2081
2128
|
}
|
|
2082
2129
|
const t = this.getItemValue(e), s = String(t);
|
|
2083
|
-
|
|
2084
|
-
|
|
2085
|
-
|
|
2086
|
-
|
|
2087
|
-
|
|
2130
|
+
S.debug(`[${this.instanceId}] toggleOption called`, { value: t, multiple: this.options.isMultipleEnabled }), (this.selectedValues.has(s) ? this.interactiveDeselect(e) : this.interactiveSelect(e)) && (this.options.isMultipleEnabled ? this.options.isCloseOnSelect && this.close() : this.close());
|
|
2131
|
+
}
|
|
2132
|
+
/**
|
|
2133
|
+
* The single funnel for an interactive (user-initiated) selection. Consults
|
|
2134
|
+
* `beforeSelectCallback` and only mutates state if allowed, so the veto can
|
|
2135
|
+
* never be bypassed by a new UI entry point. Programmatic `setSelected` and
|
|
2136
|
+
* the Select-All button deliberately do not route through here.
|
|
2137
|
+
* Returns true if the option was selected, false if the veto blocked it.
|
|
2138
|
+
*/
|
|
2139
|
+
interactiveSelect(e) {
|
|
2140
|
+
return this.options.beforeSelectCallback && this.options.beforeSelectCallback(e, this.getSelected()) === !1 ? (S.debug(`[${this.instanceId}] Selection blocked by beforeSelectCallback`), !1) : (this.options.isMultipleEnabled || (this.selectedValues.clear(), this.selectedOptions.clear()), this.selectOption(e), !0);
|
|
2141
|
+
}
|
|
2142
|
+
/**
|
|
2143
|
+
* The single funnel for an interactive (user-initiated) deselection. Every
|
|
2144
|
+
* removal affordance — dropdown toggle, badge × button, selected-items
|
|
2145
|
+
* popover × button, and the "remove hidden" badge — routes through here so
|
|
2146
|
+
* the `beforeDeselectCallback` veto applies uniformly. Programmatic
|
|
2147
|
+
* `setSelected` and the Clear-All button deliberately bypass it.
|
|
2148
|
+
* Returns true if the option was deselected, false if the veto blocked it.
|
|
2149
|
+
*/
|
|
2150
|
+
interactiveDeselect(e) {
|
|
2151
|
+
return this.options.beforeDeselectCallback && this.options.beforeDeselectCallback(e, this.getSelected()) === !1 ? (S.debug(`[${this.instanceId}] Deselection blocked by beforeDeselectCallback`), !1) : (this.deselectOption(e), !0);
|
|
2088
2152
|
}
|
|
2089
2153
|
async handleAddNew(e) {
|
|
2090
2154
|
if (this.options.addNewCallback)
|
|
@@ -2119,18 +2183,18 @@ class xs {
|
|
|
2119
2183
|
/**
|
|
2120
2184
|
* Re-render and fire callbacks after a selection state change.
|
|
2121
2185
|
* `added` / `removed` drive per-item select/deselect callbacks.
|
|
2122
|
-
* `
|
|
2186
|
+
* `onChange` fires once if anything actually changed.
|
|
2123
2187
|
*/
|
|
2124
2188
|
commit(e) {
|
|
2125
2189
|
this.renderDropdown(), this.renderBadges(), this.updateHiddenInput();
|
|
2126
2190
|
const t = e.added ?? [], s = e.removed ?? [];
|
|
2127
|
-
this.options.
|
|
2191
|
+
this.options.onSelect && t.forEach((i) => this.options.onSelect(i)), this.options.onDeselect && s.forEach((i) => this.options.onDeselect(i)), (t.length > 0 || s.length > 0) && this.options.onChange && this.options.onChange(this.getSelected());
|
|
2128
2192
|
}
|
|
2129
2193
|
open() {
|
|
2130
|
-
P.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"), P.info(`[${this.instanceId}] Dropdown opened`), this.input.placeholder = this.getPlaceholderText(), !this.options.isMultipleEnabled && this.options.isSearchEnabled && (this.input.value =
|
|
2194
|
+
P.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"), P.info(`[${this.instanceId}] Dropdown opened`), this.input.placeholder = this.getPlaceholderText(), !this.options.isMultipleEnabled && this.options.isSearchEnabled && (this.input.value = this.searchTerm), this.options.searchCallback && this.options.isKeepOptionsOnSearch && !this.searchTerm && (this.filteredOptions = [...this.allOptions], P.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()));
|
|
2131
2195
|
}
|
|
2132
2196
|
close() {
|
|
2133
|
-
P.debug(`[${this.instanceId}] close() called`, { isOpen: this.isOpen }), this.isOpen && (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.options.shouldKeepSearchOnClose || (this.searchTerm = "", (this.options.isMultipleEnabled || this.options.isSearchEnabled) && (this.input.value = ""), this.filteredOptions = [...this.allOptions]), this.focusedIndex = -1, this.renderBadges(), this.dropdownCleanup && (this.dropdownCleanup(), this.dropdownCleanup = null), this.hintCleanup && (this.hintCleanup(), this.hintCleanup = null), this.dropdownPlacement = null, P.debug(`[${this.instanceId}] Dropdown closed`));
|
|
2197
|
+
P.debug(`[${this.instanceId}] close() called`, { isOpen: this.isOpen }), this.isOpen && (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.options.shouldKeepSearchOnClose || (this.searchTerm = "", (this.options.isMultipleEnabled || this.options.isSearchEnabled) && (this.input.value = ""), this.filteredOptions = [...this.allOptions]), this.focusedIndex = -1, this.destroyAllOptionTooltips(), this.renderBadges(), this.dropdownCleanup && (this.dropdownCleanup(), this.dropdownCleanup = null), this.hintCleanup && (this.hintCleanup(), this.hintCleanup = null), this.dropdownPlacement = null, P.debug(`[${this.instanceId}] Dropdown closed`));
|
|
2134
2198
|
}
|
|
2135
2199
|
/**
|
|
2136
2200
|
* Anchor a floating panel (dropdown or selected-items popover) below/above the input with
|
|
@@ -2142,23 +2206,23 @@ class xs {
|
|
|
2142
2206
|
anchorFloatingPanel(e, t) {
|
|
2143
2207
|
const s = {
|
|
2144
2208
|
...ot,
|
|
2145
|
-
getOffsetParent: () =>
|
|
2209
|
+
getOffsetParent: () => ys(this.input)
|
|
2146
2210
|
};
|
|
2147
2211
|
return _e(this.input, e, () => {
|
|
2148
2212
|
var l;
|
|
2149
2213
|
e.style.width = `${this.input.offsetWidth}px`, this.options.dropdownMinWidth && (e.style.minWidth = this.options.dropdownMinWidth), t.applyMaxWidth && this.options.dropdownMaxWidth && (e.style.maxWidth = this.options.dropdownMaxWidth);
|
|
2150
|
-
const i = ((l = t.isLocked) == null ? void 0 : l.call(t)) ?? !0, r = t.getPlacement(),
|
|
2151
|
-
|
|
2214
|
+
const i = ((l = t.isLocked) == null ? void 0 : l.call(t)) ?? !0, r = t.getPlacement(), n = i && r ? r : "bottom-start", a = [
|
|
2215
|
+
ye(4),
|
|
2152
2216
|
...i && r ? [] : [rt()],
|
|
2153
|
-
|
|
2217
|
+
we({ padding: 8 })
|
|
2154
2218
|
];
|
|
2155
|
-
|
|
2219
|
+
ke(this.input, e, { placement: n, strategy: "fixed", middleware: a, platform: s }).then(({ x: h, y: c, placement: p }) => {
|
|
2156
2220
|
var u;
|
|
2157
2221
|
r || t.setPlacement(p), Object.assign(e.style, {
|
|
2158
2222
|
position: "fixed",
|
|
2159
|
-
left: `${
|
|
2160
|
-
top: `${
|
|
2161
|
-
}), this.verifyPanelLanded(e,
|
|
2223
|
+
left: `${h}px`,
|
|
2224
|
+
top: `${c}px`
|
|
2225
|
+
}), this.verifyPanelLanded(e, h, c), (u = t.afterPosition) == null || u.call(t);
|
|
2162
2226
|
});
|
|
2163
2227
|
});
|
|
2164
2228
|
}
|
|
@@ -2175,12 +2239,12 @@ class xs {
|
|
|
2175
2239
|
*/
|
|
2176
2240
|
verifyPanelLanded(e, t, s) {
|
|
2177
2241
|
if (this.positioningDriftWarned) return;
|
|
2178
|
-
const i = e.getBoundingClientRect(), r = i.x - t,
|
|
2179
|
-
if (Math.abs(r) < 1 && Math.abs(
|
|
2242
|
+
const i = e.getBoundingClientRect(), r = i.x - t, n = i.y - s;
|
|
2243
|
+
if (Math.abs(r) < 1 && Math.abs(n) < 1) return;
|
|
2180
2244
|
this.positioningDriftWarned = !0;
|
|
2181
|
-
const
|
|
2245
|
+
const a = ws(this.input, r, n), l = a ? `<${a.tagName.toLowerCase()}${a.id ? "#" + a.id : ""}${typeof a.className == "string" && a.className ? "." + a.className.split(/\s+/).filter(Boolean).slice(0, 2).join(".") : ""}>` : "an ancestor element (could not auto-identify)", h = a ? ks(a) : "";
|
|
2182
2246
|
console.warn(
|
|
2183
|
-
`[@keenmate/web-multiselect] Dropdown panel rendered ${r.toFixed(0)}px / ${
|
|
2247
|
+
`[@keenmate/web-multiselect] Dropdown panel rendered ${r.toFixed(0)}px / ${n.toFixed(0)}px away from where the library positioned it. Most likely culprit: ${l}` + (h ? ` (has ${h})` : "") + ".\nAn ancestor of <web-multiselect> establishes a fixed-positioning containing block that the library's heuristic doesn't recognize. Fix on your side: replace the property with `transform: translateZ(0)` on that ancestor, OR move the trigger out of that ancestor's subtree. If neither is acceptable, please file an issue at https://github.com/keenmate/web-multiselect/issues with the ancestor's computed CSS."
|
|
2184
2248
|
);
|
|
2185
2249
|
}
|
|
2186
2250
|
positionDropdown() {
|
|
@@ -2202,13 +2266,13 @@ class xs {
|
|
|
2202
2266
|
this.hint,
|
|
2203
2267
|
() => {
|
|
2204
2268
|
let e = "top-start";
|
|
2205
|
-
this.dropdownPlacement && (this.dropdownPlacement.startsWith("bottom") ? e = this.dropdownPlacement.replace("bottom", "top") : this.dropdownPlacement.startsWith("top") && (e = this.dropdownPlacement.replace("top", "bottom"))),
|
|
2269
|
+
this.dropdownPlacement && (this.dropdownPlacement.startsWith("bottom") ? e = this.dropdownPlacement.replace("bottom", "top") : this.dropdownPlacement.startsWith("top") && (e = this.dropdownPlacement.replace("top", "bottom"))), ke(this.input, this.hint, {
|
|
2206
2270
|
placement: e,
|
|
2207
2271
|
strategy: "fixed",
|
|
2208
2272
|
middleware: [
|
|
2209
|
-
|
|
2273
|
+
ye(4),
|
|
2210
2274
|
// Don't use flip() - we want hint to stay opposite of dropdown
|
|
2211
|
-
|
|
2275
|
+
we({ padding: 8 })
|
|
2212
2276
|
]
|
|
2213
2277
|
}).then(({ x: t, y: s }) => {
|
|
2214
2278
|
Object.assign(this.hint.style, {
|
|
@@ -2278,27 +2342,27 @@ class xs {
|
|
|
2278
2342
|
}
|
|
2279
2343
|
renderSelectedPopoverVirtual(e, t) {
|
|
2280
2344
|
if (this.selectedPopoverVirtualScroll) {
|
|
2281
|
-
const
|
|
2282
|
-
|
|
2345
|
+
const a = this.selectedPopover.querySelector(".ms__selected-popover-header span");
|
|
2346
|
+
a && (a.textContent = `Selected Items (${t})`);
|
|
2283
2347
|
} else {
|
|
2284
|
-
const
|
|
2348
|
+
const a = this.options.badgeHeight ?? 36, l = `
|
|
2285
2349
|
<div class="ms__selected-popover-header">
|
|
2286
2350
|
<span>Selected Items (${t})</span>
|
|
2287
2351
|
<button type="button" class="ms__selected-popover-close" aria-label="Close"></button>
|
|
2288
2352
|
</div>
|
|
2289
|
-
<div class="ms__selected-popover-body ms__selected-popover-body--virtual" style="height: 18rem; overflow-y: auto; position: relative; --ms-badge-height-virtual: ${
|
|
2353
|
+
<div class="ms__selected-popover-body ms__selected-popover-body--virtual" style="height: 18rem; overflow-y: auto; position: relative; --ms-badge-height-virtual: ${a}px;"></div>
|
|
2290
2354
|
`;
|
|
2291
2355
|
this.selectedPopover.innerHTML = l, this.selectedPopoverContainer = this.selectedPopover.querySelector(".ms__selected-popover-body");
|
|
2292
2356
|
}
|
|
2293
2357
|
if (!this.selectedPopoverContainer) return;
|
|
2294
|
-
const r = (this.options.badgeHeight ?? 36) + 4,
|
|
2358
|
+
const r = (this.options.badgeHeight ?? 36) + 4, n = this.options.virtualScrollBuffer ?? 10;
|
|
2295
2359
|
requestAnimationFrame(() => {
|
|
2296
2360
|
this.selectedPopoverContainer && (this.selectedPopoverVirtualScroll ? this.selectedPopoverVirtualScroll.setItems(e) : this.selectedPopoverVirtualScroll = new We({
|
|
2297
2361
|
container: this.selectedPopoverContainer,
|
|
2298
2362
|
itemHeight: r,
|
|
2299
2363
|
items: e,
|
|
2300
|
-
renderItem: (
|
|
2301
|
-
bufferSize:
|
|
2364
|
+
renderItem: (a) => this.renderBadgeHTML(a, { displayMode: this.options.badgesDisplayMode || "badges", isInPopover: !0 }),
|
|
2365
|
+
bufferSize: n,
|
|
2302
2366
|
onVisibleRangeChange: () => {
|
|
2303
2367
|
this.attachBadgeTooltips(this.selectedPopoverContainer);
|
|
2304
2368
|
}
|
|
@@ -2319,22 +2383,22 @@ class xs {
|
|
|
2319
2383
|
let i;
|
|
2320
2384
|
const r = t.isInPopover ? this.options.renderSelectedItemContentCallback : void 0;
|
|
2321
2385
|
if (r) {
|
|
2322
|
-
const
|
|
2323
|
-
i = typeof
|
|
2386
|
+
const h = r(e);
|
|
2387
|
+
i = typeof h == "string" ? h : h.outerHTML;
|
|
2324
2388
|
} else if (this.options.renderBadgeContentCallback) {
|
|
2325
|
-
const
|
|
2326
|
-
i = typeof
|
|
2389
|
+
const h = this.options.renderBadgeContentCallback(e, t);
|
|
2390
|
+
i = typeof h == "string" ? h : h.outerHTML;
|
|
2327
2391
|
} else
|
|
2328
2392
|
i = this.getItemBadgeDisplayValue(e);
|
|
2329
|
-
const
|
|
2330
|
-
let
|
|
2331
|
-
if (
|
|
2332
|
-
const
|
|
2333
|
-
|
|
2393
|
+
const n = t.isInPopover ? this.options.getSelectedItemClassCallback || this.options.getBadgeClassCallback : this.options.getBadgeClassCallback;
|
|
2394
|
+
let a = "ms__badge";
|
|
2395
|
+
if (n) {
|
|
2396
|
+
const h = n(e), c = Array.isArray(h) ? h : [h];
|
|
2397
|
+
a += " " + c.filter((p) => p).join(" ");
|
|
2334
2398
|
}
|
|
2335
2399
|
const l = this.getItemBadgeDisplayValue(e);
|
|
2336
2400
|
return `
|
|
2337
|
-
<div class="${
|
|
2401
|
+
<div class="${a}">
|
|
2338
2402
|
<span class="ms__badge-text">${i}</span>
|
|
2339
2403
|
<button type="button" class="ms__badge-remove" data-value="${s}" aria-label="Remove ${l}"></button>
|
|
2340
2404
|
</div>
|
|
@@ -2349,7 +2413,7 @@ class xs {
|
|
|
2349
2413
|
if (s) {
|
|
2350
2414
|
e.preventDefault();
|
|
2351
2415
|
const i = s.dataset.value, r = this.selectedOptions.get(i);
|
|
2352
|
-
r &&
|
|
2416
|
+
r && this.interactiveDeselect(r) && (this.renderSelectedPopover(), this.selectedValues.size === 0 && this.hideSelectedPopover());
|
|
2353
2417
|
}
|
|
2354
2418
|
}
|
|
2355
2419
|
positionSelectedPopover() {
|
|
@@ -2451,9 +2515,12 @@ class xs {
|
|
|
2451
2515
|
trigger: e.trigger,
|
|
2452
2516
|
container: this.options.container ?? s ?? document.body,
|
|
2453
2517
|
content: e.content,
|
|
2454
|
-
placement: this.options.badgeTooltipPlacement
|
|
2455
|
-
offsetDistance: this.options.badgeTooltipOffset ?? 8,
|
|
2456
|
-
showDelay: this.options.badgeTooltipDelay ?? 100,
|
|
2518
|
+
placement: e.placement ?? this.options.badgeTooltipPlacement ?? "top",
|
|
2519
|
+
offsetDistance: e.offsetDistance ?? this.options.badgeTooltipOffset ?? 8,
|
|
2520
|
+
showDelay: e.showDelay ?? this.options.badgeTooltipDelay ?? 100,
|
|
2521
|
+
cssClass: e.cssClass,
|
|
2522
|
+
visibleClass: e.visibleClass,
|
|
2523
|
+
followCursor: e.followCursor,
|
|
2457
2524
|
onBeforeShow: e.onBeforeShow
|
|
2458
2525
|
});
|
|
2459
2526
|
this.tooltips.set(e.id, i);
|
|
@@ -2475,51 +2542,96 @@ ${s}` : t;
|
|
|
2475
2542
|
attachBadgeTooltips(e) {
|
|
2476
2543
|
if (!this.options.isBadgeTooltipsEnabled) return;
|
|
2477
2544
|
const t = !!e, s = e || this.badgesContainer, i = t ? "popover-" : "";
|
|
2478
|
-
if (s.querySelectorAll(".ms__badge:not(.ms__badge--more)").forEach((
|
|
2479
|
-
const
|
|
2480
|
-
if (!
|
|
2481
|
-
const l =
|
|
2482
|
-
if (!
|
|
2483
|
-
const
|
|
2545
|
+
if (s.querySelectorAll(".ms__badge:not(.ms__badge--more)").forEach((n) => {
|
|
2546
|
+
const a = n.querySelector(".ms__badge-remove");
|
|
2547
|
+
if (!a) return;
|
|
2548
|
+
const l = a.dataset.value, h = this.selectedOptions.get(l);
|
|
2549
|
+
if (!h) return;
|
|
2550
|
+
const c = `${i}${l}`, p = `${i}${l}-remove`, u = n.querySelector(".ms__badge-text");
|
|
2484
2551
|
u && this.spawnTooltip({
|
|
2485
|
-
id:
|
|
2552
|
+
id: c,
|
|
2486
2553
|
trigger: u,
|
|
2487
|
-
content: this.buildBadgeTooltipContent(
|
|
2554
|
+
content: this.buildBadgeTooltipContent(h)
|
|
2488
2555
|
});
|
|
2489
|
-
const m = this.getItemBadgeDisplayValue(
|
|
2556
|
+
const m = this.getItemBadgeDisplayValue(h);
|
|
2490
2557
|
this.spawnTooltip({
|
|
2491
2558
|
id: p,
|
|
2492
|
-
trigger:
|
|
2493
|
-
content: this.buildRemoveButtonTooltipText(m,
|
|
2559
|
+
trigger: a,
|
|
2560
|
+
content: this.buildRemoveButtonTooltipText(m, h),
|
|
2494
2561
|
// Keep parent badge tooltip from overlapping the remove-button tooltip.
|
|
2495
2562
|
onBeforeShow: () => {
|
|
2496
2563
|
var b;
|
|
2497
|
-
return (b = this.tooltips.get(
|
|
2564
|
+
return (b = this.tooltips.get(c)) == null ? void 0 : b.hideImmediate();
|
|
2498
2565
|
}
|
|
2499
2566
|
});
|
|
2500
2567
|
}), !t) {
|
|
2501
|
-
const
|
|
2502
|
-
if (
|
|
2503
|
-
const l = this.options.badgesMaxVisible || 3,
|
|
2568
|
+
const n = this.badgesContainer.querySelector(".ms__badge--more"), a = n == null ? void 0 : n.querySelector(".ms__badge-remove");
|
|
2569
|
+
if (a && a.dataset.action === "remove-hidden") {
|
|
2570
|
+
const l = this.options.badgesMaxVisible || 3, h = this.selectedOptions.size - l;
|
|
2504
2571
|
this.spawnTooltip({
|
|
2505
2572
|
id: "more-badge-remove",
|
|
2506
|
-
trigger:
|
|
2507
|
-
content: this.buildRemoveButtonTooltipText(`${
|
|
2573
|
+
trigger: a,
|
|
2574
|
+
content: this.buildRemoveButtonTooltipText(`${h} hidden items`)
|
|
2508
2575
|
});
|
|
2509
2576
|
}
|
|
2510
2577
|
}
|
|
2511
2578
|
}
|
|
2579
|
+
/** Build the option tooltip content (callback overrides; default = displayValue + optional subtitle on next line). */
|
|
2580
|
+
buildOptionTooltipContent(e) {
|
|
2581
|
+
if (this.options.getOptionTooltipCallback) return this.options.getOptionTooltipCallback(e);
|
|
2582
|
+
const t = this.getItemDisplayValue(e), s = this.getItemSubtitle(e);
|
|
2583
|
+
return s ? `${t}
|
|
2584
|
+
${s}` : t;
|
|
2585
|
+
}
|
|
2586
|
+
/**
|
|
2587
|
+
* Attach hover tooltips to the currently rendered dropdown options. Prunes existing option
|
|
2588
|
+
* tooltips first, so it's safe to call on every render and on every virtual-scroll range change
|
|
2589
|
+
* (where option DOM is recycled). Each option resolves its source object via `data-index` into
|
|
2590
|
+
* `filteredOptions`, the same global index `renderOption` was given.
|
|
2591
|
+
*/
|
|
2592
|
+
attachOptionTooltips() {
|
|
2593
|
+
if (this.destroyAllOptionTooltips(), !this.options.isOptionTooltipsEnabled) return;
|
|
2594
|
+
this.dropdown.querySelectorAll(".ms__option").forEach((t) => {
|
|
2595
|
+
const s = t, i = parseInt(s.dataset.index ?? "-1", 10);
|
|
2596
|
+
if (i < 0) return;
|
|
2597
|
+
const r = this.filteredOptions[i];
|
|
2598
|
+
if (!r) return;
|
|
2599
|
+
const n = this.buildOptionTooltipContent(r);
|
|
2600
|
+
n && this.spawnTooltip({
|
|
2601
|
+
id: `option-${i}`,
|
|
2602
|
+
trigger: s,
|
|
2603
|
+
content: n,
|
|
2604
|
+
// Default to `top-start` (anchored to the row's start edge) so the tooltip doesn't
|
|
2605
|
+
// center on a full-width row. Falls through to the badge settings for delay/offset.
|
|
2606
|
+
placement: this.options.optionTooltipPlacement ?? "top-start",
|
|
2607
|
+
offsetDistance: this.options.optionTooltipOffset ?? this.options.badgeTooltipOffset ?? 8,
|
|
2608
|
+
showDelay: this.options.optionTooltipDelay ?? this.options.badgeTooltipDelay ?? 100,
|
|
2609
|
+
cssClass: "ms__option-tooltip",
|
|
2610
|
+
visibleClass: "ms__option-tooltip--visible",
|
|
2611
|
+
followCursor: this.options.isOptionTooltipFollowCursor
|
|
2612
|
+
});
|
|
2613
|
+
});
|
|
2614
|
+
}
|
|
2615
|
+
/**
|
|
2616
|
+
* Destroy only the option tooltips (prefixed `option-`). Called before re-rendering or
|
|
2617
|
+
* recycling the options list so per-option tooltip state doesn't leak.
|
|
2618
|
+
*/
|
|
2619
|
+
destroyAllOptionTooltips() {
|
|
2620
|
+
var e;
|
|
2621
|
+
for (const t of Array.from(this.tooltips.keys()))
|
|
2622
|
+
t.startsWith("option-") && ((e = this.tooltips.get(t)) == null || e.destroy(), this.tooltips.delete(t));
|
|
2623
|
+
}
|
|
2512
2624
|
attachActionButtonTooltips() {
|
|
2513
2625
|
this.dropdown.querySelectorAll(".ms__action-btn").forEach((t) => {
|
|
2514
|
-
var
|
|
2626
|
+
var h, c;
|
|
2515
2627
|
const s = t, i = s.dataset.action;
|
|
2516
2628
|
if (!i) return;
|
|
2517
|
-
const r = parseInt(s.dataset.buttonIndex || "-1"),
|
|
2518
|
-
if (!a) return;
|
|
2519
|
-
const n = a.getTooltipCallback ? a.getTooltipCallback(this) : a.tooltip;
|
|
2629
|
+
const r = parseInt(s.dataset.buttonIndex || "-1"), n = r >= 0 ? (h = this.options.actionButtons) == null ? void 0 : h[r] : (c = this.options.actionButtons) == null ? void 0 : c.find((p) => p.action === i);
|
|
2520
2630
|
if (!n) return;
|
|
2631
|
+
const a = n.getTooltipCallback ? n.getTooltipCallback(this) : n.tooltip;
|
|
2632
|
+
if (!a) return;
|
|
2521
2633
|
const l = `action-${r >= 0 ? r : i}`;
|
|
2522
|
-
this.spawnTooltip({ id: l, trigger: s, content:
|
|
2634
|
+
this.spawnTooltip({ id: l, trigger: s, content: a });
|
|
2523
2635
|
});
|
|
2524
2636
|
}
|
|
2525
2637
|
/**
|
|
@@ -2548,7 +2660,7 @@ ${s}` : t;
|
|
|
2548
2660
|
this.destroyAllTooltips(), this.searchDebounceTimer && (clearTimeout(this.searchDebounceTimer), this.searchDebounceTimer = void 0), this.abortInFlightSearch(), this.dropdownCleanup && this.dropdownCleanup(), this.hintCleanup && this.hintCleanup(), this.selectedPopoverCleanup && this.selectedPopoverCleanup(), this.documentClickHandler && (document.removeEventListener("click", this.documentClickHandler), this.documentClickHandler = null), this.documentKeydownHandler && (document.removeEventListener("keydown", this.documentKeydownHandler), this.documentKeydownHandler = null), 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("ms", "ms--open", "ms--no-checkboxes"), oe.info(`[${this.instanceId}] Component destroyed`);
|
|
2549
2661
|
}
|
|
2550
2662
|
}
|
|
2551
|
-
const Cs = `@layer variables,component,overrides;@layer variables{:host{display:block;--ms-rem: 10px;font-family:var(--ms-font-family, var(--base-font-family, inherit));--ms-accent-color: var(--base-accent-color, #3b82f6);--ms-accent-color-hover: var(--base-accent-color-hover, #2563eb);--ms-accent-color-active: var(--base-accent-color-active, #1d4ed8);--ms-accent-color-light: var(--base-accent-color-light, light-dark(#eff6ff, #1e3a5f));--ms-accent-color-light-hover: var(--base-accent-color-light-hover, light-dark(#e0f2fe, #264a73));--ms-text-color-1: var(--base-text-color-1, light-dark(#111827, #f5f5f5));--ms-text-color-2: var(--base-text-color-2, light-dark(#353b47, #d4d4d4));--ms-text-color-3: var(--base-text-color-3, light-dark(#6b7280, #a3a3a3));--ms-text-color-4: var(--base-text-color-4, light-dark(#a0a3a9, #737373));--ms-text-color-on-accent: var(--base-text-color-on-accent, #ffffff);--ms-text-primary: var(--ms-text-color-1);--ms-text-secondary: var(--ms-text-color-3);--ms-primary-bg: var(--base-hover-bg, color-mix(in srgb, var(--ms-text-color-1) 8%, var(--base-main-bg, light-dark(#ffffff, #1a1a1a))));--ms-primary-bg-hover: var(--base-active-bg, color-mix(in srgb, var(--ms-text-color-1) 14%, var(--base-main-bg, light-dark(#ffffff, #1a1a1a))));--ms-border-color: var(--base-border-color, light-dark(#e5e7eb, #3a3a3a));--ms-border: var(--base-border, 1px solid var(--ms-border-color));--ms-input-bg: var(--base-input-bg, light-dark(#ffffff, #1a1a1a));--ms-input-color: var(--base-input-color, var(--ms-text-color-1));--ms-input-border: var(--base-input-border, 1px solid var(--ms-border-color));--ms-input-border-hover: var(--base-input-border-hover, 1px solid var(--ms-accent-color));--ms-input-border-focus: var(--base-input-border-focus, 1px solid var(--ms-accent-color));--ms-input-placeholder-color: var(--base-input-placeholder-color, var(--ms-text-color-4));--ms-input-bg-disabled: var(--base-input-bg-disabled, rgba(107, 114, 128, .05));--ms-toggle-icon-color: var(--ms-text-color-3);--ms-toggle-icon-color-open: var(--ms-text-color-3);--ms-counter-badge-bg: var(--ms-accent-color);--ms-counter-badge-bg-hover: var(--ms-accent-color-hover);--ms-counter-badge-color: var(--ms-text-color-on-accent);--ms-hint-bg: var(--base-main-bg, light-dark(#ffffff, #1a1a1a));--ms-hint-color: var(--ms-text-color-4);--ms-hint-border-color: var(--ms-border-color);--ms-dropdown-bg: var(--base-dropdown-bg, var(--base-elevated-bg, light-dark(#ffffff, #1a1a1a)));--ms-dropdown-text-color: var(--ms-text-color-1);--ms-dropdown-border-color: var(--ms-border-color);--ms-dropdown-box-shadow-semantic: var(--base-dropdown-box-shadow, 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1));--ms-actions-bg: var(--base-main-bg, light-dark(#ffffff, #1a1a1a));--ms-actions-border-color: var(--ms-border-color);--ms-action-button-bg: transparent;--ms-action-button-bg-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-color-1);--ms-group-border-color: var(--ms-border-color);--ms-option-text-color: var(--ms-text-color-1);--ms-option-bg: transparent;--ms-option-bg-hover: var(--ms-primary-bg);--ms-option-color-hover: inherit;--ms-option-bg-focused: var(--ms-primary-bg);--ms-option-color-focused: inherit;--ms-option-outline-color-focused: var(--ms-accent-color);--ms-option-bg-selected: color-mix(in srgb, var(--ms-accent-color) 10%, transparent);--ms-option-bg-matched: color-mix(in srgb, var(--ms-accent-color) 8%, transparent);--ms-option-color-matched: inherit;--ms-option-border-matched-color: color-mix(in srgb, var(--ms-accent-color) 40%, transparent);--ms-option-title-color: var(--ms-text-color-1);--ms-option-subtitle-color: var(--ms-text-color-3);--ms-option-mark-bg: color-mix(in srgb, var(--ms-accent-color) 20%, transparent);--ms-option-mark-color: inherit;--ms-loading-color: var(--ms-text-color-3);--ms-badge-bg: var(--ms-accent-color-light);--ms-badge-bg-hover: var(--base-hover-bg, var(--ms-input-bg));--ms-badge-bg-active: var(--ms-accent-color-light-hover);--ms-badge-text-bg-hover: var(--base-hover-bg, var(--ms-input-bg));--ms-badge-text-color-hover: var(--ms-badge-text-color);--ms-badge-counter-border-color: var(--ms-border-color);--ms-badge-counter-text-bg: var(--ms-primary-bg-hover);--ms-badge-counter-text-color: var(--ms-text-color-1);--ms-badge-counter-remove-bg: var(--ms-text-color-3);--ms-badge-counter-remove-bg-hover: var(--ms-text-color-1);--ms-badge-counter-remove-color: var(--ms-text-color-on-accent);--ms-counter-wrapper-border-color: var(--ms-border-color);--ms-count-clear-bg-hover: var(--ms-accent-color);--ms-tooltip-bg: var(--base-tooltip-bg, var(--base-inverse-bg, light-dark(#333333, #f5f5f5)));--ms-tooltip-text-color: var(--base-tooltip-text-color, light-dark(#ffffff, #1a1a1a));--ms-selected-popover-bg: var(--base-dropdown-bg, var(--base-elevated-bg, light-dark(#ffffff, #1a1a1a)));--ms-selected-popover-border-color: var(--ms-border-color);--ms-selected-popover-header-border-color: var(--ms-border-color);--ms-selected-popover-close-bg-hover: var(--ms-accent-color);--ms-input-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-input-padding-right: calc(4 * var(--ms-rem));--ms-input-padding-h: calc(1.2 * var(--ms-rem));--ms-input-height: calc(var(--base-input-size-md-height, 3.5) * var(--ms-rem));--ms-input-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-input-border-width: 1px;--ms-input-border-radius: var(--ms-border-radius-md);--ms-input-text: var(--ms-text-color-1);--ms-input-bg-disabled: rgba(107, 114, 128, .05);--ms-input-size-xs-font: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-input-size-xs-padding-v: calc(.4 * var(--ms-rem));--ms-input-size-xs-padding-h: calc(.8 * var(--ms-rem));--ms-input-size-xs-height: calc(var(--base-input-size-xs-height, 3.1) * var(--ms-rem));--ms-input-size-sm-font: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-input-size-sm-padding-v: calc(.5 * var(--ms-rem));--ms-input-size-sm-padding-h: calc(1 * var(--ms-rem));--ms-input-size-sm-height: calc(var(--base-input-size-sm-height, 3.3) * var(--ms-rem));--ms-input-size-md-font: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-input-size-md-padding-v: calc(.8 * var(--ms-rem));--ms-input-size-md-padding-h: calc(1.2 * var(--ms-rem));--ms-input-size-md-height: calc(var(--base-input-size-md-height, 3.5) * var(--ms-rem));--ms-input-size-lg-font: calc(var(--base-font-size-base, 1.6) * var(--ms-rem));--ms-input-size-lg-padding-v: calc(1 * var(--ms-rem));--ms-input-size-lg-padding-h: calc(1.4 * var(--ms-rem));--ms-input-size-lg-height: calc(var(--base-input-size-lg-height, 3.8) * var(--ms-rem));--ms-input-size-xl-font: calc(var(--base-font-size-lg, 1.8) * var(--ms-rem));--ms-input-size-xl-padding-v: calc(1.2 * var(--ms-rem));--ms-input-size-xl-padding-h: calc(1.6 * var(--ms-rem));--ms-input-size-xl-height: calc(var(--base-input-size-xl-height, 4.1) * var(--ms-rem));--ms-toggle-right: calc(1.2 * var(--ms-rem));--ms-toggle-color: var(--ms-text-color-3);--ms-transform-center-y: translateY(-50%);--ms-transform-rotate-180: 180deg;--ms-counter-offset: calc(3.2 * var(--ms-rem));--ms-counter-padding: calc(.2 * var(--ms-rem)) calc(.4 * var(--ms-rem));--ms-counter-bg: var(--ms-accent-color);--ms-counter-color: var(--ms-text-color-on-accent);--ms-counter-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-counter-font-weight: var(--base-font-weight-semibold, 600);--ms-counter-border-radius: var(--ms-border-radius-sm);--ms-counter-bg-hover: var(--ms-accent-color-hover);--ms-transform-scale-hover: 1.1;--ms-hint-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-hint-border: 1px solid var(--ms-hint-border-color);--ms-hint-border-radius: var(--ms-border-radius-lg);--ms-hint-box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--ms-hint-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-dropdown-border: var(--base-dropdown-border, 1px solid var(--ms-dropdown-border-color));--ms-dropdown-border-radius: var(--ms-border-radius-lg);--ms-dropdown-box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--ms-options-max-height: calc(32 * var(--ms-rem));--ms-option-color: var(--ms-text-color-1);--ms-z-index-dropdown: 9999;--ms-z-index-sticky: 1;--ms-actions-gap: calc(.4 * var(--ms-rem));--ms-actions-padding: calc(.8 * var(--ms-rem));--ms-actions-border-bottom: 1px solid var(--ms-actions-border-color);--ms-action-btn-padding: calc(.4 * var(--ms-rem)) calc(.8 * var(--ms-rem));--ms-action-btn-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-action-btn-border: var(--ms-border);--ms-action-btn-border-radius: var(--ms-border-radius-sm);--ms-action-btn-bg: transparent;--ms-action-btn-color: inherit;--ms-action-btn-bg-hover: var(--ms-primary-bg);--ms-action-btn-border-color-hover: var(--ms-accent-color);--ms-transform-scale-active: .98;--ms-options-padding: 0;--ms-group-border-top: 1px solid var(--ms-group-border-color);--ms-group-margin-top: calc(.4 * var(--ms-rem));--ms-group-padding-top: calc(.4 * var(--ms-rem));--ms-group-label-padding: calc(.4 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-group-label-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-group-label-font-weight: var(--base-font-weight-semibold, 600);--ms-group-label-color: var(--ms-text-color-3);--ms-group-label-transform: uppercase;--ms-group-label-letter-spacing: .05em;--ms-option-gap: calc(.8 * var(--ms-rem));--ms-option-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-option-padding-h: calc(1.2 * var(--ms-rem));--ms-option-outline-focused: 2px solid var(--ms-option-outline-color-focused);--ms-option-focus-outline-offset: -2px;--ms-option-border-matched: 3px solid var(--ms-option-border-matched-color);--ms-option-bg-focused-hover: var(--ms-primary-bg);--ms-option-bg-matched-hover: color-mix(in srgb, var(--ms-accent-color) 12%, transparent);--ms-option-bg-selected-focused: color-mix(in srgb, var(--ms-accent-color) 15%, transparent);--ms-option-bg-selected-matched: color-mix(in srgb, var(--ms-accent-color) 15%, transparent);--ms-option-disabled-bg: var(--base-disabled-bg, transparent);--ms-option-bg-disabled-selected: color-mix(in srgb, var(--ms-accent-color) 10%, transparent);--ms-disabled-opacity: .5;--ms-option-content-gap: calc(.8 * var(--ms-rem));--ms-option-icon-size: calc(2 * var(--ms-rem));--ms-option-icon-font-size: calc(var(--base-font-size-base, 1.6) * var(--ms-rem));--ms-option-title-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-option-mark-font-weight: var(--base-font-weight-semibold, 600);--ms-option-subtitle-margin-top: calc(.4 * var(--ms-rem));--ms-option-subtitle-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-option-subtitle-line-height: var(--base-line-height-tight, 1.25);--ms-checkbox-margin-top: calc(.2 * var(--ms-rem));--ms-checkbox-margin-right: 0;--ms-checkbox-margin-bottom: 0;--ms-checkbox-margin-left: 0;--ms-checkbox-size: calc(1.6 * var(--ms-rem));--ms-checkbox-scale: 1;--ms-checkbox-align: center;--ms-checkbox-bg: var(--ms-input-bg);--ms-checkbox-border: var(--ms-border);--ms-checkbox-border-radius: calc(.3 * var(--ms-rem));--ms-checkbox-checked-bg: var(--ms-accent-color);--ms-checkbox-checked-border: 1px solid var(--ms-accent-color);--ms-checkbox-checkmark-color: var(--ms-text-color-on-accent);--ms-checkbox-hover-border-color: var(--ms-accent-color);--ms-checkbox-disabled-bg: var(--ms-primary-bg);--ms-checkbox-disabled-border: var(--ms-border);--ms-checkbox-checked-bg-hover: var(--ms-accent-color-hover);--ms-checkbox-checked-border-color-hover: var(--ms-accent-color-hover);--ms-empty-padding: calc(1.6 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-empty-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-empty-color: var(--ms-text-color-3);--ms-loader-padding: calc(1.6 * var(--ms-rem));--ms-loader-gap: calc(.8 * var(--ms-rem));--ms-loading-text-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-loading-text-color: var(--ms-text-color-3);--ms-badges-gap: calc(.8 * var(--ms-rem));--ms-badges-margin-bottom: calc(.8 * var(--ms-rem));--ms-badges-margin-top: calc(.8 * var(--ms-rem));--ms-badges-margin-left: calc(.4 * var(--ms-rem));--ms-badges-margin-right: calc(.4 * var(--ms-rem));--ms-inline-align: center;--ms-badge-gap: calc(.8 * var(--ms-rem));--ms-badge-height: calc(2.7 * var(--ms-rem));--ms-badge-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-badge-font-weight: var(--base-font-weight-semibold, 600);--ms-badge-border-radius: var(--ms-border-radius-sm);--ms-order-first: -1;--ms-badge-text-padding: 0 calc(.8 * var(--ms-rem));--ms-badge-text-bg: var(--ms-accent-color-light);--ms-badge-text-color: var(--ms-accent-color);--ms-badge-text-border: none;--ms-badge-remove-width: calc(2.7 * var(--ms-rem));--ms-badge-remove-bg: var(--ms-accent-color);--ms-badge-remove-color: var(--ms-text-color-on-accent);--ms-badge-remove-border: none;--ms-badge-remove-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-badge-remove-bg-hover: var(--ms-accent-color-hover);--ms-badge-remove-box-shadow-focus: 0 0 0 2px color-mix(in srgb, var(--ms-accent-color) 50%, transparent);--ms-badge-remove-icon-size: calc(1 * var(--ms-rem));--ms-icon-remove: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 6L18 18M18 6L6 18' stroke='black' stroke-width='2.5' stroke-linecap='round' fill='none'/></svg>");--ms-badge-counter-bg: transparent;--ms-badge-counter-border: 1px solid var(--ms-badge-counter-border-color);--ms-badge-counter-border-radius: var(--ms-border-radius-sm);--ms-more-badge-bg: var(--ms-accent-color-light);--ms-more-badge-hover-bg: var(--ms-badge-bg-hover);--ms-more-badge-active-bg: var(--ms-accent-color-light-hover);--ms-count-display-margin-bottom: calc(.8 * var(--ms-rem));--ms-count-display-margin-top: calc(.8 * var(--ms-rem));--ms-count-display-margin-left: calc(.8 * var(--ms-rem));--ms-count-display-margin-right: calc(.8 * var(--ms-rem));--ms-counter-wrapper-bg: transparent;--ms-counter-wrapper-border: var(--ms-border);--ms-counter-wrapper-border-radius: var(--ms-border-radius-sm);--ms-counter-wrapper-padding: calc(.4 * var(--ms-rem)) calc(.8 * var(--ms-rem));--ms-counter-wrapper-gap: calc(.4 * var(--ms-rem));--ms-counter-wrapper-bg-hover: var(--ms-primary-bg);--ms-counter-wrapper-border-color-hover: var(--ms-accent-color);--ms-count-text-bg: transparent;--ms-count-text-border: none;--ms-count-text-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-count-text-color: var(--ms-text-color-1);--ms-count-clear-size: calc(1.6 * var(--ms-rem));--ms-count-clear-bg: transparent;--ms-count-clear-color: var(--ms-text-color-3);--ms-count-clear-font-size: calc(var(--base-font-size-lg, 1.8) * var(--ms-rem));--ms-count-clear-border-radius: var(--ms-border-radius-sm);--ms-count-clear-bg-hover: color-mix(in srgb, var(--ms-accent-color) 20%, transparent);--ms-count-clear-color-hover: var(--ms-accent-color);--ms-count-clear-icon-size: calc(1.4 * var(--ms-rem));--ms-icon-clear: var(--ms-icon-remove);--ms-tooltip-color: var(--ms-tooltip-text-color);--ms-tooltip-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-tooltip-border-radius: var(--ms-border-radius-lg);--ms-tooltip-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-tooltip-max-width: calc(32 * var(--ms-rem));--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: calc(32 * var(--ms-rem));--ms-selected-popover-max-height: calc(32 * var(--ms-rem));--ms-selected-popover-border: 1px solid var(--ms-selected-popover-border-color);--ms-selected-popover-border-radius: var(--ms-border-radius-lg);--ms-selected-popover-box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--ms-selected-popover-header-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-selected-popover-header-bg: color-mix(in srgb, var(--ms-accent-color) 10%, transparent);--ms-selected-popover-header-border-bottom: 1px solid var(--ms-selected-popover-header-border-color);--ms-selected-popover-header-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-selected-popover-header-font-weight: var(--base-font-weight-semibold, 600);--ms-selected-popover-header-color: var(--ms-text-color-1);--ms-popover-close-size: calc(2.4 * var(--ms-rem));--ms-selected-popover-close-bg: transparent;--ms-selected-popover-close-color: var(--ms-text-color-3);--ms-selected-popover-close-font-size: calc(var(--base-font-size-xl, 2) * var(--ms-rem));--ms-selected-popover-close-border-radius: var(--ms-border-radius-sm);--ms-selected-popover-close-bg-hover: color-mix(in srgb, var(--ms-accent-color) 20%, transparent);--ms-selected-popover-close-color-hover: var(--ms-accent-color);--ms-selected-popover-close-icon-size: calc(1.4 * var(--ms-rem));--ms-selected-popover-body-gap: calc(.4 * var(--ms-rem));--ms-selected-popover-body-padding: calc(.8 * var(--ms-rem));--ms-selected-popover-body-max-height: calc(28.8 * var(--ms-rem));--ms-font-size-2xs: calc(var(--base-font-size-2xs, 1) * var(--ms-rem));--ms-font-size-xs: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-font-size-sm: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-font-size-base: calc(var(--base-font-size-base, 1.6) * var(--ms-rem));--ms-font-size-lg: calc(var(--base-font-size-lg, 1.8) * var(--ms-rem));--ms-font-weight-normal: var(--base-font-weight-normal, 400);--ms-font-weight-medium: var(--base-font-weight-medium, 500);--ms-font-weight-semibold: var(--base-font-weight-semibold, 600);--ms-line-height-none: 1;--ms-line-height-tight: var(--base-line-height-tight, 1.25);--ms-line-height-normal: var(--base-line-height-normal, 1.5);--ms-line-height-relaxed: var(--base-line-height-relaxed, 1.75);--ms-border-radius-sm: calc(var(--base-border-radius-sm, .4) * var(--ms-rem));--ms-border-radius-md: calc(var(--base-border-radius-md, .6) * var(--ms-rem));--ms-border-radius-lg: calc(var(--base-border-radius-lg, .8) * var(--ms-rem));--ms-border-radius: var(--ms-border-radius-md);--ms-spacing-xs: calc(.4 * var(--ms-rem));--ms-spacing-sm: calc(.8 * var(--ms-rem));--ms-spacing-md: calc(1.2 * var(--ms-rem));--ms-spacing-lg: calc(1.6 * var(--ms-rem));--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;--ms-scrollbar-width: 8px;--ms-scrollbar-track-bg: transparent;--ms-scrollbar-thumb-bg: var(--ms-border-color);--ms-scrollbar-thumb-bg-hover: var(--ms-text-color-3);--ms-scrollbar-thumb-border-radius: 4px;--ms-debug-bg: var(--base-elevated-bg, light-dark(#f9fafb, #2b2b2b));--ms-debug-border-color: var(--ms-border-color);--ms-debug-text-color: var(--ms-text-color-1);--ms-debug-border-radius: var(--ms-border-radius-md);--ms-debug-summary-color: var(--ms-accent-color);--ms-debug-summary-bg-hover: var(--ms-primary-bg);--ms-debug-summary-outline-color: var(--ms-accent-color);--ms-debug-summary-border-radius: var(--ms-border-radius-sm);--ms-debug-stats-bg: var(--base-main-bg, light-dark(#ffffff, #1a1a1a));--ms-debug-stats-border-radius: var(--ms-border-radius-sm);--ms-debug-bullet-color: var(--ms-accent-color)}}@layer component{web-multiselect:not(:defined){display:block;min-height:calc(3.5 * var(--ms-rem));color:transparent!important;background:transparent}.ms__wrapper{display:flex;flex-direction:column;align-items:stretch}.ms__wrapper--inline{flex-direction:row;align-items:var(--ms-inline-align, center)}.ms{position:relative;width:100%}}@layer component{.ms__input-wrapper{position:relative;display:flex;align-items:center}.ms__input{box-sizing:border-box;width:100%;font-family:inherit;height:var(--ms-input-height);padding:var(--ms-input-padding);padding-right:var(--ms-input-padding-right);font-size:var(--ms-input-font-size);border:var(--ms-input-border);border-radius:var(--ms-input-border-radius);background:var(--ms-input-bg);color:var(--ms-input-color);cursor:pointer;transition:border var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__input:hover:not(:focus):not(:disabled){border:var(--ms-input-border-hover)}.ms__input:focus{outline:none;border:var(--ms-input-border-focus)}.ms__input::placeholder{color:var(--ms-input-placeholder-color);opacity:0;transition:opacity var(--ms-transition-fast) var(--ms-easing-snappy)}:host([data-ready]) .ms__input::placeholder{opacity:var(--ms-placeholder-opacity)}.ms__input.ms__input--xs{font-size:var(--ms-input-size-xs-font);padding:var(--ms-input-size-xs-padding-v) var(--ms-input-size-xs-padding-h);padding-right:calc(var(--ms-input-size-xs-padding-h) * 2.5);height:var(--ms-input-size-xs-height)}.ms__input.ms__input--sm{font-size:var(--ms-input-size-sm-font);padding:var(--ms-input-size-sm-padding-v) var(--ms-input-size-sm-padding-h);padding-right:calc(var(--ms-input-size-sm-padding-h) * 2.5);height:var(--ms-input-size-sm-height)}.ms__input.ms__input--lg{font-size:var(--ms-input-size-lg-font);padding:var(--ms-input-size-lg-padding-v) var(--ms-input-size-lg-padding-h);padding-right:calc(var(--ms-input-size-lg-padding-h) * 2.5);height:var(--ms-input-size-lg-height)}.ms__input.ms__input--xl{font-size:var(--ms-input-size-xl-font);padding:var(--ms-input-size-xl-padding-v) var(--ms-input-size-xl-padding-h);padding-right:calc(var(--ms-input-size-xl-padding-h) * 2.5);height:var(--ms-input-size-xl-height)}.ms__toggle{position:absolute;right:var(--ms-toggle-right);top:50%;transform:var(--ms-transform-center-y);pointer-events:none;color:var(--ms-toggle-icon-color);transition:transform var(--ms-transition-fast) var(--ms-easing-snappy)}.ms--open .ms__toggle{transform:var(--ms-transform-center-y) rotate(var(--ms-transform-rotate-180));color:var(--ms-toggle-icon-color-open)}.ms__counter{position:absolute;right:var(--ms-counter-offset);top:50%;transform:var(--ms-transform-center-y);padding:var(--ms-counter-padding);background:var(--ms-counter-badge-bg);color:var(--ms-counter-badge-color);font-size:var(--ms-counter-font-size);font-weight:var(--ms-counter-font-weight);border-radius:var(--ms-counter-border-radius);cursor:pointer;transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__counter:hover{background:var(--ms-counter-badge-bg-hover);transform:var(--ms-transform-center-y) scale(var(--ms-transform-scale-hover))}.ms__actions{display:flex;flex-wrap:nowrap;gap:var(--ms-actions-gap);padding:var(--ms-actions-padding);border-bottom:var(--ms-actions-border-bottom)}.ms__actions--wrap{flex-wrap:wrap}.ms__actions--sticky{position:sticky;top:0;z-index:var(--ms-z-index-sticky);background:var(--ms-actions-bg)}.ms__action-btn{flex:1;font-family:inherit;padding:var(--ms-action-btn-padding);font-size:var(--ms-action-btn-font-size);border:var(--ms-action-btn-border);border-radius:var(--ms-action-btn-border-radius);background:var(--ms-action-button-bg);color:var(--ms-action-button-color);cursor:pointer;transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__action-btn:hover{background:var(--ms-action-button-bg-hover);border-color:var(--ms-action-button-border-color-hover)}.ms__action-btn:active{transform:scale(var(--ms-transform-scale-active))}.ms__action-btn:disabled,.ms__action-btn[disabled]{opacity:var(--ms-disabled-opacity);cursor:not-allowed;pointer-events:none}}@layer component{.ms__hint{display:none;position:fixed;z-index:var(--ms-z-index-popover);padding:var(--ms-hint-padding);background:var(--ms-hint-bg);border:var(--ms-hint-border);border-radius:var(--ms-hint-border-radius);box-shadow:var(--ms-hint-box-shadow);font-size:var(--ms-hint-font-size);color:var(--ms-hint-color);line-height:var(--ms-line-height-relaxed);max-width:100%}.ms__hint--visible{display:block}.ms__dropdown{display:none;position:fixed;font-family:inherit;z-index:var(--ms-z-index-dropdown);background:var(--ms-dropdown-bg);border:var(--ms-dropdown-border);border-radius:var(--ms-dropdown-border-radius);box-shadow:var(--ms-dropdown-box-shadow);max-height:var(--ms-options-max-height);overflow:hidden;color:var(--ms-dropdown-text-color)}.ms__dropdown--visible{display:flex;flex-direction:column}.ms__dropdown-inner{flex:1;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--ms-scrollbar-thumb-bg) var(--ms-scrollbar-track-bg)}.ms__dropdown-inner::-webkit-scrollbar{width:var(--ms-scrollbar-width)}.ms__dropdown-inner::-webkit-scrollbar-track{background:var(--ms-scrollbar-track-bg)}.ms__dropdown-inner::-webkit-scrollbar-thumb{background:var(--ms-scrollbar-thumb-bg);border-radius:var(--ms-scrollbar-thumb-border-radius)}.ms__dropdown-inner::-webkit-scrollbar-thumb:hover{background:var(--ms-scrollbar-thumb-bg-hover)}.ms__dropdown--virtual{max-height:none}.ms__dropdown--virtual .ms__dropdown-inner{overflow-y:visible}.ms__badge-tooltip{position:fixed;z-index:var(--ms-tooltip-z-index);opacity:0;visibility:hidden;transition:opacity var(--ms-transition-normal) ease,visibility var(--ms-transition-normal) ease;background:var(--ms-tooltip-bg);color:var(--ms-tooltip-text-color);padding:var(--ms-tooltip-padding);border-radius:var(--ms-tooltip-border-radius);font-size:var(--ms-tooltip-font-size);line-height:var(--ms-line-height-relaxed);max-width:var(--ms-tooltip-max-width);word-wrap:break-word;white-space:pre-wrap;box-shadow:var(--ms-tooltip-shadow);pointer-events:none}.ms__badge-tooltip--visible{opacity:1;visibility:visible}.ms__selected-popover{display:none;position:fixed;z-index:var(--ms-z-index-popover);background:var(--ms-selected-popover-bg);border:var(--ms-selected-popover-border);border-radius:var(--ms-selected-popover-border-radius);box-shadow:var(--ms-selected-popover-box-shadow);width:var(--ms-selected-popover-width);max-height:var(--ms-selected-popover-max-height);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);background:var(--ms-selected-popover-header-bg);border-bottom:var(--ms-selected-popover-header-border-bottom);font-size:var(--ms-selected-popover-header-font-size);font-weight:var(--ms-selected-popover-header-font-weight);color:var(--ms-selected-popover-header-color)}.ms__selected-popover-close{display:flex;align-items:center;justify-content:center;width:var(--ms-popover-close-size);height:var(--ms-popover-close-size);padding:0;border:none;background:var(--ms-selected-popover-close-bg);color:var(--ms-selected-popover-close-color);font-size:var(--ms-selected-popover-close-font-size);line-height:var(--ms-line-height-none);cursor:pointer;border-radius:var(--ms-selected-popover-close-border-radius);transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__selected-popover-close:hover{background:var(--ms-selected-popover-close-bg-hover);color:var(--ms-selected-popover-close-color-hover)}.ms__selected-popover-close:before{content:"";display:block;width:var(--ms-selected-popover-close-icon-size);height:var(--ms-selected-popover-close-icon-size);background-color:currentColor;-webkit-mask:var(--ms-icon-remove) center / contain no-repeat;mask:var(--ms-icon-remove) center / contain no-repeat}.ms__selected-popover-body{display:flex;flex-direction:column;gap:var(--ms-selected-popover-body-gap);padding:var(--ms-selected-popover-body-padding);overflow-y:auto;max-height:var(--ms-selected-popover-body-max-height);scrollbar-width:thin;scrollbar-color:var(--ms-scrollbar-thumb-bg) var(--ms-scrollbar-track-bg)}.ms__selected-popover-body::-webkit-scrollbar{width:var(--ms-scrollbar-width)}.ms__selected-popover-body::-webkit-scrollbar-track{background:var(--ms-scrollbar-track-bg)}.ms__selected-popover-body::-webkit-scrollbar-thumb{background:var(--ms-scrollbar-thumb-bg);border-radius:var(--ms-scrollbar-thumb-border-radius)}.ms__selected-popover-body::-webkit-scrollbar-thumb:hover{background:var(--ms-scrollbar-thumb-bg-hover)}.ms__selected-popover-body .ms__badge{width:100%;min-height:fit-content;line-height:var(--ms-line-height-relaxed)}.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);overflow:hidden;box-sizing:border-box}.ms__selected-popover-body--virtual .ms__badge-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}@layer component{.ms--disabled .ms__input{opacity:var(--ms-disabled-input-opacity);cursor:not-allowed;background:var(--ms-input-bg-disabled)}.ms--disabled .ms__toggle{opacity:var(--ms-disabled-input-opacity)}.ms--no-checkboxes .ms__option{gap:0;padding-left:var(--ms-option-padding-h)}.ms--no-checkboxes .ms__option-content{padding-left:0}}@layer component;@layer component{.ms__badges{display:flex;flex-wrap:wrap;gap:var(--ms-badges-gap);padding:0}.ms__badges:empty{display:none}.ms__badges--bottom{margin-top:var(--ms-badges-margin-bottom)}.ms__badges--top{margin-bottom:var(--ms-badges-margin-top);order:var(--ms-order-first)}.ms__badges--left{order:var(--ms-order-first);margin-right:var(--ms-badges-margin-left);justify-content:flex-end}.ms__badges--right{margin-left:var(--ms-badges-margin-right);justify-content:flex-start}.ms__badge{display:inline-flex;align-items:center;height:var(--ms-badge-height);font-size:var(--ms-badge-font-size);font-weight:var(--ms-badge-font-weight);line-height:var(--ms-line-height-none);border-radius:var(--ms-badge-border-radius);overflow:hidden;max-width:100%}.ms__badge-text{display:flex;align-items:center;box-sizing:border-box;height:100%;padding:var(--ms-badge-text-padding);background:var(--ms-badge-text-bg);color:var(--ms-badge-text-color);border:var(--ms-badge-text-border);border-right:none;border-radius:var(--ms-badge-border-radius) 0 0 var(--ms-badge-border-radius);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:background-color var(--ms-transition-normal) ease,color var(--ms-transition-normal) ease}.ms__badge:hover .ms__badge-text{background:var(--ms-badge-text-bg-hover, var(--ms-badge-text-bg));color:var(--ms-badge-text-color-hover, var(--ms-badge-text-color))}.ms__badge-remove{display:flex;align-items:center;justify-content:center;box-sizing:border-box;font-family:inherit;width:var(--ms-badge-remove-width);height:100%;flex-shrink:0;background:var(--ms-badge-remove-bg);color:var(--ms-badge-remove-color);border:var(--ms-badge-remove-border);border-left:none;border-radius:0 var(--ms-badge-border-radius) var(--ms-badge-border-radius) 0;cursor:pointer;transition:background-color var(--ms-transition-normal) ease;font-size:var(--ms-badge-remove-font-size)}.ms__badge-remove:hover{background:var(--ms-badge-remove-bg-hover)}.ms__badge-remove:focus{outline:none}.ms__badge-remove:focus-visible{outline:none;box-shadow:var(--ms-badge-remove-box-shadow-focus)}.ms__badge-remove:before{content:"";display:block;width:var(--ms-badge-remove-icon-size);height:var(--ms-badge-remove-icon-size);background-color:currentColor;-webkit-mask:var(--ms-icon-remove) center / contain no-repeat;mask:var(--ms-icon-remove) center / contain no-repeat}.ms__badge--counter{cursor:pointer}.ms__badge--counter .ms__badge-text{background:var(--ms-badge-counter-text-bg);color:var(--ms-badge-counter-text-color);border:var(--ms-badge-counter-border);border-right:none}.ms__badge--counter .ms__badge-remove{background:var(--ms-badge-counter-remove-bg);color:var(--ms-badge-counter-remove-color);border:var(--ms-badge-counter-border);border-left:none}.ms__badge--counter .ms__badge-remove:hover{background:var(--ms-badge-counter-remove-bg-hover)}.ms__badge--more,.ms__badge[data-action=show-selected]{cursor:pointer}}@layer component{.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)}.ms__count-display--top{margin-bottom:var(--ms-count-display-margin-top);order:var(--ms-order-first)}.ms__count-display--left{order:var(--ms-order-first);margin-right:var(--ms-count-display-margin-left);justify-content:flex-start}.ms__count-display--right{margin-left:var(--ms-count-display-margin-right);justify-content:flex-end}.ms__counter-wrapper{display:inline-flex;align-items:center;gap:var(--ms-counter-wrapper-gap);background:var(--ms-counter-wrapper-bg);border:var(--ms-counter-wrapper-border);border-radius:var(--ms-counter-wrapper-border-radius);padding:var(--ms-counter-wrapper-padding);transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__counter-wrapper:hover{background:var(--ms-counter-wrapper-bg-hover);border-color:var(--ms-counter-wrapper-border-color-hover)}.ms__count-text{display:inline-flex;align-items:center;background:var(--ms-count-text-bg);border:var(--ms-count-text-border);padding:0;font-size:var(--ms-count-text-font-size);color:var(--ms-count-text-color);cursor:pointer;transition:color var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__count-clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:var(--ms-count-clear-size);height:var(--ms-count-clear-size);padding:0;border:none;background:var(--ms-count-clear-bg);color:var(--ms-count-clear-color);font-size:var(--ms-count-clear-font-size);line-height:var(--ms-line-height-none);cursor:pointer;border-radius:var(--ms-count-clear-border-radius);transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__count-clear:hover{background:var(--ms-count-clear-bg-hover);color:var(--ms-count-clear-color-hover)}.ms__count-clear:before{content:"";display:block;width:var(--ms-count-clear-icon-size);height:var(--ms-count-clear-icon-size);background-color:currentColor;-webkit-mask:var(--ms-icon-clear) center / contain no-repeat;mask:var(--ms-icon-clear) center / contain no-repeat}}@layer component{.ms__debug-info{margin-top:calc(.4 * var(--ms-rem));padding:calc(.4 * var(--ms-rem));background-color:var(--ms-debug-bg);border:1px solid var(--ms-debug-border-color);border-radius:var(--ms-debug-border-radius);font-size:calc(1.2 * var(--ms-rem));color:var(--ms-debug-text-color)}.ms__debug-info details summary{cursor:pointer;font-weight:600;color:var(--ms-debug-summary-color);-webkit-user-select:none;user-select:none;padding:calc(.4 * var(--ms-rem));border-radius:var(--ms-debug-summary-border-radius)}.ms__debug-info details summary:hover{background-color:var(--ms-debug-summary-bg-hover)}.ms__debug-info details summary:focus{outline:2px solid var(--ms-debug-summary-outline-color);outline-offset:2px}.ms__debug-info .ms__debug-stats{display:flex;flex-direction:column;gap:calc(.4 * var(--ms-rem));margin-top:calc(.4 * var(--ms-rem));padding:calc(.4 * var(--ms-rem));background-color:var(--ms-debug-stats-bg);border-radius:var(--ms-debug-stats-border-radius)}.ms__debug-info .ms__debug-stats span{display:flex;justify-content:space-between;padding:2px 4px;font-family:monospace;font-size:calc(1 * var(--ms-rem))}.ms__debug-info .ms__debug-stats span:before{content:"•";margin-right:calc(.4 * var(--ms-rem));color:var(--ms-debug-bullet-color)}}@layer component{.ms__options{padding:var(--ms-options-padding);scrollbar-width:thin;scrollbar-color:var(--ms-scrollbar-thumb-bg) var(--ms-scrollbar-track-bg)}.ms__options::-webkit-scrollbar{width:var(--ms-scrollbar-width)}.ms__options::-webkit-scrollbar-track{background:var(--ms-scrollbar-track-bg)}.ms__options::-webkit-scrollbar-thumb{background:var(--ms-scrollbar-thumb-bg);border-radius:var(--ms-scrollbar-thumb-border-radius)}.ms__options::-webkit-scrollbar-thumb:hover{background:var(--ms-scrollbar-thumb-bg-hover)}.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);margin-top:var(--ms-group-margin-top);padding-top:var(--ms-group-padding-top)}.ms__group-label{padding:var(--ms-group-label-padding);font-size:var(--ms-group-label-font-size);font-weight:var(--ms-group-label-font-weight);color:var(--ms-group-label-color);text-transform:var(--ms-group-label-transform);letter-spacing:var(--ms-group-label-letter-spacing)}.ms__option{display:flex;align-items:var(--ms-checkbox-align, center);gap:var(--ms-option-gap);padding:var(--ms-option-padding);color:var(--ms-option-text-color);background:var(--ms-option-bg);cursor:pointer}.ms__option:hover{background:var(--ms-option-bg-hover);color:var(--ms-option-color-hover, inherit)}.ms__option--focused{background:var(--ms-option-bg-focused);color:var(--ms-option-color-focused, inherit);outline:var(--ms-option-outline-focused);outline-offset:var(--ms-option-focus-outline-offset)}.ms__option--matched{background:var(--ms-option-bg-matched);color:var(--ms-option-color-matched, inherit);border-left:var(--ms-option-border-matched)}.ms__option--selected{background:var(--ms-option-bg-selected)}.ms__option--selected:hover{background:var(--ms-option-bg-selected-hover, var(--ms-option-bg-selected))}.ms__option--disabled{opacity:var(--ms-disabled-opacity);cursor:not-allowed;background:var(--ms-option-disabled-bg)}.ms__option--disabled:hover{background:var(--ms-option-disabled-bg)}.ms__option--focused:hover{background:var(--ms-option-bg-focused-hover);color:var(--ms-option-color-focused-hover, var(--ms-option-color-focused, var(--ms-option-text-color)))}.ms__option--matched:hover{background:var(--ms-option-bg-matched-hover);color:var(--ms-option-color-matched-hover, var(--ms-option-color-matched, var(--ms-option-text-color)))}.ms__option--selected.ms__option--focused{background:var(--ms-option-bg-selected-focused);outline:var(--ms-option-outline-focused);outline-offset:var(--ms-option-focus-outline-offset)}.ms__option--selected.ms__option--matched{background:var(--ms-option-bg-selected-matched);border-left:var(--ms-option-border-matched)}.ms__option--disabled.ms__option--selected{background:var(--ms-option-bg-disabled-selected)}.ms__option--disabled.ms__option--focused{outline:none}.ms__option[data-checkbox-align=top]{--ms-checkbox-align: flex-start}.ms__option[data-checkbox-align=bottom]{--ms-checkbox-align: flex-end}.ms__checkbox{appearance:none;-webkit-appearance:none;-moz-appearance:none;flex-shrink:0;position:relative;margin-top:var(--ms-checkbox-margin-top);margin-right:var(--ms-checkbox-margin-right);margin-bottom:var(--ms-checkbox-margin-bottom);margin-left:var(--ms-checkbox-margin-left);width:var(--ms-checkbox-size);height:var(--ms-checkbox-size);transform:scale(var(--ms-checkbox-scale));transform-origin:top left;cursor:pointer;background:var(--ms-checkbox-bg);border:var(--ms-checkbox-border);border-radius:var(--ms-checkbox-border-radius);transition:background-color .15s ease,border-color .15s ease}.ms__checkbox:after{content:"";position:absolute;display:none;left:50%;top:40%;width:30%;height:55%;transform:translate(-50%,-50%) rotate(45deg);border:solid var(--ms-checkbox-checkmark-color);border-width:0 2px 2px 0}.ms__checkbox:hover:not(:disabled){border-color:var(--ms-checkbox-hover-border-color)}.ms__checkbox:checked{background:var(--ms-checkbox-checked-bg);border:var(--ms-checkbox-checked-border)}.ms__checkbox:checked:after{display:block}.ms__checkbox:checked:hover:not(:disabled){background:var(--ms-checkbox-checked-bg-hover);border-color:var(--ms-checkbox-checked-border-color-hover)}.ms__checkbox:focus-visible{outline:2px solid var(--ms-checkbox-checked-bg);outline-offset:2px}.ms__checkbox:disabled{cursor:not-allowed;background:var(--ms-checkbox-disabled-bg);border:var(--ms-checkbox-disabled-border);opacity:.6}.ms__checkbox:disabled:checked{background:var(--ms-checkbox-disabled-bg)}.ms__option--disabled .ms__checkbox{cursor:not-allowed}.ms__option-content{flex:1;display:flex;align-items:center;gap:var(--ms-option-content-gap);min-width:0}.ms__option-icon{flex-shrink:0;width:var(--ms-option-icon-size);height:var(--ms-option-icon-size);display:flex;align-items:center;justify-content:center;font-size:var(--ms-option-icon-font-size)}.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);color:var(--ms-option-title-color);line-height:var(--ms-line-height-relaxed)}.ms__option:hover .ms__option-title{color:var(--ms-option-title-color-hover, var(--ms-option-title-color))}.ms__option--selected .ms__option-title{color:var(--ms-option-title-color-selected, var(--ms-option-title-color))}.ms__option--selected:hover .ms__option-title{color:var(--ms-option-title-color-selected-hover, var(--ms-option-title-color-selected, var(--ms-option-title-color)))}.ms__option-title mark{background:var(--ms-option-mark-bg);color:var(--ms-option-mark-color);font-weight:var(--ms-option-mark-font-weight)}.ms__option-subtitle{margin-top:var(--ms-option-subtitle-margin-top);font-size:var(--ms-option-subtitle-font-size);color:var(--ms-option-subtitle-color);line-height:var(--ms-option-subtitle-line-height)}.ms__option:hover .ms__option-subtitle{color:var(--ms-option-subtitle-color-hover, var(--ms-option-subtitle-color))}.ms__option--selected .ms__option-subtitle{color:var(--ms-option-subtitle-color-selected, var(--ms-option-subtitle-color))}.ms__option--selected:hover .ms__option-subtitle{color:var(--ms-option-subtitle-color-selected-hover, var(--ms-option-subtitle-color-selected, var(--ms-option-subtitle-color)))}.ms__empty{padding:var(--ms-empty-padding);text-align:center;font-size:var(--ms-empty-font-size);color:var(--ms-empty-color)}.ms__loader{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ms-loader-padding);gap:var(--ms-loader-gap)}.ms__loading-text{font-size:var(--ms-loading-text-font-size);color:var(--ms-loading-color)}}@layer component{.ms--rtl .ms__input-wrapper{direction:rtl}.ms--rtl .ms__input{text-align:right;padding-left:var(--ms-input-padding-right);padding-right:var(--ms-input-padding-h)}.ms--rtl .ms__toggle{left:var(--ms-toggle-right)!important;right:auto!important}.ms--rtl .ms__counter{left:var(--ms-counter-offset)!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);margin-right:0}.ms--rtl .ms__option-content{text-align:right}.ms--rtl .ms__option-icon{margin-left:var(--ms-spacing-xs);margin-right:0}.ms--rtl .ms__badges{direction:rtl}.ms--rtl .ms__badges--right{margin-left:0;margin-right:var(--ms-badges-margin-right)}.ms--rtl .ms__badges--left{margin-right:0;margin-left:var(--ms-badges-margin-left)}.ms--rtl .ms__badge{flex-direction:row-reverse}.ms--rtl .ms__badge-remove{border-radius:var(--ms-badge-border-radius) 0 0 var(--ms-badge-border-radius);border-left:var(--ms-badge-remove-border);border-right:none}.ms--rtl .ms__badge-text{border-radius:0 var(--ms-badge-border-radius) var(--ms-badge-border-radius) 0;border-right:var(--ms-badge-text-border);border-left:none}.ms--rtl .ms__count-display{direction:rtl}.ms--rtl .ms__count-display--right{margin-left:0;margin-right:var(--ms-count-display-margin-right)}.ms--rtl .ms__count-display--left{margin-right:0;margin-left:var(--ms-count-display-margin-left)}.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}}@layer overrides{:host-context([data-theme="dark"]),:host-context([data-bs-theme="dark"]),:host-context(.dark){color-scheme:dark}:host-context([data-theme="light"]),:host-context([data-bs-theme="light"]),:host-context(.light){color-scheme:light}:host([data-theme="dark"]){color-scheme:dark}:host([data-theme="light"]){color-scheme:light}}`, Ss = typeof HTMLElement < "u" ? HTMLElement : class {
|
|
2663
|
+
const Cs = `@layer variables,component,overrides;@layer variables{:host{display:block;--ms-rem: 10px;font-family:var(--ms-font-family, var(--base-font-family, inherit));--ms-accent-color: var(--base-accent-color, #3b82f6);--ms-accent-color-hover: var(--base-accent-color-hover, #2563eb);--ms-accent-color-active: var(--base-accent-color-active, #1d4ed8);--ms-accent-color-light: var(--base-accent-color-light, light-dark(#eff6ff, #1e3a5f));--ms-accent-color-light-hover: var(--base-accent-color-light-hover, light-dark(#e0f2fe, #264a73));--ms-text-color-1: var(--base-text-color-1, light-dark(#111827, #f5f5f5));--ms-text-color-2: var(--base-text-color-2, light-dark(#353b47, #d4d4d4));--ms-text-color-3: var(--base-text-color-3, light-dark(#6b7280, #a3a3a3));--ms-text-color-4: var(--base-text-color-4, light-dark(#a0a3a9, #737373));--ms-text-color-on-accent: var(--base-text-color-on-accent, #ffffff);--ms-text-primary: var(--ms-text-color-1);--ms-text-secondary: var(--ms-text-color-3);--ms-primary-bg: var(--base-hover-bg, color-mix(in srgb, var(--ms-text-color-1) 8%, var(--base-main-bg, light-dark(#ffffff, #1a1a1a))));--ms-primary-bg-hover: var(--base-active-bg, color-mix(in srgb, var(--ms-text-color-1) 14%, var(--base-main-bg, light-dark(#ffffff, #1a1a1a))));--ms-border-color: var(--base-border-color, light-dark(#e5e7eb, #3a3a3a));--ms-border: var(--base-border, 1px solid var(--ms-border-color));--ms-input-bg: var(--base-input-bg, light-dark(#ffffff, #1a1a1a));--ms-input-color: var(--base-input-color, var(--ms-text-color-1));--ms-input-border: var(--base-input-border, 1px solid var(--ms-border-color));--ms-input-border-hover: var(--base-input-border-hover, 1px solid var(--ms-accent-color));--ms-input-border-focus: var(--base-input-border-focus, 1px solid var(--ms-accent-color));--ms-input-placeholder-color: var(--base-input-placeholder-color, var(--ms-text-color-4));--ms-input-bg-disabled: var(--base-input-bg-disabled, rgba(107, 114, 128, .05));--ms-toggle-icon-color: var(--ms-text-color-3);--ms-toggle-icon-color-open: var(--ms-text-color-3);--ms-counter-badge-bg: var(--ms-accent-color);--ms-counter-badge-bg-hover: var(--ms-accent-color-hover);--ms-counter-badge-color: var(--ms-text-color-on-accent);--ms-hint-bg: var(--base-main-bg, light-dark(#ffffff, #1a1a1a));--ms-hint-color: var(--ms-text-color-4);--ms-hint-border-color: var(--ms-border-color);--ms-dropdown-bg: var(--base-dropdown-bg, var(--base-elevated-bg, light-dark(#ffffff, #1a1a1a)));--ms-dropdown-text-color: var(--ms-text-color-1);--ms-dropdown-border-color: var(--ms-border-color);--ms-dropdown-box-shadow-semantic: var(--base-dropdown-box-shadow, 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1));--ms-actions-bg: var(--base-main-bg, light-dark(#ffffff, #1a1a1a));--ms-actions-border-color: var(--ms-border-color);--ms-action-button-bg: transparent;--ms-action-button-bg-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-color-1);--ms-group-border-color: var(--ms-border-color);--ms-option-text-color: var(--ms-text-color-1);--ms-option-bg: transparent;--ms-option-bg-hover: var(--ms-primary-bg);--ms-option-color-hover: inherit;--ms-option-bg-focused: var(--ms-primary-bg);--ms-option-color-focused: inherit;--ms-option-outline-color-focused: var(--ms-accent-color);--ms-option-bg-selected: color-mix(in srgb, var(--ms-accent-color) 10%, transparent);--ms-option-bg-matched: color-mix(in srgb, var(--ms-accent-color) 8%, transparent);--ms-option-color-matched: inherit;--ms-option-border-matched-color: color-mix(in srgb, var(--ms-accent-color) 40%, transparent);--ms-option-title-color: var(--ms-text-color-1);--ms-option-subtitle-color: var(--ms-text-color-3);--ms-option-mark-bg: color-mix(in srgb, var(--ms-accent-color) 20%, transparent);--ms-option-mark-color: inherit;--ms-loading-color: var(--ms-text-color-3);--ms-badge-bg: var(--ms-accent-color-light);--ms-badge-bg-hover: var(--base-hover-bg, var(--ms-input-bg));--ms-badge-bg-active: var(--ms-accent-color-light-hover);--ms-badge-text-bg-hover: var(--base-hover-bg, var(--ms-input-bg));--ms-badge-text-color-hover: var(--ms-badge-text-color);--ms-badge-counter-border-color: var(--ms-border-color);--ms-badge-counter-text-bg: var(--ms-primary-bg-hover);--ms-badge-counter-text-color: var(--ms-text-color-1);--ms-badge-counter-remove-bg: var(--ms-text-color-3);--ms-badge-counter-remove-bg-hover: var(--ms-text-color-1);--ms-badge-counter-remove-color: var(--ms-text-color-on-accent);--ms-counter-wrapper-border-color: var(--ms-border-color);--ms-count-clear-bg-hover: var(--ms-accent-color);--ms-tooltip-bg: var(--base-tooltip-bg, var(--base-inverse-bg, light-dark(#333333, #f5f5f5)));--ms-tooltip-text-color: var(--base-tooltip-text-color, light-dark(#ffffff, #1a1a1a));--ms-selected-popover-bg: var(--base-dropdown-bg, var(--base-elevated-bg, light-dark(#ffffff, #1a1a1a)));--ms-selected-popover-border-color: var(--ms-border-color);--ms-selected-popover-header-border-color: var(--ms-border-color);--ms-selected-popover-close-bg-hover: var(--ms-accent-color);--ms-input-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-input-padding-right: calc(4 * var(--ms-rem));--ms-input-padding-h: calc(1.2 * var(--ms-rem));--ms-input-height: calc(var(--base-input-size-md-height, 3.5) * var(--ms-rem));--ms-input-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-input-border-width: 1px;--ms-input-border-radius: var(--ms-border-radius-md);--ms-input-text: var(--ms-text-color-1);--ms-input-bg-disabled: rgba(107, 114, 128, .05);--ms-input-size-xs-font: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-input-size-xs-padding-v: calc(.4 * var(--ms-rem));--ms-input-size-xs-padding-h: calc(.8 * var(--ms-rem));--ms-input-size-xs-height: calc(var(--base-input-size-xs-height, 3.1) * var(--ms-rem));--ms-input-size-sm-font: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-input-size-sm-padding-v: calc(.5 * var(--ms-rem));--ms-input-size-sm-padding-h: calc(1 * var(--ms-rem));--ms-input-size-sm-height: calc(var(--base-input-size-sm-height, 3.3) * var(--ms-rem));--ms-input-size-md-font: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-input-size-md-padding-v: calc(.8 * var(--ms-rem));--ms-input-size-md-padding-h: calc(1.2 * var(--ms-rem));--ms-input-size-md-height: calc(var(--base-input-size-md-height, 3.5) * var(--ms-rem));--ms-input-size-lg-font: calc(var(--base-font-size-base, 1.6) * var(--ms-rem));--ms-input-size-lg-padding-v: calc(1 * var(--ms-rem));--ms-input-size-lg-padding-h: calc(1.4 * var(--ms-rem));--ms-input-size-lg-height: calc(var(--base-input-size-lg-height, 3.8) * var(--ms-rem));--ms-input-size-xl-font: calc(var(--base-font-size-lg, 1.8) * var(--ms-rem));--ms-input-size-xl-padding-v: calc(1.2 * var(--ms-rem));--ms-input-size-xl-padding-h: calc(1.6 * var(--ms-rem));--ms-input-size-xl-height: calc(var(--base-input-size-xl-height, 4.1) * var(--ms-rem));--ms-toggle-right: calc(1.2 * var(--ms-rem));--ms-toggle-color: var(--ms-text-color-3);--ms-transform-center-y: translateY(-50%);--ms-transform-rotate-180: 180deg;--ms-counter-offset: calc(3.2 * var(--ms-rem));--ms-counter-padding: calc(.2 * var(--ms-rem)) calc(.4 * var(--ms-rem));--ms-counter-bg: var(--ms-accent-color);--ms-counter-color: var(--ms-text-color-on-accent);--ms-counter-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-counter-font-weight: var(--base-font-weight-semibold, 600);--ms-counter-border-radius: var(--ms-border-radius-sm);--ms-counter-bg-hover: var(--ms-accent-color-hover);--ms-transform-scale-hover: 1.1;--ms-hint-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-hint-border: 1px solid var(--ms-hint-border-color);--ms-hint-border-radius: var(--ms-border-radius-lg);--ms-hint-box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--ms-hint-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-dropdown-border: var(--base-dropdown-border, 1px solid var(--ms-dropdown-border-color));--ms-dropdown-border-radius: var(--ms-border-radius-lg);--ms-dropdown-box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--ms-options-max-height: calc(32 * var(--ms-rem));--ms-option-color: var(--ms-text-color-1);--ms-z-index-dropdown: 9999;--ms-z-index-sticky: 1;--ms-actions-gap: calc(.4 * var(--ms-rem));--ms-actions-padding: calc(.8 * var(--ms-rem));--ms-actions-border-bottom: 1px solid var(--ms-actions-border-color);--ms-action-btn-padding: calc(.4 * var(--ms-rem)) calc(.8 * var(--ms-rem));--ms-action-btn-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-action-btn-border: var(--ms-border);--ms-action-btn-border-radius: var(--ms-border-radius-sm);--ms-action-btn-bg: transparent;--ms-action-btn-color: inherit;--ms-action-btn-bg-hover: var(--ms-primary-bg);--ms-action-btn-border-color-hover: var(--ms-accent-color);--ms-transform-scale-active: .98;--ms-options-padding: 0;--ms-group-border-top: 1px solid var(--ms-group-border-color);--ms-group-margin-top: calc(.4 * var(--ms-rem));--ms-group-padding-top: calc(.4 * var(--ms-rem));--ms-group-label-padding: calc(.4 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-group-label-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-group-label-font-weight: var(--base-font-weight-semibold, 600);--ms-group-label-color: var(--ms-text-color-3);--ms-group-label-transform: uppercase;--ms-group-label-letter-spacing: .05em;--ms-option-gap: calc(.8 * var(--ms-rem));--ms-option-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-option-padding-h: calc(1.2 * var(--ms-rem));--ms-option-outline-focused: 2px solid var(--ms-option-outline-color-focused);--ms-option-focus-outline-offset: -2px;--ms-option-border-matched: 3px solid var(--ms-option-border-matched-color);--ms-option-bg-focused-hover: var(--ms-primary-bg);--ms-option-bg-matched-hover: color-mix(in srgb, var(--ms-accent-color) 12%, transparent);--ms-option-bg-selected-focused: color-mix(in srgb, var(--ms-accent-color) 15%, transparent);--ms-option-bg-selected-matched: color-mix(in srgb, var(--ms-accent-color) 15%, transparent);--ms-option-disabled-bg: var(--base-disabled-bg, transparent);--ms-option-bg-disabled-selected: color-mix(in srgb, var(--ms-accent-color) 10%, transparent);--ms-disabled-opacity: .5;--ms-option-content-gap: calc(.8 * var(--ms-rem));--ms-option-icon-size: calc(2 * var(--ms-rem));--ms-option-icon-font-size: calc(var(--base-font-size-base, 1.6) * var(--ms-rem));--ms-option-title-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-option-mark-font-weight: var(--base-font-weight-semibold, 600);--ms-option-subtitle-margin-top: calc(.4 * var(--ms-rem));--ms-option-subtitle-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-option-subtitle-line-height: var(--base-line-height-tight, 1.25);--ms-checkbox-margin-top: calc(.2 * var(--ms-rem));--ms-checkbox-margin-right: 0;--ms-checkbox-margin-bottom: 0;--ms-checkbox-margin-left: 0;--ms-checkbox-size: calc(1.6 * var(--ms-rem));--ms-checkbox-scale: 1;--ms-checkbox-align: center;--ms-checkbox-bg: var(--ms-input-bg);--ms-checkbox-border: var(--ms-border);--ms-checkbox-border-radius: calc(.3 * var(--ms-rem));--ms-checkbox-checked-bg: var(--ms-accent-color);--ms-checkbox-checked-border: 1px solid var(--ms-accent-color);--ms-checkbox-checkmark-color: var(--ms-text-color-on-accent);--ms-checkbox-hover-border-color: var(--ms-accent-color);--ms-checkbox-disabled-bg: var(--ms-primary-bg);--ms-checkbox-disabled-border: var(--ms-border);--ms-checkbox-checked-bg-hover: var(--ms-accent-color-hover);--ms-checkbox-checked-border-color-hover: var(--ms-accent-color-hover);--ms-state-min-height: calc(8 * var(--ms-rem));--ms-empty-padding: calc(1.6 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-empty-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-empty-color: var(--ms-text-color-3);--ms-loader-padding: calc(1.6 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-loader-gap: calc(.8 * var(--ms-rem));--ms-loading-text-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-loading-text-color: var(--ms-text-color-3);--ms-badges-gap: calc(.8 * var(--ms-rem));--ms-badges-margin-bottom: calc(.8 * var(--ms-rem));--ms-badges-margin-top: calc(.8 * var(--ms-rem));--ms-badges-margin-left: calc(.4 * var(--ms-rem));--ms-badges-margin-right: calc(.4 * var(--ms-rem));--ms-inline-align: center;--ms-badge-gap: calc(.8 * var(--ms-rem));--ms-badge-height: calc(2.7 * var(--ms-rem));--ms-badge-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-badge-font-weight: var(--base-font-weight-semibold, 600);--ms-badge-border-radius: var(--ms-border-radius-sm);--ms-order-first: -1;--ms-badge-text-padding: 0 calc(.8 * var(--ms-rem));--ms-badge-text-bg: var(--ms-accent-color-light);--ms-badge-text-color: var(--ms-accent-color);--ms-badge-text-border: none;--ms-badge-remove-width: calc(2.7 * var(--ms-rem));--ms-badge-remove-bg: var(--ms-accent-color);--ms-badge-remove-color: var(--ms-text-color-on-accent);--ms-badge-remove-border: none;--ms-badge-remove-font-size: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-badge-remove-bg-hover: var(--ms-accent-color-hover);--ms-badge-remove-box-shadow-focus: 0 0 0 2px color-mix(in srgb, var(--ms-accent-color) 50%, transparent);--ms-badge-remove-icon-size: calc(1 * var(--ms-rem));--ms-icon-remove: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 6L18 18M18 6L6 18' stroke='black' stroke-width='2.5' stroke-linecap='round' fill='none'/></svg>");--ms-badge-counter-bg: transparent;--ms-badge-counter-border: 1px solid var(--ms-badge-counter-border-color);--ms-badge-counter-border-radius: var(--ms-border-radius-sm);--ms-more-badge-bg: var(--ms-accent-color-light);--ms-more-badge-hover-bg: var(--ms-badge-bg-hover);--ms-more-badge-active-bg: var(--ms-accent-color-light-hover);--ms-count-display-margin-bottom: calc(.8 * var(--ms-rem));--ms-count-display-margin-top: calc(.8 * var(--ms-rem));--ms-count-display-margin-left: calc(.8 * var(--ms-rem));--ms-count-display-margin-right: calc(.8 * var(--ms-rem));--ms-counter-wrapper-bg: transparent;--ms-counter-wrapper-border: var(--ms-border);--ms-counter-wrapper-border-radius: var(--ms-border-radius-sm);--ms-counter-wrapper-padding: calc(.4 * var(--ms-rem)) calc(.8 * var(--ms-rem));--ms-counter-wrapper-gap: calc(.4 * var(--ms-rem));--ms-counter-wrapper-bg-hover: var(--ms-primary-bg);--ms-counter-wrapper-border-color-hover: var(--ms-accent-color);--ms-count-text-bg: transparent;--ms-count-text-border: none;--ms-count-text-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-count-text-color: var(--ms-text-color-1);--ms-count-clear-size: calc(1.6 * var(--ms-rem));--ms-count-clear-bg: transparent;--ms-count-clear-color: var(--ms-text-color-3);--ms-count-clear-font-size: calc(var(--base-font-size-lg, 1.8) * var(--ms-rem));--ms-count-clear-border-radius: var(--ms-border-radius-sm);--ms-count-clear-bg-hover: color-mix(in srgb, var(--ms-accent-color) 20%, transparent);--ms-count-clear-color-hover: var(--ms-accent-color);--ms-count-clear-icon-size: calc(1.4 * var(--ms-rem));--ms-icon-clear: var(--ms-icon-remove);--ms-tooltip-color: var(--ms-tooltip-text-color);--ms-tooltip-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-tooltip-border-radius: var(--ms-border-radius-lg);--ms-tooltip-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-tooltip-max-width: calc(32 * var(--ms-rem));--ms-tooltip-shadow: 0 2px 8px rgba(0, 0, 0, .15);--ms-tooltip-z-index: 10000;--ms-option-tooltip-bg: var(--ms-tooltip-bg);--ms-option-tooltip-text-color: var(--ms-tooltip-text-color);--ms-option-tooltip-padding: var(--ms-tooltip-padding);--ms-option-tooltip-border-radius: var(--ms-tooltip-border-radius);--ms-option-tooltip-font-size: var(--ms-tooltip-font-size);--ms-option-tooltip-max-width: var(--ms-tooltip-max-width);--ms-option-tooltip-shadow: var(--ms-tooltip-shadow);--ms-option-tooltip-z-index: var(--ms-tooltip-z-index);--ms-z-index-popover: 10000;--ms-selected-popover-width: calc(32 * var(--ms-rem));--ms-selected-popover-max-height: calc(32 * var(--ms-rem));--ms-selected-popover-border: 1px solid var(--ms-selected-popover-border-color);--ms-selected-popover-border-radius: var(--ms-border-radius-lg);--ms-selected-popover-box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--ms-selected-popover-header-padding: calc(.8 * var(--ms-rem)) calc(1.2 * var(--ms-rem));--ms-selected-popover-header-bg: color-mix(in srgb, var(--ms-accent-color) 10%, transparent);--ms-selected-popover-header-border-bottom: 1px solid var(--ms-selected-popover-header-border-color);--ms-selected-popover-header-font-size: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-selected-popover-header-font-weight: var(--base-font-weight-semibold, 600);--ms-selected-popover-header-color: var(--ms-text-color-1);--ms-popover-close-size: calc(2.4 * var(--ms-rem));--ms-selected-popover-close-bg: transparent;--ms-selected-popover-close-color: var(--ms-text-color-3);--ms-selected-popover-close-font-size: calc(var(--base-font-size-xl, 2) * var(--ms-rem));--ms-selected-popover-close-border-radius: var(--ms-border-radius-sm);--ms-selected-popover-close-bg-hover: color-mix(in srgb, var(--ms-accent-color) 20%, transparent);--ms-selected-popover-close-color-hover: var(--ms-accent-color);--ms-selected-popover-close-icon-size: calc(1.4 * var(--ms-rem));--ms-selected-popover-body-gap: calc(.4 * var(--ms-rem));--ms-selected-popover-body-padding: calc(.8 * var(--ms-rem));--ms-selected-popover-body-max-height: calc(28.8 * var(--ms-rem));--ms-font-size-2xs: calc(var(--base-font-size-2xs, 1) * var(--ms-rem));--ms-font-size-xs: calc(var(--base-font-size-xs, 1.2) * var(--ms-rem));--ms-font-size-sm: calc(var(--base-font-size-sm, 1.4) * var(--ms-rem));--ms-font-size-base: calc(var(--base-font-size-base, 1.6) * var(--ms-rem));--ms-font-size-lg: calc(var(--base-font-size-lg, 1.8) * var(--ms-rem));--ms-font-weight-normal: var(--base-font-weight-normal, 400);--ms-font-weight-medium: var(--base-font-weight-medium, 500);--ms-font-weight-semibold: var(--base-font-weight-semibold, 600);--ms-line-height-none: 1;--ms-line-height-tight: var(--base-line-height-tight, 1.25);--ms-line-height-normal: var(--base-line-height-normal, 1.5);--ms-line-height-relaxed: var(--base-line-height-relaxed, 1.75);--ms-border-radius-sm: calc(var(--base-border-radius-sm, .4) * var(--ms-rem));--ms-border-radius-md: calc(var(--base-border-radius-md, .6) * var(--ms-rem));--ms-border-radius-lg: calc(var(--base-border-radius-lg, .8) * var(--ms-rem));--ms-border-radius: var(--ms-border-radius-md);--ms-spacing-xs: calc(.4 * var(--ms-rem));--ms-spacing-sm: calc(.8 * var(--ms-rem));--ms-spacing-md: calc(1.2 * var(--ms-rem));--ms-spacing-lg: calc(1.6 * var(--ms-rem));--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;--ms-scrollbar-width: 8px;--ms-scrollbar-track-bg: transparent;--ms-scrollbar-thumb-bg: var(--ms-border-color);--ms-scrollbar-thumb-bg-hover: var(--ms-text-color-3);--ms-scrollbar-thumb-border-radius: 4px;--ms-debug-bg: var(--base-elevated-bg, light-dark(#f9fafb, #2b2b2b));--ms-debug-border-color: var(--ms-border-color);--ms-debug-text-color: var(--ms-text-color-1);--ms-debug-border-radius: var(--ms-border-radius-md);--ms-debug-summary-color: var(--ms-accent-color);--ms-debug-summary-bg-hover: var(--ms-primary-bg);--ms-debug-summary-outline-color: var(--ms-accent-color);--ms-debug-summary-border-radius: var(--ms-border-radius-sm);--ms-debug-stats-bg: var(--base-main-bg, light-dark(#ffffff, #1a1a1a));--ms-debug-stats-border-radius: var(--ms-border-radius-sm);--ms-debug-bullet-color: var(--ms-accent-color)}}@layer component{web-multiselect:not(:defined){display:block;min-height:calc(3.5 * var(--ms-rem));color:transparent!important;background:transparent}.ms__wrapper{display:flex;flex-direction:column;align-items:stretch}.ms__wrapper--inline{flex-direction:row;align-items:var(--ms-inline-align, center)}.ms{position:relative;width:100%}}@layer component{.ms__input-wrapper{position:relative;display:flex;align-items:center}.ms__input{box-sizing:border-box;width:100%;font-family:inherit;height:var(--ms-input-height);padding:var(--ms-input-padding);padding-right:var(--ms-input-padding-right);font-size:var(--ms-input-font-size);border:var(--ms-input-border);border-radius:var(--ms-input-border-radius);background:var(--ms-input-bg);color:var(--ms-input-color);cursor:pointer;transition:border var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__input:hover:not(:focus):not(:disabled){border:var(--ms-input-border-hover)}.ms__input:focus{outline:none;border:var(--ms-input-border-focus)}.ms__input::placeholder{color:var(--ms-input-placeholder-color);opacity:0;transition:opacity var(--ms-transition-fast) var(--ms-easing-snappy)}:host([data-ready]) .ms__input::placeholder{opacity:var(--ms-placeholder-opacity)}.ms__input.ms__input--xs{font-size:var(--ms-input-size-xs-font);padding:var(--ms-input-size-xs-padding-v) var(--ms-input-size-xs-padding-h);padding-right:calc(var(--ms-input-size-xs-padding-h) * 2.5);height:var(--ms-input-size-xs-height)}.ms__input.ms__input--sm{font-size:var(--ms-input-size-sm-font);padding:var(--ms-input-size-sm-padding-v) var(--ms-input-size-sm-padding-h);padding-right:calc(var(--ms-input-size-sm-padding-h) * 2.5);height:var(--ms-input-size-sm-height)}.ms__input.ms__input--lg{font-size:var(--ms-input-size-lg-font);padding:var(--ms-input-size-lg-padding-v) var(--ms-input-size-lg-padding-h);padding-right:calc(var(--ms-input-size-lg-padding-h) * 2.5);height:var(--ms-input-size-lg-height)}.ms__input.ms__input--xl{font-size:var(--ms-input-size-xl-font);padding:var(--ms-input-size-xl-padding-v) var(--ms-input-size-xl-padding-h);padding-right:calc(var(--ms-input-size-xl-padding-h) * 2.5);height:var(--ms-input-size-xl-height)}.ms__toggle{position:absolute;right:var(--ms-toggle-right);top:50%;transform:var(--ms-transform-center-y);pointer-events:none;color:var(--ms-toggle-icon-color);transition:transform var(--ms-transition-fast) var(--ms-easing-snappy)}.ms--open .ms__toggle{transform:var(--ms-transform-center-y) rotate(var(--ms-transform-rotate-180));color:var(--ms-toggle-icon-color-open)}.ms__counter{position:absolute;right:var(--ms-counter-offset);top:50%;transform:var(--ms-transform-center-y);padding:var(--ms-counter-padding);background:var(--ms-counter-badge-bg);color:var(--ms-counter-badge-color);font-size:var(--ms-counter-font-size);font-weight:var(--ms-counter-font-weight);border-radius:var(--ms-counter-border-radius);cursor:pointer;transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__counter:hover{background:var(--ms-counter-badge-bg-hover);transform:var(--ms-transform-center-y) scale(var(--ms-transform-scale-hover))}.ms__actions{display:flex;flex-direction:column;gap:var(--ms-actions-gap);padding:var(--ms-actions-padding)}.ms__actions--top{border-bottom:var(--ms-actions-border-bottom)}.ms__actions--bottom{flex-direction:column-reverse;border-top:var(--ms-actions-border-bottom)}.ms__actions-row{display:flex;flex-wrap:nowrap;gap:var(--ms-actions-gap)}.ms__actions--wrap .ms__actions-row{flex-wrap:wrap}.ms__actions--sticky{position:sticky;z-index:var(--ms-z-index-sticky);background:var(--ms-actions-bg)}.ms__actions--sticky.ms__actions--top{top:0}.ms__actions--sticky.ms__actions--bottom{bottom:0}.ms__actions--align-stretch .ms__action-btn{flex:1}.ms__actions--align-left .ms__actions-row{justify-content:flex-start}.ms__actions--align-right .ms__actions-row{justify-content:flex-end}.ms__actions--align-center .ms__actions-row{justify-content:center}.ms__actions--align-space-between .ms__actions-row{justify-content:space-between}.ms__action-btn{font-family:inherit;padding:var(--ms-action-btn-padding);font-size:var(--ms-action-btn-font-size);border:var(--ms-action-btn-border);border-radius:var(--ms-action-btn-border-radius);background:var(--ms-action-button-bg);color:var(--ms-action-button-color);cursor:pointer;transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__action-btn:hover{background:var(--ms-action-button-bg-hover);border-color:var(--ms-action-button-border-color-hover)}.ms__action-btn:active{transform:scale(var(--ms-transform-scale-active))}.ms__action-btn:disabled,.ms__action-btn[disabled]{opacity:var(--ms-disabled-opacity);cursor:not-allowed;pointer-events:none}}@layer component{.ms__hint{display:none;position:fixed;z-index:var(--ms-z-index-popover);padding:var(--ms-hint-padding);background:var(--ms-hint-bg);border:var(--ms-hint-border);border-radius:var(--ms-hint-border-radius);box-shadow:var(--ms-hint-box-shadow);font-size:var(--ms-hint-font-size);color:var(--ms-hint-color);line-height:var(--ms-line-height-relaxed);max-width:100%}.ms__hint--visible{display:block}.ms__dropdown{display:none;position:fixed;font-family:inherit;z-index:var(--ms-z-index-dropdown);background:var(--ms-dropdown-bg);border:var(--ms-dropdown-border);border-radius:var(--ms-dropdown-border-radius);box-shadow:var(--ms-dropdown-box-shadow);max-height:var(--ms-options-max-height);overflow:hidden;color:var(--ms-dropdown-text-color)}.ms__dropdown--visible{display:flex;flex-direction:column}.ms__dropdown-inner{flex:1;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--ms-scrollbar-thumb-bg) var(--ms-scrollbar-track-bg)}.ms__dropdown-inner::-webkit-scrollbar{width:var(--ms-scrollbar-width)}.ms__dropdown-inner::-webkit-scrollbar-track{background:var(--ms-scrollbar-track-bg)}.ms__dropdown-inner::-webkit-scrollbar-thumb{background:var(--ms-scrollbar-thumb-bg);border-radius:var(--ms-scrollbar-thumb-border-radius)}.ms__dropdown-inner::-webkit-scrollbar-thumb:hover{background:var(--ms-scrollbar-thumb-bg-hover)}.ms__dropdown--virtual{max-height:none}.ms__dropdown--virtual .ms__dropdown-inner{overflow-y:visible}.ms__badge-tooltip{position:fixed;z-index:var(--ms-tooltip-z-index);opacity:0;visibility:hidden;transition:opacity var(--ms-transition-normal) ease,visibility var(--ms-transition-normal) ease;background:var(--ms-tooltip-bg);color:var(--ms-tooltip-text-color);padding:var(--ms-tooltip-padding);border-radius:var(--ms-tooltip-border-radius);font-size:var(--ms-tooltip-font-size);line-height:var(--ms-line-height-relaxed);max-width:var(--ms-tooltip-max-width);word-wrap:break-word;white-space:pre-wrap;box-shadow:var(--ms-tooltip-shadow);pointer-events:none}.ms__badge-tooltip--visible{opacity:1;visibility:visible}.ms__option-tooltip{position:fixed;z-index:var(--ms-option-tooltip-z-index);opacity:0;visibility:hidden;transition:opacity var(--ms-transition-normal) ease,visibility var(--ms-transition-normal) ease;background:var(--ms-option-tooltip-bg);color:var(--ms-option-tooltip-text-color);padding:var(--ms-option-tooltip-padding);border-radius:var(--ms-option-tooltip-border-radius);font-size:var(--ms-option-tooltip-font-size);line-height:var(--ms-line-height-relaxed);max-width:var(--ms-option-tooltip-max-width);word-wrap:break-word;white-space:pre-wrap;box-shadow:var(--ms-option-tooltip-shadow);pointer-events:none}.ms__option-tooltip--visible{opacity:1;visibility:visible}.ms__selected-popover{display:none;position:fixed;z-index:var(--ms-z-index-popover);background:var(--ms-selected-popover-bg);border:var(--ms-selected-popover-border);border-radius:var(--ms-selected-popover-border-radius);box-shadow:var(--ms-selected-popover-box-shadow);width:var(--ms-selected-popover-width);max-height:var(--ms-selected-popover-max-height);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);background:var(--ms-selected-popover-header-bg);border-bottom:var(--ms-selected-popover-header-border-bottom);font-size:var(--ms-selected-popover-header-font-size);font-weight:var(--ms-selected-popover-header-font-weight);color:var(--ms-selected-popover-header-color)}.ms__selected-popover-close{display:flex;align-items:center;justify-content:center;width:var(--ms-popover-close-size);height:var(--ms-popover-close-size);padding:0;border:none;background:var(--ms-selected-popover-close-bg);color:var(--ms-selected-popover-close-color);font-size:var(--ms-selected-popover-close-font-size);line-height:var(--ms-line-height-none);cursor:pointer;border-radius:var(--ms-selected-popover-close-border-radius);transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__selected-popover-close:hover{background:var(--ms-selected-popover-close-bg-hover);color:var(--ms-selected-popover-close-color-hover)}.ms__selected-popover-close:before{content:"";display:block;width:var(--ms-selected-popover-close-icon-size);height:var(--ms-selected-popover-close-icon-size);background-color:currentColor;-webkit-mask:var(--ms-icon-remove) center / contain no-repeat;mask:var(--ms-icon-remove) center / contain no-repeat}.ms__selected-popover-body{display:flex;flex-direction:column;gap:var(--ms-selected-popover-body-gap);padding:var(--ms-selected-popover-body-padding);overflow-y:auto;max-height:var(--ms-selected-popover-body-max-height);scrollbar-width:thin;scrollbar-color:var(--ms-scrollbar-thumb-bg) var(--ms-scrollbar-track-bg)}.ms__selected-popover-body::-webkit-scrollbar{width:var(--ms-scrollbar-width)}.ms__selected-popover-body::-webkit-scrollbar-track{background:var(--ms-scrollbar-track-bg)}.ms__selected-popover-body::-webkit-scrollbar-thumb{background:var(--ms-scrollbar-thumb-bg);border-radius:var(--ms-scrollbar-thumb-border-radius)}.ms__selected-popover-body::-webkit-scrollbar-thumb:hover{background:var(--ms-scrollbar-thumb-bg-hover)}.ms__selected-popover-body .ms__badge{width:100%;min-height:fit-content;line-height:var(--ms-line-height-relaxed)}.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);overflow:hidden;box-sizing:border-box}.ms__selected-popover-body--virtual .ms__badge-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}@layer component{.ms--disabled .ms__input{opacity:var(--ms-disabled-input-opacity);cursor:not-allowed;background:var(--ms-input-bg-disabled)}.ms--disabled .ms__toggle{opacity:var(--ms-disabled-input-opacity)}.ms--no-checkboxes .ms__option{gap:0;padding-left:var(--ms-option-padding-h)}.ms--no-checkboxes .ms__option-content{padding-left:0}}@layer component;@layer component{.ms__badges{display:flex;flex-wrap:wrap;gap:var(--ms-badges-gap);padding:0}.ms__badges:empty{display:none}.ms__badges--bottom{margin-top:var(--ms-badges-margin-bottom)}.ms__badges--top{margin-bottom:var(--ms-badges-margin-top);order:var(--ms-order-first)}.ms__badges--left{order:var(--ms-order-first);margin-right:var(--ms-badges-margin-left);justify-content:flex-end}.ms__badges--right{margin-left:var(--ms-badges-margin-right);justify-content:flex-start}.ms__badge{display:inline-flex;align-items:center;height:var(--ms-badge-height);font-size:var(--ms-badge-font-size);font-weight:var(--ms-badge-font-weight);line-height:var(--ms-line-height-none);border-radius:var(--ms-badge-border-radius);overflow:hidden;max-width:100%}.ms__badge-text{display:flex;align-items:center;box-sizing:border-box;height:100%;padding:var(--ms-badge-text-padding);background:var(--ms-badge-text-bg);color:var(--ms-badge-text-color);border:var(--ms-badge-text-border);border-right:none;border-radius:var(--ms-badge-border-radius) 0 0 var(--ms-badge-border-radius);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:background-color var(--ms-transition-normal) ease,color var(--ms-transition-normal) ease}.ms__badge:hover .ms__badge-text{background:var(--ms-badge-text-bg-hover, var(--ms-badge-text-bg));color:var(--ms-badge-text-color-hover, var(--ms-badge-text-color))}.ms__badge-remove{display:flex;align-items:center;justify-content:center;box-sizing:border-box;font-family:inherit;width:var(--ms-badge-remove-width);height:100%;flex-shrink:0;background:var(--ms-badge-remove-bg);color:var(--ms-badge-remove-color);border:var(--ms-badge-remove-border);border-left:none;border-radius:0 var(--ms-badge-border-radius) var(--ms-badge-border-radius) 0;cursor:pointer;transition:background-color var(--ms-transition-normal) ease;font-size:var(--ms-badge-remove-font-size)}.ms__badge-remove:hover{background:var(--ms-badge-remove-bg-hover)}.ms__badge-remove:focus{outline:none}.ms__badge-remove:focus-visible{outline:none;box-shadow:var(--ms-badge-remove-box-shadow-focus)}.ms__badge-remove:before{content:"";display:block;width:var(--ms-badge-remove-icon-size);height:var(--ms-badge-remove-icon-size);background-color:currentColor;-webkit-mask:var(--ms-icon-remove) center / contain no-repeat;mask:var(--ms-icon-remove) center / contain no-repeat}.ms__badge--counter{cursor:pointer}.ms__badge--counter .ms__badge-text{background:var(--ms-badge-counter-text-bg);color:var(--ms-badge-counter-text-color);border:var(--ms-badge-counter-border);border-right:none}.ms__badge--counter .ms__badge-remove{background:var(--ms-badge-counter-remove-bg);color:var(--ms-badge-counter-remove-color);border:var(--ms-badge-counter-border);border-left:none}.ms__badge--counter .ms__badge-remove:hover{background:var(--ms-badge-counter-remove-bg-hover)}.ms__badge--more,.ms__badge[data-action=show-selected]{cursor:pointer}}@layer component{.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)}.ms__count-display--top{margin-bottom:var(--ms-count-display-margin-top);order:var(--ms-order-first)}.ms__count-display--left{order:var(--ms-order-first);margin-right:var(--ms-count-display-margin-left);justify-content:flex-start}.ms__count-display--right{margin-left:var(--ms-count-display-margin-right);justify-content:flex-end}.ms__counter-wrapper{display:inline-flex;align-items:center;gap:var(--ms-counter-wrapper-gap);background:var(--ms-counter-wrapper-bg);border:var(--ms-counter-wrapper-border);border-radius:var(--ms-counter-wrapper-border-radius);padding:var(--ms-counter-wrapper-padding);transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__counter-wrapper:hover{background:var(--ms-counter-wrapper-bg-hover);border-color:var(--ms-counter-wrapper-border-color-hover)}.ms__count-text{display:inline-flex;align-items:center;background:var(--ms-count-text-bg);border:var(--ms-count-text-border);padding:0;font-size:var(--ms-count-text-font-size);color:var(--ms-count-text-color);cursor:pointer;transition:color var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__count-clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:var(--ms-count-clear-size);height:var(--ms-count-clear-size);padding:0;border:none;background:var(--ms-count-clear-bg);color:var(--ms-count-clear-color);font-size:var(--ms-count-clear-font-size);line-height:var(--ms-line-height-none);cursor:pointer;border-radius:var(--ms-count-clear-border-radius);transition:all var(--ms-transition-fast) var(--ms-easing-snappy)}.ms__count-clear:hover{background:var(--ms-count-clear-bg-hover);color:var(--ms-count-clear-color-hover)}.ms__count-clear:before{content:"";display:block;width:var(--ms-count-clear-icon-size);height:var(--ms-count-clear-icon-size);background-color:currentColor;-webkit-mask:var(--ms-icon-clear) center / contain no-repeat;mask:var(--ms-icon-clear) center / contain no-repeat}}@layer component{.ms__debug-info{margin-top:calc(.4 * var(--ms-rem));padding:calc(.4 * var(--ms-rem));background-color:var(--ms-debug-bg);border:1px solid var(--ms-debug-border-color);border-radius:var(--ms-debug-border-radius);font-size:calc(1.2 * var(--ms-rem));color:var(--ms-debug-text-color)}.ms__debug-info details summary{cursor:pointer;font-weight:600;color:var(--ms-debug-summary-color);-webkit-user-select:none;user-select:none;padding:calc(.4 * var(--ms-rem));border-radius:var(--ms-debug-summary-border-radius)}.ms__debug-info details summary:hover{background-color:var(--ms-debug-summary-bg-hover)}.ms__debug-info details summary:focus{outline:2px solid var(--ms-debug-summary-outline-color);outline-offset:2px}.ms__debug-info .ms__debug-stats{display:flex;flex-direction:column;gap:calc(.4 * var(--ms-rem));margin-top:calc(.4 * var(--ms-rem));padding:calc(.4 * var(--ms-rem));background-color:var(--ms-debug-stats-bg);border-radius:var(--ms-debug-stats-border-radius)}.ms__debug-info .ms__debug-stats span{display:flex;justify-content:space-between;padding:2px 4px;font-family:monospace;font-size:calc(1 * var(--ms-rem))}.ms__debug-info .ms__debug-stats span:before{content:"•";margin-right:calc(.4 * var(--ms-rem));color:var(--ms-debug-bullet-color)}}@layer component{.ms__options{padding:var(--ms-options-padding);scrollbar-width:thin;scrollbar-color:var(--ms-scrollbar-thumb-bg) var(--ms-scrollbar-track-bg)}.ms__options::-webkit-scrollbar{width:var(--ms-scrollbar-width)}.ms__options::-webkit-scrollbar-track{background:var(--ms-scrollbar-track-bg)}.ms__options::-webkit-scrollbar-thumb{background:var(--ms-scrollbar-thumb-bg);border-radius:var(--ms-scrollbar-thumb-border-radius)}.ms__options::-webkit-scrollbar-thumb:hover{background:var(--ms-scrollbar-thumb-bg-hover)}.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);margin-top:var(--ms-group-margin-top);padding-top:var(--ms-group-padding-top)}.ms__group-label{padding:var(--ms-group-label-padding);font-size:var(--ms-group-label-font-size);font-weight:var(--ms-group-label-font-weight);color:var(--ms-group-label-color);text-transform:var(--ms-group-label-transform);letter-spacing:var(--ms-group-label-letter-spacing)}.ms__option{display:flex;align-items:var(--ms-checkbox-align, center);gap:var(--ms-option-gap);padding:var(--ms-option-padding);color:var(--ms-option-text-color);background:var(--ms-option-bg);cursor:pointer}.ms__option:hover{background:var(--ms-option-bg-hover);color:var(--ms-option-color-hover, inherit)}.ms__option--focused{background:var(--ms-option-bg-focused);color:var(--ms-option-color-focused, inherit);outline:var(--ms-option-outline-focused);outline-offset:var(--ms-option-focus-outline-offset)}.ms__option--matched{background:var(--ms-option-bg-matched);color:var(--ms-option-color-matched, inherit);border-left:var(--ms-option-border-matched)}.ms__option--selected{background:var(--ms-option-bg-selected)}.ms__option--selected:hover{background:var(--ms-option-bg-selected-hover, var(--ms-option-bg-selected))}.ms__option--disabled{opacity:var(--ms-disabled-opacity);cursor:not-allowed;background:var(--ms-option-disabled-bg)}.ms__option--disabled:hover{background:var(--ms-option-disabled-bg)}.ms__option--focused:hover{background:var(--ms-option-bg-focused-hover);color:var(--ms-option-color-focused-hover, var(--ms-option-color-focused, var(--ms-option-text-color)))}.ms__option--matched:hover{background:var(--ms-option-bg-matched-hover);color:var(--ms-option-color-matched-hover, var(--ms-option-color-matched, var(--ms-option-text-color)))}.ms__option--selected.ms__option--focused{background:var(--ms-option-bg-selected-focused);outline:var(--ms-option-outline-focused);outline-offset:var(--ms-option-focus-outline-offset)}.ms__option--selected.ms__option--matched{background:var(--ms-option-bg-selected-matched);border-left:var(--ms-option-border-matched)}.ms__option--disabled.ms__option--selected{background:var(--ms-option-bg-disabled-selected)}.ms__option--disabled.ms__option--focused{outline:none}.ms__option[data-checkbox-align=top]{--ms-checkbox-align: flex-start}.ms__option[data-checkbox-align=bottom]{--ms-checkbox-align: flex-end}.ms__checkbox{appearance:none;-webkit-appearance:none;-moz-appearance:none;flex-shrink:0;position:relative;margin-top:var(--ms-checkbox-margin-top);margin-right:var(--ms-checkbox-margin-right);margin-bottom:var(--ms-checkbox-margin-bottom);margin-left:var(--ms-checkbox-margin-left);width:var(--ms-checkbox-size);height:var(--ms-checkbox-size);transform:scale(var(--ms-checkbox-scale));transform-origin:top left;cursor:pointer;background:var(--ms-checkbox-bg);border:var(--ms-checkbox-border);border-radius:var(--ms-checkbox-border-radius);transition:background-color .15s ease,border-color .15s ease}.ms__checkbox:after{content:"";position:absolute;display:none;left:50%;top:40%;width:30%;height:55%;transform:translate(-50%,-50%) rotate(45deg);border:solid var(--ms-checkbox-checkmark-color);border-width:0 2px 2px 0}.ms__checkbox:hover:not(:disabled){border-color:var(--ms-checkbox-hover-border-color)}.ms__checkbox:checked{background:var(--ms-checkbox-checked-bg);border:var(--ms-checkbox-checked-border)}.ms__checkbox:checked:after{display:block}.ms__checkbox:checked:hover:not(:disabled){background:var(--ms-checkbox-checked-bg-hover);border-color:var(--ms-checkbox-checked-border-color-hover)}.ms__checkbox:focus-visible{outline:2px solid var(--ms-checkbox-checked-bg);outline-offset:2px}.ms__checkbox:disabled{cursor:not-allowed;background:var(--ms-checkbox-disabled-bg);border:var(--ms-checkbox-disabled-border);opacity:.6}.ms__checkbox:disabled:checked{background:var(--ms-checkbox-disabled-bg)}.ms__option--disabled .ms__checkbox{cursor:not-allowed}.ms__option-content{flex:1;display:flex;align-items:center;gap:var(--ms-option-content-gap);min-width:0}.ms__option-icon{flex-shrink:0;width:var(--ms-option-icon-size);height:var(--ms-option-icon-size);display:flex;align-items:center;justify-content:center;font-size:var(--ms-option-icon-font-size)}.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);color:var(--ms-option-title-color);line-height:var(--ms-line-height-relaxed)}.ms__option:hover .ms__option-title{color:var(--ms-option-title-color-hover, var(--ms-option-title-color))}.ms__option--selected .ms__option-title{color:var(--ms-option-title-color-selected, var(--ms-option-title-color))}.ms__option--selected:hover .ms__option-title{color:var(--ms-option-title-color-selected-hover, var(--ms-option-title-color-selected, var(--ms-option-title-color)))}.ms__option-title mark{background:var(--ms-option-mark-bg);color:var(--ms-option-mark-color);font-weight:var(--ms-option-mark-font-weight)}.ms__option-subtitle{margin-top:var(--ms-option-subtitle-margin-top);font-size:var(--ms-option-subtitle-font-size);color:var(--ms-option-subtitle-color);line-height:var(--ms-option-subtitle-line-height)}.ms__option:hover .ms__option-subtitle{color:var(--ms-option-subtitle-color-hover, var(--ms-option-subtitle-color))}.ms__option--selected .ms__option-subtitle{color:var(--ms-option-subtitle-color-selected, var(--ms-option-subtitle-color))}.ms__option--selected:hover .ms__option-subtitle{color:var(--ms-option-subtitle-color-selected-hover, var(--ms-option-subtitle-color-selected, var(--ms-option-subtitle-color)))}.ms__empty{display:flex;align-items:center;justify-content:center;min-height:var(--ms-state-min-height);padding:var(--ms-empty-padding);text-align:center;font-size:var(--ms-empty-font-size);color:var(--ms-empty-color)}.ms__loader{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:var(--ms-state-min-height);padding:var(--ms-loader-padding);gap:var(--ms-loader-gap)}.ms__loading-text{font-size:var(--ms-loading-text-font-size);color:var(--ms-loading-color)}}@layer component{.ms--rtl .ms__input-wrapper{direction:rtl}.ms--rtl .ms__input{text-align:right;padding-left:var(--ms-input-padding-right);padding-right:var(--ms-input-padding-h)}.ms--rtl .ms__toggle{left:var(--ms-toggle-right)!important;right:auto!important}.ms--rtl .ms__counter{left:var(--ms-counter-offset)!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);margin-right:0}.ms--rtl .ms__option-content{text-align:right}.ms--rtl .ms__option-icon{margin-left:var(--ms-spacing-xs);margin-right:0}.ms--rtl .ms__badges{direction:rtl}.ms--rtl .ms__badges--right{margin-left:0;margin-right:var(--ms-badges-margin-right)}.ms--rtl .ms__badges--left{margin-right:0;margin-left:var(--ms-badges-margin-left)}.ms--rtl .ms__badge{flex-direction:row-reverse}.ms--rtl .ms__badge-remove{border-radius:var(--ms-badge-border-radius) 0 0 var(--ms-badge-border-radius);border-left:var(--ms-badge-remove-border);border-right:none}.ms--rtl .ms__badge-text{border-radius:0 var(--ms-badge-border-radius) var(--ms-badge-border-radius) 0;border-right:var(--ms-badge-text-border);border-left:none}.ms--rtl .ms__count-display{direction:rtl}.ms--rtl .ms__count-display--right{margin-left:0;margin-right:var(--ms-count-display-margin-right)}.ms--rtl .ms__count-display--left{margin-right:0;margin-left:var(--ms-count-display-margin-left)}.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}}@layer overrides{:host-context([data-theme="dark"]),:host-context([data-bs-theme="dark"]),:host-context(.dark){color-scheme:dark}:host-context([data-theme="light"]),:host-context([data-bs-theme="light"]),:host-context(.light){color-scheme:light}:host([data-theme="dark"]){color-scheme:dark}:host([data-theme="light"]){color-scheme:light}}`, Ss = typeof HTMLElement < "u" ? HTMLElement : class {
|
|
2552
2664
|
}, Ce = [
|
|
2553
2665
|
// Strings
|
|
2554
2666
|
{ attr: "search-hint", key: "searchHint", parser: "string-or-undefined" },
|
|
@@ -2613,6 +2725,20 @@ const Cs = `@layer variables,component,overrides;@layer variables{:host{display:
|
|
|
2613
2725
|
enumValues: ["nowrap", "wrap"],
|
|
2614
2726
|
default: "nowrap"
|
|
2615
2727
|
},
|
|
2728
|
+
{
|
|
2729
|
+
attr: "actions-position",
|
|
2730
|
+
key: "actionsPosition",
|
|
2731
|
+
parser: "enum",
|
|
2732
|
+
enumValues: ["top", "bottom"],
|
|
2733
|
+
default: "top"
|
|
2734
|
+
},
|
|
2735
|
+
{
|
|
2736
|
+
attr: "actions-align",
|
|
2737
|
+
key: "actionsAlign",
|
|
2738
|
+
parser: "enum",
|
|
2739
|
+
enumValues: ["stretch", "left", "right", "center", "space-between"],
|
|
2740
|
+
default: "stretch"
|
|
2741
|
+
},
|
|
2616
2742
|
{
|
|
2617
2743
|
attr: "checkbox-align",
|
|
2618
2744
|
key: "checkboxAlign",
|
|
@@ -2634,6 +2760,13 @@ const Cs = `@layer variables,component,overrides;@layer variables{:host{display:
|
|
|
2634
2760
|
enumValues: ["top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "left", "left-start", "left-end", "right", "right-start", "right-end"],
|
|
2635
2761
|
default: "top"
|
|
2636
2762
|
},
|
|
2763
|
+
{
|
|
2764
|
+
attr: "option-tooltip-placement",
|
|
2765
|
+
key: "optionTooltipPlacement",
|
|
2766
|
+
parser: "enum",
|
|
2767
|
+
enumValues: ["top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "left", "left-start", "left-end", "right", "right-start", "right-end"],
|
|
2768
|
+
default: "top-start"
|
|
2769
|
+
},
|
|
2637
2770
|
// Numbers
|
|
2638
2771
|
{ attr: "badges-threshold", key: "badgesThreshold", parser: "int" },
|
|
2639
2772
|
{ attr: "badges-max-visible", key: "badgesMaxVisible", parser: "int" },
|
|
@@ -2645,6 +2778,8 @@ const Cs = `@layer variables,component,overrides;@layer variables{:host{display:
|
|
|
2645
2778
|
{ attr: "virtual-scroll-buffer", key: "virtualScrollBuffer", parser: "int", default: 10 },
|
|
2646
2779
|
{ attr: "badge-tooltip-delay", key: "badgeTooltipDelay", parser: "int", default: 100 },
|
|
2647
2780
|
{ attr: "badge-tooltip-offset", key: "badgeTooltipOffset", parser: "int", default: 8 },
|
|
2781
|
+
{ attr: "option-tooltip-delay", key: "optionTooltipDelay", parser: "int" },
|
|
2782
|
+
{ attr: "option-tooltip-offset", key: "optionTooltipOffset", parser: "int" },
|
|
2648
2783
|
// Booleans (default true: presence/empty = true; only 'false' negates)
|
|
2649
2784
|
{ attr: "multiple", key: "isMultipleEnabled", parser: "bool-default-true" },
|
|
2650
2785
|
{ attr: "allow-groups", key: "isGroupsAllowed", parser: "bool-default-true" },
|
|
@@ -2659,7 +2794,9 @@ const Cs = `@layer variables,component,overrides;@layer variables{:host{display:
|
|
|
2659
2794
|
{ attr: "allow-add-new", key: "isAddNewAllowed", parser: "bool-default-false" },
|
|
2660
2795
|
{ attr: "show-counter", key: "isCounterShown", parser: "bool-default-false" },
|
|
2661
2796
|
{ attr: "enable-virtual-scroll", key: "isVirtualScrollEnabled", parser: "bool-default-false" },
|
|
2662
|
-
{ attr: "enable-badge-tooltips", key: "isBadgeTooltipsEnabled", parser: "bool-default-false" }
|
|
2797
|
+
{ attr: "enable-badge-tooltips", key: "isBadgeTooltipsEnabled", parser: "bool-default-false" },
|
|
2798
|
+
{ attr: "enable-option-tooltips", key: "isOptionTooltipsEnabled", parser: "bool-default-false" },
|
|
2799
|
+
{ attr: "option-tooltip-follow-cursor", key: "isOptionTooltipFollowCursor", parser: "bool-default-false" }
|
|
2663
2800
|
], Ts = new Map(Ce.map((o) => [o.attr, o])), je = [
|
|
2664
2801
|
{ key: "valueMember", field: "_valueMember" },
|
|
2665
2802
|
{ key: "displayValueMember", field: "_displayValueMember" },
|
|
@@ -2668,7 +2805,7 @@ const Cs = `@layer variables,component,overrides;@layer variables{:host{display:
|
|
|
2668
2805
|
{ key: "subtitleMember", field: "_subtitleMember" },
|
|
2669
2806
|
{ key: "groupMember", field: "_groupMember" },
|
|
2670
2807
|
{ key: "disabledMember", field: "_disabledMember" }
|
|
2671
|
-
],
|
|
2808
|
+
], Os = [
|
|
2672
2809
|
{ key: "valueMember", member: "value" },
|
|
2673
2810
|
{ key: "displayValueMember", member: "label" },
|
|
2674
2811
|
{ key: "groupMember", member: "group" },
|
|
@@ -2706,7 +2843,7 @@ const Se = /* @__PURE__ */ new Set();
|
|
|
2706
2843
|
function ct() {
|
|
2707
2844
|
return Array.from(Se);
|
|
2708
2845
|
}
|
|
2709
|
-
class
|
|
2846
|
+
class Me extends Ss {
|
|
2710
2847
|
constructor() {
|
|
2711
2848
|
super();
|
|
2712
2849
|
d(this, "picker");
|
|
@@ -2739,6 +2876,7 @@ class Le extends Ss {
|
|
|
2739
2876
|
d(this, "_getValueFormatCallback");
|
|
2740
2877
|
// Tooltip callbacks
|
|
2741
2878
|
d(this, "_getBadgeTooltipCallback");
|
|
2879
|
+
d(this, "_getOptionTooltipCallback");
|
|
2742
2880
|
d(this, "_getRemoveButtonTooltipCallback");
|
|
2743
2881
|
// Custom rendering callbacks
|
|
2744
2882
|
d(this, "_renderOptionContentCallback");
|
|
@@ -2757,11 +2895,13 @@ class Le extends Ss {
|
|
|
2757
2895
|
d(this, "_batchNeedsReinit", !1);
|
|
2758
2896
|
// Event callbacks
|
|
2759
2897
|
d(this, "_beforeSearchCallback");
|
|
2898
|
+
d(this, "_beforeSelectCallback");
|
|
2899
|
+
d(this, "_beforeDeselectCallback");
|
|
2760
2900
|
d(this, "_searchCallback");
|
|
2761
2901
|
d(this, "_addNewCallback");
|
|
2762
|
-
d(this, "
|
|
2763
|
-
d(this, "
|
|
2764
|
-
d(this, "
|
|
2902
|
+
d(this, "_onSelect");
|
|
2903
|
+
d(this, "_onDeselect");
|
|
2904
|
+
d(this, "_onChange");
|
|
2765
2905
|
d(this, "_declarativeSelectedValues");
|
|
2766
2906
|
if (this.shadow = this.attachShadow({ mode: "open" }), typeof this.attachInternals == "function")
|
|
2767
2907
|
try {
|
|
@@ -2801,22 +2941,22 @@ class Le extends Ss {
|
|
|
2801
2941
|
Se.delete(this), this.picker && this.picker.destroy();
|
|
2802
2942
|
}
|
|
2803
2943
|
attributeChangedCallback(t, s, i) {
|
|
2804
|
-
var
|
|
2944
|
+
var n;
|
|
2805
2945
|
if (s === i || !this.picker || t === "initial-values") return;
|
|
2806
2946
|
if (t === "show-debug-info") {
|
|
2807
|
-
const
|
|
2808
|
-
|
|
2947
|
+
const a = this.shadow.querySelector(".ms__debug-info");
|
|
2948
|
+
a && a.remove(), i === "true" && this.renderDebugInfo();
|
|
2809
2949
|
return;
|
|
2810
2950
|
}
|
|
2811
2951
|
const r = Ts.get(t);
|
|
2812
2952
|
if (r) {
|
|
2813
|
-
const
|
|
2953
|
+
const a = Ue(r, i), l = (n = je.find((u) => u.key === r.key)) == null ? void 0 : n.field, h = a === void 0 && l ? this[l] : a;
|
|
2814
2954
|
if (this._batchDepth > 0) {
|
|
2815
|
-
this._batchPartial[r.key] =
|
|
2955
|
+
this._batchPartial[r.key] = h;
|
|
2816
2956
|
return;
|
|
2817
2957
|
}
|
|
2818
|
-
const
|
|
2819
|
-
if (this.picker.updateOptions(
|
|
2958
|
+
const c = { [r.key]: h };
|
|
2959
|
+
if (this.picker.updateOptions(c)) return;
|
|
2820
2960
|
}
|
|
2821
2961
|
if (this._batchDepth > 0) {
|
|
2822
2962
|
this._batchNeedsReinit = !0;
|
|
@@ -2840,8 +2980,8 @@ class Le extends Ss {
|
|
|
2840
2980
|
setAttributes(t) {
|
|
2841
2981
|
this._batchDepth++;
|
|
2842
2982
|
try {
|
|
2843
|
-
for (const [r,
|
|
2844
|
-
|
|
2983
|
+
for (const [r, n] of Object.entries(t))
|
|
2984
|
+
n == null || n === !1 ? this.removeAttribute(r) : this.setAttribute(r, n === !0 ? "" : String(n));
|
|
2845
2985
|
} finally {
|
|
2846
2986
|
this._batchDepth--;
|
|
2847
2987
|
}
|
|
@@ -2865,22 +3005,22 @@ class Le extends Ss {
|
|
|
2865
3005
|
s.className = "ms__debug-info";
|
|
2866
3006
|
const i = document.createElement("details"), r = document.createElement("summary");
|
|
2867
3007
|
r.textContent = "Debug Info";
|
|
2868
|
-
const
|
|
2869
|
-
|
|
3008
|
+
const n = document.createElement("div");
|
|
3009
|
+
n.className = "ms__debug-stats", i.appendChild(r), i.appendChild(n), s.appendChild(i), this.shadow.appendChild(s), this.updateDebugInfo();
|
|
2870
3010
|
}
|
|
2871
3011
|
updateDebugInfo() {
|
|
2872
3012
|
var m, b;
|
|
2873
3013
|
const t = this.shadow.querySelector(".ms__debug-stats");
|
|
2874
3014
|
if (!t || !this.picker) return;
|
|
2875
|
-
const s = "1.12.0-
|
|
3015
|
+
const s = "1.12.0-rc05", i = ct().length, n = this.picker.getSelected().length, a = ((m = this._options) == null ? void 0 : m.length) || 0, l = this.picker, h = l.isOpen || !1, c = l.searchTerm || "", p = l.isLoading || !1, u = ((b = l.filteredOptions) == null ? void 0 : b.length) || 0;
|
|
2876
3016
|
t.innerHTML = `
|
|
2877
3017
|
<span>Version: ${s}</span>
|
|
2878
3018
|
<span>Total Instances: ${i}</span>
|
|
2879
|
-
<span>Options: ${
|
|
3019
|
+
<span>Options: ${a}</span>
|
|
2880
3020
|
<span>Filtered: ${u}</span>
|
|
2881
|
-
<span>Selected: ${
|
|
2882
|
-
<span>Dropdown: ${
|
|
2883
|
-
<span>Search: ${
|
|
3021
|
+
<span>Selected: ${n}</span>
|
|
3022
|
+
<span>Dropdown: ${h ? "Open" : "Closed"}</span>
|
|
3023
|
+
<span>Search: ${c || "none"}</span>
|
|
2884
3024
|
<span>Loading: ${p ? "Yes" : "No"}</span>
|
|
2885
3025
|
`, setTimeout(() => {
|
|
2886
3026
|
this.getAttribute("show-debug-info") === "true" && this.updateDebugInfo();
|
|
@@ -2891,31 +3031,31 @@ class Le extends Ss {
|
|
|
2891
3031
|
* Returns array of options in the format expected by the picker
|
|
2892
3032
|
*/
|
|
2893
3033
|
parseDeclarativeOptions() {
|
|
2894
|
-
var r,
|
|
3034
|
+
var r, n, a, l;
|
|
2895
3035
|
const t = [], s = Array.from(this.children);
|
|
2896
3036
|
if (s.length === 0)
|
|
2897
3037
|
return null;
|
|
2898
3038
|
let i = !1;
|
|
2899
|
-
for (const
|
|
2900
|
-
if (
|
|
2901
|
-
const
|
|
2902
|
-
value:
|
|
2903
|
-
label: ((
|
|
3039
|
+
for (const h of s)
|
|
3040
|
+
if (h.tagName === "OPTION") {
|
|
3041
|
+
const c = h, p = {
|
|
3042
|
+
value: c.value || ((r = c.textContent) == null ? void 0 : r.trim()) || "",
|
|
3043
|
+
label: ((n = c.textContent) == null ? void 0 : n.trim()) || c.value || ""
|
|
2904
3044
|
};
|
|
2905
|
-
|
|
2906
|
-
} else if (
|
|
2907
|
-
const
|
|
3045
|
+
c.hasAttribute("selected") && (this._declarativeSelectedValues || (this._declarativeSelectedValues = []), this._declarativeSelectedValues.push(p.value)), c.hasAttribute("disabled") && (p.disabled = !0), c.hasAttribute("data-icon") && (p.icon = c.getAttribute("data-icon")), c.hasAttribute("data-subtitle") && (p.subtitle = c.getAttribute("data-subtitle")), t.push(p), i = !0;
|
|
3046
|
+
} else if (h.tagName === "OPTGROUP") {
|
|
3047
|
+
const c = h, p = c.label || c.getAttribute("label") || "Group", u = Array.from(c.querySelectorAll("option"));
|
|
2908
3048
|
for (const m of u) {
|
|
2909
3049
|
const b = {
|
|
2910
|
-
value: m.value || ((
|
|
3050
|
+
value: m.value || ((a = m.textContent) == null ? void 0 : a.trim()) || "",
|
|
2911
3051
|
label: ((l = m.textContent) == null ? void 0 : l.trim()) || m.value || "",
|
|
2912
3052
|
group: p
|
|
2913
3053
|
};
|
|
2914
3054
|
m.hasAttribute("selected") && (this._declarativeSelectedValues || (this._declarativeSelectedValues = []), this._declarativeSelectedValues.push(b.value)), m.hasAttribute("disabled") && (b.disabled = !0), m.hasAttribute("data-icon") && (b.icon = m.getAttribute("data-icon")), m.hasAttribute("data-subtitle") && (b.subtitle = m.getAttribute("data-subtitle")), t.push(b), i = !0;
|
|
2915
3055
|
}
|
|
2916
3056
|
}
|
|
2917
|
-
return i ? (x.debug(`[MultiSelectElement] Parsed ${t.length} declarative options from Light DOM`), s.forEach((
|
|
2918
|
-
(
|
|
3057
|
+
return i ? (x.debug(`[MultiSelectElement] Parsed ${t.length} declarative options from Light DOM`), s.forEach((h) => {
|
|
3058
|
+
(h.tagName === "OPTION" || h.tagName === "OPTGROUP") && h.remove();
|
|
2919
3059
|
}), t) : null;
|
|
2920
3060
|
}
|
|
2921
3061
|
/** Parse all observed attributes via ATTRIBUTE_TABLE into a partial config object. */
|
|
@@ -2934,26 +3074,26 @@ class Le extends Ss {
|
|
|
2934
3074
|
if (s && this._options === void 0)
|
|
2935
3075
|
try {
|
|
2936
3076
|
t = JSON.parse(s);
|
|
2937
|
-
} catch (
|
|
2938
|
-
x.error("[MultiSelectElement] Failed to parse data-options:",
|
|
3077
|
+
} catch (n) {
|
|
3078
|
+
x.error("[MultiSelectElement] Failed to parse data-options:", n);
|
|
2939
3079
|
}
|
|
2940
3080
|
let i;
|
|
2941
3081
|
if (this._declarativeSelectedValues && this._declarativeSelectedValues.length > 0)
|
|
2942
3082
|
i = this._declarativeSelectedValues, x.debug(`[MultiSelectElement] Using ${i.length} declaratively selected values`);
|
|
2943
3083
|
else {
|
|
2944
|
-
const
|
|
2945
|
-
if (
|
|
3084
|
+
const n = this.getAttribute("initial-values");
|
|
3085
|
+
if (n)
|
|
2946
3086
|
try {
|
|
2947
|
-
i = JSON.parse(
|
|
2948
|
-
} catch (
|
|
2949
|
-
x.error("[MultiSelectElement] Failed to parse initial-values:",
|
|
3087
|
+
i = JSON.parse(n);
|
|
3088
|
+
} catch (a) {
|
|
3089
|
+
x.error("[MultiSelectElement] Failed to parse initial-values:", a);
|
|
2950
3090
|
}
|
|
2951
3091
|
}
|
|
2952
3092
|
const r = this.parseAttributesFromTable();
|
|
2953
|
-
for (const { key:
|
|
2954
|
-
r[
|
|
3093
|
+
for (const { key: n, field: a } of je)
|
|
3094
|
+
r[n] === void 0 && (r[n] = this[a]);
|
|
2955
3095
|
if (this._hasDeclarativeOptions) {
|
|
2956
|
-
const
|
|
3096
|
+
const n = {
|
|
2957
3097
|
valueMember: this._getValueCallback,
|
|
2958
3098
|
displayValueMember: this._getDisplayValueCallback,
|
|
2959
3099
|
groupMember: this._getGroupCallback,
|
|
@@ -2961,8 +3101,8 @@ class Le extends Ss {
|
|
|
2961
3101
|
subtitleMember: this._getSubtitleCallback,
|
|
2962
3102
|
disabledMember: this._getDisabledCallback
|
|
2963
3103
|
};
|
|
2964
|
-
for (const { key:
|
|
2965
|
-
r[
|
|
3104
|
+
for (const { key: a, member: l } of Os)
|
|
3105
|
+
r[a] === void 0 && !n[a] && (r[a] = l);
|
|
2966
3106
|
}
|
|
2967
3107
|
if (Object.assign(r, {
|
|
2968
3108
|
actionButtons: this._actionButtons,
|
|
@@ -2984,42 +3124,45 @@ class Le extends Ss {
|
|
|
2984
3124
|
renderSelectedContentCallback: this._renderSelectedContentCallback,
|
|
2985
3125
|
getValueFormatCallback: this._getValueFormatCallback,
|
|
2986
3126
|
getBadgeTooltipCallback: this._getBadgeTooltipCallback,
|
|
3127
|
+
getOptionTooltipCallback: this._getOptionTooltipCallback,
|
|
2987
3128
|
getRemoveButtonTooltipCallback: this._getRemoveButtonTooltipCallback,
|
|
2988
|
-
getCounterCallback: this._getCounterCallback || ((
|
|
3129
|
+
getCounterCallback: this._getCounterCallback || ((n, a) => a !== void 0 ? `+${a} more` : `${n} selected`),
|
|
2989
3130
|
options: this._options ?? t,
|
|
2990
3131
|
beforeSearchCallback: this._beforeSearchCallback,
|
|
3132
|
+
beforeSelectCallback: this._beforeSelectCallback,
|
|
3133
|
+
beforeDeselectCallback: this._beforeDeselectCallback,
|
|
2991
3134
|
searchCallback: this._searchCallback,
|
|
2992
3135
|
addNewCallback: this._addNewCallback,
|
|
2993
|
-
|
|
2994
|
-
var
|
|
2995
|
-
this.
|
|
3136
|
+
onSelect: (n) => {
|
|
3137
|
+
var a;
|
|
3138
|
+
this._onSelect && this._onSelect(n), this.dispatchEvent(new CustomEvent("select", {
|
|
2996
3139
|
bubbles: !0,
|
|
2997
3140
|
composed: !0,
|
|
2998
3141
|
detail: {
|
|
2999
|
-
option:
|
|
3000
|
-
selectedOptions: (
|
|
3142
|
+
option: n,
|
|
3143
|
+
selectedOptions: (a = this.picker) == null ? void 0 : a.getSelected(),
|
|
3001
3144
|
selectedValues: this.collectSelectedValues()
|
|
3002
3145
|
}
|
|
3003
3146
|
}));
|
|
3004
3147
|
},
|
|
3005
|
-
|
|
3006
|
-
var
|
|
3007
|
-
this.
|
|
3148
|
+
onDeselect: (n) => {
|
|
3149
|
+
var a;
|
|
3150
|
+
this._onDeselect && this._onDeselect(n), this.dispatchEvent(new CustomEvent("deselect", {
|
|
3008
3151
|
bubbles: !0,
|
|
3009
3152
|
composed: !0,
|
|
3010
3153
|
detail: {
|
|
3011
|
-
option:
|
|
3012
|
-
selectedOptions: (
|
|
3154
|
+
option: n,
|
|
3155
|
+
selectedOptions: (a = this.picker) == null ? void 0 : a.getSelected(),
|
|
3013
3156
|
selectedValues: this.collectSelectedValues()
|
|
3014
3157
|
}
|
|
3015
3158
|
}));
|
|
3016
3159
|
},
|
|
3017
|
-
|
|
3018
|
-
this.
|
|
3160
|
+
onChange: (n) => {
|
|
3161
|
+
this._onChange && this._onChange(n), this.dispatchEvent(new CustomEvent("change", {
|
|
3019
3162
|
bubbles: !0,
|
|
3020
3163
|
composed: !0,
|
|
3021
3164
|
detail: {
|
|
3022
|
-
selectedOptions:
|
|
3165
|
+
selectedOptions: n,
|
|
3023
3166
|
selectedValues: this.collectSelectedValues()
|
|
3024
3167
|
}
|
|
3025
3168
|
}));
|
|
@@ -3029,10 +3172,10 @@ class Le extends Ss {
|
|
|
3029
3172
|
// Pass host element (this) for hidden inputs in light DOM
|
|
3030
3173
|
hostElement: this
|
|
3031
3174
|
}), i && (this.containerElement.dataset.initialValues = JSON.stringify(i)), this.picker = new xs(this.containerElement, r), this._customStylesCallback) {
|
|
3032
|
-
const
|
|
3033
|
-
if (
|
|
3034
|
-
const
|
|
3035
|
-
|
|
3175
|
+
const n = this._customStylesCallback();
|
|
3176
|
+
if (n) {
|
|
3177
|
+
const a = document.createElement("style");
|
|
3178
|
+
a.className = "ms-custom-styles", a.textContent = n, this.shadow.insertBefore(a, this.shadow.firstChild);
|
|
3036
3179
|
}
|
|
3037
3180
|
}
|
|
3038
3181
|
}
|
|
@@ -3260,6 +3403,42 @@ class Le extends Ss {
|
|
|
3260
3403
|
get enableBadgeTooltips() {
|
|
3261
3404
|
return this.getAttribute("enable-badge-tooltips") === "true";
|
|
3262
3405
|
}
|
|
3406
|
+
set enableOptionTooltips(t) {
|
|
3407
|
+
t ? this.setAttribute("enable-option-tooltips", "true") : this.removeAttribute("enable-option-tooltips");
|
|
3408
|
+
}
|
|
3409
|
+
get enableOptionTooltips() {
|
|
3410
|
+
return this.getAttribute("enable-option-tooltips") === "true";
|
|
3411
|
+
}
|
|
3412
|
+
set getOptionTooltipCallback(t) {
|
|
3413
|
+
this._getOptionTooltipCallback = t, this.updatePicker({ getOptionTooltipCallback: t });
|
|
3414
|
+
}
|
|
3415
|
+
get getOptionTooltipCallback() {
|
|
3416
|
+
return this._getOptionTooltipCallback;
|
|
3417
|
+
}
|
|
3418
|
+
set optionTooltipPlacement(t) {
|
|
3419
|
+
t ? this.setAttribute("option-tooltip-placement", t) : this.removeAttribute("option-tooltip-placement");
|
|
3420
|
+
}
|
|
3421
|
+
get optionTooltipPlacement() {
|
|
3422
|
+
return this.getAttribute("option-tooltip-placement");
|
|
3423
|
+
}
|
|
3424
|
+
set optionTooltipFollowCursor(t) {
|
|
3425
|
+
t ? this.setAttribute("option-tooltip-follow-cursor", "true") : this.removeAttribute("option-tooltip-follow-cursor");
|
|
3426
|
+
}
|
|
3427
|
+
get optionTooltipFollowCursor() {
|
|
3428
|
+
return this.getAttribute("option-tooltip-follow-cursor") === "true";
|
|
3429
|
+
}
|
|
3430
|
+
set actionsPosition(t) {
|
|
3431
|
+
t ? this.setAttribute("actions-position", t) : this.removeAttribute("actions-position");
|
|
3432
|
+
}
|
|
3433
|
+
get actionsPosition() {
|
|
3434
|
+
return this.getAttribute("actions-position");
|
|
3435
|
+
}
|
|
3436
|
+
set actionsAlign(t) {
|
|
3437
|
+
t ? this.setAttribute("actions-align", t) : this.removeAttribute("actions-align");
|
|
3438
|
+
}
|
|
3439
|
+
get actionsAlign() {
|
|
3440
|
+
return this.getAttribute("actions-align");
|
|
3441
|
+
}
|
|
3263
3442
|
set badgeTooltipPlacement(t) {
|
|
3264
3443
|
t ? this.setAttribute("badge-tooltip-placement", t) : this.removeAttribute("badge-tooltip-placement");
|
|
3265
3444
|
}
|
|
@@ -3297,6 +3476,18 @@ class Le extends Ss {
|
|
|
3297
3476
|
set beforeSearchCallback(t) {
|
|
3298
3477
|
this._beforeSearchCallback = t, this.updatePicker({ beforeSearchCallback: t });
|
|
3299
3478
|
}
|
|
3479
|
+
get beforeSelectCallback() {
|
|
3480
|
+
return this._beforeSelectCallback;
|
|
3481
|
+
}
|
|
3482
|
+
set beforeSelectCallback(t) {
|
|
3483
|
+
this._beforeSelectCallback = t, this.updatePicker({ beforeSelectCallback: t });
|
|
3484
|
+
}
|
|
3485
|
+
get beforeDeselectCallback() {
|
|
3486
|
+
return this._beforeDeselectCallback;
|
|
3487
|
+
}
|
|
3488
|
+
set beforeDeselectCallback(t) {
|
|
3489
|
+
this._beforeDeselectCallback = t, this.updatePicker({ beforeDeselectCallback: t });
|
|
3490
|
+
}
|
|
3300
3491
|
get searchCallback() {
|
|
3301
3492
|
return this._searchCallback;
|
|
3302
3493
|
}
|
|
@@ -3309,23 +3500,23 @@ class Le extends Ss {
|
|
|
3309
3500
|
set addNewCallback(t) {
|
|
3310
3501
|
this._addNewCallback = t, this.updatePicker({ addNewCallback: t });
|
|
3311
3502
|
}
|
|
3312
|
-
get
|
|
3313
|
-
return this.
|
|
3503
|
+
get onSelect() {
|
|
3504
|
+
return this._onSelect;
|
|
3314
3505
|
}
|
|
3315
|
-
set
|
|
3316
|
-
this.
|
|
3506
|
+
set onSelect(t) {
|
|
3507
|
+
this._onSelect = t;
|
|
3317
3508
|
}
|
|
3318
|
-
get
|
|
3319
|
-
return this.
|
|
3509
|
+
get onDeselect() {
|
|
3510
|
+
return this._onDeselect;
|
|
3320
3511
|
}
|
|
3321
|
-
set
|
|
3322
|
-
this.
|
|
3512
|
+
set onDeselect(t) {
|
|
3513
|
+
this._onDeselect = t;
|
|
3323
3514
|
}
|
|
3324
|
-
get
|
|
3325
|
-
return this.
|
|
3515
|
+
get onChange() {
|
|
3516
|
+
return this._onChange;
|
|
3326
3517
|
}
|
|
3327
|
-
set
|
|
3328
|
-
this.
|
|
3518
|
+
set onChange(t) {
|
|
3519
|
+
this._onChange = t;
|
|
3329
3520
|
}
|
|
3330
3521
|
// Action buttons
|
|
3331
3522
|
get actionButtons() {
|
|
@@ -3363,13 +3554,13 @@ class Le extends Ss {
|
|
|
3363
3554
|
// makes `form.reset()`, `form.elements`, and (in the future) constraint
|
|
3364
3555
|
// validation actually do something. Without this flag the element is
|
|
3365
3556
|
// invisible to the form lifecycle even when it has a `name`.
|
|
3366
|
-
d(
|
|
3367
|
-
typeof window < "u" && typeof customElements < "u" && (customElements.get("web-multiselect") || customElements.define("web-multiselect",
|
|
3557
|
+
d(Me, "formAssociated", !0);
|
|
3558
|
+
typeof window < "u" && typeof customElements < "u" && (customElements.get("web-multiselect") || customElements.define("web-multiselect", Me));
|
|
3368
3559
|
typeof window < "u" && (window.components = window.components || {}, window.components["web-multiselect"] = {
|
|
3369
|
-
version: () => "1.12.0-
|
|
3560
|
+
version: () => "1.12.0-rc05",
|
|
3370
3561
|
config: {
|
|
3371
3562
|
name: "@keenmate/web-multiselect",
|
|
3372
|
-
version: "1.12.0-
|
|
3563
|
+
version: "1.12.0-rc05",
|
|
3373
3564
|
author: "Keenmate",
|
|
3374
3565
|
license: "MIT",
|
|
3375
3566
|
repository: "git+https://github.com/keenmate/web-multiselect.git",
|
|
@@ -3383,13 +3574,13 @@ typeof window < "u" && (window.components = window.components || {}, window.comp
|
|
|
3383
3574
|
getCategories: () => [...us]
|
|
3384
3575
|
},
|
|
3385
3576
|
register: () => {
|
|
3386
|
-
typeof customElements < "u" && !customElements.get("web-multiselect") && customElements.define("web-multiselect",
|
|
3577
|
+
typeof customElements < "u" && !customElements.get("web-multiselect") && customElements.define("web-multiselect", Me);
|
|
3387
3578
|
},
|
|
3388
3579
|
getInstances: () => ct()
|
|
3389
3580
|
});
|
|
3390
3581
|
export {
|
|
3391
3582
|
us as LOGGING_CATEGORIES,
|
|
3392
|
-
|
|
3583
|
+
Me as MultiSelectElement,
|
|
3393
3584
|
xs as WebMultiSelect,
|
|
3394
3585
|
x as dataLogger,
|
|
3395
3586
|
gs as disableLogging,
|