@sberbusiness/triplex-next 1.34.0 → 1.35.1

package/components/MarkerStatus/MarkerStatus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkerStatus.js","sources":["../../../src/components/MarkerStatus/MarkerStatus.tsx"],"sourcesContent":["import React from \"react\";\nimport { Marker } from \"../Marker\";\nimport { EMarkerStatus } from \"../Marker/enums\";\nimport styles from \"./styles/MarkerStatus.module.less\";\nimport clsx from \"clsx\";\nimport { statusToClassNameMap } from \"../Marker/utils\";\nimport { ETextSize, ECaptionSize, Caption, Text, EFontType } from \"../Typography\";\nimport { EComponentSize } from \"../../enums/EComponentSize\";\nimport { createSizeToClassNameMap } from \"../../utils/classNameMaps\";\n\nexport interface IMarkerStatusProps extends React.HTMLAttributes<HTMLDivElement> {\n    /** Статус. */\n    status: EMarkerStatus;\n    /** Дополнительное описание под наименованием статуса. */\n    description?: React.ReactNode;\n    /** Размер. */\n    size?: EComponentSize.MD | EComponentSize.LG;\n}\n\nconst markerStatusSizeToTextSizeMap = {\n    [EComponentSize.MD]: ETextSize.B4,\n    [EComponentSize.LG]: ETextSize.B3,\n};\n\nconst sizeToClassNameMap = createSizeToClassNameMap(styles);\n\nexport const MarkerStatus = React.forwardRef<HTMLDivElement, IMarkerStatusProps>(\n    ({ children, className, description, status, size = EComponentSize.MD, ...restProps }, ref) => {\n        const classNames = clsx(styles.markerStatus, sizeToClassNameMap[size], statusToClassNameMap[status], className);\n\n        return (\n            <div className={classNames} data-tx={process.env.npm_package_version} {...restProps} ref={ref}>\n                <div className={styles.markerContainer}>\n                    <Marker status={status} size={size} />\n                </div>\n\n                <div className={styles.contentContainer}>\n                    <Text size={markerStatusSizeToTextSizeMap[size]}>{children}</Text>\n\n                    {description &&\n                        (size === EComponentSize.MD ? (\n                            <Caption size={ECaptionSize.C1} type={EFontType.SECONDARY}>\n                                {description}\n                            </Caption>\n                        ) : (\n                            <Text size={ETextSize.B4} type={EFontType.SECONDARY}>\n                                {description}\n                            </Text>\n                        ))}\n                </div>\n            </div>\n        );\n    },\n);\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,gCAAgC;AAAA,EAClC,CAAC,eAAe,EAAE,GAAG,UAAU;AAAA,EAC/B,CAAC,eAAe,EAAE,GAAG,UAAU;AACnC;AAEA,MAAM,qBAAqB,yBAAyB,MAAM;AAEnD,MAAM,eAAeA,eAAM;AAAA,EAC9B,CAAC,EAAE,UAAU,WAAW,aAAa,QAAQ,OAAO,eAAe,IAAI,GAAG,UAAA,GAAa,QAAQ;AAC3F,UAAM,aAAa,KAAK,OAAO,cAAc,mBAAmB,IAAI,GAAG,qBAAqB,MAAM,GAAG,SAAS;AAE9G,WACI,qBAAC,OAAA,EAAI,WAAW,YAAY,WAAS,UAAkC,GAAG,WAAW,KACjF,UAAA;AAAA,MAAA,oBAAC,OAAA,EAAI,WAAW,OAAO,iBACnB,8BAAC,QAAA,EAAO,QAAgB,KAAA,CAAY,GACxC;AAAA,2BAEC,OAAA,EAAI,WAAW,OAAO,kBACnB,UAAA;AAAA,QAAA,oBAAC,MAAA,EAAK,MAAM,8BAA8B,IAAI,GAAI,UAAS;AAAA,QAE1D,gBACI,SAAS,eAAe,yBACpB,SAAA,EAAQ,MAAM,aAAa,IAAI,MAAM,UAAU,WAC3C,UAAA,YAAA,CACL,wBAEC,MAAA,EAAK,MAAM,UAAU,IAAI,MAAM,UAAU,WACrC,UAAA,YAAA,CACL;AAAA,MAAA,GAEZ;AAAA,IAAA,GACJ;AAAA,EAER;AACJ;"}

package/components/MarkerStatus/index.js

@@ -1,5 +1,5 @@
-import { MarkerStatus as a } from "./MarkerStatus.js";
+import { MarkerStatus } from "./MarkerStatus.js";
 export {
-  a as MarkerStatus
+  MarkerStatus
 };
 //# sourceMappingURL=index.js.map

package/components/MarkerStatus/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/MediaWidth/MediaBetweenWidth.js

@@ -1,9 +1,12 @@
-import { useMatchMedia as r } from "./useMatchMedia.js";
-const o = ({ children: n, fallback: i, minWidth: e, maxWidth: t }) => r(
-  `(max-width: ${t}) and (min-width: ${e})`,
-  window.innerWidth >= parseInt(e) && window.innerWidth <= parseInt(t)
-) ? n : i;
+import { useMatchMedia } from "./useMatchMedia.js";
+const MediaBetweenWidth = ({ children, fallback, minWidth, maxWidth }) => {
+  const matches = useMatchMedia(
+    `(max-width: ${maxWidth}) and (min-width: ${minWidth})`,
+    window.innerWidth >= parseInt(minWidth) && window.innerWidth <= parseInt(maxWidth)
+  );
+  return matches ? children : fallback;
+};
 export {
-  o as MediaBetweenWidth
+  MediaBetweenWidth
 };
 //# sourceMappingURL=MediaBetweenWidth.js.map

