@sberbusiness/triplex-next 0.1.9 → 0.10.0

package/components/Dropdown/desktop/DropdownList.js

@@ -1,97 +1,82 @@
-import "react/jsx-runtime";
-import "react";
-import "../../../chunks/DropdownListItem-CW2MmFpw.js";
-import "../../../utils/keyboard.js";
-import "../DropdownListContext.js";
-import "../../../chunks/vendor-CF2m175I.js";
-import "../../Alert/AlertContext/AlertContext.js";
-import "../../Alert/AlertProcess/AlertProcess.js";
-import "../../Alert/AlertTypeUtils.js";
-import { c as Po } from "../../../chunks/index-CAZEh1iw.js";
-import "../../Button/ButtonBase.js";
-import "../../Button/ButtonIcon.js";
-import "../../Col/Col.js";
-import "../../Checkbox/Checkbox.js";
-import "../../Checkbox/CheckboxXGroup.js";
-import "../../Checkbox/CheckboxYGroup.js";
-import "../../FormField/FormFieldContext.js";
-import "../../FormField/components/FormFieldDescription.js";
-import "../../FormField/components/FormFieldCounter.js";
-import "../../FormField/components/FormFieldLabel.js";
-import "../../FormField/components/FormFieldClear.js";
-import "../../../chunks/FormFieldInput-C2qWOLr3.js";
-import "../../FormField/components/FormFieldPostfix.js";
-import "../../FormField/components/FormFieldPrefix.js";
-import "../../FormField/components/FormFieldTextarea.js";
-import "../../FormGroup/FormGroup.js";
-import "../../Gap/Gap.js";
-import "../../Link/Link.js";
-import "../../Loader/LoaderSmall/LoaderSmall.js";
+import { jsxs as y, jsx as h } from "react/jsx-runtime";
+import l, { useContext as B, useRef as b, useState as z, useEffect as f } from "react";
+import { c as _ } from "../../../chunks/vendor-BlJo2ILB.js";
+import { s as C, D as x } from "../../../chunks/DropdownListItem-lbLsbKwC.js";
+import { EVENT_KEY_CODES as w } from "../../../utils/keyboard.js";
+import { DropdownListContext as V } from "../DropdownListContext.js";
+import { LoaderSmall as W } from "../../Loader/LoaderSmall/LoaderSmall.js";
+import { ELoaderSmallTheme as j } from "../../Loader/LoaderSmall/enum.js";
 import "../../Loader/LoaderMiddle/LoaderMiddle.js";
