@sberbusiness/triplex-next 1.34.0 → 1.35.0

package/components/LightBox/LightBoxControls/LightBoxControls.js

@@ -1,15 +1,15 @@
-import { jsx as i } from "react/jsx-runtime";
-import { LightBoxClose as m } from "./LightBoxClose.js";
-import { LightBoxNext as l } from "./LightBoxNext.js";
-import { LightBoxPrev as x } from "./LightBoxPrev.js";
-import { c as e } from "../../../chunks/vendor-D5cfSbgz.js";
-import { s as p } from "../../../chunks/LightBoxControls.module-CzFWAOVn.js";
-const o = ({ children: t, className: r, ...s }) => /* @__PURE__ */ i("div", { className: e(r, p.lightBoxControls), ...s, "data-lightbox-component": "controls", children: t });
-o.displayName = "LightBoxControls";
-o.Close = m;
-o.Next = l;
-o.Prev = x;
+import { jsx } from "react/jsx-runtime";
+import { LightBoxClose } from "./LightBoxClose.js";
+import { LightBoxNext } from "./LightBoxNext.js";
+import { LightBoxPrev } from "./LightBoxPrev.js";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { s as styles } from "../../../chunks/LightBoxControls.module-DgcHB1jn.js";
+const LightBoxControls = ({ children, className, ...htmlDivAttributes }) => /* @__PURE__ */ jsx("div", { className: clsx(className, styles.lightBoxControls), ...htmlDivAttributes, "data-lightbox-component": "controls", children });
+LightBoxControls.displayName = "LightBoxControls";
+LightBoxControls.Close = LightBoxClose;
+LightBoxControls.Next = LightBoxNext;
+LightBoxControls.Prev = LightBoxPrev;
 export {
-  o as LightBoxControls
+  LightBoxControls
 };
 //# sourceMappingURL=LightBoxControls.js.map

package/components/LightBox/LightBoxControls/LightBoxControls.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxControls.js","sources":["../../../../src/components/LightBox/LightBoxControls/LightBoxControls.tsx"],"sourcesContent":["import React from \"react\";\nimport { LightBoxClose } from \"./LightBoxClose\";\nimport { LightBoxNext } from \"./LightBoxNext\";\nimport { LightBoxPrev } from \"./LightBoxPrev\";\nimport clsx from \"clsx\";\nimport styles from \"../styles/LightBoxControls.module.less\";\n\n/** Свойства компонента LightBoxControls. */\ninterface ILightBoxControlsProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport interface ILightBoxControlsFC extends React.FC<ILightBoxControlsProps> {\n    Close: typeof LightBoxClose;\n    Next: typeof LightBoxNext;\n    Prev: typeof LightBoxPrev;\n}\n\n/** Контейнер кнопок-действий (закрыть/вперед/назад). */\nexport const LightBoxControls: ILightBoxControlsFC = ({ children, className, ...htmlDivAttributes }) => (\n    <div className={clsx(className, styles.lightBoxControls)} {...htmlDivAttributes} data-lightbox-component=\"controls\">\n        {children}\n    </div>\n);\n\nLightBoxControls.displayName = \"LightBoxControls\";\nLightBoxControls.Close = LightBoxClose;\nLightBoxControls.Next = LightBoxNext;\nLightBoxControls.Prev = LightBoxPrev;\n"],"names":[],"mappings":";;;;;;AAiBO,MAAM,mBAAwC,CAAC,EAAE,UAAU,WAAW,GAAG,wBAC5E,oBAAC,OAAA,EAAI,WAAW,KAAK,WAAW,OAAO,gBAAgB,GAAI,GAAG,mBAAmB,2BAAwB,YACpG,SAAA,CACL;AAGJ,iBAAiB,cAAc;AAC/B,iBAAiB,QAAQ;AACzB,iBAAiB,OAAO;AACxB,iBAAiB,OAAO;"}

package/components/LightBox/LightBoxControls/LightBoxNext.js