package/components/MediaWidth/MediaBetweenWidth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaBetweenWidth.js","sources":["../../../src/components/MediaWidth/MediaBetweenWidth.tsx"],"sourcesContent":["import React from \"react\";\nimport { EScreenWidth } from \"@sberbusiness/triplex-next/helpers/breakpoints\";\nimport { useMatchMedia } from \"@sberbusiness/triplex-next/components/MediaWidth/useMatchMedia\";\n\n/**\n * Свойства MediaBetweenWidth.\n */\ninterface IMediaBetweenWidthProps {\n    /** Элементы, которые рендерятся, когда ширина окна браузера попадает в диапазон minWidth и/или maxWidth. */\n    children: React.ReactElement | null;\n    /** Минимальная ширина экран, при которой будут отрендерены children. */\n    minWidth: EScreenWidth;\n    /** Максимальная ширина экран, при которой будут отрендерены children. */\n    maxWidth: EScreenWidth;\n    /** Элементы, которые рендерятся, когда ширина окна браузера не попадает в диапазон minWidth и/или maxWidth. */\n    fallback: React.ReactElement | null;\n}\n\n/**\n * Компонент, который рендерит children в случае, если ширина окна браузера попадает в диапазон между minWidth и maxWidth.\n * В противном случае рендерится fallback.\n */\nexport const MediaBetweenWidth: React.FC<IMediaBetweenWidthProps> = ({ children, fallback, minWidth, maxWidth }) => {\n    const matches = useMatchMedia(\n        `(max-width: ${maxWidth}) and (min-width: ${minWidth})`,\n        window.innerWidth >= parseInt(minWidth) && window.innerWidth <= parseInt(maxWidth),\n    );\n\n    return matches ? children : fallback;\n};\n"],"names":[],"mappings":";AAsBO,MAAM,oBAAuD,CAAC,EAAE,UAAU,UAAU,UAAU,eAAe;AAChH,QAAM,UAAU;AAAA,IACZ,eAAe,QAAQ,qBAAqB,QAAQ;AAAA,IACpD,OAAO,cAAc,SAAS,QAAQ,KAAK,OAAO,cAAc,SAAS,QAAQ;AAAA,EAAA;AAGrF,SAAO,UAAU,WAAW;AAChC;"}

package/components/MediaWidth/MediaMaxWidth.js

@@ -1,6 +1,9 @@
-import { useMatchMedia as i } from "./useMatchMedia.js";
-const o = ({ children: e, fallback: a, maxWidth: t }) => i(`(max-width: ${t})`, window.innerWidth <= parseInt(t)) ? e : a;
+import { useMatchMedia } from "./useMatchMedia.js";
+const MediaMaxWidth = ({ children, fallback, maxWidth }) => {
+  const matches = useMatchMedia(`(max-width: ${maxWidth})`, window.innerWidth <= parseInt(maxWidth));
+  return matches ? children : fallback;
+};
 export {
-  o as MediaMaxWidth
+  MediaMaxWidth
 };
 //# sourceMappingURL=MediaMaxWidth.js.map

package/components/MediaWidth/MediaMaxWidth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaMaxWidth.js","sources":["../../../src/components/MediaWidth/MediaMaxWidth.tsx"],"sourcesContent":["import React from \"react\";\nimport { EScreenWidth } from \"@sberbusiness/triplex-next/helpers/breakpoints\";\nimport { useMatchMedia } from \"@sberbusiness/triplex-next/components/MediaWidth/useMatchMedia\";\n\n/**\n * Свойства MediaMaxWidth.\n */\ninterface IMediaMaxWidthProps {\n    /** Элементы, которые рендерятся, когда ширина окна браузера соответствует значению maxWidth. */\n    children: React.ReactElement | null;\n    /** Максимальная ширина экран, при которой будут отрендерены children. */\n    maxWidth: EScreenWidth;\n    /** Элементы, которые рендерятся, когда ширина окна браузера не попадает в диапазон minWidth и/или maxWidth. */\n    fallback: React.ReactElement | null;\n}\n\n/**\n * Компонент, который рендерит children в случае, если ширина окна браузера соответствует значению maxWidth.\n * В противном случае рендерится fallback.\n */\nexport const MediaMaxWidth: React.FC<IMediaMaxWidthProps> = ({ children, fallback, maxWidth }) => {\n    const matches = useMatchMedia(`(max-width: ${maxWidth})`, window.innerWidth <= parseInt(maxWidth));\n\n    return matches ? children : fallback;\n};\n"],"names":[],"mappings":";AAoBO,MAAM,gBAA+C,CAAC,EAAE,UAAU,UAAU,eAAe;AAC9F,QAAM,UAAU,cAAc,eAAe,QAAQ,KAAK,OAAO,cAAc,SAAS,QAAQ,CAAC;AAEjG,SAAO,UAAU,WAAW;AAChC;"}

package/components/MediaWidth/MediaMinWidth.js

@@ -1,6 +1,9 @@
-import { useMatchMedia as n } from "./useMatchMedia.js";
-const o = ({ children: e, fallback: i, minWidth: t }) => n(`(min-width: ${t})`, window.innerWidth >= parseInt(t)) ? e : i;
+import { useMatchMedia } from "./useMatchMedia.js";
+const MediaMinWidth = ({ children, fallback, minWidth }) => {
+  const matches = useMatchMedia(`(min-width: ${minWidth})`, window.innerWidth >= parseInt(minWidth));
+  return matches ? children : fallback;
+};
 export {
-  o as MediaMinWidth
+  MediaMinWidth
 };
 //# sourceMappingURL=MediaMinWidth.js.map

package/components/MediaWidth/MediaMinWidth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaMinWidth.js","sources":["../../../src/components/MediaWidth/MediaMinWidth.tsx"],"sourcesContent":["import React from \"react\";\nimport { EScreenWidth } from \"@sberbusiness/triplex-next/helpers/breakpoints\";\nimport { useMatchMedia } from \"@sberbusiness/triplex-next/components/MediaWidth/useMatchMedia\";\n\n/**\n * Свойства MediaMinWidth.\n */\ninterface IMediaMinWidthProps {\n    /** Элементы, которые рендерятся, когда ширина окна браузера соответствует значению minWidth. */\n    children: React.ReactElement | null;\n    /** Минимальная ширина экран, при которой будут отрендерены children. */\n    minWidth: EScreenWidth;\n    /** Элементы, которые рендерятся, когда ширина окна браузера не попадает в диапазон minWidth и/или maxWidth. */\n    fallback: React.ReactElement | null;\n}\n\n/**\n * Компонент, который рендерит children в случае, если ширина окна браузера соответствует значению minWidth.\n * В противном случае рендерится fallback.\n */\nexport const MediaMinWidth: React.FC<IMediaMinWidthProps> = ({ children, fallback, minWidth }) => {\n    const matches = useMatchMedia(`(min-width: ${minWidth})`, window.innerWidth >= parseInt(minWidth));\n\n    return matches ? children : fallback;\n};\n"],"names":[],"mappings":";AAoBO,MAAM,gBAA+C,CAAC,EAAE,UAAU,UAAU,eAAe;AAC9F,QAAM,UAAU,cAAc,eAAe,QAAQ,KAAK,OAAO,cAAc,SAAS,QAAQ,CAAC;AAEjG,SAAO,UAAU,WAAW;AAChC;"}

package/components/MediaWidth/MediaWidth.js