-import "../../LoaderWidget/LoaderWidget.js";
-import "../../Radio/Radio.js";
-import "../../Radio/RadioXGroup.js";
-import "../../Radio/RadioYGroup.js";
-import "../../Row/Row.js";
-import "../../TabsExtended/TabsExtended.js";
-import "../../DesignTokens/DesignTokensComponents.js";
-import "../../DesignTokens/DesignTokensComponentsThemeDark.js";
-import "../../ThemeProvider/ThemeProviderContext.js";
-import "../../Typography/Title.js";
-import "../../Typography/Text.js";
-import "../../Typography/Caption.js";
-import "../mobile/DropdownMobile.js";
-import "../mobile/DropdownMobileBody.js";
-import "../mobile/DropdownMobileClose.js";
-import "../mobile/DropdownMobileFooter.js";
-import "../mobile/DropdownMobileHeader.js";
-import "../mobile/DropdownMobileInner.js";
-import "../mobile/DropdownMobileInput.js";
-import "../mobile/DropdownMobileList.js";
-import "../mobile/DropdownMobileListItem.js";
-import "../enums.js";
-import "../../List/List.js";
-import "../../List/ListSortable.js";
-import "../../List/components/ListItem.js";
-import "../../List/components/ListItemControls.js";
-import "../../List/components/ListItemContent.js";
-import "../../../chunks/ListItemControlsButton-BtMEMrGK.js";
-import "../../List/components/ListEmptyState.js";
-import "../../List/components/ListItemLoading.js";
-import "../../List/components/ListItemSelectable.js";
-import "../../List/components/ListItemTailLeft.js";
-import "../../List/components/ListItemTailRight.js";
-import "../../List/components/ListSortableItemTarget.js";
-import "../../List/components/ListSortableItemControls.js";
-import "../../Footer/Footer.js";
-import "../../Footer/components/FooterDescription.js";
-import "../../Footer/components/FooterDescriptionControls.js";
-import "../../Footer/components/FooterDescriptionContent.js";
-import "../../Body/Body.js";
-import "../../Header/Header.js";
-import "../../Header/components/HeaderLayoutSidebar/HeaderLayoutSidebar.js";
-import "../../Header/components/HeaderLayoutSidebar/HeaderLayoutSidebarContent.js";
-import "../../Header/components/HeaderLayoutSidebar/HeaderLayoutSidebarSidebar.js";
-import "../../Header/components/HeaderSubheader/HeaderSubheader.js";
-import "../../Header/components/HeaderTabs/HeaderTabs.js";
-import "../../Header/components/HeaderTabs/HeaderTabsContent.js";
-import "../../Header/components/HeaderTabs/HeaderTabsControls.js";
-import "../../Header/components/HeaderTitle/HeaderTitle.js";
-import "../../Header/components/HeaderTitle/HeaderTitleContent.js";
-import "../../Header/components/HeaderTitle/HeaderTitleControls.js";
-import "../../Page/Page.js";
-import "../../Pagination/components/PaginationExtended.js";
-import "../../Pagination/components/PaginationNavigation.js";
-import "../../Pagination/components/PaginationNavigationButton.js";
-import "../../Pagination/components/PaginationNavigationExtended.js";
-import "../../Pagination/components/PaginationNavigationExtendedItem.js";
-import "../../Pagination/components/PaginationPageButton.js";
-import "../../Pagination/components/PaginationPageEllipsis.js";
-import "../../Pagination/components/PaginationSelect.js";
-import "../../Pagination/Pagination.js";
-import "../../Card/CardAction.js";
-import "../../Card/CardStatic.js";
+import { EComponentSize as K } from "../../../enums/EComponentSize.js";
+import { createSizeToClassNameMap as P } from "../../../utils/classNameMaps.js";
+const U = P(C), Y = (N) => {
+  const {
+    children: u,
+    className: O,
+    dropdownOpened: i,
+    listRef: R,
+    loading: A,
+    size: D = K.MD,
+    ...M
+  } = N, S = _(C.dropdownDesktopList, U[D], O), { activeDescendant: p, setActiveDescendant: d } = B(V), c = R || l.createRef(), v = b([]), [m, a] = z(void 0), L = l.Children.count(u), I = (e) => {
+    const t = c == null ? void 0 : c.current, r = v.current[e];
+    if (t && r) {
+      const { top: n, bottom: o } = t.getBoundingClientRect(), { top: s, bottom: E } = r.getBoundingClientRect(), T = 4;
+      n > s ? t.scrollTop = t.scrollTop - n + s - T : E > o && (t.scrollTop = t.scrollTop + E - o + T);
+    }
+  }, g = () => {
+    const e = c == null ? void 0 : c.current;
+    e && (e.scrollTop = 0);
+  };
+  f(() => {
+    if (!i)
+      return;
+    const e = (t) => {
+      const { keyCode: r } = t, n = L, o = m;
+      let s;
+      r === w.ARROW_DOWN ? (o !== void 0 && o < n - 1 ? s = o + 1 : s = 0, t.preventDefault()) : r === w.ARROW_UP && (o !== void 0 && o > 0 ? s = o - 1 : s = n - 1, t.preventDefault()), s !== void 0 && o !== s && (I(s), a(s));
+    };
+    return document.addEventListener("keydown", e), () => {
+      document.removeEventListener("keydown", e);
+    };
+  }, [i, m, L]), f(() => {
+    if (!i)
+      return;
+    let e = !1;
+    l.Children.forEach(u, (t, r) => {
+      l.isValidElement(t) && t.props.selected && (e = !0, I(r), a(r));
+    }), e || (a(0), g());
+  }, [i]), f(() => {
+    var e;
+    if (i && m !== void 0) {
+      d((e = v.current[m]) == null ? void 0 : e.id);
+      return;
+    }
+    !i && p !== void 0 && d();
+  }, [i, m, p, d]), f(() => () => {
+    p !== void 0 && d();
+  }, [p, d]);
+  const k = l.Children.map(u, (e, t) => l.isValidElement(e) ? l.cloneElement(e, {
+    active: m === t,
+    onMouseOver: (r) => {
+      var n, o;
+      a(t), (o = (n = e.props).onMouseOver) == null || o.call(n, r);
+    },
+    onMouseOut: (r) => {
+      var n, o;
+      a(void 0), (o = (n = e.props).onMouseOut) == null || o.call(n, r);
+    },
+    ref: (r) => {
+      v.current[t] = r;
+    }
+  }) : e);
+  return /* @__PURE__ */ y("div", { className: S, role: "listbox", ...M, ref: c, children: [
+    k,
+    A && /* @__PURE__ */ h(x, { id: "dropdown-desktop-list-loader-item", children: /* @__PURE__ */ h(W, { className: C.dropdownDesktopListLoader, theme: j.BRAND, size: D }) })
+  ] });
+};
+Y.Item = x;
 export {
-  Po as DropdownList
+  Y as DropdownList
 };
 //# sourceMappingURL=DropdownList.js.map

