@sberbusiness/triplex-next 0.52.0 → 0.53.0

package/components/Dropdown/desktop/DropdownDesktop.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownDesktop.js","sources":["../../../../src/components/Dropdown/desktop/DropdownDesktop.tsx"],"sourcesContent":["import React, { useState, useRef, useCallback, useEffect } from \"react\";\nimport clsx from \"clsx\";\nimport { EDropdownAlignment, EDropdownDirection, EDropdownWidth } from \"./enums\";\nimport { EComponentSize } from \"../../../enums/EComponentSize\";\nimport { createSizeToClassNameMap } from \"../../../utils/classNameMaps\";\nimport { useToken } from \"../../ThemeProvider/useToken\";\nimport { isKey } from \"../../../utils/keyboard\";\nimport styles from \"../styles/DropdownDesktop.module.less\";\n\n/** Свойства компонента DropdownDesktop. */\nexport interface IDropdownDesktopProps extends React.HTMLAttributes<HTMLDivElement> {\n    /** Открыт. */\n    opened: boolean;\n    /** Устанавливает флаг opened. */\n    setOpened: (opened: boolean) => void;\n    /** Ссылка на управляющий элемент. */\n    targetRef: React.RefObject<HTMLElement>;\n    /** Размер дропдауна. */\n    size?: EComponentSize;\n    /** Направление выпадающего меню. */\n    direction?: EDropdownDirection;\n    /** Выравнивание списка относительно управляющего элемента. */\n    alignment?: EDropdownAlignment;\n    /** Вариант расчёта ширины выпадающего списка. */\n    width?: EDropdownWidth;\n}\n\nconst sizeToClassNameMap = createSizeToClassNameMap(styles);\n\nconst overflowHiddenClassName = styles.dropdownDesktopOverflowHidden;\n\n/** Отступ между управляющим элементом и выпадающим меню, px. */\nconst TARGET_OFFSET = 4;\n\n/**\n * Десктопная версия выпадающего меню.\n * Позиционируется фиксированно относительно targetRef, пересчитывает положение при скролле,\n * ресайзе окна и изменении размеров меню или управляющего элемента. Пока меню открыто,\n * скролл страницы вне меню заблокирован. В закрытом состоянии ничего не рендерит.\n */\nexport const DropdownDesktop = React.forwardRef<HTMLDivElement, IDropdownDesktopProps>((props, ref) => {\n    const {\n        children,\n        className,\n        style: styleProp,\n        size = EComponentSize.MD,\n        direction = EDropdownDirection.AUTO,\n        alignment = EDropdownAlignment.LEFT,\n        width = EDropdownWidth.CONTENT,\n        opened,\n        targetRef,\n        setOpened,\n        ...rest\n    } = props;\n    const [styleState, setStyleState] = useState<React.CSSProperties>({ opacity: 0 });\n    const dropdownRef = useRef<HTMLDivElement | null>(null);\n\n    const { scopeClassName } = useToken();\n    const classNames = clsx(styles.dropdownDesktop, sizeToClassNameMap[size], scopeClassName, className);\n\n    /** Блокировка скролла вне дропдауна. */\n    const wheelHandler = useCallback((event: WheelEvent) => {\n        if (!dropdownRef.current?.contains(event.target as Node)) {\n            event.preventDefault();\n        }\n    }, []);\n\n    const keyDownHandler = useCallback((event: KeyboardEvent) => {\n        if (event.target === document.body) {\n            const key = event.code || event.keyCode;\n\n            if (\n                isKey(key, \"SPACE\") ||\n                isKey(key, \"PAGE_UP\") ||\n                isKey(key, \"PAGE_DOWN\") ||\n                isKey(key, \"END\") ||\n                isKey(key, \"HOME\") ||\n                isKey(key, \"ARROW_LEFT\") ||\n                isKey(key, \"ARROW_UP\") ||\n                isKey(key, \"ARROW_RIGHT\") ||\n                isKey(key, \"ARROW_DOWN\")\n            ) {\n                event.preventDefault();\n            }\n        }\n    }, []);\n\n    /** Управление подпиской на события, блокирующие скролл страницы вне дропдауна. */\n    const toggleScrollEventListener = useCallback(\n        (add: boolean) => {\n            if (add) {\n                document.addEventListener(\"wheel\", wheelHandler, { passive: false });\n                document.addEventListener(\"keydown\", keyDownHandler);\n            } else {\n                document.removeEventListener(\"wheel\", wheelHandler);\n                document.removeEventListener(\"keydown\", keyDownHandler);\n            }\n        },\n        [wheelHandler, keyDownHandler],\n    );\n\n    /** Расчёт положения по горизонтали. */\n    const calculatePositionHorizontal = useCallback(\n        (css: React.CSSProperties, targetRect: DOMRect, expectedWidth: number) => {\n            const clientWidth = document.documentElement.clientWidth;\n\n            const leftPos = targetRect.left;\n            const rightPos = targetRect.right - expectedWidth;\n\n            if (alignment === EDropdownAlignment.LEFT) {\n                const fitsRightSide = leftPos + expectedWidth <= clientWidth;\n                css.left = fitsRightSide ? leftPos : Math.max(0, rightPos);\n            } else {\n                const fitsLeftSide = rightPos >= 0;\n                css.left = fitsLeftSide ? rightPos : Math.max(0, Math.min(leftPos, clientWidth - expectedWidth));\n            }\n        },\n        [alignment],\n    );\n\n    /** Расчёт положения по вертикали. */\n    const calculatePositionVertical = useCallback(\n        (css: React.CSSProperties, dropdownRect: DOMRect, targetRect: DOMRect) => {\n            if (direction === EDropdownDirection.AUTO) {\n                if (targetRect.bottom + TARGET_OFFSET + dropdownRect.height < document.documentElement.clientHeight) {\n                    // Если влезает снизу.\n                    css.top = targetRect.bottom + TARGET_OFFSET;\n                } else if (targetRect.top - TARGET_OFFSET - dropdownRect.height > 0) {\n                    // Если не влезает снизу, но влезает сверху.\n                    css.bottom = document.documentElement.clientHeight - targetRect.top + TARGET_OFFSET;\n                } else {\n                    // Если не влезает снизу и сверху.\n                    css.top = targetRect.bottom + TARGET_OFFSET;\n                }\n            } else if (direction === EDropdownDirection.BOTTOM) {\n                css.top = targetRect.bottom + TARGET_OFFSET;\n            } else if (direction === EDropdownDirection.TOP) {\n                css.bottom = document.documentElement.clientHeight - targetRect.top + TARGET_OFFSET;\n            }\n        },\n        [direction],\n    );\n\n    /** Установка положения меню. */\n    const setPosition = useCallback(() => {\n        if (dropdownRef.current === null || targetRef.current === null) return;\n\n        const dropdownRect = dropdownRef.current.getBoundingClientRect();\n        const targetRect = targetRef.current.getBoundingClientRect();\n        const css: React.CSSProperties = {};\n        let expectedWidth = dropdownRect.width;\n\n        if (width === EDropdownWidth.TARGET) {\n            expectedWidth = targetRect.width;\n            css.width = targetRect.width;\n        } else if (width === EDropdownWidth.MIN_TARGET) {\n            expectedWidth = Math.max(dropdownRect.width, targetRect.width);\n            css.minWidth = targetRect.width;\n        }\n\n        calculatePositionVertical(css, dropdownRect, targetRect);\n        calculatePositionHorizontal(css, targetRect, expectedWidth);\n\n        setStyleState(css);\n    }, [targetRef, width, calculatePositionVertical, calculatePositionHorizontal]);\n\n    useEffect(() => {\n        if (opened) {\n            // Положение можно посчитать только после того, как меню отрендерено и его размеры измеримы.\n            setPosition();\n        } else {\n            setStyleState({ opacity: 0 });\n        }\n    }, [opened, setPosition]);\n\n    useEffect(() => {\n        if (!opened || dropdownRef.current === null || targetRef.current === null) return;\n\n        const observer = new ResizeObserver(setPosition);\n\n        observer.observe(dropdownRef.current);\n        observer.observe(targetRef.current);\n        return () => observer.disconnect();\n    }, [opened, targetRef, setPosition]);\n\n    /** Планирует перерасчет позиции дропдауна в следующем кадре. */\n    const updatePosition = useCallback(() => {\n        setTimeout(setPosition);\n    }, [setPosition]);\n\n    useEffect(() => {\n        if (opened) {\n            document.addEventListener(\"scroll\", updatePosition, true);\n            window.addEventListener(\"resize\", updatePosition);\n            toggleScrollEventListener(true);\n            document.body.classList.add(overflowHiddenClassName);\n            updatePosition();\n\n            return () => {\n                document.removeEventListener(\"scroll\", updatePosition, true);\n                window.removeEventListener(\"resize\", updatePosition);\n                toggleScrollEventListener(false);\n                document.body.classList.remove(overflowHiddenClassName);\n            };\n        }\n    }, [opened, updatePosition, toggleScrollEventListener]);\n\n    const setRef = (instance: HTMLDivElement | null) => {\n        dropdownRef.current = instance;\n        if (typeof ref === \"function\") {\n            ref(instance);\n        } else if (ref) {\n            ref.current = instance;\n        }\n    };\n\n    if (!opened) {\n        return null;\n    }\n\n    return (\n        <div\n            className={classNames}\n            style={{ ...styleState, ...styleProp }}\n            {...rest}\n            data-tx={process.env.npm_package_version}\n            ref={setRef}\n        >\n            {children}\n        </div>\n    );\n});\n\nDropdownDesktop.displayName = \"DropdownDesktop\";\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DropdownDesktop.js","sources":["../../../../src/components/Dropdown/desktop/DropdownDesktop.tsx"],"sourcesContent":["import React, { useState, useRef, useCallback, useEffect } from \"react\";\nimport clsx from \"clsx\";\nimport { EDropdownAlignment, EDropdownDirection, EDropdownWidth } from \"./enums\";\nimport { EComponentSize } from \"../../../enums/EComponentSize\";\nimport { createSizeToClassNameMap } from \"../../../utils/classNameMaps\";\nimport { useToken } from \"../../ThemeProvider/useToken\";\nimport { isKey } from \"../../../utils/keyboard\";\nimport { lockBodyScroll } from \"../../../utils/scroll/bodyScrollLock\";\nimport styles from \"../styles/DropdownDesktop.module.less\";\n\n/** Свойства компонента DropdownDesktop. */\nexport interface IDropdownDesktopProps extends React.HTMLAttributes<HTMLDivElement> {\n    /** Открыт. */\n    opened: boolean;\n    /** Устанавливает флаг opened. */\n    setOpened: (opened: boolean) => void;\n    /** Ссылка на управляющий элемент. */\n    targetRef: React.RefObject<HTMLElement>;\n    /** Размер дропдауна. */\n    size?: EComponentSize;\n    /** Направление выпадающего меню. */\n    direction?: EDropdownDirection;\n    /** Выравнивание списка относительно управляющего элемента. */\n    alignment?: EDropdownAlignment;\n    /** Вариант расчёта ширины выпадающего списка. */\n    width?: EDropdownWidth;\n}\n\nconst sizeToClassNameMap = createSizeToClassNameMap(styles);\n\n/** Отступ между управляющим элементом и выпадающим меню, px. */\nconst TARGET_OFFSET = 4;\n\n/**\n * Десктопная версия выпадающего меню.\n * Позиционируется фиксированно относительно targetRef, пересчитывает положение при скролле,\n * ресайзе окна и изменении размеров меню или управляющего элемента. Пока меню открыто,\n * скролл страницы вне меню заблокирован. В закрытом состоянии ничего не рендерит.\n */\nexport const DropdownDesktop = React.forwardRef<HTMLDivElement, IDropdownDesktopProps>((props, ref) => {\n    const {\n        children,\n        className,\n        style: styleProp,\n        size = EComponentSize.MD,\n        direction = EDropdownDirection.AUTO,\n        alignment = EDropdownAlignment.LEFT,\n        width = EDropdownWidth.CONTENT,\n        opened,\n        targetRef,\n        setOpened,\n        ...rest\n    } = props;\n    const [styleState, setStyleState] = useState<React.CSSProperties>({ opacity: 0 });\n    const dropdownRef = useRef<HTMLDivElement | null>(null);\n\n    const { scopeClassName } = useToken();\n    const classNames = clsx(styles.dropdownDesktop, sizeToClassNameMap[size], scopeClassName, className);\n\n    /** Блокировка скролла вне дропдауна. */\n    const wheelHandler = useCallback((event: WheelEvent) => {\n        if (!dropdownRef.current?.contains(event.target as Node)) {\n            event.preventDefault();\n        }\n    }, []);\n\n    const keyDownHandler = useCallback((event: KeyboardEvent) => {\n        if (event.target === document.body) {\n            const key = event.code || event.keyCode;\n\n            if (\n                isKey(key, \"SPACE\") ||\n                isKey(key, \"PAGE_UP\") ||\n                isKey(key, \"PAGE_DOWN\") ||\n                isKey(key, \"END\") ||\n                isKey(key, \"HOME\") ||\n                isKey(key, \"ARROW_LEFT\") ||\n                isKey(key, \"ARROW_UP\") ||\n                isKey(key, \"ARROW_RIGHT\") ||\n                isKey(key, \"ARROW_DOWN\")\n            ) {\n                event.preventDefault();\n            }\n        }\n    }, []);\n\n    /** Управление подпиской на события, блокирующие скролл страницы вне дропдауна. */\n    const toggleScrollEventListener = useCallback(\n        (add: boolean) => {\n            if (add) {\n                document.addEventListener(\"wheel\", wheelHandler, { passive: false });\n                document.addEventListener(\"keydown\", keyDownHandler);\n            } else {\n                document.removeEventListener(\"wheel\", wheelHandler);\n                document.removeEventListener(\"keydown\", keyDownHandler);\n            }\n        },\n        [wheelHandler, keyDownHandler],\n    );\n\n    /** Расчёт положения по горизонтали. */\n    const calculatePositionHorizontal = useCallback(\n        (css: React.CSSProperties, targetRect: DOMRect, expectedWidth: number) => {\n            const clientWidth = document.documentElement.clientWidth;\n\n            const leftPos = targetRect.left;\n            const rightPos = targetRect.right - expectedWidth;\n\n            if (alignment === EDropdownAlignment.LEFT) {\n                const fitsRightSide = leftPos + expectedWidth <= clientWidth;\n                css.left = fitsRightSide ? leftPos : Math.max(0, rightPos);\n            } else {\n                const fitsLeftSide = rightPos >= 0;\n                css.left = fitsLeftSide ? rightPos : Math.max(0, Math.min(leftPos, clientWidth - expectedWidth));\n            }\n        },\n        [alignment],\n    );\n\n    /** Расчёт положения по вертикали. */\n    const calculatePositionVertical = useCallback(\n        (css: React.CSSProperties, dropdownRect: DOMRect, targetRect: DOMRect) => {\n            if (direction === EDropdownDirection.AUTO) {\n                if (targetRect.bottom + TARGET_OFFSET + dropdownRect.height < document.documentElement.clientHeight) {\n                    // Если влезает снизу.\n                    css.top = targetRect.bottom + TARGET_OFFSET;\n                } else if (targetRect.top - TARGET_OFFSET - dropdownRect.height > 0) {\n                    // Если не влезает снизу, но влезает сверху.\n                    css.bottom = document.documentElement.clientHeight - targetRect.top + TARGET_OFFSET;\n                } else {\n                    // Если не влезает снизу и сверху.\n                    css.top = targetRect.bottom + TARGET_OFFSET;\n                }\n            } else if (direction === EDropdownDirection.BOTTOM) {\n                css.top = targetRect.bottom + TARGET_OFFSET;\n            } else if (direction === EDropdownDirection.TOP) {\n                css.bottom = document.documentElement.clientHeight - targetRect.top + TARGET_OFFSET;\n            }\n        },\n        [direction],\n    );\n\n    /** Установка положения меню. */\n    const setPosition = useCallback(() => {\n        if (dropdownRef.current === null || targetRef.current === null) return;\n\n        const dropdownRect = dropdownRef.current.getBoundingClientRect();\n        const targetRect = targetRef.current.getBoundingClientRect();\n        const css: React.CSSProperties = {};\n        let expectedWidth = dropdownRect.width;\n\n        if (width === EDropdownWidth.TARGET) {\n            expectedWidth = targetRect.width;\n            css.width = targetRect.width;\n        } else if (width === EDropdownWidth.MIN_TARGET) {\n            expectedWidth = Math.max(dropdownRect.width, targetRect.width);\n            css.minWidth = targetRect.width;\n        }\n\n        calculatePositionVertical(css, dropdownRect, targetRect);\n        calculatePositionHorizontal(css, targetRect, expectedWidth);\n\n        setStyleState(css);\n    }, [targetRef, width, calculatePositionVertical, calculatePositionHorizontal]);\n\n    useEffect(() => {\n        if (opened) {\n            // Положение можно посчитать только после того, как меню отрендерено и его размеры измеримы.\n            setPosition();\n        } else {\n            setStyleState({ opacity: 0 });\n        }\n    }, [opened, setPosition]);\n\n    useEffect(() => {\n        if (!opened || dropdownRef.current === null || targetRef.current === null) return;\n\n        const observer = new ResizeObserver(setPosition);\n\n        observer.observe(dropdownRef.current);\n        observer.observe(targetRef.current);\n        return () => observer.disconnect();\n    }, [opened, targetRef, setPosition]);\n\n    /** Планирует перерасчет позиции дропдауна в следующем кадре. */\n    const updatePosition = useCallback(() => {\n        setTimeout(setPosition);\n    }, [setPosition]);\n\n    useEffect(() => {\n        if (opened) {\n            document.addEventListener(\"scroll\", updatePosition, true);\n            window.addEventListener(\"resize\", updatePosition);\n            toggleScrollEventListener(true);\n            const unlockBodyScroll = lockBodyScroll(styles.dropdownDesktopScrollLock);\n            updatePosition();\n\n            return () => {\n                document.removeEventListener(\"scroll\", updatePosition, true);\n                window.removeEventListener(\"resize\", updatePosition);\n                toggleScrollEventListener(false);\n                unlockBodyScroll();\n            };\n        }\n    }, [opened, updatePosition, toggleScrollEventListener]);\n\n    const setRef = (instance: HTMLDivElement | null) => {\n        dropdownRef.current = instance;\n        if (typeof ref === \"function\") {\n            ref(instance);\n        } else if (ref) {\n            ref.current = instance;\n        }\n    };\n\n    if (!opened) {\n        return null;\n    }\n\n    return (\n        <div\n            className={classNames}\n            style={{ ...styleState, ...styleProp }}\n            {...rest}\n            data-tx={process.env.npm_package_version}\n            ref={setRef}\n        >\n            {children}\n        </div>\n    );\n});\n\nDropdownDesktop.displayName = \"DropdownDesktop\";\n"],"names":[],"mappings":"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"}

