@alfalab/core-components-modal 5.2.7 → 5.4.0

package/Component-12cb5541.d.ts

@@ -0,0 +1,50 @@
+import { FC, ReactNode } from 'react';
+type HeaderProps = {
+    /**
+     * Контент шапки
+     */
+    children?: ReactNode;
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Компонент крестика
+     */
+    closer?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для аддонов
+     */
+    addonClassName?: string;
+    /**
+     * Дополнительный класс для контента
+     */
+    contentClassName?: string;
+    /**
+     * Заголовок шапки
+     */
+    title?: string;
+    /**
+     * Выравнивание заголовка
+     */
+    align?: 'left' | 'center';
+    /**
+     * Обрезать ли заголовок
+     */
+    trim?: boolean;
+    /**
+     * Фиксирует шапку
+     */
+    sticky?: boolean;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+declare const Header: FC<HeaderProps>;
+export * from "./getDataTestId-3fe0d3e6";
+export { HeaderProps, Header };

package/Component-12cb5541.js

@@ -0,0 +1,43 @@
+'use strict';
+
+var React = require('react');
+var cn = require('classnames');
+var Context = require('./Context.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
+
+var getDataTestId = function (dataTestId, element) {
+    var elementPart = element ? "-" + element.toLowerCase() : '';
+    return dataTestId ? "" + dataTestId + elementPart : undefined;
+};
+
+var styles = {"header":"modal__header_1f3yh","hasContent":"modal__hasContent_1f3yh","highlighted":"modal__highlighted_1f3yh","sticky":"modal__sticky_1f3yh","content":"modal__content_1f3yh","title":"modal__title_1f3yh","addon":"modal__addon_1f3yh","closer":"modal__closer_1f3yh","left":"modal__left_1f3yh","center":"modal__center_1f3yh","right":"modal__right_1f3yh","trim":"modal__trim_1f3yh"};
+require('./components/header/index.css')
+
+var Header = function (_a) {
+    var _b, _c;
+    var className = _a.className, addonClassName = _a.addonClassName, contentClassName = _a.contentClassName, leftAddons = _a.leftAddons, children = _a.children, _d = _a.align, align = _d === void 0 ? 'left' : _d, _e = _a.trim, trim = _e === void 0 ? true : _e, title = _a.title, closer = _a.closer, sticky = _a.sticky, dataTestId = _a.dataTestId;
+    var _f = React.useContext(Context.ModalContext), headerHighlighted = _f.headerHighlighted, setHasHeader = _f.setHasHeader;
+    var hasContent = title || Boolean(children);
+    React.useEffect(function () {
+        setHasHeader(true);
+    }, [setHasHeader]);
+    return (React__default['default'].createElement("div", { className: cn__default['default'](styles.header, className, (_b = {},
+            _b[styles.highlighted] = hasContent && sticky && headerHighlighted,
+            _b[styles.sticky] = sticky,
+            _b[styles.hasContent] = hasContent,
+            _b)), "data-test-id": getDataTestId(dataTestId) },
+        leftAddons && React__default['default'].createElement("div", { className: cn__default['default'](styles.addon, addonClassName) }, leftAddons),
+        hasContent && (React__default['default'].createElement("div", { className: cn__default['default'](styles.content, contentClassName, styles[align], (_c = {},
+                _c[styles.trim] = trim,
+                _c)) },
+            children,
+            title && (React__default['default'].createElement("div", { className: styles.title, "data-test-id": getDataTestId(dataTestId, 'title') }, title)))),
+        closer && (React__default['default'].createElement("div", { className: cn__default['default'](styles.addon, styles.closer, addonClassName) }, closer))));
+};
+
+exports.Header = Header;
+exports.getDataTestId = getDataTestId;

package/Component.desktop.js

@@ -2,13 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-eacbc725.js');
+var tslib_es6 = require('./tslib.es6-2d094523.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsBaseModal = require('@alfalab/core-components-base-modal');
 var mergeRefs = require('react-merge-refs');
 require('./Context.js');
-require('./components/header/Component.js');
+require('./Component-12cb5541.js');
 require('@alfalab/core-components-icon-button');
 require('@alfalab/icons-glyph/CrossHeavyMIcon');
 var components_closer_Component = require('./components/closer/Component.js');
@@ -17,7 +17,7 @@ require('./components/content/Component.js');
 var components_content_Component_desktop = require('./components/content/Component.desktop.js');
 require('./components/footer/Component.js');
 var components_footer_Component_desktop = require('./components/footer/Component.desktop.js');
-var transitions_module = require('./transitions.module-21cce0a0.js');
+var transitions_module = require('./transitions.module-e148225b.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -25,7 +25,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 var mergeRefs__default = /*#__PURE__*/_interopDefaultLegacy(mergeRefs);
 
-var styles = {"wrapper":"modal__wrapper_1gumq","component":"modal__component_1gumq","fullscreen":"modal__fullscreen_1gumq","s":"modal__s_1gumq","m":"modal__m_1gumq","l":"modal__l_1gumq","xl":"modal__xl_1gumq"};
+var styles = {"wrapper":"modal__wrapper_1k6jx","component":"modal__component_1k6jx","fullscreen":"modal__fullscreen_1k6jx","s":"modal__s_1k6jx","m":"modal__m_1k6jx","l":"modal__l_1k6jx","xl":"modal__xl_1k6jx"};
 require('./desktop.css')
 
 var ModalDesktopComponent = React.forwardRef(function (_a, ref) {

package/Component.mobile.js

@@ -2,18 +2,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-eacbc725.js');
+var tslib_es6 = require('./tslib.es6-2d094523.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsBaseModal = require('@alfalab/core-components-base-modal');
 require('./Context.js');
-require('./components/header/Component.js');
+require('./Component-12cb5541.js');
 require('@alfalab/core-components-icon-button');
 require('@alfalab/icons-glyph/CrossHeavyMIcon');
 var components_closer_Component = require('./components/closer/Component.js');
 require('./components/content/Component.js');
 require('./components/footer/Component.js');
-var transitions_module = require('./transitions.module-21cce0a0.js');
+var transitions_module = require('./transitions.module-e148225b.js');
 require('@alfalab/icons-glyph/CrossMIcon');
 var components_header_Component_mobile = require('./components/header/Component.mobile.js');
 var components_content_Component_mobile = require('./components/content/Component.mobile.js');
@@ -24,7 +24,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"component":"modal__component_bp8q4"};
+var styles = {"component":"modal__component_1n03x"};
 require('./mobile.css')
 
 var ModalMobileComponent = React.forwardRef(function (_a, ref) {

package/Component.responsive.d.ts

@@ -2,7 +2,13 @@
 import React from 'react';
 import { ModalDesktopProps } from "./Component.desktop";
 import { ModalMobileProps } from "./Component.mobile";
-type ModalResponsiveProps = ModalMobileProps & ModalDesktopProps;
+type ModalResponsiveProps = ModalMobileProps & ModalDesktopProps & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+};
 declare const ModalResponsive: React.ForwardRefExoticComponent<import("packages/base-modal/src").BaseModalProps & {
     hasCloser?: boolean | undefined;
 } & {
@@ -10,6 +16,12 @@ declare const ModalResponsive: React.ForwardRefExoticComponent<import("packages/
     fullscreen?: boolean | undefined;
     fixedPosition?: boolean | undefined;
     hasCloser?: boolean | undefined;
+} & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number | undefined;
 } & React.RefAttributes<HTMLDivElement>> & {
     Header: React.FC<import("./components/header/Component.desktop").HeaderDesktopProps> | React.FC<import("./components/header/Component.mobile").HeaderMobileProps>;
     Content: React.FC<import("./components/content/Component").ContentProps> | React.FC<import("./components/content/Component.desktop").ContentDesktopProps>;

package/Component.responsive.js

@@ -2,13 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-eacbc725.js');
+var tslib_es6 = require('./tslib.es6-2d094523.js');
 var React = require('react');
 require('classnames');
 require('@alfalab/core-components-base-modal');
 require('react-merge-refs');
 require('./Context.js');
-require('./components/header/Component.js');
+require('./Component-12cb5541.js');
 require('@alfalab/core-components-icon-button');
 require('@alfalab/icons-glyph/CrossHeavyMIcon');
 var components_closer_Component = require('./components/closer/Component.js');
@@ -18,7 +18,7 @@ require('./components/content/Component.desktop.js');
 require('./components/footer/Component.js');
 require('./components/footer/Component.desktop.js');
 var Component_desktop = require('./Component.desktop.js');
-require('./transitions.module-21cce0a0.js');
+require('./transitions.module-e148225b.js');
 require('@alfalab/icons-glyph/CrossMIcon');
 require('./components/header/Component.mobile.js');
 require('./components/content/Component.mobile.js');
@@ -42,10 +42,10 @@ function createResponsive(desktop, mobile) {
     return ResponsiveChild;
 }
 var ModalResponsiveComponent = React.forwardRef(function (_a, ref) {
-    var children = _a.children, restProps = tslib_es6.__rest(_a, ["children"]);
+    var children = _a.children, _b = _a.breakpoint, breakpoint = _b === void 0 ? 1024 : _b, restProps = tslib_es6.__rest(_a, ["children", "breakpoint"]);
     var view = hooks.useMedia([
-        ['mobile', '(max-width: 1023px)'],
-        ['desktop', '(min-width: 1024px)'],
+        ['mobile', "(max-width: " + (breakpoint - 1) + "px)"],
+        ['desktop', "(min-width: " + breakpoint + "px)"],
     ], 'desktop')[0];
     var contextValue = React.useMemo(function () { return ({ view: view }); }, [view]);
     var Component = view === 'desktop' ? Component_desktop.ModalDesktop : Component_mobile.ModalMobile;

package/components/closer/Component.d.ts

@@ -21,6 +21,10 @@ type CloserProps = ButtonHTMLAttributes<HTMLButtonElement> & {
      * Иконка
      */
     icon?: ElementType;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
 };
 /**
  * @deprecated Компонент только для внутреннего использования. Используйте <Header />

package/components/closer/Component.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-eacbc725.js');
+var tslib_es6 = require('../../tslib.es6-2d094523.js');
 var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal');
@@ -15,7 +15,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"closer":"modal__closer_ynwee","button":"modal__button_ynwee","sticky":"modal__sticky_ynwee"};
+var styles = {"closer":"modal__closer_1y0l6","button":"modal__button_1y0l6","sticky":"modal__sticky_1y0l6"};
 require('./index.css')
 
 /**
@@ -23,7 +23,7 @@ require('./index.css')
  */
 var Closer = function (_a) {
     var _b;
-    var className = _a.className, _c = _a.size, size = _c === void 0 ? 's' : _c, sticky = _a.sticky, _d = _a.icon, icon = _d === void 0 ? CrossHeavyMIcon.CrossHeavyMIcon : _d, restProps = tslib_es6.__rest(_a, ["className", "size", "sticky", "icon"]);
+    var className = _a.className, _c = _a.size, size = _c === void 0 ? 's' : _c, sticky = _a.sticky, _d = _a.icon, icon = _d === void 0 ? CrossHeavyMIcon.CrossHeavyMIcon : _d, dataTestId = _a.dataTestId, restProps = tslib_es6.__rest(_a, ["className", "size", "sticky", "icon", "dataTestId"]);
     var onClose = React.useContext(Context.ModalContext).onClose;
     var handleClick = React.useCallback(function (event) {
         onClose(event, 'closerClick');
@@ -31,7 +31,7 @@ var Closer = function (_a) {
     return (React__default['default'].createElement("div", { className: cn__default['default'](styles.closer, className, (_b = {},
             _b[styles.sticky] = sticky,
             _b)) },
-        React__default['default'].createElement(coreComponentsIconButton.IconButton, tslib_es6.__assign({ size: size, className: styles.button, "aria-label": '\u0437\u0430\u043A\u0440\u044B\u0442\u044C', onClick: handleClick, icon: icon }, restProps))));
+        React__default['default'].createElement(coreComponentsIconButton.IconButton, tslib_es6.__assign({ size: size, className: styles.button, "aria-label": '\u0437\u0430\u043A\u0440\u044B\u0442\u044C', onClick: handleClick, icon: icon, dataTestId: dataTestId }, restProps))));
 };
 
 exports.Closer = Closer;

package/components/closer/index.css

@@ -1,4 +1,4 @@
-/* hash: t5gp4 */
+/* hash: vyru2 */
 :root {
     --color-light-bg-primary-alpha-40: rgba(255, 255, 255, 0.4);
 }
@@ -29,7 +29,7 @@
 :root {
     --modal-closer-bg-color: var(--color-light-bg-primary-alpha-40);
 }
-.modal__closer_ynwee {
+.modal__closer_1y0l6 {
     flex-shrink: 0;
     width: 48px;
     height: 48px;
@@ -38,13 +38,13 @@
     align-items: center;
     justify-content: center;
 }
-.modal__button_ynwee {
+.modal__button_1y0l6 {
     background: var(--modal-closer-bg-color);
     -webkit-backdrop-filter: blur(10px);
             backdrop-filter: blur(10px);
     border-radius: 50px;
 }
-.modal__sticky_ynwee {
+.modal__sticky_1y0l6 {
     position: sticky;
     top: calc(var(--modal-vertical-padding) * -1);
 }

package/components/content/Component.desktop.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-eacbc725.js');
+var tslib_es6 = require('../../tslib.es6-2d094523.js');
 var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal');
@@ -14,7 +14,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"s":"modal__s_12a6s","m":"modal__m_12a6s","l":"modal__l_12a6s","xl":"modal__xl_12a6s","fullscreen":"modal__fullscreen_12a6s"};
+var styles = {"s":"modal__s_1q0fn","m":"modal__m_1q0fn","l":"modal__l_1q0fn","xl":"modal__xl_1q0fn","fullscreen":"modal__fullscreen_1q0fn"};
 require('./desktop.css')
 
 var ContentDesktop = function (_a) {

package/components/content/Component.js

@@ -12,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"content":"modal__content_bcjt8","flex":"modal__flex_bcjt8"};
+var styles = {"content":"modal__content_3213g","flex":"modal__flex_3213g"};
 require('./index.css')
 
 var Content = function (_a) {

package/components/content/Component.mobile.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-eacbc725.js');
+var tslib_es6 = require('../../tslib.es6-2d094523.js');
 var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal');
@@ -14,7 +14,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"content":"modal__content_1ewbl"};
+var styles = {"content":"modal__content_1bkee"};
 require('./mobile.css')
 
 var ContentMobile = function (_a) {

package/components/content/desktop.css

@@ -1,4 +1,4 @@
-/* hash: fbbpf */
+/* hash: amle4 */
 :root {
 
     /* Hard */
@@ -24,18 +24,18 @@
 
     /* mobile */
 }
-.modal__s_12a6s,
-.modal__m_12a6s {
+.modal__s_1q0fn,
+.modal__m_1q0fn {
     padding: var(--modal-s-content-paddings)
 }
-.modal__s_12a6s:last-child, .modal__m_12a6s:last-child {
+.modal__s_1q0fn:last-child, .modal__m_1q0fn:last-child {
         padding-bottom: var(--modal-s-content-only-bottom-padding);
     }
-.modal__l_12a6s,
-.modal__xl_12a6s,
-.modal__fullscreen_12a6s {
+.modal__l_1q0fn,
+.modal__xl_1q0fn,
+.modal__fullscreen_1q0fn {
     padding: 0 var(--gap-6xl)
 }
-.modal__l_12a6s:last-child, .modal__xl_12a6s:last-child, .modal__fullscreen_12a6s:last-child {
+.modal__l_1q0fn:last-child, .modal__xl_1q0fn:last-child, .modal__fullscreen_1q0fn:last-child {
         padding-bottom: var(--gap-6xl);
     }

package/components/content/index.css

@@ -1,4 +1,4 @@
-/* hash: i3xjb */
+/* hash: 3vjh3 */
 :root {
 
     /* Hard */
@@ -19,10 +19,10 @@
 
     /* mobile */
 }
-.modal__content_bcjt8 {
+.modal__content_3213g {
     box-sizing: border-box;
     width: 100%;
 }
-.modal__flex_bcjt8 {
+.modal__flex_3213g {
     flex: 1 1 auto;
 }

package/components/content/mobile.css

@@ -1,4 +1,4 @@
-/* hash: 1eteu */
+/* hash: 12ndl */
 :root {
 
     /* Hard */
@@ -22,9 +22,9 @@
 
     /* mobile */
 }
-.modal__content_1ewbl {
+.modal__content_1bkee {
     padding: 0 var(--gap-m)
 }
-.modal__content_1ewbl:last-child {
+.modal__content_1bkee:last-child {
         padding-bottom: var(--gap-m);
     }

package/components/footer/Component.desktop.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-eacbc725.js');
+var tslib_es6 = require('../../tslib.es6-2d094523.js');
 var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal');
@@ -14,7 +14,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"footer":"modal__footer_1l3ew","sticky":"modal__sticky_1l3ew","fullscreen":"modal__fullscreen_1l3ew","s":"modal__s_1l3ew","m":"modal__m_1l3ew","l":"modal__l_1l3ew","xl":"modal__xl_1l3ew"};
+var styles = {"footer":"modal__footer_1rihp","sticky":"modal__sticky_1rihp","fullscreen":"modal__fullscreen_1rihp","s":"modal__s_1rihp","m":"modal__m_1rihp","l":"modal__l_1rihp","xl":"modal__xl_1rihp"};
 require('./desktop.css')
 
 var FooterDesktop = function (_a) {

package/components/footer/Component.js

@@ -12,10 +12,10 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"footer":"modal__footer_a501a","sticky":"modal__sticky_a501a","highlighted":"modal__highlighted_a501a"};
+var styles = {"footer":"modal__footer_1ckue","sticky":"modal__sticky_1ckue","highlighted":"modal__highlighted_1ckue"};
 require('./index.css')
 
-var layoutStyles = {"column":"modal__column_74d01","gap-16":"modal__gap-16_74d01","gap-24":"modal__gap-24_74d01","gap-32":"modal__gap-32_74d01","start":"modal__start_74d01","center":"modal__center_74d01","space-between":"modal__space-between_74d01"};
+var layoutStyles = {"column":"modal__column_djfss","gap-16":"modal__gap-16_djfss","gap-24":"modal__gap-24_djfss","gap-32":"modal__gap-32_djfss","start":"modal__start_djfss","center":"modal__center_djfss","space-between":"modal__space-between_djfss"};
 require('./layout.css')
 
 var Footer = function (_a) {

package/components/footer/Component.mobile.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-eacbc725.js');
+var tslib_es6 = require('../../tslib.es6-2d094523.js');
 var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal');
@@ -14,7 +14,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"footer":"modal__footer_1xqlk","sticky":"modal__sticky_1xqlk"};
+var styles = {"footer":"modal__footer_lu7nw","sticky":"modal__sticky_lu7nw"};
 require('./mobile.css')
 
 var FooterMobile = function (_a) {

package/components/footer/desktop.css

@@ -1,4 +1,4 @@
-/* hash: e98if */
+/* hash: jcnt6 */
 :root {
 
     /* Hard */
@@ -31,22 +31,22 @@
 
     /* mobile */
 }
-.modal__footer_1l3ew {
+.modal__footer_1rihp {
     border-bottom-left-radius: var(--modal-border-radius);
     border-bottom-right-radius: var(--modal-border-radius);
 }
-.modal__sticky_1l3ew {
+.modal__sticky_1rihp {
     bottom: calc(var(--modal-vertical-padding) * -1)
 }
-.modal__sticky_1l3ew.modal__fullscreen_1l3ew {
+.modal__sticky_1rihp.modal__fullscreen_1rihp {
         bottom: 0;
     }
-.modal__s_1l3ew,
-.modal__m_1l3ew {
+.modal__s_1rihp,
+.modal__m_1rihp {
     padding: var(--modal-s-footer-paddings);
 }
-.modal__l_1l3ew,
-.modal__xl_1l3ew,
-.modal__fullscreen_1l3ew {
+.modal__l_1rihp,
+.modal__xl_1rihp,
+.modal__fullscreen_1rihp {
     padding: var(--gap-2xl) var(--gap-6xl) var(--gap-6xl);
 }

package/components/footer/index.css

@@ -1,4 +1,4 @@
-/* hash: dizyo */
+/* hash: s630c */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-border-primary: #dbdee1;
@@ -26,16 +26,16 @@
 
     /* mobile */
 }
-.modal__footer_a501a {
+.modal__footer_1ckue {
     width: 100%;
     box-sizing: border-box;
     transition: box-shadow 0.2s ease, background 0.2s ease;
 }
-.modal__sticky_a501a {
+.modal__sticky_1ckue {
     background: var(--modal-footer-background);
     position: sticky;
 }
-.modal__highlighted_a501a {
+.modal__highlighted_1ckue {
     background: var(--modal-footer-highlight-background);
     box-shadow: var(--modal-footer-highlight-box-shadow);
 }

package/components/footer/layout.css

@@ -1,4 +1,4 @@
-/* hash: iwlpl */
+/* hash: o010c */
 :root {
 
     /* Hard */
@@ -25,60 +25,60 @@
 
     /* mobile */
 }
-.modal__column_74d01 {
+.modal__column_djfss {
     display: flex;
     flex-direction: column
 }
-.modal__column_74d01 > * {
+.modal__column_djfss > * {
         margin-bottom: var(--modal-footer-default-gap);
     }
-.modal__column_74d01 > *:last-child,
-    .modal__column_74d01 > *:only-child {
+.modal__column_djfss > *:last-child,
+    .modal__column_djfss > *:only-child {
         margin-bottom: 0;
     }
-.modal__column_74d01.modal__gap-16_74d01 > * {
+.modal__column_djfss.modal__gap-16_djfss > * {
         margin-bottom: var(--gap-m);
     }
-.modal__column_74d01.modal__gap-24_74d01 > * {
+.modal__column_djfss.modal__gap-24_djfss > * {
         margin-bottom: var(--gap-xl);
     }
-.modal__column_74d01.modal__gap-32_74d01 > * {
+.modal__column_djfss.modal__gap-32_djfss > * {
         margin-bottom: var(--gap-2xl);
     }
-.modal__start_74d01 {
+.modal__start_djfss {
     justify-content: flex-start;
 }
-.modal__center_74d01 {
+.modal__center_djfss {
     justify-content: center;
 }
-.modal__space-between_74d01 {
+.modal__space-between_djfss {
     justify-content: space-between
 }
-.modal__space-between_74d01 > * {
+.modal__space-between_djfss > * {
         flex: 1;
     }
-.modal__start_74d01,
-.modal__center_74d01,
-.modal__space-between_74d01 {
+.modal__start_djfss,
+.modal__center_djfss,
+.modal__space-between_djfss {
     display: flex
 }
-.modal__start_74d01 > *, .modal__center_74d01 > *, .modal__space-between_74d01 > * {
+.modal__start_djfss > *, .modal__center_djfss > *, .modal__space-between_djfss > * {
         margin-right: var(--modal-footer-default-gap);
     }
-.modal__start_74d01 > *:last-child,
-    .modal__start_74d01 > *:only-child,
-    .modal__center_74d01 > *:last-child,
-    .modal__center_74d01 > *:only-child,
-    .modal__space-between_74d01 > *:last-child,
-    .modal__space-between_74d01 > *:only-child {
+.modal__start_djfss > *:last-child,
+    .modal__start_djfss > *:only-child,
+    .modal__center_djfss > *:last-child,
+    .modal__center_djfss > *:only-child,
+    .modal__space-between_djfss > *:last-child,
+    .modal__space-between_djfss > *:only-child {
         margin-right: 0;
     }
-.modal__start_74d01.modal__gap-16_74d01 > *, .modal__center_74d01.modal__gap-16_74d01 > *, .modal__space-between_74d01.modal__gap-16_74d01 > * {
+.modal__start_djfss.modal__gap-16_djfss > *, .modal__center_djfss.modal__gap-16_djfss > *, .modal__space-between_djfss.modal__gap-16_djfss > * {
         margin-right: var(--gap-m);
     }
-.modal__start_74d01.modal__gap-24_74d01 > *, .modal__center_74d01.modal__gap-24_74d01 > *, .modal__space-between_74d01.modal__gap-24_74d01 > * {
+.modal__start_djfss.modal__gap-24_djfss > *, .modal__center_djfss.modal__gap-24_djfss > *, .modal__space-between_djfss.modal__gap-24_djfss > * {
         margin-right: var(--gap-xl);
     }
-.modal__start_74d01.modal__gap-32_74d01 > *, .modal__center_74d01.modal__gap-32_74d01 > *, .modal__space-between_74d01.modal__gap-32_74d01 > * {
+.modal__start_djfss.modal__gap-32_djfss > *, .modal__center_djfss.modal__gap-32_djfss > *, .modal__space-between_djfss.modal__gap-32_djfss > * {
         margin-right: var(--gap-2xl);
     }