mimir-ui-kit 1.43.18 → 1.43.19

package/dist/assets/Drawer.css

@@ -1 +1 @@
-._drawer_13ua6_2{--drawer-width: 808px;--drawer-z-index: 10000;position:fixed;z-index:10000;z-index:var(--drawer-z-index);display:flex;flex-direction:column;width:808px;width:var(--drawer-width);height:100%;overflow:auto;background-color:var(--black-5);transition:all .3s ease;pointer-events:none}._drawer_13ua6_2::-webkit-scrollbar{width:3px}._drawer_13ua6_2::-webkit-scrollbar-thumb{background-color:var(--black-80);border-radius:2px}._drawer_13ua6_2::-webkit-scrollbar-track{background-color:var(--white)}._drawer_13ua6_2 ._content_13ua6_26{position:relative;display:flex;flex:1;flex-direction:column;padding:var(--mimir-space-m) var(--mimir-space-4xl) var(--mimir-space-4xl);transition:all .3s ease}@media (max-width: 600px){._drawer_13ua6_2 ._content_13ua6_26{--drawer-width: 100%;padding:var(--mimir-space-m)}}._drawer_13ua6_2 ._content_13ua6_26._is-loading_13ua6_40{align-items:center;justify-content:center}._drawer_13ua6_2 ._header_13ua6_44{display:flex;gap:var(--mimir-space-xs);min-height:68px}._drawer_13ua6_2 ._header_13ua6_44:not(:last-child){margin-bottom:var(--mimir-space-2xl)}._drawer_13ua6_2 ._header_13ua6_44._sticky-header_13ua6_52{position:-webkit-sticky;position:sticky;top:0;left:0;background-color:var(--black-5)}._drawer_13ua6_2 ._header_13ua6_44 ._title_13ua6_58{flex:1;align-self:flex-end;font-weight:var(--mimir-font-weight-text-medium);font-size:var(--mimir-size-text-xl3);line-height:var(--mimir-line-height-text-s1);letter-spacing:.7px}@media (max-width: 600px){._drawer_13ua6_2 ._header_13ua6_44 ._title_13ua6_58{font-size:var(--mimir-size-text-xl2);line-height:var(--mimir-line-height-text-xs)}}._drawer_13ua6_2 ._header_13ua6_44 ._space_13ua6_72{flex:0 0 var(--button-height-m)}@media (max-width: 600px){._drawer_13ua6_2 ._header_13ua6_44{min-height:55px}._drawer_13ua6_2 ._header_13ua6_44:not(:last-child){margin-bottom:var(--mimir-space-m)}}._drawer_13ua6_2 ._inner_13ua6_83{flex:1}._drawer_13ua6_2 ._button_13ua6_86{position:absolute;top:var(--mimir-space-m);right:var(--mimir-space-m)}._drawer_13ua6_2 ._footer_13ua6_91{display:block;padding-top:var(--mimir-space-4xl)}@media (max-width: 600px){._drawer_13ua6_2 ._footer_13ua6_91{padding-top:var(--mimir-space-m)}}._drawer_13ua6_2 ._footer-button_13ua6_100{display:block;margin-left:auto}._drawer_13ua6_2._left_13ua6_104{top:0;left:-100%}._drawer_13ua6_2._right_13ua6_108{top:0;right:-100%}._drawer_13ua6_2._full_13ua6_112{top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-height:100vh;border-radius:0;transform:scale(.95);opacity:0;transition:transform .3s ease-in-out,opacity .3s ease-in-out}._drawer_13ua6_2._bottom_13ua6_122{--drawer-width: calc(100% - var(--mimir-space-m));right:50%;bottom:-100%;left:50%;height:-webkit-max-content;height:-moz-max-content;height:max-content;max-height:calc(100% - var(--mimir-space-xs));border-top-left-radius:var(--mimir-control-radius);border-top-right-radius:var(--mimir-control-radius);transform:translate(-50%)}._drawer_13ua6_2._bottom_13ua6_122._full-bottom-height_13ua6_133{height:calc(100% - var(--mimir-space-xs))}._drawer_13ua6_2._bottom_13ua6_122._is-loading_13ua6_40{height:50vh}._drawer_13ua6_2._opened_13ua6_139{transition:all .3s ease;pointer-events:auto}._drawer_13ua6_2._opened_13ua6_139._left_13ua6_104{left:0%;transition:left .3s ease}._drawer_13ua6_2._opened_13ua6_139._right_13ua6_108{right:0%;transition:right .3s ease}._drawer_13ua6_2._opened_13ua6_139._bottom_13ua6_122{bottom:0%}._drawer_13ua6_2._opened_13ua6_139._full_13ua6_112{transform:scale(1);opacity:1}._drawer_13ua6_2._is-closing_13ua6_158._left_13ua6_104{left:-100%}._drawer_13ua6_2._is-closing_13ua6_158._right_13ua6_108{right:-100%}._drawer_13ua6_2._is-closing_13ua6_158._bottom_13ua6_122{bottom:-100%}._drawer_13ua6_2._is-closing_13ua6_158._full_13ua6_112{transform:scale(.95);opacity:0}@media (max-width: 1440px){._drawer_13ua6_2{--drawer-width: 608px}}@media (max-width: 1280px){._drawer_13ua6_2{--drawer-width: 648px}}@media (max-width: 768px){._drawer_13ua6_2{--drawer-width: 584px}}@media (max-width: 600px){._drawer_13ua6_2{--drawer-width: 100%}._drawer_13ua6_2._bottom_13ua6_122{--drawer-width: calc(100% - var(--mimir-space-xs))}}._overlay_13ua6_195{--overlay-z-index: 9990;position:fixed;top:0;left:0;z-index:9990;z-index:var(--overlay-z-index);width:100%;height:100%;background-color:#0009;opacity:0;transition:all .3s ease}._overlay_13ua6_195._opened_13ua6_139{opacity:1;transition:all .3s ease}._overlay_13ua6_195._opened_13ua6_139._unmount_13ua6_211{z-index:var(--overlay-z-index);-webkit-appearance:none;-moz-appearance:none;appearance:none}._overlay_13ua6_195._is-closing_13ua6_158{opacity:0;transition:all .3s ease}._overlay_13ua6_195._unmount_13ua6_211{z-index:-1;-webkit-appearance:none;-moz-appearance:none;appearance:none}
+._drawer_14uzm_2{--drawer-width: 808px;--drawer-z-index: 10000;position:fixed;z-index:10000;z-index:var(--drawer-z-index);display:flex;flex-direction:column;width:808px;width:var(--drawer-width);height:100%;overflow:auto;background-color:var(--black-5);transition:all .3s ease;pointer-events:none}._drawer_14uzm_2::-webkit-scrollbar{width:3px}._drawer_14uzm_2::-webkit-scrollbar-thumb{background-color:var(--black-80);border-radius:2px}._drawer_14uzm_2::-webkit-scrollbar-track{background-color:var(--white)}._drawer_14uzm_2 ._content_14uzm_26{position:relative;display:flex;flex:1;flex-direction:column;padding:var(--mimir-space-m) var(--mimir-space-xs) var(--mimir-space-3xs) var(--mimir-space-4xl);overflow:hidden;transition:all .3s ease}@media (max-width: 600px){._drawer_14uzm_2 ._content_14uzm_26{--drawer-width: 100%;padding:var(--mimir-space-m)}}._drawer_14uzm_2 ._content_14uzm_26._is-loading_14uzm_41{align-items:center;justify-content:center}._drawer_14uzm_2 ._header_14uzm_45{display:flex;gap:var(--mimir-space-xs);min-height:68px}._drawer_14uzm_2 ._header_14uzm_45:not(:last-child){margin-bottom:var(--mimir-space-2xl)}._drawer_14uzm_2 ._header_14uzm_45._sticky-header_14uzm_53{position:-webkit-sticky;position:sticky;top:0;left:0;background-color:var(--black-5)}._drawer_14uzm_2 ._header_14uzm_45 ._title_14uzm_59{flex:1;align-self:flex-end;font-weight:var(--mimir-font-weight-text-medium);font-size:var(--mimir-size-text-xl3);line-height:var(--mimir-space-2xxl);letter-spacing:.7px}@media (max-width: 600px){._drawer_14uzm_2 ._header_14uzm_45 ._title_14uzm_59{font-size:var(--mimir-size-text-xl2);line-height:var(--mimir-line-height-text-xs)}}._drawer_14uzm_2 ._header_14uzm_45 ._space_14uzm_73{flex:0 0 var(--button-height-m)}@media (max-width: 600px){._drawer_14uzm_2 ._header_14uzm_45{min-height:55px}._drawer_14uzm_2 ._header_14uzm_45:not(:last-child){margin-bottom:var(--mimir-space-m)}}._drawer_14uzm_2 ._inner_14uzm_84{flex:1;padding-right:var(--mimir-space-xxl);overflow-y:auto}._drawer_14uzm_2 ._inner_14uzm_84._is-loading_14uzm_41{display:flex;flex-direction:column;align-items:center;justify-content:center}._drawer_14uzm_2 ._button_14uzm_95{position:absolute;top:var(--mimir-space-m);right:var(--mimir-space-m)}._drawer_14uzm_2 ._footer_14uzm_100{display:block;padding:var(--mimir-space-2xl) var(--mimir-space-xxl) var(--mimir-space-4xl) var(--mimir-space-xxl)}@media (max-width: 600px){._drawer_14uzm_2 ._footer_14uzm_100{padding:var(--mimir-space-m)}}._drawer_14uzm_2 ._footer_14uzm_100._has-scroll_14uzm_109{box-shadow:var(--mimir-modal-window-bottom-panel-shadow)}._drawer_14uzm_2 ._footer-button_14uzm_112{display:block;margin-left:auto}._drawer_14uzm_2._left_14uzm_116{top:0;left:-100%}._drawer_14uzm_2._right_14uzm_120{top:0;right:-100%}._drawer_14uzm_2._full_14uzm_124{top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-height:100vh;border-radius:0;transform:scale(.95);opacity:0;transition:transform .3s ease-in-out,opacity .3s ease-in-out}._drawer_14uzm_2._bottom_14uzm_134{--drawer-width: calc(100% - var(--mimir-space-m));right:50%;bottom:-100%;left:50%;height:-webkit-max-content;height:-moz-max-content;height:max-content;max-height:calc(100% - var(--mimir-space-xs));border-top-left-radius:var(--mimir-control-radius);border-top-right-radius:var(--mimir-control-radius);transform:translate(-50%)}._drawer_14uzm_2._bottom_14uzm_134._full-bottom-height_14uzm_145{height:calc(100% - var(--mimir-space-xs))}._drawer_14uzm_2._bottom_14uzm_134._is-loading_14uzm_41{height:50vh}._drawer_14uzm_2._opened_14uzm_151{transition:all .3s ease;pointer-events:auto}._drawer_14uzm_2._opened_14uzm_151._left_14uzm_116{left:0%;transition:left .3s ease}._drawer_14uzm_2._opened_14uzm_151._right_14uzm_120{right:0%;transition:right .3s ease}._drawer_14uzm_2._opened_14uzm_151._bottom_14uzm_134{bottom:0%}._drawer_14uzm_2._opened_14uzm_151._full_14uzm_124{transform:scale(1);opacity:1}._drawer_14uzm_2._is-closing_14uzm_170._left_14uzm_116{left:-100%}._drawer_14uzm_2._is-closing_14uzm_170._right_14uzm_120{right:-100%}._drawer_14uzm_2._is-closing_14uzm_170._bottom_14uzm_134{bottom:-100%}._drawer_14uzm_2._is-closing_14uzm_170._full_14uzm_124{transform:scale(.95);opacity:0}@media (max-width: 1440px){._drawer_14uzm_2{--drawer-width: 608px}}@media (max-width: 1280px){._drawer_14uzm_2{--drawer-width: 648px}}@media (max-width: 768px){._drawer_14uzm_2{--drawer-width: 584px}}@media (max-width: 600px){._drawer_14uzm_2{--drawer-width: 100%}._drawer_14uzm_2._bottom_14uzm_134{--drawer-width: calc(100% - var(--mimir-space-m))}}._overlay_14uzm_207{--overlay-z-index: 9990;position:fixed;top:0;left:0;z-index:9990;z-index:var(--overlay-z-index);width:100%;height:100%;background-color:#0009;opacity:0;transition:all .3s ease}._overlay_14uzm_207._opened_14uzm_151{opacity:1;transition:all .3s ease}._overlay_14uzm_207._opened_14uzm_151._unmount_14uzm_223{z-index:var(--overlay-z-index);-webkit-appearance:none;-moz-appearance:none;appearance:none}._overlay_14uzm_207._is-closing_14uzm_170{opacity:0;transition:all .3s ease}._overlay_14uzm_207._unmount_14uzm_223{z-index:-1;-webkit-appearance:none;-moz-appearance:none;appearance:none}

package/dist/assets/index2.css

@@ -0,0 +1 @@
+._scroll-container_7yixd_2{height:100%;padding-right:4px;overflow-y:auto}._scroll-container_7yixd_2[data-variant=light]::-webkit-scrollbar{width:8px;height:8px}._scroll-container_7yixd_2[data-variant=light]::-webkit-scrollbar-track{background:var(--white);border-radius:var(--mimir-control-radius)}._scroll-container_7yixd_2[data-variant=light]::-webkit-scrollbar-thumb{background:var(--black-80);border:2px solid var(--white);border-radius:var(--mimir-control-radius)}._scroll-container_7yixd_2[data-variant=light][data-size=s]::-webkit-scrollbar{width:8px;height:8px}._scroll-container_7yixd_2[data-variant=light][data-size=s]::-webkit-scrollbar-track{background:var(--white);border-radius:var(--mimir-control-radius)}._scroll-container_7yixd_2[data-variant=light][data-size=s]::-webkit-scrollbar-thumb{background:var(--black-80);border:2px solid var(--white);border-radius:var(--mimir-control-radius)}._scroll-container_7yixd_2[data-variant=light][data-size=s]::-webkit-scrollbar{width:4px;height:4px}._scroll-container_7yixd_2[data-variant=light][data-size=s]::-webkit-scrollbar-track{border-radius:var(--mimir-control-radius-xs2)}._scroll-container_7yixd_2[data-variant=light][data-size=s]::-webkit-scrollbar-thumb{border:1px solid var(--white);border-radius:var(--mimir-control-radius-xs2)}

package/dist/components/Drawer/Drawer.js

@@ -1,38 +1,41 @@
-import { jsxs as f, Fragment as I, jsx as t } from "react/jsx-runtime";
+import { jsxs as a, Fragment as oe, jsx as t } from "react/jsx-runtime";
 import { c as n } from "../../index-DIxK0V-G.js";
-import { forwardRef as q, useState as M, useRef as J, useCallback as h, useEffect as U } from "react";
-import { EDrawerPosition as O } from "./constants.js";
-import { useContainer as Z } from "./hooks.js";
-import { useMediaQuery as $ } from "../../hooks/useMediaQuery/useMediaQuery.js";
-import { EMediaQuery as ee } from "../../hooks/useMediaQuery/constants.js";
-import { useLockBodyScroll as te } from "../../hooks/useLockBodyScroll/useLockBodyScroll.js";
-import { useResizeObserver as oe } from "../../hooks/useResizeObserver/useResizeObserver.js";
-import { Button as S } from "../Button/Button.js";
-import { EButtonVariantDefault as ne, EButtonSize as r } from "../Button/constants.js";
-import { Loader as se } from "../Loader/Loader.js";
-import { Portal as re } from "../Portal/Portal.js";
-import '../../assets/Drawer.css';const ae = "_drawer_13ua6_2", ie = "_content_13ua6_26", le = "_header_13ua6_44", ce = "_title_13ua6_58", ue = "_space_13ua6_72", de = "_inner_13ua6_83", me = "_button_13ua6_86", _e = "_footer_13ua6_91", fe = "_left_13ua6_104", he = "_right_13ua6_108", pe = "_full_13ua6_112", ye = "_bottom_13ua6_122", ge = "_opened_13ua6_139", Ce = "_overlay_13ua6_195", ve = "_unmount_13ua6_211", e = {
-  drawer: ae,
-  content: ie,
-  "is-loading": "_is-loading_13ua6_40",
-  header: le,
-  "sticky-header": "_sticky-header_13ua6_52",
-  title: ce,
-  space: ue,
-  inner: de,
-  button: me,
-  footer: _e,
-  "footer-button": "_footer-button_13ua6_100",
-  left: fe,
-  right: he,
-  full: pe,
-  bottom: ye,
-  "full-bottom-height": "_full-bottom-height_13ua6_133",
-  opened: ge,
-  "is-closing": "_is-closing_13ua6_158",
-  overlay: Ce,
-  unmount: ve
-}, Ne = 300, be = (a) => a ? {
+import { forwardRef as ne, useState as z, useRef as L, useEffect as M, useCallback as g } from "react";
+import { EDrawerPosition as R } from "./constants.js";
+import { useContainer as re } from "./hooks.js";
+import { ScrollWrapper as se } from "./ScrollWrapper/index.js";
+import { useMediaQuery as ie } from "../../hooks/useMediaQuery/useMediaQuery.js";
+import { EMediaQuery as le } from "../../hooks/useMediaQuery/constants.js";
+import { useLockBodyScroll as ae } from "../../hooks/useLockBodyScroll/useLockBodyScroll.js";
+import { useResizeObserver as ce } from "../../hooks/useResizeObserver/useResizeObserver.js";
+import { Button as H } from "../Button/Button.js";
+import { EButtonVariantDefault as ue, EButtonSize as c } from "../Button/constants.js";
+import { Loader as me } from "../Loader/Loader.js";
+import { Portal as de } from "../Portal/Portal.js";
+import { EScrollBarVariant as fe, EScrollBarSize as _e } from "../ScrollBar/constants.js";
+import '../../assets/Drawer.css';const he = "_drawer_14uzm_2", pe = "_content_14uzm_26", ze = "_header_14uzm_45", ge = "_title_14uzm_59", ye = "_space_14uzm_73", ve = "_inner_14uzm_84", be = "_button_14uzm_95", Ce = "_footer_14uzm_100", we = "_left_14uzm_116", Ne = "_right_14uzm_120", ke = "_full_14uzm_124", Se = "_bottom_14uzm_134", Be = "_opened_14uzm_151", Ee = "_overlay_14uzm_207", Ie = "_unmount_14uzm_223", e = {
+  drawer: he,
+  content: pe,
+  "is-loading": "_is-loading_14uzm_41",
+  header: ze,
+  "sticky-header": "_sticky-header_14uzm_53",
+  title: ge,
+  space: ye,
+  inner: ve,
+  button: be,
+  footer: Ce,
+  "has-scroll": "_has-scroll_14uzm_109",
+  "footer-button": "_footer-button_14uzm_112",
+  left: we,
+  right: Ne,
+  full: ke,
+  bottom: Se,
+  "full-bottom-height": "_full-bottom-height_14uzm_145",
+  opened: Be,
+  "is-closing": "_is-closing_14uzm_170",
+  overlay: Ee,
+  unmount: Ie
+}, Oe = 300, Le = (u) => u ? {
   drawer: {
     position: "absolute",
     zIndex: 100
@@ -41,120 +44,157 @@ import '../../assets/Drawer.css';const ae = "_drawer_13ua6_2", ie = "_content_13
     position: "absolute",
     zIndex: 90
   }
-} : {}, Ae = q(
-  (a, L) => {
+} : {}, Ye = ne(
+  (u, T) => {
     const {
-      as: R = "div",
-      isOpen: s,
-      onClose: i,
-      title: T,
-      className: x,
-      unmount: p = !0,
-      isLoading: l = !1,
-      stickyHeader: z,
-      fullBottomHeight: D = !1,
-      position: c = O.RIGHT,
-      paddingRight: A = 8,
-      footer: u,
-      children: H,
-      classNameTitle: P,
-      classNameHeader: X,
-      classNameInner: j,
-      classNameContent: F,
-      classNameFooter: Q,
-      closeOnClickOutside: y = !0,
-      showCloseButton: g = !0,
-      getContainer: d,
-      ...G
-    } = a, [C, v] = M(!1), [K, N] = M(!1), b = J(), m = $(ee.XS1), { ref: V } = oe({
-      enabled: c === O.BOTTOM
-    }), w = Z(d);
-    te({
-      on: s && !C,
-      paddingRight: A
+      as: x = "div",
+      isOpen: r,
+      onClose: m,
+      title: D,
+      className: A,
+      unmount: y = !0,
+      isLoading: s = !1,
+      stickyHeader: P,
+      fullBottomHeight: X = !1,
+      position: d = R.RIGHT,
+      paddingRight: j = 8,
+      footer: f,
+      children: F,
+      classNameTitle: G,
+      classNameHeader: Q,
+      classNameInner: V,
+      classNameContent: W,
+      classNameFooter: K,
+      closeOnClickOutside: v = !0,
+      showCloseButton: b = !0,
+      getContainer: _,
+      ...Y
+    } = u, [C, w] = z(!1), [q, N] = z(!1), k = L(), h = ie(le.XS1), { ref: J } = ce({
+      enabled: d === R.BOTTOM
+    }), S = re(_), i = L(null), [U, Z] = z(!1);
+    M(() => {
+      const l = () => {
+        if (i.current) {
+          const { scrollHeight: ee, clientHeight: te } = i.current;
+          Z(ee > te);
+        }
+      };
+      l();
+      const O = new ResizeObserver(l);
+      return i.current && O.observe(i.current), () => {
+        O.disconnect();
+      };
+    }, [r, s]), ae({
+      on: r && !C,
+      paddingRight: j
     });
-    const o = h(() => {
-      i && (v(!0), b.current = setTimeout(() => {
-        i(), v(!1);
-      }, Ne));
-    }, [i]), W = h(() => {
-      y && o();
-    }, [y, o]), _ = h(
-      (Y) => {
-        Y.key === "Escape" && o();
+    const o = g(() => {
+      m && (w(!0), k.current = setTimeout(() => {
+        m(), w(!1);
+      }, Oe));
+    }, [m]), $ = g(() => {
+      v && o();
+    }, [v, o]), p = g(
+      (l) => {
+        l.key === "Escape" && o();
       },
       [o]
     );
-    U(() => (s && (N(!0), window.addEventListener("keydown", _)), () => {
-      N(!1), clearTimeout(b.current), window.removeEventListener("keydown", _);
-    }), [s, _]);
-    const k = {
-      [e.opened]: K,
+    M(() => (r && (N(!0), window.addEventListener("keydown", p)), () => {
+      N(!1), clearTimeout(k.current), window.removeEventListener("keydown", p);
+    }), [r, p]);
+    const B = {
+      [e.opened]: q,
       [e["is-closing"]]: C,
-      [e["full-bottom-height"]]: D,
-      [e["is-loading"]]: l
+      [e["full-bottom-height"]]: X,
+      [e["is-loading"]]: s
     };
-    if (!s && p)
+    if (!r && y)
       return null;
-    const B = be(d !== void 0 && d !== !1), E = /* @__PURE__ */ f(I, { children: [
-      /* @__PURE__ */ t(
-        R,
+    const E = Le(_ !== void 0 && _ !== !1), I = /* @__PURE__ */ a(oe, { children: [
+      /* @__PURE__ */ a(
+        x,
         {
-          ref: L,
-          "aria-hidden": !s,
+          ref: T,
+          "aria-hidden": !r,
           role: "dialog",
-          style: B.drawer,
-          className: n(e.drawer, e[c], k, x),
-          ...G,
-          children: /* @__PURE__ */ t(
-            "section",
-            {
-              ref: V,
-              className: n(
-                e.content,
-                F,
-                e[c],
-                {
-                  [e["is-loading"]]: !!l
-                }
-              ),
-              children: l ? /* @__PURE__ */ t(se, {}) : /* @__PURE__ */ f(I, { children: [
-                /* @__PURE__ */ f(
-                  "header",
+          style: E.drawer,
+          className: n(e.drawer, e[d], B, A),
+          ...Y,
+          children: [
+            /* @__PURE__ */ a(
+              "section",
+              {
+                ref: J,
+                className: n(
+                  e.content,
+                  W,
+                  e[d],
                   {
-                    className: n(e.header, X, {
-                      [e["sticky-header"]]: z
-                    }),
-                    children: [
-                      /* @__PURE__ */ t("h2", { className: n(e.title, P), children: T }),
-                      /* @__PURE__ */ t("div", { className: e.space, children: g && /* @__PURE__ */ t(
-                        S,
-                        {
-                          variant: ne.SecondaryWhite,
-                          isIconButton: !0,
-                          size: m ? r.S : r.M,
-                          iconName: "Close16px",
-                          onClick: o,
-                          className: e.button
-                        }
-                      ) })
-                    ]
+                    [e["is-loading"]]: !!s
                   }
                 ),
-                /* @__PURE__ */ t("div", { className: n(e.inner, j), children: H }),
-                /* @__PURE__ */ t("footer", { className: n(e.footer, Q), children: typeof u == "function" ? u({ handleClose: o }) : u || g && /* @__PURE__ */ t(
-                  S,
+                children: [
+                  /* @__PURE__ */ a(
+                    "header",
+                    {
+                      className: n(e.header, Q, {
+                        [e["sticky-header"]]: P
+                      }),
+                      children: [
+                        /* @__PURE__ */ t("h2", { className: n(e.title, G), children: D }),
+                        /* @__PURE__ */ t("div", { className: e.space, children: b && /* @__PURE__ */ t(
+                          H,
+                          {
+                            variant: ue.SecondaryWhite,
+                            isIconButton: !0,
+                            size: h ? c.S : c.M,
+                            iconName: "Close16px",
+                            onClick: o,
+                            className: e.button
+                          }
+                        ) })
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ t(
+                    se,
+                    {
+                      ref: i,
+                      className: n(
+                        e.inner,
+                        {
+                          [e["is-loading"]]: !!s
+                        },
+                        V
+                      ),
+                      variant: fe.LIGHT,
+                      size: _e.M,
+                      children: s ? /* @__PURE__ */ t(me, {}) : F
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ t(
+              "footer",
+              {
+                className: n(e.footer, K, {
+                  [e["has-scroll"]]: U
+                }),
+                children: typeof f == "function" ? f({ handleClose: o }) : f || b && /* @__PURE__ */ t(
+                  H,
                   {
-                    size: m ? r.M : r.XXL,
-                    full: m,
+                    size: h ? c.L : c.XXL,
+                    full: h,
                     onClick: o,
                     className: e["footer-button"],
                     children: "Закрыть"
                   }
-                ) })
-              ] })
-            }
-          )
+                )
+              }
+            )
+          ]
         }
       ),
       /* @__PURE__ */ t(
@@ -163,20 +203,20 @@ import '../../assets/Drawer.css';const ae = "_drawer_13ua6_2", ie = "_content_13
           className: n(
             e.overlay,
             {
-              [e.unmount]: !p
+              [e.unmount]: !y
             },
-            k
+            B
           ),
-          style: B.overlay,
+          style: E.overlay,
           "data-testid": "drawer-overlay",
-          onClick: W
+          onClick: $
         }
       )
     ] });
-    return w === !1 ? E : /* @__PURE__ */ t(re, { element: w, children: E });
+    return S === !1 ? I : /* @__PURE__ */ t(de, { element: S, children: I });
   }
 );
 export {
-  Ne as ANIMATION_DELAY,
-  Ae as Drawer
+  Oe as ANIMATION_DELAY,
+  Ye as Drawer
 };

package/dist/components/Drawer/ScrollWrapper/index.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+import { EScrollBarSize, EScrollBarVariant } from '../../ScrollBar/constants';
+
+type TProps = {
+    children: React.ReactNode;
+    className?: string;
+    variant?: `${EScrollBarVariant}`;
+    size?: `${EScrollBarSize}`;
+};
+export declare const ScrollWrapper: React.ForwardRefExoticComponent<TProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/Drawer/ScrollWrapper/index.js

@@ -0,0 +1,27 @@
+import { jsx as s } from "react/jsx-runtime";
+import { c as t } from "../../../index-DIxK0V-G.js";
+import { forwardRef as i } from "react";
+import { EScrollBarVariant as e, EScrollBarSize as m } from "../../ScrollBar/constants.js";
+import '../../../assets/index2.css';const n = {
+  "scroll-container": "_scroll-container_7yixd_2"
+}, p = i(
+  ({
+    children: r,
+    className: a,
+    variant: o = e.LIGHT,
+    size: l = m.M
+  }, c) => /* @__PURE__ */ s(
+    "div",
+    {
+      ref: c,
+      className: t(n["scroll-container"], a),
+      "data-variant": o,
+      "data-size": l,
+      children: r
+    }
+  )
+);
+p.displayName = "ScrollWrapper";
+export {
+  p as ScrollWrapper
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mimir-ui-kit",
   "private": false,
-  "version": "1.43.18",
+  "version": "1.43.19",
   "type": "module",
   "exports": {
     ".": {