package/components/Dropdown/desktop/DropdownList.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import React, { useContext, useRef, useState, useEffect } from "react";
 import { c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles, D as DropdownListItem } from "../../../chunks/DropdownListItem-B220hwlD.js";
+import { s as styles, D as DropdownListItem } from "../../../chunks/DropdownListItem-DtBDNMDu.js";
 import { EVENT_KEY_CODES } from "../../../utils/keyboard.js";
 import { DropdownListContext } from "../DropdownListContext.js";
 import { LoaderSmall } from "../../Loader/LoaderSmall/LoaderSmall.js";

package/components/Dropdown/desktop/DropdownListItem.js

@@ -4,7 +4,7 @@ import "../../../chunks/vendor-Bf_-FiU6.js";
 import "../../../enums/EComponentSize.js";
 import "../../../utils/keyboard.js";
 import "../../Badge/Badge.js";
-import { D } from "../../../chunks/DropdownListItem-B220hwlD.js";
+import { D } from "../../../chunks/DropdownListItem-DtBDNMDu.js";
 export {
   D as DropdownListItem
 };

package/components/Dropdown/desktop/index.js

@@ -1,6 +1,6 @@
 import { DropdownDesktop } from "./DropdownDesktop.js";
 import { DropdownList } from "./DropdownList.js";
