asma-ui-core 3.80.2 → 3.81.0

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

@@ -5,30 +5,30 @@ import { CheckIcon as Ze } from "../../icons/check-icon/CheckIcon.js";
 import { PlusIconCircle as Ke } from "../../icons/plus-icon-circle/PlusIconCircle.js";
 import { StyledChip as et } from "../../data-display/chip/StyledChip.js";
 import { StyledCheckbox as te } from "../checkbox/base-ui/StyledCheckbox.js";
-import { TOP_LAYER_PROPS as tt, TOP_LAYER_RESET_STYLE as lt, getOpenModalDialogAncestor as rt, shouldUsePopoverTopLayer as ot, useTopLayerRef as st } from "../../../hooks/useTopLayer.hook.js";
+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";
 import { LoadingIcon as nt } from "../../../table/shared-components/LoadingIcon.js";
 import O from "./StyledSelectAutocomplete.module.js";
 import { useEffect as le, useMemo as z, useRef as re, useState as D } from "react";
-import { jsx as o, jsxs as v } from "react/jsx-runtime";
-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 oe, useRole as bt } from "@floating-ui/react";
+import { jsx as s, jsxs as v } from "react/jsx-runtime";
+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";
 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;
-function Lt({ dataTest: l, options: h, renderInput: se, 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 }) {
-  const s = be === !0, c = ne ?? gt, S = (e, t) => W ? W(e, t) : e === t, [Ae, Ce] = D(!1), n = Y ?? Ae, d = (e) => {
+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 }) {
+  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) => {
     e && (b || C) || (Y === void 0 && Ce(e), e ? ke?.() : (y(null), De?.()));
   }, [Re, B] = D(""), g = R ?? Re, P = (e, t, r) => {
     R === void 0 && B(t), ye?.(e, t, r);
-  }, [a, y] = D(null), G = re([]), J = re(null), [Se, Pe] = D(null), [Q, Me] = D(null), u = s ? Array.isArray(I) ? I : [] : [], x = s ? null : I ?? null, X = !s && x !== null ? c(x) : "";
+  }, [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) : "";
   le(() => {
-    R !== void 0 || s || B(X);
+    R !== void 0 || o || B(X);
   }, [
     R,
-    s,
+    o,
     X
   ]);
