asma-ui-core 3.86.2 → 3.87.0

package/dist/components/custom/pathfinder-card/PathfinderCard.js

@@ -1,4 +1,4 @@
-import { cn as C } from "../../../helpers/cn.js";
+import { cn as b } from "../../../helpers/cn.js";
 import { ChevronDownIcon as j } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
 import { ChevronUpIcon as z } from "../../icons/chevron-up-icon/ChevronUpIcon.js";
 import h from "./Pathfinder.module.js";
@@ -6,32 +6,32 @@ import { useCallback as R, useEffect as M, useLayoutEffect as O, useMemo as y, u
 import { Fragment as D, jsx as e, jsxs as I } from "react/jsx-runtime";
 var _ = typeof window < "u" ? O : M;
 function q() {
-  const [i, n] = x(null), d = R((t) => {
+  const [i, n] = x(null), a = R((t) => {
     n(t);
   }, []), s = R(() => i ? Math.floor(i.getBoundingClientRect().width) : 0, [i]);
   return {
-    ref: d,
+    ref: a,
     width: P(R((t) => {
       if (!i || typeof ResizeObserver > "u") return () => {
       };
-      let a = 0;
+      let d = 0;
       const o = new ResizeObserver(() => {
-        cancelAnimationFrame(a), a = requestAnimationFrame(t);
+        cancelAnimationFrame(d), d = requestAnimationFrame(t);
       });
       return o.observe(i), () => {
-        cancelAnimationFrame(a), o.disconnect();
+        cancelAnimationFrame(d), o.disconnect();
       };
     }, [i]), s, () => 0)
   };
 }
 function A(i) {
-  return [...i].sort((n, d) => {
-    const s = n.order ?? 0, t = d.order ?? 0;
-    return s !== t ? s - t : n.id.localeCompare(d.id);
+  return [...i].sort((n, a) => {
+    const s = n.order ?? 0, t = a.order ?? 0;
+    return s !== t ? s - t : n.id.localeCompare(a.id);
   });
 }
 function K(i) {
-  const { items: n, leadSlot: d, actionSlot: s } = i, t = k({}), a = k(null), o = k(null), [l, v] = x({
+  const { items: n, leadSlot: a, actionSlot: s } = i, t = k({}), d = k(null), o = k(null), [l, v] = x({
     itemWidths: {},
     leadWidth: 0,
     actionWidth: 0
@@ -48,7 +48,7 @@ function K(i) {
       const w = t.current[u.id], N = Math.ceil(w?.getBoundingClientRect().width ?? u.estimatedWidth ?? 0);
       r[u.id] = N;
     }
-    const m = d ? Math.ceil(a.current?.getBoundingClientRect().width ?? 0) : 0, g = s ? Math.ceil(o.current?.getBoundingClientRect().width ?? 0) : 0, W = f.current;
+    const m = a ? Math.ceil(d.current?.getBoundingClientRect().width ?? 0) : 0, g = s ? Math.ceil(o.current?.getBoundingClientRect().width ?? 0) : 0, W = f.current;
     (!(Object.keys(W.itemWidths).length === Object.keys(r).length && n.every((u) => W.itemWidths[u.id] === r[u.id])) || W.leadWidth !== m || W.actionWidth !== g) && v({
       itemWidths: r,
       leadWidth: m,
@@ -56,29 +56,29 @@ function K(i) {
     });
   }, [
     n,
-    d,
+    a,
     s
   ]), {
     measurements: l,
     registerItemRef: p,
-    leadRef: a,
+    leadRef: d,
     actionRef: o
   };
 }
 function U(i) {
-  const { items: n, availableWidth: d, gapPx: s, itemWidths: t } = i, a = [];
+  const { items: n, availableWidth: a, gapPx: s, itemWidths: t } = i, d = [];
   let o = 0;
   for (const l of A(n)) {
-    const v = Math.max(0, t[l.id] ?? l.estimatedWidth ?? 0), f = a.length === 0 ? v : o + s + v;
-    if (f > d) break;
-    a.push(l), o = f;
+    const v = Math.max(0, t[l.id] ?? l.estimatedWidth ?? 0), f = d.length === 0 ? v : o + s + v;
+    if (f > a) break;
+    d.push(l), o = f;
   }
-  return a;
+  return d;
 }
-function b({ item: i, compact: n }) {
+function C({ item: i, compact: n }) {
   return /* @__PURE__ */ e(D, { children: i.render({ compact: n }) });
 }
-function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot: t, className: a, leadReservePx: o = 140, actionReservePx: l = 44 }) {
+function Y({ items: i, expanded: n, onToggleExpanded: a, leadSlot: s, actionSlot: t, className: d, leadReservePx: o = 140, actionReservePx: l = 44 }) {
   const { ref: v, width: f } = q(), p = !n, r = y(() => A(i), [i]), { measurements: m, registerItemRef: g, leadRef: W, actionRef: u } = K({
     items: r,
     leadSlot: s,
@@ -104,27 +104,27 @@ function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot
   ]), N = p && w.length < Math.min(2, r.length), E = N ? r.slice(0, 2) : w;
   return /* @__PURE__ */ I("div", {
     ref: v,
-    className: C(h.root, p ? "overflow-hidden" : "overflow-visible", a),
+    className: b(h.root, "asma-pressable", p ? "overflow-hidden" : "overflow-visible", d),
     "aria-expanded": n,
     role: "button",
     tabIndex: 0,
-    onClick: d,
+    onClick: a,
     onKeyDown: (c) => {
-      (c.key === "Enter" || c.key === " ") && (c.preventDefault(), d());
+      (c.key === "Enter" || c.key === " ") && (c.preventDefault(), a());
     },
     children: [
       /* @__PURE__ */ I("div", {
-        className: C(h.shell, p ? h.shellCompact : h.shellExpanded),
+        className: b(h.shell, p ? h.shellCompact : h.shellExpanded),
         children: [s ? /* @__PURE__ */ e("div", {
           className: "shrink-0",
           children: s
         }) : null, /* @__PURE__ */ e("div", {
           className: h.content,
           children: p ? /* @__PURE__ */ e("div", {
-            className: C(h.compactItems, N && h.compactItemsStacked),
+            className: b(h.compactItems, N && h.compactItemsStacked),
             children: E.map((c) => /* @__PURE__ */ e("div", {
               className: "shrink-0 whitespace-nowrap",
-              children: /* @__PURE__ */ e(b, {
+              children: /* @__PURE__ */ e(C, {
                 item: c,
                 compact: p
               })
@@ -133,7 +133,7 @@ function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot
             className: h.expandedItems,
             children: [r.map((c) => /* @__PURE__ */ e("div", {
               className: "shrink-0 whitespace-nowrap",
-              children: /* @__PURE__ */ e(b, {
+              children: /* @__PURE__ */ e(C, {
                 item: c,
                 compact: p
               })
@@ -168,7 +168,7 @@ function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot
             r.map((c) => /* @__PURE__ */ e("div", {
               ref: g(c.id),
               className: "shrink-0 whitespace-nowrap",
-              children: /* @__PURE__ */ e(b, {
+              children: /* @__PURE__ */ e(C, {
                 item: c,
                 compact: !0
               })

package/dist/components/data-display/chip/StyledChip.js

@@ -6,8 +6,8 @@ import { getChipPadding as U } from "./chipPadding.js";
 import q from "./StyledChip.module.js";
 import { forwardRef as A } from "react";
 import { jsx as m, jsxs as F } from "react/jsx-runtime";
-var O = A(({ dataTest: g, label: c, size: r = "medium", disabled: t, readOnly: o, clickable: b, icon: w, avatar: u, deleteIcon: _, onDelete: l, onClick: p, onMouseDown: k, onMouseUp: y, className: h, classes: a, sx: S, tabIndex: v, deleteButtonTabIndex: j, "aria-label": C, role: s, "aria-checked": R, "aria-readonly": B, "data-hovered": D, "data-focus": I, variant: G, color: H }, M) => {
-  const n = !o && !t && (!!b || !!p), f = u ?? w, d = U(r, !!f, !!(l && !o)), N = {
+var O = A(({ dataTest: u, label: c, size: r = "medium", disabled: t, readOnly: o, clickable: b, icon: w, avatar: g, deleteIcon: y, onDelete: l, onClick: p, onMouseDown: _, onMouseUp: k, className: h, classes: a, sx: S, tabIndex: v, deleteButtonTabIndex: j, "aria-label": C, role: s, "aria-checked": R, "aria-readonly": B, "data-hovered": D, "data-focus": I, variant: G, color: H }, M) => {
+  const n = !o && !t && (!!b || !!p), f = g ?? w, d = U(r, !!f, !!(l && !o)), N = {
     paddingTop: d.top,
     paddingRight: d.right,
     paddingBottom: d.bottom,
@@ -19,7 +19,7 @@ var O = A(({ dataTest: g, label: c, size: r = "medium", disabled: t, readOnly: o
   }, W = x(h, "width"), $ = x(h, "max-width");
   return /* @__PURE__ */ F("div", {
     ref: M,
-    "data-testid": g,
+    "data-testid": u,
     "aria-label": C,
     "data-hovered": D,
     "data-focus": I,
@@ -29,16 +29,16 @@ var O = A(({ dataTest: g, label: c, size: r = "medium", disabled: t, readOnly: o
     tabIndex: o || t ? void 0 : n ? v ?? 0 : v,
     onClick: t || o ? void 0 : p,
     onKeyDown: t || o ? void 0 : P,
-    onMouseDown: t || o ? void 0 : k,
-    onMouseUp: t || o ? void 0 : y,
-    className: i("box-border inline-flex items-center gap-1 rounded-[25px] border border-solid border-delta-300 bg-white text-base text-delta-700", !W && "w-fit", !$ && "max-w-full", r === "small" ? "h-6" : "h-8", o && "pointer-events-none", t && "pointer-events-none opacity-[0.38]", n && i("cursor-pointer outline-none", "data-[hovered]:border-gama-200 data-[hovered]:bg-gama-25 hover:border-gama-200 hover:bg-gama-25", "active:!border-gama-400 active:bg-gama-25 active:shadow-[0_0_0_2px_var(--colors-gama-400)]"), q["focus-ring"], a?.root, h),
+    onMouseDown: t || o ? void 0 : _,
+    onMouseUp: t || o ? void 0 : k,
+    className: i("box-border inline-flex items-center gap-1 rounded-[25px] border border-solid border-delta-300 bg-white text-base text-delta-700", !W && "w-fit", !$ && "max-w-full", r === "small" ? "h-6" : "h-8", o && "pointer-events-none", t && "pointer-events-none opacity-[0.38]", n && i("cursor-pointer outline-none", "asma-touch-ready", "data-[hovered]:border-gama-200 data-[hovered]:bg-gama-25 hover:border-gama-200 hover:bg-gama-25", "active:!border-gama-400 active:bg-gama-25 active:shadow-[0_0_0_2px_var(--colors-gama-400)]"), q["focus-ring"], a?.root, h),
     style: {
       ...N,
       ...E(S)
     },
     children: [
       f && /* @__PURE__ */ m("span", {
-        className: i("flex shrink-0 items-center justify-center", r === "small" ? "h-[18px] w-[18px]" : "h-6 w-6", u ? a?.avatar : a?.icon),
+        className: i("flex shrink-0 items-center justify-center", r === "small" ? "h-[18px] w-[18px]" : "h-6 w-6", g ? a?.avatar : a?.icon),
         children: f
       }),
       /* @__PURE__ */ m("span", {
@@ -48,12 +48,12 @@ var O = A(({ dataTest: g, label: c, size: r = "medium", disabled: t, readOnly: o
       l && !o && /* @__PURE__ */ m("button", {
         type: "button",
         tabIndex: j,
-        "data-testid": `${g}-delete`,
+        "data-testid": `${u}-delete`,
         "aria-label": typeof c == "string" ? `Remove ${c}` : "Remove",
         onClick: K,
         disabled: t,
         className: i("flex shrink-0 items-center justify-center rounded-full border border-solid border-delta-100 bg-delta-50 p-0 text-delta-700 [outline:none]", r === "small" ? "h-[18px] w-[18px]" : "h-5 w-5", a?.deleteIcon),
-        children: _ ?? /* @__PURE__ */ m(L, {
+        children: y ?? /* @__PURE__ */ m(L, {
           height: r === "small" ? 14 : 16,
           width: r === "small" ? 14 : 16,
           className: "min-w-0 shrink-0"

package/dist/components/feedback/snack-bar/components/StyledInfoSnackbar.js

@@ -2,22 +2,22 @@ import { omit as m } from "../../../../helpers/omit.js";
 import { LoadingIcon as d } from "../../../icons/loading-icon/LoadingIcon.js";
 import { CloseIcon as p } from "../../../icons/close-icon/CloseIcon.js";
 import u from "clsx";
-import { forwardRef as f } from "react";
-import { jsx as r, jsxs as g } from "react/jsx-runtime";
-import { SnackbarContent as h, useSnackbar as b } from "notistack";
-var I = f((t, e) => {
-  const { id: i, message: o, closeButton: n, type: a, ...s } = m(t, [
+import { forwardRef as h } from "react";
+import { jsx as r, jsxs as f } from "react/jsx-runtime";
+import { SnackbarContent as g, useSnackbar as b } from "notistack";
+var I = h((t, e) => {
+  const { id: i, message: o, closeButton: a, type: n, ...s } = m(t, [
     "anchorOrigin",
     "autoHideDuration",
     "hideIconVariant",
     "iconVariant",
     "persist"
-  ]), { closeSnackbar: c } = b(), l = a === "loading";
-  return /* @__PURE__ */ r(h, {
+  ]), { closeSnackbar: c } = b(), l = n === "loading";
+  return /* @__PURE__ */ r(g, {
     ref: e,
     role: "alert",
     ...s,
-    children: /* @__PURE__ */ g("div", {
+    children: /* @__PURE__ */ f("div", {
       className: u("flex w-full items-center justify-center gap-1"),
       children: [
         l ? /* @__PURE__ */ r(d, {
@@ -28,9 +28,9 @@ var I = f((t, e) => {
           className: typeof o == "string" || typeof o == "number" ? "pl-1 pr-2" : void 0,
           children: o
         }),
-        n ? /* @__PURE__ */ r("button", {
+        a ? /* @__PURE__ */ r("button", {
           "aria-label": "Close",
-          className: "grid size-8 cursor-pointer place-items-center rounded border-0 bg-transparent text-white transition-colors duration-300 ease-in-out hover:bg-gama-500 active:bg-gama-500",
+          className: "asma-touch-ready grid size-8 cursor-pointer place-items-center rounded border-0 bg-transparent text-white transition-colors duration-300 ease-in-out hover:bg-gama-500 active:bg-gama-500",
           onClick: () => c(i),
           type: "button",
           children: /* @__PURE__ */ r(p, {

package/dist/components/inputs/input-field/StyledInputField.js

@@ -9,8 +9,8 @@ import S from "./StyledInputField.module.js";
 import { Children as at, useCallback as st, useId as rt, useLayoutEffect as Z, useRef as q, useState as D } from "react";
 import { jsx as o, jsxs as y } from "react/jsx-runtime";
 import { useMergeRefs as O } from "@floating-ui/react";
-var Mt = ({ dataTest: u, label: l, value: h, defaultValue: b, onChange: ee, onBlur: te, onFocus: ne, error: c, helperText: E, reserveHelperText: oe, expandHelperText: ie = !0, disabled: s, readOnly: n, required: v, allowClear: le, onClear: ae, type: se = "text", placeholder: re, name: de, id: ce, autoComplete: pe, autoFocus: ue, multiline: r, rows: N, minRows: H, maxRows: C, size: he = "medium", fullWidth: me, className: ge, style: fe, sx: xe, inputRef: Se, slotProps: t, InputProps: P, onKeyDown: T, onClick: ye, variant: dt }) => {
-  const be = rt(), R = ce ?? be, $ = `${R}-helper-text`, j = q(null), z = q(null), [He, Ie] = D(void 0), [I, K] = D(!1), [Le, U] = D(b != null && b !== ""), A = h !== void 0, V = A ? h !== "" && h != null : Le, ve = !!s || !!n, w = t?.input?.startAdornment ?? P?.startAdornment, m = at.count(w) > 0, d = m && Array.isArray(w), g = t?.input?.endAdornment ?? P?.endAdornment, _ = !!(le && V && !ve), { ref: Ne, ...i } = t?.htmlInput ?? {}, Ce = Se ?? Ne, { className: Re, style: B, ref: Ae } = t?.input ?? {}, we = O([Ae]), _e = t?.input?.onMouseDown, W = t?.input?.onClick, Be = W ? { onClick: W } : {}, Fe = pe ?? i.autoComplete, Me = de ?? i.name, L = I || V || m, ke = (e) => {
+var Mt = ({ dataTest: m, label: l, value: u, defaultValue: b, onChange: ee, onBlur: te, onFocus: ne, error: c, helperText: E, reserveHelperText: oe, expandHelperText: ie = !0, disabled: s, readOnly: n, required: v, allowClear: le, onClear: ae, type: se = "text", placeholder: re, name: de, id: ce, autoComplete: pe, autoFocus: me, multiline: r, rows: N, minRows: H, maxRows: C, size: ue = "medium", fullWidth: he, className: ge, style: fe, sx: xe, inputRef: Se, slotProps: t, InputProps: P, onKeyDown: T, onClick: ye, variant: dt }) => {
+  const be = rt(), R = ce ?? be, $ = `${R}-helper-text`, j = q(null), z = q(null), [He, Ie] = D(void 0), [I, K] = D(!1), [Le, U] = D(b != null && b !== ""), A = u !== void 0, V = A ? u !== "" && u != null : Le, ve = !!s || !!n, w = t?.input?.startAdornment ?? P?.startAdornment, h = at.count(w) > 0, d = h && Array.isArray(w), g = t?.input?.endAdornment ?? P?.endAdornment, _ = !!(le && V && !ve), { ref: Ne, ...i } = t?.htmlInput ?? {}, Ce = Se ?? Ne, { className: Re, style: B, ref: Ae } = t?.input ?? {}, we = O([Ae]), _e = t?.input?.onMouseDown, W = t?.input?.onClick, Be = W ? { onClick: W } : {}, Fe = pe ?? i.autoComplete, Me = de ?? i.name, L = I || V || h, ke = (e) => {
     n || (A || U(e.target.value !== ""), ee?.(e));
   }, De = (e) => {
     !s && !n && K(!0), ne?.(e);
@@ -29,11 +29,11 @@ var Mt = ({ dataTest: u, label: l, value: h, defaultValue: b, onChange: ee, onBl
     H,
     r,
     N,
-    h
+    u
   ]);
   const Y = O([Ce, st((e) => {
     j.current = e instanceof HTMLTextAreaElement ? e : null;
-  }, [])]), { style: F, ...Pe } = i, f = !r && !d, { height: ct, minHeight: pt, maxHeight: ut, paddingTop: ht, paddingBottom: mt, ...Te } = B ?? {}, $e = f ? {
+  }, [])]), { style: F, ...Pe } = i, f = !r && !d, { height: ct, minHeight: pt, maxHeight: mt, paddingTop: ut, paddingBottom: ht, ...Te } = B ?? {}, $e = f ? {
     ...Te,
     ...lt()
   } : d ? {
@@ -43,7 +43,7 @@ var Mt = ({ dataTest: u, label: l, value: h, defaultValue: b, onChange: ee, onBl
   } : B, { height: gt, minHeight: ft, maxHeight: xt, paddingTop: St, paddingBottom: yt, paddingLeft: bt, paddingRight: je, ...ze } = F ?? {}, Ke = f ? {
     ...ze,
     ...it({
-      paddingLeft: m ? 40 : 14,
+      paddingLeft: h ? 40 : 14,
       paddingRight: je ?? He ?? (_ || g ? 40 : 14)
     })
   } : F;
@@ -62,8 +62,8 @@ var Mt = ({ dataTest: u, label: l, value: h, defaultValue: b, onChange: ee, onBl
     readOnly: n,
     required: v,
     autoComplete: Fe,
-    autoFocus: ue,
-    value: h,
+    autoFocus: me,
+    value: u,
     defaultValue: b,
     "aria-invalid": c ? !0 : void 0,
     "aria-label": i["aria-label"] ?? (i["aria-labelledby"] ? void 0 : typeof l == "string" && l !== "" ? l : void 0),
@@ -75,7 +75,7 @@ var Mt = ({ dataTest: u, label: l, value: h, defaultValue: b, onChange: ee, onBl
       T?.(e), e.defaultPrevented || i.onKeyDown?.(e);
     } : void 0
   }, J = a(S.Input, "peer border-0 bg-transparent text-base tracking-[0.00938em] text-delta-800 outline-none placeholder:text-delta-500", d ? "box-border h-8 min-w-[60px] flex-1 py-0 pl-0 pr-0 leading-[23px]" : r ? "w-full resize-none overflow-hidden p-0 pl-0 pr-0 leading-[23px]" : a("w-full", S["Input--singleLine"]), "disabled:text-delta-300", n && "text-delta-800", Re), Je = !r && !d ? {
-    "data-start-adornment": m ? "true" : void 0,
+    "data-start-adornment": h ? "true" : void 0,
     "data-end-adornment": _ || g ? "true" : void 0
   } : {};
   return /* @__PURE__ */ y("div", {
@@ -83,7 +83,7 @@ var Mt = ({ dataTest: u, label: l, value: h, defaultValue: b, onChange: ee, onBl
     className: a("group relative inline-flex flex-col", ge),
     onClick: ye,
     style: {
-      width: me ? "100%" : 235,
+      width: he ? "100%" : 235,
       fontFamily: "Roboto, Helvetica, Arial, sans-serif",
       letterSpacing: "0.00938em",
       ...k(xe),
@@ -97,23 +97,23 @@ var Mt = ({ dataTest: u, label: l, value: h, defaultValue: b, onChange: ee, onBl
         onMouseDown: _e,
         ...Be,
         style: $e,
-        "data-testid": d ? `${u}-adornment-list` : `${u}-shell`,
+        "data-testid": d ? `${m}-adornment-list` : `${m}-shell`,
         children: [
-          m && /* @__PURE__ */ o("span", {
+          h && /* @__PURE__ */ o("span", {
             className: a("items-center text-delta-500", d ? "contents" : "absolute left-3 flex"),
             children: w
           }),
           r ? /* @__PURE__ */ o("textarea", {
             ...G,
             ref: Y,
-            "data-testid": u,
+            "data-testid": m,
             rows: N ?? H ?? 2,
             className: J
           }) : /* @__PURE__ */ o("input", {
             ...G,
             ...Je,
             ref: Y,
-            "data-testid": u,
+            "data-testid": m,
             type: se,
             className: J
           }),
@@ -121,8 +121,8 @@ var Mt = ({ dataTest: u, label: l, value: h, defaultValue: b, onChange: ee, onBl
             type: "button",
             tabIndex: -1,
             "aria-label": "Clear",
-            "data-testid": `${u}-clear`,
-            className: "absolute right-4 z-40 flex items-center justify-center rounded-full border-0 bg-transparent p-[2px] duration-300 hover:bg-gama-100",
+            "data-testid": `${m}-clear`,
+            className: "asma-pressable absolute right-4 z-40 flex items-center justify-center rounded-full border-0 bg-transparent p-[2px] duration-300 hover:bg-gama-100",
             onClick: (e) => {
               e.stopPropagation(), e.preventDefault(), A || U(!1), ae?.();
             },
@@ -170,7 +170,7 @@ var Mt = ({ dataTest: u, label: l, value: h, defaultValue: b, onChange: ee, onBl
           error: c,
           disabled: s,
           readOnly: n,
-          size: he
+          size: ue
         }), t?.inputLabel?.className),
         style: {
           ...k(t?.inputLabel?.sx),

package/dist/components/inputs/search-field/StyledSearchField.js

@@ -4,8 +4,8 @@ import { CloseIcon as f } from "../../icons/close-icon/CloseIcon.js";
 import { StyledInputField as v } from "../input-field/StyledInputField.js";
 import { useState as y } from "react";
 import { jsx as t } from "react/jsx-runtime";
-var F = ({ value: r, onClear: d, label: a, onFocus: c, onBlur: h, slotProps: o, ...n }) => {
-  const [m, l] = y(!1), i = m || r, s = typeof a == "string" ? a : void 0;
+var F = ({ value: r, onClear: d, label: i, onFocus: c, onBlur: h, slotProps: o, ...a }) => {
+  const [m, l] = y(!1), n = m || r, s = typeof i == "string" ? i : void 0;
   return /* @__PURE__ */ t("div", {
     className: "relative w-full",
     children: /* @__PURE__ */ t(v, {
@@ -13,8 +13,8 @@ var F = ({ value: r, onClear: d, label: a, onFocus: c, onBlur: h, slotProps: o,
       variant: "outlined",
       value: r,
       reserveHelperText: !1,
-      label: i ? a : void 0,
-      placeholder: i ? void 0 : s,
+      label: n ? i : void 0,
+      placeholder: n ? void 0 : s,
       onFocus: (e) => {
         l(!0), c?.(e);
       },
@@ -24,7 +24,7 @@ var F = ({ value: r, onClear: d, label: a, onFocus: c, onBlur: h, slotProps: o,
       slotProps: {
         ...o,
         htmlInput: {
-          "aria-label": i ? void 0 : s,
+          "aria-label": n ? void 0 : s,
           ...o?.htmlInput,
           style: {
             overflow: "hidden",
@@ -39,7 +39,7 @@ var F = ({ value: r, onClear: d, label: a, onFocus: c, onBlur: h, slotProps: o,
             type: "button",
             "aria-label": "Clear",
             "data-testid": "styled-search-clear-icon",
-            className: p("cursor-pointer rounded-full border-0 bg-delta-50", "flex items-center justify-center", "transform-gpu transition-all duration-300 ease-in-out", r ? "scale-100 opacity-100" : "pointer-events-none scale-75 opacity-0", n.readOnly && "-translate-x-[6.5px]"),
+            className: p("asma-pressable", "cursor-pointer rounded-full border-0 bg-delta-50", "flex items-center justify-center", "transform-gpu transition-all duration-300 ease-in-out", r ? "scale-100 opacity-100" : "pointer-events-none scale-75 opacity-0", a.readOnly && "-translate-x-[6.5px]"),
             style: {
               width: 24,
               height: 24,
@@ -55,7 +55,7 @@ var F = ({ value: r, onClear: d, label: a, onFocus: c, onBlur: h, slotProps: o,
               className: "pointer-events-none"
             })
           }) : null,
-          startAdornment: i ? void 0 : /* @__PURE__ */ t("span", {
+          startAdornment: n ? void 0 : /* @__PURE__ */ t("span", {
             "data-testid": "styled-search-icon",
             className: "flex items-center",
             children: /* @__PURE__ */ t(u, {
@@ -68,10 +68,10 @@ var F = ({ value: r, onClear: d, label: a, onFocus: c, onBlur: h, slotProps: o,
           ...o?.input
         }
       },
-      ...n,
+      ...a,
       sx: {
-        width: n.fullWidth ? "100%" : "var(--dynamic-toolbar-search-width, 160px)",
-        ...n.sx
+        width: a.fullWidth ? "100%" : "var(--dynamic-toolbar-search-width, 160px)",
+        ...a.sx
       }
     })
   });

package/dist/components/inputs/select/StyledSelect.js

@@ -134,7 +134,7 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
           I(!1), ye?.(e);
         },
         style: { minWidth: i && !R ? 105 : void 0 },
-        className: y("relative flex w-full items-center justify-between text-left outline-none", "h-10 rounded-lg border-0 px-3 text-base transition-colors", H ? "bg-gama-50" : "bg-transparent", Te, R && "min-w-0", n && "cursor-not-allowed", c && "pointer-events-none"),
+        className: y("relative flex w-full items-center justify-between text-left outline-none", "h-10 rounded-lg border-0 px-3 text-base transition-colors", "asma-touch-ready", H ? "bg-gama-50" : "bg-transparent", Te, R && "min-w-0", n && "cursor-not-allowed", c && "pointer-events-none"),
         children: [
           /* @__PURE__ */ l("span", {
             className: y("min-w-0 flex-1 truncate", !i && "text-delta-500"),

package/dist/components/inputs/select/StyledSelectItem.js

@@ -1,15 +1,15 @@
 import { cn as c } from "../../../helpers/cn.js";
-import { CheckIcon as d } from "../../icons/check-icon/CheckIcon.js";
-import { jsx as e, jsxs as m } from "react/jsx-runtime";
-var f = ({ id: r, children: o, selected: t, active: l, disabled: a, className: n, onClick: i }) => /* @__PURE__ */ m("li", {
+import { CheckIcon as m } from "../../icons/check-icon/CheckIcon.js";
+import { jsx as e, jsxs as d } from "react/jsx-runtime";
+var f = ({ id: r, children: o, selected: t, active: l, disabled: a, className: s, onClick: n }) => /* @__PURE__ */ d("li", {
   id: r,
   role: "option",
   "aria-selected": !!t,
   "aria-disabled": a ? !0 : void 0,
   tabIndex: -1,
-  onMouseDown: (s) => s.preventDefault(),
-  onClick: a ? void 0 : i,
-  className: c("relative flex items-center gap-1 px-2 py-2.5 text-base outline-none", a ? "cursor-not-allowed text-delta-300" : "cursor-pointer text-delta-800 hover:bg-delta-50", t && "bg-gama-50", n),
+  onMouseDown: (i) => i.preventDefault(),
+  onClick: a ? void 0 : n,
+  className: c("asma-pressable", "relative flex items-center gap-1 px-2 py-2.5 text-base outline-none", a ? "cursor-not-allowed text-delta-300" : "cursor-pointer text-delta-800 hover:bg-delta-50", t && "bg-gama-50", s),
   children: [
     l && /* @__PURE__ */ e("span", {
       "aria-hidden": "true",
@@ -18,7 +18,7 @@ var f = ({ id: r, children: o, selected: t, active: l, disabled: a, className: n
     }),
     /* @__PURE__ */ e("span", {
       className: "flex w-6 justify-center",
-      children: t && /* @__PURE__ */ e(d, {
+      children: t && /* @__PURE__ */ e(m, {
         width: 22,
         height: 22,
         className: "text-gama-500"