asma-ui-core 3.86.1 → 3.87.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/dist/asma-ui-core.css +1 -1
  2. package/dist/components/custom/pathfinder-card/PathfinderCard.js +28 -28
  3. package/dist/components/data-display/chip/StyledChip.js +33 -32
  4. package/dist/components/data-display/tooltip/StyledTooltip.js +76 -47
  5. package/dist/components/feedback/dialog/StyledDialog.js +62 -58
  6. package/dist/components/feedback/minimizable-dialog/MinimizableDialog.js +113 -105
  7. package/dist/components/feedback/minimizable-dialog/components/FullscreenBtn.js +10 -12
  8. package/dist/components/feedback/minimizable-dialog/v2/MinimizableDialogV2.js +75 -67
  9. package/dist/components/feedback/snack-bar/StyledSnackbar.js +12 -10
  10. package/dist/components/feedback/snack-bar/components/StyledInfoSnackbar.js +10 -10
  11. package/dist/components/inputs/dynamic-select/components/DynamicSelectAutocomplete.js +69 -71
  12. package/dist/components/inputs/input-field/StyledInputField.js +25 -24
  13. package/dist/components/inputs/phone-field/CountryCodeOptions.js +16 -15
  14. package/dist/components/inputs/phone-field/CountryCodeSelect.js +98 -85
  15. package/dist/components/inputs/phone-field/useCountryPicker.js +44 -24
  16. package/dist/components/inputs/search-field/StyledSearchField.js +10 -10
  17. package/dist/components/inputs/select/StyledSelect.js +16 -15
  18. package/dist/components/inputs/select/StyledSelectItem.js +9 -9
  19. package/dist/components/inputs/select-autocomplete/StyledSelectAutocomplete.js +202 -175
  20. package/dist/components/inputs/switch/base-ui/StyledSwitch.js +22 -22
  21. package/dist/components/navigation/link/StyledLink.js +8 -8
  22. package/dist/components/navigation/listbox/Listbox.js +105 -54
  23. package/dist/components/navigation/menu/StyledMenu.js +22 -18
  24. package/dist/components/navigation/menu/StyledMenuItem.js +6 -6
  25. package/dist/components/navigation/title-chevron/StyledTitleChevron.js +7 -7
  26. package/dist/components/utils/accordion/base-ui/StyledAccordionDetails.js +26 -22
  27. package/dist/components/utils/accordion/base-ui/StyledAccordionSummary.js +14 -14
  28. package/dist/components/utils/copy-wrapper/CopyWrapper.module.js +2 -2
  29. package/dist/components/utils/popover/StyledPopover.js +102 -52
  30. package/dist/datetime/components/date-picker/StyledDatePicker.js +40 -34
  31. package/dist/datetime/components/date-picker/components/StyledCalendarPicker.js +5 -4
  32. package/dist/datetime/components/time-picker/StyledTimePicker.js +69 -56
  33. package/dist/helpers/focusable.js +5 -0
  34. package/dist/hooks/useFocusTrap.hook.js +24 -19
  35. package/dist/src/components/data-display/chip/StyledChip.d.ts +2 -0
  36. package/dist/src/components/inputs/dynamic-select/StyledDynamicSelect.d.ts +3 -4
  37. package/dist/src/components/inputs/dynamic-select/components/DynamicSelectAutocomplete.test.d.ts +1 -0
  38. package/dist/src/components/inputs/phone-field/CountryCodeOptions.d.ts +1 -1
  39. package/dist/src/components/inputs/phone-field/useCountryPicker.d.ts +5 -2
  40. package/dist/src/components/navigation/listbox/Listbox.d.ts +3 -2
  41. package/dist/src/components/navigation/menu/StyledMenu.d.ts +3 -2
  42. package/dist/src/components/utils/accordion/base-ui/StyledAccordionDetails.d.ts +2 -1
  43. package/dist/src/components/utils/popover/StyledPopover.d.ts +9 -2
  44. package/dist/src/helpers/focusable.d.ts +8 -0
  45. package/dist/src/hooks/useFocusTrap.hook.d.ts +2 -1
  46. package/dist/table/components/columns/action-column/components/RowActionMenu.js +30 -34
  47. package/dist/table/components/table-footer/TablePagination.js +18 -17
  48. package/dist/table/components/table-footer/TableRowCountSelect.js +5 -4
  49. package/package.json +1 -1
  50. package/src/styles/touchHardening.interaction.test.tsx +269 -0
@@ -1,283 +1,310 @@
1
1
  import { cn as E } from "../../../helpers/cn.js";