@@ -1,10 +1,19 @@
-import { jsx as i } from "react/jsx-runtime";
-import { MediaMaxWidth as p } from "./MediaMaxWidth.js";
-import { MediaMinWidth as M } from "./MediaMinWidth.js";
-import { MediaBetweenWidth as f } from "./MediaBetweenWidth.js";
+import { jsx } from "react/jsx-runtime";
+import { MediaMaxWidth } from "./MediaMaxWidth.js";
+import { MediaMinWidth } from "./MediaMinWidth.js";
+import { MediaBetweenWidth } from "./MediaBetweenWidth.js";
 import "./useMatchMedia.js";
-const w = ({ children: t, fallback: r, maxWidth: e, minWidth: o }) => o && e ? /* @__PURE__ */ i(f, { minWidth: o, maxWidth: e, fallback: r, children: t }) : o ? /* @__PURE__ */ i(M, { minWidth: o, fallback: r, children: t }) : e ? /* @__PURE__ */ i(p, { maxWidth: e, fallback: r, children: t }) : r;
+const MediaWidth = ({ children, fallback, maxWidth, minWidth }) => {
+  if (minWidth && maxWidth) {
+    return /* @__PURE__ */ jsx(MediaBetweenWidth, { minWidth, maxWidth, fallback, children });
+  } else if (minWidth) {
+    return /* @__PURE__ */ jsx(MediaMinWidth, { minWidth, fallback, children });
+  } else if (maxWidth) {
+    return /* @__PURE__ */ jsx(MediaMaxWidth, { maxWidth, fallback, children });
+  }
+  return fallback;
+};
 export {
-  w as MediaWidth
+  MediaWidth
 };
 //# sourceMappingURL=MediaWidth.js.map

package/components/MediaWidth/MediaWidth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaWidth.js","sources":["../../../src/components/MediaWidth/MediaWidth.tsx"],"sourcesContent":["import React from \"react\";\nimport { EScreenWidth } from \"../../helpers/breakpoints\";\nimport { MediaMaxWidth } from \"./MediaMaxWidth\";\nimport { MediaMinWidth } from \"./MediaMinWidth\";\nimport { MediaBetweenWidth } from \"./MediaBetweenWidth\";\n\n/**\n * Свойства MediaWidth.\n */\ninterface IMediaProps {\n    /** Элементы, которые рендерятся, когда ширина окна браузера попадает в диапазон minWidth и/или maxWidth. */\n    children: React.ReactElement | null;\n    /** Минимальная ширина экран, при которой будут отрендерены children. */\n    minWidth?: EScreenWidth;\n    /** Максимальная ширина экран, при которой будут отрендерены children. */\n    maxWidth?: EScreenWidth;\n    /** Элементы, которые рендерятся, когда ширина окна браузера не попадает в диапазон minWidth и/или maxWidth. */\n    fallback: React.ReactElement | null;\n}\n\n/**\n * Компонент, который рендерит элементы в зависимости от ширины окна браузера.\n */\nexport const MediaWidth: React.FC<IMediaProps> = ({ children, fallback, maxWidth, minWidth }) => {\n    if (minWidth && maxWidth) {\n        return (\n            <MediaBetweenWidth minWidth={minWidth} maxWidth={maxWidth} fallback={fallback}>\n                {children}\n            </MediaBetweenWidth>\n        );\n    } else if (minWidth) {\n        return (\n            <MediaMinWidth minWidth={minWidth} fallback={fallback}>\n                {children}\n            </MediaMinWidth>\n        );\n    } else if (maxWidth) {\n        return (\n            <MediaMaxWidth maxWidth={maxWidth} fallback={fallback}>\n                {children}\n            </MediaMaxWidth>\n        );\n    }\n\n    return fallback;\n};\n"],"names":[],"mappings":";;;;;AAuBO,MAAM,aAAoC,CAAC,EAAE,UAAU,UAAU,UAAU,eAAe;AAC7F,MAAI,YAAY,UAAU;AACtB,WACI,oBAAC,mBAAA,EAAkB,UAAoB,UAAoB,UACtD,UACL;AAAA,EAER,WAAW,UAAU;AACjB,WACI,oBAAC,eAAA,EAAc,UAAoB,UAC9B,SAAA,CACL;AAAA,EAER,WAAW,UAAU;AACjB,WACI,oBAAC,eAAA,EAAc,UAAoB,UAC9B,SAAA,CACL;AAAA,EAER;AAEA,SAAO;AACX;"}

package/components/MediaWidth/index.js

@@ -1,13 +1,13 @@
-import { MediaWidth as i } from "./MediaWidth.js";
-import { MediaMaxWidth as r } from "./MediaMaxWidth.js";
-import { MediaMinWidth as M } from "./MediaMinWidth.js";
-import { MediaBetweenWidth as x } from "./MediaBetweenWidth.js";
-import { useMatchMedia as h } from "./useMatchMedia.js";
+import { MediaWidth } from "./MediaWidth.js";
+import { MediaMaxWidth } from "./MediaMaxWidth.js";
+import { MediaMinWidth } from "./MediaMinWidth.js";
+import { MediaBetweenWidth } from "./MediaBetweenWidth.js";
+import { useMatchMedia } from "./useMatchMedia.js";
 export {
-  x as MediaBetweenWidth,
-  r as MediaMaxWidth,
-  M as MediaMinWidth,
-  i as MediaWidth,
-  h as useMatchMedia
+  MediaBetweenWidth,
+  MediaMaxWidth,
+  MediaMinWidth,
+  MediaWidth,
+  useMatchMedia
 };
 //# sourceMappingURL=index.js.map

package/components/MediaWidth/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/components/MediaWidth/useMatchMedia.js

