mimir-ui-kit 1.36.9 → 1.36.10

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

@@ -57,9 +57,17 @@ type TProps = {
      * Дополнительный класс для footer.
      */
     classNameFooter?: string;
+    /**
+     * Флаг, определяющий, закрывать ли Drawer при клике вне его области
+     */
+    closeOnClickOutside?: boolean;
+    /**
+     * Флаг, определяющий, показывать ли кнопку закрытия в заголовке
+     */
+    showCloseButton?: boolean;
 };
 /**
  * Компонент шторки, который может выезжать слева, справа или внизу.
  */
-export declare const Drawer: ({ isOpen, onClose, title, className, unmount, isLoading, stickyHeader, fullBottomHeight, position, paddingRight, footer, children, classNameInner, classNameFooter }: PropsWithChildren<TProps>) => import("react/jsx-runtime").JSX.Element | null;
+export declare const Drawer: ({ isOpen, onClose, title, className, unmount, isLoading, stickyHeader, fullBottomHeight, position, paddingRight, footer, children, classNameInner, classNameFooter, closeOnClickOutside, showCloseButton }: PropsWithChildren<TProps>) => import("react/jsx-runtime").JSX.Element | null;
 export {};

package/dist/components/Drawer/Drawer.js

@@ -1,93 +1,97 @@
-import { jsxs as m, jsx as t, Fragment as A } from "react/jsx-runtime";
+import { jsxs as m, jsx as t, Fragment as P } from "react/jsx-runtime";
 import { c as s } from "../../index-DIxK0V-G.js";
-import { useState as u, useRef as X, useCallback as g, useEffect as j } from "react";
-import { EDrawerPosition as v } from "./constants.js";
-import { useMediaQuery as P } from "../../hooks/useMediaQuery/useMediaQuery.js";
-import { EMediaQuery as Q } from "../../hooks/useMediaQuery/constants.js";
-import { useLockBodyScroll as F } from "../../hooks/useLockBodyScroll/useLockBodyScroll.js";
-import { useResizeObserver as G } from "../../hooks/useResizeObserver/useResizeObserver.js";
+import { useState as u, useRef as Q, useCallback as f, useEffect as F } from "react";
+import { EDrawerPosition as k } from "./constants.js";
+import { useMediaQuery as G } from "../../hooks/useMediaQuery/useMediaQuery.js";
+import { EMediaQuery as H } from "../../hooks/useMediaQuery/constants.js";
+import { useLockBodyScroll as K } from "../../hooks/useLockBodyScroll/useLockBodyScroll.js";
+import { useResizeObserver as V } from "../../hooks/useResizeObserver/useResizeObserver.js";
 import { Button as w } from "../Button/Button.js";
