@alfalab/core-components-modal 9.1.2 → 9.2.1

package/esm/typings.d.ts

@@ -3,9 +3,10 @@ import { BaseModalProps } from "@alfalab/core-components-base-modal";
 type ModalDesktopProps = BaseModalProps & {
     /**
      * Ширина модального окна
-     * @default "m"
+     * @default 600
+     * @description s, m, l, xl deprecated, используйте вместо них 500, 600, 800, 1140 соответственно
      */
-    size?: 's' | 'm' | 'l' | 'xl' | 'fullscreen';
+    size?: 's' | 'm' | 'l' | 'xl' | 'fullscreen' | 500 | 600 | 800 | 1140;
     /**
      * Растягивает модальное окно на весь экран
      * @deprecated Используйте размер fullscreen

package/layout.module-fe843796.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var layoutStyles = {"column":"modal__column_17txo","gap-16":"modal__gap-16_17txo","gap-24":"modal__gap-24_17txo","gap-32":"modal__gap-32_17txo","start":"modal__start_17txo","center":"modal__center_17txo","space-between":"modal__space-between_17txo"};
+require('./components/footer/layout.css')
+
+exports.layoutStyles = layoutStyles;

package/mobile/mobile.css

@@ -1,5 +1,5 @@
-/* hash: mkti5 */
-:root {
+/* hash: cizqa */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -27,7 +27,7 @@
     /* mobile */
 
     /* paddings */
-} .modal__component_mug7j {
+} .modal__component_1rwpn {
     flex: 1;
     width: 100%;
     max-width: 600px;

package/modern/Component.d.ts

@@ -2,7 +2,7 @@
 import React from 'react';
 import { View } from "./typings";
 declare const Modal: React.ForwardRefExoticComponent<import("@alfalab/core-components-base-modal").BaseModalProps & {
-    size?: "s" | "m" | "l" | "xl" | "fullscreen" | undefined;
+    size?: "s" | "m" | "l" | "xl" | "fullscreen" | 500 | 600 | 800 | 1140 | undefined;
     fullscreen?: boolean | undefined;
     fixedPosition?: boolean | undefined;
     hasCloser?: boolean | undefined;

package/modern/Component.js

@@ -2,18 +2,19 @@ import React, { forwardRef, useRef, useMemo } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { BaseModal } from '@alfalab/core-components-base-modal/modern';
+import { SIZE_TO_CLASSNAME_MAP } from './consts.js';
 import { ResponsiveContext } from './ResponsiveContext.js';
 
-const desktopStyles = {"wrapper":"modal__wrapper_1m94n","component":"modal__component_1m94n","fullscreen":"modal__fullscreen_1m94n","s":"modal__s_1m94n","m":"modal__m_1m94n","l":"modal__l_1m94n","xl":"modal__xl_1m94n"};
+const desktopStyles = {"wrapper":"modal__wrapper_ll7xa","component":"modal__component_ll7xa","fullscreen":"modal__fullscreen_ll7xa","size-500":"modal__size-500_ll7xa","size-600":"modal__size-600_ll7xa","size-800":"modal__size-800_ll7xa","size-1140":"modal__size-1140_ll7xa"};
 require('./desktop/desktop.css')
 
-const mobileStyles = {"component":"modal__component_mug7j"};
+const mobileStyles = {"component":"modal__component_1rwpn"};
 require('./mobile/mobile.css')
 
-const transitions = {"appear":"modal__appear_5m9j3","enter":"modal__enter_5m9j3","appearActive":"modal__appearActive_5m9j3","enterActive":"modal__enterActive_5m9j3","exit":"modal__exit_5m9j3","exitActive":"modal__exitActive_5m9j3","exitDone":"modal__exitDone_5m9j3"};
+const transitions = {"appear":"modal__appear_f0ejj","enter":"modal__enter_f0ejj","appearActive":"modal__appearActive_f0ejj","enterActive":"modal__enterActive_f0ejj","exit":"modal__exit_f0ejj","exitActive":"modal__exitActive_f0ejj","exitDone":"modal__exitDone_f0ejj"};
 require('./transitions.css')
 
-const Modal = forwardRef(({ size = 's', fixedPosition, fullscreen, children, className, wrapperClassName, transitionProps = {}, view, dataTestId, ...restProps }, ref) => {
+const Modal = forwardRef(({ size = 500, fixedPosition, fullscreen, children, className, wrapperClassName, transitionProps = {}, view, dataTestId, ...restProps }, ref) => {
     // TODO: удалить, после удаления пропсы fullscreen
     const componentSize = fullscreen ? 'fullscreen' : size;
     const modalRef = useRef(null);
@@ -35,7 +36,7 @@ const Modal = forwardRef(({ size = 's', fixedPosition, fullscreen, children, cla
             wrapperClassName: cn(desktopStyles.wrapper, wrapperClassName, {
                 [desktopStyles.fullscreen]: componentSize === 'fullscreen',
             }),
-            className: cn(desktopStyles.component, className, desktopStyles[componentSize]),
+            className: cn(desktopStyles.component, className, desktopStyles[SIZE_TO_CLASSNAME_MAP[componentSize]]),
             backdropProps: {
                 invisible: componentSize === 'fullscreen',
                 ...restProps.backdropProps,

package/modern/Component.responsive.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import React from 'react';
 declare const ModalResponsive: React.ForwardRefExoticComponent<import("@alfalab/core-components-base-modal").BaseModalProps & {
-    size?: "s" | "m" | "l" | "xl" | "fullscreen" | undefined;
+    size?: "s" | "m" | "l" | "xl" | "fullscreen" | 500 | 600 | 800 | 1140 | undefined;
     fullscreen?: boolean | undefined;
     fixedPosition?: boolean | undefined;
     hasCloser?: boolean | undefined;

package/modern/ResponsiveContext.js

@@ -2,7 +2,7 @@ import React from 'react';
 
 const ResponsiveContext = React.createContext({
     view: 'desktop',
-    size: 's',
+    size: 500,
 });
 
 export { ResponsiveContext };

package/modern/components/content/Component.js

@@ -1,16 +1,17 @@
 import React, { useContext } from 'react';
 import cn from 'classnames';
 import { getDataTestId } from '@alfalab/core-components-shared/modern';
+import { SIZE_TO_CLASSNAME_MAP } from '../../consts.js';
 import { ModalContext } from '../../Context.js';
 import { ResponsiveContext } from '../../ResponsiveContext.js';
 
-const desktopStyles = {"s":"modal__s_1mjwu","m":"modal__m_1mjwu","l":"modal__l_1mjwu","xl":"modal__xl_1mjwu","fullscreen":"modal__fullscreen_1mjwu"};
+const desktopStyles = {"size-500":"modal__size-500_sl27z","size-600":"modal__size-600_sl27z","size-800":"modal__size-800_sl27z","size-1140":"modal__size-1140_sl27z","fullscreen":"modal__fullscreen_sl27z"};
 require('./desktop.css')
 
-const styles = {"content":"modal__content_1tap6","withHeader":"modal__withHeader_1tap6","flex":"modal__flex_1tap6"};
+const styles = {"content":"modal__content_1jwk6","withHeader":"modal__withHeader_1jwk6","flex":"modal__flex_1jwk6"};
 require('./index.css')
 
-const mobileStyles = {"content":"modal__content_w90gx"};
+const mobileStyles = {"content":"modal__content_1um7s"};
 require('./mobile.css')
 
 const Content = ({ children, flex, className }) => {
@@ -19,7 +20,7 @@ const Content = ({ children, flex, className }) => {
     return (React.createElement("div", { className: cn(styles.content, className, {
             [styles.flex]: flex,
             [styles.withHeader]: hasHeader,
-            [desktopStyles[size]]: view === 'desktop' && size,
+            [desktopStyles[SIZE_TO_CLASSNAME_MAP[size]]]: view === 'desktop' && size,
             [mobileStyles.content]: view === 'mobile',
         }), ref: contentRef, "data-test-id": getDataTestId(dataTestId, 'content') }, children));
 };

package/modern/components/content/desktop.css

@@ -1,5 +1,5 @@
-/* hash: mkh5r */
-:root {
+/* hash: vugqw */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -30,12 +30,12 @@
     /* mobile */
 
     /* paddings */
-} .modal__s_1mjwu,
-.modal__m_1mjwu,
-.modal__l_1mjwu,
-.modal__xl_1mjwu,
-.modal__fullscreen_1mjwu {
+} .modal__size-500_sl27z,
+.modal__size-600_sl27z,
+.modal__size-800_sl27z,
+.modal__size-1140_sl27z,
+.modal__fullscreen_sl27z {
     padding: var(--modal-s-content-paddings)
-} .modal__s_1mjwu:last-child, .modal__m_1mjwu:last-child, .modal__l_1mjwu:last-child, .modal__xl_1mjwu:last-child, .modal__fullscreen_1mjwu:last-child {
+} .modal__size-500_sl27z:last-child, .modal__size-600_sl27z:last-child, .modal__size-800_sl27z:last-child, .modal__size-1140_sl27z:last-child, .modal__fullscreen_sl27z:last-child {
         padding-bottom: var(--modal-s-content-only-bottom-padding);
     }

package/modern/components/content/index.css

@@ -1,5 +1,5 @@
-/* hash: 4smbj */
-:root {
+/* hash: e2lwo */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -27,13 +27,13 @@
     /* mobile */
 
     /* paddings */
-} .modal__content_1tap6 {
+} .modal__content_1jwk6 {
     position: relative;
     box-sizing: border-box;
     width: 100%;
     z-index: 0
-} .modal__content_1tap6.modal__withHeader_1tap6 {
+} .modal__content_1jwk6.modal__withHeader_1jwk6 {
         padding-top: 0;
-    } .modal__flex_1tap6 {
+    } .modal__flex_1jwk6 {
     flex: 1;
 }

package/modern/components/content/mobile.css

@@ -1,5 +1,5 @@
-/* hash: 1fytn */
-:root {
+/* hash: zm859 */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -28,8 +28,8 @@
     /* mobile */
 
     /* paddings */
-} .modal__content_w90gx {
+} .modal__content_1um7s {
     padding: var(--gap-m) var(--gap-m) 0
-} .modal__content_w90gx:last-child {
+} .modal__content_1um7s:last-child {
         padding-bottom: var(--gap-m);
     }

package/modern/components/controls/Component.js

@@ -2,9 +2,9 @@ import React, { useContext } from 'react';
 import cn from 'classnames';
 import { getDataTestId } from '@alfalab/core-components-shared/modern';
 import { ResponsiveContext } from '../../ResponsiveContext.js';
-import { l as layoutStyles } from '../../layout.module-8196cddb.js';
+import { l as layoutStyles } from '../../layout.module-6ffd48ba.js';
 
-const styles = {"component":"modal__component_xoyvt"};
+const styles = {"component":"modal__component_1ds60"};
 require('./index.css')
 
 const Controls = ({ primary, secondary, gap, layout: layoutProp = 'start', mobileLayout = layoutProp, }) => {

package/modern/components/controls/index.css

@@ -1,4 +1,4 @@
-/* hash: 1hxqe */
-.modal__component_xoyvt {
+/* hash: 1fdy2 */
+.modal__component_1ds60 {
     width: 100%;
 }

package/modern/components/footer/Component.js

@@ -1,17 +1,18 @@
 import React, { useContext, useEffect } from 'react';
 import cn from 'classnames';
 import { getDataTestId } from '@alfalab/core-components-shared/modern';
+import { SIZE_TO_CLASSNAME_MAP } from '../../consts.js';
 import { ModalContext } from '../../Context.js';
 import { ResponsiveContext } from '../../ResponsiveContext.js';
-import { l as layoutStyles } from '../../layout.module-8196cddb.js';
+import { l as layoutStyles } from '../../layout.module-6ffd48ba.js';
 
-const desktopStyles = {"footer":"modal__footer_l42dv","sticky":"modal__sticky_l42dv","fullscreen":"modal__fullscreen_l42dv","s":"modal__s_l42dv","m":"modal__m_l42dv","l":"modal__l_l42dv","xl":"modal__xl_l42dv"};
+const desktopStyles = {"footer":"modal__footer_bpxdf","sticky":"modal__sticky_bpxdf","fullscreen":"modal__fullscreen_bpxdf","size-500":"modal__size-500_bpxdf","size-600":"modal__size-600_bpxdf","size-800":"modal__size-800_bpxdf","size-1140":"modal__size-1140_bpxdf"};
 require('./desktop.css')
 
-const styles = {"footer":"modal__footer_bic9i","sticky":"modal__sticky_bic9i","highlighted":"modal__highlighted_bic9i"};
+const styles = {"footer":"modal__footer_1gklo","sticky":"modal__sticky_1gklo","highlighted":"modal__highlighted_1gklo"};
 require('./index.css')
 
-const mobileStyles = {"footer":"modal__footer_x2f2b","sticky":"modal__sticky_x2f2b"};
+const mobileStyles = {"footer":"modal__footer_gz7y4","sticky":"modal__sticky_gz7y4"};
 require('./mobile.css')
 
 const Footer = ({ children, className, sticky, layout = 'start', gap }) => {
@@ -25,7 +26,7 @@ const Footer = ({ children, className, sticky, layout = 'start', gap }) => {
             [styles.sticky]: sticky,
             [desktopStyles.footer]: view === 'desktop',
             [desktopStyles.sticky]: view === 'desktop' && sticky,
-            [desktopStyles[size]]: view === 'desktop',
+            [desktopStyles[SIZE_TO_CLASSNAME_MAP[size]]]: view === 'desktop',
             [mobileStyles.footer]: view === 'mobile',
             [mobileStyles.sticky]: view === 'mobile' && sticky,
         }) }, children));

package/modern/components/footer/desktop.css

@@ -1,5 +1,5 @@
-/* hash: 1xey0 */
-:root {
+/* hash: 1nd48 */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -33,17 +33,17 @@
     /* mobile */
 
     /* paddings */
-} .modal__footer_l42dv {
+} .modal__footer_bpxdf {
     border-bottom-left-radius: var(--modal-border-radius);
     border-bottom-right-radius: var(--modal-border-radius);
-} .modal__sticky_l42dv {
+} .modal__sticky_bpxdf {
     bottom: calc(var(--modal-vertical-padding) * -1)
-} .modal__sticky_l42dv.modal__fullscreen_l42dv {
+} .modal__sticky_bpxdf.modal__fullscreen_bpxdf {
         bottom: 0;
-    } .modal__s_l42dv,
-.modal__m_l42dv,
-.modal__l_l42dv,
-.modal__xl_l42dv,
-.modal__fullscreen_l42dv {
+    } .modal__size-500_bpxdf,
+.modal__size-600_bpxdf,
+.modal__size-800_bpxdf,
+.modal__size-1140_bpxdf,
+.modal__fullscreen_bpxdf {
     padding: var(--modal-s-footer-paddings);
 }

package/modern/components/footer/index.css

@@ -1,5 +1,5 @@
-/* hash: i822i */
-:root {
+/* hash: 868an */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-modal-bg-primary: #fff;
     --color-light-neutral-300: #e7e8eb; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -32,14 +32,14 @@
     /* mobile */
 
     /* paddings */
-} .modal__footer_bic9i {
+} .modal__footer_1gklo {
     width: 100%;
     box-sizing: border-box;
     transition: box-shadow 0.2s ease, background 0.2s ease;
-} .modal__sticky_bic9i {
+} .modal__sticky_1gklo {
     background: var(--modal-footer-background);
     position: sticky;
-} .modal__highlighted_bic9i {
+} .modal__highlighted_1gklo {
     background: var(--modal-footer-highlight-background);
     box-shadow: var(--modal-footer-highlight-box-shadow);
 }

package/modern/components/footer/layout.css

@@ -1,5 +1,5 @@
-/* hash: aevv7 */
-:root {
+/* hash: d23cf */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -31,35 +31,35 @@
     /* mobile */
 
     /* paddings */
-} .modal__column_1h82o {
+} .modal__column_17txo {
     display: flex;
     flex-direction: column
-} .modal__column_1h82o > *:not(:last-child):not(:only-child) {
+} .modal__column_17txo > *:not(:last-child):not(:only-child) {
         margin-bottom: var(--modal-footer-default-gap);
-    } .modal__column_1h82o.modal__gap-16_1h82o > *:not(:last-child):not(:only-child) {
+    } .modal__column_17txo.modal__gap-16_17txo > *:not(:last-child):not(:only-child) {
         margin-bottom: var(--gap-m);
-    } .modal__column_1h82o.modal__gap-24_1h82o > *:not(:last-child):not(:only-child) {
+    } .modal__column_17txo.modal__gap-24_17txo > *:not(:last-child):not(:only-child) {
         margin-bottom: var(--gap-xl);
-    } .modal__column_1h82o.modal__gap-32_1h82o > *:not(:last-child):not(:only-child) {
+    } .modal__column_17txo.modal__gap-32_17txo > *:not(:last-child):not(:only-child) {
         margin-bottom: var(--gap-2xl);
-    } .modal__start_1h82o {
+    } .modal__start_17txo {
     justify-content: flex-start;
-} .modal__center_1h82o {
+} .modal__center_17txo {
     justify-content: center;
-} .modal__space-between_1h82o {
+} .modal__space-between_17txo {
     justify-content: space-between
-} .modal__space-between_1h82o > * {
+} .modal__space-between_17txo > * {
         flex: 1;
-    } .modal__start_1h82o,
-.modal__center_1h82o,
-.modal__space-between_1h82o {
+    } .modal__start_17txo,
+.modal__center_17txo,
+.modal__space-between_17txo {
     display: flex
-} .modal__start_1h82o > *:not(:last-child):not(:only-child), .modal__center_1h82o > *:not(:last-child):not(:only-child), .modal__space-between_1h82o > *:not(:last-child):not(:only-child) {
+} .modal__start_17txo > *:not(:last-child):not(:only-child), .modal__center_17txo > *:not(:last-child):not(:only-child), .modal__space-between_17txo > *:not(:last-child):not(:only-child) {
         margin-right: var(--modal-footer-default-gap);
-    } .modal__start_1h82o.modal__gap-16_1h82o > *:not(:last-child):not(:only-child), .modal__center_1h82o.modal__gap-16_1h82o > *:not(:last-child):not(:only-child), .modal__space-between_1h82o.modal__gap-16_1h82o > *:not(:last-child):not(:only-child) {
+    } .modal__start_17txo.modal__gap-16_17txo > *:not(:last-child):not(:only-child), .modal__center_17txo.modal__gap-16_17txo > *:not(:last-child):not(:only-child), .modal__space-between_17txo.modal__gap-16_17txo > *:not(:last-child):not(:only-child) {
         margin-right: var(--gap-m);
-    } .modal__start_1h82o.modal__gap-24_1h82o > *:not(:last-child):not(:only-child), .modal__center_1h82o.modal__gap-24_1h82o > *:not(:last-child):not(:only-child), .modal__space-between_1h82o.modal__gap-24_1h82o > *:not(:last-child):not(:only-child) {
+    } .modal__start_17txo.modal__gap-24_17txo > *:not(:last-child):not(:only-child), .modal__center_17txo.modal__gap-24_17txo > *:not(:last-child):not(:only-child), .modal__space-between_17txo.modal__gap-24_17txo > *:not(:last-child):not(:only-child) {
         margin-right: var(--gap-xl);
-    } .modal__start_1h82o.modal__gap-32_1h82o > *:not(:last-child):not(:only-child), .modal__center_1h82o.modal__gap-32_1h82o > *:not(:last-child):not(:only-child), .modal__space-between_1h82o.modal__gap-32_1h82o > *:not(:last-child):not(:only-child) {
+    } .modal__start_17txo.modal__gap-32_17txo > *:not(:last-child):not(:only-child), .modal__center_17txo.modal__gap-32_17txo > *:not(:last-child):not(:only-child), .modal__space-between_17txo.modal__gap-32_17txo > *:not(:last-child):not(:only-child) {
         margin-right: var(--gap-2xl);
     }

package/modern/components/footer/mobile.css

@@ -1,5 +1,5 @@
-/* hash: vfik2 */
-:root {
+/* hash: xzavo */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -28,8 +28,8 @@
     /* mobile */
 
     /* paddings */
-} .modal__footer_x2f2b {
+} .modal__footer_gz7y4 {
     padding: var(--gap-m);
-} .modal__sticky_x2f2b {
+} .modal__sticky_gz7y4 {
     bottom: 0;
 }

package/modern/components/header/Component.js

@@ -2,16 +2,17 @@ import React, { useContext, useEffect } from 'react';
 import cn from 'classnames';
 import { NavigationBar } from '@alfalab/core-components-navigation-bar/modern';
 import { getDataTestId } from '@alfalab/core-components-shared/modern';
+import { SIZE_TO_CLASSNAME_MAP } from '../../consts.js';
 import { ModalContext } from '../../Context.js';
 import { ResponsiveContext } from '../../ResponsiveContext.js';
 
-const desktopStyles = {"header":"modal__header_pzls4","content":"modal__content_pzls4","s":"modal__s_pzls4","m":"modal__m_pzls4","l":"modal__l_pzls4","xl":"modal__xl_pzls4","fullscreen":"modal__fullscreen_pzls4","sticky":"modal__sticky_pzls4"};
+const desktopStyles = {"header":"modal__header_glgro","content":"modal__content_glgro","size-500":"modal__size-500_glgro","size-600":"modal__size-600_glgro","size-800":"modal__size-800_glgro","size-1140":"modal__size-1140_glgro","fullscreen":"modal__fullscreen_glgro","sticky":"modal__sticky_glgro"};
 require('./desktop.css')
 
-const styles = {"highlighted":"modal__highlighted_vvxel","sticky":"modal__sticky_vvxel","hasContent":"modal__hasContent_vvxel"};
+const styles = {"highlighted":"modal__highlighted_1x2s2","sticky":"modal__sticky_1x2s2","hasContent":"modal__hasContent_1x2s2"};
 require('./index.css')
 
-const mobileStyles = {"header":"modal__header_1xat9","sticky":"modal__sticky_1xat9","content":"modal__content_1xat9"};
+const mobileStyles = {"header":"modal__header_1h7m4","sticky":"modal__sticky_1h7m4","content":"modal__content_1h7m4"};
 require('./mobile.css')
 
 const Header = ({ className, sticky, title, children, contentClassName, hasCloser = true, ...restProps }) => {
@@ -27,7 +28,7 @@ const Header = ({ className, sticky, title, children, contentClassName, hasClose
             [styles.hasContent]: hasContent,
             [desktopStyles.header]: view === 'desktop',
             [desktopStyles.sticky]: view === 'desktop' && sticky,
-            [desktopStyles[size]]: view === 'desktop',
+            [desktopStyles[SIZE_TO_CLASSNAME_MAP[size]]]: view === 'desktop',
             [mobileStyles.header]: view === 'mobile',
             [mobileStyles.sticky]: view === 'mobile' && sticky,
         }), contentClassName: cn(contentClassName, {

package/modern/components/header/desktop.css

@@ -1,5 +1,5 @@
-/* hash: fabkh */
-:root {
+/* hash: 19ose */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -44,31 +44,31 @@
     /* mobile */
 
     /* paddings */
-} .modal__header_pzls4 {
+} .modal__header_glgro {
     border-top-left-radius: var(--modal-border-radius);
     border-top-right-radius: var(--modal-border-radius);
-} .modal__content_pzls4 {
+} .modal__content_glgro {
     font-weight: var(--modal-header-desktop-font-weight);
     font-family: var(--modal-header-desktop-font-family);
-} .modal__s_pzls4 .modal__content_pzls4,
-.modal__m_pzls4 .modal__content_pzls4 {
+} .modal__size-500_glgro .modal__content_glgro,
+.modal__size-600_glgro .modal__content_glgro {
     padding: var(--modal-s-header-desktop-content-paddings);
     font-size: var(--modal-s-header-desktop-font-size);
     line-height: var(--modal-s-header-desktop-line-height);
-} .modal__l_pzls4 .modal__content_pzls4,
-.modal__xl_pzls4 .modal__content_pzls4,
-.modal__fullscreen_pzls4 .modal__content_pzls4 {
+} .modal__size-800_glgro .modal__content_glgro,
+.modal__size-1140_glgro .modal__content_glgro,
+.modal__fullscreen_glgro .modal__content_glgro {
     padding: var(--modal-l-header-desktop-content-paddings);
     font-size: var(--modal-l-header-desktop-font-size);
     line-height: var(--modal-l-header-desktop-line-height);
-} .modal__s_pzls4,
-.modal__m_pzls4,
-.modal__l_pzls4,
-.modal__xl_pzls4,
-.modal__fullscreen_pzls4 {
+} .modal__size-500_glgro,
+.modal__size-600_glgro,
+.modal__size-800_glgro,
+.modal__size-1140_glgro,
+.modal__fullscreen_glgro {
     padding: var(--modal-s-header-paddings);
-} .modal__sticky_pzls4 {
+} .modal__sticky_glgro {
     top: calc(var(--modal-vertical-padding) * -1)
-} .modal__sticky_pzls4.modal__fullscreen_pzls4 {
+} .modal__sticky_glgro.modal__fullscreen_glgro {
         top: 0;
     }

package/modern/components/header/index.css

@@ -1,5 +1,5 @@
-/* hash: 13b9r */
-:root {
+/* hash: 1xpql */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-modal-bg-primary: #fff;
     --color-light-neutral-300: #e7e8eb; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -32,12 +32,12 @@
     /* mobile */
 
     /* paddings */
-} .modal__highlighted_vvxel {
+} .modal__highlighted_1x2s2 {
     background: var(--modal-header-highlight-background);
     box-shadow: var(--modal-header-highlight-box-shadow);
-} .modal__sticky_vvxel {
+} .modal__sticky_1x2s2 {
     position: sticky;
     z-index: 1
-} .modal__sticky_vvxel.modal__hasContent_vvxel {
+} .modal__sticky_1x2s2.modal__hasContent_1x2s2 {
         background: var(--modal-header-background);
     }

package/modern/components/header/mobile.css

@@ -1,5 +1,5 @@
-/* hash: 1l0ez */
-:root {
+/* hash: jjc83 */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -38,11 +38,11 @@
 
     /* paddings */
     --modal-header-mobile-paddings: var(--gap-2xs) var(--gap-xs);
-} .modal__header_1xat9 {
+} .modal__header_1h7m4 {
     padding: var(--modal-header-mobile-paddings);
-} .modal__sticky_1xat9 {
+} .modal__sticky_1h7m4 {
     top: 0;
-} .modal__content_1xat9 {
+} .modal__content_1h7m4 {
     font-size: var(--modal-header-mobile-font-size);
     line-height: var(--modal-header-mobile-line-height);
     font-family: var(--modal-header-mobile-font-family);