@mattermost/compass-ui 0.1.0-alpha.25 → 0.1.0-alpha.27

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,55 +1,55 @@
1
1
  import { jsxs as M, jsx as l } from "react/jsx-runtime";
2
- import { forwardRef as wr, useId as Mr, useRef as O, useCallback as d, useState as I, useMemo as V, useEffect as de } from "react";
2
+ import { forwardRef as Mr, useId as Er, useRef as O, useCallback as d, useState as E, useMemo as I, useEffect as de } from "react";
3
3
  import __Ir from "@mattermost/compass-icons/components/chevron-down.js";const Ir=__Ir&&__Ir.default?__Ir.default:__Ir;
4
4
  import __Vr from "@mattermost/compass-icons/components/close-circle.js";const Vr=__Vr&&__Vr.default?__Vr.default:__Vr;
5
- import __Er from "@mattermost/compass-icons/components/plus.js";const Er=__Er&&__Er.default?__Er.default:__Er;
6
- import Rr from "../chip/Chip.js";
7
- import Sr from "../chip/ChipGroup.js";
8
- import me, { IconSlotContext as Tr } from "../icon/Icon.js";
5
+ import __Rr from "@mattermost/compass-icons/components/plus.js";const Rr=__Rr&&__Rr.default?__Rr.default:__Rr;
6
+ import Sr from "../chip/Chip.js";
7
+ import Tr from "../chip/ChipGroup.js";
8
+ import me, { IconSlotContext as Lr } from "../icon/Icon.js";
9
9
  import Te from "../menu-item/MenuItem.js";
10
- import Lr, { PopoverMenuScroll as Fr } from "../popover-menu/PopoverMenu.js";
10
+ import Cr, { PopoverMenuScroll as Fr } from "../popover-menu/PopoverMenu.js";
11
11
  import zr from "../spinner/Spinner.js";
12
- import Cr from "../team-avatar/TeamAvatar.js";
13
- import Hr from "../user-avatar/UserAvatar.js";
14
- import { useAnchoredPopupPortal as $r } from "../../hooks/use-anchored-popup-portal.js";
15
- import { useOutsideClose as Or } from "../../hooks/use-outside-close.js";
16
- import { usePopoverTransition as jr } from "../../hooks/use-popover-transition.js";
17
- import { mergeMenuItemProps as Ur } from "../../utils/menuItemProps.js";
18
- import { mergeClassNames as qr } from "../../utils/props.js";
19
- import { toKebab as Gr } from "../../utils/string.js";
12
+ import Hr from "../team-avatar/TeamAvatar.js";
13
+ import $r from "../user-avatar/UserAvatar.js";
14
+ import { useAnchoredPopupPortal as Or } from "../../hooks/use-anchored-popup-portal.js";
15
+ import { useOutsideClose as jr } from "../../hooks/use-outside-close.js";
16
+ import { usePopoverTransition as Ur } from "../../hooks/use-popover-transition.js";
17
+ import { mergeMenuItemProps as qr } from "../../utils/menuItemProps.js";
18
+ import { mergeClassNames as Gr } from "../../utils/props.js";
19
+ import { toKebab as Kr } from "../../utils/string.js";
20
20
  import o from "./Combobox.module.scss.js";