@@ -1,58 +1,59 @@
-import { jsx as e, jsxs as x, Fragment as N } from "react/jsx-runtime";
-import { useRef as m } from "react";
-import { c as n } from "../../../chunks/vendor-D5cfSbgz.js";
-import { CaretrightStrokeSrvIcon32 as E, CaretrightStrokeSrvIcon20 as D } from "@sberbusiness/icons-next";
-import { TriggerClickOnKeyDownEvent as I } from "../../Triggers/TriggerClickOnKeyDownEvent.js";
-import { EVENT_KEY_CODES as R } from "../../../utils/keyboard.js";
-import { Button as c } from "../../Button/Button.js";
-import { EButtonTheme as s } from "../../Button/enums.js";
-import { EComponentSize as f } from "../../../enums/EComponentSize.js";
-import { s as o } from "../../../chunks/LightBoxControls.module-CzFWAOVn.js";
-const v = ({
-  className: g,
-  clickByArrowRight: u,
-  dataTutorialId: d,
-  onClick: r,
-  title: l,
-  ...B
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { useRef } from "react";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { CaretrightStrokeSrvIcon32, CaretrightStrokeSrvIcon20 } from "@sberbusiness/icons-next";
+import { TriggerClickOnKeyDownEvent } from "../../Triggers/TriggerClickOnKeyDownEvent.js";
+import { EVENT_KEY_CODES } from "../../../utils/keyboard.js";
+import { Button } from "../../Button/Button.js";
+import { EButtonTheme } from "../../Button/enums.js";
+import { EComponentSize } from "../../../enums/EComponentSize.js";
+import { s as styles } from "../../../chunks/LightBoxControls.module-DgcHB1jn.js";
+const LightBoxNext = ({
+  className,
+  clickByArrowRight,
+  dataTutorialId,
+  onClick,
+  title,
+  ...htmlDivAttributes
 }) => {
-  const h = m(null), i = (t) => /* @__PURE__ */ x(N, { children: [
-    /* @__PURE__ */ e(
-      c,
+  const ref = useRef(null);
+  const renderButton = (params) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Button,
       {
-        className: n(o.lightBoxControlsDesktop, o.lightBoxNextButton),
-        "data-test-id": t != null && t.addDataTestId ? "lightBox-next" : void 0,
-        "data-tutorial-id": d,
-        onClick: r,
-        title: l,
-        ref: t == null ? void 0 : t.buttonRef,
-        icon: /* @__PURE__ */ e(E, { paletteIndex: 0 }),
-        size: f.LG,
-        theme: s.SECONDARY_LIGHT
+        className: clsx(styles.lightBoxControlsDesktop, styles.lightBoxNextButton),
+        "data-test-id": (params == null ? void 0 : params.addDataTestId) ? "lightBox-next" : void 0,
+        "data-tutorial-id": dataTutorialId,
+        onClick,
+        title,
+        ref: params == null ? void 0 : params.buttonRef,
+        icon: /* @__PURE__ */ jsx(CaretrightStrokeSrvIcon32, { paletteIndex: 0 }),
+        size: EComponentSize.LG,
+        theme: EButtonTheme.SECONDARY_LIGHT
       }
     ),
-    /* @__PURE__ */ e(
-      c,
+    /* @__PURE__ */ jsx(
+      Button,
       {
-        className: n(o.lightBoxControlsMobile, o.lightBoxNextButton),
-        "data-test-id": t != null && t.addDataTestId ? "lightBox-next" : void 0,
-        "data-tutorial-id": d,
-        onClick: r,
-        title: l,
-        ref: t == null ? void 0 : t.buttonRef,
-        icon: /* @__PURE__ */ e(D, { paletteIndex: 0 }),
-        size: f.MD,
-        theme: s.SECONDARY_LIGHT
+        className: clsx(styles.lightBoxControlsMobile, styles.lightBoxNextButton),
+        "data-test-id": (params == null ? void 0 : params.addDataTestId) ? "lightBox-next" : void 0,
+        "data-tutorial-id": dataTutorialId,
+        onClick,
+        title,
+        ref: params == null ? void 0 : params.buttonRef,
+        icon: /* @__PURE__ */ jsx(CaretrightStrokeSrvIcon20, { paletteIndex: 0 }),
+        size: EComponentSize.MD,
+        theme: EButtonTheme.SECONDARY_LIGHT
       }
     )
   ] });
-  return /* @__PURE__ */ e("div", { className: n(g, o.lightBoxNext), ...B, children: u ? /* @__PURE__ */ x("span", { children: [
-    /* @__PURE__ */ e("span", { className: o.withKeyboardEvent, children: /* @__PURE__ */ e(I, { targetRef: h, eventKeyCode: R.ARROW_RIGHT, children: i({ addDataTestId: !0, buttonRef: h }) }) }),
-    /* @__PURE__ */ e("span", { className: o.withoutKeyboardEvent, children: i() })
-  ] }) : i({ addDataTestId: !0 }) });
+  return /* @__PURE__ */ jsx("div", { className: clsx(className, styles.lightBoxNext), ...htmlDivAttributes, children: clickByArrowRight ? /* @__PURE__ */ jsxs("span", { children: [
+    /* @__PURE__ */ jsx("span", { className: styles.withKeyboardEvent, children: /* @__PURE__ */ jsx(TriggerClickOnKeyDownEvent, { targetRef: ref, eventKeyCode: EVENT_KEY_CODES.ARROW_RIGHT, children: renderButton({ addDataTestId: true, buttonRef: ref }) }) }),
+    /* @__PURE__ */ jsx("span", { className: styles.withoutKeyboardEvent, children: renderButton() })
+  ] }) : renderButton({ addDataTestId: true }) });
 };
-v.displayName = "LightBoxNext";
+LightBoxNext.displayName = "LightBoxNext";
 export {
-  v as LightBoxNext
+  LightBoxNext
 };
 //# sourceMappingURL=LightBoxNext.js.map

package/components/LightBox/LightBoxControls/LightBoxNext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxNext.js","sources":["../../../../src/components/LightBox/LightBoxControls/LightBoxNext.tsx"],"sourcesContent":["import React, { Ref, useRef } from \"react\";\nimport clsx from \"clsx\";\nimport { CaretrightStrokeSrvIcon20, CaretrightStrokeSrvIcon32 } from \"@sberbusiness/icons-next\";\nimport { TriggerClickOnKeyDownEvent } from \"../../Triggers/TriggerClickOnKeyDownEvent\";\nimport { EVENT_KEY_CODES } from \"../../../utils/keyboard\";\nimport { Button } from \"../../Button/Button\";\nimport { EButtonTheme } from \"../../Button/enums\";\nimport { EComponentSize } from \"@sberbusiness/triplex-next/enums/EComponentSize\";\nimport styles from \"../styles/LightBoxControls.module.less\";\n\n/** Свойства LightBoxNext. */\ninterface ILightBoxNextProps extends React.HTMLAttributes<HTMLDivElement> {\n    /** Кликнуть по кнопке при нажатии стрелки вправо на клавиатуре. */\n    clickByArrowRight?: boolean;\n    /** Обработчик клика по кнопке. */\n    onClick: () => void;\n    /** Идентификатор для обучающего тура. */\n    dataTutorialId?: string;\n}\n\ninterface IRenderButtonParams {\n    /** Флаг, добавляющий data-test-id. Нужен, чтобы data-test-id не дублировался несколько раз на странице. */\n    addDataTestId: boolean;\n    /** Установка ссылки на кнопку. */\n    buttonRef?: Ref<HTMLButtonElement>;\n}\n\n/** Стрелка лайтбокса \"Вперёд\". */\nexport const LightBoxNext: React.FC<ILightBoxNextProps> = ({\n    className,\n    clickByArrowRight,\n    dataTutorialId,\n    onClick,\n    title,\n    ...htmlDivAttributes\n}) => {\n    const ref = useRef<HTMLButtonElement>(null);\n\n    /**\n     * Отображение кнопки.\n     */\n    const renderButton = (params?: IRenderButtonParams) => (\n        <>\n            {/* Кнопка для экранов шире 1024px */}\n            <Button\n                className={clsx(styles.lightBoxControlsDesktop, styles.lightBoxNextButton)}\n                data-test-id={params?.addDataTestId ? \"lightBox-next\" : undefined}\n                data-tutorial-id={dataTutorialId}\n                onClick={onClick}\n                title={title}\n                ref={params?.buttonRef}\n                icon={<CaretrightStrokeSrvIcon32 paletteIndex={0} />}\n                size={EComponentSize.LG}\n                theme={EButtonTheme.SECONDARY_LIGHT}\n            />\n            {/* Кнопка для экранов менее 1024px */}\n            <Button\n                className={clsx(styles.lightBoxControlsMobile, styles.lightBoxNextButton)}\n                data-test-id={params?.addDataTestId ? \"lightBox-next\" : undefined}\n                data-tutorial-id={dataTutorialId}\n                onClick={onClick}\n                title={title}\n                ref={params?.buttonRef}\n                icon={<CaretrightStrokeSrvIcon20 paletteIndex={0} />}\n                size={EComponentSize.MD}\n                theme={EButtonTheme.SECONDARY_LIGHT}\n            />\n        </>\n    );\n\n    return (\n        <div className={clsx(className, styles.lightBoxNext)} {...htmlDivAttributes}>\n            {clickByArrowRight ? (\n                <span>\n                    {/* Кнопка с триггером при нажатии стрелки на клавиатуре. */}\n                    <span className={styles.withKeyboardEvent}>\n                        <TriggerClickOnKeyDownEvent targetRef={ref} eventKeyCode={EVENT_KEY_CODES.ARROW_RIGHT}>\n                            {renderButton({ addDataTestId: true, buttonRef: ref })}\n                        </TriggerClickOnKeyDownEvent>\n                    </span>\n                    {/* Кнопка без триггера при нажатии стрелки на клавиатуре. Нельзя нажать, когда открыт SideOverlay. */}\n                    <span className={styles.withoutKeyboardEvent}>{renderButton()}</span>\n                </span>\n            ) : (\n                renderButton({ addDataTestId: true })\n            )}\n        </div>\n    );\n};\n\nLightBoxNext.displayName = \"LightBoxNext\";\n"],"names":[],"mappings":";;;;;;;;;;AA4BO,MAAM,eAA6C,CAAC;AAAA,EACvD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACP,MAAM;AACF,QAAM,MAAM,OAA0B,IAAI;AAK1C,QAAM,eAAe,CAAC,WAClB,qBAAA,UAAA,EAEI,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,KAAK,OAAO,yBAAyB,OAAO,kBAAkB;AAAA,QACzE,iBAAc,iCAAQ,iBAAgB,kBAAkB;AAAA,QACxD,oBAAkB;AAAA,QAClB;AAAA,QACA;AAAA,QACA,KAAK,iCAAQ;AAAA,QACb,MAAM,oBAAC,2BAAA,EAA0B,cAAc,EAAA,CAAG;AAAA,QAClD,MAAM,eAAe;AAAA,QACrB,OAAO,aAAa;AAAA,MAAA;AAAA,IAAA;AAAA,IAGxB;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,KAAK,OAAO,wBAAwB,OAAO,kBAAkB;AAAA,QACxE,iBAAc,iCAAQ,iBAAgB,kBAAkB;AAAA,QACxD,oBAAkB;AAAA,QAClB;AAAA,QACA;AAAA,QACA,KAAK,iCAAQ;AAAA,QACb,MAAM,oBAAC,2BAAA,EAA0B,cAAc,EAAA,CAAG;AAAA,QAClD,MAAM,eAAe;AAAA,QACrB,OAAO,aAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EACxB,GACJ;AAGJ,SACI,oBAAC,OAAA,EAAI,WAAW,KAAK,WAAW,OAAO,YAAY,GAAI,GAAG,mBACrD,UAAA,oBACG,qBAAC,QAAA,EAEG,UAAA;AAAA,IAAA,oBAAC,UAAK,WAAW,OAAO,mBACpB,UAAA,oBAAC,4BAAA,EAA2B,WAAW,KAAK,cAAc,gBAAgB,aACrE,UAAA,aAAa,EAAE,eAAe,MAAM,WAAW,KAAK,GACzD,EAAA,CACJ;AAAA,wBAEC,QAAA,EAAK,WAAW,OAAO,sBAAuB,yBAAa,CAAE;AAAA,EAAA,EAAA,CAClE,IAEA,aAAa,EAAE,eAAe,KAAA,CAAM,EAAA,CAE5C;AAER;AAEA,aAAa,cAAc;"}

package/components/LightBox/LightBoxControls/LightBoxPrev.js

@@ -1,58 +1,59 @@
-import { jsx as e, jsxs as f, Fragment as g } from "react/jsx-runtime";
-import { useRef as m } from "react";
-import { c as n } from "../../../chunks/vendor-D5cfSbgz.js";
-import { CaretleftStrokeSrvIcon32 as E, CaretleftStrokeSrvIcon20 as D } from "@sberbusiness/icons-next";
-import { EButtonTheme as h } from "../../Button/enums.js";
-import { TriggerClickOnKeyDownEvent as C } from "../../Triggers/TriggerClickOnKeyDownEvent.js";
-import { EVENT_KEY_CODES as I } from "../../../utils/keyboard.js";
-import { Button as s } from "../../Button/Button.js";
-import { EComponentSize as v } from "../../../enums/EComponentSize.js";
-import { s as o } from "../../../chunks/LightBoxControls.module-CzFWAOVn.js";
-const N = ({
-  className: u,
-  clickByArrowLeft: x,
-  dataTutorialId: r,
-  onClick: d,
-  title: l,
-  ...B
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { useRef } from "react";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { CaretleftStrokeSrvIcon32, CaretleftStrokeSrvIcon20 } from "@sberbusiness/icons-next";
+import { EButtonTheme } from "../../Button/enums.js";
+import { TriggerClickOnKeyDownEvent } from "../../Triggers/TriggerClickOnKeyDownEvent.js";
+import { EVENT_KEY_CODES } from "../../../utils/keyboard.js";
+import { Button } from "../../Button/Button.js";
+import { EComponentSize } from "../../../enums/EComponentSize.js";
+import { s as styles } from "../../../chunks/LightBoxControls.module-DgcHB1jn.js";
+const LightBoxPrev = ({
+  className,
+  clickByArrowLeft,
+  dataTutorialId,
+  onClick,
+  title,
+  ...htmlDivAttributes
 }) => {
-  const c = m(null), i = (t) => /* @__PURE__ */ f(g, { children: [
-    /* @__PURE__ */ e(
-      s,
+  const ref = useRef(null);
+  const renderButton = (params) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Button,
       {
-        className: n(o.lightBoxControlsDesktop, o.lightBoxPrevButton),
-        "data-test-id": t != null && t.addDataTestId ? "lightBox-prev" : void 0,
-        "data-tutorial-id": r,
-        onClick: d,
-        title: l,
-        ref: t == null ? void 0 : t.buttonRef,
-        icon: /* @__PURE__ */ e(E, { paletteIndex: 0 }),
-        size: v.LG,
-        theme: h.SECONDARY_LIGHT
+        className: clsx(styles.lightBoxControlsDesktop, styles.lightBoxPrevButton),
+        "data-test-id": (params == null ? void 0 : params.addDataTestId) ? "lightBox-prev" : void 0,
+        "data-tutorial-id": dataTutorialId,
+        onClick,
+        title,
+        ref: params == null ? void 0 : params.buttonRef,
+        icon: /* @__PURE__ */ jsx(CaretleftStrokeSrvIcon32, { paletteIndex: 0 }),
+        size: EComponentSize.LG,
+        theme: EButtonTheme.SECONDARY_LIGHT
       }
     ),
-    /* @__PURE__ */ e(
-      s,
+    /* @__PURE__ */ jsx(
+      Button,
       {
-        className: n(o.lightBoxControlsMobile, o.lightBoxPrevButton),
-        "data-test-id": t != null && t.addDataTestId ? "lightBox-prev" : void 0,
-        "data-tutorial-id": r,
-        onClick: d,
-        title: l,
-        ref: t == null ? void 0 : t.buttonRef,
-        icon: /* @__PURE__ */ e(D, { paletteIndex: 0 }),
-        size: v.MD,
-        theme: h.SECONDARY_LIGHT
+        className: clsx(styles.lightBoxControlsMobile, styles.lightBoxPrevButton),
+        "data-test-id": (params == null ? void 0 : params.addDataTestId) ? "lightBox-prev" : void 0,
+        "data-tutorial-id": dataTutorialId,
+        onClick,
+        title,
+        ref: params == null ? void 0 : params.buttonRef,
+        icon: /* @__PURE__ */ jsx(CaretleftStrokeSrvIcon20, { paletteIndex: 0 }),
+        size: EComponentSize.MD,
+        theme: EButtonTheme.SECONDARY_LIGHT
       }
     )
   ] });
-  return /* @__PURE__ */ e("div", { className: n(u, o.lightBoxPrev), ...B, children: x ? /* @__PURE__ */ f("span", { children: [
-    /* @__PURE__ */ e("span", { className: o.withKeyboardEvent, children: /* @__PURE__ */ e(C, { targetRef: c, eventKeyCode: I.ARROW_LEFT, children: i({ addDataTestId: !0, buttonRef: c }) }) }),
-    /* @__PURE__ */ e("span", { className: o.withoutKeyboardEvent, children: i() })
-  ] }) : i({ addDataTestId: !0 }) });
+  return /* @__PURE__ */ jsx("div", { className: clsx(className, styles.lightBoxPrev), ...htmlDivAttributes, children: clickByArrowLeft ? /* @__PURE__ */ jsxs("span", { children: [
+    /* @__PURE__ */ jsx("span", { className: styles.withKeyboardEvent, children: /* @__PURE__ */ jsx(TriggerClickOnKeyDownEvent, { targetRef: ref, eventKeyCode: EVENT_KEY_CODES.ARROW_LEFT, children: renderButton({ addDataTestId: true, buttonRef: ref }) }) }),
+    /* @__PURE__ */ jsx("span", { className: styles.withoutKeyboardEvent, children: renderButton() })
+  ] }) : renderButton({ addDataTestId: true }) });
 };
-N.displayName = "LightBoxPrev";
+LightBoxPrev.displayName = "LightBoxPrev";
 export {
-  N as LightBoxPrev
+  LightBoxPrev
 };
 //# sourceMappingURL=LightBoxPrev.js.map

package/components/LightBox/LightBoxControls/LightBoxPrev.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxPrev.js","sources":["../../../../src/components/LightBox/LightBoxControls/LightBoxPrev.tsx"],"sourcesContent":["import React, { Ref, useRef } from \"react\";\nimport clsx from \"clsx\";\nimport { CaretleftStrokeSrvIcon32, CaretleftStrokeSrvIcon20 } from \"@sberbusiness/icons-next\";\nimport { EButtonTheme } from \"../../Button/enums\";\nimport { TriggerClickOnKeyDownEvent } from \"../../Triggers/TriggerClickOnKeyDownEvent\";\nimport { EVENT_KEY_CODES } from \"../../../utils/keyboard\";\nimport { Button } from \"../../Button/Button\";\nimport { EComponentSize } from \"@sberbusiness/triplex-next/enums/EComponentSize\";\nimport styles from \"../styles/LightBoxControls.module.less\";\n\n/** Свойства LightBoxPrev. */\ninterface ILightBoxPrevProps extends React.HTMLAttributes<HTMLDivElement> {\n    /** Кликнуть по кнопке при нажатии стрелки влево на клавиатуре. */\n    clickByArrowLeft?: boolean;\n    /** Обработчик клика по кнопке. */\n    onClick: () => void;\n    /** Идентификатор для обучающего тура. */\n    dataTutorialId?: string;\n}\n\ninterface IRenderButtonParams {\n    /** Флаг, добавляющий data-test-id. Нужен, чтобы data-test-id не дублировался несколько раз на странице. */\n    addDataTestId: boolean;\n    /** Установка ссылки на кнопку. */\n    buttonRef?: Ref<HTMLButtonElement>;\n}\n\n/** Стрелка лайтбокса \"Назад\". */\nexport const LightBoxPrev: React.FC<ILightBoxPrevProps> = ({\n    className,\n    clickByArrowLeft,\n    dataTutorialId,\n    onClick,\n    title,\n    ...htmlDivAttributes\n}) => {\n    const ref = useRef<HTMLButtonElement>(null);\n\n    /**\n     * Отображение кнопки.\n     */\n    const renderButton = (params?: IRenderButtonParams) => (\n        <>\n            {/* Кнопка для экранов шире 1024px */}\n            <Button\n                className={clsx(styles.lightBoxControlsDesktop, styles.lightBoxPrevButton)}\n                data-test-id={params?.addDataTestId ? \"lightBox-prev\" : undefined}\n                data-tutorial-id={dataTutorialId}\n                onClick={onClick}\n                title={title}\n                ref={params?.buttonRef}\n                icon={<CaretleftStrokeSrvIcon32 paletteIndex={0} />}\n                size={EComponentSize.LG}\n                theme={EButtonTheme.SECONDARY_LIGHT}\n            />\n            {/* Кнопка для экранов менее 1024px */}\n            <Button\n                className={clsx(styles.lightBoxControlsMobile, styles.lightBoxPrevButton)}\n                data-test-id={params?.addDataTestId ? \"lightBox-prev\" : undefined}\n                data-tutorial-id={dataTutorialId}\n                onClick={onClick}\n                title={title}\n                ref={params?.buttonRef}\n                icon={<CaretleftStrokeSrvIcon20 paletteIndex={0} />}\n                size={EComponentSize.MD}\n                theme={EButtonTheme.SECONDARY_LIGHT}\n            />\n        </>\n    );\n\n    return (\n        <div className={clsx(className, styles.lightBoxPrev)} {...htmlDivAttributes}>\n            {clickByArrowLeft ? (\n                <span>\n                    {/* Кнопка с триггером при нажатии стрелки на клавиатуре. */}\n                    <span className={styles.withKeyboardEvent}>\n                        <TriggerClickOnKeyDownEvent targetRef={ref} eventKeyCode={EVENT_KEY_CODES.ARROW_LEFT}>\n                            {renderButton({ addDataTestId: true, buttonRef: ref })}\n                        </TriggerClickOnKeyDownEvent>\n                    </span>\n                    {/* Кнопка без триггера при нажатии стрелки на клавиатуре. Нельзя нажать, когда открыт\n                         SideOverlay. */}\n                    <span className={styles.withoutKeyboardEvent}>{renderButton()}</span>\n                </span>\n            ) : (\n                renderButton({ addDataTestId: true })\n            )}\n        </div>\n    );\n};\n\nLightBoxPrev.displayName = \"LightBoxPrev\";\n"],"names":[],"mappings":";;;;;;;;;;AA4BO,MAAM,eAA6C,CAAC;AAAA,EACvD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACP,MAAM;AACF,QAAM,MAAM,OAA0B,IAAI;AAK1C,QAAM,eAAe,CAAC,WAClB,qBAAA,UAAA,EAEI,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,KAAK,OAAO,yBAAyB,OAAO,kBAAkB;AAAA,QACzE,iBAAc,iCAAQ,iBAAgB,kBAAkB;AAAA,QACxD,oBAAkB;AAAA,QAClB;AAAA,QACA;AAAA,QACA,KAAK,iCAAQ;AAAA,QACb,MAAM,oBAAC,0BAAA,EAAyB,cAAc,EAAA,CAAG;AAAA,QACjD,MAAM,eAAe;AAAA,QACrB,OAAO,aAAa;AAAA,MAAA;AAAA,IAAA;AAAA,IAGxB;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,KAAK,OAAO,wBAAwB,OAAO,kBAAkB;AAAA,QACxE,iBAAc,iCAAQ,iBAAgB,kBAAkB;AAAA,QACxD,oBAAkB;AAAA,QAClB;AAAA,QACA;AAAA,QACA,KAAK,iCAAQ;AAAA,QACb,MAAM,oBAAC,0BAAA,EAAyB,cAAc,EAAA,CAAG;AAAA,QACjD,MAAM,eAAe;AAAA,QACrB,OAAO,aAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EACxB,GACJ;AAGJ,SACI,oBAAC,OAAA,EAAI,WAAW,KAAK,WAAW,OAAO,YAAY,GAAI,GAAG,mBACrD,UAAA,mBACG,qBAAC,QAAA,EAEG,UAAA;AAAA,IAAA,oBAAC,UAAK,WAAW,OAAO,mBACpB,UAAA,oBAAC,4BAAA,EAA2B,WAAW,KAAK,cAAc,gBAAgB,YACrE,UAAA,aAAa,EAAE,eAAe,MAAM,WAAW,KAAK,GACzD,EAAA,CACJ;AAAA,wBAGC,QAAA,EAAK,WAAW,OAAO,sBAAuB,yBAAa,CAAE;AAAA,EAAA,EAAA,CAClE,IAEA,aAAa,EAAE,eAAe,KAAA,CAAM,EAAA,CAE5C;AAER;AAEA,aAAa,cAAc;"}

package/components/LightBox/LightBoxSideOverlay/LightBoxSideOverlay.js

@@ -1,102 +1,139 @@
-import { jsx as t, jsxs as h, Fragment as W } from "react/jsx-runtime";
-import L, { useState as p, useRef as y, useEffect as T } from "react";
-import { c as f } from "../../../chunks/vendor-D5cfSbgz.js";
-import { FocusTrapExtended as X } from "../../FocusTrapExtended/FocusTrapExtended.js";
-import { OverlayBase as Y, EOverlayDirection as j } from "../../Overlay/OverlayBase.js";
-import { OverlayMask as z } from "../../Overlay/OverlayMask.js";
-import { LightBoxSideOverlayLoader as I } from "./LightBoxSideOverlayLoader.js";
-import { FocusTrapUtils as A } from "../../../utils/focus/FocusTrapUtils.js";
-import { LightBoxSideOverlayCloseMobile as G } from "./LightBoxSideOverlayCloseMobile.js";
-import { LightBoxSideOverlayCloseDesktop as U } from "./LightBoxSideOverlayCloseDesktop.js";
-import { EComponentSize as q } from "../../../enums/EComponentSize.js";
-import { createSizeToClassNameMap as J } from "../../../utils/classNameMaps.js";
-const K = "lightBoxSideOverlayMask__77ac8eea", Q = "lightBoxSideOverlayWrapper__bb4d167e", V = "overflowXHidden__eb992e4d", Z = "overflowYHidden__d91a9375", $ = "closing__c9a4dc64", P = "opened__56e6379f", ee = "lightBoxSideOverlayContent__e720b601", oe = "opening__aae2cbbb", te = "sm__3866c24f", ie = "md__4a3569e5", re = "lg__67d11008", le = "lightBoxSideOverlay__b7df7b18", e = {
-  lightBoxSideOverlayMask: K,
-  lightBoxSideOverlayWrapper: Q,
-  overflowXHidden: V,
-  overflowYHidden: Z,
-  closing: $,
-  opened: P,
-  lightBoxSideOverlayContent: ee,
-  opening: oe,
-  sm: te,
-  md: ie,
-  lg: re,
-  lightBoxSideOverlay: le
-}, ae = J(e), O = L.forwardRef(
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import React__default, { useState, useRef, useEffect } from "react";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { FocusTrapExtended } from "../../FocusTrapExtended/FocusTrapExtended.js";
+import { OverlayBase, EOverlayDirection } from "../../Overlay/OverlayBase.js";
+import { OverlayMask } from "../../Overlay/OverlayMask.js";
+import { LightBoxSideOverlayLoader } from "./LightBoxSideOverlayLoader.js";
+import { FocusTrapUtils } from "../../../utils/focus/FocusTrapUtils.js";
+import { LightBoxSideOverlayCloseMobile } from "./LightBoxSideOverlayCloseMobile.js";
+import { LightBoxSideOverlayCloseDesktop } from "./LightBoxSideOverlayCloseDesktop.js";
+import { EComponentSize } from "../../../enums/EComponentSize.js";
+import { createSizeToClassNameMap } from "../../../utils/classNameMaps.js";
+const lightBoxSideOverlayMask = "lightBoxSideOverlayMask__96a3386d";
+const lightBoxSideOverlayWrapper = "lightBoxSideOverlayWrapper__ee2fb65b";
+const overflowXHidden = "overflowXHidden__ff7069b1";
+const overflowYHidden = "overflowYHidden__1b12b617";
+const closing = "closing__cae464ee";
+const opened = "opened__6b99a1a2";
+const lightBoxSideOverlayContent = "lightBoxSideOverlayContent__84704fc8";
+const opening = "opening__72a73bce";
+const sm = "sm__ce575ee0";
+const md = "md__e5622169";
+const lg = "lg__d2ec4809";
+const lightBoxSideOverlay = "lightBoxSideOverlay__5fc31721";
+const styles = {
+  lightBoxSideOverlayMask,
+  lightBoxSideOverlayWrapper,
+  overflowXHidden,
+  overflowYHidden,
+  closing,
+  opened,
+  lightBoxSideOverlayContent,
+  opening,
+  sm,
+  md,
+  lg,
+  lightBoxSideOverlay
+};
+const sizeToClassNameMap = createSizeToClassNameMap(styles);
+const LightBoxSideOverlayBase = React__default.forwardRef(
   ({
-    children: x,
-    className: _,
-    focusTrapProps: l,
-    isLoading: n,
-    loadingTitle: S,
-    isTopLevelSideOverlayOpened: v,
-    isTopOverlayOpened: u,
-    onClose: s,
-    onOpen: d,
-    opened: o,
-    size: b = q.MD,
-    ...M
-  }, w) => {
-    const [i, c] = p(!1), [a, g] = p(!1), m = y(o), B = y(null);
-    T(() => {
-      m.current && !o ? (g(!1), c(!0)) : !m.current && o && (c(!1), g(!0)), m.current = o;
-    }, [o]);
-    const k = (r) => {
-      const { target: F, currentTarget: R } = r;
-      F === R && (i ? (c(!1), s == null || s()) : a && (g(!1), d == null || d()));
-    }, C = ({ opened: r }) => /* @__PURE__ */ t(z, { opened: r, className: e.lightBoxSideOverlayMask }), H = () => /* @__PURE__ */ h(
+    children,
+    className,
+    focusTrapProps,
+    isLoading,
+    loadingTitle,
+    isTopLevelSideOverlayOpened,
+    isTopOverlayOpened,
+    onClose,
+    onOpen,
+    opened: opened2,
+    size = EComponentSize.MD,
+    ...htmlDivAttributes
+  }, ref) => {
+    const [closing2, setClosing] = useState(false);
+    const [opening2, setOpening] = useState(false);
+    const prevOpened = useRef(opened2);
+    const contentRef = useRef(null);
+    useEffect(() => {
+      if (prevOpened.current && !opened2) {
+        setOpening(false);
+        setClosing(true);
+      } else if (!prevOpened.current && opened2) {
+        setClosing(false);
+        setOpening(true);
+      }
+      prevOpened.current = opened2;
+    }, [opened2]);
+    const handleTransitionEnd = (event) => {
+      const { target, currentTarget } = event;
+      if (target === currentTarget) {
+        if (closing2) {
+          setClosing(false);
+          onClose == null ? void 0 : onClose();
+        } else if (opening2) {
+          setOpening(false);
+          onOpen == null ? void 0 : onOpen();
+        }
+      }
+    };
+    const renderMask = ({ opened: opened22 }) => /* @__PURE__ */ jsx(OverlayMask, { opened: opened22, className: styles.lightBoxSideOverlayMask });
+    const renderPanel = () => /* @__PURE__ */ jsxs(
       "div",
       {
-        className: f(e.lightBoxSideOverlayContent, {
-          [e.closing]: i,
-          [e.opening]: a,
-          [e.opened]: o
+        className: clsx(styles.lightBoxSideOverlayContent, {
+          [styles.closing]: closing2,
+          [styles.opening]: opening2,
+          [styles.opened]: opened2
         }),
-        onTransitionEnd: k,
-        ref: B,
+        onTransitionEnd: handleTransitionEnd,
+        ref: contentRef,
         children: [
-          x,
-          n && /* @__PURE__ */ t(I, { loadingTitle: S })
+          children,
+          isLoading && /* @__PURE__ */ jsx(LightBoxSideOverlayLoader, { loadingTitle })
         ]
       }
-    ), N = () => {
-    }, E = f(_, e.lightBoxSideOverlayWrapper, ae[b], {
-      [e.closing]: i,
-      [e.opened]: o,
-      [e.overflowXHidden]: !!v || !!n,
-      [e.overflowYHidden]: !!v || !!n || !!u
-    }), D = (r) => /* @__PURE__ */ h(W, { children: [
-      C(r),
-      H()
+    );
+    const setOpened = () => {
+    };
+    const classNameOverlayWrapper = clsx(className, styles.lightBoxSideOverlayWrapper, sizeToClassNameMap[size], {
+      [styles.closing]: closing2,
+      [styles.opened]: opened2,
+      [styles.overflowXHidden]: Boolean(isTopLevelSideOverlayOpened) || Boolean(isLoading),
+      [styles.overflowYHidden]: Boolean(isTopLevelSideOverlayOpened) || Boolean(isLoading) || Boolean(isTopOverlayOpened)
+    });
+    const renderOverlay = (provideProps) => /* @__PURE__ */ jsxs(Fragment, { children: [
+      renderMask(provideProps),
+      renderPanel()
     ] });
-    return /* @__PURE__ */ t(
-      X,
+    return /* @__PURE__ */ jsx(
+      FocusTrapExtended,
       {
-        active: o && !a && !i,
-        ...l,
+        active: opened2 && !opening2 && !closing2,
+        ...focusTrapProps,
         focusTrapOptions: {
-          allowOutsideClick: !0,
-          initialFocus: () => A.getFirstInteractionElementByDataAttr(B.current),
-          preventScroll: !0,
-          ...l == null ? void 0 : l.focusTrapOptions
+          allowOutsideClick: true,
+          initialFocus: () => FocusTrapUtils.getFirstInteractionElementByDataAttr(contentRef.current),
+          preventScroll: true,
+          ...focusTrapProps == null ? void 0 : focusTrapProps.focusTrapOptions
         },
-        children: /* @__PURE__ */ t(
+        children: /* @__PURE__ */ jsx(
           "div",
           {
-            className: E,
+            className: classNameOverlayWrapper,
             role: "dialog",
             "aria-modal": "true",
-            ...M,
-            ref: w,
-            children: /* @__PURE__ */ t(
+            ...htmlDivAttributes,
+            ref,
+            children: /* @__PURE__ */ jsx(
               "div",
               {
-                className: f(e.lightBoxSideOverlay, {
-                  [e.closing]: i,
-                  [e.opening]: a
+                className: clsx(styles.lightBoxSideOverlay, {
+                  [styles.closing]: closing2,
+                  [styles.opening]: opening2
                 }),
-                children: /* @__PURE__ */ t(Y, { direction: j.RIGHT, opened: o, setOpened: N, children: D })
+                children: /* @__PURE__ */ jsx(OverlayBase, { direction: EOverlayDirection.RIGHT, opened: opened2, setOpened, children: renderOverlay })
               }
             )
           }
@@ -105,12 +142,12 @@ const K = "lightBoxSideOverlayMask__77ac8eea", Q = "lightBoxSideOverlayWrapper__
     );
   }
 );
-O.displayName = "LightBoxSideOverlay";
-const Oe = Object.assign(O, {
-  CloseDesktop: U,
-  CloseMobile: G
+LightBoxSideOverlayBase.displayName = "LightBoxSideOverlay";
+const LightBoxSideOverlay = Object.assign(LightBoxSideOverlayBase, {
+  CloseDesktop: LightBoxSideOverlayCloseDesktop,
+  CloseMobile: LightBoxSideOverlayCloseMobile
 });
 export {
-  Oe as LightBoxSideOverlay
+  LightBoxSideOverlay
 };
 //# sourceMappingURL=LightBoxSideOverlay.js.map

package/components/LightBox/LightBoxSideOverlay/LightBoxSideOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxSideOverlay.js","sources":["../../../../src/components/LightBox/LightBoxSideOverlay/LightBoxSideOverlay.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from \"react\";\nimport clsx from \"clsx\";\nimport { FocusTrapExtended, IFocusTrapExtendedProps } from \"../../FocusTrapExtended\";\nimport {\n    EOverlayDirection,\n    IOverlayBaseProps,\n    OverlayBase,\n    IOverlayChildrenProvideProps,\n} from \"../../Overlay/OverlayBase\";\nimport { OverlayMask } from \"../../Overlay/OverlayMask\";\nimport { LightBoxSideOverlayLoader } from \"./LightBoxSideOverlayLoader\";\nimport { FocusTrapUtils } from \"../../../utils/focus/FocusTrapUtils\";\nimport { LightBoxSideOverlayCloseMobile } from \"./LightBoxSideOverlayCloseMobile\";\nimport { LightBoxSideOverlayCloseDesktop } from \"./LightBoxSideOverlayCloseDesktop\";\nimport { EComponentSize } from \"../../../enums/EComponentSize\";\nimport { createSizeToClassNameMap } from \"../../../utils/classNameMaps\";\nimport styles from \"./styles/LightBoxSideOverlay.module.less\";\n\n/** Свойства компонента LightBoxSideOverlay. */\nexport interface ILightBoxSideOverlayProps\n    extends React.HTMLAttributes<HTMLDivElement>, Pick<IOverlayBaseProps, \"opened\" | \"onClose\" | \"onOpen\"> {\n    /** Свойства компонента FocusTrapExtended. */\n    focusTrapProps?: IFocusTrapExtendedProps;\n    /** Состояние загрузки. */\n    isLoading?: boolean;\n    /** Текст под спиннером. */\n    loadingTitle?: React.ReactNode;\n    /** Открыт другой SideOverlay поверх текущего. */\n    isTopLevelSideOverlayOpened?: boolean;\n    /** Открыт TopOverlay в текущем SideOverlay. */\n    isTopOverlayOpened?: boolean;\n    /** Размер компонента. */\n    size?: EComponentSize;\n}\n\nconst sizeToClassNameMap = createSizeToClassNameMap(styles);\n\nconst LightBoxSideOverlayBase = React.forwardRef<HTMLDivElement, ILightBoxSideOverlayProps>(\n    (\n        {\n            children,\n            className,\n            focusTrapProps,\n            isLoading,\n            loadingTitle,\n            isTopLevelSideOverlayOpened,\n            isTopOverlayOpened,\n            onClose,\n            onOpen,\n            opened,\n            size = EComponentSize.MD,\n            ...htmlDivAttributes\n        },\n        ref,\n    ) => {\n        // Флаг, в текущий момент оверлей закрывается.\n        const [closing, setClosing] = useState(false);\n        // Флаг, в текущий момент оверлей открывается.\n        const [opening, setOpening] = useState(false);\n        // Предыдущее состояние открыт/закрыт.\n        const prevOpened = useRef(opened);\n        const contentRef = useRef<HTMLDivElement>(null);\n\n        useEffect(() => {\n            if (prevOpened.current && !opened) {\n                // eslint-disable-next-line react-hooks/set-state-in-effect\n                setOpening(false); // opened меняется в процессе анимации открытия.\n                setClosing(true);\n            } else if (!prevOpened.current && opened) {\n                setClosing(false); // opened меняется в процессе анимации закрытия.\n                setOpening(true);\n            }\n\n            prevOpened.current = opened;\n        }, [opened]);\n\n        const handleTransitionEnd = (event: React.TransitionEvent<HTMLDivElement>) => {\n            const { target, currentTarget } = event;\n\n            if (target === currentTarget) {\n                if (closing) {\n                    setClosing(false);\n                    onClose?.();\n                } else if (opening) {\n                    setOpening(false);\n                    onOpen?.();\n                }\n            }\n        };\n\n        const renderMask = ({ opened }: IOverlayChildrenProvideProps) => (\n            <OverlayMask opened={opened} className={styles.lightBoxSideOverlayMask} />\n        );\n\n        const renderPanel = () => (\n            <div\n                className={clsx(styles.lightBoxSideOverlayContent, {\n                    [styles.closing]: closing,\n                    [styles.opening]: opening,\n                    [styles.opened]: opened,\n                })}\n                onTransitionEnd={handleTransitionEnd}\n                ref={contentRef}\n            >\n                {children}\n\n                {isLoading && <LightBoxSideOverlayLoader loadingTitle={loadingTitle} />}\n            </div>\n        );\n\n        const setOpened = () => {};\n\n        const classNameOverlayWrapper = clsx(className, styles.lightBoxSideOverlayWrapper, sizeToClassNameMap[size], {\n            [styles.closing]: closing,\n            [styles.opened]: opened,\n            [styles.overflowXHidden]: Boolean(isTopLevelSideOverlayOpened) || Boolean(isLoading),\n            [styles.overflowYHidden]:\n                Boolean(isTopLevelSideOverlayOpened) || Boolean(isLoading) || Boolean(isTopOverlayOpened),\n        });\n\n        const renderOverlay = (provideProps: IOverlayChildrenProvideProps) => (\n            <>\n                {renderMask(provideProps)}\n                {renderPanel()}\n            </>\n        );\n\n        return (\n            <FocusTrapExtended\n                active={opened && !opening && !closing}\n                {...focusTrapProps}\n                focusTrapOptions={{\n                    allowOutsideClick: true,\n                    initialFocus: () => FocusTrapUtils.getFirstInteractionElementByDataAttr(contentRef.current),\n                    preventScroll: true,\n                    ...focusTrapProps?.focusTrapOptions,\n                }}\n            >\n                <div\n                    className={classNameOverlayWrapper}\n                    role=\"dialog\"\n                    aria-modal=\"true\"\n                    {...htmlDivAttributes}\n                    ref={ref}\n                >\n                    <div\n                        className={clsx(styles.lightBoxSideOverlay, {\n                            [styles.closing]: closing,\n                            [styles.opening]: opening,\n                        })}\n                    >\n                        <OverlayBase direction={EOverlayDirection.RIGHT} opened={opened} setOpened={setOpened}>\n                            {renderOverlay}\n                        </OverlayBase>\n                    </div>\n                </div>\n            </FocusTrapExtended>\n        );\n    },\n);\n\nLightBoxSideOverlayBase.displayName = \"LightBoxSideOverlay\";\n\n/** Боковая панель LightBox, выезжающая с правой стороны. */\nexport const LightBoxSideOverlay = Object.assign(LightBoxSideOverlayBase, {\n    CloseDesktop: LightBoxSideOverlayCloseDesktop,\n    CloseMobile: LightBoxSideOverlayCloseMobile,\n});\n"],"names":["React","opened","closing","opening"],"mappings":"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"}

package/components/LightBox/LightBoxSideOverlay/LightBoxSideOverlayCloseDesktop.js

@@ -1,35 +1,42 @@
-import { jsx as e } from "react/jsx-runtime";
-import { useRef as l } from "react";
-import { TriggerClickOnKeyDownEvent as a } from "../../Triggers/TriggerClickOnKeyDownEvent.js";
-import { EVENT_KEY_CODES as p } from "../../../utils/keyboard.js";
-import { c } from "../../../chunks/vendor-D5cfSbgz.js";
-import { CrossStrokeSrvIcon32 as d } from "@sberbusiness/icons-next";
-import { EButtonTheme as f } from "../../Button/enums.js";
-import { EComponentSize as C } from "../../../enums/EComponentSize.js";
-import { Button as u } from "../../Button/Button.js";
-import { s as r } from "../../../chunks/LightBoxSideOverlayClose.module-DMvLOKDr.js";
-const E = ({
-  className: i,
-  clickByEsc: s,
-  ...n
+import { jsx } from "react/jsx-runtime";
+import { useRef } from "react";
+import { TriggerClickOnKeyDownEvent } from "../../Triggers/TriggerClickOnKeyDownEvent.js";
+import { EVENT_KEY_CODES } from "../../../utils/keyboard.js";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { CrossStrokeSrvIcon32 } from "@sberbusiness/icons-next";
+import { EButtonTheme } from "../../Button/enums.js";
+import { EComponentSize } from "../../../enums/EComponentSize.js";
+import { Button } from "../../Button/Button.js";
+import { s as styles } from "../../../chunks/LightBoxSideOverlayClose.module-DwvvEUKq.js";
+const LightBoxSideOverlayCloseDesktop = ({
+  className,
+  clickByEsc,
+  ...htmlButtonAttributes
 }) => {
-  const o = l(null), t = () => /* @__PURE__ */ e(
-    u,
+  const ref = useRef(null);
+  const renderButton = () => /* @__PURE__ */ jsx(
+    Button,
     {
-      "data-exclude-modal-focus": !0,
-      className: c(i, r.lightBoxSideOverlayCloseDesktop),
+      "data-exclude-modal-focus": true,
+      className: clsx(className, styles.lightBoxSideOverlayCloseDesktop),
       title: "Закрыть",
-      ...n,
-      ref: o,
-      icon: /* @__PURE__ */ e(d, { paletteIndex: 0 }),
-      size: C.LG,
-      theme: f.SECONDARY_LIGHT
+      ...htmlButtonAttributes,
+      ref,
+      icon: /* @__PURE__ */ jsx(CrossStrokeSrvIcon32, { paletteIndex: 0 }),
+      size: EComponentSize.LG,
+      theme: EButtonTheme.SECONDARY_LIGHT
     }
-  ), m = () => s ? /* @__PURE__ */ e(a, { eventKeyCode: p.ESCAPE, targetRef: o, children: t() }) : t();
-  return /* @__PURE__ */ e("div", { className: r.lightBoxSideOverlayCloseDesktopContainer, children: m() });
+  );
+  const renderContent = () => {
+    if (clickByEsc) {
+      return /* @__PURE__ */ jsx(TriggerClickOnKeyDownEvent, { eventKeyCode: EVENT_KEY_CODES.ESCAPE, targetRef: ref, children: renderButton() });
+    }
+    return renderButton();
+  };
+  return /* @__PURE__ */ jsx("div", { className: styles.lightBoxSideOverlayCloseDesktopContainer, children: renderContent() });
 };
-E.displayName = "LightBoxSideOverlayCloseDesktop";
+LightBoxSideOverlayCloseDesktop.displayName = "LightBoxSideOverlayCloseDesktop";
 export {
-  E as LightBoxSideOverlayCloseDesktop
+  LightBoxSideOverlayCloseDesktop
 };
 //# sourceMappingURL=LightBoxSideOverlayCloseDesktop.js.map