@alfalab/core-components-modal 4.1.0 → 5.0.1

package/dist/cssm/Component.desktop.js

@@ -8,15 +8,19 @@ var cn = require('classnames');
 var coreComponentsBaseModal = require('@alfalab/core-components-base-modal/dist/cssm');
 var mergeRefs = require('react-merge-refs');
 require('./Context.js');
-require('@alfalab/core-components-button/dist/cssm');
+require('./components/header/index.module.css');
+require('./components/header/Component.js');
+require('@alfalab/core-components-icon-button/dist/cssm');
+require('@alfalab/icons-glyph/CrossHeavyMIcon');
 require('./components/closer/index.module.css');
 var components_closer_Component = require('./components/closer/Component.js');
-require('./components/header/Component.js');
 require('./components/header/desktop.module.css');
 var components_header_Component_desktop = require('./components/header/Component.desktop.js');
+require('./components/content/index.module.css');
 require('./components/content/Component.js');
 require('./components/content/desktop.module.css');
 var components_content_Component_desktop = require('./components/content/Component.desktop.js');
+require('./components/footer/index.module.css');
 require('./components/footer/layout.module.css');
 require('./components/footer/Component.js');
 require('./components/footer/desktop.module.css');
@@ -35,6 +39,8 @@ var transitions__default = /*#__PURE__*/_interopDefaultLegacy(transitions);
 var ModalDesktopComponent = React.forwardRef(function (_a, ref) {
     var _b;
     var _c = _a.size, size = _c === void 0 ? 's' : _c, fixedPosition = _a.fixedPosition, fullscreen = _a.fullscreen, children = _a.children, className = _a.className, wrapperClassName = _a.wrapperClassName, _d = _a.transitionProps, transitionProps = _d === void 0 ? {} : _d, restProps = tslib_es6.__rest(_a, ["size", "fixedPosition", "fullscreen", "children", "className", "wrapperClassName", "transitionProps"]);
+    // TODO: удалить, после удаления пропсы fullscreen
+    var componentSize = fullscreen ? 'fullscreen' : size;
     var modalRef = React.useRef(null);
     var handleEntered = React.useCallback(function (node, isAppearing) {
         if (fixedPosition && modalRef.current) {
@@ -49,11 +55,9 @@ var ModalDesktopComponent = React.forwardRef(function (_a, ref) {
         }
     }, [fixedPosition, transitionProps]);
     return (React__default['default'].createElement(coreComponentsBaseModal.BaseModal, tslib_es6.__assign({}, restProps, { ref: mergeRefs__default['default']([ref, modalRef]), wrapperClassName: cn__default['default'](styles__default['default'].wrapper, wrapperClassName, (_b = {},
-            _b[styles__default['default'].fullscreen] = fullscreen,
-            _b)), className: cn__default['default'](styles__default['default'].component, className, !fullscreen && styles__default['default'][size]), backdropProps: tslib_es6.__assign(tslib_es6.__assign({}, restProps.backdropProps), { invisible: fullscreen }), transitionProps: tslib_es6.__assign(tslib_es6.__assign({ classNames: transitions__default['default'] }, transitionProps), { onEntered: handleEntered }) }), React__default['default'].Children.map(children, function (child) {
-        return React.isValidElement(child)
-            ? React.cloneElement(child, { size: child.props.size || size, fullscreen: fullscreen })
-            : child;
+            _b[styles__default['default'].fullscreen] = componentSize === 'fullscreen',
+            _b)), className: cn__default['default'](styles__default['default'].component, className, styles__default['default'][componentSize]), backdropProps: tslib_es6.__assign(tslib_es6.__assign({}, restProps.backdropProps), { invisible: componentSize === 'fullscreen' }), transitionProps: tslib_es6.__assign(tslib_es6.__assign({ classNames: transitions__default['default'] }, transitionProps), { onEntered: handleEntered }) }), React__default['default'].Children.map(children, function (child) {
+        return React.isValidElement(child) ? React.cloneElement(child, { size: componentSize }) : child;
     })));
 });
 var ModalDesktop = Object.assign(ModalDesktopComponent, {

package/dist/cssm/Component.mobile.d.ts

@@ -16,7 +16,7 @@ declare const ModalMobile: React.ForwardRefExoticComponent<BaseModalProps & {
     hasCloser?: boolean | undefined;
 } & React.RefAttributes<HTMLDivElement>> & {
     Content: React.FC<import("./components/content/Component").ContentProps>;
-    Header: React.FC<import("./components/header/Component").HeaderProps>;
+    Header: React.FC<import("./components/header/Component.mobile").HeaderMobileProps>;
     Footer: React.FC<import("./components/footer/Component").FooterProps>;
     Closer: React.FC<import("./components/closer/Component").CloserProps>;
 };

package/dist/cssm/Component.mobile.js

@@ -7,15 +7,19 @@ var React = require('react');
 var cn = require('classnames');
 var coreComponentsBaseModal = require('@alfalab/core-components-base-modal/dist/cssm');
 require('./Context.js');
-require('@alfalab/core-components-button/dist/cssm');
+require('./components/header/index.module.css');
+require('./components/header/Component.js');
+require('@alfalab/core-components-icon-button/dist/cssm');
+require('@alfalab/icons-glyph/CrossHeavyMIcon');
 require('./components/closer/index.module.css');
 var components_closer_Component = require('./components/closer/Component.js');
-require('./components/header/Component.js');
+require('./components/content/index.module.css');
 require('./components/content/Component.js');
+require('./components/footer/index.module.css');
 require('./components/footer/layout.module.css');
 require('./components/footer/Component.js');
 var transitions = require('./transitions.module.css');
-var hooks = require('@alfalab/hooks');
+require('@alfalab/icons-glyph/CrossMIcon');
 require('./components/header/mobile.module.css');
 var components_header_Component_mobile = require('./components/header/Component.mobile.js');
 require('./components/content/mobile.module.css');
@@ -33,15 +37,7 @@ var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
 var ModalMobileComponent = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, restProps = tslib_es6.__rest(_a, ["children", "className"]);
-    var size = hooks.useMedia([
-        ['s', '(max-width: 375px)'],
-        ['m', '(min-width: 376px)'],
-    ], 's')[0];
-    return (React__default['default'].createElement(coreComponentsBaseModal.BaseModal, tslib_es6.__assign({}, restProps, { ref: ref, transitionProps: tslib_es6.__assign({ classNames: transitions__default['default'] }, restProps.transitionProps), className: cn__default['default'](className, styles__default['default'].component), backdropProps: tslib_es6.__assign(tslib_es6.__assign({}, restProps.backdropProps), { invisible: true }) }), React__default['default'].Children.map(children, function (child) {
-        return React.isValidElement(child)
-            ? React.cloneElement(child, { size: child.props.size || size, fullscreen: true })
-            : child;
-    })));
+    return (React__default['default'].createElement(coreComponentsBaseModal.BaseModal, tslib_es6.__assign({}, restProps, { ref: ref, transitionProps: tslib_es6.__assign({ classNames: transitions__default['default'] }, restProps.transitionProps), className: cn__default['default'](className, styles__default['default'].component) }), children));
 });
 var ModalMobile = Object.assign(ModalMobileComponent, {
     Content: components_content_Component_mobile.ContentMobile,

package/dist/cssm/Component.responsive.d.ts

@@ -6,14 +6,14 @@ type ModalResponsiveProps = ModalMobileProps & ModalDesktopProps;
 declare const ModalResponsive: React.ForwardRefExoticComponent<import("packages/base-modal/src").BaseModalProps & {
     hasCloser?: boolean | undefined;
 } & {
-    size?: "s" | "m" | "l" | undefined;
+    size?: "s" | "m" | "l" | "xl" | "fullscreen" | undefined;
     fullscreen?: boolean | undefined;
     fixedPosition?: boolean | undefined;
     hasCloser?: boolean | undefined;
 } & React.RefAttributes<HTMLDivElement>> & {
-    Header: React.FC<import("./components/header/Component.desktop").HeaderDesktopProps> | React.FC<import("./components/header/Component").HeaderProps>;
-    Content: React.FC<import("./components/content/Component.desktop").ContentDesktopProps> | React.FC<import("./components/content/Component").ContentProps>;
-    Footer: React.FC<import("./components/footer/Component.desktop").FooterDesktopProps> | React.FC<import("./components/footer/Component").FooterProps>;
+    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>;
+    Footer: React.FC<import("./components/footer/Component").FooterProps> | React.FC<import("./components/footer/Component.desktop").FooterDesktopProps>;
     Closer: React.FC<import("./components/closer/Component").CloserProps>;
 };
 export { ModalResponsiveProps, ModalResponsive };

package/dist/cssm/Component.responsive.js

@@ -8,15 +8,19 @@ require('classnames');
 require('@alfalab/core-components-base-modal/dist/cssm');
 require('react-merge-refs');
 require('./Context.js');
-require('@alfalab/core-components-button/dist/cssm');
+require('./components/header/index.module.css');
+require('./components/header/Component.js');
+require('@alfalab/core-components-icon-button/dist/cssm');
+require('@alfalab/icons-glyph/CrossHeavyMIcon');
 require('./components/closer/index.module.css');
 var components_closer_Component = require('./components/closer/Component.js');
-require('./components/header/Component.js');
 require('./components/header/desktop.module.css');
 require('./components/header/Component.desktop.js');
+require('./components/content/index.module.css');
 require('./components/content/Component.js');
 require('./components/content/desktop.module.css');
 require('./components/content/Component.desktop.js');
+require('./components/footer/index.module.css');
 require('./components/footer/layout.module.css');
 require('./components/footer/Component.js');
 require('./components/footer/desktop.module.css');
@@ -24,7 +28,7 @@ require('./components/footer/Component.desktop.js');
 require('./desktop.module.css');
 require('./transitions.module.css');
 var Component_desktop = require('./Component.desktop.js');
-var hooks = require('@alfalab/hooks');
+require('@alfalab/icons-glyph/CrossMIcon');
 require('./components/header/mobile.module.css');
 require('./components/header/Component.mobile.js');
 require('./components/content/mobile.module.css');
@@ -33,6 +37,7 @@ require('./components/footer/mobile.module.css');
 require('./components/footer/Component.mobile.js');
 require('./mobile.module.css');
 var Component_mobile = require('./Component.mobile.js');
+var hooks = require('@alfalab/hooks');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -52,8 +57,8 @@ function createResponsive(desktop, mobile) {
 var ModalResponsiveComponent = React.forwardRef(function (_a, ref) {
     var children = _a.children, restProps = tslib_es6.__rest(_a, ["children"]);
     var view = hooks.useMedia([
-        ['mobile', '(max-width: 767px)'],
-        ['desktop', '(min-width: 768px)'],
+        ['mobile', '(max-width: 1023px)'],
+        ['desktop', '(min-width: 1024px)'],
     ], 'desktop')[0];
     var contextValue = React.useMemo(function () { return ({ view: view }); }, [view]);
     var Component = view === 'desktop' ? Component_desktop.ModalDesktop : Component_mobile.ModalMobile;

package/dist/cssm/components/closer/Component.d.ts

@@ -1,4 +1,5 @@
-import { ButtonHTMLAttributes, FC } from 'react';
+import { ButtonHTMLAttributes, ElementType, FC } from 'react';
+import { IconButtonProps } from "@alfalab/core-components-icon-button";
 type CloserProps = ButtonHTMLAttributes<HTMLButtonElement> & {
     /**
      * Дополнительный класс
@@ -9,9 +10,20 @@ type CloserProps = ButtonHTMLAttributes<HTMLButtonElement> & {
      */
     align?: 'left' | 'right';
     /**
-     * Флаг, что модальное окно открыто на весь экран
+     * Размер кнопки
      */
-    fullscreen?: boolean;
+    size?: IconButtonProps['size'];
+    /**
+     * Фиксирует крестик
+     */
+    sticky?: boolean;
+    /**
+     * Иконка
+     */
+    icon?: ElementType;
 };
+/**
+ * @deprecated Компонент только для внутреннего использования. Используйте <Header />
+ */
 declare const Closer: FC<CloserProps>;
 export { CloserProps, Closer };

package/dist/cssm/components/closer/Component.js

@@ -7,7 +7,8 @@ var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal/dist/cssm');
 var Context = require('../../Context.js');
-var coreComponentsButton = require('@alfalab/core-components-button/dist/cssm');
+var coreComponentsIconButton = require('@alfalab/core-components-icon-button/dist/cssm');
+var CrossHeavyMIcon = require('@alfalab/icons-glyph/CrossHeavyMIcon');
 var styles = require('./index.module.css');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -16,13 +17,20 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
+/**
+ * @deprecated Компонент только для внутреннего использования. Используйте <Header />
+ */
 var Closer = function (_a) {
-    var className = _a.className, fullscreen = _a.fullscreen, align = _a.align, restProps = tslib_es6.__rest(_a, ["className", "fullscreen", "align"]);
+    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 onClose = React.useContext(Context.ModalContext).onClose;
     var handleClick = React.useCallback(function (event) {
         onClose(event, 'closerClick');
     }, [onClose]);
-    return (React__default['default'].createElement(coreComponentsButton.Button, tslib_es6.__assign({ type: 'button', view: 'ghost', className: cn__default['default'](styles__default['default'].closer, className, fullscreen && styles__default['default'].fullscreen, align && styles__default['default'][align]), "aria-label": '\u0437\u0430\u043A\u0440\u044B\u0442\u044C', onClick: handleClick }, restProps)));
+    return (React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].closer, className, (_b = {},
+            _b[styles__default['default'].sticky] = sticky,
+            _b)) },
+        React__default['default'].createElement(coreComponentsIconButton.IconButton, tslib_es6.__assign({ size: size, className: styles__default['default'].button, "aria-label": '\u0437\u0430\u043A\u0440\u044B\u0442\u044C', onClick: handleClick, icon: icon }, restProps))));
 };
 
 exports.Closer = Closer;

package/dist/cssm/components/closer/index.module.css

@@ -1,3 +1,6 @@
+:root {
+    --color-light-bg-primary-alpha-40: rgba(255, 255, 255, 0.4);
+}
 :root {
 
     /* Hard */
@@ -16,36 +19,31 @@
 
     /* paddings */
 
-    /* closer */
-    --modal-closer-icon: url('https://alfabank.gcdn.co/icons/glyph_cross_m.svg');
+    /* scroll */
 
-    /* sticky */
+    /* desktop */
 
-    /* scroll */
+    /* mobile */
+}
+:root {
+    --modal-closer-bg-color: var(--color-light-bg-primary-alpha-40);
 }
 .closer {
+    flex-shrink: 0;
     width: 48px;
     height: 48px;
-    background-image: var(--modal-closer-icon);
-    background-position: center;
-    background-repeat: no-repeat;
-    flex-shrink: 0;
-    transition: opacity 0.2s ease-out
-}
-.closer:hover {
-        opacity: 0.7;
-    }
-.closer:active {
-        opacity: 0.5;
-    }
-.left,
-.right {
-    position: sticky;
-    top: calc(var(--modal-vertical-padding) * -1);
-}
-.right {
     margin-left: auto;
+    display: flex;
+    align-items: center;
+    justify-content: center;
 }
-.fullscreen {
-    top: 0;
+.button {
+    background: var(--modal-closer-bg-color);
+    -webkit-backdrop-filter: blur(10px);
+            backdrop-filter: blur(10px);
+    border-radius: 50px;
+}
+.sticky {
+    position: sticky;
+    top: calc(var(--modal-vertical-padding) * -1);
 }

package/dist/cssm/components/content/Component.d.ts

@@ -13,7 +13,5 @@ type ContentProps = {
      */
     flex?: boolean;
 };
-declare const Content: FC<ContentProps & {
-    styles: Record<string, string>;
-}>;
+declare const Content: FC<ContentProps>;
 export { ContentProps, Content };

package/dist/cssm/components/content/Component.desktop.d.ts

@@ -1,14 +1,11 @@
 import { FC } from 'react';
 import { ContentProps } from "./Component";
+import { ModalDesktopProps } from "../../Component.desktop";
 type ContentDesktopProps = ContentProps & {
     /**
      * Размер
      */
-    size?: 's' | 'm' | 'l';
-    /**
-     * Флаг, что модальное окно открыто на весь экран
-     */
-    fullscreen?: boolean;
+    size?: ModalDesktopProps['size'];
 };
 declare const ContentDesktop: FC<ContentDesktopProps>;
 export { ContentDesktopProps, ContentDesktop };

package/dist/cssm/components/content/Component.desktop.js

@@ -7,6 +7,7 @@ var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal/dist/cssm');
 require('../../Context.js');
+require('./index.module.css');
 var components_content_Component = require('./Component.js');
 var styles = require('./desktop.module.css');
 
@@ -17,8 +18,8 @@ var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
 var ContentDesktop = function (_a) {
-    var size = _a.size, className = _a.className, fullscreen = _a.fullscreen, restProps = tslib_es6.__rest(_a, ["size", "className", "fullscreen"]);
-    return (React__default['default'].createElement(components_content_Component.Content, tslib_es6.__assign({ className: cn__default['default'](className, size && styles__default['default'][size], fullscreen && styles__default['default'].fullscreen), styles: styles__default['default'] }, restProps)));
+    var size = _a.size, className = _a.className, restProps = tslib_es6.__rest(_a, ["size", "className"]);
+    return (React__default['default'].createElement(components_content_Component.Content, tslib_es6.__assign({ className: cn__default['default'](className, size && styles__default['default'][size]) }, restProps)));
 };
 
 exports.ContentDesktop = ContentDesktop;

package/dist/cssm/components/content/Component.js

@@ -6,18 +6,20 @@ var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal/dist/cssm');
 var Context = require('../../Context.js');
+var styles = require('./index.module.css');
 
 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 styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
 var Content = function (_a) {
     var _b;
-    var children = _a.children, flex = _a.flex, className = _a.className, styles = _a.styles;
+    var children = _a.children, flex = _a.flex, className = _a.className;
     var contentRef = React.useContext(Context.ModalContext).contentRef;
-    return (React__default['default'].createElement("div", { className: cn__default['default'](styles.content, className, (_b = {},
-            _b[styles.flex] = flex,
+    return (React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].content, className, (_b = {},
+            _b[styles__default['default'].flex] = flex,
             _b)), ref: contentRef }, children));
 };
 

package/dist/cssm/components/content/Component.mobile.js

@@ -4,17 +4,22 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib_es6 = require('../../tslib.es6-ce870b46.js');
 var React = require('react');
-require('classnames');
+var cn = require('classnames');
 require('@alfalab/core-components-base-modal/dist/cssm');
 require('../../Context.js');
+require('./index.module.css');
 var components_content_Component = require('./Component.js');
 var styles = require('./mobile.module.css');
 
 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 styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
-var ContentMobile = function (props) { return (React__default['default'].createElement(components_content_Component.Content, tslib_es6.__assign({ styles: styles__default['default'] }, props))); };
+var ContentMobile = function (_a) {
+    var className = _a.className, restProps = tslib_es6.__rest(_a, ["className"]);
+    return (React__default['default'].createElement(components_content_Component.Content, tslib_es6.__assign({ className: cn__default['default'](className, styles__default['default'].content) }, restProps)));
+};
 
 exports.ContentMobile = ContentMobile;

package/dist/cssm/components/content/desktop.module.css

@@ -7,7 +7,6 @@
     /* Hard up */
 }
 :root {
-    --gap-4xl: 48px;
     --gap-6xl: 72px;
 }
 :root {
@@ -15,33 +14,27 @@
     /* sizes */
 
     /* paddings */
-    --modal-s-content-paddings: 0 var(--gap-4xl) 0;
-    --modal-m-content-paddings: 0 var(--gap-4xl) 0;
-    --modal-l-content-paddings: 0 var(--gap-6xl) 0;
-    --modal-l-content-no-footer-bottom-padding: var(--gap-6xl);
+    --modal-s-content-paddings: 0 56px;
+    --modal-s-content-only-bottom-padding: 56px;
 
-    /* closer */
+    /* scroll */
 
-    /* sticky */
+    /* desktop */
 
-    /* scroll */
-}
-.content {
-    composes: content from 'index.module.css';
-}
-.flex {
-    composes: flex from 'index.module.css';
-}
-.s {
-    padding: var(--modal-s-content-paddings);
+    /* mobile */
 }
+.s,
 .m {
-    padding: var(--modal-m-content-paddings);
+    padding: var(--modal-s-content-paddings)
 }
+.s:last-child, .m:last-child {
+        padding-bottom: var(--modal-s-content-only-bottom-padding);
+    }
 .l,
+.xl,
 .fullscreen {
-    padding: var(--modal-l-content-paddings)
+    padding: 0 var(--gap-6xl)
 }
-.l:last-child, .fullscreen:last-child {
-        padding-bottom: var(--modal-l-content-no-footer-bottom-padding);
+.l:last-child, .xl:last-child, .fullscreen:last-child {
+        padding-bottom: var(--gap-6xl);
     }

package/dist/cssm/components/content/index.module.css

@@ -6,34 +6,22 @@
 
     /* Hard up */
 }
-:root {
-    --gap-2xl: 32px;
-    --gap-4xl: 48px;
-}
 :root {
 
     /* sizes */
 
     /* paddings */
-    --modal-content-no-footer-bottom-padding: var(--gap-4xl);
-    --modal-content-no-header-top-padding: var(--gap-2xl);
 
-    /* closer */
+    /* scroll */
 
-    /* sticky */
+    /* desktop */
 
-    /* scroll */
+    /* mobile */
 }
 .content {
     box-sizing: border-box;
-    width: 100%
+    width: 100%;
 }
-.content:first-child {
-        padding-top: var(--modal-content-no-header-top-padding);
-    }
-.content:last-child {
-        padding-bottom: var(--modal-content-no-footer-bottom-padding);
-    }
 .flex {
     flex: 1 1 auto;
 }

package/dist/cssm/components/content/mobile.module.css

@@ -15,17 +15,15 @@
 
     /* paddings */
 
-    /* closer */
+    /* scroll */
 
-    /* sticky */
+    /* desktop */
 
-    /* scroll */
+    /* mobile */
 }
 .content {
-    composes: content from 'index.module.css';
-
-    padding: 0 var(--gap-m) 0;
-}
-.flex {
-    composes: flex from 'index.module.css';
+    padding: 0 var(--gap-m)
 }
+.content:last-child {
+        padding-bottom: var(--gap-m);
+    }

package/dist/cssm/components/footer/Component.d.ts

@@ -21,7 +21,5 @@ type FooterProps = {
      */
     gap?: 16 | 24 | 32;
 };
-declare const Footer: FC<FooterProps & {
-    styles: Record<string, string>;
-}>;
+declare const Footer: FC<FooterProps>;
 export { FooterProps, Footer };

package/dist/cssm/components/footer/Component.desktop.d.ts

@@ -1,14 +1,11 @@
 import { FC } from 'react';
 import { FooterProps } from "./Component";
+import { ModalDesktopProps } from "../../Component.desktop";
 type FooterDesktopProps = FooterProps & {
     /**
      * Размер
      */
-    size?: 's' | 'm' | 'l';
-    /**
-     * Флаг, что модальное окно открыто на весь экран
-     */
-    fullscreen?: boolean;
+    size?: ModalDesktopProps['size'];
 };
 declare const FooterDesktop: FC<FooterDesktopProps>;
 export { FooterDesktopProps, FooterDesktop };

package/dist/cssm/components/footer/Component.desktop.js

@@ -7,6 +7,7 @@ var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal/dist/cssm');
 require('../../Context.js');
+require('./index.module.css');
 require('./layout.module.css');
 var components_footer_Component = require('./Component.js');
 var styles = require('./desktop.module.css');
@@ -18,8 +19,11 @@ var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
 var FooterDesktop = function (_a) {
-    var size = _a.size, className = _a.className, fullscreen = _a.fullscreen, restProps = tslib_es6.__rest(_a, ["size", "className", "fullscreen"]);
-    return (React__default['default'].createElement(components_footer_Component.Footer, tslib_es6.__assign({ className: cn__default['default'](className, size && styles__default['default'][size], fullscreen && styles__default['default'].fullscreen), styles: styles__default['default'] }, restProps)));
+    var _b;
+    var size = _a.size, className = _a.className, sticky = _a.sticky, restProps = tslib_es6.__rest(_a, ["size", "className", "sticky"]);
+    return (React__default['default'].createElement(components_footer_Component.Footer, tslib_es6.__assign({ className: cn__default['default'](className, styles__default['default'].footer, size && styles__default['default'][size], (_b = {},
+            _b[styles__default['default'].sticky] = sticky,
+            _b)), sticky: sticky }, restProps)));
 };
 
 exports.FooterDesktop = FooterDesktop;

package/dist/cssm/components/footer/Component.js

@@ -6,24 +6,26 @@ var React = require('react');
 var cn = require('classnames');
 require('@alfalab/core-components-base-modal/dist/cssm');
 var Context = require('../../Context.js');
+var styles = require('./index.module.css');
 var layoutStyles = require('./layout.module.css');
 
 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 styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 var layoutStyles__default = /*#__PURE__*/_interopDefaultLegacy(layoutStyles);
 
 var Footer = function (_a) {
     var _b;
-    var children = _a.children, className = _a.className, sticky = _a.sticky, _c = _a.layout, layout = _c === void 0 ? 'start' : _c, gap = _a.gap, styles = _a.styles;
+    var children = _a.children, className = _a.className, sticky = _a.sticky, _c = _a.layout, layout = _c === void 0 ? 'start' : _c, gap = _a.gap;
     var _d = React.useContext(Context.ModalContext), footerHighlighted = _d.footerHighlighted, setHasFooter = _d.setHasFooter;
     React.useEffect(function () {
         setHasFooter(true);
     }, [setHasFooter]);
-    return (React__default['default'].createElement("div", { className: cn__default['default'](styles.footer, className, layoutStyles__default['default'][layout], gap && layoutStyles__default['default']["gap-" + gap], (_b = {},
-            _b[styles.highlighted] = sticky && footerHighlighted,
-            _b[styles.sticky] = sticky,
+    return (React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].footer, className, layoutStyles__default['default'][layout], gap && layoutStyles__default['default']["gap-" + gap], (_b = {},
+            _b[styles__default['default'].highlighted] = sticky && footerHighlighted,
+            _b[styles__default['default'].sticky] = sticky,
             _b)) }, children));
 };
 

package/dist/cssm/components/footer/Component.mobile.js

@@ -4,9 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib_es6 = require('../../tslib.es6-ce870b46.js');
 var React = require('react');
-require('classnames');
+var cn = require('classnames');
 require('@alfalab/core-components-base-modal/dist/cssm');
 require('../../Context.js');
+require('./index.module.css');
 require('./layout.module.css');
 var components_footer_Component = require('./Component.js');
 var styles = require('./mobile.module.css');
@@ -14,8 +15,15 @@ var styles = require('./mobile.module.css');
 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 styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 
-var FooterMobile = function (props) { return React__default['default'].createElement(components_footer_Component.Footer, tslib_es6.__assign({ styles: styles__default['default'] }, props)); };
+var FooterMobile = function (_a) {
+    var _b;
+    var className = _a.className, sticky = _a.sticky, restProps = tslib_es6.__rest(_a, ["className", "sticky"]);
+    return (React__default['default'].createElement(components_footer_Component.Footer, tslib_es6.__assign({ className: cn__default['default'](className, styles__default['default'].footer, (_b = {},
+            _b[styles__default['default'].sticky] = sticky,
+            _b)), sticky: sticky }, restProps)));
+};
 
 exports.FooterMobile = FooterMobile;