21
- const Le = 280, Kr = {
21
+ const Le = 280, Qr = {
22
22
  small: "small",
23
23
  medium: "medium",
24
24
  large: "large"
25
- }, Qr = {
25
+ }, Xr = {
26
26
  small: "12",
27
27
  medium: "16",
28
28
  large: "16"
29
29
  };
30
- function Xr(n) {
30
+ function Zr(n) {
31
31
  return typeof n == "string" ? `${n} selections` : "Selected";
32
32
  }
33
- function Zr(n) {
33
+ function Wr(n) {
34
34
  return `Create "${n}"`;
35
35
  }
36
36
  function W(n) {
37
37
  return n.kind === "option" && n.option.disabled === !0;
38
38
  }
39
- function Wr(n, v) {
39
+ function Yr(n, v) {
40
40
  return v ? n.label.toLowerCase().includes(v.toLowerCase()) : !0;
41
41
  }
42
- function Yr(n) {
42
+ function Jr(n) {
43
43
  return n == null ? null : Array.isArray(n) ? n[0] ?? null : n === "" ? null : n;
44
44
  }
45
- function Jr(n) {
45
+ function Pr(n) {
46
46
  return n == null ? [] : Array.isArray(n) ? n : n === "" ? [] : [n];
47
47
  }
48
- function Pr(n) {
48
+ function Br(n) {
49
49
  if (n.leadingVisual != null) return n.leadingVisual;
50
50
  if (n.leadingAvatar != null)
51
51
  return /* @__PURE__ */ l(
52
- Hr,
52
+ $r,
53
53
  {
54
54
  src: n.leadingAvatar.src,
55
55
  alt: n.leadingAvatar.alt,
@@ -58,7 +58,7 @@ function Pr(n) {
58
58
  );
59
59
  if (n.leadingTeamAvatar != null)
60
60
  return /* @__PURE__ */ l(
61
- Cr,
61
+ Hr,
62
62
  {
63
63
  src: n.leadingTeamAvatar.src,
64
64
  initials: n.leadingTeamAvatar.initials ?? (n.leadingTeamAvatar.src ? void 0 : Array.from(n.label).slice(0, 2).join("")),
@@ -68,18 +68,18 @@ function Pr(n) {
68
68
  }
69
69
  );
70
70
  }
71
- const yn = wr(function({
71
+ const pn = Mr(function({
72
72
  options: v,
73
- menuItemProps: Fe,
73
+ menuItemProps: Ce,
74
74
  multiple: t = !1,
75
75
  value: be,
76
76
  defaultValue: ve,
77
77
  onChange: j,
78
78
  inputValue: Y,
79
- defaultInputValue: ze = "",
79
+ defaultInputValue: Fe = "",
80
80
  onInputChange: u,
81
81
  label: N,
82
- placeholder: Ce,
82
+ placeholder: ze,
83
83
  leadingIcon: J,
84
84
  size: P = "medium",
85
85
  invalid: he = !1,
@@ -88,98 +88,99 @@ const yn = wr(function({
88
88
  emptyMessage: He = "No results",
89
89
  loading: xe = !1,
90
90
  loadingMessage: $e = "Loading…",
91
- selectedOptions: k,
92
- creatable: E = !1,
91
+ selectedOptions: A,
92
+ creatable: V = !1,
93
93
  onCreateOption: B,
94
- formatCreateLabel: Oe = Zr,
94
+ formatCreateLabel: Oe = Wr,
95
95
  clearable: je = !1,
96
96
  openOnFocus: Ue = !1,
97
- clearLabel: qe = "Clear",
97
+ submitOnEnter: qe = !0,
98
+ clearLabel: Ge = "Clear",
98
99
  clearButtonProps: m,
99
- selectionsLabel: Ge,
100
- listboxLabel: Ke = "Options",
101
- className: Qe = "",
102
- id: Xe,
100
+ selectionsLabel: Ke,
101
+ listboxLabel: Qe = "Options",
102
+ className: Xe = "",
103
+ id: Ze,
103
104
  "aria-label": ge,
104
- "aria-describedby": Ze,
105
- required: We = !1,
105
+ "aria-describedby": We,
106
+ required: Ye = !1,
106
107
  onFocus: ee,
107
108
  onBlur: re,
108
109
  onKeyDown: ne,
109
- portalContainer: Ye = null,
110
- zIndex: Je,
111
- ...Pe
110
+ portalContainer: Je = null,
111
+ zIndex: Pe,
112
+ ...Be
112
113
  }, R) {
113
- const Be = Mr(), te = Xe ?? Be, S = `${te}-listbox`, ae = O(null), _e = O(null), D = O(null), er = d(
114
+ const er = Er(), te = Ze ?? er, S = `${te}-listbox`, ae = O(null), _e = O(null), D = O(null), rr = d(
114
115
  (e) => {
115
116
  D.current = e, typeof R == "function" ? R(e) : R && (R.current = e);
116
117
  },
117
118
  [R]
118
- ), le = be !== void 0, [rr, nr] = I(() => ve !== void 0 ? ve : t ? [] : null), oe = le ? be : rr, h = t ? null : Yr(oe), i = V(
119
- () => t ? Jr(oe) : [],
119
+ ), le = be !== void 0, [nr, tr] = E(() => ve !== void 0 ? ve : t ? [] : null), oe = le ? be : nr, h = t ? null : Jr(oe), i = I(
120
+ () => t ? Pr(oe) : [],
120
121
  [t, oe]
121
- ), b = Y !== void 0, [ie, T] = I(ze), [c, ye] = I(!1), [tr, pe] = I(!1), [x, y] = I(-1), q = O(!1), L = O(null), Ae = d(
122
+ ), b = Y !== void 0, [ie, T] = E(Fe), [c, ye] = E(!1), [ar, pe] = E(!1), [x, y] = E(-1), q = O(!1), L = O(null), ke = d(
122
123
  (e) => {
123
124
  e !== x && (q.current = !0, y(e));
124
125
  },
125
126
  [x]
126
- ), [G, F] = I(null), K = d(
127
- (e) => v.find((r) => r.value === e) ?? (k == null ? void 0 : k.find((r) => r.value === e)) ?? (E ? { value: e, label: e } : void 0),
128
- [v, k, E]
129
- ), Q = V(
127
+ ), [G, C] = E(null), K = d(
128
+ (e) => v.find((r) => r.value === e) ?? (A == null ? void 0 : A.find((r) => r.value === e)) ?? (V ? { value: e, label: e } : void 0),
129
+ [v, A, V]
130
+ ), Q = I(
130
131
  () => h == null ? void 0 : K(h),
131
132
  [K, h]
132
- ), se = b ? Y : t ? ie : G !== null ? G : (Q == null ? void 0 : Q.label) ?? ie, ce = b ? Y : t ? ie : G !== null ? G : "", z = d(
133
+ ), se = b ? Y : t ? ie : G !== null ? G : (Q == null ? void 0 : Q.label) ?? ie, ce = b ? Y : t ? ie : G !== null ? G : "", F = d(
133
134
  (e) => {
134
- b || (T(e), t || F(e)), u == null || u(e);
135
+ b || (T(e), t || C(e)), u == null || u(e);
135
136
  },
136
137
  [b, t, u]
137
138
  ), g = d(
138
139
  (e) => {
139
- le || nr(e), j == null || j(e);
140
+ le || tr(e), j == null || j(e);
140
141
  },
141
142
  [le, j]
142
- ), ke = V(() => {
143
+ ), Ae = I(() => {
143
144
  if (U === !1) return v;
144
- const e = typeof U == "function" ? U : Wr;
145
+ const e = typeof U == "function" ? U : Yr;
145
146
  return v.filter((r) => e(r, ce));
146
- }, [v, U, ce]), C = E ? ce.trim() : "", De = V(() => {
147
- if (C === "") return !1;
148
- const e = C.toLowerCase(), r = (A) => A.toLowerCase() === e;
149
- return [...v, ...k ?? []].some((A) => r(A.label) || r(A.value)) ? !1 : !(t ? i : h != null ? [h] : []).some(r);
147
+ }, [v, U, ce]), z = V ? ce.trim() : "", De = I(() => {
148
+ if (z === "") return !1;
149
+ const e = z.toLowerCase(), r = (k) => k.toLowerCase() === e;
150
+ return [...v, ...A ?? []].some((k) => r(k.label) || r(k.value)) ? !1 : !(t ? i : h != null ? [h] : []).some(r);
150
151
  }, [
151
- C,
152
+ z,
152
153
  v,
153
- k,
154
+ A,
154
155
  t,
155
156
  i,
156
157
  h
157
- ]), s = V(
158
+ ]), s = I(
158
159
  () => [
159
- ...ke.map((e) => ({ kind: "option", option: e })),
160
- ...De ? [{ kind: "create", inputValue: C }] : []
160
+ ...Ae.map((e) => ({ kind: "option", option: e })),
161
+ ...De ? [{ kind: "create", inputValue: z }] : []
161
162
  ],
162
- [ke, De, C]
163
+ [Ae, De, z]
163
164
  ), w = d(
164
165
  (e) => e.kind === "option" ? `${S}-option-${e.option.value}` : `${S}-create`,
165
166
  [S]
166
- ), { mounted: Ne, visible: ar } = jr(c), {
167
- placement: lr,
168
- maxHeight: or,
169
- style: ir,
167
+ ), { mounted: Ne, visible: lr } = Ur(c), {
168
+ placement: or,
169
+ maxHeight: ir,
170
+ style: sr,
170
171
  portalRef: we,
171
- renderPortal: sr
172
- } = $r(_e, Ne, {
172
+ renderPortal: cr
173
+ } = Or(_e, Ne, {
173
174
  preferredHeight: Le,
174
175
  maxHeightCap: Le,
175
- portalContainer: Ye,
176
- zIndex: Je
176
+ portalContainer: Je,
177
+ zIndex: Pe
177
178
  }), p = d(() => {
178
- ye(!1), y(-1), !t && !b && (F(null), T(""));
179
+ ye(!1), y(-1), !t && !b && (C(null), T(""));
179
180
  }, [t, b]), H = d(() => {
180
181
  _ || ye(!0);
181
182
  }, [_]);
182
- Or(ae, c, p, we), de(() => {
183
+ jr(ae, c, p, we), de(() => {
183
184
  c && y((e) => {
184
185
  if (s.length === 0) return -1;
185
186
  if (e >= 0 && e < s.length) return e;
@@ -189,7 +190,7 @@ const yn = wr(function({
189
190
  return r >= 0 ? r : 0;
190
191
  });
191
192
  }, [c, s, t, i, h]);
192
- const cr = d(
193
+ const ur = d(
193
194
  (e) => t ? i.includes(e) : h === e,
194
195
  [t, i, h]
195
196
  ), ue = d(
@@ -198,17 +199,17 @@ const yn = wr(function({
198
199
  if (!e.disabled) {
199
200
  if (t) {
200
201
  const a = i.includes(e.value) ? i.filter((f) => f !== e.value) : [...i, e.value];
201
- g(a), z(""), p(), (r = D.current) == null || r.focus();
202
+ g(a), F(""), p(), (r = D.current) == null || r.focus();
202
203
  return;
203
204
  }
204
- g(e.value), b ? u == null || u(e.label) : (T(""), F(null)), p();
205
+ g(e.value), b ? u == null || u(e.label) : (T(""), C(null)), p();
205
206
  }
206
207
  },
207
208
  [
208
209
  t,
209
210
  i,
210
211
  g,
211
- z,
212
+ F,
212
213
  b,
213
214
  u,
214
215
  p
@@ -217,35 +218,35 @@ const yn = wr(function({
217
218
  (e) => {
218
219
  var r;
219
220
  if (B ? B(e) : g(t ? [...i, e] : e), t) {
220
- z(""), p(), (r = D.current) == null || r.focus();
221
+ F(""), p(), (r = D.current) == null || r.focus();
221
222
  return;
222
223
  }
223
- b ? u == null || u(e) : (T(""), F(null)), p();
224
+ b ? u == null || u(e) : (T(""), C(null)), p();
224
225
  },
225
226
  [
226
227
  B,
227
228
  t,
228
229
  i,
229
230
  g,
230
- z,
231
+ F,
231
232
  b,
232
233
  u,
233
234
  p
234
235
  ]
235
- ), ur = d(
236
+ ), fr = d(
236
237
  (e) => {
237
238
  e.kind === "create" ? fe(e.inputValue) : ue(e.option);
238
239
  },
239
240
  [fe, ue]
240
241
  ), Me = d(() => {
241
242
  var e;
242
- g(null), b ? u == null || u("") : (T(""), F(null)), (e = D.current) == null || e.focus();
243
- }, [g, b, u]), Ie = d(
243
+ g(null), b ? u == null || u("") : (T(""), C(null)), (e = D.current) == null || e.focus();
244
+ }, [g, b, u]), Ee = d(
244
245
  (e) => {
245
246
  t && g(i.filter((r) => r !== e));
246
247
  },
247
248
  [t, i, g]
248
- ), Ve = d(
249
+ ), Ie = d(
249
250
  (e) => {
250
251
  q.current = !1;
251
252
  const r = s.map((a, f) => ({ row: a, i: f })).filter(({ row: a }) => !W(a));
@@ -254,8 +255,8 @@ const yn = wr(function({
254
255
  return;
255
256
  }
256
257
  y((a) => {
257
- const f = r.findIndex(({ i: Z }) => Z === a), A = f < 0 ? e > 0 ? 0 : r.length - 1 : (f + e + r.length) % r.length;
258
- return r[A].i;
258
+ const f = r.findIndex(({ i: Z }) => Z === a), k = f < 0 ? e > 0 ? 0 : r.length - 1 : (f + e + r.length) % r.length;
259
+ return r[k].i;
259
260
  });
260
261
  },
261
262
  [s]
@@ -270,32 +271,32 @@ const yn = wr(function({
270
271
  const e = s[x];
271
272
  e && ((a = (r = document.getElementById(w(e))) == null ? void 0 : r.scrollIntoView) == null || a.call(r, { block: "nearest" }));
272
273
  }, [c, x, s, w]);
273
- const fr = (e) => {
274
+ const dr = (e) => {
274
275
  $();
275
276
  const r = e.target.value;
276
- z(r), c || H(), y(0);
277
+ F(r), c || H(), y(0);
277
278
  }, $ = () => {
278
279
  L.current !== null && (cancelAnimationFrame(L.current), L.current = null);
279
280
  };
280
281
  de(() => $, []);
281
- const dr = () => {
282
+ const mr = () => {
282
283
  pe(!0), Ue && H(), !t && !b && Q && ($(), L.current = requestAnimationFrame(() => {
283
284
  var e;
284
285
  L.current = null, (e = D.current) == null || e.select();
285
286
  }));
286
- }, Ee = (e) => {
287
+ }, Ve = (e) => {
287
288
  var a;
288
289
  const r = e.relatedTarget;
289
290
  r && ((a = ae.current) != null && a.contains(r)) || ($(), pe(!1));
290
- }, mr = (e) => {
291
+ }, br = (e) => {
291
292
  if (!_)
292
293
  switch ($(), e.key) {
293
294
  case "ArrowDown":
294
- e.preventDefault(), c ? Ve(1) : H();
295
+ e.preventDefault(), c ? Ie(1) : H();
295
296
  break;
296
297
  case "ArrowUp":
297
298
  if (e.preventDefault(), c)
298
- Ve(-1);
299
+ Ie(-1);
299
300
  else {
300
301
  for (let r = s.length - 1; r >= 0; r--)
301
302
  if (!W(s[r])) {
@@ -324,36 +325,37 @@ const yn = wr(function({
324
325
  }
325
326
  break;
326
327
  case "Enter":
327
- c && x >= 0 && s[x] && (e.preventDefault(), e.stopPropagation(), ur(s[x]));
328
+ if (e.nativeEvent.isComposing || e.keyCode === 229) break;
329
+ (c || !qe) && (e.preventDefault(), e.stopPropagation()), c && x >= 0 && s[x] && fr(s[x]);
328
330
  break;
329
331
  case "Escape":
330
332
  c && (e.preventDefault(), e.stopPropagation(), p());
331
333
  break;
332
334
  case "Backspace":
333
- t && se === "" && i.length > 0 && (e.preventDefault(), Ie(i[i.length - 1]));
335
+ t && se === "" && i.length > 0 && (e.preventDefault(), Ee(i[i.length - 1]));
334
336
  break;
335
337
  case "Tab":
336
338
  p();
337
339
  break;
338
340
  }
339
- }, br = (e) => {
340
- dr(), ee == null || ee(e);
341
341
  }, vr = (e) => {
342
- Ee(e), re == null || re(e);
342
+ mr(), ee == null || ee(e);
343
343
  }, hr = (e) => {
344
- mr(e), ne == null || ne(e);
344
+ Ve(e), re == null || re(e);
345
345
  }, xr = (e) => {
346
+ br(e), ne == null || ne(e);
347
+ }, gr = (e) => {
346
348
  var r;
347
349
  _ || e.target.closest("[data-chip], [data-combobox-clear]") || (e.target !== D.current && (e.preventDefault(), (r = D.current) == null || r.focus()), c || H());
348
- }, gr = (e) => {
350
+ }, _r = (e) => {
349
351
  e.target.closest(
350
352
  'input, textarea, select, [contenteditable="true"]'
351
353
  ) || e.preventDefault();
352
- }, Re = t ? i.length > 0 : h != null && h !== "", _r = se.length > 0, yr = je && !t && Re && !_, pr = tr || c || Re || _r, Se = x >= 0 ? s[x] : void 0, Ar = Se != null ? w(Se) : void 0, X = V(() => {
354
+ }, Re = t ? i.length > 0 : h != null && h !== "", yr = se.length > 0, pr = je && !t && Re && !_, kr = ar || c || Re || yr, Se = x >= 0 ? s[x] : void 0, Ar = Se != null ? w(Se) : void 0, X = I(() => {
353
355
  if (!t) return [];
354
- if (k == null) {
356
+ if (A == null) {
355
357
  const e = v.filter((a) => i.includes(a.value));
356
- if (!E) return e;
358
+ if (!V) return e;
357
359
  const r = new Set(e.map((a) => a.value));
358
360
  return [
359
361
  ...e,
@@ -363,46 +365,46 @@ const yn = wr(function({
363
365
  return i.map(K).filter((e) => e != null);
364
366
  }, [
365
367
  t,
366
- k,
368
+ A,
367
369
  v,
368
370
  i,
369
- E,
371
+ V,
370
372
  K
371
- ]), kr = o[`combobox--size-${Gr(P)}`], Dr = t && X.length > 0, Nr = [
373
+ ]), Dr = o[`combobox--size-${Kr(P)}`], Nr = t && X.length > 0, wr = [
372
374
  o.combobox,
373
- kr,
375
+ Dr,
374
376
  he ? o["combobox--invalid"] : "",
375
- N != null && pr ? o["combobox--label-floated"] : "",
377
+ N != null && kr ? o["combobox--label-floated"] : "",
376
378
  J != null ? o["combobox--has-leading-icon"] : "",
377
- Dr ? o["combobox--has-chips"] : "",
379
+ Nr ? o["combobox--has-chips"] : "",
378
380
  c ? o["combobox--open"] : "",
379
381
  _ ? o["combobox--disabled"] : "",
380
- Qe
382
+ Xe
381
383
  ].filter(Boolean).join(" ");
382
- return /* @__PURE__ */ M("div", { className: Nr, ref: ae, children: [
384
+ return /* @__PURE__ */ M("div", { className: wr, ref: ae, children: [
383
385
  /* @__PURE__ */ M("div", { className: o.combobox__wrapper, ref: _e, children: [
384
386
  N != null && /* @__PURE__ */ l("label", { className: o.combobox__label, htmlFor: te, children: N }),
385
387
  /* @__PURE__ */ M(
386
388
  "div",
387
389
  {
388
390
  className: o.combobox__inner,
389
- onMouseDown: xr,
391
+ onMouseDown: gr,
390
392
  children: [
391
- J != null && /* @__PURE__ */ l("span", { className: o["combobox__leading-icon"], "aria-hidden": !0, children: /* @__PURE__ */ l(Tr.Provider, { value: { size: "16" }, children: J }) }),
393
+ J != null && /* @__PURE__ */ l("span", { className: o["combobox__leading-icon"], "aria-hidden": !0, children: /* @__PURE__ */ l(Lr.Provider, { value: { size: "16" }, children: J }) }),
392
394
  /* @__PURE__ */ M("div", { className: o.combobox__value, children: [
393
395
  t && X.length > 0 && /* @__PURE__ */ l(
394
- Sr,
396
+ Tr,
395
397
  {
396
- "aria-label": Ge ?? Xr(N),
398
+ "aria-label": Ke ?? Zr(N),
397
399
  disabled: _,
398
400
  children: X.map((e) => /* @__PURE__ */ l(
399
- Rr,
401
+ Sr,
400
402
  {
401
- size: Kr[P],
403
+ size: Qr[P],
402
404
  leadingAvatar: e.leadingAvatar,
403
405
  leadingIcon: e.leadingAvatar == null ? e.leadingVisual : void 0,
404
406
  onRemove: _ ? void 0 : (r) => {
405
- r.stopPropagation(), Ie(e.value);
407
+ r.stopPropagation(), Ee(e.value);
406
408
  },
407
409
  children: e.label
408
410
  },
@@ -413,8 +415,8 @@ const yn = wr(function({
413
415
  /* @__PURE__ */ l(
414
416
  "input",
415
417
  {
416
- ...Pe,
417
- ref: er,
418
+ ...Be,
419
+ ref: rr,
418
420
  id: te,
419
421
  className: o.combobox__control,
420
422
  type: "text",
@@ -422,34 +424,34 @@ const yn = wr(function({
422
424
  autoComplete: "off",
423
425
  spellCheck: !1,
424
426
  disabled: _,
425
- placeholder: t && X.length > 0 ? void 0 : Ce,
427
+ placeholder: t && X.length > 0 ? void 0 : ze,
426
428
  value: se,
427
429
  "aria-label": ge,
428
- "aria-describedby": Ze || void 0,
429
- "aria-required": We ? !0 : void 0,
430
+ "aria-describedby": We || void 0,
431
+ "aria-required": Ye ? !0 : void 0,
430
432
  "aria-invalid": he ? !0 : void 0,
431
433
  "aria-expanded": c,
432
434
  "aria-controls": S,
433
435
  "aria-autocomplete": "list",
434
436
  "aria-activedescendant": Ar,
435
437
  "aria-busy": xe || void 0,
436
- onChange: fr,
437
- onFocus: br,
438
- onBlur: vr,
439
- onKeyDown: hr
438
+ onChange: dr,
439
+ onFocus: vr,
440
+ onBlur: hr,
441
+ onKeyDown: xr
440
442
  }
441
443
  )
442
444
  ] }),
443
- yr && /* @__PURE__ */ l(
445
+ pr && /* @__PURE__ */ l(
444
446
  "button",
445
447
  {
446
448
  ...m,
447
449
  type: "button",
448
- className: qr(
450
+ className: Gr(
449
451
  o.combobox__clear,
450
452
  m == null ? void 0 : m.className
451
453
  ),
452
- "aria-label": qe,
454
+ "aria-label": Ge,
453
455
  "data-combobox-clear": "",
454
456
  onClick: Me,
455
457
  onKeyDown: (e) => {
@@ -458,9 +460,9 @@ const yn = wr(function({
458
460
  },
459
461
  onBlur: (e) => {
460
462
  var r;
461
- (r = m == null ? void 0 : m.onBlur) == null || r.call(m, e), Ee(e);
463
+ (r = m == null ? void 0 : m.onBlur) == null || r.call(m, e), Ve(e);
462
464
  },
463
- children: /* @__PURE__ */ l(me, { size: Qr[P], glyph: /* @__PURE__ */ l(Vr, {}) })
465
+ children: /* @__PURE__ */ l(me, { size: Xr[P], glyph: /* @__PURE__ */ l(Vr, {}) })
464
466
  }
465
467
  ),
466
468
  /* @__PURE__ */ l("span", { className: o["combobox__trailing-icon"], "aria-hidden": !0, children: /* @__PURE__ */ l(me, { size: "12", glyph: /* @__PURE__ */ l(Ir, {}) }) })
@@ -468,7 +470,7 @@ const yn = wr(function({
468
470
  }
469
471
  )
470
472
  ] }),
471
- Ne && sr(
473
+ Ne && cr(
472
474
  // eslint-disable-next-line jsx-a11y/no-static-element-interactions -- keeps focus on the input for presses anywhere in the menu
473
475
  /* @__PURE__ */ l(
474
476
  "div",
@@ -476,12 +478,12 @@ const yn = wr(function({
476
478
  ref: we,
477
479
  className: [
478
480
  o.combobox__popup,
479
- lr === "above" ? o["combobox__popup--above"] : "",
480
- ar ? o["combobox__popup--visible"] : ""
481
+ or === "above" ? o["combobox__popup--above"] : "",
482
+ lr ? o["combobox__popup--visible"] : ""
481
483
  ].filter(Boolean).join(" "),
482
- style: ir,
483
- onMouseDown: gr,
484
- children: /* @__PURE__ */ l(Lr, { className: o.combobox__menu, children: /* @__PURE__ */ M(Fr, { maxHeight: or, children: [
484
+ style: sr,
485
+ onMouseDown: _r,
486
+ children: /* @__PURE__ */ l(Cr, { className: o.combobox__menu, children: /* @__PURE__ */ M(Fr, { maxHeight: ir, children: [
485
487
  s.length > 0 && /* @__PURE__ */ l(
486
488
  "ul",
487
489
  {
@@ -489,7 +491,7 @@ const yn = wr(function({
489
491
  className: o.combobox__list,
490
492
  role: "listbox",
491
493
  "aria-multiselectable": t || void 0,
492
- "aria-label": typeof N == "string" ? N : ge ?? Ke,
494
+ "aria-label": typeof N == "string" ? N : ge ?? Qe,
493
495
  children: s.map((e, r) => {
494
496
  const a = r === x;
495
497
  if (e.kind === "create")
@@ -504,17 +506,17 @@ const yn = wr(function({
504
506
  id: w(e),
505
507
  role: "option",
506
508
  label: Oe(e.inputValue),
507
- leadingVisual: /* @__PURE__ */ l(me, { glyph: /* @__PURE__ */ l(Er, {}) }),
509
+ leadingVisual: /* @__PURE__ */ l(me, { glyph: /* @__PURE__ */ l(Rr, {}) }),
508
510
  active: a,
509
511
  "aria-selected": !1,
510
- onMouseEnter: () => Ae(r),
512
+ onMouseEnter: () => ke(r),
511
513
  onClick: () => fe(e.inputValue)
512
514
  }
513
515
  )
514
516
  },
515
517
  w(e)
516
518
  );
517
- const { option: f } = e, A = cr(f.value), Z = Pr(f);
519
+ const { option: f } = e, k = ur(f.value), Z = Br(f);
518
520
  return /* @__PURE__ */ l(
519
521
  "li",
520
522
  {
@@ -523,8 +525,8 @@ const yn = wr(function({
523
525
  children: /* @__PURE__ */ l(
524
526
  Te,
525
527
  {
526
- ...Ur(
527
- Fe,
528
+ ...qr(
529
+ Ce,
528
530
  f.menuItemProps
529
531
  ),
530
532
  id: w(e),
@@ -533,11 +535,11 @@ const yn = wr(function({
533
535
  secondaryLabel: f.secondaryLabel,
534
536
  leadingElement: Z != null,
535
537
  leadingVisual: Z,
536
- trailingElement: A,
538
+ trailingElement: k,
537
539
  active: a,
538
540
  disabled: f.disabled,
539
- "aria-selected": A,
540
- onMouseEnter: () => Ae(r),
541
+ "aria-selected": k,
542
+ onMouseEnter: () => ke(r),
541
543
  onClick: () => ue(f)
542
544
  }
543
545
  )
@@ -558,6 +560,6 @@ const yn = wr(function({
558
560
  ] });
559
561
  });
560
562
  export {
561
- yn as default
563
+ pn as default
562
564
  };
563
565
  //# sourceMappingURL=Combobox.js.map