-import { D } from "../../../chunks/DropdownListItem-B220hwlD.js";
+import { D } from "../../../chunks/DropdownListItem-DtBDNMDu.js";
 import { EDropdownAlignment, EDropdownDirection, EDropdownWidth } from "./enums.js";
 export {
   DropdownDesktop,

package/components/Dropdown/index.js

@@ -1,18 +1,8 @@
 import { DropdownListContext } from "./DropdownListContext.js";
 import { DropdownDesktop } from "./desktop/DropdownDesktop.js";
 import { DropdownList } from "./desktop/DropdownList.js";
-import { D } from "../../chunks/DropdownListItem-B220hwlD.js";
+import { D } from "../../chunks/DropdownListItem-DtBDNMDu.js";
 import { EDropdownAlignment, EDropdownDirection, EDropdownWidth } from "./desktop/enums.js";
-import { DropdownMobile } from "./mobile/DropdownMobile.js";
-import { DropdownMobileBody } from "./mobile/DropdownMobileBody.js";
-import { DropdownMobileClose } from "./mobile/DropdownMobileClose.js";
-import { DropdownMobileFooter } from "./mobile/DropdownMobileFooter.js";
-import { DropdownMobileHeader } from "./mobile/DropdownMobileHeader.js";
-import { DropdownMobileInner } from "./mobile/DropdownMobileInner.js";
-import { DropdownMobileInput } from "./mobile/DropdownMobileInput.js";
-import { DropdownMobileList } from "./mobile/DropdownMobileList.js";
-import { DropdownMobileListItem } from "./mobile/DropdownMobileListItem.js";
-import { DropdownMobileLoader } from "./mobile/DropdownMobileLoader.js";
 import { Dropdown } from "./Dropdown.js";
 export {
   Dropdown,
@@ -20,16 +10,6 @@ export {
   DropdownList,
   DropdownListContext,
   D as DropdownListItem,
-  DropdownMobile,
-  DropdownMobileBody,
-  DropdownMobileClose,
-  DropdownMobileFooter,
-  DropdownMobileHeader,
-  DropdownMobileInner,
-  DropdownMobileInput,
-  DropdownMobileList,
-  DropdownMobileListItem,
-  DropdownMobileLoader,
   EDropdownAlignment,
   EDropdownDirection,
   EDropdownWidth

package/components/Dropdown/index.js.map

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

package/components/Ellipsis/Ellipsis.js

@@ -1,8 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../chunks/vendor-Bf_-FiU6.js";
-const ellipsisLineClamp = "ellipsisLineClamp__e189154c";
-const oneLine = "oneLine__ab84ccbe";
+const ellipsisLineClamp = "ellipsisLineClamp__608c7530";
+const oneLine = "oneLine__b1d36ffc";
 const styles = {
   ellipsisLineClamp,
   oneLine
@@ -19,7 +19,7 @@ const Ellipsis = React.forwardRef(
         className: clsx(styles.ellipsisLineClamp, { [styles.oneLine]: maxLines === 1 }, className),
         style: ellipsisStyle,
         ...htmlDivAttributes,
-        "data-tx": "0.52.0",
+        "data-tx": "0.53.0",
         ref,
         children
       }

package/components/EmptyView/EmptyView.js

@@ -6,10 +6,10 @@ import { Title } from "../Typography/Title.js";
 import { ETextSize, EFontWeightTitle, ETitleSize, EFontType, EFontWeightText } from "../Typography/enums.js";
 import { Text } from "../Typography/Text.js";
 import { Gap } from "../Gap/Gap.js";
-const emptyView = "emptyView__795d09f1";
-const container = "container__8f997ace";
-const icon = "icon__9297e290";
-const textBlock = "textBlock__6c34dbd7";
+const emptyView = "emptyView__faa9079b";
+const container = "container__4fe0a587";
+const icon = "icon__65795dec";
+const textBlock = "textBlock__1934f765";
 const styles = {
   emptyView,
   container,

package/components/ExpandAnimation/ExpandAnimation.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React, { useRef } from "react";
 import { y as Transition, c as clsx } from "../../chunks/vendor-Bf_-FiU6.js";
-const expandAnimation = "expandAnimation__b90db2ac";
+const expandAnimation = "expandAnimation__35f5a910";
 const styles = {
   expandAnimation
 };

package/components/Footer/Footer.js

@@ -5,7 +5,7 @@ import "./components/FooterDescriptionControls.js";
 import "./components/FooterDescriptionContent.js";
 const Footer = Object.assign(
   React.forwardRef(function Footer2({ children, ...rest }, ref) {
-    return /* @__PURE__ */ jsx("div", { ...rest, "data-tx": "0.52.0", ref, children });
+    return /* @__PURE__ */ jsx("div", { ...rest, "data-tx": "0.53.0", ref, children });
   }),
   {
     Description: FooterDescription

package/components/Footer/components/FooterDescription.js

@@ -3,7 +3,7 @@ import React from "react";
 import { FooterDescriptionContent } from "./FooterDescriptionContent.js";
 import { FooterDescriptionControls } from "./FooterDescriptionControls.js";
 import { c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../chunks/Footer.module-BWVOlnUk.js";
+import { s as styles } from "../../../chunks/Footer.module-D6LiswG5.js";
 const FooterDescription = Object.assign(
   React.forwardRef(function FooterDescription2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx("div", { className: clsx(styles.footerDescription, className), ...rest, ref, children });

package/components/Footer/components/FooterDescriptionContent.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../chunks/Footer.module-BWVOlnUk.js";
+import { s as styles } from "../../../chunks/Footer.module-D6LiswG5.js";
 const FooterDescriptionContent = React.forwardRef(
   ({ children, className, ...rest }, ref) => /* @__PURE__ */ jsx("div", { className: clsx(styles.footerDescriptionContent, className), ...rest, ref, children })
 );

package/components/Footer/components/FooterDescriptionControls.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../chunks/Footer.module-BWVOlnUk.js";
+import { s as styles } from "../../../chunks/Footer.module-D6LiswG5.js";
 const FooterDescriptionControls = React.forwardRef(
   ({ children, className, ...rest }, ref) => /* @__PURE__ */ jsx("div", { className: clsx(styles.footerDescriptionControls, className), ...rest, ref, children })
 );

package/components/FormField/FormField.js

@@ -6,21 +6,21 @@ import { TARGET_PADDING_X_DEFAULT } from "./consts.js";
 import { EFormFieldStatus } from "./enums.js";
 import { EComponentSize } from "../../enums/EComponentSize.js";
 import { createSizeToClassNameMap } from "../../utils/classNameMaps.js";
-const formField = "formField__2b6aff65";
-const sm = "sm__72fd5ea9";
-const md = "md__a9e65e99";
-const lg = "lg__91f04d17";
-const active = "active__6bf65fea";
-const disabled = "disabled__c616c80e";
-const error = "error__2f763f89";
-const warning = "warning__b65e0c15";
-const filled = "filled__991e3c00";
+const formField = "formField__24caad2b";
+const sm = "sm__080ac04e";
+const md = "md__46e3dfd7";
+const lg = "lg__dd5e54c4";
+const active = "active__c980a0ab";
+const disabled = "disabled__70fa03b9";
+const error = "error__c49939e9";
+const warning = "warning__c941f614";
+const filled = "filled__8f25f343";
 const styles = {
   formField,
   sm,
   md,
   lg,
-  "default": "default__e6b3deaf",
+  "default": "default__a97cc3ac",
   active,
   disabled,
   error,
@@ -89,7 +89,7 @@ const FormField = React.forwardRef(
           },
           className
         ),
-        "data-tx": "0.52.0",
+        "data-tx": "0.53.0",
         style: { paddingLeft: prefixWidth, paddingRight: postfixWidth, ...style },
         ...htmlDivAttributes,
         ref,

package/components/FormField/FormFieldContext.js

@@ -8,7 +8,7 @@ const initialFormFieldContext = {
   labelId: void 0,
   postfixWidth: 0,
   prefixWidth: 0,
-  // Временный фикс для DropdownMobileHeader
+  // Временный фикс для PullerHeader
   filled: true,
   focused: false,
   active: false,

package/components/FormField/FormFieldContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormFieldContext.js","sources":["../../../src/components/FormField/FormFieldContext.ts"],"sourcesContent":["import React from \"react\";\nimport { EComponentSize } from \"../../enums/EComponentSize\";\nimport { EFormFieldStatus } from \"./enums\";\n\n/** Значение контекста поля ввода. Провайдер — компонент FormField. */\nexport interface IFormFieldContext {\n    /** Размер поля. */\n    size: EComponentSize;\n    /** Статус поля. */\n    status: EFormFieldStatus;\n    /** Идентификатор labelable-элемента ввода. */\n    targetId: string | undefined;\n    /** Идентификатор лейбла. */\n    labelId: string | undefined;\n    /** Ширина элемента FormFieldPrefix. */\n    prefixWidth: number;\n    /** Ширина элемента FormFieldPostfix. */\n    postfixWidth: number;\n    /** Поле заполнено. */\n    filled: boolean;\n    /** Поле в фокусе. */\n    focused: boolean;\n    /** Поле активно. */\n    active: boolean;\n    /** Установка значения targetId. */\n    setTargetId: React.Dispatch<React.SetStateAction<string | undefined>>;\n    /** Установка значения labelId. */\n    setLabelId: React.Dispatch<React.SetStateAction<string | undefined>>;\n    /** Установка значения postfixWidth. */\n    setPostfixWidth: React.Dispatch<React.SetStateAction<number>>;\n    /** Установка значения prefixWidth. */\n    setPrefixWidth: React.Dispatch<React.SetStateAction<number>>;\n    /** Установка значения filled. */\n    setFilled: React.Dispatch<React.SetStateAction<boolean>>;\n    /** Установка значения focused. */\n    setFocused: React.Dispatch<React.SetStateAction<boolean>>;\n}\n\n/**\n * Значение контекста по умолчанию — используется субкомпонентами, отрендеренными вне FormField.\n * Сеттеры в этом случае являются no-op.\n */\nexport const initialFormFieldContext: IFormFieldContext = {\n    size: EComponentSize.LG,\n    status: EFormFieldStatus.DEFAULT,\n    targetId: undefined,\n    labelId: undefined,\n    postfixWidth: 0,\n    prefixWidth: 0,\n    // Временный фикс для DropdownMobileHeader\n    filled: true,\n    focused: false,\n    active: false,\n    setTargetId: () => {},\n    setLabelId: () => {},\n    setPostfixWidth: () => {},\n    setPrefixWidth: () => {},\n    setFilled: () => {},\n    setFocused: () => {},\n};\n\n/**\n * Контекст поля ввода.\n */\nexport const FormFieldContext = React.createContext<IFormFieldContext>(initialFormFieldContext);\n"],"names":[],"mappings":";;;AA0CO,MAAM,0BAA6C;AAAA,EACtD,MAAM,eAAe;AAAA,EACrB,QAAQ,iBAAiB;AAAA,EACzB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,cAAc;AAAA,EACd,aAAa;AAAA;AAAA,EAEb,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,YAAY,MAAM;AAAA,EAAC;AAAA,EACnB,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB,YAAY,MAAM;AAAA,EAAC;AACvB;AAKO,MAAM,mBAAmB,MAAM,cAAiC,uBAAuB;"}
+{"version":3,"file":"FormFieldContext.js","sources":["../../../src/components/FormField/FormFieldContext.ts"],"sourcesContent":["import React from \"react\";\nimport { EComponentSize } from \"../../enums/EComponentSize\";\nimport { EFormFieldStatus } from \"./enums\";\n\n/** Значение контекста поля ввода. Провайдер — компонент FormField. */\nexport interface IFormFieldContext {\n    /** Размер поля. */\n    size: EComponentSize;\n    /** Статус поля. */\n    status: EFormFieldStatus;\n    /** Идентификатор labelable-элемента ввода. */\n    targetId: string | undefined;\n    /** Идентификатор лейбла. */\n    labelId: string | undefined;\n    /** Ширина элемента FormFieldPrefix. */\n    prefixWidth: number;\n    /** Ширина элемента FormFieldPostfix. */\n    postfixWidth: number;\n    /** Поле заполнено. */\n    filled: boolean;\n    /** Поле в фокусе. */\n    focused: boolean;\n    /** Поле активно. */\n    active: boolean;\n    /** Установка значения targetId. */\n    setTargetId: React.Dispatch<React.SetStateAction<string | undefined>>;\n    /** Установка значения labelId. */\n    setLabelId: React.Dispatch<React.SetStateAction<string | undefined>>;\n    /** Установка значения postfixWidth. */\n    setPostfixWidth: React.Dispatch<React.SetStateAction<number>>;\n    /** Установка значения prefixWidth. */\n    setPrefixWidth: React.Dispatch<React.SetStateAction<number>>;\n    /** Установка значения filled. */\n    setFilled: React.Dispatch<React.SetStateAction<boolean>>;\n    /** Установка значения focused. */\n    setFocused: React.Dispatch<React.SetStateAction<boolean>>;\n}\n\n/**\n * Значение контекста по умолчанию — используется субкомпонентами, отрендеренными вне FormField.\n * Сеттеры в этом случае являются no-op.\n */\nexport const initialFormFieldContext: IFormFieldContext = {\n    size: EComponentSize.LG,\n    status: EFormFieldStatus.DEFAULT,\n    targetId: undefined,\n    labelId: undefined,\n    postfixWidth: 0,\n    prefixWidth: 0,\n    // Временный фикс для PullerHeader\n    filled: true,\n    focused: false,\n    active: false,\n    setTargetId: () => {},\n    setLabelId: () => {},\n    setPostfixWidth: () => {},\n    setPrefixWidth: () => {},\n    setFilled: () => {},\n    setFocused: () => {},\n};\n\n/**\n * Контекст поля ввода.\n */\nexport const FormFieldContext = React.createContext<IFormFieldContext>(initialFormFieldContext);\n"],"names":[],"mappings":";;;AA0CO,MAAM,0BAA6C;AAAA,EACtD,MAAM,eAAe;AAAA,EACrB,QAAQ,iBAAiB;AAAA,EACzB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,cAAc;AAAA,EACd,aAAa;AAAA;AAAA,EAEb,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,YAAY,MAAM;AAAA,EAAC;AAAA,EACnB,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB,YAAY,MAAM;AAAA,EAAC;AACvB;AAKO,MAAM,mBAAmB,MAAM,cAAiC,uBAAuB;"}

package/components/FormField/components/FormFieldClear.js

@@ -3,7 +3,7 @@ import React, { useCallback } from "react";
 import { c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
 import { CrossStrokeSrvIcon16 } from "@sberbusiness/icons-next";
 import { ButtonIcon } from "../../Button/ButtonIcon.js";
-const formFieldClear = "formFieldClear__1f50258f";
+const formFieldClear = "formFieldClear__29afad5b";
 const styles = {
   formFieldClear
 };

package/components/FormField/components/FormFieldCounter.js

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { useContext, useEffect } from "react";
 import { c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
 import { FormFieldDescriptionContext } from "../FormFieldDescriptionContext.js";
-const formFieldCounter = "formFieldCounter__6408eae6";
+const formFieldCounter = "formFieldCounter__bff49aa9";
 const styles = {
   formFieldCounter
 };

package/components/FormField/components/FormFieldDescription.js

@@ -2,8 +2,8 @@ import { jsx } from "react/jsx-runtime";
 import { useState, useMemo } from "react";
 import { c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
 import { FormFieldDescriptionContext } from "../FormFieldDescriptionContext.js";
-const formFieldDescription = "formFieldDescription__8596cf90";
-const withCounter = "withCounter__a27c5bf8";
+const formFieldDescription = "formFieldDescription__068dcefe";
+const withCounter = "withCounter__3a52986a";
 const styles = {
   formFieldDescription,
   withCounter

package/components/FormField/components/FormFieldInput.js

@@ -5,10 +5,10 @@ import { FormFieldContext } from "../FormFieldContext.js";
 import { EFormFieldStatus } from "../enums.js";
 import { createSizeToClassNameMap } from "../../../utils/classNameMaps.js";
 import { isFilled } from "./utils.js";
-const formFieldInput = "formFieldInput__30fcd729";
-const sm = "sm__72fd5ea9";
-const md = "md__a9e65e99";
-const lg = "lg__91f04d17";
+const formFieldInput = "formFieldInput__9781d693";
+const sm = "sm__080ac04e";
+const md = "md__46e3dfd7";
+const lg = "lg__dd5e54c4";
 const styles = {
   formFieldInput,
   sm,

package/components/FormField/components/FormFieldLabel.js

@@ -5,13 +5,13 @@ import { FormFieldContext } from "../FormFieldContext.js";
 import { createSizeToClassNameMap } from "../../../utils/classNameMaps.js";
 import { EFormFieldStatus } from "../enums.js";
 import { TARGET_PADDING_X_DEFAULT } from "../consts.js";
-const formFieldLabel = "formFieldLabel__6a386f55";
-const sm = "sm__72fd5ea9";
-const md = "md__a9e65e99";
-const lg = "lg__91f04d17";
-const floating = "floating__42a73e16";
-const formFieldLabelText = "formFieldLabelText__9595c202";
-const disabled = "disabled__c616c80e";
+const formFieldLabel = "formFieldLabel__94a2e666";
+const sm = "sm__080ac04e";
+const md = "md__46e3dfd7";
+const lg = "lg__dd5e54c4";
+const floating = "floating__85510c01";
+const formFieldLabelText = "formFieldLabelText__f37da741";
+const disabled = "disabled__70fa03b9";
 const styles = {
   formFieldLabel,
   sm,

package/components/FormField/components/FormFieldMaskedInput.js

@@ -6,14 +6,14 @@ import { FormFieldInput } from "./FormFieldInput.js";
 import { FormFieldContext } from "../FormFieldContext.js";
 import { EFormFieldStatus } from "../enums.js";
 import { createSizeToClassNameMap } from "../../../utils/classNameMaps.js";
-const formFieldMaskedInputWrapper = "formFieldMaskedInputWrapper__af38e7d7";
-const maskLayout = "maskLayout__5ed034b3";
-const sm = "sm__72fd5ea9";
-const md = "md__a9e65e99";
-const lg = "lg__91f04d17";
-const valueMirror = "valueMirror__6656e33b";
-const placeholderMask = "placeholderMask__d8f0d700";
-const disabled = "disabled__c616c80e";
+const formFieldMaskedInputWrapper = "formFieldMaskedInputWrapper__3a688c95";
+const maskLayout = "maskLayout__f022063e";
+const sm = "sm__080ac04e";
+const md = "md__46e3dfd7";
+const lg = "lg__dd5e54c4";
+const valueMirror = "valueMirror__9e719dd6";
+const placeholderMask = "placeholderMask__06e62b62";
+const disabled = "disabled__70fa03b9";
 const styles = {
   formFieldMaskedInputWrapper,
   maskLayout,

package/components/FormField/components/FormFieldPostfix.js

@@ -3,7 +3,7 @@ import React, { useContext } from "react";
 import { c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
 import { FormFieldContext } from "../FormFieldContext.js";
 import { useFormFieldAffixWidth } from "./useFormFieldAffixWidth.js";
-const formFieldPostfix = "formFieldPostfix__5ad51393";
+const formFieldPostfix = "formFieldPostfix__cefe23f5";
 const styles = {
   formFieldPostfix
 };

package/components/FormField/components/FormFieldPrefix.js

@@ -3,7 +3,7 @@ import React, { useContext } from "react";
 import { c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
 import { FormFieldContext } from "../FormFieldContext.js";
 import { useFormFieldAffixWidth } from "./useFormFieldAffixWidth.js";
-const formFieldPrefix = "formFieldPrefix__990a7aeb";
+const formFieldPrefix = "formFieldPrefix__7791e851";
 const styles = {
   formFieldPrefix
 };

package/components/FormField/components/FormFieldTarget.js

@@ -4,14 +4,14 @@ import { u as uniqueId, c as clsx } from "../../../chunks/vendor-Bf_-FiU6.js";
 import { FormFieldContext } from "../FormFieldContext.js";
 import { EFormFieldStatus } from "../enums.js";
 import { createSizeToClassNameMap } from "../../../utils/classNameMaps.js";
-const formFieldTarget = "formFieldTarget__e1083f3a";
-const sm = "sm__72fd5ea9";
-const md = "md__a9e65e99";
-const lg = "lg__91f04d17";
-const placeholder = "placeholder__2a9287f5";
-const disabled = "disabled__c616c80e";
-const placeholderWrapper = "placeholderWrapper__724cea2d";
-const active = "active__6bf65fea";
+const formFieldTarget = "formFieldTarget__b11accd9";
+const sm = "sm__080ac04e";
+const md = "md__46e3dfd7";
+const lg = "lg__dd5e54c4";
+const placeholder = "placeholder__906f8fe2";
+const disabled = "disabled__70fa03b9";
+const placeholderWrapper = "placeholderWrapper__f2c3b7a8";
+const active = "active__c980a0ab";
 const styles = {
   formFieldTarget,
   sm,

package/components/FormField/components/FormFieldTextarea.js

@@ -5,10 +5,10 @@ import { createSizeToClassNameMap } from "../../../utils/classNameMaps.js";
 import { FormFieldContext } from "../FormFieldContext.js";
 import { EFormFieldStatus } from "../enums.js";
 import { isFilled } from "./utils.js";
-const formFieldTextarea = "formFieldTextarea__70dae499";
-const sm = "sm__72fd5ea9";
-const md = "md__a9e65e99";
-const lg = "lg__91f04d17";
+const formFieldTextarea = "formFieldTextarea__8ef3fb25";
+const sm = "sm__080ac04e";
+const md = "md__46e3dfd7";
+const lg = "lg__dd5e54c4";
 const styles = {
   formFieldTextarea,
   sm,

package/components/Gap/Gap.js

@@ -1,14 +1,14 @@
 import { jsx } from "react/jsx-runtime";
 import { c as clsx } from "../../chunks/vendor-Bf_-FiU6.js";
 import React from "react";
-const size4 = "size4__4c7e5989";
-const size8 = "size8__6bc65a90";
-const size12 = "size12__000eec56";
-const size16 = "size16__4529804e";
-const size24 = "size24__548c9d7d";
-const size32 = "size32__7e8267d6";
-const size64 = "size64__8545fa02";
-const size128 = "size128__5831ecb5";
+const size4 = "size4__686deff4";
+const size8 = "size8__aad89977";
+const size12 = "size12__f58c2857";
+const size16 = "size16__2aacfd02";
+const size24 = "size24__76eaaf50";
+const size32 = "size32__d06c9842";
+const size64 = "size64__9c66b921";
+const size128 = "size128__908059f4";
 const styles = {
   size4,
   size8,

package/components/Header/Header.js

@@ -12,7 +12,7 @@ import "./components/HeaderTitle/HeaderTitleContent.js";
 import "./components/HeaderTitle/HeaderTitleControls.js";
 const Header = Object.assign(
   React.forwardRef(function Header2({ children, ...rest }, ref) {
-    return /* @__PURE__ */ jsx("div", { ...rest, "data-tx": "0.52.0", ref, children });
+    return /* @__PURE__ */ jsx("div", { ...rest, "data-tx": "0.53.0", ref, children });
   }),
   {
     LayoutSidebar: HeaderLayoutSidebar,

package/components/Header/components/HeaderLayoutSidebar/HeaderLayoutSidebar.js

@@ -3,7 +3,7 @@ import React from "react";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
 import { HeaderLayoutSidebarContent } from "./HeaderLayoutSidebarContent.js";
 import { HeaderLayoutSidebarSidebar } from "./HeaderLayoutSidebarSidebar.js";
-import { s as styles } from "../../../../chunks/HeaderLayoutSidebar.module-CE0LxXbe.js";
+import { s as styles } from "../../../../chunks/HeaderLayoutSidebar.module-DvuWrb8r.js";
 const HeaderLayoutSidebar = Object.assign(
   React.forwardRef(function HeaderLayoutSidebar2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx("div", { className: clsx(styles.headerLayoutSidebar, className), ...rest, ref, children });

package/components/Header/components/HeaderLayoutSidebar/HeaderLayoutSidebarContent.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../../chunks/HeaderLayoutSidebar.module-CE0LxXbe.js";
+import { s as styles } from "../../../../chunks/HeaderLayoutSidebar.module-DvuWrb8r.js";
 const HeaderLayoutSidebarContent = React.forwardRef(
   ({ children, className, ...rest }, ref) => /* @__PURE__ */ jsx("div", { className: clsx(styles.headerLayoutSidebarContent, className), ...rest, ref, children })
 );

package/components/Header/components/HeaderLayoutSidebar/HeaderLayoutSidebarSidebar.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../../chunks/HeaderLayoutSidebar.module-CE0LxXbe.js";
+import { s as styles } from "../../../../chunks/HeaderLayoutSidebar.module-DvuWrb8r.js";
 const HeaderLayoutSidebarSidebar = React.forwardRef(
   ({ children, className, ...rest }, ref) => /* @__PURE__ */ jsx("div", { className: clsx(styles.headerLayoutSidebarSidebar, className), ...rest, ref, children })
 );

package/components/Header/components/HeaderSubheader/HeaderSubheader.js

@@ -1,8 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
-const headerSubheader = "headerSubheader__30eb3df3";
-const withoutPaddings = "withoutPaddings__9f34c344";
+const headerSubheader = "headerSubheader__83ebff60";
+const withoutPaddings = "withoutPaddings__2dfb451c";
 const styles = {
   headerSubheader,
   withoutPaddings

package/components/Header/components/HeaderTabs/HeaderTabs.js

@@ -3,7 +3,7 @@ import React from "react";
 import { HeaderTabsContent } from "./HeaderTabsContent.js";
 import { HeaderTabsControls } from "./HeaderTabsControls.js";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../../chunks/HeaderTabs.module-CBdJ4AFG.js";
+import { s as styles } from "../../../../chunks/HeaderTabs.module-49s0no12.js";
 const HeaderTabs = Object.assign(
   React.forwardRef(function HeaderTabs2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx("div", { className: clsx(styles.headerTabs, className), ...rest, ref, children });

package/components/Header/components/HeaderTabs/HeaderTabsContent.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../../chunks/HeaderTabs.module-CBdJ4AFG.js";
+import { s as styles } from "../../../../chunks/HeaderTabs.module-49s0no12.js";
 const HeaderTabsContent = React.forwardRef(
   ({ children, className, ...rest }, ref) => /* @__PURE__ */ jsx("div", { className: clsx(styles.headerTabsContent, className), ...rest, ref, children })
 );

package/components/Header/components/HeaderTabs/HeaderTabsControls.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../../chunks/HeaderTabs.module-CBdJ4AFG.js";
+import { s as styles } from "../../../../chunks/HeaderTabs.module-49s0no12.js";
 const HeaderTabsControls = React.forwardRef(
   ({ children, className, ...rest }, ref) => /* @__PURE__ */ jsx("div", { className: clsx(styles.headerTabsControls, className), ...rest, ref, children })
 );

package/components/Header/components/HeaderTitle/HeaderTitle.js

@@ -3,7 +3,7 @@ import React from "react";
 import { HeaderTitleContent } from "./HeaderTitleContent.js";
 import { HeaderTitleControls } from "./HeaderTitleControls.js";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../../chunks/HeaderTitle.module-CWenCgpG.js";
+import { s as styles } from "../../../../chunks/HeaderTitle.module-BoICKOHo.js";
 const HeaderTitle = Object.assign(
   React.forwardRef(function HeaderTitle2({ children, className, ...rest }, ref) {
     return /* @__PURE__ */ jsx("div", { className: clsx(styles.headerTitle, className), ...rest, ref, children });

package/components/Header/components/HeaderTitle/HeaderTitleContent.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../../chunks/HeaderTitle.module-CWenCgpG.js";
+import { s as styles } from "../../../../chunks/HeaderTitle.module-BoICKOHo.js";
 const HeaderTitleContent = React.forwardRef(
   ({ children, className, ...rest }, ref) => /* @__PURE__ */ jsx(
     "div",

package/components/Header/components/HeaderTitle/HeaderTitleControls.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React from "react";
 import { c as clsx } from "../../../../chunks/vendor-Bf_-FiU6.js";
-import { s as styles } from "../../../../chunks/HeaderTitle.module-CWenCgpG.js";
+import { s as styles } from "../../../../chunks/HeaderTitle.module-BoICKOHo.js";
 const HeaderTitleControls = React.forwardRef(
   ({ children, className, ...rest }, ref) => /* @__PURE__ */ jsx(
     "div",

package/components/HelpBox/HelpBox.js

@@ -8,7 +8,7 @@ import { Tooltip } from "../Tooltip/Tooltip.js";
 import { MobileView } from "../MobileView/MobileView.js";
 import { getDataHTMLAttributes } from "../../utils/html/DataAttributes.js";
 import { getAriaHTMLAttributes } from "../../utils/html/AriaAttributes.js";
-const helpBoxButton = "helpBoxButton__b0e91b5c";
+const helpBoxButton = "helpBoxButton__aeb5444a";
 const styles = {
   helpBoxButton
 };