2
- import { ChevronDownIcon as Qe } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
3
- import { CloseIcon as Xe } from "../../icons/close-icon/CloseIcon.js";
4
- import { CheckIcon as Ze } from "../../icons/check-icon/CheckIcon.js";
5
- import { PlusIconCircle as Ke } from "../../icons/plus-icon-circle/PlusIconCircle.js";
6
- import { StyledChip as et } from "../../data-display/chip/StyledChip.js";
7
- import { StyledCheckbox as te } from "../checkbox/base-ui/StyledCheckbox.js";
8
- import { TOP_LAYER_PROPS as tt, TOP_LAYER_RESET_STYLE as lt, getOpenModalDialogAncestor as rt, shouldUsePopoverTopLayer as st, useTopLayerRef as ot } from "../../../hooks/useTopLayer.hook.js";
9
- import { LoadingIcon as nt } from "../../../table/shared-components/LoadingIcon.js";
10
- import O from "./StyledSelectAutocomplete.module.js";
11
- import { useEffect as le, useMemo as z, useRef as re, useState as D } from "react";
12
- import { jsx as s, jsxs as v } from "react/jsx-runtime";
13
- import { FloatingPortal as at, autoUpdate as it, flip as ct, offset as dt, shift as ut, size as pt, useDismiss as ft, useFloating as mt, useInteractions as ht, useMergeRefs as se, useRole as bt } from "@floating-ui/react";
14
- var gt = (l) => typeof l == "object" && l !== null && "label" in l ? String(l.label) : String(l), xt = (l) => typeof l == "object" && l !== null && "disabled" in l && !!l.disabled;
15
- function Lt({ dataTest: l, options: h, renderInput: oe, value: I, onChange: N, getOptionLabel: ne, getOptionKey: A, isOptionEqualToValue: W, renderOption: H, renderValue: T, filterOptions: _, loading: U, loadingText: ae = "Loading…", noOptionsText: ie = "No options", disabled: C, readOnly: b, error: ce, helperText: de, size: ue = "small", disableClearable: pe, disableCloseOnSelect: fe, popupIcon: me, autoHeight: he, multiple: be, allowSelectAll: ge, selectAllLabel: V = "Select all", fullWidth: xe, classes: we, inputValue: R, onInputChange: ye, open: Y, onOpen: ke, onClose: De, className: ve, wrapperClassName: Ie, getOptionDisabled: Ne, slotProps: q }) {
16
- const o = be === !0, c = ne ?? gt, S = (e, t) => W ? W(e, t) : e === t, [Ae, Ce] = D(!1), n = Y ?? Ae, d = (e) => {
17
- e && (b || C) || (Y === void 0 && Ce(e), e ? ke?.() : (y(null), De?.()));
18
- }, [Re, B] = D(""), g = R ?? Re, P = (e, t, r) => {
19
- R === void 0 && B(t), ye?.(e, t, r);
20
- }, [a, y] = D(null), G = re([]), J = re(null), [Se, Pe] = D(null), [Q, Me] = D(null), u = o ? Array.isArray(I) ? I : [] : [], x = o ? null : I ?? null, X = !o && x !== null ? c(x) : "";
21
- le(() => {
22
- R !== void 0 || o || B(X);
2
+ import { ChevronDownIcon as et } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
3
+ import { CloseIcon as tt } from "../../icons/close-icon/CloseIcon.js";
4
+ import { CheckIcon as lt } from "../../icons/check-icon/CheckIcon.js";
5
+ import { PlusIconCircle as rt } from "../../icons/plus-icon-circle/PlusIconCircle.js";
6
+ import { StyledChip as st } from "../../data-display/chip/StyledChip.js";
7
+ import { StyledCheckbox as ae } from "../checkbox/base-ui/StyledCheckbox.js";
8
+ import { TOP_LAYER_PROPS as ot, TOP_LAYER_RESET_STYLE as nt, getOpenModalDialogAncestor as at, shouldUsePopoverTopLayer as it, useTopLayerRef as ct } from "../../../hooks/useTopLayer.hook.js";
9
+ import { LoadingIcon as dt } from "../../../table/shared-components/LoadingIcon.js";
10
+ import z from "./StyledSelectAutocomplete.module.js";
11
+ import { useEffect as ie, useMemo as W, useRef as ce, useState as D } from "react";
12
+ import { jsx as o, jsxs as I } from "react/jsx-runtime";
13
+ import { FloatingPortal as ut, autoUpdate as pt, flip as ft, offset as mt, shift as ht, size as bt, useDismiss as gt, useFloating as xt, useInteractions as wt, useMergeRefs as de, useRole as yt } from "@floating-ui/react";
14
+ var kt = (l) => typeof l == "object" && l !== null && "label" in l ? String(l.label) : String(l), vt = (l) => typeof l == "object" && l !== null && "disabled" in l && !!l.disabled;
15
+ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, getOptionLabel: pe, getOptionKey: C, isOptionEqualToValue: H, renderOption: U, renderValue: V, filterOptions: _, loading: B, loadingText: fe = "Loading…", noOptionsText: me = "No options", disabled: M, readOnly: g, error: he, helperText: be, size: ge = "small", disableClearable: xe, disableCloseOnSelect: we, popupIcon: ye, autoHeight: ke, multiple: ve, allowSelectAll: T, selectAllLabel: De = "Select all", fullWidth: Ie, classes: Ae, inputValue: R, onInputChange: Ne, open: Y, onOpen: Ce, onClose: Me, className: Re, wrapperClassName: Se, getOptionDisabled: $e, slotProps: q }) {
16
+ const r = ve === !0, d = pe ?? kt, S = (e, t) => H ? H(e, t) : e === t, [Pe, Le] = D(!1), a = Y ?? Pe, u = (e) => {
17
+ e && (g || M) || (Y === void 0 && Le(e), e ? Ce?.() : (x(null), Me?.()));
18
+ }, [Ee, G] = D(""), b = R ?? Ee, $ = (e, t, n) => {
19
+ R === void 0 && G(t), Ne?.(e, t, n);
20
+ }, [s, x] = D(null), J = `${l}-listbox`, Q = ce([]), X = ce(null), [_e, Fe] = D(null), [Z, Oe] = D(null), i = r ? Array.isArray(A) ? A : [] : [], w = r ? null : A ?? null, K = !r && w !== null ? d(w) : "";
21
+ ie(() => {
22
+ R !== void 0 || r || G(K);
23
23
  }, [
24
24
  R,
25
- o,
26
- X
25
+ r,
26
+ K
27
27
  ]);
28
- const F = (e) => o ? u.some((t) => S(e, t)) : x !== null && S(e, x), M = (e) => Ne?.(e) ?? xt(e), Z = z(() => {
29
- const e = [...h];
30
- if (_) return _(e, { inputValue: g });
31
- const t = !o && x !== null ? c(x).toLowerCase() : null;
32
- if (!g || g.toLowerCase() === t) return e;
33
- const r = g.toLowerCase();
34
- return e.filter((p) => c(p).toLowerCase().includes(r));
28
+ const F = (e) => r ? i.some((t) => S(e, t)) : w !== null && S(e, w), P = (e) => $e?.(e) ?? vt(e), ee = W(() => {
29
+ const e = [...p];
30
+ if (_) return _(e, { inputValue: b });
31
+ const t = !r && w !== null ? d(w).toLowerCase() : null;
32
+ if (!b || b.toLowerCase() === t) return e;
33
+ const n = b.toLowerCase();
34
+ return e.filter((m) => d(m).toLowerCase().includes(n));
35
35
  }, [
36
- h,
37
- g,
36
+ p,
37
+ b,
38
38
  _,
39
- I
40
- ]), m = z(() => Z.slice(0, 100), [Z]), i = m.flatMap((e, t) => M(e) ? [] : [t]), k = m.findIndex(F);
41
- le(() => {
42
- if (!n) return;
43
- const e = a ?? k;
39
+ A
40
+ ]), f = W(() => ee.slice(0, 100), [ee]), te = f.flatMap((e, t) => P(e) ? [] : [t]), c = T && r ? [-1, ...te] : te, k = f.findIndex(F);
41
+ ie(() => {
42
+ if (!a) return;
43
+ const e = s ?? k;
44
44
  if (e < 0) return;
45
- const t = requestAnimationFrame(() => G.current[e]?.scrollIntoView({ block: "nearest" }));
45
+ const t = requestAnimationFrame(() => Q.current[e]?.scrollIntoView({ block: "nearest" }));
46
46
  return () => cancelAnimationFrame(t);
47
47
  }, [
48
+ s,
48
49
  a,
49
- n,
50
- Q,
50
+ Z,
51
51
  k
52
52
  ]);
53
- const { refs: L, floatingStyles: Le, context: K } = mt({
54
- open: n,
55
- onOpenChange: d,
53
+ const { refs: L, floatingStyles: je, context: le } = xt({
54
+ open: a,
55
+ onOpenChange: u,
56
56
  placement: "bottom-start",
57
57
  strategy: "fixed",
58
- whileElementsMounted: it,
58
+ whileElementsMounted: pt,
59
59
  middleware: [
60
- dt(0),
61
- ct({ padding: 8 }),
62
- ut({ padding: 8 }),
63
- pt({ apply({ rects: e, availableHeight: t }) {
64
- Pe(e.reference.width), Me(he ? t - 8 : Math.min(t - 8, 320));
60
+ mt(0),
61
+ ft({ padding: 8 }),
62
+ ht({ padding: 8 }),
63
+ bt({ apply({ rects: e, availableHeight: t }) {
64
+ Fe(e.reference.width), Oe(ke ? t - 8 : Math.min(t - 8, 320));
65
65
  } })
66
66
  ]
67
- }), { getReferenceProps: $e, getFloatingProps: Ee, getItemProps: _e } = ht([ft(K), bt(K, { role: "listbox" })]), Fe = se([L.setReference]), ee = z(() => n ? rt(L.reference.current) : void 0, [n, L]), j = st(ee), je = se([ot(L.setFloating, j)]), Oe = (e) => i.includes(k) ? k : i[e === 1 ? 0 : i.length - 1] ?? null, ze = (e) => {
68
- i.length !== 0 && y((t) => {
69
- const r = i.indexOf(t ?? k);
70
- return r === -1 ? i[e === 1 ? 0 : i.length - 1] ?? null : i[Math.min(Math.max(r + e, 0), i.length - 1)] ?? null;
67
+ }), { getReferenceProps: ze, getFloatingProps: We, getItemProps: He } = wt([gt(le), yt(le, { role: "listbox" })]), Ue = de([L.setReference]), re = W(() => a ? at(L.reference.current) : void 0, [a, L]), O = it(re), Ve = de([ct(L.setFloating, O)]), Be = (e) => c.includes(k) ? k : c[e === 1 ? 0 : c.length - 1] ?? null, Te = (e) => {
68
+ c.length !== 0 && x((t) => {
69
+ const n = c.indexOf(t ?? k);
70
+ return n === -1 ? c[e === 1 ? 0 : c.length - 1] ?? null : c[Math.min(Math.max(n + e, 0), c.length - 1)] ?? null;
71
71
  });
72
- }, $ = (e, t, r = !o || !fe) => {
73
- if (o) {
74
- const p = u.some((f) => S(t, f)), w = p ? u.filter((f) => !S(t, f)) : [...u, t];
75
- N?.(e, w, p ? "removeOption" : "selectOption", { option: t }), P(e, "", "reset"), r && d(!1);
72
+ }, v = (e, t, n = !r || !we) => {
73
+ if (r) {
74
+ const m = i.some((h) => S(t, h)), y = m ? i.filter((h) => !S(t, h)) : [...i, t];
75
+ N?.(e, y, m ? "removeOption" : "selectOption", { option: t }), $(e, "", "reset"), n && u(!1);
76
76
  } else
77
- N?.(e, t, "selectOption", { option: t }), P(e, c(t), "reset"), r && d(!1);
78
- }, We = (e) => {
79
- N?.(e, o ? [] : null, "clear", void 0), P(e, "", "clear");
80
- }, He = (e) => {
81
- if (e.key === "Enter" && !n)
82
- e.preventDefault(), d(!0);
83
- else if (e.key === "Enter" && a != null && m[a] != null) {
77
+ N?.(e, t, "selectOption", { option: t }), $(e, d(t), "reset"), n && u(!1);
78
+ }, se = (e) => {
79
+ N?.(e, r ? [] : null, "clear", void 0), $(e, "", "clear");
80
+ }, j = (e) => {
81
+ const t = p.length > 0 && i.length === p.length;
82
+ N?.(e, t ? [] : p, t ? "clear" : "selectOption", void 0);
83
+ }, Ye = (e) => {
84
+ if (e.key === "Backspace" && b === "" && oe) {
85
+ const t = i[i.length - 1];
86
+ r ? t !== void 0 && v(e, t, !1) : se(e);
87
+ } else if (e.key === "Enter" && !a)
88
+ e.preventDefault(), u(!0);
89
+ else if (e.key === "Enter" && s === -1)
90
+ e.preventDefault(), j(e);
91
+ else if (e.key === "Enter" && s != null && f[s] != null) {
84
92
  e.preventDefault();
85
- const t = m[a];
86
- M(t) || $(e, t, !0);
93
+ const t = f[s];
94
+ P(t) || v(e, t, !0);
87
95
  } else if (e.key === "ArrowDown" || e.key === "ArrowUp") {
88
- if (e.preventDefault(), !n) {
89
- y(Oe(e.key === "ArrowDown" ? 1 : -1)), d(!0);
96
+ if (e.preventDefault(), !a) {
97
+ x(Be(e.key === "ArrowDown" ? 1 : -1)), u(!0);
90
98
  return;
91
99
  }
92
- ze(e.key === "ArrowDown" ? 1 : -1);
100
+ Te(e.key === "ArrowDown" ? 1 : -1);
93
101
  } else if (e.key === "Home" || e.key === "End")
94
- e.preventDefault(), y(i[e.key === "Home" ? 0 : i.length - 1] ?? null);
95
- else if (e.key === " " && a != null && m[a] != null) {
102
+ e.preventDefault(), x(c[e.key === "Home" ? 0 : c.length - 1] ?? null);
103
+ else if (e.key === " " && s === -1)
104
+ e.preventDefault(), j(e);
105
+ else if (e.key === " " && s != null && f[s] != null) {
96
106
  e.preventDefault();
97
- const t = m[a];
98
- M(t) || $(e, t, !1);
99
- } else e.key === "Escape" ? (e.preventDefault(), d(!1)) : e.key === "Tab" && d(!1);
100
- }, Te = !pe && !b && !C && (o ? u.length > 0 : x !== null), Ue = (e) => {
101
- e.preventDefault(), !(C || b) && (J.current?.focus(), d(!n));
102
- }, Ve = o ? T ? T(u, ({ index: e }) => ({ "data-index": e })) : u.map((e, t) => /* @__PURE__ */ s(et, {
103
- dataTest: `selected-chip-${c(e)}`,
104
- label: c(e),
105
- readOnly: b,
106
- onDelete: b ? void 0 : (r) => $(r, e)
107
- }, A ? A(e) : `${c(e)}-${t}`)) : void 0, Ye = /* @__PURE__ */ v("span", {
107
+ const t = f[s];
108
+ P(t) || v(e, t, !1);
109
+ } else e.key === "Escape" ? (e.preventDefault(), u(!1)) : e.key === "Tab" && u(!1);
110
+ }, oe = !xe && !g && !M && (r ? i.length > 0 : w !== null);
111
+ let ne;
112
+ a && s != null && (s === -1 || f[s] !== void 0) && (ne = s === -1 ? `${l}-select-all` : `${l}-option-${s}`);
113
+ const qe = (e) => {
114
+ e.preventDefault(), !(M || g) && (X.current?.focus(), u(!a));
115
+ }, Ge = r ? V ? V(i, ({ index: e }) => ({ "data-index": e })) : i.map((e, t) => /* @__PURE__ */ o(st, {
116
+ dataTest: `selected-chip-${d(e)}`,
117
+ label: d(e),
118
+ readOnly: g,
119
+ deleteButtonTabIndex: -1,
120
+ onDelete: g ? void 0 : (n) => v(n, e)
121
+ }, C ? C(e) : `${d(e)}-${t}`)) : void 0, Je = /* @__PURE__ */ I("span", {
108
122
  className: "flex items-center gap-1",
109
123
  children: [
110
- U && /* @__PURE__ */ s(nt, {
124
+ B && /* @__PURE__ */ o(dt, {
111
125
  width: 20,
112
126
  height: 20,
113
127
  className: "animate-spin"
114
128
  }),
115
- Te && /* @__PURE__ */ s("button", {
129
+ oe && /* @__PURE__ */ o("button", {
116
130
  type: "button",
117
131
  tabIndex: -1,
118
132
  "aria-label": "Clear",
119
133
  "data-testid": `${l}-clear`,
120
134
  className: "invisible flex min-h-6 min-w-6 cursor-pointer items-center justify-center rounded-full border-0 bg-delta-50 group-focus-within:visible",
121
135
  onMouseDown: (e) => e.preventDefault(),
122
- onClick: We,
123
- children: /* @__PURE__ */ s(Xe, {
136
+ onClick: se,
137
+ children: /* @__PURE__ */ o(tt, {
124
138
  width: 20,
125
139
  height: 20,
126
140
  className: "text-delta-700"
127
141
  })
128
142
  }),
129
- b ? null : /* @__PURE__ */ s("button", {
143
+ g ? null : /* @__PURE__ */ o("button", {
130
144
  type: "button",
131
145
  tabIndex: -1,
132
146
  "aria-label": "Toggle options",
133
- "aria-expanded": n,
147
+ "aria-expanded": a,
134
148
  "data-testid": `${l}-popup-indicator`,
135
149
  className: "flex cursor-pointer items-center border-0 bg-transparent",
136
150
  onMouseDown: (e) => e.preventDefault(),
137
- onClick: Ue,
138
- children: me ?? (o ? /* @__PURE__ */ s(Ke, {
151
+ onClick: qe,
152
+ children: ye ?? (r ? /* @__PURE__ */ o(rt, {
139
153
  width: 24,
140
154
  height: 24,
141
155
  className: "text-delta-700"
142
- }) : /* @__PURE__ */ s(Qe, {
156
+ }) : /* @__PURE__ */ o(et, {
143
157
  width: 24,
144
158
  height: 24,
145
- className: E(O["select-custom-icon"], n && O["select-custom-icon-open"], "text-delta-700")
159
+ className: E(z["select-custom-icon"], a && z["select-custom-icon-open"], "text-delta-700")
146
160
  }))
147
161
  })
148
162
  ]
149
- }), qe = {
150
- disabled: C,
151
- size: ue,
163
+ }), Qe = {
164
+ disabled: M,
165
+ size: ge,
152
166
  fullWidth: !0,
153
- error: ce,
154
- helperText: de,
155
- value: g,
167
+ error: he,
168
+ helperText: be,
169
+ value: b,
156
170
  onChange: (e) => {
157
- P(e, e.target.value, "input"), n || d(!0);
171
+ x(null), $(e, e.target.value, "input"), a || u(!0);
158
172
  },
159
- onKeyDown: He,
173
+ onKeyDown: Ye,
160
174
  slotProps: {
161
175
  htmlInput: {
162
- ...$e(),
163
- ref: J,
164
- onClick: () => d(!0),
176
+ ...ze(),
177
+ ref: X,
178
+ onClick: () => u(!0),
165
179
  role: "combobox",
166
180
  "aria-autocomplete": "list",
167
- "aria-expanded": n,
168
- "aria-activedescendant": n && a != null ? `${l}-option-${a}` : void 0,
181
+ "aria-expanded": a,
182
+ "aria-controls": a ? J : void 0,
183
+ "aria-activedescendant": ne,
169
184
  autoComplete: "off",
170
- readOnly: b
185
+ readOnly: g
171
186
  },
172
187
  input: {
173
- ref: Fe,
174
- startAdornment: Ve,
175
- endAdornment: Ye
188
+ ref: Ue,
189
+ startAdornment: Ge,
190
+ endAdornment: Je
176
191
  }
177
192
  }
178
- }, Be = E("relative box-border flex min-h-10 cursor-pointer items-center gap-x-3 px-3 py-1.5 text-base text-delta-800", "aria-selected:bg-gama-50 hover:bg-delta-50", "aria-disabled:cursor-default aria-disabled:!bg-transparent aria-disabled:text-delta-300"), Ge = (e, t, r) => {
179
- const { key: p, ...w } = e;
180
- return /* @__PURE__ */ v("li", {
181
- ...w,
193
+ }, Xe = E("asma-pressable", "relative box-border flex min-h-10 cursor-pointer items-center gap-x-3 px-3 py-1.5 text-base text-delta-800", "aria-selected:bg-gama-50 hover:bg-delta-50", "aria-disabled:cursor-default aria-disabled:!bg-transparent aria-disabled:text-delta-300"), Ze = (e, t, n) => {
194
+ const { key: m, ...y } = e;
195
+ return /* @__PURE__ */ I("li", {
196
+ ...y,
182
197
  children: [
183
- e["data-active"] !== void 0 && /* @__PURE__ */ s("span", {
198
+ e["data-active"] !== void 0 && /* @__PURE__ */ o("span", {
184
199
  "aria-hidden": "true",
185
200
  className: "border-l-solid pointer-events-none absolute inset-y-0 left-0 border-l-[3px] border-focus-ring"
186
201
  }),
187
- o ? /* @__PURE__ */ s(te, {
188
- dataTest: `${l}-${c(t)}-checkbox`,
189
- checked: r.selected,
202
+ r ? /* @__PURE__ */ o(ae, {
203
+ dataTest: `${l}-${d(t)}-checkbox`,
204
+ checked: n.selected,
190
205
  size: "small",
191
206
  hideWrapper: !0,
192
207
  decorative: !0
193
- }) : /* @__PURE__ */ s("span", {
208
+ }) : /* @__PURE__ */ o("span", {
194
209
  className: "w-5",
195
- children: r.selected && /* @__PURE__ */ s(Ze, {
210
+ children: n.selected && /* @__PURE__ */ o(lt, {
196
211
  width: 20,
197
212
  height: 20,
198
213
  className: "text-gama-500"
199
214
  })
200
215
  }),
201
- /* @__PURE__ */ s("span", {
216
+ /* @__PURE__ */ o("span", {
202
217
  className: "line-clamp-2 min-w-0 flex-1 break-words",
203
- children: c(t)
218
+ children: d(t)
204
219
  })
205
220
  ]
206
- }, p);
207
- }, Je = (e, t) => {
208
- const r = M(e), p = {
209
- ..._e({
210
- onMouseDown: (f) => f.preventDefault(),
211
- onClick: (f) => {
212
- r || $(f, e);
221
+ }, m);
222
+ }, Ke = (e, t) => {
223
+ const n = P(e), m = {
224
+ ...He({
225
+ onMouseDown: (h) => h.preventDefault(),
226
+ onClick: (h) => {
227
+ n || v(h, e);
213
228
  },
214
- onMouseMove: () => y(null)
229
+ onMouseMove: () => x(null)
215
230
  }),
216
- key: A ? String(A(e)) : `${c(e)}-${t}`,
217
- ref: (f) => {
218
- G.current[t] = f;
231
+ key: C ? String(C(e)) : `${d(e)}-${t}`,
232
+ ref: (h) => {
233
+ Q.current[t] = h;
219
234
  },
220
235
  role: "option",
221
236
  id: `${l}-option-${t}`,
222
237
  "aria-selected": F(e),
223
- "aria-disabled": r || void 0,
224
- "data-active": a === t ? "" : void 0,
225
- className: Be
226
- }, w = {
238
+ "aria-disabled": n || void 0,
239
+ "data-active": s === t ? "" : void 0,
240
+ className: Xe
241
+ }, y = {
227
242
  selected: F(e),
228
243
  index: t,
229
- inputValue: g
244
+ inputValue: b
230
245
  };
231
- return H ? H(p, e, w) : Ge(p, e, w);
246
+ return U ? U(m, e, y) : Ze(m, e, y);
232
247
  };
233
- return /* @__PURE__ */ v("div", {
234
- className: E(O.styledSelectAutocompleteWrapper, !xe && "w-auto", Ie, ve),
235
- children: [oe(qe), n && /* @__PURE__ */ s(at, {
236
- root: ee,
237
- children: /* @__PURE__ */ v("ul", {
238
- ref: je,
239
- ...j ? tt : {},
248
+ return /* @__PURE__ */ I("div", {
249
+ className: E(z.styledSelectAutocompleteWrapper, !Ie && "w-auto", Se, Re),
250
+ children: [ue(Qe), a && /* @__PURE__ */ o(ut, {
251
+ root: re,
252
+ children: /* @__PURE__ */ I("ul", {
253
+ ref: Ve,
254
+ ...O ? ot : {},
240
255
  style: {
241
- ...j ? lt : {},
242
- ...Le,
243
- width: Se ?? void 0,
244
- maxHeight: Q ?? void 0,
256
+ ...O ? nt : {},
257
+ ...je,
258
+ width: _e ?? void 0,
259
+ maxHeight: Z ?? void 0,
245
260
  fontFamily: "Roboto, Helvetica, Arial, sans-serif",
246
261
  ...q?.popper?.style
247
262
  },
248
- ...Ee(),
249
- className: E("z-[1300] m-0 list-none overflow-auto rounded border border-solid border-delta-300 bg-white px-0 py-2 shadow-[0px_2px_4px_0px_rgba(34,33,51,0.15)]", "[&>li:not(:last-child)]:border-0 [&>li:not(:last-child)]:border-b", "[&>li:not(:last-child)]:border-solid [&>li:not(:last-child)]:border-delta-200", we?.listbox, q?.popper?.className),
250
- children: [ge && o && /* @__PURE__ */ v("div", {
251
- role: "group",
252
- className: "flex min-h-12 items-center gap-x-1 border-0 border-b border-solid border-delta-200 px-4 text-sm text-delta-700",
253
- children: [/* @__PURE__ */ s(te, {
254
- dataTest: `${l}-select-all`,
255
- "aria-label": V,
256
- checked: h.length > 0 && u.length === h.length,
257
- size: "small",
258
- hideWrapper: !0,
259
- onChange: (e) => {
260
- e.stopPropagation();
261
- const t = h.length > 0 && u.length === h.length;
262
- N?.(e, t ? [] : h, t ? "clear" : "selectOption", void 0);
263
- }
264
- }), /* @__PURE__ */ s("span", {
265
- className: "flex-1 truncate py-2",
266
- children: V
267
- })]
268
- }), U ? /* @__PURE__ */ s("li", {
263
+ ...We(),
264
+ id: J,
265
+ role: "listbox",
266
+ "aria-multiselectable": r ? !0 : void 0,
267
+ className: E("z-[1300] m-0 list-none overflow-auto rounded border border-solid border-delta-300 bg-white px-0 py-2 shadow-[0px_2px_4px_0px_rgba(34,33,51,0.15)]", "[&>li:not(:last-child)]:border-0 [&>li:not(:last-child)]:border-b", "[&>li:not(:last-child)]:border-solid [&>li:not(:last-child)]:border-delta-200", Ae?.listbox, q?.popper?.className),
268
+ children: [T && r && /* @__PURE__ */ I("li", {
269
+ id: `${l}-select-all`,
270
+ role: "option",
271
+ "aria-selected": p.length > 0 && i.length === p.length,
272
+ "data-active": s === -1 ? "" : void 0,
273
+ tabIndex: -1,
274
+ onMouseDown: (e) => e.preventDefault(),
275
+ onClick: j,
276
+ onMouseMove: () => x(null),
277
+ className: "relative flex min-h-12 cursor-pointer items-center gap-x-1 border-0 border-b border-solid border-delta-200 px-4 text-sm text-delta-700 aria-selected:bg-gama-50 hover:bg-delta-50",
278
+ children: [
279
+ s === -1 && /* @__PURE__ */ o("span", {
280
+ "aria-hidden": "true",
281
+ className: "border-l-solid pointer-events-none absolute inset-y-0 left-0 border-l-[3px] border-focus-ring"
282
+ }),
283
+ /* @__PURE__ */ o(ae, {
284
+ dataTest: `${l}-select-all`,
285
+ checked: p.length > 0 && i.length === p.length,
286
+ size: "small",
287
+ hideWrapper: !0,
288
+ decorative: !0
289
+ }),
290
+ /* @__PURE__ */ o("span", {
291
+ className: "flex-1 truncate py-2",
292
+ children: De
293
+ })
294
+ ]
295
+ }), B ? /* @__PURE__ */ o("li", {
269
296
  role: "presentation",
270
297
  className: "px-3 py-2 text-sm text-delta-600",
271
- children: ae
272
- }) : m.length === 0 ? /* @__PURE__ */ s("li", {
298
+ children: fe
299
+ }) : f.length === 0 ? /* @__PURE__ */ o("li", {
273
300
  role: "presentation",
274
301
  className: "px-3 py-2 text-sm text-delta-600",
275
- children: ie
276
- }) : m.map(Je)]
302
+ children: me
303
+ }) : f.map(Ke)]
277
304
  })
278
305
  })]
279
306
  });
280
307
  }
281
308
  export {
282
- Lt as StyledSelectAutocomplete
309
+ Ft as StyledSelectAutocomplete
283
310
  };
@@ -15,53 +15,53 @@ var B = ({ className: t }) => /* @__PURE__ */ e("svg", {
15
15
  fill: "currentColor",
16
16
  rx: "0.75"
17
17
  })
18
- }), L = ({ width: t = 11, height: n = 11, className: i = "", onClick: c, color: o }) => /* @__PURE__ */ e("svg", {
18
+ }), L = ({ width: t = 11, height: n = 11, className: i = "", onClick: a, color: c }) => /* @__PURE__ */ e("svg", {
19
19
  xmlns: "http://www.w3.org/2000/svg",
20
20
  width: t,
21
21
  height: n,
22
22
  viewBox: "0 0 448 512",
23
23
  className: i,
24
- onClick: c,
25
- style: N(o),
24
+ onClick: a,
25
+ style: N(c),
26
26
  "aria-hidden": "true",
27
27
  focusable: "false",
28
28
  children: /* @__PURE__ */ e("path", {
29
29
  fill: "currentColor",
30
30
  d: "M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7L393.4 105.4c12.5-12.5 32.8-12.5 45.2 0"
31
31
  })
32
- }), z = I(({ checked: t, defaultChecked: n = !1, onChange: i, disabled: c, readOnly: o, required: m, error: f, id: l, dataTest: u, className: v, onClick: w, ...p }, g) => {
33
- const [k, x] = b(n), d = t !== void 0, a = d ? t : k, C = (S) => {
34
- if (o || c) return;
35
- const s = !a;
36
- d || x(s), i?.({ target: {
37
- checked: s,
38
- name: l
39
- } }, s), w?.(S);
32
+ }), z = I(({ checked: t, defaultChecked: n = !1, onChange: i, disabled: a, readOnly: c, required: m, error: f, id: s, dataTest: u, className: v, onClick: w, ...p }, g) => {
33
+ const [k, x] = b(n), d = t !== void 0, o = d ? t : k, C = (S) => {
34
+ if (c || a) return;
35
+ const l = !o;
36
+ d || x(l), i?.({ target: {
37
+ checked: l,
38
+ name: s
39
+ } }, l), w?.(S);
40
40
  }, h = r.iconContent;
41
41
  return /* @__PURE__ */ e("button", {
42
42
  ...p,
43
43
  ref: g,
44
44
  type: "button",
45
45
  role: "switch",
46
- "aria-checked": a,
47
- "aria-readonly": o,
46
+ "aria-checked": o,
47
+ "aria-readonly": c,
48
48
  "aria-required": m,
49
- className: y(r.switch, v),
49
+ className: y(r.switch, "asma-touch-ready asma-hit-area", v),
50
50
  onClick: C,
51
- disabled: c,
52
- id: l,
53
- name: l,
51
+ disabled: a,
52
+ id: s,
53
+ name: s,
54
54
  "data-testid": u,
55
- "data-checked": a ? "" : void 0,
56
- "data-unchecked": a ? void 0 : "",
57
- "data-disabled": c ? "" : void 0,
58
- "data-readonly": o ? "" : void 0,
55
+ "data-checked": o ? "" : void 0,
56
+ "data-unchecked": o ? void 0 : "",
57
+ "data-disabled": a ? "" : void 0,
58
+ "data-readonly": c ? "" : void 0,
59
59
  "data-error": f ? "" : void 0,
60
60
  children: /* @__PURE__ */ e("span", {
61
61
  className: r.thumb,
62
62
  children: /* @__PURE__ */ e("span", {
63
63
  className: r.icon,
64
- children: a ? /* @__PURE__ */ e(L, { className: h }) : /* @__PURE__ */ e(B, { className: h })
64
+ children: o ? /* @__PURE__ */ e(L, { className: h }) : /* @__PURE__ */ e(B, { className: h })
65
65
  })
66
66
  })
67
67
  });
@@ -2,9 +2,9 @@ import e from "./StyledLink.module.js";
2
2
  import t from "clsx";
3
3
  import "react";
4
4
  import { jsxs as i } from "react/jsx-runtime";
5
- var g = ({ href: d, disabled: k, size: m = "large", dataTest: n, reflink: y, className: r, content: a, contentNode: s, ...c }) => {
5
+ var u = ({ href: d, disabled: m, size: k = "large", dataTest: n, reflink: y, className: a, content: r, contentNode: s, ...c }) => {
6
6
  let l = e["styled-link-large"];
7
- switch (m) {
7
+ switch (k) {
8
8
  case "large":
9
9
  l = e["styled-link-large"];
10
10
  break;
@@ -15,19 +15,19 @@ var g = ({ href: d, disabled: k, size: m = "large", dataTest: n, reflink: y, cla
15
15
  l = e["styled-link-xs"];
16
16
  break;
17
17
  }
18
- return k ? /* @__PURE__ */ i("span", {
19
- className: t(e["styled-link"], e["styled-link-disabled"], l, r),
20
- children: [a, s]
18
+ return m ? /* @__PURE__ */ i("span", {
19
+ className: t(e["styled-link"], e["styled-link-disabled"], l, a),
20
+ children: [r, s]
21
21
  }) : /* @__PURE__ */ i("a", {
22
22
  ...c,
23
23
  "data-testid": n,
24
24
  ref: y,
25
25
  href: d,
26
26
  tabIndex: 0,
27
- className: t(e["styled-link"], l, r),
28
- children: [a, s]
27
+ className: t(e["styled-link"], "asma-touch-ready", l, a),
28
+ children: [r, s]
29
29
  });
30
30
  };
31
31
  export {
32
- g as StyledLink
32
+ u as StyledLink
33
33
  };