@alixpartners/ui-components 2.0.0 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,526 +1,249 @@
1
- import { jsx as t, jsxs as v } from "react/jsx-runtime";
2
- import { c as R } from "../../clsx-OuTLNxxd.js";
3
- import * as m from "react";
4
- import { useState as W, useRef as U, useEffect as q, useCallback as ae } from "react";
5
- import K from "../Icon/Icon.js";
6
- import co from "../Toggle/Toggle.js";
7
- import ce from "../Button/Button.js";
8
- import ge from "../Ghost/Ghost.js";
9
- import io from "../Search/Search.js";
10
- import po from "../Tooltip/Tooltip.js";
11
- import { u as uo, c as _o, d as Ce, P as Ie, a as X, g as mo } from "../../index-DWydnyjJ.js";
12
- import { c as Ne, R as fo, A as Pe, P as wo, D as vo, C as ho, a as bo } from "../../index-DieLVN0p.js";
13
- import { h as Do, R as go, u as Co, F as Io } from "../../index-BGZDIjm9.js";
14
- import { u as No } from "../../index-2H7slGYV.js";
15
- import { P as Oe } from "../../index-DpfPnSMn.js";
16
- import '../../assets/Dropdown.css';var te = "Popover", [Ae, Xt] = _o(te, [
17
- Ne
18
- ]), Y = Ne(), [Po, G] = Ae(te), Re = (n) => {
19
- const {
20
- __scopePopover: p,
21
- children: a,
22
- open: l,
23
- defaultOpen: c,
24
- onOpenChange: s,
25
- modal: _ = !1
26
- } = n, u = Y(p), y = m.useRef(null), [D, E] = m.useState(!1), [T, L] = uo({
27
- prop: l,
28
- defaultProp: c ?? !1,
29
- onChange: s,
30
- caller: te
31
- });
32
- return /* @__PURE__ */ t(fo, { ...u, children: /* @__PURE__ */ t(
33
- Po,
34
- {
35
- scope: p,
36
- contentId: No(),
37
- triggerRef: y,
38
- open: T,
39
- onOpenChange: L,
40
- onOpenToggle: m.useCallback(() => L((i) => !i), [L]),
41
- hasCustomAnchor: D,
42
- onCustomAnchorAdd: m.useCallback(() => E(!0), []),
43
- onCustomAnchorRemove: m.useCallback(() => E(!1), []),
44
- modal: _,
45
- children: a
46
- }
47
- ) });
48
- };
49
- Re.displayName = te;
50
- var ye = "PopoverAnchor", Le = m.forwardRef(
51
- (n, p) => {
52
- const { __scopePopover: a, ...l } = n, c = G(ye, a), s = Y(a), { onCustomAnchorAdd: _, onCustomAnchorRemove: u } = c;
53
- return m.useEffect(() => (_(), () => u()), [_, u]), /* @__PURE__ */ t(Pe, { ...s, ...l, ref: p });
54
- }
55
- );
56
- Le.displayName = ye;
57
- var xe = "PopoverTrigger", ke = m.forwardRef(
58
- (n, p) => {
59
- const { __scopePopover: a, ...l } = n, c = G(xe, a), s = Y(a), _ = Ce(p, c.triggerRef), u = /* @__PURE__ */ t(
60
- Ie.button,
61
- {
62
- type: "button",
63
- "aria-haspopup": "dialog",
64
- "aria-expanded": c.open,
65
- "aria-controls": c.contentId,
66
- "data-state": Te(c.open),
67
- ...l,
68
- ref: _,
69
- onClick: X(n.onClick, c.onOpenToggle)
70
- }
71
- );
72
- return c.hasCustomAnchor ? u : /* @__PURE__ */ t(Pe, { asChild: !0, ...s, children: u });
73
- }
74
- );
75
- ke.displayName = xe;
76
- var ie = "PopoverPortal", [Oo, Ao] = Ae(ie, {
77
- forceMount: void 0
78
- }), Ee = (n) => {
79
- const { __scopePopover: p, forceMount: a, children: l, container: c } = n, s = G(ie, p);
80
- return /* @__PURE__ */ t(Oo, { scope: p, forceMount: a, children: /* @__PURE__ */ t(Oe, { present: a || s.open, children: /* @__PURE__ */ t(wo, { asChild: !0, container: c, children: l }) }) });
81
- };
82
- Ee.displayName = ie;
83
- var J = "PopoverContent", Me = m.forwardRef(
84
- (n, p) => {
85
- const a = Ao(J, n.__scopePopover), { forceMount: l = a.forceMount, ...c } = n, s = G(J, n.__scopePopover);
86
- return /* @__PURE__ */ t(Oe, { present: l || s.open, children: s.modal ? /* @__PURE__ */ t(yo, { ...c, ref: p }) : /* @__PURE__ */ t(Lo, { ...c, ref: p }) });
87
- }
88
- );
89
- Me.displayName = J;
90
- var Ro = mo("PopoverContent.RemoveScroll"), yo = m.forwardRef(
91
- (n, p) => {
92
- const a = G(J, n.__scopePopover), l = m.useRef(null), c = Ce(p, l), s = m.useRef(!1);
93
- return m.useEffect(() => {
94
- const _ = l.current;
95
- if (_) return Do(_);
96
- }, []), /* @__PURE__ */ t(go, { as: Ro, allowPinchZoom: !0, children: /* @__PURE__ */ t(
97
- Se,
98
- {
99
- ...n,
100
- ref: c,
101
- trapFocus: a.open,
102
- disableOutsidePointerEvents: !0,
103
- onCloseAutoFocus: X(n.onCloseAutoFocus, (_) => {
104
- var u;
105
- _.preventDefault(), s.current || (u = a.triggerRef.current) == null || u.focus();
106
- }),
107
- onPointerDownOutside: X(
108
- n.onPointerDownOutside,
109
- (_) => {
110
- const u = _.detail.originalEvent, y = u.button === 0 && u.ctrlKey === !0, D = u.button === 2 || y;
111
- s.current = D;
112
- },
113
- { checkForDefaultPrevented: !1 }
114
- ),
115
- onFocusOutside: X(
116
- n.onFocusOutside,
117
- (_) => _.preventDefault(),
118
- { checkForDefaultPrevented: !1 }
119
- )
120
- }
121
- ) });
122
- }
123
- ), Lo = m.forwardRef(
124
- (n, p) => {
125
- const a = G(J, n.__scopePopover), l = m.useRef(!1), c = m.useRef(!1);
126
- return /* @__PURE__ */ t(
127
- Se,
128
- {
129
- ...n,
130
- ref: p,
131
- trapFocus: !1,
132
- disableOutsidePointerEvents: !1,
133
- onCloseAutoFocus: (s) => {
134
- var _, u;
135
- (_ = n.onCloseAutoFocus) == null || _.call(n, s), s.defaultPrevented || (l.current || (u = a.triggerRef.current) == null || u.focus(), s.preventDefault()), l.current = !1, c.current = !1;
136
- },
137
- onInteractOutside: (s) => {
138
- var y, D;
139
- (y = n.onInteractOutside) == null || y.call(n, s), s.defaultPrevented || (l.current = !0, s.detail.originalEvent.type === "pointerdown" && (c.current = !0));
140
- const _ = s.target;
141
- ((D = a.triggerRef.current) == null ? void 0 : D.contains(_)) && s.preventDefault(), s.detail.originalEvent.type === "focusin" && c.current && s.preventDefault();
142
- }
143
- }
144
- );
145
- }
146
- ), Se = m.forwardRef(
147
- (n, p) => {
148
- const {
149
- __scopePopover: a,
150
- trapFocus: l,
151
- onOpenAutoFocus: c,
152
- onCloseAutoFocus: s,
153
- disableOutsidePointerEvents: _,
154
- onEscapeKeyDown: u,
155
- onPointerDownOutside: y,
156
- onFocusOutside: D,
157
- onInteractOutside: E,
158
- ...T
159
- } = n, L = G(J, a), i = Y(a);
160
- return Co(), /* @__PURE__ */ t(
161
- Io,
162
- {
163
- asChild: !0,
164
- loop: !0,
165
- trapped: l,
166
- onMountAutoFocus: c,
167
- onUnmountAutoFocus: s,
168
- children: /* @__PURE__ */ t(
169
- vo,
170
- {
171
- asChild: !0,
172
- disableOutsidePointerEvents: _,
173
- onInteractOutside: E,
174
- onEscapeKeyDown: u,
175
- onPointerDownOutside: y,
176
- onFocusOutside: D,
177
- onDismiss: () => L.onOpenChange(!1),
178
- children: /* @__PURE__ */ t(
179
- ho,
180
- {
181
- "data-state": Te(L.open),
182
- role: "dialog",
183
- id: L.contentId,
184
- ...i,
185
- ...T,
186
- ref: p,
187
- style: {
188
- ...T.style,
189
- "--radix-popover-content-transform-origin": "var(--radix-popper-transform-origin)",
190
- "--radix-popover-content-available-width": "var(--radix-popper-available-width)",
191
- "--radix-popover-content-available-height": "var(--radix-popper-available-height)",
192
- "--radix-popover-trigger-width": "var(--radix-popper-anchor-width)",
193
- "--radix-popover-trigger-height": "var(--radix-popper-anchor-height)"
194
- }
195
- }
196
- )
197
- }
198
- )
199
- }
200
- );
201
- }
202
- ), Fe = "PopoverClose", xo = m.forwardRef(
203
- (n, p) => {
204
- const { __scopePopover: a, ...l } = n, c = G(Fe, a);
205
- return /* @__PURE__ */ t(
206
- Ie.button,
207
- {
208
- type: "button",
209
- ...l,
210
- ref: p,
211
- onClick: X(n.onClick, () => c.onOpenChange(!1))
212
- }
213
- );
214
- }
215
- );
216
- xo.displayName = Fe;
217
- var ko = "PopoverArrow", Eo = m.forwardRef(
218
- (n, p) => {
219
- const { __scopePopover: a, ...l } = n, c = Y(a);
220
- return /* @__PURE__ */ t(bo, { ...c, ...l, ref: p });
221
- }
222
- );
223
- Eo.displayName = ko;
224
- function Te(n) {
225
- return n ? "open" : "closed";
226
- }
227
- var Mo = Re, So = Le, Fo = ke, To = Ee, Vo = Me;
228
- const Bo = "Dropdown-module__dropdownContainer___beNhQ", Wo = "Dropdown-module__dropdownLabel___T9FmB", Go = "Dropdown-module__dropdownLabelDisabled___SLRmM", zo = "Dropdown-module__required___ChI1m", qo = "Dropdown-module__dropdownWrapper___AUuWD", Jo = "Dropdown-module__dropdownTrigger___Rue93", $o = "Dropdown-module__dropdownTriggerDisabled___63wkd", jo = "Dropdown-module__dropdownTriggerOpen___cbm8V", Uo = "Dropdown-module__dropdownTriggerError___Uu02x", Ko = "Dropdown-module__dropdownContent___zLMhL", Xo = "Dropdown-module__dropdownSelectedItems___iXnpQ", Yo = "Dropdown-module__selectedItemsCreatable___SCjLK", Zo = "Dropdown-module__selectedItem___2jO4z", Ho = "Dropdown-module__selectedItemLabel___efVI-", Qo = "Dropdown-module__removeButton___9r85B", et = "Dropdown-module__removeIcon___st3b-", ot = "Dropdown-module__singleSelectedCreatableItem___BKFLb", tt = "Dropdown-module__singleSelectedCreatableItemRemoveButton___w3XXp", rt = "Dropdown-module__selectedOptionLabel___7Zdh3", nt = "Dropdown-module__placeholder___fWdch", dt = "Dropdown-module__dropdownActions___d55Fa", st = "Dropdown-module__dropdownArrow___dLbrb", lt = "Dropdown-module__dropdownArrowOpen___Z4Nh1", at = "Dropdown-module__dropdownMenu___toYcy", ct = "Dropdown-module__dropdownMenuToolbar___gFne0", it = "Dropdown-module__searchContainer___4kUvD", pt = "Dropdown-module__search___JmgDx", ut = "Dropdown-module__dropdownCreatableSearchContainer___sbs0F", _t = "Dropdown-module__disabled___0FjAX", mt = "Dropdown-module__dropdownCreatableError___gwBGw", ft = "Dropdown-module__creatableInput___meKz6", wt = "Dropdown-module__optionsList___rk2hi", vt = "Dropdown-module__categoryGroup___Np2bP", ht = "Dropdown-module__categoryDivider___Gh6F0", bt = "Dropdown-module__categoryLabel___B9IDR", Dt = "Dropdown-module__optionItem___7pi10", gt = "Dropdown-module__optionItemDisabled___aepUD", Ct = "Dropdown-module__optionItemFocused___u2781", It = "Dropdown-module__optionContent___nf1VC", Nt = "Dropdown-module__optionLabel___sJerM", Pt = "Dropdown-module__tickIcon___hYdCr", Ot = "Dropdown-module__noOptions___8vmhM", At = "Dropdown-module__helpers___s4ulA", Rt = "Dropdown-module__helpText___YooJE", yt = "Dropdown-module__helpTextDisabled___Ct4qq", Lt = "Dropdown-module__helpLink___-Zwpq", xt = "Dropdown-module__helpLinkDisabled___r-opC", kt = "Dropdown-module__errorMessage___3Mopi", Et = "Dropdown-module__selectAllContainer___Dlk3J", Mt = "Dropdown-module__actionButtons___-2nvr", o = {
229
- dropdownContainer: Bo,
230
- dropdownLabel: Wo,
1
+ import { jsxs as l, jsx as d } from "react/jsx-runtime";
2
+ import { c as h } from "../../clsx-OuTLNxxd.js";
3
+ import { useState as b, useRef as T, useEffect as v, useCallback as oe } from "react";
4
+ import B from "../Icon/Icon.js";
5
+ import Ce from "../Toggle/Toggle.js";
6
+ import ne from "../Button/Button.js";
7
+ import re from "../Ghost/Ghost.js";
8
+ import Me from "../Search/Search.js";
9
+ import Se from "../Tooltip/Tooltip.js";
10
+ import { R as Ve, T as Re, P as Ee, C as Fe } from "../../index-BKtdMA_j.js";
11
+ import '../../assets/Dropdown.css';const We = "Dropdown-module__dropdownContainer___beNhQ", qe = "Dropdown-module__dropdownLabel___T9FmB", Je = "Dropdown-module__dropdownLabelDisabled___SLRmM", ze = "Dropdown-module__required___ChI1m", Ge = "Dropdown-module__dropdownWrapper___AUuWD", Be = "Dropdown-module__dropdownTrigger___Rue93", Ue = "Dropdown-module__dropdownTriggerDisabled___63wkd", je = "Dropdown-module__dropdownTriggerOpen___cbm8V", Pe = "Dropdown-module__dropdownTriggerError___Uu02x", Ye = "Dropdown-module__dropdownContent___zLMhL", $e = "Dropdown-module__dropdownSelectedItems___iXnpQ", Ze = "Dropdown-module__selectedOptionLabel___7Zdh3", Qe = "Dropdown-module__placeholder___fWdch", Ke = "Dropdown-module__dropdownActions___d55Fa", Xe = "Dropdown-module__dropdownArrow___dLbrb", He = "Dropdown-module__dropdownArrowOpen___Z4Nh1", eo = "Dropdown-module__dropdownMenu___toYcy", oo = "Dropdown-module__dropdownMenuToolbar___gFne0", no = "Dropdown-module__searchContainer___4kUvD", ro = "Dropdown-module__search___JmgDx", to = "Dropdown-module__optionsList___rk2hi", lo = "Dropdown-module__categoryGroup___Np2bP", so = "Dropdown-module__categoryDivider___Gh6F0", io = "Dropdown-module__categoryLabel___B9IDR", co = "Dropdown-module__optionItem___7pi10", ao = "Dropdown-module__optionItemDisabled___aepUD", po = "Dropdown-module__optionItemFocused___u2781", _o = "Dropdown-module__optionContent___nf1VC", uo = "Dropdown-module__optionLabel___sJerM", mo = "Dropdown-module__tickIcon___hYdCr", wo = "Dropdown-module__noOptions___8vmhM", fo = "Dropdown-module__helpers___s4ulA", ho = "Dropdown-module__helpText___YooJE", Do = "Dropdown-module__helpTextDisabled___Ct4qq", bo = "Dropdown-module__helpLink___-Zwpq", go = "Dropdown-module__helpLinkDisabled___r-opC", No = "Dropdown-module__errorMessage___3Mopi", vo = "Dropdown-module__selectAllContainer___Dlk3J", Lo = "Dropdown-module__actionButtons___-2nvr", o = {
12
+ dropdownContainer: We,
13
+ dropdownLabel: qe,
231
14
  "label-text": "Dropdown-module__label-text___VEqG-",
232
- dropdownLabelDisabled: Go,
15
+ dropdownLabelDisabled: Je,
233
16
  "label-tooltip-icon": "Dropdown-module__label-tooltip-icon___JYVOm",
234
- required: zo,
235
- dropdownWrapper: qo,
17
+ required: ze,
18
+ dropdownWrapper: Ge,
236
19
  "dropdown-menu-trigger": "Dropdown-module__dropdown-menu-trigger___fgqVT",
237
- dropdownTrigger: Jo,
238
- dropdownTriggerDisabled: $o,
239
- dropdownTriggerOpen: jo,
240
- dropdownTriggerError: Uo,
241
- dropdownContent: Ko,
242
- dropdownSelectedItems: Xo,
243
- selectedItemsCreatable: Yo,
244
- selectedItem: Zo,
245
- selectedItemLabel: Ho,
246
- removeButton: Qo,
247
- removeIcon: et,
248
- singleSelectedCreatableItem: ot,
249
- singleSelectedCreatableItemRemoveButton: tt,
250
- selectedOptionLabel: rt,
251
- placeholder: nt,
252
- dropdownActions: dt,
253
- dropdownArrow: st,
254
- dropdownArrowOpen: lt,
255
- dropdownMenu: at,
20
+ dropdownTrigger: Be,
21
+ dropdownTriggerDisabled: Ue,
22
+ dropdownTriggerOpen: je,
23
+ dropdownTriggerError: Pe,
24
+ dropdownContent: Ye,
25
+ dropdownSelectedItems: $e,
26
+ selectedOptionLabel: Ze,
27
+ placeholder: Qe,
28
+ dropdownActions: Ke,
29
+ dropdownArrow: Xe,
30
+ dropdownArrowOpen: He,
31
+ dropdownMenu: eo,
256
32
  "dropdown-container-grouped": "Dropdown-module__dropdown-container-grouped___1twhU",
257
33
  "dropdown-container-multi-select": "Dropdown-module__dropdown-container-multi-select___zdaum",
258
- dropdownMenuToolbar: ct,
259
- searchContainer: it,
260
- search: pt,
261
- dropdownCreatableSearchContainer: ut,
262
- disabled: _t,
263
- dropdownCreatableError: mt,
264
- creatableInput: ft,
265
- optionsList: wt,
266
- categoryGroup: vt,
267
- categoryDivider: ht,
268
- categoryLabel: bt,
269
- optionItem: Dt,
270
- optionItemDisabled: gt,
271
- optionItemFocused: Ct,
272
- optionContent: It,
273
- optionLabel: Nt,
274
- tickIcon: Pt,
275
- noOptions: Ot,
276
- helpers: At,
277
- helpText: Rt,
278
- helpTextDisabled: yt,
279
- helpLink: Lt,
280
- helpLinkDisabled: xt,
281
- errorMessage: kt,
282
- selectAllContainer: Et,
283
- actionButtons: Mt
34
+ dropdownMenuToolbar: oo,
35
+ searchContainer: no,
36
+ search: ro,
37
+ optionsList: to,
38
+ categoryGroup: lo,
39
+ categoryDivider: so,
40
+ categoryLabel: io,
41
+ optionItem: co,
42
+ optionItemDisabled: ao,
43
+ optionItemFocused: po,
44
+ optionContent: _o,
45
+ optionLabel: uo,
46
+ tickIcon: mo,
47
+ noOptions: wo,
48
+ helpers: fo,
49
+ helpText: ho,
50
+ helpTextDisabled: Do,
51
+ helpLink: bo,
52
+ helpLinkDisabled: go,
53
+ errorMessage: No,
54
+ selectAllContainer: vo,
55
+ actionButtons: Lo
284
56
  };
285
- function Yt({
286
- className: n,
287
- label: p,
288
- options: a,
289
- value: l = [],
290
- placeholder: c = "Select options...",
291
- disabled: s = !1,
292
- required: _ = !1,
293
- searchable: u = !1,
294
- searchPlaceholder: y = "Search options...",
295
- errorMessage: D,
296
- helpText: E,
297
- helpLink: T,
298
- helpLinkText: L,
299
- onChange: i,
300
- onSearch: M,
301
- multiSelect: g = !1,
302
- grouped: Ve = !1,
303
- align: pe = "left",
304
- onToggleChange: Z,
305
- toggleLabel: Be,
306
- isCreatable: C = !1,
307
- dropdownTriggerClassName: We,
308
- dropdownMenuClassName: Ge,
309
- hideSelectedItems: ze = !1,
310
- labelTooltip: z,
311
- isTagsFields: I = !1,
312
- unselect: H = !1,
313
- selectedOptionLabel: qe = "option selected",
314
- selectedOptionsLabel: Je = "options selected",
315
- allOptionsSelectedLabel: Q,
316
- caseSensitive: re = !1,
317
- ...$e
57
+ function Vo({
58
+ className: de,
59
+ label: E,
60
+ options: F,
61
+ value: p = [],
62
+ placeholder: A = "Select options...",
63
+ disabled: L = !1,
64
+ required: te = !1,
65
+ searchable: x = !1,
66
+ searchPlaceholder: le = "Search options...",
67
+ errorMessage: O,
68
+ helpText: C,
69
+ helpLink: W,
70
+ helpLinkText: q,
71
+ onChange: t,
72
+ onSearch: J,
73
+ multiSelect: m = !1,
74
+ grouped: se = !1,
75
+ align: U = "left",
76
+ onToggleChange: M,
77
+ toggleLabel: ie,
78
+ dropdownTriggerClassName: ce,
79
+ dropdownMenuClassName: ae,
80
+ hideSelectedItems: pe = !1,
81
+ labelTooltip: D,
82
+ unselect: S = !1,
83
+ selectedOptionLabel: _e = "option selected",
84
+ selectedOptionsLabel: ue = "options selected",
85
+ allOptionsSelectedLabel: j,
86
+ caseSensitive: P = !1,
87
+ ...me
318
88
  }) {
319
- const [f, S] = W(l), [h, O] = W(!1), [ne, N] = W(""), [$, w] = W(-1), [F, x] = W([]), ue = U(null), _e = U(null), ee = U(null), j = U(null), [me, je] = W(0), [Ue, Ke] = W(0), [Xe, Ye] = W(l.length > 0 ? l.join(", ") : c ?? ""), fe = U(l);
320
- q(() => {
321
- JSON.stringify(fe.current) !== JSON.stringify(l) && (S(l), fe.current = l);
322
- }, [l]), q(() => {
323
- var d;
324
- const e = (d = _e.current) == null ? void 0 : d.getBoundingClientRect().width;
325
- e && je(e);
326
- }, []), q(() => {
327
- var d;
328
- const e = (d = ee.current) == null ? void 0 : d.getBoundingClientRect().width;
329
- e && Ke(e);
330
- }, []), q(() => {
331
- h && x([...f]);
332
- }, [h, f]);
333
- const k = ne.trim(), P = a.filter((e) => {
334
- const d = re ? e.label : e.label.toLowerCase(), r = re ? k : k.toLowerCase();
335
- return d.includes(r);
89
+ const [s, g] = b(p), [i, f] = b(!1), [Y, _] = b(""), [I, c] = b(-1), [w, u] = b([]), $ = T(null), Z = T(null), we = T(null), z = T(null), [Q, fe] = b(0), [he, De] = b(p.length > 0 ? p.join(", ") : A ?? ""), K = T(p);
90
+ v(() => {
91
+ JSON.stringify(K.current) !== JSON.stringify(p) && (g(p), K.current = p);
92
+ }, [p]), v(() => {
93
+ var r;
94
+ const e = (r = Z.current) == null ? void 0 : r.getBoundingClientRect().width;
95
+ e && fe(e);
96
+ }, []), v(() => {
97
+ i && u([...s]);
98
+ }, [i, s]);
99
+ const X = Y.trim(), a = F.filter((e) => {
100
+ const r = P ? e.label : e.label.toLowerCase(), n = P ? X : X.toLowerCase();
101
+ return r.includes(n);
336
102
  });
337
- q(() => {
338
- Ye(l.length > 0 ? l.join(", ") : c ?? "");
339
- }, [l, c]), q(() => {
340
- h && (u || C || I) && j.current && j.current.focus();
341
- }, [h, u, C, I]);
342
- const Ze = (e) => {
343
- O(e), e ? (x([...f]), N(""), w(-1)) : (N(""), w(-1), x([]));
344
- }, de = ae((e) => {
103
+ v(() => {
104
+ De(p.length > 0 ? p.join(", ") : A ?? "");
105
+ }, [p, A]), v(() => {
106
+ i && x && z.current && z.current.focus();
107
+ }, [i, x]);
108
+ const be = (e) => {
109
+ f(e), e ? (u([...s]), _(""), c(-1)) : (_(""), c(-1), u([]));
110
+ }, G = oe((e) => {
345
111
  if (e.disabled) return;
346
- let d = [];
347
- if (g)
348
- d = F.includes(e.value) ? F.filter((r) => r !== e.value) : [...F, e.value];
112
+ let r = [];
113
+ if (m)
114
+ r = w.includes(e.value) ? w.filter((n) => n !== e.value) : [...w, e.value];
349
115
  else {
350
- if (f.includes(e.value))
351
- if (H)
352
- d = [];
116
+ if (s.includes(e.value))
117
+ if (S)
118
+ r = [];
353
119
  else
354
120
  return;
355
121
  else
356
- d = [e.value];
357
- S(d), i == null || i(d), O(!1), N(""), w(-1), x([]);
122
+ r = [e.value];
123
+ g(r), t == null || t(r), f(!1), _(""), c(-1), u([]);
358
124
  return;
359
125
  }
360
- x(d);
361
- }, [g, i, F, f, H]), He = () => {
362
- S(F), i == null || i(F), O(!1), N(""), w(-1), x([]);
363
- }, Qe = () => {
364
- O(!1), N(""), w(-1), x([]);
365
- }, eo = (e) => {
366
- N(e), w(-1), M == null || M(e);
367
- }, oo = ae((e) => {
126
+ u(r);
127
+ }, [m, t, w, s, S]), ge = () => {
128
+ g(w), t == null || t(w), f(!1), _(""), c(-1), u([]);
129
+ }, Ne = () => {
130
+ f(!1), _(""), c(-1), u([]);
131
+ }, ve = (e) => {
132
+ _(e), c(-1), J == null || J(e);
133
+ }, Le = oe((e) => {
368
134
  var r;
369
- const d = {
370
- value: e,
371
- label: e,
372
- disabled: !1
373
- };
374
- if (a.push(d), g) {
375
- const B = f.includes(e) ? f : [...f, e];
376
- S(B), i == null || i(B), N(""), O(!0), w(-1);
377
- } else {
378
- const V = [e];
379
- S(V), i == null || i(V), N(""), O(!1), w(-1);
380
- }
381
- (r = ee.current) == null || r.focus();
382
- }, [g, i, a, f]), se = ae((e) => {
383
- var d;
384
135
  if (!e.disabled) {
385
- if (g) {
386
- const V = f.includes(e.value) ? f.filter((B) => B !== e.value) : [...f, e.value];
387
- S(V), i == null || i(V), O(!0), N(""), w(-1);
388
- } else if (f.includes(e.value)) {
389
- if (H) {
390
- const r = [];
391
- S(r), i == null || i(r), O(!1), N(""), w(-1);
136
+ if (m) {
137
+ const R = s.includes(e.value) ? s.filter((k) => k !== e.value) : [...s, e.value];
138
+ g(R), t == null || t(R), f(!0), _(""), c(-1);
139
+ } else if (s.includes(e.value)) {
140
+ if (S) {
141
+ const n = [];
142
+ g(n), t == null || t(n), f(!1), _(""), c(-1);
392
143
  }
393
144
  } else {
394
- const r = [e.value];
395
- S(r), i == null || i(r), O(!1), N(""), w(-1);
145
+ const n = [e.value];
146
+ g(n), t == null || t(n), f(!1), _(""), c(-1);
396
147
  }
397
- (d = ee.current) == null || d.focus();
148
+ (r = we.current) == null || r.focus();
398
149
  }
399
- }, [g, i, f, H]), to = (e) => {
400
- O(!0), N(e), w(-1), M == null || M(e);
401
- }, we = (e) => {
402
- O(!0), N(e), w(-1), M == null || M(e);
403
- }, ro = (e) => {
404
- Z == null || Z(e);
405
- }, ve = (e) => {
406
- const d = f.filter((r) => r !== e);
407
- S(d), i == null || i(d);
150
+ }, [m, t, s, S]), Oe = (e) => {
151
+ M == null || M(e);
408
152
  };
409
- q(() => {
410
- const e = (d) => {
411
- if (h)
412
- switch (d.key) {
153
+ v(() => {
154
+ const e = (r) => {
155
+ if (i)
156
+ switch (r.key) {
413
157
  case "ArrowDown":
414
- d.preventDefault(), w((r) => r < P.length - 1 ? r + 1 : 0);
158
+ r.preventDefault(), c((n) => n < a.length - 1 ? n + 1 : 0);
415
159
  break;
416
160
  case "ArrowUp":
417
- d.preventDefault(), w((r) => r > 0 ? r - 1 : P.length - 1);
161
+ r.preventDefault(), c((n) => n > 0 ? n - 1 : a.length - 1);
418
162
  break;
419
163
  case "Enter":
420
- if (d.preventDefault(), $ >= 0 && $ < P.length) {
421
- const r = P[$];
422
- C || I ? se(r) : de(r);
164
+ if (r.preventDefault(), I >= 0 && I < a.length) {
165
+ const n = a[I];
166
+ G(n);
423
167
  }
424
168
  break;
425
169
  case "Escape":
426
- d.preventDefault(), O(!1), N(""), w(-1), x([]);
170
+ r.preventDefault(), f(!1), _(""), c(-1), u([]);
427
171
  break;
428
172
  }
429
173
  };
430
174
  return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
431
- }, [h, $, P, C, I, se, de]);
432
- const oe = C || I ? f : h ? F : f, b = a.filter((e) => oe.includes(e.value)), he = !!D, no = JSON.stringify(F) !== JSON.stringify(f), be = a.filter((e) => !e.disabled), De = be.length > 0 && be.every((e) => oe.includes(e.value)), so = P.reduce((e, d) => {
433
- const r = d.category || "default";
434
- return e[r] || (e[r] = []), e[r].push(d), e;
435
- }, {}), lo = P, {
436
- onBlur: A,
437
- ...le
438
- } = $e;
439
- return /* @__PURE__ */ v("div", { ref: ue, className: R(o.dropdownContainer, Ve && o["dropdown-container-grouped"], g && o["dropdown-container-multi-select"], n), ...le, children: [
440
- p && /* @__PURE__ */ v("label", { className: R(o.dropdownLabel, s && o.dropdownLabelDisabled), children: [
441
- /* @__PURE__ */ t("span", { title: p, className: o["label-text"], children: p }),
442
- _ && /* @__PURE__ */ t("span", { className: o.required, children: "*" }),
443
- z && /* @__PURE__ */ t(po, { content: z.content, size: z.size, theme: z.theme, tipSide: z.tipSide, tipAlignment: z.tipAlignment, startVisible: z.startVisible, children: /* @__PURE__ */ t(K, { icon: "ap-icon-info", className: o["label-tooltip-icon"] }) })
175
+ }, [i, I, a, Le, G]);
176
+ const V = i ? w : s, y = F.filter((e) => V.includes(e.value)), Ie = !!O, ye = JSON.stringify(w) !== JSON.stringify(s), H = F.filter((e) => !e.disabled), ke = H.length > 0 && H.every((e) => V.includes(e.value)), Te = a.reduce((e, r) => {
177
+ const n = r.category || "default";
178
+ return e[n] || (e[n] = []), e[n].push(r), e;
179
+ }, {}), Ae = a, {
180
+ onBlur: N,
181
+ ...ee
182
+ } = me;
183
+ return /* @__PURE__ */ l("div", { ref: $, className: h(o.root, o.dropdownContainer, se && o["dropdown-container-grouped"], m && o["dropdown-container-multi-select"], de), ...ee, children: [
184
+ E && /* @__PURE__ */ l("label", { className: h(o.dropdownLabel, L && o.dropdownLabelDisabled), children: [
185
+ /* @__PURE__ */ d("span", { title: E, className: o["label-text"], children: E }),
186
+ te && /* @__PURE__ */ d("span", { className: o.required, children: "*" }),
187
+ D && /* @__PURE__ */ d(Se, { content: D.content, size: D.size, theme: D.theme, tipSide: D.tipSide, tipAlignment: D.tipAlignment, startVisible: D.startVisible, children: /* @__PURE__ */ d(B, { icon: "ap-icon-info", className: o["label-tooltip-icon"] }) })
444
188
  ] }),
445
- /* @__PURE__ */ t(Mo, { open: h, onOpenChange: Ze, children: /* @__PURE__ */ v("div", { className: o.dropdownWrapper, children: [
446
- !C && !I && /* @__PURE__ */ t(Fo, { disabled: s, className: R(o["dropdown-menu-trigger"], o.dropdownTrigger, We, h && o.dropdownTriggerOpen, s && o.dropdownTriggerDisabled, he && o.dropdownTriggerError), ref: _e, onBlur: (e) => {
447
- h || A == null || A(e);
448
- }, ...le, children: /* @__PURE__ */ v("div", { className: o.dropdownContent, children: [
449
- !ze && /* @__PURE__ */ t("div", { className: o.dropdownSelectedItems, children: b.length > 0 ? g ? De && Q ? Q : b.length === 1 ? ` ${b.length} ${qe}` : ` ${b.length} ${Je}` : (
189
+ /* @__PURE__ */ d(Ve, { open: i, onOpenChange: be, children: /* @__PURE__ */ l("div", { className: o.dropdownWrapper, children: [
190
+ /* @__PURE__ */ d(Re, { disabled: L, className: h(o["dropdown-menu-trigger"], o.dropdownTrigger, ce, i && o.dropdownTriggerOpen, L && o.dropdownTriggerDisabled, Ie && o.dropdownTriggerError), ref: Z, onBlur: (e) => {
191
+ i || N == null || N(e);
192
+ }, ...ee, children: /* @__PURE__ */ l("div", { className: o.dropdownContent, children: [
193
+ !pe && /* @__PURE__ */ d("div", { className: o.dropdownSelectedItems, children: y.length > 0 ? m ? ke && j ? j : y.length === 1 ? ` ${y.length} ${_e}` : ` ${y.length} ${ue}` : (
450
194
  // For single select, show the selected option label
451
- /* @__PURE__ */ t("span", { className: o.selectedOptionLabel, children: b[0].label })
452
- ) : /* @__PURE__ */ t("span", { title: Xe, className: o.placeholder, children: c }) }),
453
- /* @__PURE__ */ t("div", { className: o.dropdownActions, children: /* @__PURE__ */ t(K, { icon: "ap-icon-expand-more", className: R(o.dropdownArrow, h && o.dropdownArrowOpen) }) })
454
- ] }) }),
455
- (C || I) && /* @__PURE__ */ t(So, { children: /* @__PURE__ */ v("div", { tabIndex: 0, ref: ee, className: R(o.dropdownCreatableSearchContainer, s && o.disabled, he && o.dropdownCreatableError), onBlur: (e) => {
456
- h || A == null || A(e);
457
- }, onClick: () => {
458
- var e;
459
- if (!g && b.length > 0)
460
- return we("");
461
- (e = j.current) == null || e.focus();
462
- }, ...le, children: [
463
- b.length > 0 && /* @__PURE__ */ t("div", { className: R(o.selectedItemsCreatable), children: g ? b.length > 3 ? /* @__PURE__ */ t("div", { className: o.selectedItem, children: /* @__PURE__ */ t("span", { className: o.selectedItemLabel, children: De && Q ? Q : `${b.length} options selected` }) }) : b.map((e) => /* @__PURE__ */ v("div", { className: o.selectedItem, children: [
464
- /* @__PURE__ */ t("span", { className: o.selectedItemLabel, children: e.label }),
465
- /* @__PURE__ */ t("button", { type: "button", className: o.removeButton, onClick: () => ve(e.value), disabled: s, children: /* @__PURE__ */ t(K, { icon: "ap-icon-close", className: o.removeIcon }) })
466
- ] }, e.value)) : b.length > 0 && /* @__PURE__ */ v("div", { className: o.singleSelectedCreatableItem, children: [
467
- /* @__PURE__ */ t("span", { className: o.selectedItemLabel, children: b[0].label }),
468
- /* @__PURE__ */ t(ce, { type: "tertiary", variant: "default", size: "sm", onClick: () => ve(b[0].value), disabled: s, icon: "ap-icon-add-filled", className: o.singleSelectedCreatableItemRemoveButton })
469
- ] }) }),
470
- (g || !b.length) && /* @__PURE__ */ t("input", { ref: j, placeholder: b.length > 0 ? "" : y, value: ne, onChange: (e) => to(e.target.value), onFocus: (e) => we(e.target.value), onBlur: (e) => {
471
- h || A == null || A(e);
472
- }, disabled: s, className: o.creatableInput }),
473
- /* @__PURE__ */ t("div", { className: o.dropdownActions, children: /* @__PURE__ */ t(K, { icon: "ap-icon-expand-more", className: R(o.dropdownArrow, h && o.dropdownArrowOpen) }) })
195
+ /* @__PURE__ */ d("span", { className: o.selectedOptionLabel, children: y[0].label })
196
+ ) : /* @__PURE__ */ d("span", { title: he, className: o.placeholder, children: A }) }),
197
+ /* @__PURE__ */ d("div", { className: o.dropdownActions, children: /* @__PURE__ */ d(B, { icon: "ap-icon-expand-more", className: h(o.dropdownArrow, i && o.dropdownArrowOpen) }) })
474
198
  ] }) }),
475
- /* @__PURE__ */ t(To, { children: /* @__PURE__ */ t(Vo, { align: pe === "right" ? "end" : "start", side: "bottom", avoidCollisions: !0, sideOffset: 6, collisionPadding: 8, style: {
476
- minWidth: me,
199
+ /* @__PURE__ */ d(Ee, { children: /* @__PURE__ */ d(Fe, { align: U === "right" ? "end" : "start", side: "bottom", avoidCollisions: !0, sideOffset: 6, collisionPadding: 8, style: {
200
+ minWidth: Q,
477
201
  zIndex: 9999
478
202
  }, onInteractOutside: (e) => {
479
- var r;
480
- e.target === j.current && e.preventDefault(), ((r = ue.current) == null ? void 0 : r.contains(e.target)) || A == null || A(e);
481
- }, children: h && /* @__PURE__ */ v("div", { style: {
482
- minWidth: C || I ? Ue : me
483
- }, className: R(o.dropdownMenu, Ge, pe === "right" && o.dropdownMenuRight), children: [
484
- !C && !I && (u || g) && /* @__PURE__ */ v("div", { className: o.dropdownMenuToolbar, children: [
485
- u && /* @__PURE__ */ v("div", { className: o.searchContainer, children: [
486
- /* @__PURE__ */ t(io, { placeholder: y, value: ne, onChange: eo, className: o.search }),
487
- Z && /* @__PURE__ */ t(co, { label: Be, onChange: ro })
203
+ var n;
204
+ e.target === z.current && e.preventDefault(), ((n = $.current) == null ? void 0 : n.contains(e.target)) || N == null || N(e);
205
+ }, children: i && /* @__PURE__ */ l("div", { style: {
206
+ minWidth: Q
207
+ }, className: h(o.dropdownMenu, ae, U === "right" && o.dropdownMenuRight), children: [
208
+ (x || m) && /* @__PURE__ */ l("div", { className: o.dropdownMenuToolbar, children: [
209
+ x && /* @__PURE__ */ l("div", { className: o.searchContainer, children: [
210
+ /* @__PURE__ */ d(Me, { placeholder: le, value: Y, onChange: ve, className: o.search }),
211
+ M && /* @__PURE__ */ d(Ce, { label: ie, onChange: Oe })
488
212
  ] }),
489
- g && !C && !I && /* @__PURE__ */ v("div", { className: o.selectAllContainer, children: [
490
- /* @__PURE__ */ t(ge, { variant: "default", noIcon: !0, onClick: () => {
491
- const e = P.filter((d) => !d.disabled).map((d) => d.value);
492
- x(e);
493
- }, disabled: P.filter((e) => !e.disabled).length === 0, children: "Select all" }),
494
- /* @__PURE__ */ t(ge, { variant: "default", noIcon: !0, onClick: () => x([]), disabled: F.length === 0, children: "Deselect all" })
213
+ m && /* @__PURE__ */ l("div", { className: o.selectAllContainer, children: [
214
+ /* @__PURE__ */ d(re, { variant: "default", noIcon: !0, onClick: () => {
215
+ const e = a.filter((r) => !r.disabled).map((r) => r.value);
216
+ u(e);
217
+ }, disabled: a.filter((e) => !e.disabled).length === 0, children: "Select all" }),
218
+ /* @__PURE__ */ d(re, { variant: "default", noIcon: !0, onClick: () => u([]), disabled: w.length === 0, children: "Deselect all" })
495
219
  ] })
496
220
  ] }),
497
- /* @__PURE__ */ v("div", { className: o.optionsList, "data-dropdown-options-list": !0, children: [
498
- P.length > 0 ? Object.entries(so).map(([e, d]) => /* @__PURE__ */ v("div", { className: o.categoryGroup, children: [
499
- e !== "default" && /* @__PURE__ */ t("div", { className: o.categoryDivider, children: /* @__PURE__ */ t("span", { className: o.categoryLabel, children: e }) }),
500
- d.map((r) => {
501
- const V = lo.indexOf(r), B = P.find((ao) => ao.value === r.value);
502
- return /* @__PURE__ */ t("button", { title: (B == null ? void 0 : B.label) || r.label, type: "button", className: R(o.optionItem, oe.includes(r.value) && o.optionItemSelected, r.disabled && o.optionItemDisabled, V === $ && o.optionItemFocused), onClick: () => C || I ? se(r) : de(r), disabled: r.disabled, "data-dropdown-option-item": !0, children: /* @__PURE__ */ v("div", { className: o.optionContent, children: [
503
- /* @__PURE__ */ t("span", { className: o.optionLabel, children: r.label }),
504
- oe.includes(r.value) && /* @__PURE__ */ t(K, { icon: "ap-icon-check", className: o.tickIcon })
505
- ] }) }, r.value);
221
+ /* @__PURE__ */ l("div", { className: o.optionsList, "data-dropdown-options-list": !0, children: [
222
+ a.length > 0 ? Object.entries(Te).map(([e, r]) => /* @__PURE__ */ l("div", { className: o.categoryGroup, children: [
223
+ e !== "default" && /* @__PURE__ */ d("div", { className: o.categoryDivider, children: /* @__PURE__ */ d("span", { className: o.categoryLabel, children: e }) }),
224
+ r.map((n) => {
225
+ const R = Ae.indexOf(n), k = a.find((xe) => xe.value === n.value);
226
+ return /* @__PURE__ */ d("button", { title: (k == null ? void 0 : k.label) || n.label, type: "button", className: h(o.optionItem, V.includes(n.value) && o.optionItemSelected, n.disabled && o.optionItemDisabled, R === I && o.optionItemFocused), onClick: () => G(n), disabled: n.disabled, "data-dropdown-option-item": !0, children: /* @__PURE__ */ l("div", { className: o.optionContent, children: [
227
+ /* @__PURE__ */ d("span", { className: o.optionLabel, children: n.label }),
228
+ V.includes(n.value) && /* @__PURE__ */ d(B, { icon: "ap-icon-check", className: o.tickIcon })
229
+ ] }) }, n.value);
506
230
  })
507
231
  ] }, e)) : null,
508
- C && k !== "" && !a.find((e) => re ? e.label === k : e.label.toLowerCase() === k.toLowerCase()) && /* @__PURE__ */ t("button", { type: "button", className: R(o.optionItem, o.optionItemCreatable), title: k ? `Create "${k}"` : "Create new option", onClick: () => oo(k), children: /* @__PURE__ */ t("div", { className: o.optionContent, children: /* @__PURE__ */ t("span", { className: o.optionLabel, children: k ? `Create "${k}"` : "Create new option" }) }) }),
509
- P.length === 0 && !C && !I && /* @__PURE__ */ t("div", { className: o.noOptions, children: "No options found" }),
510
- P.length === 0 && I && /* @__PURE__ */ t("div", { className: o.noOptions, children: "No options found" })
232
+ a.length === 0 && /* @__PURE__ */ d("div", { className: o.noOptions, children: "No options found" })
511
233
  ] }),
512
- g && !C && !I && /* @__PURE__ */ v("div", { className: o.actionButtons, children: [
513
- /* @__PURE__ */ t(ce, { type: "primary", variant: "cancel", size: "md", onClick: Qe, children: "Cancel" }),
514
- /* @__PURE__ */ t(ce, { type: "primary", variant: "default", size: "md", onClick: He, disabled: !no, children: "Apply" })
234
+ " ",
235
+ m && /* @__PURE__ */ l("div", { className: o.actionButtons, children: [
236
+ /* @__PURE__ */ d(ne, { type: "primary", variant: "cancel", size: "md", onClick: Ne, children: "Cancel" }),
237
+ /* @__PURE__ */ d(ne, { type: "primary", variant: "default", size: "md", onClick: ge, disabled: !ye, children: "Apply" })
515
238
  ] })
516
239
  ] }) }) })
517
240
  ] }) }),
518
- (D || E || T && L) && /* @__PURE__ */ v("div", { className: o.helpers, children: [
519
- D ? /* @__PURE__ */ t("span", { title: D, className: o.errorMessage, children: D }) : E && /* @__PURE__ */ t("span", { title: E, className: R(o.helpText, s && o.helpTextDisabled), children: E }),
520
- T && L && /* @__PURE__ */ t("a", { href: T, className: R(o.helpLink, s && o.helpLinkDisabled), target: "_blank", rel: "noopener noreferrer", children: L })
241
+ (O || C || W && q) && /* @__PURE__ */ l("div", { className: o.helpers, children: [
242
+ O ? /* @__PURE__ */ d("span", { title: O, className: o.errorMessage, children: O }) : C && /* @__PURE__ */ d("span", { title: C, className: h(o.helpText, L && o.helpTextDisabled), children: C }),
243
+ W && q && /* @__PURE__ */ d("a", { href: W, className: h(o.helpLink, L && o.helpLinkDisabled), target: "_blank", rel: "noopener noreferrer", children: q })
521
244
  ] })
522
245
  ] });
523
246
  }
524
247
  export {
525
- Yt as default
248
+ Vo as default
526
249
  };