package/components/Dropdown/desktop/DropdownListItem.js

@@ -1,9 +1,10 @@
 import "react/jsx-runtime";
 import "react";
 import "../../../utils/keyboard.js";
-import "../../../chunks/vendor-CF2m175I.js";
-import { D as e } from "../../../chunks/DropdownListItem-CW2MmFpw.js";
+import "../../../chunks/vendor-BlJo2ILB.js";
+import "../../NotificationIcon/NotificationIcon.js";
+import { D as s } from "../../../chunks/DropdownListItem-lbLsbKwC.js";
 export {
-  e as DropdownListItem
+  s as DropdownListItem
 };
 //# sourceMappingURL=DropdownListItem.js.map

package/components/Dropdown/desktop/index.js

@@ -0,0 +1,9 @@
+import { DropdownDesktop as p } from "./DropdownDesktop.js";
+import { DropdownList as e } from "./DropdownList.js";
+import { D as m } from "../../../chunks/DropdownListItem-lbLsbKwC.js";
+export {
+  p as DropdownDesktop,
+  e as DropdownList,
+  m as DropdownListItem
+};
+//# sourceMappingURL=index.js.map

package/components/Dropdown/index.js

@@ -1,32 +1,38 @@
-import { D as e, e as p, c as t } from "../../chunks/index-CAZEh1iw.js";
-import { D } from "../../chunks/DropdownListItem-CW2MmFpw.js";
-import { DropdownMobile as i } from "./mobile/DropdownMobile.js";
-import { DropdownMobileBody as m } from "./mobile/DropdownMobileBody.js";
-import { DropdownMobileClose as x } from "./mobile/DropdownMobileClose.js";
-import { DropdownMobileFooter as s } from "./mobile/DropdownMobileFooter.js";
-import { DropdownMobileHeader as M } from "./mobile/DropdownMobileHeader.js";
-import { DropdownMobileInner as L } from "./mobile/DropdownMobileInner.js";
-import { DropdownMobileInput as I } from "./mobile/DropdownMobileInput.js";
-import { DropdownMobileList as z } from "./mobile/DropdownMobileList.js";
-import { DropdownMobileListItem as g } from "./mobile/DropdownMobileListItem.js";
-import { EDropdownAlignment as u, EDropdownDirection as y, EDropdownListSize as A, EDropdownSize as B } from "./enums.js";
+import { Dropdown as e } from "./Dropdown.js";
+import { DropdownListContext as t } from "./DropdownListContext.js";
+import { DropdownDesktop as d } from "./desktop/DropdownDesktop.js";
+import { DropdownList as i } from "./desktop/DropdownList.js";
+import { D as w } from "../../chunks/DropdownListItem-lbLsbKwC.js";
+import { DropdownMobile as f } from "./mobile/DropdownMobile.js";
+import { DropdownMobileBody as b } from "./mobile/DropdownMobileBody.js";
+import { DropdownMobileClose as s } from "./mobile/DropdownMobileClose.js";
+import { DropdownMobileFooter as E } from "./mobile/DropdownMobileFooter.js";
+import { DropdownMobileHeader as a } from "./mobile/DropdownMobileHeader.js";
+import { DropdownMobileInner as C } from "./mobile/DropdownMobileInner.js";
+import { DropdownMobileInput as c } from "./mobile/DropdownMobileInput.js";
+import { DropdownMobileList as k } from "./mobile/DropdownMobileList.js";
+import { DropdownMobileListItem as y } from "./mobile/DropdownMobileListItem.js";
+import { DropdownMobileLoader as B } from "./mobile/DropdownMobileLoader.js";
+import { EDropdownAlignment as H, EDropdownDirection as h, EDropdownListSize as j, EDropdownSize as q } from "./enums.js";
 export {
   e as Dropdown,
-  p as DropdownDesktop,
-  t as DropdownList,
-  D as DropdownListItem,
-  i as DropdownMobile,
-  m as DropdownMobileBody,
-  x as DropdownMobileClose,
-  s as DropdownMobileFooter,
-  M as DropdownMobileHeader,
-  L as DropdownMobileInner,
-  I as DropdownMobileInput,
-  z as DropdownMobileList,
-  g as DropdownMobileListItem,
-  u as EDropdownAlignment,
-  y as EDropdownDirection,
-  A as EDropdownListSize,
-  B as EDropdownSize
+  d as DropdownDesktop,
+  i as DropdownList,
+  t as DropdownListContext,
+  w as DropdownListItem,
+  f as DropdownMobile,
+  b as DropdownMobileBody,
+  s as DropdownMobileClose,
+  E as DropdownMobileFooter,
+  a as DropdownMobileHeader,
+  C as DropdownMobileInner,
+  c as DropdownMobileInput,
+  k as DropdownMobileList,
+  y as DropdownMobileListItem,
+  B as DropdownMobileLoader,
+  H as EDropdownAlignment,
+  h as EDropdownDirection,
+  j as EDropdownListSize,
+  q as EDropdownSize
 };
 //# sourceMappingURL=index.js.map

