@sberbusiness/triplex-next 1.34.0 → 1.35.0

package/components/Page/components/FooterPage.js

@@ -1,42 +1,53 @@
-import { jsx as e } from "react/jsx-runtime";
-import F, { useRef as R } from "react";
-import { c as T } from "../../../chunks/vendor-D5cfSbgz.js";
-import { Footer as s } from "../../Footer/Footer.js";
-import { EFooterPageType as i } from "./enums.js";
-import { useStickyCornerRadius as d } from "./useStickyCornerRadius.js";
-import { Island as y } from "../../Island/Island.js";
-import { EIslandType as g } from "../../Island/enums.js";
+import { jsx } from "react/jsx-runtime";
+import React__default, { useRef } from "react";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { Footer } from "../../Footer/Footer.js";
+import { EFooterPageType } from "./enums.js";
+import { useStickyCornerRadius } from "./useStickyCornerRadius.js";
+import { Island } from "../../Island/Island.js";
+import { EIslandType } from "../../Island/enums.js";
 import "../../Island/components/IslandBody.js";
 import "../../Island/components/IslandHeader.js";
 import "../../Island/components/IslandFooter.js";
-import { s as c } from "../../../chunks/Page.module-CS5TUL6b.js";
-const w = Object.assign(
-  F.forwardRef(
-    ({ className: m, type: r, size: n, sticky: f, ...p }, o) => {
-      const a = R(null);
-      d(a, "bottom", r === i.FIRST && f);
-      const l = (t) => {
-        a.current = t, typeof o == "function" ? o(t) : o && (o.current = t);
-      }, u = T(m, c.footerPageTypeFirst, {
-        [c.sticky]: r === i.FIRST && f
-      });
-      return r === i.FIRST ? /* @__PURE__ */ e(
-        y,
+import { s as styles } from "../../../chunks/Page.module-DF058wvL.js";
+const FooterPage = Object.assign(
+  React__default.forwardRef(
+    ({ className, type, size, sticky, ...rest }, ref) => {
+      const footerRef = useRef(null);
+      useStickyCornerRadius(footerRef, "bottom", type === EFooterPageType.FIRST && sticky);
+      const setFooterRef = (instance) => {
+        footerRef.current = instance;
+        if (typeof ref === "function") {
+          ref(instance);
+        } else if (ref) {
+          ref.current = instance;
+        }
+      };
+      const footerPageTypeFirstClassNames = clsx(
+        styles.footerPageTypeFirst,
+        {
+          [styles.sticky]: type === EFooterPageType.FIRST && sticky
+        },
+        className
+      );
+      return type === EFooterPageType.FIRST ? /* @__PURE__ */ jsx(
+        Island,
         {
-          className: u,
-          type: g.TYPE_1,
-          ref: l,
-          size: n,
-          children: /* @__PURE__ */ e(s, { ...p })
+          className: footerPageTypeFirstClassNames,
+          type: EIslandType.TYPE_1,
+          ref: setFooterRef,
+          size,
+          children: /* @__PURE__ */ jsx(Footer, { ...rest })
         }
-      ) : /* @__PURE__ */ e(s, { ref: o, className: m, ...p });
+      ) : /* @__PURE__ */ jsx(Footer, { ref, className, ...rest });
     }
   ),
   {
-    Description: s.Description
+    Description: Footer.Description
   }
 );
+FooterPage.displayName = "FooterPage";
 export {
-  w as FooterPage
+  FooterPage
 };
 //# sourceMappingURL=FooterPage.js.map

package/components/Page/components/FooterPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FooterPage.js","sources":["../../../../src/components/Page/components/FooterPage.tsx"],"sourcesContent":["import React, { useRef } from \"react\";\nimport clsx from \"clsx\";\nimport { Footer, IFooterProps } from \"@sberbusiness/triplex-next/components/Footer/Footer\";\nimport { EFooterPageType } from \"./enums\";\nimport { useStickyCornerRadius } from \"./useStickyCornerRadius\";\nimport { EIslandType, Island } from \"../../Island\";\nimport { EComponentSize } from \"@sberbusiness/triplex-next/enums/EComponentSize\";\nimport styles from \"../styles/Page.module.less\";\n\nexport interface IFooterPageTypeSecondProps extends IFooterProps {\n    /** Контент футера страницы. */\n    children: React.ReactNode;\n    /** Тип компонента FooterPage. SECOND рендерит футер без карточки (Island). */\n    type: EFooterPageType.SECOND;\n    /** Прилипание к нижней границе экрана недоступно для типа SECOND. */\n    sticky?: never;\n    /** Размер острова недоступен для типа SECOND, так как контент не оборачивается в Island. */\n    size?: never;\n}\n\nexport interface IFooterPageTypeFirstProps extends IFooterProps {\n    /** Контент футера страницы. */\n    children: React.ReactNode;\n    /** Тип компонента FooterPage. FIRST оборачивает футер в Island (карточку). */\n    type: EFooterPageType.FIRST;\n    /** Footer прилипает к нижней границе экрана при скролле. Только для типа FIRST внутри LightBox. */\n    sticky?: boolean;\n    /** Размер острова (Island). Доступен только для типа FIRST. */\n    size?: EComponentSize;\n}\n\n/** Футер компонента Page. Доступен как `Page.Footer`. Нижний блок страницы с контентом и управляющими элементами. */\nexport const FooterPage = Object.assign(\n    React.forwardRef<HTMLDivElement, IFooterPageTypeFirstProps | IFooterPageTypeSecondProps>(\n        ({ className, type, size, sticky, ...rest }, ref) => {\n            const footerRef = useRef<HTMLDivElement | null>(null);\n            // Плавное обнуление нижних углов и добавление тени при прилипании к низу.\n            useStickyCornerRadius(footerRef, \"bottom\", type === EFooterPageType.FIRST && sticky);\n\n            const setFooterRef = (instance: HTMLDivElement | null) => {\n                footerRef.current = instance;\n                if (typeof ref === \"function\") {\n                    ref(instance);\n                } else if (ref) {\n                    ref.current = instance;\n                }\n            };\n\n            const footerPageTypeFirstClassNames = clsx(\n                styles.footerPageTypeFirst,\n                {\n                    [styles.sticky]: type === EFooterPageType.FIRST && sticky,\n                },\n                className,\n            );\n\n            return type === EFooterPageType.FIRST ? (\n                <Island\n                    className={footerPageTypeFirstClassNames}\n                    type={EIslandType.TYPE_1}\n                    ref={setFooterRef}\n                    size={size}\n                >\n                    <Footer {...rest} />\n                </Island>\n            ) : (\n                <Footer ref={ref} className={className} {...rest} />\n            );\n        },\n    ),\n    {\n        Description: Footer.Description,\n    },\n);\n\nFooterPage.displayName = \"FooterPage\";\n"],"names":["React"],"mappings":";;;;;;;;;;;;AAgCO,MAAM,aAAa,OAAO;AAAA,EAC7BA,eAAM;AAAA,IACF,CAAC,EAAE,WAAW,MAAM,MAAM,QAAQ,GAAG,KAAA,GAAQ,QAAQ;AACjD,YAAM,YAAY,OAA8B,IAAI;AAEpD,4BAAsB,WAAW,UAAU,SAAS,gBAAgB,SAAS,MAAM;AAEnF,YAAM,eAAe,CAAC,aAAoC;AACtD,kBAAU,UAAU;AACpB,YAAI,OAAO,QAAQ,YAAY;AAC3B,cAAI,QAAQ;AAAA,QAChB,WAAW,KAAK;AACZ,cAAI,UAAU;AAAA,QAClB;AAAA,MACJ;AAEA,YAAM,gCAAgC;AAAA,QAClC,OAAO;AAAA,QACP;AAAA,UACI,CAAC,OAAO,MAAM,GAAG,SAAS,gBAAgB,SAAS;AAAA,QAAA;AAAA,QAEvD;AAAA,MAAA;AAGJ,aAAO,SAAS,gBAAgB,QAC5B;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,WAAW;AAAA,UACX,MAAM,YAAY;AAAA,UAClB,KAAK;AAAA,UACL;AAAA,UAEA,UAAA,oBAAC,QAAA,EAAQ,GAAG,KAAA,CAAM;AAAA,QAAA;AAAA,MAAA,IAGtB,oBAAC,QAAA,EAAO,KAAU,WAAuB,GAAG,MAAM;AAAA,IAE1D;AAAA,EAAA;AAAA,EAEJ;AAAA,IACI,aAAa,OAAO;AAAA,EAAA;AAE5B;AAEA,WAAW,cAAc;"}

package/components/Page/components/HeaderPage.js

@@ -1,33 +1,47 @@
-import { jsx as s } from "react/jsx-runtime";
-import T, { useRef as R } from "react";
-import { Header as e } from "../../Header/Header.js";
-import { EHeaderPageType as t } from "./enums.js";
-import { c as p } from "../../../chunks/vendor-D5cfSbgz.js";
-import { Island as S } from "../../Island/Island.js";
-import { EIslandType as y } from "../../Island/enums.js";
-import { useStickyCornerRadius as b } from "./useStickyCornerRadius.js";
-import { s as i } from "../../../chunks/Page.module-CS5TUL6b.js";
-const j = Object.assign(
-  T.forwardRef(
-    ({ className: m, type: a, size: n, sticky: d, ...f }, r) => {
-      const l = R(null);
-      b(l, "top", a === t.FIRST && d);
-      const c = (o) => {
-        l.current = o, typeof r == "function" ? r(o) : r && (r.current = o);
-      }, u = p(m, i.headerPageTypeFirst, {
-        [i.sticky]: a === t.FIRST && d
-      });
-      return a === t.FIRST ? /* @__PURE__ */ s(S, { className: u, type: y.TYPE_1, size: n, ref: c, children: /* @__PURE__ */ s(e, { ...f }) }) : /* @__PURE__ */ s(e, { ref: r, className: p(i.headerPageTypeSecond, m), ...f });
+import { jsx } from "react/jsx-runtime";
+import React__default, { useRef } from "react";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import { Header } from "../../Header/Header.js";
+import { EHeaderPageType } from "./enums.js";
+import { useStickyCornerRadius } from "./useStickyCornerRadius.js";
+import { Island } from "../../Island/Island.js";
+import { EIslandType } from "../../Island/enums.js";
+import "../../Island/components/IslandBody.js";
+import "../../Island/components/IslandHeader.js";
+import "../../Island/components/IslandFooter.js";
+import { s as styles } from "../../../chunks/Page.module-DF058wvL.js";
+const HeaderPage = Object.assign(
+  React__default.forwardRef(
+    ({ className, type, size, sticky, ...rest }, ref) => {
+      const islandRef = useRef(null);
+      useStickyCornerRadius(islandRef, "top", type === EHeaderPageType.FIRST && sticky);
+      const setIslandRef = (instance) => {
+        islandRef.current = instance;
+        if (typeof ref === "function") {
+          ref(instance);
+        } else if (ref) {
+          ref.current = instance;
+        }
+      };
+      const headerPageFirstClassNames = clsx(
+        styles.headerPageTypeFirst,
+        {
+          [styles.sticky]: type === EHeaderPageType.FIRST && sticky
+        },
+        className
+      );
+      return type === EHeaderPageType.FIRST ? /* @__PURE__ */ jsx(Island, { className: headerPageFirstClassNames, type: EIslandType.TYPE_1, size, ref: setIslandRef, children: /* @__PURE__ */ jsx(Header, { ...rest }) }) : /* @__PURE__ */ jsx(Header, { ref, className: clsx(styles.headerPageTypeSecond, className), ...rest });
     }
   ),
   {
-    LayoutSidebar: e.LayoutSidebar,
-    Subhead: e.Subhead,
-    Tabs: e.Tabs,
-    Title: e.Title
+    LayoutSidebar: Header.LayoutSidebar,
+    Subhead: Header.Subhead,
+    Tabs: Header.Tabs,
+    Title: Header.Title
   }
 );
+HeaderPage.displayName = "HeaderPage";
 export {
-  j as HeaderPage
+  HeaderPage
 };
 //# sourceMappingURL=HeaderPage.js.map

package/components/Page/components/HeaderPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderPage.js","sources":["../../../../src/components/Page/components/HeaderPage.tsx"],"sourcesContent":["import React, { useRef } from \"react\";\nimport clsx from \"clsx\";\nimport { Header, IHeaderProps } from \"@sberbusiness/triplex-next/components/Header/Header\";\nimport { EHeaderPageType } from \"./enums\";\nimport { useStickyCornerRadius } from \"./useStickyCornerRadius\";\nimport { EIslandType, Island } from \"../../Island\";\nimport { EComponentSize } from \"@sberbusiness/triplex-next/enums/EComponentSize\";\nimport styles from \"../styles/Page.module.less\";\n\nexport interface IHeaderPageTypeSecondProps extends IHeaderProps {\n    /** Контент заголовка страницы. */\n    children: React.ReactNode;\n    /** Тип компонента HeaderPage. SECOND рендерит заголовок без карточки (Island). */\n    type: EHeaderPageType.SECOND;\n    /** Прилипание к верхней границе экрана недоступно для типа SECOND. */\n    sticky?: never;\n    /** Размер острова недоступен для типа SECOND, так как контент не оборачивается в Island. */\n    size?: never;\n}\n\nexport interface IHeaderPageTypeFirstProps extends IHeaderProps {\n    /** Контент заголовка страницы. */\n    children: React.ReactNode;\n    /** Тип компонента HeaderPage. FIRST оборачивает заголовок в Island (карточку). */\n    type: EHeaderPageType.FIRST;\n    /** Header прилипает к верхней границе экрана при скролле. Только для типа FIRST внутри LightBox. */\n    sticky?: boolean;\n    /** Размер острова (Island). Доступен только для типа FIRST. */\n    size?: EComponentSize;\n}\n\n/** Заголовок страницы Page. Доступен как `Page.Header`. Верхний блок страницы с заголовком, табами и подзаголовком. */\nexport const HeaderPage = Object.assign(\n    React.forwardRef<HTMLDivElement, IHeaderPageTypeFirstProps | IHeaderPageTypeSecondProps>(\n        ({ className, type, size, sticky, ...rest }, ref) => {\n            const islandRef = useRef<HTMLDivElement | null>(null);\n            // Плавное обнуление верхних углов и добавление тени при прилипании к верху.\n            useStickyCornerRadius(islandRef, \"top\", type === EHeaderPageType.FIRST && sticky);\n\n            const setIslandRef = (instance: HTMLDivElement | null) => {\n                islandRef.current = instance;\n                if (typeof ref === \"function\") {\n                    ref(instance);\n                } else if (ref) {\n                    ref.current = instance;\n                }\n            };\n\n            const headerPageFirstClassNames = clsx(\n                styles.headerPageTypeFirst,\n                {\n                    [styles.sticky]: type === EHeaderPageType.FIRST && sticky,\n                },\n                className,\n            );\n\n            return type === EHeaderPageType.FIRST ? (\n                <Island className={headerPageFirstClassNames} type={EIslandType.TYPE_1} size={size} ref={setIslandRef}>\n                    <Header {...rest} />\n                </Island>\n            ) : (\n                <Header ref={ref} className={clsx(styles.headerPageTypeSecond, className)} {...rest} />\n            );\n        },\n    ),\n    {\n        LayoutSidebar: Header.LayoutSidebar,\n        Subhead: Header.Subhead,\n        Tabs: Header.Tabs,\n        Title: Header.Title,\n    },\n);\n\nHeaderPage.displayName = \"HeaderPage\";\n"],"names":["React"],"mappings":";;;;;;;;;;;;AAgCO,MAAM,aAAa,OAAO;AAAA,EAC7BA,eAAM;AAAA,IACF,CAAC,EAAE,WAAW,MAAM,MAAM,QAAQ,GAAG,KAAA,GAAQ,QAAQ;AACjD,YAAM,YAAY,OAA8B,IAAI;AAEpD,4BAAsB,WAAW,OAAO,SAAS,gBAAgB,SAAS,MAAM;AAEhF,YAAM,eAAe,CAAC,aAAoC;AACtD,kBAAU,UAAU;AACpB,YAAI,OAAO,QAAQ,YAAY;AAC3B,cAAI,QAAQ;AAAA,QAChB,WAAW,KAAK;AACZ,cAAI,UAAU;AAAA,QAClB;AAAA,MACJ;AAEA,YAAM,4BAA4B;AAAA,QAC9B,OAAO;AAAA,QACP;AAAA,UACI,CAAC,OAAO,MAAM,GAAG,SAAS,gBAAgB,SAAS;AAAA,QAAA;AAAA,QAEvD;AAAA,MAAA;AAGJ,aAAO,SAAS,gBAAgB,QAC5B,oBAAC,QAAA,EAAO,WAAW,2BAA2B,MAAM,YAAY,QAAQ,MAAY,KAAK,cACrF,UAAA,oBAAC,QAAA,EAAQ,GAAG,KAAA,CAAM,EAAA,CACtB,IAEA,oBAAC,QAAA,EAAO,KAAU,WAAW,KAAK,OAAO,sBAAsB,SAAS,GAAI,GAAG,MAAM;AAAA,IAE7F;AAAA,EAAA;AAAA,EAEJ;AAAA,IACI,eAAe,OAAO;AAAA,IACtB,SAAS,OAAO;AAAA,IAChB,MAAM,OAAO;AAAA,IACb,OAAO,OAAO;AAAA,EAAA;AAEtB;AAEA,WAAW,cAAc;"}

package/components/Page/components/enums.js

@@ -1,8 +1,27 @@
-var s = /* @__PURE__ */ ((r) => (r.FIRST = "first", r.SECOND = "second", r))(s || {}), S = /* @__PURE__ */ ((r) => (r.FIRST = "first", r.SECOND = "second", r))(S || {}), n = /* @__PURE__ */ ((r) => (r.FIRST = "first", r.SECOND = "second", r))(n || {}), t = /* @__PURE__ */ ((r) => (r.LARGE = "large", r.SMALL = "small", r))(t || {});
+var EHeaderPageType = /* @__PURE__ */ ((EHeaderPageType2) => {
+  EHeaderPageType2["FIRST"] = "first";
+  EHeaderPageType2["SECOND"] = "second";
+  return EHeaderPageType2;
+})(EHeaderPageType || {});
+var EFooterPageType = /* @__PURE__ */ ((EFooterPageType2) => {
+  EFooterPageType2["FIRST"] = "first";
+  EFooterPageType2["SECOND"] = "second";
+  return EFooterPageType2;
+})(EFooterPageType || {});
+var EBodyPageType = /* @__PURE__ */ ((EBodyPageType2) => {
+  EBodyPageType2["FIRST"] = "first";
+  EBodyPageType2["SECOND"] = "second";
+  return EBodyPageType2;
+})(EBodyPageType || {});
+var EBodyPageVerticalMargin = /* @__PURE__ */ ((EBodyPageVerticalMargin2) => {
+  EBodyPageVerticalMargin2["LARGE"] = "large";
+  EBodyPageVerticalMargin2["SMALL"] = "small";
+  return EBodyPageVerticalMargin2;
+})(EBodyPageVerticalMargin || {});
 export {
-  n as EBodyPageType,
-  t as EBodyPageVerticalMargin,
-  S as EFooterPageType,
-  s as EHeaderPageType
+  EBodyPageType,
+  EBodyPageVerticalMargin,
+  EFooterPageType,
+  EHeaderPageType
 };
 //# sourceMappingURL=enums.js.map

package/components/Page/components/enums.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"enums.js","sources":["../../../../src/components/Page/components/enums.ts"],"sourcesContent":["export enum EHeaderPageType {\n    FIRST = \"first\",\n    SECOND = \"second\",\n}\n\nexport enum EFooterPageType {\n    FIRST = \"first\",\n    SECOND = \"second\",\n}\n\nexport enum EBodyPageType {\n    FIRST = \"first\",\n    SECOND = \"second\",\n}\n\nexport enum EBodyPageVerticalMargin {\n    /** Большие вертикальные отступы: 24px (16px на узких экранах). Значение по умолчанию. */\n    LARGE = \"large\",\n    /** Маленькие вертикальные отступы: 16px (8px на узких экранах). Используется в LightBox. */\n    SMALL = \"small\",\n}\n"],"names":["EHeaderPageType","EFooterPageType","EBodyPageType","EBodyPageVerticalMargin"],"mappings":"AAAO,IAAK,oCAAAA,qBAAL;AACHA,mBAAA,OAAA,IAAQ;AACRA,mBAAA,QAAA,IAAS;AAFD,SAAAA;AAAA,GAAA,mBAAA,CAAA,CAAA;AAKL,IAAK,oCAAAC,qBAAL;AACHA,mBAAA,OAAA,IAAQ;AACRA,mBAAA,QAAA,IAAS;AAFD,SAAAA;AAAA,GAAA,mBAAA,CAAA,CAAA;AAKL,IAAK,kCAAAC,mBAAL;AACHA,iBAAA,OAAA,IAAQ;AACRA,iBAAA,QAAA,IAAS;AAFD,SAAAA;AAAA,GAAA,iBAAA,CAAA,CAAA;AAKL,IAAK,4CAAAC,6BAAL;AAEHA,2BAAA,OAAA,IAAQ;AAERA,2BAAA,OAAA,IAAQ;AAJA,SAAAA;AAAA,GAAA,2BAAA,CAAA,CAAA;"}

package/components/Page/components/useStickyCornerRadius.js

@@ -1,47 +1,88 @@
-import { useEffect as L } from "react";
-function h(c) {
-  let e = c;
-  for (; e && e !== document.documentElement; ) {
-    const t = getComputedStyle(e).overflowY;
-    if (/(auto|scroll|overlay)/.test(t)) return e;
-    e = e.parentElement;
+import { useEffect } from "react";
+function getScrollParent(el) {
+  let node = el;
+  while (node && node !== document.documentElement) {
+    const style = getComputedStyle(node);
+    const overflowY = style.overflowY;
+    if (/(auto|scroll|overlay)/.test(overflowY)) return node;
+    node = node.parentElement;
   }
   return window;
 }
-function b(c, e, m = !0) {
-  L(() => {
-    const t = c.current;
-    if (!t) return;
-    const f = e === "top" ? "--r-top" : "--r-bottom";
-    if (!m) {
-      t.style.removeProperty(f), delete t.dataset.stuck;
+function useStickyCornerRadius(ref, edge, isEnabled = true) {
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    const cssVarName = edge === "top" ? "--r-top" : "--r-bottom";
+    if (!isEnabled) {
+      el.style.removeProperty(cssVarName);
+      delete el.dataset.stuck;
       return;
     }
-    const v = 24;
-    let u = 0, i = 0, r = window, d = null, l = null;
-    const w = () => {
-      i = 0;
-      const o = t.getBoundingClientRect(), s = r === window ? { top: 0, bottom: window.innerHeight } : r.getBoundingClientRect(), n = e === "top" ? o.top - (s.top + u) : s.bottom - u - o.bottom, y = Math.max(0, Math.min(v, n));
-      t.style.setProperty(f, `${y}px`), y <= 0.5 ? t.dataset.stuck = "true" : delete t.dataset.stuck;
-    }, a = () => {
-      i || (i = requestAnimationFrame(w));
-    }, E = () => {
-      const o = getComputedStyle(t), s = e === "top" ? o.top : o.bottom;
-      u = parseFloat(s || "0") || 0, r = h(t), d = r === window ? window : r, w(), d.addEventListener("scroll", a, { passive: !0 }), window.addEventListener("resize", a), window.addEventListener("transitionend", p), l = new ResizeObserver(a);
-      let n = t.parentElement;
-      for (; n && (l.observe(n), n !== r); )
-        n = n.parentElement;
-    }, p = (o) => {
-      o.target && o.target instanceof HTMLElement && o.target.classList && o.propertyName === "transform" && Array.from(o.target.classList).some(
-        (s) => s.includes("lightBoxSideOverlayContent")
-      ) && w();
-    }, g = setTimeout(E, 100);
+    const maxRadius = 24;
+    let stickyOffset = 0;
+    let raf = 0;
+    let scroller = window;
+    let target = null;
+    let resizeObserver = null;
+    const update = () => {
+      raf = 0;
+      const rect = el.getBoundingClientRect();
+      const scrollerRect = scroller === window ? { top: 0, bottom: window.innerHeight } : scroller.getBoundingClientRect();
+      const dist = edge === "top" ? rect.top - (scrollerRect.top + stickyOffset) : scrollerRect.bottom - stickyOffset - rect.bottom;
+      const r = Math.max(0, Math.min(maxRadius, dist));
+      el.style.setProperty(cssVarName, `${r}px`);
+      if (r <= 0.5) {
+        el.dataset.stuck = "true";
+      } else {
+        delete el.dataset.stuck;
+      }
+    };
+    const handleScrollOrResize = () => {
+      if (raf) return;
+      raf = requestAnimationFrame(update);
+    };
+    const initialize = () => {
+      const computed = getComputedStyle(el);
+      const offsetRaw = edge === "top" ? computed.top : computed.bottom;
+      stickyOffset = parseFloat(offsetRaw || "0") || 0;
+      scroller = getScrollParent(el);
+      target = scroller === window ? window : scroller;
+      update();
+      target.addEventListener("scroll", handleScrollOrResize, { passive: true });
+      window.addEventListener("resize", handleScrollOrResize);
+      window.addEventListener("transitionend", handleTransitionEnd);
+      resizeObserver = new ResizeObserver(handleScrollOrResize);
+      let ancestor = el.parentElement;
+      while (ancestor) {
+        resizeObserver.observe(ancestor);
+        if (ancestor === scroller) break;
+        ancestor = ancestor.parentElement;
+      }
+    };
+    const handleTransitionEnd = (event) => {
+      if (event.target && event.target instanceof HTMLElement && event.target.classList) {
+        if (event.propertyName === "transform" && Array.from(event.target.classList).some(
+          (className) => className.includes("lightBoxSideOverlayContent")
+        )) {
+          update();
+        }
+      }
+    };
+    const initTimeoutId = setTimeout(initialize, 100);
     return () => {
-      clearTimeout(g), d && d.removeEventListener("scroll", a), window.removeEventListener("resize", a), window.removeEventListener("transitionend", p), l == null || l.disconnect(), i && cancelAnimationFrame(i);
+      clearTimeout(initTimeoutId);
+      if (target) {
+        target.removeEventListener("scroll", handleScrollOrResize);
+      }
+      window.removeEventListener("resize", handleScrollOrResize);
+      window.removeEventListener("transitionend", handleTransitionEnd);
+      resizeObserver == null ? void 0 : resizeObserver.disconnect();
+      if (raf) cancelAnimationFrame(raf);
     };
-  }, [c, e, m]);
+  }, [ref, edge, isEnabled]);
 }
 export {
-  b as useStickyCornerRadius
+  useStickyCornerRadius
 };
 //# sourceMappingURL=useStickyCornerRadius.js.map

package/components/Page/components/useStickyCornerRadius.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStickyCornerRadius.js","sources":["../../../../src/components/Page/components/useStickyCornerRadius.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\n/**\n * Получает родительский элемент, который является контейнером прокрутки.\n * @param el - Элемент, для которого нужно найти родительский контейнер прокрутки.\n * @returns Родительский элемент, который является контейнером прокрутки, или окно.\n */\nfunction getScrollParent(el: HTMLElement | null): HTMLElement | Window {\n    let node: HTMLElement | null = el;\n    while (node && node !== document.documentElement) {\n        const style = getComputedStyle(node);\n        const overflowY = style.overflowY;\n        if (/(auto|scroll|overlay)/.test(overflowY)) return node;\n        node = node.parentElement;\n    }\n    return window;\n}\n\n/**\n * Управляет радиусом скругления и тенью sticky-элемента.\n * Когда элемент \"прилипает\" (`r === 0`) — добавляется тень.\n * @param ref - Ссылка на элемент, для которого нужно управлять радиусом скругления и тенью.\n * @param edge - Край элемента, к которому нужно прилипать: \"top\" (верхний) или \"bottom\" (нижний).\n * @param isEnabled - Флаг, определяющий, нужно ли управлять радиусом скругления и тенью.\n */\nexport function useStickyCornerRadius(ref: React.RefObject<HTMLElement>, edge: \"top\" | \"bottom\", isEnabled = true) {\n    useEffect(() => {\n        const el = ref.current;\n        if (!el) return;\n\n        const cssVarName = edge === \"top\" ? \"--r-top\" : \"--r-bottom\";\n        if (!isEnabled) {\n            el.style.removeProperty(cssVarName);\n            delete el.dataset.stuck;\n            return;\n        }\n\n        const maxRadius = 24;\n\n        let stickyOffset = 0;\n        let raf = 0;\n        let scroller: HTMLElement | Window = window;\n        let target: HTMLElement | Window | null = null;\n        let resizeObserver: ResizeObserver | null = null;\n\n        const update = () => {\n            raf = 0;\n            const rect = el.getBoundingClientRect();\n            const scrollerRect =\n                scroller === window\n                    ? { top: 0, bottom: window.innerHeight }\n                    : (scroller as HTMLElement).getBoundingClientRect();\n\n            const dist =\n                edge === \"top\"\n                    ? rect.top - (scrollerRect.top + stickyOffset)\n                    : scrollerRect.bottom - stickyOffset - rect.bottom;\n            const r = Math.max(0, Math.min(maxRadius, dist));\n\n            el.style.setProperty(cssVarName, `${r}px`);\n            if (r <= 0.5) {\n                el.dataset.stuck = \"true\";\n            } else {\n                delete el.dataset.stuck;\n            }\n        };\n\n        const handleScrollOrResize = () => {\n            if (raf) return;\n            raf = requestAnimationFrame(update);\n        };\n\n        const initialize = () => {\n            const computed = getComputedStyle(el);\n            const offsetRaw = edge === \"top\" ? computed.top : computed.bottom;\n            stickyOffset = parseFloat(offsetRaw || \"0\") || 0;\n            scroller = getScrollParent(el);\n            target = scroller === window ? window : (scroller as HTMLElement);\n\n            update();\n\n            target.addEventListener(\"scroll\", handleScrollOrResize, { passive: true });\n            window.addEventListener(\"resize\", handleScrollOrResize);\n            window.addEventListener(\"transitionend\", handleTransitionEnd);\n\n            // Отслеживаем изменение размеров элементов от sticky-элемента до скроллера.\n            // При раскрытии Spoiler высота контента меняется без scroll/resize,\n            // но размер одного из предков (Page, LightBoxContent) изменится.\n            resizeObserver = new ResizeObserver(handleScrollOrResize);\n            let ancestor: HTMLElement | null = el.parentElement;\n            while (ancestor) {\n                resizeObserver.observe(ancestor);\n                if (ancestor === scroller) break;\n                ancestor = ancestor.parentElement;\n            }\n        };\n\n        const handleTransitionEnd = (event: TransitionEvent) => {\n            if (event.target && event.target instanceof HTMLElement && event.target.classList) {\n                // Обновляем радиус скругления и тень при завершении анимации SideOverlay.\n                if (\n                    event.propertyName === \"transform\" &&\n                    Array.from(event.target.classList).some((className) =>\n                        className.includes(\"lightBoxSideOverlayContent\"),\n                    )\n                ) {\n                    update();\n                }\n            }\n        };\n\n        // При открытии LightBox без задержки, анимация не работает.\n        const initTimeoutId = setTimeout(initialize, 100);\n\n        return () => {\n            clearTimeout(initTimeoutId);\n            if (target) {\n                target.removeEventListener(\"scroll\", handleScrollOrResize);\n            }\n            window.removeEventListener(\"resize\", handleScrollOrResize);\n            window.removeEventListener(\"transitionend\", handleTransitionEnd);\n            resizeObserver?.disconnect();\n            if (raf) cancelAnimationFrame(raf);\n        };\n    }, [ref, edge, isEnabled]);\n}\n"],"names":[],"mappings":";AAOA,SAAS,gBAAgB,IAA8C;AACnE,MAAI,OAA2B;AAC/B,SAAO,QAAQ,SAAS,SAAS,iBAAiB;AAC9C,UAAM,QAAQ,iBAAiB,IAAI;AACnC,UAAM,YAAY,MAAM;AACxB,QAAI,wBAAwB,KAAK,SAAS,EAAG,QAAO;AACpD,WAAO,KAAK;AAAA,EAChB;AACA,SAAO;AACX;AASO,SAAS,sBAAsB,KAAmC,MAAwB,YAAY,MAAM;AAC/G,YAAU,MAAM;AACZ,UAAM,KAAK,IAAI;AACf,QAAI,CAAC,GAAI;AAET,UAAM,aAAa,SAAS,QAAQ,YAAY;AAChD,QAAI,CAAC,WAAW;AACZ,SAAG,MAAM,eAAe,UAAU;AAClC,aAAO,GAAG,QAAQ;AAClB;AAAA,IACJ;AAEA,UAAM,YAAY;AAElB,QAAI,eAAe;AACnB,QAAI,MAAM;AACV,QAAI,WAAiC;AACrC,QAAI,SAAsC;AAC1C,QAAI,iBAAwC;AAE5C,UAAM,SAAS,MAAM;AACjB,YAAM;AACN,YAAM,OAAO,GAAG,sBAAA;AAChB,YAAM,eACF,aAAa,SACP,EAAE,KAAK,GAAG,QAAQ,OAAO,gBACxB,SAAyB,sBAAA;AAEpC,YAAM,OACF,SAAS,QACH,KAAK,OAAO,aAAa,MAAM,gBAC/B,aAAa,SAAS,eAAe,KAAK;AACpD,YAAM,IAAI,KAAK,IAAI,GAAG,KAAK,IAAI,WAAW,IAAI,CAAC;AAE/C,SAAG,MAAM,YAAY,YAAY,GAAG,CAAC,IAAI;AACzC,UAAI,KAAK,KAAK;AACV,WAAG,QAAQ,QAAQ;AAAA,MACvB,OAAO;AACH,eAAO,GAAG,QAAQ;AAAA,MACtB;AAAA,IACJ;AAEA,UAAM,uBAAuB,MAAM;AAC/B,UAAI,IAAK;AACT,YAAM,sBAAsB,MAAM;AAAA,IACtC;AAEA,UAAM,aAAa,MAAM;AACrB,YAAM,WAAW,iBAAiB,EAAE;AACpC,YAAM,YAAY,SAAS,QAAQ,SAAS,MAAM,SAAS;AAC3D,qBAAe,WAAW,aAAa,GAAG,KAAK;AAC/C,iBAAW,gBAAgB,EAAE;AAC7B,eAAS,aAAa,SAAS,SAAU;AAEzC,aAAA;AAEA,aAAO,iBAAiB,UAAU,sBAAsB,EAAE,SAAS,MAAM;AACzE,aAAO,iBAAiB,UAAU,oBAAoB;AACtD,aAAO,iBAAiB,iBAAiB,mBAAmB;AAK5D,uBAAiB,IAAI,eAAe,oBAAoB;AACxD,UAAI,WAA+B,GAAG;AACtC,aAAO,UAAU;AACb,uBAAe,QAAQ,QAAQ;AAC/B,YAAI,aAAa,SAAU;AAC3B,mBAAW,SAAS;AAAA,MACxB;AAAA,IACJ;AAEA,UAAM,sBAAsB,CAAC,UAA2B;AACpD,UAAI,MAAM,UAAU,MAAM,kBAAkB,eAAe,MAAM,OAAO,WAAW;AAE/E,YACI,MAAM,iBAAiB,eACvB,MAAM,KAAK,MAAM,OAAO,SAAS,EAAE;AAAA,UAAK,CAAC,cACrC,UAAU,SAAS,4BAA4B;AAAA,QAAA,GAErD;AACE,iBAAA;AAAA,QACJ;AAAA,MACJ;AAAA,IACJ;AAGA,UAAM,gBAAgB,WAAW,YAAY,GAAG;AAEhD,WAAO,MAAM;AACT,mBAAa,aAAa;AAC1B,UAAI,QAAQ;AACR,eAAO,oBAAoB,UAAU,oBAAoB;AAAA,MAC7D;AACA,aAAO,oBAAoB,UAAU,oBAAoB;AACzD,aAAO,oBAAoB,iBAAiB,mBAAmB;AAC/D,uDAAgB;AAChB,UAAI,0BAA0B,GAAG;AAAA,IACrC;AAAA,EACJ,GAAG,CAAC,KAAK,MAAM,SAAS,CAAC;AAC7B;"}

package/components/Page/index.js

@@ -1,16 +1,16 @@
-import { Page as r } from "./Page.js";
-import { EBodyPageType as g, EBodyPageVerticalMargin as p, EFooterPageType as t, EHeaderPageType as P } from "./components/enums.js";
-import { HeaderPage as d } from "./components/HeaderPage.js";
-import { BodyPage as m } from "./components/BodyPage.js";
-import { FooterPage as E } from "./components/FooterPage.js";
+import { Page } from "./Page.js";
+import { EBodyPageType, EBodyPageVerticalMargin, EFooterPageType, EHeaderPageType } from "./components/enums.js";
+import { HeaderPage } from "./components/HeaderPage.js";
+import { BodyPage } from "./components/BodyPage.js";
+import { FooterPage } from "./components/FooterPage.js";
 export {
-  m as BodyPage,
-  g as EBodyPageType,
-  p as EBodyPageVerticalMargin,
-  t as EFooterPageType,
-  P as EHeaderPageType,
-  E as FooterPage,
-  d as HeaderPage,
-  r as Page
+  BodyPage,
+  EBodyPageType,
+  EBodyPageVerticalMargin,
+  EFooterPageType,
+  EHeaderPageType,
+  FooterPage,
+  HeaderPage,
+  Page
 };
 //# sourceMappingURL=index.js.map

package/components/Page/index.js.map

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

package/components/Pagination/Pagination.js

@@ -1,22 +1,24 @@
-import { PaginationExtended as a } from "./components/PaginationExtended.js";
-import { PaginationNavigation as e } from "./components/PaginationNavigation.js";
+import { PaginationExtended } from "./components/PaginationExtended.js";
+import { PaginationNavigation } from "./components/PaginationNavigation.js";
 import "./components/PaginationNavigationButton.js";
 import "./components/PaginationNavigationExtended.js";
 import "./components/PaginationNavigationExtendedItem.js";
 import "./components/PaginationPageButton.js";
 import "./components/PaginationPageEllipsis.js";
-import { PaginationSelect as n } from "./components/PaginationSelect.js";
+import { PaginationSelect } from "./components/PaginationSelect.js";
 import "./enums.js";
-import { jsxs as p, jsx as r } from "react/jsx-runtime";
-import f from "react";
-const d = f.forwardRef(
-  ({ paginationNavigationProps: t, paginationSelectProps: o, ...i }, m) => /* @__PURE__ */ p(a, { ...i, ref: m, children: [
-    o && /* @__PURE__ */ r(n, { ...o }),
-    t.totalPages > 1 && /* @__PURE__ */ r(e, { ...t })
-  ] })
+import { jsxs, jsx } from "react/jsx-runtime";
+import React__default from "react";
+const Pagination = React__default.forwardRef(
+  ({ paginationNavigationProps, paginationSelectProps, ...rest }, ref) => {
+    return /* @__PURE__ */ jsxs(PaginationExtended, { ...rest, ref, children: [
+      paginationSelectProps && /* @__PURE__ */ jsx(PaginationSelect, { ...paginationSelectProps }),
+      paginationNavigationProps.totalPages > 1 && /* @__PURE__ */ jsx(PaginationNavigation, { ...paginationNavigationProps })
+    ] });
+  }
 );
-d.displayName = "Pagination";
+Pagination.displayName = "Pagination";
 export {
-  d as Pagination
+  Pagination
 };
 //# sourceMappingURL=Pagination.js.map

package/components/Pagination/Pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.js","sources":["../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import React from \"react\";\nimport { IPaginationExtendedProps, PaginationExtended } from \"./components/PaginationExtended\";\nimport { IPaginationSelectProps, PaginationSelect } from \"./components/PaginationSelect\";\nimport { IPaginationNavigationProps, PaginationNavigation } from \"./components/PaginationNavigation\";\n\n/** Свойства компонента Pagination. */\nexport interface IPaginationProps extends IPaginationExtendedProps {\n    /** Свойства компонента PaginationSelect. */\n    paginationSelectProps?: IPaginationSelectProps;\n    /** Свойства компонента PaginationNavigation. */\n    paginationNavigationProps: IPaginationNavigationProps;\n}\n\n/** Пагинация: выбор количества элементов на странице (PaginationSelect) и навигация по страницам (PaginationNavigation). */\nexport const Pagination = React.forwardRef<HTMLSpanElement, IPaginationProps>(\n    ({ paginationNavigationProps, paginationSelectProps, ...rest }, ref) => {\n        return (\n            <PaginationExtended {...rest} ref={ref}>\n                {paginationSelectProps && <PaginationSelect {...paginationSelectProps} />}\n                {paginationNavigationProps.totalPages > 1 && <PaginationNavigation {...paginationNavigationProps} />}\n            </PaginationExtended>\n        );\n    },\n);\n\nPagination.displayName = \"Pagination\";\n"],"names":["React"],"mappings":";;;;;;;;;;;AAcO,MAAM,aAAaA,eAAM;AAAA,EAC5B,CAAC,EAAE,2BAA2B,uBAAuB,GAAG,KAAA,GAAQ,QAAQ;AACpE,WACI,qBAAC,oBAAA,EAAoB,GAAG,MAAM,KACzB,UAAA;AAAA,MAAA,yBAAyB,oBAAC,kBAAA,EAAkB,GAAG,sBAAA,CAAuB;AAAA,MACtE,0BAA0B,aAAa,KAAK,oBAAC,sBAAA,EAAsB,GAAG,0BAAA,CAA2B;AAAA,IAAA,GACtG;AAAA,EAER;AACJ;AAEA,WAAW,cAAc;"}

package/components/Pagination/components/PaginationExtended.js

@@ -1,22 +1,26 @@
-import { jsx as o } from "react/jsx-runtime";
-import { c as d } from "../../../chunks/vendor-D5cfSbgz.js";
-import i from "react";
-const r = "paginationExtended__c02196a5", s = {
-  paginationExtended: r
-}, x = i.forwardRef(
-  ({ children: t, className: a, ...n }, e) => /* @__PURE__ */ o(
-    "nav",
-    {
-      className: d(s.paginationExtended, a),
-      "data-tx": "1.34.0",
-      ...n,
-      ref: e,
-      children: t
-    }
-  )
+import { jsx } from "react/jsx-runtime";
+import { c as clsx } from "../../../chunks/vendor-Bco_z_Yi.js";
+import React__default from "react";
+const paginationExtended = "paginationExtended__d45393c9";
+const styles = {
+  paginationExtended
+};
+const PaginationExtended = React__default.forwardRef(
+  ({ children, className, ...rest }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "nav",
+      {
+        className: clsx(styles.paginationExtended, className),
+        "data-tx": "1.35.0",
+        ...rest,
+        ref,
+        children
+      }
+    );
+  }
 );
-x.displayName = "PaginationExtended";
+PaginationExtended.displayName = "PaginationExtended";
 export {
-  x as PaginationExtended
+  PaginationExtended
 };
 //# sourceMappingURL=PaginationExtended.js.map

package/components/Pagination/components/PaginationExtended.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaginationExtended.js","sources":["../../../../src/components/Pagination/components/PaginationExtended.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport styles from \"../styles/Pagination.module.less\";\n\n/** Свойства компонента PaginationExtended. */\nexport interface IPaginationExtendedProps extends React.HTMLAttributes<HTMLElement> {}\n\n/** Контейнер для компоновки кастомной пагинации. */\nexport const PaginationExtended = React.forwardRef<HTMLElement, IPaginationExtendedProps>(\n    ({ children, className, ...rest }, ref) => {\n        return (\n            <nav\n                className={clsx(styles.paginationExtended, className)}\n                data-tx={process.env.npm_package_version}\n                {...rest}\n                ref={ref}\n            >\n                {children}\n            </nav>\n        );\n    },\n);\n\nPaginationExtended.displayName = \"PaginationExtended\";\n"],"names":["React"],"mappings":";;;;;;;AAQO,MAAM,qBAAqBA,eAAM;AAAA,EACpC,CAAC,EAAE,UAAU,WAAW,GAAG,KAAA,GAAQ,QAAQ;AACvC,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,KAAK,OAAO,oBAAoB,SAAS;AAAA,QACpD,WAAS;AAAA,QACR,GAAG;AAAA,QACJ;AAAA,QAEC;AAAA,MAAA;AAAA,IAAA;AAAA,EAGb;AACJ;AAEA,mBAAmB,cAAc;"}