@sberbusiness/triplex-next 1.34.0 → 1.35.1

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

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxSideOverlayCloseDesktop.js","sources":["../../../../src/components/LightBox/LightBoxSideOverlay/LightBoxSideOverlayCloseDesktop.tsx"],"sourcesContent":["import React, { useRef } from \"react\";\nimport { TriggerClickOnKeyDownEvent } from \"../../Triggers/TriggerClickOnKeyDownEvent\";\nimport { EVENT_KEY_CODES } from \"../../../utils/keyboard\";\nimport clsx from \"clsx\";\nimport { CrossStrokeSrvIcon32 } from \"@sberbusiness/icons-next\";\nimport { EButtonTheme } from \"../../Button/enums\";\nimport { EComponentSize } from \"../../../enums/EComponentSize\";\nimport { Button } from \"../../Button/Button\";\nimport styles from \"./styles/LightBoxSideOverlayClose.module.less\";\n\nexport interface ILightBoxSideOverlayCloseDesktopProps extends React.HTMLAttributes<HTMLButtonElement> {\n    /**\n     * Триггер click по нажатию Esc.\n     */\n    clickByEsc: boolean;\n}\n\n/**\n * Компонент закрытия SideOverlay для десктопа.\n * Отображается только на десктопе, справа от заголовка SideOverlay.\n */\nexport const LightBoxSideOverlayCloseDesktop: React.FC<ILightBoxSideOverlayCloseDesktopProps> = ({\n    className,\n    clickByEsc,\n    ...htmlButtonAttributes\n}) => {\n    const ref = useRef<HTMLButtonElement>(null);\n\n    const renderButton = () => (\n        <Button\n            data-exclude-modal-focus\n            className={clsx(className, styles.lightBoxSideOverlayCloseDesktop)}\n            title=\"Закрыть\"\n            {...htmlButtonAttributes}\n            ref={ref}\n            icon={<CrossStrokeSrvIcon32 paletteIndex={0} />}\n            size={EComponentSize.LG}\n            theme={EButtonTheme.SECONDARY_LIGHT}\n        />\n    );\n\n    const renderContent = () => {\n        if (clickByEsc) {\n            return (\n                <TriggerClickOnKeyDownEvent eventKeyCode={EVENT_KEY_CODES.ESCAPE} targetRef={ref}>\n                    {renderButton()}\n                </TriggerClickOnKeyDownEvent>\n            );\n        }\n        return renderButton();\n    };\n\n    return <div className={styles.lightBoxSideOverlayCloseDesktopContainer}>{renderContent()}</div>;\n};\n\nLightBoxSideOverlayCloseDesktop.displayName = \"LightBoxSideOverlayCloseDesktop\";\n"],"names":[],"mappings":";;;;;;;;;;AAqBO,MAAM,kCAAmF,CAAC;AAAA,EAC7F;AAAA,EACA;AAAA,EACA,GAAG;AACP,MAAM;AACF,QAAM,MAAM,OAA0B,IAAI;AAE1C,QAAM,eAAe,MACjB;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,4BAAwB;AAAA,MACxB,WAAW,KAAK,WAAW,OAAO,+BAA+B;AAAA,MACjE,OAAM;AAAA,MACL,GAAG;AAAA,MACJ;AAAA,MACA,MAAM,oBAAC,sBAAA,EAAqB,cAAc,EAAA,CAAG;AAAA,MAC7C,MAAM,eAAe;AAAA,MACrB,OAAO,aAAa;AAAA,IAAA;AAAA,EAAA;AAI5B,QAAM,gBAAgB,MAAM;AACxB,QAAI,YAAY;AACZ,aACI,oBAAC,8BAA2B,cAAc,gBAAgB,QAAQ,WAAW,KACxE,yBAAa,CAClB;AAAA,IAER;AACA,WAAO,aAAA;AAAA,EACX;AAEA,6BAAQ,OAAA,EAAI,WAAW,OAAO,0CAA2C,2BAAgB;AAC7F;AAEA,gCAAgC,cAAc;"}

package/components/LightBox/LightBoxSideOverlay/LightBoxSideOverlayCloseMobile.js