-import { EButtonVariantDefault as H, EButtonSize as n } from "../Button/constants.js";
-import { Loader as K } from "../Loader/Loader.js";
-import { Portal as O } from "../Portal/Portal.js";
-import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4d_27", Y = "_header_1xs4d_45", q = "_title_1xs4d_59", J = "_space_1xs4d_73", U = "_inner_1xs4d_84", Z = "_button_1xs4d_87", $ = "_footer_1xs4d_92", ee = "_left_1xs4d_105", te = "_right_1xs4d_109", oe = "_full_1xs4d_113", se = "_bottom_1xs4d_123", re = "_opened_1xs4d_140", ne = "_overlay_1xs4d_196", le = "_unmount_1xs4d_212", e = {
-  drawer: V,
-  content: W,
+import { EButtonVariantDefault as W, EButtonSize as n } from "../Button/constants.js";
+import { Loader as Y } from "../Loader/Loader.js";
+import { Portal as q } from "../Portal/Portal.js";
+import '../../assets/Drawer.css';const J = "_drawer_1xs4d_3", O = "_content_1xs4d_27", U = "_header_1xs4d_45", Z = "_title_1xs4d_59", $ = "_space_1xs4d_73", ee = "_inner_1xs4d_84", te = "_button_1xs4d_87", oe = "_footer_1xs4d_92", se = "_left_1xs4d_105", re = "_right_1xs4d_109", ne = "_full_1xs4d_113", le = "_bottom_1xs4d_123", ae = "_opened_1xs4d_140", ie = "_overlay_1xs4d_196", ce = "_unmount_1xs4d_212", e = {
+  drawer: J,
+  content: O,
   "is-loading": "_is-loading_1xs4d_41",
-  header: Y,
+  header: U,
   "sticky-header": "_sticky-header_1xs4d_53",
-  title: q,
-  space: J,
-  inner: U,
-  button: Z,
-  footer: $,
+  title: Z,
+  space: $,
+  inner: ee,
+  button: te,
+  footer: oe,
   "footer-button": "_footer-button_1xs4d_101",
-  left: ee,
-  right: te,
-  full: oe,
-  bottom: se,
+  left: se,
+  right: re,
+  full: ne,
+  bottom: le,
   "full-bottom-height": "_full-bottom-height_1xs4d_134",
-  opened: re,
+  opened: ae,
   "is-closing": "_is-closing_1xs4d_159",
-  overlay: ne,
-  unmount: le
-}, ie = 300, ge = ({
+  overlay: ie,
+  unmount: ce
+}, de = 300, ke = ({
   isOpen: r,
   onClose: l,
-  title: N,
-  className: k,
-  unmount: f = !0,
-  isLoading: i = !1,
+  title: E,
+  className: M,
+  unmount: h = !0,
+  isLoading: a = !1,
   stickyHeader: B,
-  fullBottomHeight: E = !1,
-  position: a = v.RIGHT,
-  paddingRight: M = 8,
+  fullBottomHeight: S = !1,
+  position: i = k.RIGHT,
+  paddingRight: I = 8,
   footer: c,
-  children: S,
-  classNameInner: I,
-  classNameFooter: C
+  children: L,
+  classNameInner: T,
+  classNameFooter: C,
+  closeOnClickOutside: x = !0,
+  showCloseButton: y = !0
 }) => {
-  const [L, h] = u(!1), [T, x] = u(!1), [D, p] = u(!1), y = X(), d = P(Q.XS1), { ref: z } = G({
-    enabled: a === v.BOTTOM
+  const [D, p] = u(!1), [z, b] = u(!1), [R, g] = u(!1), v = Q(), d = G(H.XS1), { ref: A } = V({
+    enabled: i === k.BOTTOM
   });
-  F({
-    on: D,
-    paddingRight: M
+  K({
+    on: R,
+    paddingRight: I
   });
-  const o = g(() => {
-    l && (h(!0), p(!1), y.current = setTimeout(() => {
-      l(), h(!1);
-    }, ie));
-  }, [l]), _ = g(
-    (R) => {
-      R.key === "Escape" && o();
+  const o = f(() => {
+    l && (p(!0), g(!1), v.current = setTimeout(() => {
+      l(), p(!1);
+    }, de));
+  }, [l]), X = f(() => {
+    x && o();
+  }, [x, o]), _ = f(
+    (j) => {
+      j.key === "Escape" && o();
     },
     [o]
   );
-  j(() => (r && (p(!0), x(!0), window.addEventListener("keydown", _)), () => {
-    x(!1), clearTimeout(y.current), window.removeEventListener("keydown", _);
+  F(() => (r && (g(!0), b(!0), window.addEventListener("keydown", _)), () => {
+    b(!1), clearTimeout(v.current), window.removeEventListener("keydown", _);
   }), [r, _]);
-  const b = {
-    [e.opened]: T,
-    [e["is-closing"]]: L,
-    [e["full-bottom-height"]]: E,
-    [e["is-loading"]]: i
+  const N = {
+    [e.opened]: z,
+    [e["is-closing"]]: D,
+    [e["full-bottom-height"]]: S,
+    [e["is-loading"]]: a
   };
-  return !r && f ? null : /* @__PURE__ */ m(O, { children: [
+  return !r && h ? null : /* @__PURE__ */ m(q, { children: [
     /* @__PURE__ */ t(
       "div",
       {
         "aria-hidden": !r,
         role: "dialog",
-        className: s(e.drawer, e[a], b, k),
+        className: s(e.drawer, e[i], N, M),
         children: /* @__PURE__ */ t(
           "section",
           {
-            ref: z,
-            className: s(e.content, e[a], {
-              [e["is-loading"]]: !!i
+            ref: A,
+            className: s(e.content, e[i], {
+              [e["is-loading"]]: !!a
             }),
-            children: i ? /* @__PURE__ */ t(K, {}) : /* @__PURE__ */ m(A, { children: [
+            children: a ? /* @__PURE__ */ t(Y, {}) : /* @__PURE__ */ m(P, { children: [
               /* @__PURE__ */ m(
                 "header",
                 {
@@ -95,11 +99,11 @@ import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4
                     [e["sticky-header"]]: B
                   }),
                   children: [
-                    /* @__PURE__ */ t("h2", { className: e.title, children: N }),
-                    /* @__PURE__ */ t("div", { className: e.space, children: /* @__PURE__ */ t(
+                    /* @__PURE__ */ t("h2", { className: e.title, children: E }),
+                    /* @__PURE__ */ t("div", { className: e.space, children: y && /* @__PURE__ */ t(
                       w,
                       {
-                        variant: H.SecondaryWhite,
+                        variant: W.SecondaryWhite,
                         isIconButton: !0,
                         size: d ? n.S : n.M,
                         iconName: "Close16px",
@@ -110,8 +114,8 @@ import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4
                   ]
                 }
               ),
-              /* @__PURE__ */ t("div", { className: s(e.inner, I), children: S }),
-              /* @__PURE__ */ t("footer", { className: s(e.footer, C), children: typeof c == "function" ? c({ handleClose: o }) : c || /* @__PURE__ */ t(
+              /* @__PURE__ */ t("div", { className: s(e.inner, T), children: L }),
+              /* @__PURE__ */ t("footer", { className: s(e.footer, C), children: typeof c == "function" ? c({ handleClose: o }) : c || y && /* @__PURE__ */ t(
                 w,
                 {
                   size: d ? n.M : n.XXL,
@@ -132,17 +136,17 @@ import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4
         className: s(
           e.overlay,
           {
-            [e.unmount]: !f
+            [e.unmount]: !h
           },
-          b
+          N
         ),
         "data-testid": "drawer-overlay",
-        onClick: o
+        onClick: X
       }
     )
   ] });
 };
 export {
-  ie as ANIMATION_DELAY,
-  ge as Drawer
+  de as ANIMATION_DELAY,
+  ke as Drawer
 };

package/package.json

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