package/components/Dropdown/mobile/DropdownMobile.js

@@ -1,16 +1,16 @@
 import { jsx as e } from "react/jsx-runtime";
-import a, { useEffect as m } from "react";
+import m, { useEffect as a } from "react";
 import { OverlayBase as n, EOverlayDirection as c } from "../../Overlay/OverlayBase.js";
 import { DropdownMobileInner as f } from "./DropdownMobileInner.js";
-import { s as p } from "../../../chunks/DropdownMobile.module-DyunEp10.js";
-const r = p.dropdownMobileBodyOverflow, y = a.forwardRef(
-  ({ children: t, opened: o, setOpened: s, ...d }, i) => (m(() => (o ? document.body.classList.add(r) : document.body.classList.remove(r), () => document.body.classList.remove(r)), [o]), /* @__PURE__ */ e(n, { setOpened: s, opened: o, direction: c.BOTTOM, children: (l) => /* @__PURE__ */ e(
+import { s as p } from "../../../chunks/DropdownMobile.module-kHpY8q0l.js";
+const r = p.dropdownMobileBodyOverflow, y = m.forwardRef(
+  ({ children: t, opened: o, setOpened: s, ...d }, i) => (a(() => (o ? document.body.classList.add(r) : document.body.classList.remove(r), () => document.body.classList.remove(r)), [o]), /* @__PURE__ */ e(n, { setOpened: s, opened: o, direction: c.BOTTOM, children: (l) => /* @__PURE__ */ e(
     f,
     {
       ...l,
       ...d,
       ref: i,
-      "data-tx": "0.1.9",
+      "data-tx": "0.10.0",
       children: t
     }
   ) }))

package/components/Dropdown/mobile/DropdownMobileBody.js

@@ -1,12 +1,12 @@
-import { jsx as t } from "react/jsx-runtime";
-import d from "react";
-import { c as m } from "../../../chunks/vendor-CF2m175I.js";
-import { s as a } from "../../../chunks/DropdownMobile.module-DyunEp10.js";
-const i = d.forwardRef(
-  ({ children: o, className: r, ...e }, s) => /* @__PURE__ */ t("div", { className: m(a.dropdownMobileContent, r), ref: s, ...e, children: o })
+import { jsx as m } from "react/jsx-runtime";
+import t from "react";
+import { c as d } from "../../../chunks/vendor-BlJo2ILB.js";
+import { s as i } from "../../../chunks/DropdownMobile.module-kHpY8q0l.js";
+const p = t.forwardRef(
+  ({ children: o, className: r, ...s }, e) => /* @__PURE__ */ m("div", { className: d(i.dropdownMobileContent, r), ref: e, ...s, children: o })
 );
-i.displayName = "DropdownMobileBody";
+p.displayName = "DropdownMobileBody";
 export {
-  i as DropdownMobileBody
+  p as DropdownMobileBody
 };
 //# sourceMappingURL=DropdownMobileBody.js.map

package/components/Dropdown/mobile/DropdownMobileClose.js

@@ -2,8 +2,8 @@ import { jsx as o } from "react/jsx-runtime";
 import t from "react";
 import { ButtonIcon as m } from "../../Button/ButtonIcon.js";
 import { CrossStrokeSrvIcon16 as l } from "@sberbusiness/icons-next";
-import { c as p } from "../../../chunks/vendor-CF2m175I.js";
-import { s as i } from "../../../chunks/DropdownMobile.module-DyunEp10.js";
+import { c as p } from "../../../chunks/vendor-BlJo2ILB.js";
+import { s as i } from "../../../chunks/DropdownMobile.module-kHpY8q0l.js";
 const a = t.forwardRef(
   ({ className: r, ...e }, s) => /* @__PURE__ */ o(m, { className: p(i.dropdownMobileClose, r), ref: s, ...e, children: /* @__PURE__ */ o(l, { paletteIndex: 5 }) })
 );

package/components/Dropdown/mobile/DropdownMobileFooter.js

@@ -1,12 +1,12 @@
-import { jsx as s } from "react/jsx-runtime";
+import { jsx as t } from "react/jsx-runtime";
 import m from "react";
-import { c as a } from "../../../chunks/vendor-CF2m175I.js";
-import { s as i } from "../../../chunks/DropdownMobile.module-DyunEp10.js";
-const p = m.forwardRef(
-  ({ children: o, className: r, ...e }, t) => /* @__PURE__ */ s("div", { className: a(i.dropdownMobileFooter, r), ref: t, ...e, children: o })
+import { c as i } from "../../../chunks/vendor-BlJo2ILB.js";
+import { s as p } from "../../../chunks/DropdownMobile.module-kHpY8q0l.js";
+const a = m.forwardRef(
+  ({ children: o, className: r, ...e }, s) => /* @__PURE__ */ t("div", { className: i(p.dropdownMobileFooter, r), ref: s, ...e, children: o })
 );
-p.displayName = "DropdownMobileFooter";
+a.displayName = "DropdownMobileFooter";
 export {
-  p as DropdownMobileFooter
+  a as DropdownMobileFooter
 };
 //# sourceMappingURL=DropdownMobileFooter.js.map

package/components/Dropdown/mobile/DropdownMobileHeader.js

@@ -1,15 +1,15 @@
-import { jsxs as i } from "react/jsx-runtime";
-import m from "react";
-import { c as p } from "../../../chunks/vendor-CF2m175I.js";
-import { s } from "../../../chunks/DropdownMobile.module-DyunEp10.js";
-const f = m.forwardRef(
-  ({ children: e, className: a, closeButton: r, ...d }, o) => /* @__PURE__ */ i("div", { className: p(s.dropdownMobileHeader, a), ref: o, ...d, children: [
-    e,
-    r == null ? void 0 : r()
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import t from "react";
+import { c as m } from "../../../chunks/vendor-BlJo2ILB.js";
+import { s as o } from "../../../chunks/DropdownMobile.module-kHpY8q0l.js";
+const n = t.forwardRef(
+  ({ children: r, className: s, controlButtons: d, ...a }, i) => /* @__PURE__ */ l("div", { className: m(o.dropdownMobileHeader, s), ref: i, ...a, children: [
+    /* @__PURE__ */ e("div", { className: o.dropdownMobileHeaderContent, children: r }),
+    /* @__PURE__ */ e("div", { className: o.controlButtons, children: d })
   ] })
 );
-f.displayName = "DropdownMobileHeader";
+n.displayName = "DropdownMobileHeader";
 export {
-  f as DropdownMobileHeader
+  n as DropdownMobileHeader
 };
 //# sourceMappingURL=DropdownMobileHeader.js.map

package/components/Dropdown/mobile/DropdownMobileInner.js

@@ -1,12 +1,12 @@
 import { jsxs as j, jsx as c } from "react/jsx-runtime";
 import y, { useState as l, useEffect as d } from "react";
-import { c as n } from "../../../chunks/vendor-CF2m175I.js";
+import { c as n } from "../../../chunks/vendor-BlJo2ILB.js";
 import { useToken as B } from "../../ThemeProvider/useToken.js";
-import { s as e } from "../../../chunks/DropdownMobile.module-DyunEp10.js";
+import { s as e } from "../../../chunks/DropdownMobile.module-kHpY8q0l.js";
 const C = y.forwardRef(
   ({
-    children: f,
-    className: m,
+    children: m,
+    className: f,
     opened: o,
     opening: s,
     closing: t,
@@ -21,7 +21,7 @@ const C = y.forwardRef(
     }, [s]), d(() => {
       setTimeout(() => S(o));
     }, [o]);
-    const D = n(e.dropdownMobileWrapper, b, m), x = n(e.dropdownMobileBackdrop, {
+    const D = n(e.dropdownMobileWrapper, b, f), x = n(e.dropdownMobileBackdrop, {
       [e.closing]: t,
       [e.opened]: r,
       [e.opening]: a
@@ -45,7 +45,7 @@ const C = y.forwardRef(
           onMouseDown: i
         }
       ),
-      /* @__PURE__ */ c("div", { className: g, ref: T, ...N, children: f })
+      /* @__PURE__ */ c("div", { className: g, ref: T, ...N, children: m })
     ] });
   }
 );

package/components/Dropdown/mobile/DropdownMobileInput.js

@@ -1,12 +1,13 @@
 import { jsx as t } from "react/jsx-runtime";
-import s from "react";
-import { c as e } from "../../../chunks/vendor-CF2m175I.js";
-import { s as m } from "../../../chunks/DropdownMobile.module-DyunEp10.js";
-const a = s.forwardRef(
-  ({ className: o, ...r }, p) => /* @__PURE__ */ t("input", { className: e(m.dropdownMobileInput, o), ...r, ref: p })
+import r from "react";
+import { c as d } from "../../../chunks/vendor-BlJo2ILB.js";
+const e = "dropdownMobileInput__114d82ff", i = {
+  dropdownMobileInput: e
+}, s = r.forwardRef(
+  ({ className: o, ...p }, n) => /* @__PURE__ */ t("input", { className: d(i.dropdownMobileInput, o), ...p, ref: n })
 );
-a.displayName = "DropdownMobileInput";
+s.displayName = "DropdownMobileInput";
 export {
-  a as DropdownMobileInput
+  s as DropdownMobileInput
 };
 //# sourceMappingURL=DropdownMobileInput.js.map

package/components/Dropdown/mobile/DropdownMobileList.js

@@ -1,21 +1,30 @@
-import { jsx as t } from "react/jsx-runtime";
-import e from "react";
-import { c as l } from "../../../chunks/vendor-CF2m175I.js";
-import { s as m } from "../../../chunks/DropdownMobile.module-DyunEp10.js";
-const a = e.forwardRef(
-  ({ children: o, className: r, ...s }, i) => /* @__PURE__ */ t(
-    "div",
-    {
-      className: l(m.dropdownMobileList, r),
-      ref: i,
-      role: "listbox",
-      ...s,
-      children: o
-    }
-  )
+import { jsxs as l, jsx as o } from "react/jsx-runtime";
+import p from "react";
+import { c as a } from "../../../chunks/vendor-BlJo2ILB.js";
+import { DropdownMobileListItem as n } from "./DropdownMobileListItem.js";
+import { LoaderSmall as f } from "../../Loader/LoaderSmall/LoaderSmall.js";
+import { ELoaderSmallTheme as c } from "../../Loader/LoaderSmall/enum.js";
+import "../../Loader/LoaderMiddle/LoaderMiddle.js";
+import { EComponentSize as L } from "../../../enums/EComponentSize.js";
+import { s as r } from "../../../chunks/DropdownMobile.module-kHpY8q0l.js";
+const b = p.forwardRef(
+  ({ children: e, className: i, loading: m, ...t }, s) => {
+    const d = () => /* @__PURE__ */ o(n, { id: "dropdown-mobile-list-loader-item", children: /* @__PURE__ */ o(
+      f,
+      {
+        className: r.dropdownMobileListLoader,
+        theme: c.BRAND,
+        size: L.MD
+      }
+    ) });
+    return /* @__PURE__ */ l("div", { className: a(r.dropdownMobileList, i), role: "listbox", ...t, ref: s, children: [
+      e,
+      m && d()
+    ] });
+  }
 );
-a.displayName = "DropdownMobileList";
+b.displayName = "DropdownMobileList";
 export {
-  a as DropdownMobileList
+  b as DropdownMobileList
 };
 //# sourceMappingURL=DropdownMobileList.js.map

package/components/Dropdown/mobile/DropdownMobileListItem.js

@@ -1,37 +1,37 @@
-import { jsx as f } from "react/jsx-runtime";
-import l from "react";
-import { c as x } from "../../../chunks/vendor-CF2m175I.js";
-import { Text as w } from "../../Typography/Text.js";
-import { ETextSize as b } from "../../Typography/enums.js";
-import { s } from "../../../chunks/DropdownMobile.module-DyunEp10.js";
-const y = l.forwardRef(
-  ({ children: o, className: e, id: B, onClick: t, onSelect: r, selected: i, ...m }, a) => {
-    const p = (d) => {
-      r == null || r(), t == null || t(d);
+import { jsxs as n, jsx as l } from "react/jsx-runtime";
+import x from "react";
+import { c } from "../../../chunks/vendor-BlJo2ILB.js";
+import { Text as I } from "../../Typography/Text.js";
+import { ETextSize as w } from "../../Typography/enums.js";
+import { s as r } from "../../../chunks/DropdownMobile.module-kHpY8q0l.js";
+import { NotificationIcon as N } from "../../NotificationIcon/NotificationIcon.js";
+const b = x.forwardRef(
+  ({ children: o, className: m, id: y, onClick: t, onSelect: i, selected: s, showNotificationIcon: a, ...e }, p) => {
+    const f = (d) => {
+      i == null || i(), t == null || t(d);
     };
-    return /* @__PURE__ */ f(
-      w,
+    return /* @__PURE__ */ n(
+      I,
       {
         tag: "div",
-        size: b.B3,
-        className: x(
-          s.dropdownMobileListItem,
-          { [s.selected]: !!i },
-          e
-        ),
-        "aria-selected": !!i,
+        size: w.B3,
+        className: c(r.dropdownMobileListItem, { [r.selected]: !!s }, m),
+        "aria-selected": !!s,
         role: "option",
-        ref: a,
-        onClick: p,
+        ref: p,
+        onClick: f,
         title: typeof o == "string" ? o : void 0,
-        ...m,
-        children: o
+        ...e,
+        children: [
+          o,
+          a && /* @__PURE__ */ l(N, { className: r.notificationIcon })
+        ]
       }
     );
   }
 );
-y.displayName = "DropdownMobileListItem";
+b.displayName = "DropdownMobileListItem";
 export {
-  y as DropdownMobileListItem
+  b as DropdownMobileListItem
 };
 //# sourceMappingURL=DropdownMobileListItem.js.map

package/components/Dropdown/mobile/DropdownMobileLoader.js

@@ -0,0 +1,20 @@
+import { jsx as m } from "react/jsx-runtime";
+import { c as e } from "../../../chunks/vendor-BlJo2ILB.js";
+import { LoaderSmall as t } from "../../Loader/LoaderSmall/LoaderSmall.js";
+import { ELoaderSmallTheme as i } from "../../Loader/LoaderSmall/enum.js";
+import "../../Loader/LoaderMiddle/LoaderMiddle.js";
+import { EComponentSize as p } from "../../../enums/EComponentSize.js";
+import { s } from "../../../chunks/DropdownMobile.module-kHpY8q0l.js";
+const S = ({ className: o, ...r }) => /* @__PURE__ */ m(
+  t,
+  {
+    className: e(s.dropdownMobileLoader, o),
+    theme: i.BRAND,
+    size: p.SM,
+    ...r
+  }
+);
+export {
+  S as DropdownMobileLoader
+};
+//# sourceMappingURL=DropdownMobileLoader.js.map

package/components/Dropdown/mobile/DropdownMobileMaskedInput.js

@@ -0,0 +1,11 @@
+import { jsx as d } from "react/jsx-runtime";
+import { c as p } from "../../../chunks/vendor-BlJo2ILB.js";
+import { FormFieldMaskedInput as o } from "../../FormField/components/FormFieldMaskedInput.js";
+const t = "dropdownMobileMaskedInput__537d4555", r = {
+  dropdownMobileMaskedInput: t
+}, n = ({ className: s, ...e }) => /* @__PURE__ */ d(o, { className: p(r.dropdownMobileMaskedInput, s), ...e });
+n.presets = o.presets;
+export {
+  n as DropdownMobileMaskedInput
+};
+//# sourceMappingURL=DropdownMobileMaskedInput.js.map

package/components/Dropdown/mobile/index.js

@@ -1,21 +1,23 @@
 import { DropdownMobile as e } from "./DropdownMobile.js";
 import { DropdownMobileBody as t } from "./DropdownMobileBody.js";
-import { DropdownMobileClose as d } from "./DropdownMobileClose.js";
+import { DropdownMobileClose as n } from "./DropdownMobileClose.js";
 import { DropdownMobileFooter as l } from "./DropdownMobileFooter.js";
 import { DropdownMobileHeader as b } from "./DropdownMobileHeader.js";
 import { DropdownMobileInner as w } from "./DropdownMobileInner.js";
 import { DropdownMobileInput as D } from "./DropdownMobileInput.js";
 import { DropdownMobileList as s } from "./DropdownMobileList.js";
 import { DropdownMobileListItem as L } from "./DropdownMobileListItem.js";
+import { DropdownMobileLoader as u } from "./DropdownMobileLoader.js";
 export {
   e as DropdownMobile,
   t as DropdownMobileBody,
-  d as DropdownMobileClose,
+  n as DropdownMobileClose,
   l as DropdownMobileFooter,
   b as DropdownMobileHeader,
   w as DropdownMobileInner,
   D as DropdownMobileInput,
   s as DropdownMobileList,
-  L as DropdownMobileListItem
+  L as DropdownMobileListItem,
+  u as DropdownMobileLoader
 };
 //# sourceMappingURL=index.js.map