-  const F = (e) => s ? u.some((t) => S(e, t)) : x !== null && S(e, x), M = (e) => Ne?.(e) ?? xt(e), Z = z(() => {
+  const F = (e) => o ? u.some((t) => S(e, t)) : x !== null && S(e, x), M = (e) => Ne?.(e) ?? xt(e), Z = z(() => {
     const e = [...h];
     if (_) return _(e, { inputValue: g });
-    const t = !s && x !== null ? c(x).toLowerCase() : null;
+    const t = !o && x !== null ? c(x).toLowerCase() : null;
     if (!g || g.toLowerCase() === t) return e;
     const r = g.toLowerCase();
     return e.filter((p) => c(p).toLowerCase().includes(r));
@@ -64,19 +64,19 @@ function Lt({ dataTest: l, options: h, renderInput: se, value: I, onChange: N, g
         Pe(e.reference.width), Me(he ? t - 8 : Math.min(t - 8, 320));
       } })
     ]
-  }), { getReferenceProps: $e, getFloatingProps: Ee, getItemProps: _e } = ht([ft(K), bt(K, { role: "listbox" })]), Fe = oe([L.setReference]), ee = z(() => n ? rt(L.reference.current) : void 0, [n, L]), j = ot(ee), je = oe([st(L.setFloating, j)]), Oe = (e) => i.includes(k) ? k : i[e === 1 ? 0 : i.length - 1] ?? null, ze = (e) => {
+  }), { 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) => {
     i.length !== 0 && y((t) => {
       const r = i.indexOf(t ?? k);
       return r === -1 ? i[e === 1 ? 0 : i.length - 1] ?? null : i[Math.min(Math.max(r + e, 0), i.length - 1)] ?? null;
     });
-  }, $ = (e, t, r = !s || !fe) => {
-    if (s) {
+  }, $ = (e, t, r = !o || !fe) => {
+    if (o) {
       const p = u.some((f) => S(t, f)), w = p ? u.filter((f) => !S(t, f)) : [...u, t];
       N?.(e, w, p ? "removeOption" : "selectOption", { option: t }), P(e, "", "reset"), r && d(!1);
     } else
       N?.(e, t, "selectOption", { option: t }), P(e, c(t), "reset"), r && d(!1);
   }, We = (e) => {
-    N?.(e, s ? [] : null, "clear", void 0), P(e, "", "clear");
+    N?.(e, o ? [] : null, "clear", void 0), P(e, "", "clear");
   }, He = (e) => {
     if (e.key === "Enter" && !n)
       e.preventDefault(), d(!0);
@@ -97,9 +97,9 @@ function Lt({ dataTest: l, options: h, renderInput: se, value: I, onChange: N, g
       const t = m[a];
       M(t) || $(e, t, !1);
     } else e.key === "Escape" ? (e.preventDefault(), d(!1)) : e.key === "Tab" && d(!1);
-  }, Te = !pe && !b && !C && (s ? u.length > 0 : x !== null), Ue = (e) => {
+  }, Te = !pe && !b && !C && (o ? u.length > 0 : x !== null), Ue = (e) => {
     e.preventDefault(), !(C || b) && (J.current?.focus(), d(!n));
-  }, Ve = s ? T ? T(u, ({ index: e }) => ({ "data-index": e })) : u.map((e, t) => /* @__PURE__ */ o(et, {
+  }, Ve = o ? T ? T(u, ({ index: e }) => ({ "data-index": e })) : u.map((e, t) => /* @__PURE__ */ s(et, {
     dataTest: `selected-chip-${c(e)}`,
     label: c(e),
     readOnly: b,
@@ -107,26 +107,26 @@ function Lt({ dataTest: l, options: h, renderInput: se, value: I, onChange: N, g
   }, A ? A(e) : `${c(e)}-${t}`)) : void 0, Ye = /* @__PURE__ */ v("span", {
     className: "flex items-center gap-1",
     children: [
-      U && /* @__PURE__ */ o(nt, {
+      U && /* @__PURE__ */ s(nt, {
         width: 20,
         height: 20,
         className: "animate-spin"
       }),
-      Te && /* @__PURE__ */ o("button", {
+      Te && /* @__PURE__ */ s("button", {
         type: "button",
         tabIndex: -1,
         "aria-label": "Clear",
         "data-testid": `${l}-clear`,
-        className: "flex min-h-6 min-w-6 cursor-pointer items-center justify-center rounded-full border-0 bg-delta-50",
+        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",
         onMouseDown: (e) => e.preventDefault(),
         onClick: We,
-        children: /* @__PURE__ */ o(Xe, {
+        children: /* @__PURE__ */ s(Xe, {
           width: 20,
           height: 20,
           className: "text-delta-700"
         })
       }),
-      b ? null : /* @__PURE__ */ o("button", {
+      b ? null : /* @__PURE__ */ s("button", {
         type: "button",
         tabIndex: -1,
         "aria-label": "Toggle options",
@@ -135,11 +135,11 @@ function Lt({ dataTest: l, options: h, renderInput: se, value: I, onChange: N, g
         className: "flex cursor-pointer items-center border-0 bg-transparent",
         onMouseDown: (e) => e.preventDefault(),
         onClick: Ue,
-        children: me ?? (s ? /* @__PURE__ */ o(Ke, {
+        children: me ?? (o ? /* @__PURE__ */ s(Ke, {
           width: 24,
           height: 24,
           className: "text-delta-700"
-        }) : /* @__PURE__ */ o(Qe, {
+        }) : /* @__PURE__ */ s(Qe, {
           width: 24,
           height: 24,
           className: E(O["select-custom-icon"], n && O["select-custom-icon-open"], "text-delta-700")
@@ -180,25 +180,25 @@ function Lt({ dataTest: l, options: h, renderInput: se, value: I, onChange: N, g
     return /* @__PURE__ */ v("li", {
       ...w,
       children: [
-        e["data-active"] !== void 0 && /* @__PURE__ */ o("span", {
+        e["data-active"] !== void 0 && /* @__PURE__ */ s("span", {
           "aria-hidden": "true",
-          className: "pointer-events-none absolute inset-y-0 left-0 border-l border-solid border-focus-ring"
+          className: "pointer-events-none absolute inset-y-0 left-0 border-l-[4px] border-solid border-focus-ring"
         }),
-        s ? /* @__PURE__ */ o(te, {
+        o ? /* @__PURE__ */ s(te, {
           dataTest: `${l}-${c(t)}-checkbox`,
           checked: r.selected,
           size: "small",
           hideWrapper: !0,
           decorative: !0
-        }) : /* @__PURE__ */ o("span", {
+        }) : /* @__PURE__ */ s("span", {
           className: "w-5",
-          children: r.selected && /* @__PURE__ */ o(Ze, {
+          children: r.selected && /* @__PURE__ */ s(Ze, {
             width: 20,
             height: 20,
             className: "text-gama-500"
           })
         }),
-        /* @__PURE__ */ o("span", {
+        /* @__PURE__ */ s("span", {
           className: "line-clamp-2 min-w-0 flex-1 break-words",
           children: c(t)
         })
@@ -232,7 +232,7 @@ function Lt({ dataTest: l, options: h, renderInput: se, value: I, onChange: N, g
   };
   return /* @__PURE__ */ v("div", {
     className: E(O.styledSelectAutocompleteWrapper, !xe && "w-auto", Ie, ve),
-    children: [se(qe), n && /* @__PURE__ */ o(at, {
+    children: [oe(qe), n && /* @__PURE__ */ s(at, {
       root: ee,
       children: /* @__PURE__ */ v("ul", {
         ref: je,
@@ -247,10 +247,10 @@ function Lt({ dataTest: l, options: h, renderInput: se, value: I, onChange: N, g
         },
         ...Ee(),
         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),
-        children: [ge && s && /* @__PURE__ */ v("div", {
+        children: [ge && o && /* @__PURE__ */ v("div", {
           role: "group",
           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",
-          children: [/* @__PURE__ */ o(te, {
+          children: [/* @__PURE__ */ s(te, {
             dataTest: `${l}-select-all`,
             "aria-label": V,
             checked: h.length > 0 && u.length === h.length,
@@ -261,15 +261,15 @@ function Lt({ dataTest: l, options: h, renderInput: se, value: I, onChange: N, g
               const t = h.length > 0 && u.length === h.length;
               N?.(e, t ? [] : h, t ? "clear" : "selectOption", void 0);
             }
-          }), /* @__PURE__ */ o("span", {
+          }), /* @__PURE__ */ s("span", {
             className: "flex-1 truncate py-2",
             children: V
           })]
-        }), U ? /* @__PURE__ */ o("li", {
+        }), U ? /* @__PURE__ */ s("li", {
           role: "presentation",
           className: "px-3 py-2 text-sm text-delta-600",
           children: ae
-        }) : m.length === 0 ? /* @__PURE__ */ o("li", {
+        }) : m.length === 0 ? /* @__PURE__ */ s("li", {
           role: "presentation",
           className: "px-3 py-2 text-sm text-delta-600",
           children: ie

package/dist/index.js

@@ -227,58 +227,60 @@ import { StyledSwitch as Tp } from "./components/inputs/switch/base-ui/StyledSwi
 import { StyledRadioGroup as Ap } from "./components/inputs/radio-button/base-ui/StyledRadioGroup.js";
 import { StyledLabel as Mp } from "./components/inputs/label/StyledLabel.js";
 import { StyledDynamicSelect as wp } from "./components/inputs/dynamic-select/StyledDynamicSelect.js";
-import { StyledFormControl as Hp } from "./components/miscellaneous/StyledFormControl.js";
-import { defaultDatePickerValidationMessages as xp, useDatePickerValidation as _p } from "./datetime/components/date-picker/hooks/useDatePickerValidation.js";
-import { StyledDrawer as Wp } from "./components/navigation/drawer/StyledDrawer.js";
-import { StyledDatePicker as Vp } from "./datetime/components/date-picker/StyledDatePicker.js";
-import { PopupState as Gp, bindPopover as Xp, bindPopper as qp, bindTrigger as Kp, usePopupState as Qp } from "./hooks/usePopupState.js";
-import { ClickAwayListener as jp } from "./components/mui-compat/ClickAwayListener.js";
-import { Paper as Yp } from "./components/mui-compat/Paper.js";
-import { Stack as of } from "./components/mui-compat/Stack.js";
-import { Container as mf } from "./components/mui-compat/Container.js";
-import { Avatar as ef } from "./components/mui-compat/Avatar.js";
-import { Skeleton as pf } from "./components/mui-compat/Skeleton.js";
-import { FormLabel as cf } from "./components/mui-compat/FormLabel.js";
-import { Fade as If } from "./components/mui-compat/Fade.js";
-import { Popper as df } from "./components/mui-compat/Popper.js";
-import { defaultTimePickerHelperMessages as Sf } from "./datetime/components/time-picker/components/HelperText.js";
-import { StyledTimePicker as yf } from "./datetime/components/time-picker/StyledTimePicker.js";
-import { setMidnightTime as Of, setZeroTime as gf } from "./datetime/helpers/date.helper.js";
-import { StyledFormControlLabel as hf } from "./components/miscellaneous/StyledFormControlLabel.js";
-import { StyledFormHelperText as bf } from "./components/miscellaneous/StyledFormHelperText.js";
-import { StyledInputLabel as Pf } from "./components/miscellaneous/StyledInputLabel.js";
-import { StyledFormGroup as Ff } from "./components/miscellaneous/StyledFormGroup.js";
-import { StyledLink as Rf } from "./components/navigation/link/StyledLink.js";
-import { StyledTab as vf } from "./components/navigation/tabs/StyledTab.js";
-import { StyledTabs as Bf } from "./components/navigation/tabs/StyledTabs.js";
-import { StyledTitleChevron as Nf } from "./components/navigation/title-chevron/StyledTitleChevron.js";
-import { Listbox as _f } from "./components/navigation/listbox/Listbox.js";
-import { StyledAccordion as Wf } from "./components/utils/accordion/base-ui/StyledAccordion.js";
-import { StyledAccordionSummary as Vf } from "./components/utils/accordion/base-ui/StyledAccordionSummary.js";
-import { StyledAccordionDetails as Gf } from "./components/utils/accordion/base-ui/StyledAccordionDetails.js";
-import { ACTIONS_COLUMN_ID as qf, DND_HANDLE_COLUMN_ID as Kf, EXPAND_COLUMN_ID as Qf, INTERNAL_COLUMN_IDS as Zf, SELECT_COLUMN_ID as jf, SHOW_FULL_TEXT_ID as Jf, isCustomAction as Yf } from "./table/types.js";
-import { RowDragHandleCell as oc } from "./table/components/columns/dndHandleColumn.js";
-import { StyledTable as mc } from "./table/components/StyledTableIndex.js";
-import { createColumnHelper as ic } from "./table/index.js";
-import { DynamicToolbarLayoutContext as nc, useDynamicToolbarLayout as pc } from "./components/custom/module/header-layout/DynamicToolbarLayoutContext.js";
-import { StyledFilterButton as cc } from "./components/utils/filter-menu/StyledFilterButton.js";
-import { StyledFilterMenu as Ic } from "./components/utils/filter-menu/StyledFilterMenu.js";
-import { CopyButton as dc } from "./components/utils/copy-wrapper/CopyButton.js";
-import { CopyWrapper as Sc } from "./components/utils/copy-wrapper/CopyWrapper.js";
-import { VirtualList as yc } from "./components/utils/virtual-list/VirtualList.js";
-import { StyledWidgetTitle as Oc } from "./components/custom/widget/widget-title/StyledWidgetTitle.js";
-import { StyledWidgetHeader as Dc } from "./components/custom/widget/widget-header/StyledWidgetHeader.js";
-import { StyledWidget as kc } from "./components/custom/widget/widget/StyledWidget.js";
-import { StyledModuleTitle as Lc } from "./components/custom/module/module-title/StyledModuleTitle.js";
-import { DynamicToolbar as Tc } from "./components/custom/module/header-layout/DynamicToolbar.js";
-import { PageHeader as Ac } from "./components/custom/page/page-header/PageHeader.js";
-import { MinimizableDialog as Mc } from "./components/feedback/minimizable-dialog/MinimizableDialog.js";
-import { MinimizableDialogV2 as wc } from "./components/feedback/minimizable-dialog/v2/MinimizableDialogV2.js";
-import { createDialogStack as Hc } from "./components/feedback/minimizable-dialog/stack/createDialogStack.js";
-import { PathfinderCard as xc } from "./components/custom/pathfinder-card/PathfinderCard.js";
-import { useRouteHeadingFocus as Ec } from "./hooks/useRouteHeadingFocus.js";
+import { StyledLink as Hp } from "./components/navigation/link/StyledLink.js";
+import { StyledPhoneField as xp } from "./components/inputs/phone-field/StyledPhoneField.js";
+import { StyledCountryFlag as Ep } from "./components/inputs/phone-field/StyledCountryFlag.js";
+import { StyledFormControl as Up } from "./components/miscellaneous/StyledFormControl.js";
+import { defaultDatePickerValidationMessages as zp, useDatePickerValidation as Gp } from "./datetime/components/date-picker/hooks/useDatePickerValidation.js";
+import { StyledDrawer as qp } from "./components/navigation/drawer/StyledDrawer.js";
+import { StyledDatePicker as Qp } from "./datetime/components/date-picker/StyledDatePicker.js";
+import { PopupState as jp, bindPopover as Jp, bindPopper as Yp, bindTrigger as $p, usePopupState as of } from "./hooks/usePopupState.js";
+import { ClickAwayListener as mf } from "./components/mui-compat/ClickAwayListener.js";
+import { Paper as ef } from "./components/mui-compat/Paper.js";
+import { Stack as pf } from "./components/mui-compat/Stack.js";
+import { Container as cf } from "./components/mui-compat/Container.js";
+import { Avatar as If } from "./components/mui-compat/Avatar.js";
+import { Skeleton as df } from "./components/mui-compat/Skeleton.js";
+import { FormLabel as Sf } from "./components/mui-compat/FormLabel.js";
+import { Fade as yf } from "./components/mui-compat/Fade.js";
+import { Popper as Of } from "./components/mui-compat/Popper.js";
+import { defaultTimePickerHelperMessages as Df } from "./datetime/components/time-picker/components/HelperText.js";
+import { StyledTimePicker as kf } from "./datetime/components/time-picker/StyledTimePicker.js";
+import { setMidnightTime as Lf, setZeroTime as Pf } from "./datetime/helpers/date.helper.js";
+import { StyledFormControlLabel as Ff } from "./components/miscellaneous/StyledFormControlLabel.js";
+import { StyledFormHelperText as Rf } from "./components/miscellaneous/StyledFormHelperText.js";
+import { StyledInputLabel as vf } from "./components/miscellaneous/StyledInputLabel.js";
+import { StyledFormGroup as Bf } from "./components/miscellaneous/StyledFormGroup.js";
+import { StyledTab as Nf } from "./components/navigation/tabs/StyledTab.js";
+import { StyledTabs as _f } from "./components/navigation/tabs/StyledTabs.js";
+import { StyledTitleChevron as Wf } from "./components/navigation/title-chevron/StyledTitleChevron.js";
+import { Listbox as Vf } from "./components/navigation/listbox/Listbox.js";
+import { StyledAccordion as Gf } from "./components/utils/accordion/base-ui/StyledAccordion.js";
+import { StyledAccordionSummary as qf } from "./components/utils/accordion/base-ui/StyledAccordionSummary.js";
+import { StyledAccordionDetails as Qf } from "./components/utils/accordion/base-ui/StyledAccordionDetails.js";
+import { ACTIONS_COLUMN_ID as jf, DND_HANDLE_COLUMN_ID as Jf, EXPAND_COLUMN_ID as Yf, INTERNAL_COLUMN_IDS as $f, SELECT_COLUMN_ID as oc, SHOW_FULL_TEXT_ID as rc, isCustomAction as mc } from "./table/types.js";
+import { RowDragHandleCell as ic } from "./table/components/columns/dndHandleColumn.js";
+import { StyledTable as nc } from "./table/components/StyledTableIndex.js";
+import { createColumnHelper as fc } from "./table/index.js";
+import { DynamicToolbarLayoutContext as lc, useDynamicToolbarLayout as Ic } from "./components/custom/module/header-layout/DynamicToolbarLayoutContext.js";
+import { StyledFilterButton as dc } from "./components/utils/filter-menu/StyledFilterButton.js";
+import { StyledFilterMenu as Sc } from "./components/utils/filter-menu/StyledFilterMenu.js";
+import { CopyButton as yc } from "./components/utils/copy-wrapper/CopyButton.js";
+import { CopyWrapper as Oc } from "./components/utils/copy-wrapper/CopyWrapper.js";
+import { VirtualList as Dc } from "./components/utils/virtual-list/VirtualList.js";
+import { StyledWidgetTitle as kc } from "./components/custom/widget/widget-title/StyledWidgetTitle.js";
+import { StyledWidgetHeader as Lc } from "./components/custom/widget/widget-header/StyledWidgetHeader.js";
+import { StyledWidget as Tc } from "./components/custom/widget/widget/StyledWidget.js";
+import { StyledModuleTitle as Ac } from "./components/custom/module/module-title/StyledModuleTitle.js";
+import { DynamicToolbar as Mc } from "./components/custom/module/header-layout/DynamicToolbar.js";
+import { PageHeader as wc } from "./components/custom/page/page-header/PageHeader.js";
+import { MinimizableDialog as Hc } from "./components/feedback/minimizable-dialog/MinimizableDialog.js";
+import { MinimizableDialogV2 as xc } from "./components/feedback/minimizable-dialog/v2/MinimizableDialogV2.js";
+import { createDialogStack as Ec } from "./components/feedback/minimizable-dialog/stack/createDialogStack.js";
+import { PathfinderCard as Uc } from "./components/custom/pathfinder-card/PathfinderCard.js";
+import { useRouteHeadingFocus as zc } from "./hooks/useRouteHeadingFocus.js";
 export {
-  qf as ACTIONS_COLUMN_ID,
+  jf as ACTIONS_COLUMN_ID,
   Bn as ACTION_GAP_PX,
   zi as AppRegistrationIcon,
   wo as ArchiveIcon,
@@ -289,7 +291,7 @@ export {
   j as AssignmentIcon,
   Y as AssignmentOutlineIcon,
   wt as AttachFileIcon,
-  ef as Avatar,
+  If as Avatar,
   xm as BackIcon,
   Mi as BackupIcon,
   tm as BadgeIcon,
@@ -317,22 +319,22 @@ export {
   s as ChevronRightIcon,
   Uo as ChevronUpIcon,
   Ui as CircleWarningOutlineIcon,
-  jp as ClickAwayListener,
+  mf as ClickAwayListener,
   Lm as ClockOutlineIcon,
   zo as CloseIcon,
   At as CloudDoneOutlineIcon,
   Mt as CloudIcon,
   Ji as CloudOffOutlineIcon,
   Zr as ConsentsIcon,
-  mf as Container,
+  cf as Container,
   St as ContentCopyIcon,
   Dt as ContentCopyOutlineIcon,
   yt as ContentCutIcon,
   Ot as ContentPasteIcon,
   ri as ConversionPathIcon,
-  dc as CopyButton,
-  Sc as CopyWrapper,
-  Kf as DND_HANDLE_COLUMN_ID,
+  yc as CopyButton,
+  Oc as CopyWrapper,
+  Jf as DND_HANDLE_COLUMN_ID,
   F as DashboardViewIcon,
   R as DashboardViewOutlineIcon,
   cr as DeleteOutlineIcon,
@@ -351,16 +353,16 @@ export {
   Ao as DropUpIcon,
   yr as DvrIcon,
   Ai as DvrIconOutline,
-  Tc as DynamicToolbar,
-  nc as DynamicToolbarLayoutContext,
-  Qf as EXPAND_COLUMN_ID,
+  Mc as DynamicToolbar,
+  lc as DynamicToolbarLayoutContext,
+  Yf as EXPAND_COLUMN_ID,
   Er as EarthIcon,
   ye as EditNotesIcon,
   em as EditSquareIcon,
   tr as EmptyPageIcon,
   Si as EnvelopeIcon,
   Or as ErrorOutlineIcon,
-  If as Fade,
+  yf as Fade,
   Tr as FastCheckOutlineIcon,
   Ti as FileDocIcon,
   De as FileImageIcon,
@@ -373,7 +375,7 @@ export {
   yo as FindReplacePeopleIcon,
   yi as FingerprintIcon,
   Dm as FormIcon,
-  cf as FormLabel,
+  Sf as FormLabel,
   tt as FormatListBulletedIcon,
   et as FormatListBulletedOutlineIcon,
   ti as GraphIcon,
@@ -388,7 +390,7 @@ export {
   de as HistoryToggleOffIcon,
   Me as HubIcon,
   we as HubIconFilled,
-  Zf as INTERNAL_COLUMN_IDS,
+  $f as INTERNAL_COLUMN_IDS,
   Jo as InboxOutboxIcon,
   $o as InboxOutboxOutlineIcon,
   Te as IndeterminateIcon,
@@ -401,7 +403,7 @@ export {
   xr as ListSettingsLineIcon,
   Mr as ListStatusIcon,
   wr as ListViewOutlineIcon,
-  _f as Listbox,
+  Vf as Listbox,
   Ue as LoadCurrentIcon,
   To as LoadingIcon,
   Om as LocationIcon,
@@ -414,8 +416,8 @@ export {
   io as MessageProcessingOutlineIcon,
   rm as MessageReplyIcon,
   Am as MicrosoftOutlookIcon,
-  Mc as MinimizableDialog,
-  wc as MinimizableDialogV2,
+  Hc as MinimizableDialog,
+  xc as MinimizableDialogV2,
   Jr as MinimizeIcon,
   Xe as MoveUpIcon,
   G as NewCalendarIcon,
@@ -426,9 +428,9 @@ export {
   Kt as OutlineCheckboxIconChecked,
   Jt as OutlineCheckboxIconIndeterminate,
   zt as OutlineNotificationsIcon,
-  Ac as PageHeader,
-  Yp as Paper,
-  xc as PathfinderCard,
+  wc as PageHeader,
+  ef as Paper,
+  Uc as PathfinderCard,
   P as PdfIcon,
   zr as PencilOutlineIcon,
   B as PeopleIcon,
@@ -442,8 +444,8 @@ export {
   Sm as PinIcon,
   pm as PlusIcon,
   cm as PlusIconCircle,
-  df as Popper,
-  Gp as PopupState,
+  Of as Popper,
+  jp as PopupState,
   b as QnrIcon,
   kt as RefreshIcon,
   di as RemoveIcon,
@@ -454,11 +456,11 @@ export {
   Ie as ResetSettingsIcon,
   Ee as RocketLaunchIcon,
   ze as RotateAutoIcon,
-  oc as RowDragHandleCell,
+  ic as RowDragHandleCell,
   It as RuleIcon,
   dt as RuleOutlineIcon,
-  jf as SELECT_COLUMN_ID,
-  Jf as SHOW_FULL_TEXT_ID,
+  oc as SELECT_COLUMN_ID,
+  rc as SHOW_FULL_TEXT_ID,
   Ii as SaveIcon,
   Lo as SearchIcon,
   Ht as SendIcon,
@@ -467,46 +469,48 @@ export {
   Lt as SettingsNoteIcon,
   ao as SettingsOutlineIcon,
   Ki as ShareIcon,
-  pf as Skeleton,
+  df as Skeleton,
   te as SmsIcon,
   Jn as SnackbarProvider,
-  of as Stack,
+  pf as Stack,
   un as StyledAIDisclosure,
-  Wf as StyledAccordion,
-  Gf as StyledAccordionDetails,
-  Vf as StyledAccordionSummary,
+  Gf as StyledAccordion,
+  Qf as StyledAccordionDetails,
+  qf as StyledAccordionSummary,
   Zn as StyledAlert,
   f as StyledBadge,
   sn as StyledButton,
   $e as StyledCheckbox,
   Je as StyledChip,
-  Vp as StyledDatePicker,
+  Ep as StyledCountryFlag,
+  Qp as StyledDatePicker,
   Cn as StyledDialog,
   gn as StyledDialogActions,
   hn as StyledDialogContent,
   Un as StyledDialogFooter,
   bn as StyledDialogTitle,
-  Wp as StyledDrawer,
+  qp as StyledDrawer,
   wp as StyledDynamicSelect,
   zn as StyledEmptyPage,
-  cc as StyledFilterButton,
-  Ic as StyledFilterMenu,
+  dc as StyledFilterButton,
+  Sc as StyledFilterMenu,
   Xn as StyledFilteredEmptyState,
-  Hp as StyledFormControl,
-  hf as StyledFormControlLabel,
-  Ff as StyledFormGroup,
-  bf as StyledFormHelperText,
+  Up as StyledFormControl,
+  Ff as StyledFormControlLabel,
+  Bf as StyledFormGroup,
+  Rf as StyledFormHelperText,
   an as StyledFormLabel,
   dp as StyledInputField,
-  Pf as StyledInputLabel,
+  vf as StyledInputLabel,
   tn as StyledInteractiveChip,
   Mp as StyledLabel,
-  Rf as StyledLink,
+  Hp as StyledLink,
   Kn as StyledLoading,
   Rn as StyledMenu,
   vn as StyledMenuItem,
   Fn as StyledMenuList,
-  Lc as StyledModuleTitle,
+  Ac as StyledModuleTitle,
+  xp as StyledPhoneField,
   Pn as StyledPopover,
   rn as StyledRadio,
   Ap as StyledRadioGroup,
@@ -517,17 +521,17 @@ export {
   Lp as StyledSlider,
   $n as StyledSnackbar,
   Tp as StyledSwitch,
-  vf as StyledTab,
-  mc as StyledTable,
-  Bf as StyledTabs,
+  Nf as StyledTab,
+  nc as StyledTable,
+  _f as StyledTabs,
   yp as StyledTextarea,
-  yf as StyledTimePicker,
-  Nf as StyledTitleChevron,
+  kf as StyledTimePicker,
+  Wf as StyledTitleChevron,
   nn as StyledTooltip,
   ln as StyledTypography,
-  kc as StyledWidget,
-  Dc as StyledWidgetHeader,
-  Oc as StyledWidgetTitle,
+  Tc as StyledWidget,
+  Lc as StyledWidgetHeader,
+  kc as StyledWidgetTitle,
   Xt as SyncIcon,
   Zi as SyncSavedLocallyIcon,
   Hr as TextBoxCheckOutlineIcon,
@@ -539,7 +543,7 @@ export {
   Ar as UnknownDocumentOutlineRoundedIcon,
   Km as UnlockIcon,
   Oi as UploadIcon,
-  yc as VirtualList,
+  Dc as VirtualList,
   fn as VirtualizedList,
   re as VisibilityOffOutlineIcon,
   $i as VisibilityOutlineIcon,
@@ -548,18 +552,18 @@ export {
   He as WidgetIcon,
   xe as WidgetIconFilled,
   ym as WorkIcon,
-  Xp as bindPopover,
-  qp as bindPopper,
-  Kp as bindTrigger,
+  Jp as bindPopover,
+  Yp as bindPopper,
+  $p as bindTrigger,
   cp as closeSnackbar,
   m as cn,
-  ic as createColumnHelper,
-  Hc as createDialogStack,
-  xp as defaultDatePickerValidationMessages,
-  Sf as defaultTimePickerHelperMessages,
+  fc as createColumnHelper,
+  Ec as createDialogStack,
+  zp as defaultDatePickerValidationMessages,
+  Df as defaultTimePickerHelperMessages,
   lp as enqueueSnackbar,
   Nn as estimateToolbarActionWidth,
-  Yf as isCustomAction,
+  mc as isCustomAction,
   pp as message,
   i as omit,
   xn as planBulkToolbarActions,
@@ -569,11 +573,11 @@ export {
   tp as processDefaultSnackbar,
   ep as processInfoSnackbar,
   En as resolveToolbarActionWidth,
-  Of as setMidnightTime,
-  gf as setZeroTime,
-  _p as useDatePickerValidation,
-  pc as useDynamicToolbarLayout,
-  Qp as usePopupState,
-  Ec as useRouteHeadingFocus,
+  Lf as setMidnightTime,
+  Pf as setZeroTime,
+  Gp as useDatePickerValidation,
+  Ic as useDynamicToolbarLayout,
+  of as usePopupState,
+  zc as useRouteHeadingFocus,
   Ip as useSnackbar
 };

package/dist/src/components/inputs/phone-field/CountryCodeOptions.d.ts

@@ -0,0 +1,20 @@
+import { PhoneCountryChoice, RenderCountryFlag } from './types';
+export interface CountryCodeOptionsProps {
+    dataTest: string;
+    /** Already filtered — the caller owns the query. */
+    visible: readonly PhoneCountryChoice[];
+    selectedIso2: string;
+    activeIndex: number;
+    optionId: (index: number) => string;
+    onSelect: (iso2: string) => void;
+    listId: string;
+    /** Accessible name for the list. Consumer copy, same string that titles the mobile sheet. */
+    label: string;
+    renderFlag?: RenderCountryFlag;
+    className?: string;
+}
+/**
+ * The country listbox. Presentation only — filtering, the active row and the keyboard live in
+ * [[useCountryPicker]], so the desktop trigger and the mobile sheet render the same list.
+ */
+export declare const CountryCodeOptions: ({ dataTest, visible, selectedIso2, activeIndex, optionId, onSelect, listId, label, renderFlag, className, }: CountryCodeOptionsProps) => JSX.Element;

package/dist/src/components/inputs/phone-field/CountryCodeSelect.d.ts

@@ -0,0 +1,30 @@
+import { PhoneCountryChoice, RenderCountryFlag } from './types';
+export interface CountryCodeSelectProps {
+    dataTest: string;
+    countries: readonly PhoneCountryChoice[];
+    value: string;
+    onChange: (iso2: string) => void;
+    disabled?: boolean;
+    /** Title of the mobile picker sheet; supplied by the consumer — this library ships no copy. */
+    selectCountryLabel: string;
+    /** Placeholder of the mobile sheet's search box. Consumer-supplied. */
+    searchPlaceholder: string;
+    renderFlag?: RenderCountryFlag;
+    /** `id` of the field label, so the trigger inherits the field's accessible name. */
+    labelledBy?: string;
+    /** Surface class shared with the number input so the pair matches. */
+    className?: string;
+}
+/**
+ * Collapsed country trigger (flag + calling code + chevron) and the picker it opens.
+ *
+ * Two presentations, one list and one keyboard contract ([[useCountryPicker]]):
+ *
+ * - **Desktop** — the trigger *is* the combobox. Opening it turns the calling-code slot into an
+ *   input and typing filters the list below, which is what Figma draws (the open trigger carries a
+ *   text cursor, and the menu holds rows only — node 8565:284950 has no search field).
+ * - **Mobile** — a full-screen sheet with its own search box, per node 8699:112423. The break is
+ *   `StyledDialog`'s own `fullScreen ?? isMobile` default (≤743 px), so the two never disagree
+ *   about what "mobile" means.
+ */
+export declare const CountryCodeSelect: ({ dataTest, countries, value, onChange, disabled, selectCountryLabel, searchPlaceholder, renderFlag, labelledBy, className, }: CountryCodeSelectProps) => JSX.Element;