asma-ui-core 3.87.4 → 3.87.5

package/dist/components/inputs/phone-field/useCountryPicker.js

@@ -1,28 +1,28 @@
 import { useMemo as m, useState as D } from "react";
-function w(a, c) {
+function w(i, c) {
   const o = c.trim();
   if (o.length === 0) return !0;
   const r = o.replace(/^\+/, "").replace(/\D/g, "");
-  return r.length === 0 && !new RegExp("\\p{L}", "u").test(o) || a.name.toLocaleLowerCase().includes(o.toLocaleLowerCase()) ? !0 : r.length > 0 && a.dialCode.startsWith(r);
+  return r.length === 0 && !new RegExp("\\p{L}", "u").test(o) || i.name.toLocaleLowerCase().includes(o.toLocaleLowerCase()) ? !0 : r.length > 0 && i.dialCode.startsWith(r);
 }
-function C({ countries: a, selectedIso2: c, query: o, listId: r, onSelect: v, onDismiss: b }) {
-  const [p, s] = D(null), n = m(() => a.filter((e) => w(e, o)), [a, o]), i = p === null || n.length === 0 ? null : Math.max(n.findIndex((e) => e.iso2 === p), 0), k = (e) => `${r}-option-${e}`, g = (e) => {
+function C({ countries: i, selectedIso2: c, query: o, listId: r, onSelect: b, onDismiss: v }) {
+  const [p, s] = D(null), n = m(() => i.filter((e) => w(e, o)), [i, o]), a = p === null || n.length === 0 ? null : Math.max(n.findIndex((e) => e.iso2 === p), 0), g = (e) => `${r}-option-${e}`, k = (e) => {
     const t = e === 1 ? n[0] : n[n.length - 1], l = n.find((d) => d.iso2 === c) ?? t;
     l !== void 0 && s(l.iso2);
   }, h = (e) => {
     if (n.length === 0) return;
-    const t = n.findIndex((d) => d.iso2 === c), l = n[((i ?? (t >= 0 ? t : e === 1 ? -1 : 0)) + e + n.length) % n.length];
+    const t = n.findIndex((d) => d.iso2 === c), l = n[((a ?? (t >= 0 ? t : e === 1 ? -1 : 0)) + e + n.length) % n.length];
     l !== void 0 && s(l.iso2);
   }, u = (e, t = !0) => {
-    t && s(null), v(e, t);
+    t && s(null), b(e, t);
   }, f = () => {
-    s(null), b();
+    s(null), v();
   };
   return {
     visible: n,
-    activeIndex: i,
-    optionId: k,
-    openWithKeyboard: g,
+    activeIndex: a,
+    optionId: g,
+    openWithKeyboard: k,
     select: u,
     dismiss: f,
     handleKeyDown: (e) => {
@@ -48,18 +48,18 @@ function C({ countries: a, selectedIso2: c, query: o, listId: r, onSelect: v, on
         case " ": {
           if (o !== "") break;
           e.preventDefault();
-          const t = i === null ? void 0 : n[i];
+          const t = a === null ? void 0 : n[a];
           t !== void 0 && u(t.iso2, !1);
           break;
         }
         case "Enter": {
           e.preventDefault();
-          const t = i === null ? void 0 : n[i];
+          const t = a === null ? void 0 : n[a];
           t !== void 0 && u(t.iso2);
           break;
         }
         case "Escape":
-          e.preventDefault(), f();
+          e.preventDefault(), e.stopPropagation(), f();
           break;
         case "Tab":
           f();

package/dist/components/inputs/select-autocomplete/StyledSelectAutocomplete.js

@@ -8,16 +8,16 @@ import { StyledCheckbox as ae } from "../checkbox/base-ui/StyledCheckbox.js";
 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";
 import { LoadingIcon as dt } from "../../../table/shared-components/LoadingIcon.js";
 import z from "./StyledSelectAutocomplete.module.js";
-import { useEffect as ie, useMemo as W, useRef as ce, useState as D } from "react";
+import { useEffect as ie, useMemo as W, useRef as ce, useState as v } from "react";
 import { jsx as o, jsxs as I } from "react/jsx-runtime";
 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";
-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;
-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 }) {
-  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) => {
+var kt = (l) => typeof l == "object" && l !== null && "label" in l ? String(l.label) : String(l), Dt = (l) => typeof l == "object" && l !== null && "disabled" in l && !!l.disabled;
+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: De, allowSelectAll: T, selectAllLabel: ve = "Select all", fullWidth: Ie, classes: Ae, inputValue: R, onInputChange: Ne, open: Y, onOpen: Ce, onClose: Me, className: Re, wrapperClassName: Se, getOptionDisabled: Pe, slotProps: q }) {
+  const r = De === !0, d = pe ?? kt, S = (e, t) => H ? H(e, t) : e === t, [$e, Le] = v(!1), a = Y ?? $e, u = (e) => {
     e && (g || M) || (Y === void 0 && Le(e), e ? Ce?.() : (x(null), Me?.()));
-  }, [Ee, G] = D(""), b = R ?? Ee, $ = (e, t, n) => {
+  }, [Ee, G] = v(""), b = R ?? Ee, P = (e, t, n) => {
     R === void 0 && G(t), Ne?.(e, t, n);
-  }, [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) : "";
+  }, [s, x] = v(null), J = `${l}-listbox`, Q = ce([]), X = ce(null), [_e, Fe] = v(null), [Z, Oe] = v(null), i = r ? Array.isArray(A) ? A : [] : [], w = r ? null : A ?? null, K = !r && w !== null ? d(w) : "";
   ie(() => {
     R !== void 0 || r || G(K);
   }, [
@@ -25,7 +25,7 @@ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, g
     r,
     K
   ]);
-  const F = (e) => r ? i.some((t) => S(e, t)) : w !== null && S(e, w), P = (e) => $e?.(e) ?? vt(e), ee = W(() => {
+  const F = (e) => r ? i.some((t) => S(e, t)) : w !== null && S(e, w), $ = (e) => Pe?.(e) ?? Dt(e), ee = W(() => {
     const e = [...p];
     if (_) return _(e, { inputValue: b });
     const t = !r && w !== null ? d(w).toLowerCase() : null;
@@ -37,7 +37,7 @@ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, g
     b,
     _,
     A
-  ]), 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);
+  ]), f = W(() => ee.slice(0, 100), [ee]), te = f.flatMap((e, t) => $(e) ? [] : [t]), c = T && r ? [-1, ...te] : te, k = f.findIndex(F);
   ie(() => {
     if (!a) return;
     const e = s ?? k;
@@ -69,21 +69,21 @@ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, g
       const n = c.indexOf(t ?? k);
       return n === -1 ? c[e === 1 ? 0 : c.length - 1] ?? null : c[Math.min(Math.max(n + e, 0), c.length - 1)] ?? null;
     });
-  }, v = (e, t, n = !r || !we) => {
+  }, D = (e, t, n = !r || !we) => {
     if (r) {
       const m = i.some((h) => S(t, h)), y = m ? i.filter((h) => !S(t, h)) : [...i, t];
-      N?.(e, y, m ? "removeOption" : "selectOption", { option: t }), $(e, "", "reset"), n && u(!1);
+      N?.(e, y, m ? "removeOption" : "selectOption", { option: t }), P(e, "", "reset"), n && u(!1);
     } else
-      N?.(e, t, "selectOption", { option: t }), $(e, d(t), "reset"), n && u(!1);
+      N?.(e, t, "selectOption", { option: t }), P(e, d(t), "reset"), n && u(!1);
   }, se = (e) => {
-    N?.(e, r ? [] : null, "clear", void 0), $(e, "", "clear");
+    N?.(e, r ? [] : null, "clear", void 0), P(e, "", "clear");
   }, j = (e) => {
     const t = p.length > 0 && i.length === p.length;
     N?.(e, t ? [] : p, t ? "clear" : "selectOption", void 0);
   }, Ye = (e) => {
     if (e.key === "Backspace" && b === "" && oe) {
       const t = i[i.length - 1];
-      r ? t !== void 0 && v(e, t, !1) : se(e);
+      r ? t !== void 0 && D(e, t, !1) : se(e);
     } else if (e.key === "Enter" && !a)
       e.preventDefault(), u(!0);
     else if (e.key === "Enter" && s === -1)
@@ -91,7 +91,7 @@ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, g
     else if (e.key === "Enter" && s != null && f[s] != null) {
       e.preventDefault();
       const t = f[s];
-      P(t) || v(e, t, !0);
+      $(t) || D(e, t, !0);
     } else if (e.key === "ArrowDown" || e.key === "ArrowUp") {
       if (e.preventDefault(), !a) {
         x(Be(e.key === "ArrowDown" ? 1 : -1)), u(!0);
@@ -105,8 +105,8 @@ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, g
     else if (e.key === " " && s != null && f[s] != null) {
       e.preventDefault();
       const t = f[s];
-      P(t) || v(e, t, !1);
-    } else e.key === "Escape" ? (e.preventDefault(), u(!1)) : e.key === "Tab" && u(!1);
+      $(t) || D(e, t, !1);
+    } else e.key === "Escape" && a ? (e.preventDefault(), e.stopPropagation(), u(!1)) : e.key === "Tab" && u(!1);
   }, oe = !xe && !g && !M && (r ? i.length > 0 : w !== null);
   let ne;
   a && s != null && (s === -1 || f[s] !== void 0) && (ne = s === -1 ? `${l}-select-all` : `${l}-option-${s}`);
@@ -117,7 +117,7 @@ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, g
     label: d(e),
     readOnly: g,
     deleteButtonTabIndex: -1,
-    onDelete: g ? void 0 : (n) => v(n, e)
+    onDelete: g ? void 0 : (n) => D(n, e)
   }, C ? C(e) : `${d(e)}-${t}`)) : void 0, Je = /* @__PURE__ */ I("span", {
     className: "flex items-center gap-1",
     children: [
@@ -168,7 +168,7 @@ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, g
     helperText: be,
     value: b,
     onChange: (e) => {
-      x(null), $(e, e.target.value, "input"), a || u(!0);
+      x(null), P(e, e.target.value, "input"), a || u(!0);
     },
     onKeyDown: Ye,
     slotProps: {
@@ -220,11 +220,11 @@ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, g
       ]
     }, m);
   }, Ke = (e, t) => {
-    const n = P(e), m = {
+    const n = $(e), m = {
       ...He({
         onMouseDown: (h) => h.preventDefault(),
         onClick: (h) => {
-          n || v(h, e);
+          n || D(h, e);
         },
         onMouseMove: () => x(null)
       }),
@@ -289,7 +289,7 @@ function Ft({ dataTest: l, options: p, renderInput: ue, value: A, onChange: N, g
             }),
             /* @__PURE__ */ o("span", {
               className: "flex-1 truncate py-2",
-              children: De
+              children: ve
             })
           ]
         }), B ? /* @__PURE__ */ o("li", {

package/dist/datetime/components/date-picker/StyledDatePicker.js

@@ -5,44 +5,44 @@ import { DatePickerInputIndex as y } from "./components/DatePickerInputIndex.js"
 import { useIsMobileView as x } from "../../hooks/useWindowWidthSize.hook.js";
 import { StyledDrawer as b } from "../../../components/navigation/drawer/StyledDrawer.js";
 import { useBackNavigationClose as h } from "../../hooks/useBackNavigationClose.hook.js";
-import { useEffect as C, useState as a } from "react";
-import { Fragment as E, jsx as t, jsxs as w } from "react/jsx-runtime";
-var L = (m) => {
-  const s = x(), [e, i] = a(null), [p, d] = a(!1), [f, c] = a(!1), u = (r) => {
-    i(r.currentTarget), P(r, d);
+import { useEffect as C, useState as s } from "react";
+import { Fragment as D, jsx as t, jsxs as E } from "react/jsx-runtime";
+var L = (p) => {
+  const i = x(), [e, c] = s(null), [m, d] = s(!1), [f, l] = s(!1), u = (r) => {
+    c(r.currentTarget), P(r, d);
   }, o = () => {
-    c(!0), i(null);
+    l(!0), c(null);
   };
   C(() => {
     if (!e) return;
-    const r = (l) => {
-      document.activeElement === e && (l.key === "Escape" || l.key === "Tab") && o();
+    const r = (n) => {
+      document.activeElement === e && (n.key === "Escape" ? (n.preventDefault(), n.stopPropagation(), o()) : n.key === "Tab" && o());
     };
     return document.addEventListener("keydown", r), () => document.removeEventListener("keydown", r);
   }, [e]), h({
     open: !!e,
     onClose: o
   });
-  const n = {
-    ...m,
+  const a = {
+    ...p,
     validateOnCalendarClose: f,
-    onValidatedOnce: () => c(!1)
+    onValidatedOnce: () => l(!1)
   };
-  return /* @__PURE__ */ w(E, { children: [
+  return /* @__PURE__ */ E(D, { children: [
     /* @__PURE__ */ t(y, {
-      datePickerProps: n,
+      datePickerProps: a,
       onClick: u
     }),
-    !s && /* @__PURE__ */ t(v, {
-      datePickerProps: { ...n },
+    !i && /* @__PURE__ */ t(v, {
+      datePickerProps: { ...a },
       popoverProps: {
         open: !!e,
         anchorEl: e,
         onClose: o
       },
-      positionAbove: p
+      positionAbove: m
     }),
-    s && /* @__PURE__ */ t(b, {
+    i && /* @__PURE__ */ t(b, {
       anchor: "bottom",
       open: !!e,
       onClose: o,
@@ -50,7 +50,7 @@ var L = (m) => {
       children: /* @__PURE__ */ t("div", {
         className: "mx-auto max-w-[360px] px-2 pb-[max(1.5rem,env(safe-area-inset-bottom))]",
         children: /* @__PURE__ */ t(k, {
-          datePickerProps: { ...n },
+          datePickerProps: { ...a },
           popoverProps: {
             open: !!e,
             anchorEl: e,

package/dist/datetime/components/time-picker/StyledTimePicker.js

@@ -1,5 +1,5 @@
-import { useIsMobileView as O } from "../../hooks/useWindowWidthSize.hook.js";
-import { StyledDrawer as D } from "../../../components/navigation/drawer/StyledDrawer.js";
+import { useIsMobileView as N } from "../../hooks/useWindowWidthSize.hook.js";
+import { StyledDrawer as O } from "../../../components/navigation/drawer/StyledDrawer.js";
 import { useBackNavigationClose as I } from "../../hooks/useBackNavigationClose.hook.js";
 import { usePopupState as j } from "../../../hooks/usePopupState.js";
 import { ClickAwayListener as A } from "../../../components/mui-compat/ClickAwayListener.js";
@@ -7,97 +7,97 @@ import { TimePickerPanel as B } from "./components/TimePickerPanel.js";
 import { TimePickerPopper as M } from "./TimePickerPopper.js";
 import { getTimeFromValue as S } from "./helpers/getTimeFromValue.js";
 import { TimePickerInput as F } from "./TimePickerInput.js";
-import { useEffect as K, useState as v } from "react";
-import { jsx as o, jsxs as C } from "react/jsx-runtime";
-import { format as y, isBefore as q, isValid as z } from "date-fns";
-var te = (n) => {
-  const { value: a, onSelect: r, notBeforeTime: u } = n, t = j({
+import { useEffect as K, useState as y } from "react";
+import { jsx as r, jsxs as C } from "react/jsx-runtime";
+import { format as k, isBefore as q, isValid as z } from "date-fns";
+var oe = (i) => {
+  const { value: a, onSelect: n, notBeforeTime: u } = i, o = j({
     variant: "popper",
     popupId: "time-picker-popper"
-  }), c = O();
+  }), c = N();
   I({
-    open: c && t.isOpen,
-    onClose: t.close
+    open: c && o.isOpen,
+    onClose: o.close
   });
-  const { isOpen: k, anchorEl: V, close: w } = t;
+  const { isOpen: V, anchorEl: w, close: p } = o;
   K(() => {
-    if (!k || c) return;
-    const e = (i) => {
-      V?.contains(document.activeElement) && (i.key === "Escape" || i.key === "Tab") && w();
+    if (!V || c) return;
+    const e = (t) => {
+      w?.contains(document.activeElement) && (t.key === "Escape" ? (t.preventDefault(), t.stopPropagation(), p()) : t.key === "Tab" && p());
     };
     return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
   }, [
-    k,
     V,
     w,
+    p,
     c
   ]);
-  const E = a ? y(a, "HH:mm") : "", [b, m] = v(E), [g, l] = v(!1), [H, s] = v(!0), p = g ? b : E, f = (e) => !e || !u || !z(u) || !q(e, u), x = p.length === 5 ? S(p, a) : null, L = x ? f(x) : !0, N = (e) => {
-    const i = e.target.value;
-    if (l(!0), m(i), i.length !== 5) {
+  const E = a ? k(a, "HH:mm") : "", [b, m] = y(E), [g, l] = y(!1), [D, s] = y(!0), f = g ? b : E, d = (e) => !e || !u || !z(u) || !q(e, u), x = f.length === 5 ? S(f, a) : null, H = x ? d(x) : !0, L = (e) => {
+    const t = e.target.value;
+    if (l(!0), m(t), t.length !== 5) {
       s(!1);
       return;
     }
-    const h = S(i, a);
-    if (!h) {
-      r(void 0), s(!1);
+    const v = S(t, a);
+    if (!v) {
+      n(void 0), s(!1);
       return;
     }
-    s(!0), f(h) ? (r(h), l(!1), t.close()) : r(void 0);
-  }, T = (e) => {
-    if (s(!0), f(e)) {
-      r(e), m(e ? y(e, "HH:mm") : ""), l(!1);
+    s(!0), d(v) ? (n(v), l(!1), o.close()) : n(void 0);
+  }, P = (e) => {
+    if (s(!0), d(e)) {
+      n(e), m(e ? k(e, "HH:mm") : ""), l(!1);
       return;
     }
-    r(void 0), m(e ? y(e, "HH:mm") : ""), l(!0);
-  }, P = () => {
-    r(void 0), m(""), l(!1), s(!0);
-  }, d = /* @__PURE__ */ o(F, {
-    ...n,
-    popupState: t,
-    localValue: p,
-    isValidTime: H,
-    isValidEndTime: L,
-    handleChange: N
+    n(void 0), m(e ? k(e, "HH:mm") : ""), l(!0);
+  }, T = () => {
+    n(void 0), m(""), l(!1), s(!0);
+  }, h = /* @__PURE__ */ r(F, {
+    ...i,
+    popupState: o,
+    localValue: f,
+    isValidTime: D,
+    isValidEndTime: H,
+    handleChange: L
   });
-  return n.disabled || n.readOnly ? d : c ? /* @__PURE__ */ C("div", {
+  return i.disabled || i.readOnly ? h : c ? /* @__PURE__ */ C("div", {
     className: "relative h-auto w-auto",
-    children: [/* @__PURE__ */ o("div", {
+    children: [/* @__PURE__ */ r("div", {
       className: "m-0 flex h-fit items-center justify-center p-0",
-      children: d
-    }), /* @__PURE__ */ o(D, {
+      children: h
+    }), /* @__PURE__ */ r(O, {
       anchor: "bottom",
-      open: t.isOpen,
-      onClose: t.close,
-      anchorEl: t.anchorEl,
-      children: /* @__PURE__ */ o("div", {
+      open: o.isOpen,
+      onClose: o.close,
+      anchorEl: o.anchorEl,
+      children: /* @__PURE__ */ r("div", {
         className: "mx-auto w-full max-w-[360px] px-4 pb-[max(1rem,env(safe-area-inset-bottom))] pt-2",
-        children: /* @__PURE__ */ o(B, {
-          dataTest: n.dataTest,
+        children: /* @__PURE__ */ r(B, {
+          dataTest: i.dataTest,
           value: a,
-          onSelect: T,
-          handleClear: P,
-          onConfirm: t.close
+          onSelect: P,
+          handleClear: T,
+          onConfirm: o.close
         })
       })
     })]
-  }) : /* @__PURE__ */ o(A, {
+  }) : /* @__PURE__ */ r(A, {
     mouseEvent: "onMouseDown",
-    onClickAway: t.close,
+    onClickAway: o.close,
     children: /* @__PURE__ */ C("div", {
       className: "relative h-auto w-auto",
-      children: [/* @__PURE__ */ o("div", {
+      children: [/* @__PURE__ */ r("div", {
         className: "m-0 flex h-fit items-center justify-center p-0",
-        children: d
-      }), t.isOpen && /* @__PURE__ */ o(M, {
-        ...n,
-        popupState: t,
-        handleClear: P,
-        onSelect: T
+        children: h
+      }), o.isOpen && /* @__PURE__ */ r(M, {
+        ...i,
+        popupState: o,
+        handleClear: T,
+        onSelect: P
       })]
     })
   });
 };
 export {
-  te as StyledTimePicker
+  oe as StyledTimePicker
 };

package/package.json

@@ -3,7 +3,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "version": "3.87.4",
+    "version": "3.87.5",
     "type": "module",
     "sideEffects": [
         "**/*.css",