@@ -1,14 +1,17 @@
-import { useState as r, useEffect as i } from "react";
-function d(e, a) {
-  const [s, c] = r(a);
-  return i(() => {
-    const t = window.matchMedia(e), n = (h) => c(h.matches);
-    return t.addEventListener("change", n), () => {
-      t.removeEventListener("change", n);
+import { useState, useEffect } from "react";
+function useMatchMedia(query, initialMatch) {
+  const [matches, setMatches] = useState(initialMatch);
+  useEffect(() => {
+    const mediaQueryList = window.matchMedia(query);
+    const handleChangeMatches = (event) => setMatches(event.matches);
+    mediaQueryList.addEventListener("change", handleChangeMatches);
+    return () => {
+      mediaQueryList.removeEventListener("change", handleChangeMatches);
     };
-  }, [e]), s;
+  }, [query]);
+  return matches;
 }
 export {
-  d as useMatchMedia
+  useMatchMedia
 };
 //# sourceMappingURL=useMatchMedia.js.map

package/components/MediaWidth/useMatchMedia.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMatchMedia.js","sources":["../../../src/components/MediaWidth/useMatchMedia.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\n/**\n * Хук для императивного выполнения и отслеживания media queries\n * @param query Media query\n * @param initial Начальное значение\n * @returns Результат window.matchMedia(query)\n */\nexport function useMatchMedia(query: string, initialMatch: boolean): boolean {\n    const [matches, setMatches] = useState(initialMatch);\n\n    useEffect(() => {\n        const mediaQueryList = window.matchMedia(query);\n        const handleChangeMatches = (event: MediaQueryListEvent) => setMatches(event.matches);\n\n        mediaQueryList.addEventListener(\"change\", handleChangeMatches);\n\n        return () => {\n            mediaQueryList.removeEventListener(\"change\", handleChangeMatches);\n        };\n    }, [query]);\n\n    return matches;\n}\n"],"names":[],"mappings":";AAQO,SAAS,cAAc,OAAe,cAAgC;AACzE,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,YAAY;AAEnD,YAAU,MAAM;AACZ,UAAM,iBAAiB,OAAO,WAAW,KAAK;AAC9C,UAAM,sBAAsB,CAAC,UAA+B,WAAW,MAAM,OAAO;AAEpF,mBAAe,iBAAiB,UAAU,mBAAmB;AAE7D,WAAO,MAAM;AACT,qBAAe,oBAAoB,UAAU,mBAAmB;AAAA,IACpE;AAAA,EACJ,GAAG,CAAC,KAAK,CAAC;AAEV,SAAO;AACX;"}

package/components/MobileView/MobileView.js

@@ -1,8 +1,8 @@
-import { jsx as r } from "react/jsx-runtime";
-import { EScreenWidth as t } from "../../helpers/breakpoints.js";
-import { MediaWidth as m } from "../MediaWidth/MediaWidth.js";
-const M = ({ children: i, fallback: o }) => /* @__PURE__ */ r(m, { maxWidth: t.SM_MAX, fallback: o, children: i });
+import { jsx } from "react/jsx-runtime";
+import { EScreenWidth } from "../../helpers/breakpoints.js";
+import { MediaWidth } from "../MediaWidth/MediaWidth.js";
+const MobileView = ({ children, fallback }) => /* @__PURE__ */ jsx(MediaWidth, { maxWidth: EScreenWidth.SM_MAX, fallback, children });
 export {
-  M as MobileView
+  MobileView
 };
 //# sourceMappingURL=MobileView.js.map

package/components/MobileView/MobileView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobileView.js","sources":["../../../src/components/MobileView/MobileView.tsx"],"sourcesContent":["import React from \"react\";\nimport { EScreenWidth } from \"../../helpers/breakpoints\";\nimport { MediaWidth } from \"../MediaWidth\";\n\n/** Свойства компонента MobileView. */\nexport interface IMobileViewProps {\n    /** Элементы, которые рендерятся, когда ширина окна браузера соответствует ширине мобильного устройства (<768px). */\n    children: React.ReactElement | null;\n    /** Элементы, которые рендерятся, когда ширина окна браузера не соответствует ширине мобильного устройства (<768px). */\n    fallback: React.ReactElement | null;\n}\n\n/**\n * Компонент, который рендерит children в случае просмотра на мобильном устройстве.\n * В противном случае рендерится fallback.\n */\nexport const MobileView: React.FC<IMobileViewProps> = ({ children, fallback }) => (\n    <MediaWidth maxWidth={EScreenWidth.SM_MAX} fallback={fallback}>\n        {children}\n    </MediaWidth>\n);\n"],"names":[],"mappings":";;;AAgBO,MAAM,aAAyC,CAAC,EAAE,UAAU,SAAA,MAC/D,oBAAC,YAAA,EAAW,UAAU,aAAa,QAAQ,UACtC,SAAA,CACL;"}

package/components/MobileView/index.js

@@ -1,7 +1,7 @@
-import { MobileView as i } from "./MobileView.js";
-import { useMobileView as b } from "./useMobileView.js";
+import { MobileView } from "./MobileView.js";
+import { useMobileView } from "./useMobileView.js";
 export {
-  i as MobileView,
-  b as useMobileView
+  MobileView,
+  useMobileView
 };
 //# sourceMappingURL=index.js.map

package/components/MobileView/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/components/MobileView/useMobileView.js

@@ -1,10 +1,11 @@
-import { useMatchMedia as e } from "../MediaWidth/useMatchMedia.js";
-import { EScreenWidth as o } from "../../helpers/breakpoints.js";
-const t = `(max-width: ${o.SM_MAX})`, r = () => {
-  const i = window.matchMedia(t).matches;
-  return e(t, i);
+import { useMatchMedia } from "../MediaWidth/useMatchMedia.js";
+import { EScreenWidth } from "../../helpers/breakpoints.js";
+const MOBILE_QUERY = `(max-width: ${EScreenWidth.SM_MAX})`;
+const useMobileView = () => {
+  const initialMatch = window.matchMedia(MOBILE_QUERY).matches;
+  return useMatchMedia(MOBILE_QUERY, initialMatch);
 };
 export {
-  r as useMobileView
+  useMobileView
 };
 //# sourceMappingURL=useMobileView.js.map

package/components/MobileView/useMobileView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMobileView.js","sources":["../../../src/components/MobileView/useMobileView.tsx"],"sourcesContent":["import { useMatchMedia } from \"../MediaWidth/useMatchMedia\";\nimport { EScreenWidth } from \"../../helpers/breakpoints\";\n\n/** Медиа-запрос для проверки мобильного экрана. */\nconst MOBILE_QUERY = `(max-width: ${EScreenWidth.SM_MAX})`;\n\n/**\n * Хук для проверки, является ли устройство мобильным (экран <= SM_MAX).\n * @returns true, если ширина экрана соответствует мобильному устройству\n */\nexport const useMobileView = () => {\n    const initialMatch = window.matchMedia(MOBILE_QUERY).matches;\n    return useMatchMedia(MOBILE_QUERY, initialMatch);\n};\n"],"names":[],"mappings":";;AAIA,MAAM,eAAe,eAAe,aAAa,MAAM;AAMhD,MAAM,gBAAgB,MAAM;AAC/B,QAAM,eAAe,OAAO,WAAW,YAAY,EAAE;AACrD,SAAO,cAAc,cAAc,YAAY;AACnD;"}

package/components/ModalWindow/ModalWindow.js

@@ -1,82 +1,123 @@
-import { jsxs as l, Fragment as T, jsx as n } from "react/jsx-runtime";
-import g, { useState as z, useEffect as L } from "react";
-import { c as u, C as $ } from "../../chunks/vendor-D5cfSbgz.js";
-import { Portal as B } from "../Portal/Portal.js";
-import { FocusTrapExtended as R } from "../FocusTrapExtended/FocusTrapExtended.js";
-import { ModalWindowViewManager as j } from "./components/ModalWindowViewManager.js";
-import { useToken as k } from "../ThemeProvider/useToken.js";
-import { EComponentSize as F } from "../../enums/EComponentSize.js";
-import { createSizeToClassNameMap as P } from "../../utils/classNameMaps.js";
-import { s as a } from "../../chunks/ModalWindow.module-BKssph_P.js";
-const m = "ufs-modal-window", _ = 300, i = ["modal-open", "no-hash-overflow-hidden"], q = P(a), A = () => {
-  let t = document.querySelector(`#${m}-wrapper`);
-  t || (t = document.createElement("div"), t.setAttribute("id", `${m}-wrapper`), document.body.appendChild(t));
-  const e = document.createElement("div");
-  return e.className = `${m}-portal-node`, t.appendChild(e), e;
-}, D = g.forwardRef((t, e) => {
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import React__default, { useState, useRef, useEffect } from "react";
+import { c as clsx, C as CSSTransition } from "../../chunks/vendor-Bco_z_Yi.js";
+import { Portal } from "../Portal/Portal.js";
+import { FocusTrapExtended } from "../FocusTrapExtended/FocusTrapExtended.js";
+import { ModalWindowViewManager } from "./components/ModalWindowViewManager.js";
+import { useToken } from "../ThemeProvider/useToken.js";
+import { EComponentSize } from "../../enums/EComponentSize.js";
+import { createSizeToClassNameMap } from "../../utils/classNameMaps.js";
+import { s as styles } from "../../chunks/ModalWindow.module-YB39njCQ.js";
+const modalNodeName = "ufs-modal-window";
+const animationExitTime = 300;
+const bodyClassNameModalOpen = ["modal-open", "no-hash-overflow-hidden"];
+const sizeToClassNameMap = createSizeToClassNameMap(styles);
+const getOrCreateWrapperNode = () => {
+  let wrapperNode = document.querySelector(`#${modalNodeName}-wrapper`);
+  if (!wrapperNode) {
+    wrapperNode = document.createElement("div");
+    wrapperNode.setAttribute("id", `${modalNodeName}-wrapper`);
+    document.body.appendChild(wrapperNode);
+  }
+  return wrapperNode;
+};
+const getOrCreateMountNode = () => {
+  const node = document.createElement("div");
+  node.className = `${modalNodeName}-portal-node`;
+  getOrCreateWrapperNode().appendChild(node);
+  return node;
+};
+const ModalWindow = React__default.forwardRef((props, ref) => {
   const {
-    isOpen: c,
-    children: f,
-    containerClassName: N,
-    focusTrapProps: s,
-    onExited: d,
-    closeButton: w,
-    size: C = F.MD,
-    className: h,
-    topPosition: y = 100,
-    ...v
-  } = t, M = { "--modal-window-top": `${y}px` }, [r] = z(A), { scopeClassName: W } = k(), p = () => {
-    const o = document.body.classList;
-    o.contains(i[0]) && o.remove(...i);
-  }, x = () => {
-    const o = document.body.classList;
-    o.contains(i[0]) || o.add(...i);
-  }, E = () => {
-    p(), d == null || d();
-  }, b = (o) => {
-    typeof e == "function" ? e(o) : e && (e.current = o);
+    isOpen,
+    children,
+    containerClassName,
+    focusTrapProps,
+    onExited,
+    closeButton,
+    size = EComponentSize.MD,
+    className,
+    topPosition = 100,
+    ...rest
+  } = props;
+  const topPositionStyle = { "--modal-window-top": `${topPosition}px` };
+  const [mountNode] = useState(getOrCreateMountNode);
+  const dialogRef = useRef(null);
+  const { scopeClassName } = useToken();
+  const removeBodyClasses = () => {
+    const bodyClassList = document.body.classList;
+    if (bodyClassList.contains(bodyClassNameModalOpen[0])) {
+      bodyClassList.remove(...bodyClassNameModalOpen);
+    }
+  };
+  const handleOpenModal = () => {
+    const bodyClassList = document.body.classList;
+    if (!bodyClassList.contains(bodyClassNameModalOpen[0])) {
+      bodyClassList.add(...bodyClassNameModalOpen);
+    }
+  };
+  const handleCloseModal = () => {
+    removeBodyClasses();
+    onExited == null ? void 0 : onExited();
+  };
+  const setRef = (instance) => {
+    dialogRef.current = instance;
+    if (typeof ref === "function") {
+      ref(instance);
+    } else if (ref) {
+      ref.current = instance;
+    }
   };
-  L(() => () => {
-    var o;
-    (o = r.parentNode) == null || o.removeChild(r), p();
-  }, [r]);
-  const O = u(W, a.modalWindowContainer, N), S = u(a.modalWindow, q[C], h);
-  return /* @__PURE__ */ l(T, { children: [
-    /* @__PURE__ */ n(B, { container: r, children: /* @__PURE__ */ n(
-      $,
+  useEffect(() => {
+    if (!mountNode.parentNode) {
+      getOrCreateWrapperNode().appendChild(mountNode);
+    }
+    return () => {
+      var _a;
+      (_a = mountNode.parentNode) == null ? void 0 : _a.removeChild(mountNode);
+      removeBodyClasses();
+    };
+  }, [mountNode]);
+  const classNameContainer = clsx(scopeClassName, styles.modalWindowContainer, containerClassName);
+  const classNameModalWindow = clsx(styles.modalWindow, sizeToClassNameMap[size], className);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Portal, { container: mountNode, children: /* @__PURE__ */ jsx(
+      CSSTransition,
       {
-        in: c,
-        timeout: _,
+        in: isOpen,
+        timeout: animationExitTime,
         classNames: "global-modalWindowTransition",
-        appear: !0,
-        enter: !0,
-        exit: !0,
-        onEnter: x,
-        onExited: E,
-        mountOnEnter: !0,
-        unmountOnExit: !0,
-        children: /* @__PURE__ */ n(
-          R,
+        appear: true,
+        enter: true,
+        exit: true,
+        onEnter: handleOpenModal,
+        onExited: handleCloseModal,
+        mountOnEnter: true,
+        unmountOnExit: true,
+        children: /* @__PURE__ */ jsx(
+          FocusTrapExtended,
           {
-            active: c,
-            ...s,
+            active: isOpen,
+            ...focusTrapProps,
             focusTrapOptions: {
-              preventScroll: !0,
-              ...s == null ? void 0 : s.focusTrapOptions
+              preventScroll: true,
+              fallbackFocus: () => dialogRef.current,
+              ...focusTrapProps == null ? void 0 : focusTrapProps.focusTrapOptions
             },
-            children: /* @__PURE__ */ l("div", { className: O, style: M, children: [
-              /* @__PURE__ */ n("div", { className: a.modalWindowBackdrop }),
-              /* @__PURE__ */ n(
+            children: /* @__PURE__ */ jsxs("div", { className: classNameContainer, style: topPositionStyle, children: [
+              /* @__PURE__ */ jsx("div", { className: styles.modalWindowBackdrop }),
+              /* @__PURE__ */ jsx(
                 "div",
                 {
                   role: "dialog",
                   "aria-modal": "true",
-                  ...v,
-                  ref: b,
-                  className: S,
-                  children: /* @__PURE__ */ l("div", { className: a.modalWindowContentWrapper, children: [
-                    f,
-                    w
+                  tabIndex: -1,
+                  ...rest,
+                  ref: setRef,
+                  className: classNameModalWindow,
+                  children: /* @__PURE__ */ jsxs("div", { className: styles.modalWindowContentWrapper, children: [
+                    children,
+                    closeButton
                   ] })
                 }
               )
@@ -85,11 +126,11 @@ const m = "ufs-modal-window", _ = 300, i = ["modal-open", "no-hash-overflow-hidd
         )
       }
     ) }),
-    /* @__PURE__ */ n(j, {})
+    /* @__PURE__ */ jsx(ModalWindowViewManager, {})
   ] });
 });
-D.displayName = "ModalWindow";
+ModalWindow.displayName = "ModalWindow";
 export {
-  D as ModalWindow
+  ModalWindow
 };
 //# sourceMappingURL=ModalWindow.js.map

package/components/ModalWindow/ModalWindow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalWindow.js","sources":["../../../src/components/ModalWindow/ModalWindow.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { Portal } from \"../Portal\";\nimport { FocusTrapExtended, IFocusTrapExtendedProps } from \"../FocusTrapExtended\";\nimport { ModalWindowViewManager } from \"./components/ModalWindowViewManager\";\nimport { useToken } from \"../ThemeProvider/useToken\";\nimport { EComponentSize } from \"@sberbusiness/triplex-next/enums/EComponentSize\";\nimport { createSizeToClassNameMap } from \"@sberbusiness/triplex-next/utils/classNameMaps\";\nimport styles from \"./styles/ModalWindow.module.less\";\n\n/** Свойства компонента модального окна. */\nexport interface IModalWindowProps extends React.HTMLAttributes<HTMLDivElement> {\n    /** Открыто ли модальное окно. */\n    isOpen: boolean;\n    /** Содержимое модального окна. Обычно — `ModalWindowContent` с вложенными `ModalWindowHeader`, `ModalWindowBody`, `ModalWindowFooter`. */\n    children: React.ReactElement;\n    /** ClassName контейнера модального окна. */\n    containerClassName?: string;\n    /** Свойства компонента FocusTrapExtended. */\n    focusTrapProps?: IFocusTrapExtendedProps;\n    /** Callback после анимации закрытия модального окна. */\n    onExited?: () => void;\n    /** Кнопка закрыть. Обычно — `ModalWindowClose`. Рендерится внутри корневого dialog-элемента поверх контента. */\n    closeButton: React.ReactNode;\n    /** Размер модального окна. По умолчанию `EComponentSize.MD`. */\n    size?: EComponentSize;\n    /** Отступ сверху модального окна, px. По умолчанию `100`. */\n    topPosition?: number;\n}\n\n/** Имя класса для некоторых элементов связанных с компонентом. */\nconst modalNodeName = \"ufs-modal-window\";\n\n/** Время css-анимации скрытия модального окна. */\nconst animationExitTime = 300;\n\n/** Класс от Layout(сббола), который блюрит(blur) фоновый контент. */\nconst bodyClassNameModalOpen = [\"modal-open\", \"no-hash-overflow-hidden\"];\n\nconst sizeToClassNameMap = createSizeToClassNameMap(styles);\n\n/** Возвращает общий wrapper модалок в body, создавая его при первом обращении. */\nconst getOrCreateWrapperNode = (): HTMLDivElement => {\n    let wrapperNode = document.querySelector<HTMLDivElement>(`#${modalNodeName}-wrapper`);\n\n    if (!wrapperNode) {\n        wrapperNode = document.createElement(\"div\");\n        wrapperNode.setAttribute(\"id\", `${modalNodeName}-wrapper`);\n        document.body.appendChild(wrapperNode);\n    }\n\n    return wrapperNode;\n};\n\n/** Создаёт портальную ноду модалки и прикрепляет её к общему wrapper в body. */\nconst getOrCreateMountNode = (): HTMLDivElement => {\n    const node = document.createElement(\"div\");\n    node.className = `${modalNodeName}-portal-node`;\n    getOrCreateWrapperNode().appendChild(node);\n    return node;\n};\n\n/**\n * Модальное окно. Рендерится через Portal поверх контента страницы, добавляет\n * затемнённый backdrop, удерживает фокус внутри (FocusTrap) и блокирует скролл\n * `body` через классы `modal-open` + `no-hash-overflow-hidden`.\n */\nexport const ModalWindow = React.forwardRef<HTMLDivElement, IModalWindowProps>((props, ref) => {\n    const {\n        isOpen,\n        children,\n        containerClassName,\n        focusTrapProps,\n        onExited,\n        closeButton,\n        size = EComponentSize.MD,\n        className,\n        topPosition = 100,\n        ...rest\n    } = props;\n\n    // topPosition нужен, чтобы команда могла переопределить значение.\n    const topPositionStyle = { \"--modal-window-top\": `${topPosition}px` } as React.CSSProperties;\n\n    // Контейнер портала. Создаётся и сразу же прикрепляется к wrapper в DOM при первом рендере —\n    // это нужно, чтобы FocusTrap при mount нашёл tabbable-узлы внутри модалки (если делать attach\n    // позже, в onEnter CSSTransition, FocusTrap активируется раньше и падает с\n    // \"must have at least one container with at least one tabbable node\").\n    // Сама модалка скрывается/показывается через CSSTransition (mountOnEnter / unmountOnExit).\n    const [mountNode] = useState<HTMLDivElement>(getOrCreateMountNode);\n\n    // Узел role=\"dialog\". Используется как fallbackFocus для FocusTrap: ловушка активируется\n    // синхронно при открытии, и если внутри ещё нет tabbable-узлов (контент грузится асинхронно,\n    // показан лоадер и т.п.), focus-trap без fallback падает с\n    // \"must have at least one container with at least one tabbable node\".\n    // fallbackFocus вызывается только пока ловушка активна, то есть пока dialog смонтирован,\n    // а его ref проставляется до componentDidMount FocusTrap (потомок монтируется раньше родителя),\n    // поэтому dialogRef.current на момент вызова всегда заполнен — non-null assertion безопасен.\n    const dialogRef = useRef<HTMLDivElement | null>(null);\n\n    const { scopeClassName } = useToken();\n\n    /** Удаление стилей body. */\n    const removeBodyClasses = () => {\n        const bodyClassList = document.body.classList;\n\n        if (bodyClassList.contains(bodyClassNameModalOpen[0])) {\n            bodyClassList.remove(...bodyClassNameModalOpen);\n        }\n    };\n\n    /** Вспомогательный обработчик при открытии модального окна (CSSTransition onEnter). */\n    const handleOpenModal = () => {\n        const bodyClassList = document.body.classList;\n        if (!bodyClassList.contains(bodyClassNameModalOpen[0])) {\n            bodyClassList.add(...bodyClassNameModalOpen);\n        }\n    };\n\n    /** Вспомогательный обработчик после анимации закрытия модального окна (CSSTransition onExited). */\n    const handleCloseModal = () => {\n        removeBodyClasses();\n        onExited?.();\n    };\n\n    /** Установка ref. */\n    const setRef = (instance: HTMLDivElement | null) => {\n        dialogRef.current = instance;\n\n        if (typeof ref === \"function\") {\n            ref(instance);\n        } else if (ref) {\n            ref.current = instance;\n        }\n    };\n\n    useEffect(() => {\n        // В React 18 StrictMode (dev) компонент проходит цикл mount → unmount → mount.\n        // На искусственном unmount срабатывает cleanup ниже и открепляет mountNode, а\n        // инициализатор useState на повторном mount заново не вызывается (стейт сохраняется) —\n        // узел остаётся висеть вне DOM, и Portal рендерит модалку в невидимый контейнер.\n        // Поэтому при (повторном) mount возвращаем узел в wrapper, если он оказался откреплён.\n        if (!mountNode.parentNode) {\n            getOrCreateWrapperNode().appendChild(mountNode);\n        }\n\n        return () => {\n            mountNode.parentNode?.removeChild(mountNode);\n            removeBodyClasses();\n        };\n    }, [mountNode]);\n\n    const classNameContainer = clsx(scopeClassName, styles.modalWindowContainer, containerClassName);\n\n    const classNameModalWindow = clsx(styles.modalWindow, sizeToClassNameMap[size], className);\n\n    return (\n        <>\n            <Portal container={mountNode}>\n                <CSSTransition\n                    in={isOpen}\n                    timeout={animationExitTime}\n                    classNames=\"global-modalWindowTransition\"\n                    appear // Нужен для срабатывания onEnter.\n                    enter\n                    exit\n                    onEnter={handleOpenModal}\n                    onExited={handleCloseModal}\n                    mountOnEnter\n                    unmountOnExit\n                >\n                    <FocusTrapExtended\n                        active={isOpen}\n                        {...focusTrapProps}\n                        focusTrapOptions={{\n                            preventScroll: true,\n                            fallbackFocus: () => dialogRef.current!,\n                            ...focusTrapProps?.focusTrapOptions,\n                        }}\n                    >\n                        <div className={classNameContainer} style={topPositionStyle}>\n                            <div className={styles.modalWindowBackdrop} />\n                            <div\n                                role=\"dialog\"\n                                aria-modal=\"true\"\n                                // tabIndex нужен, чтобы dialog мог принять фокус как fallbackFocus\n                                // FocusTrap, когда внутри ещё нет tabbable-узлов.\n                                tabIndex={-1}\n                                {...rest}\n                                ref={setRef}\n                                className={classNameModalWindow}\n                            >\n                                <div className={styles.modalWindowContentWrapper}>\n                                    {children}\n                                    {closeButton}\n                                </div>\n                            </div>\n                        </div>\n                    </FocusTrapExtended>\n                </CSSTransition>\n            </Portal>\n            <ModalWindowViewManager />\n        </>\n    );\n});\n\nModalWindow.displayName = \"ModalWindow\";\n"],"names":["React"],"mappings":"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"}

package/components/ModalWindow/components/ModalWindowBody.js

@@ -1,22 +1,24 @@
-import { jsx as i } from "react/jsx-runtime";
-import { c as s } from "../../../chunks/vendor-D5cfSbgz.js";
-import { Island as a } from "../../Island/Island.js";
-import { EComponentSize as n } from "../../../enums/EComponentSize.js";
-import { EIslandType as l } from "../../Island/enums.js";
-const t = "modalWindowBody__7f589ddc", r = {
-  modalWindowBody: t
-}, p = ({ children: o, className: d, ...m }) => /* @__PURE__ */ i(
-  a,
+import { jsx } from "react/jsx-runtime";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { Island } from "../../Island/Island.js";
+import { EComponentSize } from "../../../enums/EComponentSize.js";
+import { EIslandType } from "../../Island/enums.js";
+const modalWindowBody = "modalWindowBody__9bbba6d1";
+const styles = {
+  modalWindowBody
+};
+const ModalWindowBody = ({ children, className, ...islandProps }) => /* @__PURE__ */ jsx(
+  Island,
   {
-    className: s(r.modalWindowBody, d),
-    type: l.TYPE_1,
-    size: n.MD,
-    ...m,
-    children: o
+    className: clsx(styles.modalWindowBody, className),
+    type: EIslandType.TYPE_1,
+    size: EComponentSize.MD,
+    ...islandProps,
+    children
   }
 );
-p.displayName = "ModalWindowBody";
+ModalWindowBody.displayName = "ModalWindowBody";
 export {
-  p as ModalWindowBody
+  ModalWindowBody
 };
 //# sourceMappingURL=ModalWindowBody.js.map

package/components/ModalWindow/components/ModalWindowBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalWindowBody.js","sources":["../../../../src/components/ModalWindow/components/ModalWindowBody.tsx"],"sourcesContent":["import React from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"../styles/ModalWindowBody.module.less\";\nimport { IIslandProps, Island } from \"../../Island/Island\";\nimport { EComponentSize } from \"../../../enums/EComponentSize\";\nimport { EIslandType } from \"../../Island/enums\";\n\nexport interface IModalWindowBodyProps extends IIslandProps {}\n\n/**\n * Тело модального окна. Обёртка над `Island` с фиксированными `type` и `size`,\n * размечающая основной скроллируемый контент между `ModalWindowHeader` и\n * `ModalWindowFooter`.\n */\nexport const ModalWindowBody: React.FC<IModalWindowBodyProps> = ({ children, className, ...islandProps }) => (\n    <Island\n        className={clsx(styles.modalWindowBody, className)}\n        type={EIslandType.TYPE_1}\n        size={EComponentSize.MD}\n        {...islandProps}\n    >\n        {children}\n    </Island>\n);\n\nModalWindowBody.displayName = \"ModalWindowBody\";\n"],"names":[],"mappings":";;;;;;;;;AAcO,MAAM,kBAAmD,CAAC,EAAE,UAAU,WAAW,GAAG,kBACvF;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,WAAW,KAAK,OAAO,iBAAiB,SAAS;AAAA,IACjD,MAAM,YAAY;AAAA,IAClB,MAAM,eAAe;AAAA,IACpB,GAAG;AAAA,IAEH;AAAA,EAAA;AACL;AAGJ,gBAAgB,cAAc;"}

package/components/ModalWindow/components/ModalWindowClose.js

@@ -1,28 +1,30 @@
-import { jsx as o } from "react/jsx-runtime";
-import { useRef as t } from "react";
-import { CrossStrokeSrvIcon20 as m } from "@sberbusiness/icons-next";
-import { Button as n } from "../../Button/Button.js";
-import { EButtonTheme as i } from "../../Button/enums.js";
-import { TriggerClickOnKeyDownEvent as l } from "../../Triggers/TriggerClickOnKeyDownEvent.js";
-import { EComponentSize as s } from "../../../enums/EComponentSize.js";
-import { EVENT_KEY_CODES as d } from "../../../utils/keyboard.js";
-const C = "modalWindowClose__23f40c0e", a = {
-  modalWindowClose: C
-}, f = (r) => {
-  const e = t(null);
-  return /* @__PURE__ */ o("div", { className: a.modalWindowClose, children: /* @__PURE__ */ o(l, { eventKeyCode: d.ESCAPE, targetRef: e, children: /* @__PURE__ */ o(
-    n,
+import { jsx } from "react/jsx-runtime";
+import { useRef } from "react";
+import { CrossStrokeSrvIcon20 } from "@sberbusiness/icons-next";
+import { Button } from "../../Button/Button.js";
+import { EButtonTheme } from "../../Button/enums.js";
+import { TriggerClickOnKeyDownEvent } from "../../Triggers/TriggerClickOnKeyDownEvent.js";
+import { EComponentSize } from "../../../enums/EComponentSize.js";
+import { EVENT_KEY_CODES } from "../../../utils/keyboard.js";
+const modalWindowClose = "modalWindowClose__d0ac389f";
+const styles = {
+  modalWindowClose
+};
+const ModalWindowClose = (props) => {
+  const ref = useRef(null);
+  return /* @__PURE__ */ jsx("div", { className: styles.modalWindowClose, children: /* @__PURE__ */ jsx(TriggerClickOnKeyDownEvent, { eventKeyCode: EVENT_KEY_CODES.ESCAPE, targetRef: ref, children: /* @__PURE__ */ jsx(
+    Button,
     {
-      ref: e,
-      icon: /* @__PURE__ */ o(m, { paletteIndex: 0 }),
-      ...r,
-      size: s.MD,
-      theme: i.SECONDARY
+      ref,
+      icon: /* @__PURE__ */ jsx(CrossStrokeSrvIcon20, { paletteIndex: 0 }),
+      ...props,
+      size: EComponentSize.MD,
+      theme: EButtonTheme.SECONDARY
     }
   ) }) });
 };
-f.displayName = "ModalWindowClose";
+ModalWindowClose.displayName = "ModalWindowClose";
 export {
-  f as ModalWindowClose
+  ModalWindowClose
 };
 //# sourceMappingURL=ModalWindowClose.js.map

package/components/ModalWindow/components/ModalWindowClose.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalWindowClose.js","sources":["../../../../src/components/ModalWindow/components/ModalWindowClose.tsx"],"sourcesContent":["import React, { useRef } from \"react\";\nimport { CrossStrokeSrvIcon20 } from \"@sberbusiness/icons-next\";\nimport { Button, IButtonSecondaryProps } from \"../../Button/Button\";\nimport { EButtonTheme } from \"../../Button/enums\";\nimport { TriggerClickOnKeyDownEvent } from \"../../Triggers/TriggerClickOnKeyDownEvent\";\nimport { EComponentSize } from \"../../../enums/EComponentSize\";\nimport { EVENT_KEY_CODES } from \"../../../utils/keyboard\";\nimport styles from \"../styles/ModalWindowClose.module.less\";\n\n/**\n * Свойства компонента кнопки закрытия модального окна.\n */\nexport interface IModalWindowCloseProps extends Omit<IButtonSecondaryProps, \"size\" | \"theme\" | \"icon\"> {}\n\n/**\n * Компонент кнопки закрытия модального окна.\n */\nexport const ModalWindowClose: React.FC<IModalWindowCloseProps> = (props) => {\n    const ref = useRef<HTMLButtonElement>(null);\n\n    return (\n        <div className={styles.modalWindowClose}>\n            <TriggerClickOnKeyDownEvent eventKeyCode={EVENT_KEY_CODES.ESCAPE} targetRef={ref}>\n                <Button\n                    ref={ref}\n                    icon={<CrossStrokeSrvIcon20 paletteIndex={0} />}\n                    {...props}\n                    size={EComponentSize.MD}\n                    theme={EButtonTheme.SECONDARY}\n                />\n            </TriggerClickOnKeyDownEvent>\n        </div>\n    );\n};\n\nModalWindowClose.displayName = \"ModalWindowClose\";\n"],"names":[],"mappings":";;;;;;;;;;;;AAiBO,MAAM,mBAAqD,CAAC,UAAU;AACzE,QAAM,MAAM,OAA0B,IAAI;AAE1C,SACI,oBAAC,OAAA,EAAI,WAAW,OAAO,kBACnB,UAAA,oBAAC,4BAAA,EAA2B,cAAc,gBAAgB,QAAQ,WAAW,KACzE,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG;AAAA,MACA,MAAM,oBAAC,sBAAA,EAAqB,cAAc,EAAA,CAAG;AAAA,MAC5C,GAAG;AAAA,MACJ,MAAM,eAAe;AAAA,MACrB,OAAO,aAAa;AAAA,IAAA;AAAA,EAAA,GAE5B,EAAA,CACJ;AAER;AAEA,iBAAiB,cAAc;"}