@@ -1,27 +1,27 @@
-import { jsx as o } from "react/jsx-runtime";
-import { c as r } from "../../../chunks/vendor-D5cfSbgz.js";
-import { CrossStrokeSrvIcon20 as i } from "@sberbusiness/icons-next";
-import { s as m } from "../../../chunks/LightBoxSideOverlayClose.module-DMvLOKDr.js";
-import { EButtonTheme as l } from "../../Button/enums.js";
-import { EComponentSize as s } from "../../../enums/EComponentSize.js";
-import { Button as a } from "../../Button/Button.js";
-const p = ({
-  className: e,
-  ...t
-}) => /* @__PURE__ */ o(
-  a,
+import { jsx } from "react/jsx-runtime";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { CrossStrokeSrvIcon20 } from "@sberbusiness/icons-next";
+import { s as styles } from "../../../chunks/LightBoxSideOverlayClose.module-Dju5v6iy.js";
+import { EButtonTheme } from "../../Button/enums.js";
+import { EComponentSize } from "../../../enums/EComponentSize.js";
+import { Button } from "../../Button/Button.js";
+const LightBoxSideOverlayCloseMobile = ({
+  className,
+  ...htmlButtonAttributes
+}) => /* @__PURE__ */ jsx(
+  Button,
   {
-    "data-exclude-modal-focus": !0,
-    className: r(e, m.lightBoxSideOverlayCloseMobile),
+    "data-exclude-modal-focus": true,
+    className: clsx(className, styles.lightBoxSideOverlayCloseMobile),
     title: "Закрыть",
-    ...t,
-    icon: /* @__PURE__ */ o(i, { paletteIndex: 0 }),
-    size: s.MD,
-    theme: l.SECONDARY
+    ...htmlButtonAttributes,
+    icon: /* @__PURE__ */ jsx(CrossStrokeSrvIcon20, { paletteIndex: 0 }),
+    size: EComponentSize.MD,
+    theme: EButtonTheme.SECONDARY
   }
 );
-p.displayName = "LightBoxSideOverlayCloseMobile";
+LightBoxSideOverlayCloseMobile.displayName = "LightBoxSideOverlayCloseMobile";
 export {
-  p as LightBoxSideOverlayCloseMobile
+  LightBoxSideOverlayCloseMobile
 };
 //# sourceMappingURL=LightBoxSideOverlayCloseMobile.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxSideOverlayCloseMobile.js","sources":["../../../../src/components/LightBox/LightBoxSideOverlay/LightBoxSideOverlayCloseMobile.tsx"],"sourcesContent":["import React from \"react\";\nimport clsx from \"clsx\";\nimport { CrossStrokeSrvIcon20 } from \"@sberbusiness/icons-next\";\nimport styles from \"./styles/LightBoxSideOverlayClose.module.less\";\nimport { EButtonTheme } from \"../../Button/enums\";\nimport { EComponentSize } from \"../../../enums/EComponentSize\";\nimport { Button } from \"../../Button/Button\";\n\nexport interface ILightBoxSideOverlayCloseMobileProps extends React.HTMLAttributes<HTMLButtonElement> {}\n\n/**\n * Компонент закрытия SideOverlay для мобильного устройства.\n * Отображается только на мобильном устройстве, внутри заголовка SideOverlay.\n */\nexport const LightBoxSideOverlayCloseMobile: React.FC<ILightBoxSideOverlayCloseMobileProps> = ({\n    className,\n    ...htmlButtonAttributes\n}) => (\n    <Button\n        data-exclude-modal-focus\n        className={clsx(className, styles.lightBoxSideOverlayCloseMobile)}\n        title=\"Закрыть\"\n        {...htmlButtonAttributes}\n        icon={<CrossStrokeSrvIcon20 paletteIndex={0} />}\n        size={EComponentSize.MD}\n        theme={EButtonTheme.SECONDARY}\n    />\n);\n\nLightBoxSideOverlayCloseMobile.displayName = \"LightBoxSideOverlayCloseMobile\";\n"],"names":[],"mappings":";;;;;;;AAcO,MAAM,iCAAiF,CAAC;AAAA,EAC3F;AAAA,EACA,GAAG;AACP,MACI;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,4BAAwB;AAAA,IACxB,WAAW,KAAK,WAAW,OAAO,8BAA8B;AAAA,IAChE,OAAM;AAAA,IACL,GAAG;AAAA,IACJ,MAAM,oBAAC,sBAAA,EAAqB,cAAc,EAAA,CAAG;AAAA,IAC7C,MAAM,eAAe;AAAA,IACrB,OAAO,aAAa;AAAA,EAAA;AACxB;AAGJ,+BAA+B,cAAc;"}

package/components/LightBox/LightBoxSideOverlay/LightBoxSideOverlayLoader.js

@@ -1,21 +1,31 @@
-import { jsx as i } from "react/jsx-runtime";
-import { useState as s, useRef as d, useEffect as l } from "react";
-import { LoaderScreen as p } from "../../LoaderScreen/LoaderScreen.js";
-const n = "lightBoxSideOverlayLoaderWrapper__c4c0dc36", c = {
-  lightBoxSideOverlayLoaderWrapper: n
-}, f = ({ loadingTitle: a }) => {
-  const [t, r] = s(0), e = d(null);
-  return l(() => {
+import { jsx } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
+import { LoaderScreen } from "../../LoaderScreen/LoaderScreen.js";
+const lightBoxSideOverlayLoaderWrapper = "lightBoxSideOverlayLoaderWrapper__70c26d2c";
+const styles = {
+  lightBoxSideOverlayLoaderWrapper
+};
+const LightBoxSideOverlayLoader = ({ loadingTitle }) => {
+  const [topPosition, setTopPosition] = useState(0);
+  const loaderRef = useRef(null);
+  useEffect(() => {
     setTimeout(() => {
-      if (e.current) {
-        const o = e.current.getBoundingClientRect();
-        o.top !== t && (o.top > 0 ? r(0) : r(Math.abs(o.top)));
+      if (loaderRef.current) {
+        const position = loaderRef.current.getBoundingClientRect();
+        if (position.top !== topPosition) {
+          if (position.top > 0) {
+            setTopPosition(0);
+          } else {
+            setTopPosition(Math.abs(position.top));
+          }
+        }
       }
     });
-  }, []), /* @__PURE__ */ i("div", { ref: e, className: c.lightBoxSideOverlayLoaderWrapper, style: { top: `${t}px` }, children: /* @__PURE__ */ i(p, { type: "middle", children: a }) });
+  }, []);
+  return /* @__PURE__ */ jsx("div", { ref: loaderRef, className: styles.lightBoxSideOverlayLoaderWrapper, style: { top: `${topPosition}px` }, children: /* @__PURE__ */ jsx(LoaderScreen, { type: "middle", children: loadingTitle }) });
 };
-f.displayName = "LightBoxSideOverlayLoader";
+LightBoxSideOverlayLoader.displayName = "LightBoxSideOverlayLoader";
 export {
-  f as LightBoxSideOverlayLoader
+  LightBoxSideOverlayLoader
 };
 //# sourceMappingURL=LightBoxSideOverlayLoader.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxSideOverlayLoader.js","sources":["../../../../src/components/LightBox/LightBoxSideOverlay/LightBoxSideOverlayLoader.tsx"],"sourcesContent":["import React from \"react\";\nimport { useEffect, useState, useRef } from \"react\";\nimport { LoaderScreen } from \"../../LoaderScreen/LoaderScreen\";\nimport styles from \"./styles/LightBoxSideOverlayLoader.module.less\";\n\ninterface ILightBoxSideOverlayLoaderProps {\n    /** Текст под спиннером.*/\n    loadingTitle?: React.ReactNode;\n}\n\nexport const LightBoxSideOverlayLoader: React.FC<ILightBoxSideOverlayLoaderProps> = ({ loadingTitle }) => {\n    // Позиция top, высчитывается из scrollTop родителя.\n    const [topPosition, setTopPosition] = useState<number | string>(0);\n    const loaderRef = useRef<HTMLDivElement | null>(null);\n\n    useEffect(() => {\n        setTimeout(() => {\n            if (loaderRef.current) {\n                const position = loaderRef.current.getBoundingClientRect();\n                // position.top равен высоте скролла родителя.\n                if (position.top !== topPosition) {\n                    if (position.top > 0) {\n                        setTopPosition(0);\n                    } else {\n                        setTopPosition(Math.abs(position.top));\n                    }\n                }\n            }\n        });\n    }, []);\n\n    return (\n        <div ref={loaderRef} className={styles.lightBoxSideOverlayLoaderWrapper} style={{ top: `${topPosition}px` }}>\n            <LoaderScreen type=\"middle\">{loadingTitle}</LoaderScreen>\n        </div>\n    );\n};\n\nLightBoxSideOverlayLoader.displayName = \"LightBoxSideOverlayLoader\";\n"],"names":[],"mappings":";;;;;;;AAUO,MAAM,4BAAuE,CAAC,EAAE,mBAAmB;AAEtG,QAAM,CAAC,aAAa,cAAc,IAAI,SAA0B,CAAC;AACjE,QAAM,YAAY,OAA8B,IAAI;AAEpD,YAAU,MAAM;AACZ,eAAW,MAAM;AACb,UAAI,UAAU,SAAS;AACnB,cAAM,WAAW,UAAU,QAAQ,sBAAA;AAEnC,YAAI,SAAS,QAAQ,aAAa;AAC9B,cAAI,SAAS,MAAM,GAAG;AAClB,2BAAe,CAAC;AAAA,UACpB,OAAO;AACH,2BAAe,KAAK,IAAI,SAAS,GAAG,CAAC;AAAA,UACzC;AAAA,QACJ;AAAA,MACJ;AAAA,IACJ,CAAC;AAAA,EACL,GAAG,CAAA,CAAE;AAEL,6BACK,OAAA,EAAI,KAAK,WAAW,WAAW,OAAO,kCAAkC,OAAO,EAAE,KAAK,GAAG,WAAW,QACjG,UAAA,oBAAC,gBAAa,MAAK,UAAU,wBAAa,EAAA,CAC9C;AAER;AAEA,0BAA0B,cAAc;"}

package/components/LightBox/LightBoxSideOverlay/index.js

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

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

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

package/components/LightBox/LightBoxSidebars/LightBoxLeftSidebar.js

@@ -1,43 +1,60 @@
-import { jsx as x } from "react/jsx-runtime";
-import { forwardRef as N, useRef as o, useImperativeHandle as R, useState as V, useEffect as b } from "react";
-import { c as h } from "../../../chunks/vendor-D5cfSbgz.js";
-const j = "lightBoxLeftSidebar__21300181", z = "fixed__8b308920", E = "hidden__7a5a7406", r = {
-  lightBoxLeftSidebar: j,
-  fixed: z,
-  hidden: E
-}, O = N(
-  ({ children: m, className: L, fixed: B, minVisibleWidth: d = 100, onShow: s, onHide: i, ...g }, p) => {
-    const n = o(null);
-    R(p, () => n.current);
-    const [v, _] = V(!0), e = o(s), t = o(i);
-    return b(() => {
-      e.current = s, t.current = i;
-    }, [s, i]), b(() => {
-      const f = n.current;
-      if (!f) return;
-      const a = new ResizeObserver((S) => {
-        for (const y of S) {
-          const c = y.contentRect.width > d;
-          _((I) => {
-            var l, u;
-            return c !== I && (c ? (l = e.current) == null || l.call(e) : (u = t.current) == null || u.call(t)), c;
+import { jsx } from "react/jsx-runtime";
+import { forwardRef, useRef, useImperativeHandle, useState, useEffect } from "react";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+const lightBoxLeftSidebar = "lightBoxLeftSidebar__d0e273a7";
+const fixed = "fixed__46fd75a9";
+const hidden = "hidden__59cf9903";
+const styles = {
+  lightBoxLeftSidebar,
+  fixed,
+  hidden
+};
+const LightBoxLeftSidebar = forwardRef(
+  ({ children, className, fixed: fixed2, minVisibleWidth = 100, onShow, onHide, ...htmlDivAttributes }, ref) => {
+    const outerRef = useRef(null);
+    useImperativeHandle(ref, () => outerRef.current);
+    const [isVisible, setIsVisible] = useState(true);
+    const onShowRef = useRef(onShow);
+    const onHideRef = useRef(onHide);
+    useEffect(() => {
+      onShowRef.current = onShow;
+      onHideRef.current = onHide;
+    }, [onShow, onHide]);
+    useEffect(() => {
+      const element = outerRef.current;
+      if (!element) return;
+      const observer = new ResizeObserver((entries) => {
+        for (const entry of entries) {
+          const shouldBeVisible = entry.contentRect.width > minVisibleWidth;
+          setIsVisible((prev) => {
+            var _a, _b;
+            if (shouldBeVisible !== prev) {
+              if (shouldBeVisible) {
+                (_a = onShowRef.current) == null ? void 0 : _a.call(onShowRef);
+              } else {
+                (_b = onHideRef.current) == null ? void 0 : _b.call(onHideRef);
+              }
+            }
+            return shouldBeVisible;
           });
         }
       });
-      return a.observe(f), () => a.disconnect();
-    }, [d]), /* @__PURE__ */ x(
+      observer.observe(element);
+      return () => observer.disconnect();
+    }, [minVisibleWidth]);
+    return /* @__PURE__ */ jsx(
       "div",
       {
-        ref: n,
-        className: h(L, r.lightBoxLeftSidebar, { [r.fixed]: B }),
-        ...g,
-        children: /* @__PURE__ */ x("div", { className: h(r.lightBoxLeftSidebarInner, { [r.hidden]: !v }), children: m })
+        ref: outerRef,
+        className: clsx(className, styles.lightBoxLeftSidebar, { [styles.fixed]: fixed2 }),
+        ...htmlDivAttributes,
+        children: /* @__PURE__ */ jsx("div", { className: clsx(styles.lightBoxLeftSidebarInner, { [styles.hidden]: !isVisible }), children })
       }
     );
   }
 );
-O.displayName = "LightBoxLeftSidebar";
+LightBoxLeftSidebar.displayName = "LightBoxLeftSidebar";
 export {
-  O as LightBoxLeftSidebar
+  LightBoxLeftSidebar
 };
 //# sourceMappingURL=LightBoxLeftSidebar.js.map

package/components/LightBox/LightBoxSidebars/LightBoxLeftSidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxLeftSidebar.js","sources":["../../../../src/components/LightBox/LightBoxSidebars/LightBoxLeftSidebar.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./styles/LightBoxLeftSidebar.module.less\";\n\nexport interface ILightBoxLeftSidebarProps extends React.HTMLAttributes<HTMLDivElement> {\n    /** Фиксация боковой панели. */\n    fixed?: boolean;\n    /** Минимальная ширина (в пикселях), при которой содержимое боковой панели отображается. По умолчанию 100. */\n    minVisibleWidth?: number;\n    /** Callback при отображении содержимого боковой панели. */\n    onShow?: () => void;\n    /** Callback при скрытии содержимого боковой панели. */\n    onHide?: () => void;\n}\n\n/** Контейнер левой боковой панели. */\nexport const LightBoxLeftSidebar = forwardRef<HTMLDivElement, ILightBoxLeftSidebarProps>(\n    ({ children, className, fixed, minVisibleWidth = 100, onShow, onHide, ...htmlDivAttributes }, ref) => {\n        const outerRef = useRef<HTMLDivElement>(null);\n        useImperativeHandle(ref, () => outerRef.current!);\n        const [isVisible, setIsVisible] = useState(true);\n        const onShowRef = useRef(onShow);\n        const onHideRef = useRef(onHide);\n\n        useEffect(() => {\n            onShowRef.current = onShow;\n            onHideRef.current = onHide;\n        }, [onShow, onHide]);\n\n        useEffect(() => {\n            const element = outerRef.current;\n            if (!element) return;\n\n            const observer = new ResizeObserver((entries) => {\n                for (const entry of entries) {\n                    const shouldBeVisible = entry.contentRect.width > minVisibleWidth;\n\n                    setIsVisible((prev) => {\n                        if (shouldBeVisible !== prev) {\n                            if (shouldBeVisible) {\n                                onShowRef.current?.();\n                            } else {\n                                onHideRef.current?.();\n                            }\n                        }\n                        return shouldBeVisible;\n                    });\n                }\n            });\n\n            observer.observe(element);\n            return () => observer.disconnect();\n        }, [minVisibleWidth]);\n\n        return (\n            <div\n                ref={outerRef}\n                className={clsx(className, styles.lightBoxLeftSidebar, { [styles.fixed]: fixed })}\n                {...htmlDivAttributes}\n            >\n                <div className={clsx(styles.lightBoxLeftSidebarInner, { [styles.hidden]: !isVisible })}>{children}</div>\n            </div>\n        );\n    },\n);\n\nLightBoxLeftSidebar.displayName = \"LightBoxLeftSidebar\";\n"],"names":["fixed"],"mappings":";;;;;;;;;;;AAgBO,MAAM,sBAAsB;AAAA,EAC/B,CAAC,EAAE,UAAU,WAAW,OAAAA,QAAO,kBAAkB,KAAK,QAAQ,QAAQ,GAAG,kBAAA,GAAqB,QAAQ;AAClG,UAAM,WAAW,OAAuB,IAAI;AAC5C,wBAAoB,KAAK,MAAM,SAAS,OAAQ;AAChD,UAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAC/C,UAAM,YAAY,OAAO,MAAM;AAC/B,UAAM,YAAY,OAAO,MAAM;AAE/B,cAAU,MAAM;AACZ,gBAAU,UAAU;AACpB,gBAAU,UAAU;AAAA,IACxB,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,cAAU,MAAM;AACZ,YAAM,UAAU,SAAS;AACzB,UAAI,CAAC,QAAS;AAEd,YAAM,WAAW,IAAI,eAAe,CAAC,YAAY;AAC7C,mBAAW,SAAS,SAAS;AACzB,gBAAM,kBAAkB,MAAM,YAAY,QAAQ;AAElD,uBAAa,CAAC,SAAS;;AACnB,gBAAI,oBAAoB,MAAM;AAC1B,kBAAI,iBAAiB;AACjB,gCAAU,YAAV;AAAA,cACJ,OAAO;AACH,gCAAU,YAAV;AAAA,cACJ;AAAA,YACJ;AACA,mBAAO;AAAA,UACX,CAAC;AAAA,QACL;AAAA,MACJ,CAAC;AAED,eAAS,QAAQ,OAAO;AACxB,aAAO,MAAM,SAAS,WAAA;AAAA,IAC1B,GAAG,CAAC,eAAe,CAAC;AAEpB,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAK;AAAA,QACL,WAAW,KAAK,WAAW,OAAO,qBAAqB,EAAE,CAAC,OAAO,KAAK,GAAGA,QAAO;AAAA,QAC/E,GAAG;AAAA,QAEJ,UAAA,oBAAC,OAAA,EAAI,WAAW,KAAK,OAAO,0BAA0B,EAAE,CAAC,OAAO,MAAM,GAAG,CAAC,UAAA,CAAW,GAAI,SAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAG9G;AACJ;AAEA,oBAAoB,cAAc;"}

package/components/LightBox/LightBoxSidebars/LightBoxRightSidebar.js

@@ -1,43 +1,60 @@
-import { jsx as h } from "react/jsx-runtime";
-import { forwardRef as N, useRef as o, useImperativeHandle as L, useState as V, useEffect as b } from "react";
-import { c as g } from "../../../chunks/vendor-D5cfSbgz.js";
-const j = "lightBoxRightSidebar__b337835f", z = "fixed__8b308920", E = "hidden__7a5a7406", r = {
-  lightBoxRightSidebar: j,
-  fixed: z,
-  hidden: E
-}, O = N(
-  ({ children: x, className: m, fixed: R, minVisibleWidth: d = 100, onShow: i, onHide: s, ...B }, p) => {
-    const n = o(null);
-    L(p, () => n.current);
-    const [v, _] = V(!0), e = o(i), t = o(s);
-    return b(() => {
-      e.current = i, t.current = s;
-    }, [i, s]), b(() => {
-      const a = n.current;
-      if (!a) return;
-      const l = new ResizeObserver((S) => {
-        for (const y of S) {
-          const c = y.contentRect.width > d;
-          _((I) => {
-            var f, u;
-            return c !== I && (c ? (f = e.current) == null || f.call(e) : (u = t.current) == null || u.call(t)), c;
+import { jsx } from "react/jsx-runtime";
+import { forwardRef, useRef, useImperativeHandle, useState, useEffect } from "react";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+const lightBoxRightSidebar = "lightBoxRightSidebar__b70c5156";
+const fixed = "fixed__46fd75a9";
+const hidden = "hidden__59cf9903";
+const styles = {
+  lightBoxRightSidebar,
+  fixed,
+  hidden
+};
+const LightBoxRightSidebar = forwardRef(
+  ({ children, className, fixed: fixed2, minVisibleWidth = 100, onShow, onHide, ...htmlDivAttributes }, ref) => {
+    const outerRef = useRef(null);
+    useImperativeHandle(ref, () => outerRef.current);
+    const [isVisible, setIsVisible] = useState(true);
+    const onShowRef = useRef(onShow);
+    const onHideRef = useRef(onHide);
+    useEffect(() => {
+      onShowRef.current = onShow;
+      onHideRef.current = onHide;
+    }, [onShow, onHide]);
+    useEffect(() => {
+      const element = outerRef.current;
+      if (!element) return;
+      const observer = new ResizeObserver((entries) => {
+        for (const entry of entries) {
+          const shouldBeVisible = entry.contentRect.width > minVisibleWidth;
+          setIsVisible((prev) => {
+            var _a, _b;
+            if (shouldBeVisible !== prev) {
+              if (shouldBeVisible) {
+                (_a = onShowRef.current) == null ? void 0 : _a.call(onShowRef);
+              } else {
+                (_b = onHideRef.current) == null ? void 0 : _b.call(onHideRef);
+              }
+            }
+            return shouldBeVisible;
           });
         }
       });
-      return l.observe(a), () => l.disconnect();
-    }, [d]), /* @__PURE__ */ h(
+      observer.observe(element);
+      return () => observer.disconnect();
+    }, [minVisibleWidth]);
+    return /* @__PURE__ */ jsx(
       "div",
       {
-        ref: n,
-        className: g(m, r.lightBoxRightSidebar, { [r.fixed]: R }),
-        ...B,
-        children: /* @__PURE__ */ h("div", { className: g(r.lightBoxRightSidebarInner, { [r.hidden]: !v }), children: x })
+        ref: outerRef,
+        className: clsx(className, styles.lightBoxRightSidebar, { [styles.fixed]: fixed2 }),
+        ...htmlDivAttributes,
+        children: /* @__PURE__ */ jsx("div", { className: clsx(styles.lightBoxRightSidebarInner, { [styles.hidden]: !isVisible }), children })
       }
     );
   }
 );
-O.displayName = "LightBoxRightSidebar";
+LightBoxRightSidebar.displayName = "LightBoxRightSidebar";
 export {
-  O as LightBoxRightSidebar
+  LightBoxRightSidebar
 };
 //# sourceMappingURL=LightBoxRightSidebar.js.map

package/components/LightBox/LightBoxSidebars/LightBoxRightSidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxRightSidebar.js","sources":["../../../../src/components/LightBox/LightBoxSidebars/LightBoxRightSidebar.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./styles/LightBoxRightSidebar.module.less\";\n\nexport interface ILightBoxRightSidebarProps extends React.HTMLAttributes<HTMLDivElement> {\n    /** Фиксация боковой панели. */\n    fixed?: boolean;\n    /** Минимальная ширина (в пикселях), при которой содержимое боковой панели отображается. По умолчанию 100. */\n    minVisibleWidth?: number;\n    /** Callback при отображении содержимого боковой панели. */\n    onShow?: () => void;\n    /** Callback при скрытии содержимого боковой панели. */\n    onHide?: () => void;\n}\n\n/** Контейнер правой боковой панели. */\nexport const LightBoxRightSidebar = forwardRef<HTMLDivElement, ILightBoxRightSidebarProps>(\n    ({ children, className, fixed, minVisibleWidth = 100, onShow, onHide, ...htmlDivAttributes }, ref) => {\n        const outerRef = useRef<HTMLDivElement>(null);\n        useImperativeHandle(ref, () => outerRef.current!);\n        const [isVisible, setIsVisible] = useState(true);\n        const onShowRef = useRef(onShow);\n        const onHideRef = useRef(onHide);\n\n        useEffect(() => {\n            onShowRef.current = onShow;\n            onHideRef.current = onHide;\n        }, [onShow, onHide]);\n\n        useEffect(() => {\n            const element = outerRef.current;\n            if (!element) return;\n\n            const observer = new ResizeObserver((entries) => {\n                for (const entry of entries) {\n                    const shouldBeVisible = entry.contentRect.width > minVisibleWidth;\n\n                    setIsVisible((prev) => {\n                        if (shouldBeVisible !== prev) {\n                            if (shouldBeVisible) {\n                                onShowRef.current?.();\n                            } else {\n                                onHideRef.current?.();\n                            }\n                        }\n                        return shouldBeVisible;\n                    });\n                }\n            });\n\n            observer.observe(element);\n            return () => observer.disconnect();\n        }, [minVisibleWidth]);\n\n        return (\n            <div\n                ref={outerRef}\n                className={clsx(className, styles.lightBoxRightSidebar, { [styles.fixed]: fixed })}\n                {...htmlDivAttributes}\n            >\n                <div className={clsx(styles.lightBoxRightSidebarInner, { [styles.hidden]: !isVisible })}>\n                    {children}\n                </div>\n            </div>\n        );\n    },\n);\n\nLightBoxRightSidebar.displayName = \"LightBoxRightSidebar\";\n"],"names":["fixed"],"mappings":";;;;;;;;;;;AAgBO,MAAM,uBAAuB;AAAA,EAChC,CAAC,EAAE,UAAU,WAAW,OAAAA,QAAO,kBAAkB,KAAK,QAAQ,QAAQ,GAAG,kBAAA,GAAqB,QAAQ;AAClG,UAAM,WAAW,OAAuB,IAAI;AAC5C,wBAAoB,KAAK,MAAM,SAAS,OAAQ;AAChD,UAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAC/C,UAAM,YAAY,OAAO,MAAM;AAC/B,UAAM,YAAY,OAAO,MAAM;AAE/B,cAAU,MAAM;AACZ,gBAAU,UAAU;AACpB,gBAAU,UAAU;AAAA,IACxB,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,cAAU,MAAM;AACZ,YAAM,UAAU,SAAS;AACzB,UAAI,CAAC,QAAS;AAEd,YAAM,WAAW,IAAI,eAAe,CAAC,YAAY;AAC7C,mBAAW,SAAS,SAAS;AACzB,gBAAM,kBAAkB,MAAM,YAAY,QAAQ;AAElD,uBAAa,CAAC,SAAS;;AACnB,gBAAI,oBAAoB,MAAM;AAC1B,kBAAI,iBAAiB;AACjB,gCAAU,YAAV;AAAA,cACJ,OAAO;AACH,gCAAU,YAAV;AAAA,cACJ;AAAA,YACJ;AACA,mBAAO;AAAA,UACX,CAAC;AAAA,QACL;AAAA,MACJ,CAAC;AAED,eAAS,QAAQ,OAAO;AACxB,aAAO,MAAM,SAAS,WAAA;AAAA,IAC1B,GAAG,CAAC,eAAe,CAAC;AAEpB,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAK;AAAA,QACL,WAAW,KAAK,WAAW,OAAO,sBAAsB,EAAE,CAAC,OAAO,KAAK,GAAGA,QAAO;AAAA,QAChF,GAAG;AAAA,QAEJ,UAAA,oBAAC,OAAA,EAAI,WAAW,KAAK,OAAO,2BAA2B,EAAE,CAAC,OAAO,MAAM,GAAG,CAAC,UAAA,CAAW,GACjF,SAAA,CACL;AAAA,MAAA;AAAA,IAAA;AAAA,EAGZ;AACJ;AAEA,qBAAqB,cAAc;"}

package/components/LightBox/LightBoxViewManager/LightBoxViewManager.js

@@ -1,63 +1,91 @@
-import { jsx as r, jsxs as N } from "react/jsx-runtime";
-import { useState as m, useRef as L, useCallback as n, useLayoutEffect as c } from "react";
-import { Portal as B } from "../../Portal/Portal.js";
-import { LightBoxViewManagerConsts as l } from "./LightBoxViewManagerConsts.js";
-import { g as k, i as P, p } from "../../../chunks/vendor-D5cfSbgz.js";
-const g = "LightBoxMountNodeViewManager", $ = ({
-  lightBoxMountNode: a,
-  lightBoxViewManagerNode: x
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useRef, useCallback, useLayoutEffect } from "react";
+import { Portal } from "../../Portal/Portal.js";
+import { LightBoxViewManagerConsts } from "./LightBoxViewManagerConsts.js";
+import { g as useResizeDetector, i as isEqual, p as pick } from "../../../chunks/vendor-Bco_z_Yi.js";
+const lightBoxMountNodeClassName = "LightBoxMountNodeViewManager";
+const LightBoxViewManager = ({
+  lightBoxMountNode,
+  lightBoxViewManagerNode
 }) => {
-  const [t, h] = m(), [s, R] = m(""), o = L(null), d = n(
-    (e) => {
-      if (!e)
+  const [rectViewNode, setRectViewNode] = useState();
+  const [breakPointsClassNames, setBreakPointsClassNames] = useState("");
+  const viewNodeRef = useRef(null);
+  const calculateBreakPointsClassNames = useCallback(
+    (rect) => {
+      if (!rect) {
         return;
-      let i = [];
-      e.width <= l.lightBoxMediaPoint0 ? i.push(l.breakPointsClassNames["less-or-equal-media-point-0"]) : i.push(l.breakPointsClassNames["more-media-point-0"]), i = i.sort().join(" "), s !== i && R(i);
+      }
+      let classNames = [];
+      if (rect.width <= LightBoxViewManagerConsts.lightBoxMediaPoint0) {
+        classNames.push(LightBoxViewManagerConsts.breakPointsClassNames["less-or-equal-media-point-0"]);
+      } else {
+        classNames.push(LightBoxViewManagerConsts.breakPointsClassNames["more-media-point-0"]);
+      }
+      classNames = classNames.sort().join(" ");
+      if (breakPointsClassNames !== classNames) {
+        setBreakPointsClassNames(classNames);
+      }
     },
-    [s]
-  ), w = () => {
-    if (o.current) {
-      const e = o.current.getBoundingClientRect();
-      P(
-        p(t, ["top", "left", "width", "height"]),
-        p(e, ["top", "left", "width", "height"])
-      ) || h(e);
+    [breakPointsClassNames]
+  );
+  const updateRect = () => {
+    if (viewNodeRef.current) {
+      const nextRect = viewNodeRef.current.getBoundingClientRect();
+      if (!isEqual(
+        pick(rectViewNode, ["top", "left", "width", "height"]),
+        pick(nextRect, ["top", "left", "width", "height"])
+      )) {
+        setRectViewNode(nextRect);
+      }
     }
-  }, f = n(() => {
-    if (o.current) {
-      const e = o.current.getBoundingClientRect();
-      h(e), d(e);
+  };
+  const updateRectAndClassNames = useCallback(() => {
+    if (viewNodeRef.current) {
+      const nextRect = viewNodeRef.current.getBoundingClientRect();
+      setRectViewNode(nextRect);
+      calculateBreakPointsClassNames(nextRect);
     }
-  }, [d]), u = n(() => {
-    s && (Array.from(a.classList).forEach((e) => {
-      e.includes("LB-") && a.classList.toggle(e);
-    }), s.split(" ").forEach((e) => a.classList.add(e)));
-  }, [s, a.classList]);
-  c(() => {
-    f(), a.classList.add(g);
-  }, []), c(() => {
-    u();
-  }, [s, u]), c(() => {
-    w();
+  }, [calculateBreakPointsClassNames]);
+  const addClassNameToMountNode = useCallback(() => {
+    if (!breakPointsClassNames) {
+      return;
+    }
+    Array.from(lightBoxMountNode.classList).forEach((c) => {
+      if (c.includes("LB-")) {
+        lightBoxMountNode.classList.toggle(c);
+      }
+    });
+    breakPointsClassNames.split(" ").forEach((c) => lightBoxMountNode.classList.add(c));
+  }, [breakPointsClassNames, lightBoxMountNode.classList]);
+  useLayoutEffect(() => {
+    updateRectAndClassNames();
+    lightBoxMountNode.classList.add(lightBoxMountNodeClassName);
+  }, []);
+  useLayoutEffect(() => {
+    addClassNameToMountNode();
+  }, [breakPointsClassNames, addClassNameToMountNode]);
+  useLayoutEffect(() => {
+    updateRect();
   });
-  const { ref: C } = k({
-    handleWidth: !0,
-    onResize: f,
+  const { ref: resizeRef } = useResizeDetector({
+    handleWidth: true,
+    onResize: updateRectAndClassNames,
     refreshMode: "throttle",
     refreshRate: 150
   });
-  return /* @__PURE__ */ r(B, { container: x, children: /* @__PURE__ */ N("div", { ref: o, style: { height: "100%" }, children: [
-    /* @__PURE__ */ r("div", { ref: C, style: { width: "100%", height: "100%", position: "absolute" } }),
-    t && /* @__PURE__ */ r("style", { children: `
-                            .${g} {
-                                --lightBox-screen-left: ${t.x >= 0 ? t.x : 0}px;
-                                --lightBox-screen-width: ${t.width}px;
-                                --lightBox-screen-top: ${t.height}px;
+  return /* @__PURE__ */ jsx(Portal, { container: lightBoxViewManagerNode, children: /* @__PURE__ */ jsxs("div", { ref: viewNodeRef, style: { height: "100%" }, children: [
+    /* @__PURE__ */ jsx("div", { ref: resizeRef, style: { width: "100%", height: "100%", position: "absolute" } }),
+    rectViewNode && /* @__PURE__ */ jsx("style", { children: `
+                            .${lightBoxMountNodeClassName} {
+                                --lightBox-screen-left: ${rectViewNode.x >= 0 ? rectViewNode.x : 0}px;
+                                --lightBox-screen-width: ${rectViewNode.width}px;
+                                --lightBox-screen-top: ${rectViewNode.height}px;
                             }
                         ` })
   ] }) });
 };
 export {
-  $ as LightBoxViewManager
+  LightBoxViewManager
 };
 //# sourceMappingURL=LightBoxViewManager.js.map

package/components/LightBox/LightBoxViewManager/LightBoxViewManager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxViewManager.js","sources":["../../../../src/components/LightBox/LightBoxViewManager/LightBoxViewManager.tsx"],"sourcesContent":["import React from \"react\";\nimport { useCallback, useLayoutEffect, useRef, useState } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\nimport { Portal } from \"../../Portal/Portal\";\nimport { LightBoxViewManagerConsts } from \"./LightBoxViewManagerConsts\";\nimport isEqual from \"lodash-es/isEqual\";\nimport pick from \"lodash-es/pick\";\n\nexport interface ILightBoxViewManagerProps {\n    // Элемент, в который рендерится LightBox.\n    lightBoxMountNode: HTMLDivElement;\n    // Элемент, в визуальных границах (левая и правая координата) которого рендерится LightBox. Отступ LightBox от верхней границы экрана равен высоте этого элемента.\n    lightBoxViewManagerNode: HTMLDivElement;\n}\n\n// Css класс, подставляемый в lightBoxMountNode. Нужен для создания области видимости css переменных.\nconst lightBoxMountNodeClassName = \"LightBoxMountNodeViewManager\";\n\n/**\n * Элемент, определяющий позиционирование LightBox.\n */\nexport const LightBoxViewManager: React.FC<ILightBoxViewManagerProps> = ({\n    lightBoxMountNode,\n    lightBoxViewManagerNode,\n}) => {\n    // Координаты DOM ноды, в границах которой рендерится LightBox.\n    const [rectViewNode, setRectViewNode] = useState<DOMRect>();\n    // Класснеймы, рассчитанные на основе ширины области LightBox.\n    const [breakPointsClassNames, setBreakPointsClassNames] = useState<string>(\"\");\n    // DOM нода, в границах которой рендерится LightBox.\n    const viewNodeRef = useRef<HTMLDivElement | null>(null);\n\n    /**\n     * Раcчет класснеймов на основе ширины области viewNode.\n     * Эти класснеймы опеределяют позиционирование LightBox.\n     */\n    const calculateBreakPointsClassNames = useCallback(\n        (rect: DOMRect | undefined) => {\n            if (!rect) {\n                return;\n            }\n\n            let classNames: Array<string> | string = [];\n\n            if (rect.width <= LightBoxViewManagerConsts.lightBoxMediaPoint0) {\n                classNames.push(LightBoxViewManagerConsts.breakPointsClassNames[\"less-or-equal-media-point-0\"]);\n            } else {\n                classNames.push(LightBoxViewManagerConsts.breakPointsClassNames[\"more-media-point-0\"]);\n            }\n\n            classNames = classNames.sort().join(\" \");\n\n            if (breakPointsClassNames !== classNames) {\n                setBreakPointsClassNames(classNames);\n            }\n        },\n        [breakPointsClassNames],\n    );\n\n    const updateRect = () => {\n        if (viewNodeRef.current) {\n            const nextRect = viewNodeRef.current.getBoundingClientRect();\n\n            if (\n                !isEqual(\n                    pick(rectViewNode, [\"top\", \"left\", \"width\", \"height\"]),\n                    pick(nextRect, [\"top\", \"left\", \"width\", \"height\"]),\n                )\n            ) {\n                setRectViewNode(nextRect);\n            }\n        }\n    };\n\n    const updateRectAndClassNames = useCallback(() => {\n        if (viewNodeRef.current) {\n            const nextRect = viewNodeRef.current.getBoundingClientRect();\n            setRectViewNode(nextRect);\n            calculateBreakPointsClassNames(nextRect);\n        }\n    }, [calculateBreakPointsClassNames]);\n\n    const addClassNameToMountNode = useCallback(() => {\n        if (!breakPointsClassNames) {\n            return;\n        }\n\n        // Удаление предыдущих классов.\n        Array.from(lightBoxMountNode.classList).forEach((c) => {\n            if (c.includes(\"LB-\")) {\n                lightBoxMountNode.classList.toggle(c);\n            }\n        });\n\n        breakPointsClassNames.split(\" \").forEach((c) => lightBoxMountNode.classList.add(c));\n    }, [breakPointsClassNames, lightBoxMountNode.classList]);\n\n    useLayoutEffect(() => {\n        updateRectAndClassNames();\n\n        lightBoxMountNode.classList.add(lightBoxMountNodeClassName);\n    }, []);\n\n    useLayoutEffect(() => {\n        addClassNameToMountNode();\n    }, [breakPointsClassNames, addClassNameToMountNode]);\n\n    useLayoutEffect(() => {\n        updateRect();\n    });\n\n    const { ref: resizeRef } = useResizeDetector({\n        handleWidth: true,\n        onResize: updateRectAndClassNames,\n        refreshMode: \"throttle\",\n        refreshRate: 150,\n    });\n    return (\n        <Portal container={lightBoxViewManagerNode}>\n            {/* Высота div должна быть равной высоте lightBoxViewManagerNode. */}\n            <div ref={viewNodeRef} style={{ height: \"100%\" }}>\n                <div ref={resizeRef} style={{ width: \"100%\", height: \"100%\", position: \"absolute\" }} />\n                {rectViewNode && (\n                    <style>\n                        {/*\n                            Вернуть --lightBox-screen-left: ${rectViewNode.x}px; в 8й версии библиотеки.\n                        */}\n                        {`\n                            .${lightBoxMountNodeClassName} {\n                                --lightBox-screen-left: ${rectViewNode.x >= 0 ? rectViewNode.x : 0}px;\n                                --lightBox-screen-width: ${rectViewNode.width}px;\n                                --lightBox-screen-top: ${rectViewNode.height}px;\n                            }\n                        `}\n                    </style>\n                )}\n            </div>\n        </Portal>\n    );\n};\n"],"names":[],"mappings":";;;;;AAgBA,MAAM,6BAA6B;AAK5B,MAAM,sBAA2D,CAAC;AAAA,EACrE;AAAA,EACA;AACJ,MAAM;AAEF,QAAM,CAAC,cAAc,eAAe,IAAI,SAAA;AAExC,QAAM,CAAC,uBAAuB,wBAAwB,IAAI,SAAiB,EAAE;AAE7E,QAAM,cAAc,OAA8B,IAAI;AAMtD,QAAM,iCAAiC;AAAA,IACnC,CAAC,SAA8B;AAC3B,UAAI,CAAC,MAAM;AACP;AAAA,MACJ;AAEA,UAAI,aAAqC,CAAA;AAEzC,UAAI,KAAK,SAAS,0BAA0B,qBAAqB;AAC7D,mBAAW,KAAK,0BAA0B,sBAAsB,6BAA6B,CAAC;AAAA,MAClG,OAAO;AACH,mBAAW,KAAK,0BAA0B,sBAAsB,oBAAoB,CAAC;AAAA,MACzF;AAEA,mBAAa,WAAW,OAAO,KAAK,GAAG;AAEvC,UAAI,0BAA0B,YAAY;AACtC,iCAAyB,UAAU;AAAA,MACvC;AAAA,IACJ;AAAA,IACA,CAAC,qBAAqB;AAAA,EAAA;AAG1B,QAAM,aAAa,MAAM;AACrB,QAAI,YAAY,SAAS;AACrB,YAAM,WAAW,YAAY,QAAQ,sBAAA;AAErC,UACI,CAAC;AAAA,QACG,KAAK,cAAc,CAAC,OAAO,QAAQ,SAAS,QAAQ,CAAC;AAAA,QACrD,KAAK,UAAU,CAAC,OAAO,QAAQ,SAAS,QAAQ,CAAC;AAAA,MAAA,GAEvD;AACE,wBAAgB,QAAQ;AAAA,MAC5B;AAAA,IACJ;AAAA,EACJ;AAEA,QAAM,0BAA0B,YAAY,MAAM;AAC9C,QAAI,YAAY,SAAS;AACrB,YAAM,WAAW,YAAY,QAAQ,sBAAA;AACrC,sBAAgB,QAAQ;AACxB,qCAA+B,QAAQ;AAAA,IAC3C;AAAA,EACJ,GAAG,CAAC,8BAA8B,CAAC;AAEnC,QAAM,0BAA0B,YAAY,MAAM;AAC9C,QAAI,CAAC,uBAAuB;AACxB;AAAA,IACJ;AAGA,UAAM,KAAK,kBAAkB,SAAS,EAAE,QAAQ,CAAC,MAAM;AACnD,UAAI,EAAE,SAAS,KAAK,GAAG;AACnB,0BAAkB,UAAU,OAAO,CAAC;AAAA,MACxC;AAAA,IACJ,CAAC;AAED,0BAAsB,MAAM,GAAG,EAAE,QAAQ,CAAC,MAAM,kBAAkB,UAAU,IAAI,CAAC,CAAC;AAAA,EACtF,GAAG,CAAC,uBAAuB,kBAAkB,SAAS,CAAC;AAEvD,kBAAgB,MAAM;AAClB,4BAAA;AAEA,sBAAkB,UAAU,IAAI,0BAA0B;AAAA,EAC9D,GAAG,CAAA,CAAE;AAEL,kBAAgB,MAAM;AAClB,4BAAA;AAAA,EACJ,GAAG,CAAC,uBAAuB,uBAAuB,CAAC;AAEnD,kBAAgB,MAAM;AAClB,eAAA;AAAA,EACJ,CAAC;AAED,QAAM,EAAE,KAAK,UAAA,IAAc,kBAAkB;AAAA,IACzC,aAAa;AAAA,IACb,UAAU;AAAA,IACV,aAAa;AAAA,IACb,aAAa;AAAA,EAAA,CAChB;AACD,SACI,oBAAC,QAAA,EAAO,WAAW,yBAEf,UAAA,qBAAC,OAAA,EAAI,KAAK,aAAa,OAAO,EAAE,QAAQ,OAAA,GACpC,UAAA;AAAA,IAAA,oBAAC,OAAA,EAAI,KAAK,WAAW,OAAO,EAAE,OAAO,QAAQ,QAAQ,QAAQ,UAAU,WAAA,EAAW,CAAG;AAAA,IACpF,oCACI,SAAA,EAII,UAAA;AAAA,+BACM,0BAA0B;AAAA,0DACC,aAAa,KAAK,IAAI,aAAa,IAAI,CAAC;AAAA,2DACvC,aAAa,KAAK;AAAA,yDACpB,aAAa,MAAM;AAAA;AAAA,0BAAA,CAGxD;AAAA,EAAA,EAAA,CAER,EAAA,CACJ;AAER;"}

package/components/LightBox/LightBoxViewManager/LightBoxViewManagerConsts.js

@@ -1,5 +1,10 @@
-import { getScrollbarWidth as r } from "../../../utils/scroll/scrollbar.js";
-const o = 64, i = 16, t = 16, e = o + i + t, a = 1024, l = {
+import { getScrollbarWidth } from "../../../utils/scroll/scrollbar.js";
+const lightBoxArrowWidth = 64;
+const lightBoxArrowMarginToLightBox = 16;
+const lightBoxArrowMarginToScreen = 16;
+const lightBoxArrowWithMarginWidth = lightBoxArrowWidth + lightBoxArrowMarginToLightBox + lightBoxArrowMarginToScreen;
+const lightBoxMediaPoint0 = 1024;
+const LightBoxViewManagerConsts = {
   /**
    * ClassNames для обозначения ширины контейнера.
    * Используются для замены media query в Css, т.к. media query учитывает только ширину экрана, а не ширину элемента.
@@ -12,17 +17,17 @@ const o = 64, i = 16, t = 16, e = o + i + t, a = 1024, l = {
     "more-media-point-0": "global-LB-more-media-point-0"
   },
   // Расстояние от стрелки до лайтбокса.
-  lightBoxArrowMarginToLightBox: i,
+  lightBoxArrowMarginToLightBox,
   // Расстояние от стрелки до края экрана.
-  lightBoxArrowMarginToScreen: t,
+  lightBoxArrowMarginToScreen,
   // Ширина стрелки лайтбокса.
-  lightBoxArrowWidth: o,
+  lightBoxArrowWidth,
   //  Ширина стрелки лайтбокса с полями по бокам.
-  lightBoxArrowWithMarginWidth: e,
+  lightBoxArrowWithMarginWidth,
   // Breakpoint для экранов менее 1024px.
-  lightBoxMediaPoint0: a + r()
+  lightBoxMediaPoint0: lightBoxMediaPoint0 + getScrollbarWidth()
 };
 export {
-  l as LightBoxViewManagerConsts
+  LightBoxViewManagerConsts
 };
 //# sourceMappingURL=LightBoxViewManagerConsts.js.map

package/components/LightBox/LightBoxViewManager/LightBoxViewManagerConsts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightBoxViewManagerConsts.js","sources":["../../../../src/components/LightBox/LightBoxViewManager/LightBoxViewManagerConsts.ts"],"sourcesContent":["/**\n * Константы соответствуют less константам в src/styles/components/lightbox.less.\n */\nimport { getScrollbarWidth } from \"../../../utils/scroll/scrollbar\";\n\ninterface ILightBoxViewManagerConsts {\n    /**\n     * ClassNames для обозначения ширины контейнера.\n     * Используются для замены media query в Css, т.к. media query учитывает только ширину экрана, а не ширину элемента.\n     */\n    breakPointsClassNames: {\n        // Ширина меньше или равна lightBoxMediaPoint0.\n        \"less-or-equal-media-point-0\": string;\n        // Ширина больше lightBoxMediaPoint0.\n        \"more-media-point-0\": string;\n    };\n\n    // Ширина стрелки лайтбокса.\n    lightBoxArrowWidth: number;\n\n    // Расстояние от стрелки до лайтбокса.\n    lightBoxArrowMarginToLightBox: number;\n\n    // Расстояние от стрелки до края экрана.\n    lightBoxArrowMarginToScreen: number;\n\n    // Ширина стрелки лайтбокса с полями по бокам.\n    lightBoxArrowWithMarginWidth: number;\n\n    // Breakpoint для экранов менее 1024px.\n    lightBoxMediaPoint0: number;\n}\n\nconst lightBoxArrowWidth = 64;\nconst lightBoxArrowMarginToLightBox = 16;\nconst lightBoxArrowMarginToScreen = 16;\nconst lightBoxArrowWithMarginWidth = lightBoxArrowWidth + lightBoxArrowMarginToLightBox + lightBoxArrowMarginToScreen; // 96\nconst lightBoxMediaPoint0 = 1024;\n\nexport const LightBoxViewManagerConsts: ILightBoxViewManagerConsts = {\n    /**\n     * ClassNames для обозначения ширины контейнера.\n     * Используются для замены media query в Css, т.к. media query учитывает только ширину экрана, а не ширину элемента.\n     */\n    breakPointsClassNames: {\n        // Ширина меньше или равна lightBoxMediaPoint0.\n        \"less-or-equal-media-point-0\": \"global-LB-less-or-equal-media-point-0\",\n        // Ширина больше lightBoxMediaPoint0.\n        // У этого класса нет стилей, поэтому тут произвольный класс.\n        \"more-media-point-0\": \"global-LB-more-media-point-0\",\n    },\n    // Расстояние от стрелки до лайтбокса.\n    lightBoxArrowMarginToLightBox,\n    // Расстояние от стрелки до края экрана.\n    lightBoxArrowMarginToScreen,\n    // Ширина стрелки лайтбокса.\n    lightBoxArrowWidth,\n    //  Ширина стрелки лайтбокса с полями по бокам.\n    lightBoxArrowWithMarginWidth,\n    // Breakpoint для экранов менее 1024px.\n    lightBoxMediaPoint0: lightBoxMediaPoint0 + getScrollbarWidth(),\n};\n"],"names":[],"mappings":";AAiCA,MAAM,qBAAqB;AAC3B,MAAM,gCAAgC;AACtC,MAAM,8BAA8B;AACpC,MAAM,+BAA+B,qBAAqB,gCAAgC;AAC1F,MAAM,sBAAsB;AAErB,MAAM,4BAAwD;AAAA;AAAA;AAAA;AAAA;AAAA,EAKjE,uBAAuB;AAAA;AAAA,IAEnB,+BAA+B;AAAA;AAAA;AAAA,IAG/B,sBAAsB;AAAA,EAAA;AAAA;AAAA,EAG1B;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA,qBAAqB,sBAAsB,kBAAA;AAC/C;"}

package/components/LightBox/enums.js

@@ -1,5 +1,11 @@
-var l = /* @__PURE__ */ ((r) => (r.SM = "sm", r.MD = "md", r.LG = "lg", r.XL = "xl", r))(l || {});
+var ELightBoxSize = /* @__PURE__ */ ((ELightBoxSize2) => {
+  ELightBoxSize2["SM"] = "sm";
+  ELightBoxSize2["MD"] = "md";
+  ELightBoxSize2["LG"] = "lg";
+  ELightBoxSize2["XL"] = "xl";
+  return ELightBoxSize2;
+})(ELightBoxSize || {});
 export {
-  l as ELightBoxSize
+  ELightBoxSize
 };
 //# sourceMappingURL=enums.js.map

package/components/LightBox/enums.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"enums.js","sources":["../../../src/components/LightBox/enums.ts"],"sourcesContent":["export enum ELightBoxSize {\n    SM = \"sm\",\n    MD = \"md\",\n    LG = \"lg\",\n    XL = \"xl\",\n}\n"],"names":["ELightBoxSize"],"mappings":"AAAO,IAAK,kCAAAA,mBAAL;AACHA,iBAAA,IAAA,IAAK;AACLA,iBAAA,IAAA,IAAK;AACLA,iBAAA,IAAA,IAAK;AACLA,iBAAA,IAAA,IAAK;AAJG,SAAAA;AAAA,GAAA,iBAAA,CAAA,CAAA;"}

package/components/LightBox/index.js

@@ -1,11 +1,11 @@
-import { LightBox as t, lightBoxMountNodeIdDefault as i, lightBoxViewManagerNodeIdDefault as r } from "./LightBox.js";
-import { ELightBoxSize as g } from "./enums.js";
-import { LightBoxSideOverlay as d } from "./LightBoxSideOverlay/LightBoxSideOverlay.js";
+import { LightBox, lightBoxMountNodeIdDefault, lightBoxViewManagerNodeIdDefault } from "./LightBox.js";
+import { ELightBoxSize } from "./enums.js";
+import { LightBoxSideOverlay } from "./LightBoxSideOverlay/LightBoxSideOverlay.js";
 export {
-  g as ELightBoxSize,
-  t as LightBox,
-  d as LightBoxSideOverlay,
-  i as lightBoxMountNodeIdDefault,
-  r as lightBoxViewManagerNodeIdDefault
+  ELightBoxSize,
+  LightBox,
+  LightBoxSideOverlay,
+  lightBoxMountNodeIdDefault,
+  lightBoxViewManagerNodeIdDefault
 };
 //# sourceMappingURL=index.js.map

package/components/LightBox/index.js.map

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