@alfalab/core-components-modal 6.0.10 → 6.0.12

package/cssm/desktop.js

@@ -4,29 +4,33 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 require('./tslib.es6-9682e485.js');
 require('react');
-require('react-merge-refs');
 require('classnames');
-require('@alfalab/core-components-base-modal/cssm');
 require('@alfalab/core-components-icon-button/cssm');
 require('@alfalab/icons-glyph/CrossHeavyMIcon');
+require('@alfalab/core-components-base-modal/cssm');
 require('./Context.js');
 require('./components/closer/index.module.css');
 require('./components/closer/Component.js');
+require('./ResponsiveContext.js');
+require('./components/content/desktop.module.css');
 require('./components/content/index.module.css');
+require('./components/content/mobile.module.css');
 require('./components/content/Component.js');
-require('./components/content/desktop.module.css');
-require('./components/content/Component.desktop.js');
+require('./components/footer/desktop.module.css');
 require('./components/footer/index.module.css');
 require('./components/footer/layout.module.css');
+require('./components/footer/mobile.module.css');
 require('./components/footer/Component.js');
-require('./components/footer/desktop.module.css');
-require('./components/footer/Component.desktop.js');
-require('./Component-5fe52731.js');
-require('./components/header/index.module.css');
+require('@alfalab/icons-glyph/CrossMIcon');
+require('./components/header/Component.js');
 require('./components/header/desktop.module.css');
-require('./components/header/Component.desktop.js');
+require('./components/header/index.module.css');
+require('./components/header/mobile.module.css');
+require('react-merge-refs');
 require('./desktop.module.css');
+require('./mobile.module.css');
 require('./transitions.module.css');
+require('./Component.js');
 var Component_desktop = require('./Component.desktop.js');
 
 

package/cssm/index.d.ts

@@ -1,2 +1,3 @@
 export * from "./responsive";
 export * from "./Context";
+export * from "./typings";

package/cssm/index.js

@@ -4,39 +4,33 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 require('./tslib.es6-9682e485.js');
 require('react');
-require('react-merge-refs');
 require('classnames');
-require('@alfalab/core-components-base-modal/cssm');
 require('@alfalab/core-components-icon-button/cssm');
 require('@alfalab/icons-glyph/CrossHeavyMIcon');
+require('@alfalab/core-components-base-modal/cssm');
 var Context = require('./Context.js');
 require('./components/closer/index.module.css');
 require('./components/closer/Component.js');
+require('./ResponsiveContext.js');
+require('./components/content/desktop.module.css');
 require('./components/content/index.module.css');
+require('./components/content/mobile.module.css');
 require('./components/content/Component.js');
-require('./components/content/desktop.module.css');
-require('./components/content/Component.desktop.js');
+require('./components/footer/desktop.module.css');
 require('./components/footer/index.module.css');
 require('./components/footer/layout.module.css');
-require('./components/footer/Component.js');
-require('./components/footer/desktop.module.css');
-require('./components/footer/Component.desktop.js');
-require('./Component-5fe52731.js');
-require('./components/header/index.module.css');
-require('./components/header/desktop.module.css');
-require('./components/header/Component.desktop.js');
-require('./desktop.module.css');
-require('./transitions.module.css');
-require('./Component.desktop.js');
-require('./components/content/mobile.module.css');
-require('./components/content/Component.mobile.js');
 require('./components/footer/mobile.module.css');
-require('./components/footer/Component.mobile.js');
+require('./components/footer/Component.js');
 require('@alfalab/icons-glyph/CrossMIcon');
+require('./components/header/Component.js');
+require('./components/header/desktop.module.css');
+require('./components/header/index.module.css');
 require('./components/header/mobile.module.css');
-require('./components/header/Component.mobile.js');
+require('react-merge-refs');
+require('./desktop.module.css');
 require('./mobile.module.css');
-require('./Component.mobile.js');
+require('./transitions.module.css');
+require('./Component.js');
 require('@alfalab/hooks');
 var Component_responsive = require('./Component.responsive.js');
 

package/cssm/mobile.js

@@ -5,28 +5,32 @@ Object.defineProperty(exports, '__esModule', { value: true });
 require('./tslib.es6-9682e485.js');
 require('react');
 require('classnames');
-require('@alfalab/core-components-base-modal/cssm');
 require('@alfalab/core-components-icon-button/cssm');
 require('@alfalab/icons-glyph/CrossHeavyMIcon');
+require('@alfalab/core-components-base-modal/cssm');
 require('./Context.js');
 require('./components/closer/index.module.css');
 require('./components/closer/Component.js');
+require('./ResponsiveContext.js');
+require('./components/content/desktop.module.css');
 require('./components/content/index.module.css');
+require('./components/content/mobile.module.css');
 require('./components/content/Component.js');
+require('./components/footer/desktop.module.css');
 require('./components/footer/index.module.css');
 require('./components/footer/layout.module.css');
-require('./components/footer/Component.js');
-require('./Component-5fe52731.js');
-require('./components/header/index.module.css');
-require('./transitions.module.css');
-require('./components/content/mobile.module.css');
-require('./components/content/Component.mobile.js');
 require('./components/footer/mobile.module.css');
-require('./components/footer/Component.mobile.js');
+require('./components/footer/Component.js');
 require('@alfalab/icons-glyph/CrossMIcon');
+require('./components/header/Component.js');
+require('./components/header/desktop.module.css');
+require('./components/header/index.module.css');
 require('./components/header/mobile.module.css');
-require('./components/header/Component.mobile.js');
+require('react-merge-refs');
+require('./desktop.module.css');
 require('./mobile.module.css');
+require('./transitions.module.css');
+require('./Component.js');
 var Component_mobile = require('./Component.mobile.js');
 
 

package/cssm/responsive.js

@@ -4,39 +4,33 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 require('./tslib.es6-9682e485.js');
 require('react');
-require('react-merge-refs');
 require('classnames');
-require('@alfalab/core-components-base-modal/cssm');
 require('@alfalab/core-components-icon-button/cssm');
 require('@alfalab/icons-glyph/CrossHeavyMIcon');
+require('@alfalab/core-components-base-modal/cssm');
 require('./Context.js');
 require('./components/closer/index.module.css');
 require('./components/closer/Component.js');
+require('./ResponsiveContext.js');
+require('./components/content/desktop.module.css');
 require('./components/content/index.module.css');
+require('./components/content/mobile.module.css');
 require('./components/content/Component.js');
-require('./components/content/desktop.module.css');
-require('./components/content/Component.desktop.js');
+require('./components/footer/desktop.module.css');
 require('./components/footer/index.module.css');
 require('./components/footer/layout.module.css');
-require('./components/footer/Component.js');
-require('./components/footer/desktop.module.css');
-require('./components/footer/Component.desktop.js');
-require('./Component-5fe52731.js');
-require('./components/header/index.module.css');
-require('./components/header/desktop.module.css');
-require('./components/header/Component.desktop.js');
-require('./desktop.module.css');
-require('./transitions.module.css');
-require('./Component.desktop.js');
-require('./components/content/mobile.module.css');
-require('./components/content/Component.mobile.js');
 require('./components/footer/mobile.module.css');
-require('./components/footer/Component.mobile.js');
+require('./components/footer/Component.js');
 require('@alfalab/icons-glyph/CrossMIcon');
+require('./components/header/Component.js');
+require('./components/header/desktop.module.css');
+require('./components/header/index.module.css');
 require('./components/header/mobile.module.css');
-require('./components/header/Component.mobile.js');
+require('react-merge-refs');
+require('./desktop.module.css');
 require('./mobile.module.css');
-require('./Component.mobile.js');
+require('./transitions.module.css');
+require('./Component.js');
 require('@alfalab/hooks');
 var Component_responsive = require('./Component.responsive.js');
 

package/cssm/typings.d.ts

@@ -0,0 +1,52 @@
+import { ReactNode } from 'react';
+import { BaseModalProps } from "@alfalab/core-components-base-modal";
+type ModalDesktopProps = BaseModalProps & {
+    /**
+     * Ширина модального окна
+     * @default "m"
+     */
+    size?: 's' | 'm' | 'l' | 'xl' | 'fullscreen';
+    /**
+     * Растягивает модальное окно на весь экран
+     * @deprecated Используйте размер fullscreen
+     */
+    fullscreen?: boolean;
+    /**
+     * Фиксирует позицию модального окна после открытия,
+     * предотвращая скачки, если контент внутри будет меняться
+     */
+    fixedPosition?: boolean;
+    /**
+     * Управление наличием закрывающего крестика
+     * @default false
+     */
+    hasCloser?: boolean;
+};
+type ModalMobileProps = Omit<ModalDesktopProps, 'size' | 'fixedPosition' | 'fullscreen'>;
+type ModalResponsiveProps = ModalDesktopProps & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+};
+type View = 'desktop' | 'mobile';
+type TResponsiveModalContext = {
+    view: View;
+    size: NonNullable<ModalDesktopProps['size']>;
+};
+type ContentProps = {
+    /**
+     * Контент
+     */
+    children?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Растягивает контент на всю высоту
+     */
+    flex?: boolean;
+};
+export { ModalDesktopProps, ModalMobileProps, ModalResponsiveProps, View, TResponsiveModalContext, ContentProps };

package/cssm/typings.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/desktop.css

@@ -1,4 +1,4 @@
-/* hash: 1uv8g */
+/* hash: xss4d */
 :root {
 
     /* Hard */
@@ -31,32 +31,32 @@
 
     /* mobile */
 }
-.modal__wrapper_1lhqp {
+.modal__wrapper_1kgjw {
     padding-top: var(--modal-vertical-padding);
     padding-bottom: var(--modal-vertical-padding);
 }
-.modal__component_1lhqp {
+.modal__component_1kgjw {
     width: 100%;
     max-width: 100%;
     border-radius: var(--modal-border-radius);
 }
-.modal__fullscreen_1lhqp {
+.modal__fullscreen_1kgjw {
     padding-top: 0;
     padding-bottom: 0
 }
-.modal__fullscreen_1lhqp .modal__component_1lhqp {
+.modal__fullscreen_1kgjw .modal__component_1kgjw {
         flex: 1;
         border-radius: 0;
     }
-.modal__s_1lhqp {
+.modal__s_1kgjw {
     width: var(--modal-s-width);
 }
-.modal__m_1lhqp {
+.modal__m_1kgjw {
     width: var(--modal-m-width);
 }
-.modal__l_1lhqp {
+.modal__l_1kgjw {
     width: var(--modal-l-width);
 }
-.modal__xl_1lhqp {
+.modal__xl_1kgjw {
     width: var(--modal-xl-width);
 }

package/desktop.js

@@ -2,23 +2,22 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./tslib.es6-93e97f54.js');
+require('./tslib.es6-0c9325d7.js');
 require('react');
-require('react-merge-refs');
 require('classnames');
-require('@alfalab/core-components-base-modal');
 require('@alfalab/core-components-icon-button');
 require('@alfalab/icons-glyph/CrossHeavyMIcon');
+require('@alfalab/core-components-base-modal');
 require('./Context.js');
 require('./components/closer/Component.js');
+require('./ResponsiveContext.js');
 require('./components/content/Component.js');
-require('./components/content/Component.desktop.js');
 require('./components/footer/Component.js');
-require('./components/footer/Component.desktop.js');
-require('./Component-cacd0e72.js');
-require('./components/header/Component.desktop.js');
+require('@alfalab/icons-glyph/CrossMIcon');
+require('./components/header/Component.js');
+require('react-merge-refs');
+require('./Component.js');
 var Component_desktop = require('./Component.desktop.js');
-require('./transitions.module-fc7cacd3.js');
 
 
 

package/esm/Component.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+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;
+    fullscreen?: boolean | undefined;
+    fixedPosition?: boolean | undefined;
+    hasCloser?: boolean | undefined;
+} & {
+    view: View;
+} & React.RefAttributes<HTMLDivElement>>;
+export { Modal };

package/esm/Component.desktop.d.ts

@@ -1,53 +1,14 @@
 /// <reference types="react" />
 import React from 'react';
-import { BaseModalProps } from "@alfalab/core-components-base-modal";
-type ModalDesktopProps = BaseModalProps & {
-    /**
-     * Ширина модального окна
-     * @default "m"
-     */
-    size?: 's' | 'm' | 'l' | 'xl' | 'fullscreen';
-    /**
-     * Растягивает модальное окно на весь экран
-     * @deprecated Используйте размер fullscreen
-     */
-    fullscreen?: boolean;
-    /**
-     * Фиксирует позицию модального окна после открытия,
-     * предотвращая скачки, если контент внутри будет меняться
-     */
-    fixedPosition?: boolean;
-    /**
-     * Управление наличием закрывающего крестика
-     * @default false
-     */
-    hasCloser?: boolean;
-};
-declare const ModalDesktop: React.ForwardRefExoticComponent<BaseModalProps & {
-    /**
-     * Ширина модального окна
-     * @default "m"
-     */
+declare const ModalDesktop: React.ForwardRefExoticComponent<import("packages/base-modal/src").BaseModalProps & {
     size?: "s" | "m" | "l" | "xl" | "fullscreen" | undefined;
-    /**
-     * Растягивает модальное окно на весь экран
-     * @deprecated Используйте размер fullscreen
-     */
     fullscreen?: boolean | undefined;
-    /**
-     * Фиксирует позицию модального окна после открытия,
-     * предотвращая скачки, если контент внутри будет меняться
-     */
     fixedPosition?: boolean | undefined;
-    /**
-     * Управление наличием закрывающего крестика
-     * @default false
-     */
     hasCloser?: boolean | undefined;
 } & React.RefAttributes<HTMLDivElement>> & {
-    Content: React.FC<import("./components/content/Component.desktop").ContentDesktopProps>;
-    Header: React.FC<import("./components/header/Component.desktop").HeaderDesktopProps>;
-    Footer: React.FC<import("./components/footer/Component.desktop").FooterDesktopProps>;
+    Content: React.FC<import("./typings").ContentProps>;
+    Header: React.FC<import("./components/header/Component").HeaderProps>;
+    Footer: React.FC<import("./components/footer/Component").FooterProps>;
     Closer: React.FC<import("./components/closer/Component").CloserProps>;
 };
-export { ModalDesktopProps, ModalDesktop };
+export { ModalDesktop };

package/esm/Component.desktop.js

@@ -1,51 +1,24 @@
-import { _ as __rest, a as __assign } from './tslib.es6-cd2fa46f.js';
-import React, { forwardRef, useRef, useCallback, isValidElement, cloneElement } from 'react';
-import mergeRefs from 'react-merge-refs';
-import cn from 'classnames';
-import { BaseModal } from '@alfalab/core-components-base-modal/esm';
+import { _ as __assign } from './tslib.es6-056b72d0.js';
+import React, { forwardRef } from 'react';
+import 'classnames';
 import '@alfalab/core-components-icon-button/esm';
 import '@alfalab/icons-glyph/CrossHeavyMIcon';
+import '@alfalab/core-components-base-modal/esm';
 import './Context.js';
 import { Closer } from './components/closer/Component.js';
-import './components/content/Component.js';
-import { ContentDesktop } from './components/content/Component.desktop.js';
-import './components/footer/Component.js';
-import { FooterDesktop } from './components/footer/Component.desktop.js';
-import './Component-f9c8a7ff.js';
-import { HeaderDesktop } from './components/header/Component.desktop.js';
-import { t as transitions } from './transitions.module-a1e3a16d.js';
+import './ResponsiveContext.js';
+import { Content } from './components/content/Component.js';
+import { Footer } from './components/footer/Component.js';
+import '@alfalab/icons-glyph/CrossMIcon';
+import { Header } from './components/header/Component.js';
+import 'react-merge-refs';
+import { Modal } from './Component.js';
 
-var styles = {"wrapper":"modal__wrapper_1lhqp","component":"modal__component_1lhqp","fullscreen":"modal__fullscreen_1lhqp","s":"modal__s_1lhqp","m":"modal__m_1lhqp","l":"modal__l_1lhqp","xl":"modal__xl_1lhqp"};
-require('./desktop.css')
-
-var ModalDesktopComponent = 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 = __rest(_a, ["size", "fixedPosition", "fullscreen", "children", "className", "wrapperClassName", "transitionProps"]);
-    // TODO: удалить, после удаления пропсы fullscreen
-    var componentSize = fullscreen ? 'fullscreen' : size;
-    var modalRef = useRef(null);
-    var handleEntered = useCallback(function (node, isAppearing) {
-        if (fixedPosition && modalRef.current) {
-            var content = modalRef.current.querySelector("." + styles.component);
-            if (content) {
-                var marginTop = window.getComputedStyle(content).marginTop;
-                content.style.marginTop = marginTop;
-            }
-        }
-        if (transitionProps.onEntered) {
-            transitionProps.onEntered(node, isAppearing);
-        }
-    }, [fixedPosition, transitionProps]);
-    return (React.createElement(BaseModal, __assign({}, restProps, { ref: mergeRefs([ref, modalRef]), wrapperClassName: cn(styles.wrapper, wrapperClassName, (_b = {},
-            _b[styles.fullscreen] = componentSize === 'fullscreen',
-            _b)), className: cn(styles.component, className, styles[componentSize]), backdropProps: __assign({ invisible: componentSize === 'fullscreen' }, restProps.backdropProps), transitionProps: __assign(__assign({ classNames: transitions }, transitionProps), { onEntered: handleEntered }) }), React.Children.map(children, function (child) {
-        return isValidElement(child) ? cloneElement(child, { size: componentSize }) : child;
-    })));
-});
+var ModalDesktopComponent = forwardRef(function (props, ref) { return (React.createElement(Modal, __assign({}, props, { ref: ref, view: 'desktop' }))); });
 var ModalDesktop = Object.assign(ModalDesktopComponent, {
-    Content: ContentDesktop,
-    Header: HeaderDesktop,
-    Footer: FooterDesktop,
+    Content: Content,
+    Header: Header,
+    Footer: Footer,
     Closer: Closer,
 });
 

package/esm/Component.js

@@ -0,0 +1,55 @@
+import { a as __rest, _ as __assign } from './tslib.es6-056b72d0.js';
+import React, { forwardRef, useRef, useMemo } from 'react';
+import cn from 'classnames';
+import { BaseModal } from '@alfalab/core-components-base-modal/esm';
+import { ResponsiveContext } from './ResponsiveContext.js';
+import mergeRefs from 'react-merge-refs';
+
+var desktopStyles = {"wrapper":"modal__wrapper_1kgjw","component":"modal__component_1kgjw","fullscreen":"modal__fullscreen_1kgjw","s":"modal__s_1kgjw","m":"modal__m_1kgjw","l":"modal__l_1kgjw","xl":"modal__xl_1kgjw"};
+require('./desktop.css')
+
+var mobileStyles = {"component":"modal__component_1po45"};
+require('./mobile.css')
+
+var transitions = {"appear":"modal__appear_5a8sg","enter":"modal__enter_5a8sg","appearActive":"modal__appearActive_5a8sg","enterActive":"modal__enterActive_5a8sg","exit":"modal__exit_5a8sg","exitActive":"modal__exitActive_5a8sg","exitDone":"modal__exitDone_5a8sg"};
+require('./transitions.css')
+
+var Modal = 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, view = _a.view, restProps = __rest(_a, ["size", "fixedPosition", "fullscreen", "children", "className", "wrapperClassName", "transitionProps", "view"]);
+    // TODO: удалить, после удаления пропсы fullscreen
+    var componentSize = fullscreen ? 'fullscreen' : size;
+    var modalRef = useRef(null);
+    var handleEntered = function (node, isAppearing) {
+        if (fixedPosition && modalRef.current) {
+            var content = modalRef.current.querySelector("." + desktopStyles.component);
+            if (content) {
+                var marginTop = window.getComputedStyle(content).marginTop;
+                content.style.marginTop = marginTop;
+            }
+        }
+        if (transitionProps.onEntered) {
+            transitionProps.onEntered(node, isAppearing);
+        }
+    };
+    var baseModalProps = view === 'desktop'
+        ? {
+            ref: mergeRefs([ref, modalRef]),
+            wrapperClassName: cn(desktopStyles.wrapper, wrapperClassName, (_b = {},
+                _b[desktopStyles.fullscreen] = componentSize === 'fullscreen',
+                _b)),
+            className: cn(desktopStyles.component, className, desktopStyles[componentSize]),
+            backdropProps: __assign({ invisible: componentSize === 'fullscreen' }, restProps.backdropProps),
+            transitionProps: __assign(__assign({ classNames: transitions }, transitionProps), { onEntered: handleEntered }),
+        }
+        : {
+            ref: ref,
+            transitionProps: __assign({ classNames: transitions }, transitionProps),
+            className: cn(className, mobileStyles.component),
+        };
+    var contextValue = useMemo(function () { return ({ size: componentSize, view: view }); }, [componentSize, view]);
+    return (React.createElement(ResponsiveContext.Provider, { value: contextValue },
+        React.createElement(BaseModal, __assign({}, restProps, baseModalProps), children)));
+});
+
+export { Modal };

package/esm/Component.mobile.d.ts

@@ -1,23 +1,10 @@
 /// <reference types="react" />
 import React from 'react';
-import { BaseModalProps } from "@alfalab/core-components-base-modal";
-type ModalMobileProps = BaseModalProps & {
-    /**
-     * Управление наличием закрывающего крестика
-     * @default false
-     */
-    hasCloser?: boolean;
-};
-declare const ModalMobile: React.ForwardRefExoticComponent<BaseModalProps & {
-    /**
-     * Управление наличием закрывающего крестика
-     * @default false
-     */
-    hasCloser?: boolean | undefined;
-} & React.RefAttributes<HTMLDivElement>> & {
-    Content: React.FC<import("./components/content/Component").ContentProps>;
-    Header: React.FC<import("./components/header/Component.mobile").HeaderMobileProps>;
+import { ModalMobileProps } from "./typings";
+declare const ModalMobile: React.ForwardRefExoticComponent<ModalMobileProps & React.RefAttributes<HTMLDivElement>> & {
+    Content: React.FC<import("./typings").ContentProps>;
+    Header: React.FC<import("./components/header/Component").HeaderProps>;
     Footer: React.FC<import("./components/footer/Component").FooterProps>;
     Closer: React.FC<import("./components/closer/Component").CloserProps>;
 };
-export { ModalMobileProps, ModalMobile };
+export { ModalMobile };

package/esm/Component.mobile.js

@@ -1,31 +1,24 @@
-import { _ as __rest, a as __assign } from './tslib.es6-cd2fa46f.js';
+import { _ as __assign } from './tslib.es6-056b72d0.js';
 import React, { forwardRef } from 'react';
-import cn from 'classnames';
-import { BaseModal } from '@alfalab/core-components-base-modal/esm';
+import 'classnames';
 import '@alfalab/core-components-icon-button/esm';
 import '@alfalab/icons-glyph/CrossHeavyMIcon';
+import '@alfalab/core-components-base-modal/esm';
 import './Context.js';
 import { Closer } from './components/closer/Component.js';
-import './components/content/Component.js';
-import './components/footer/Component.js';
-import './Component-f9c8a7ff.js';
-import { t as transitions } from './transitions.module-a1e3a16d.js';
-import { ContentMobile } from './components/content/Component.mobile.js';
-import { FooterMobile } from './components/footer/Component.mobile.js';
+import './ResponsiveContext.js';
+import { Content } from './components/content/Component.js';
+import { Footer } from './components/footer/Component.js';
 import '@alfalab/icons-glyph/CrossMIcon';
-import { HeaderMobile } from './components/header/Component.mobile.js';
+import { Header } from './components/header/Component.js';
+import 'react-merge-refs';
+import { Modal } from './Component.js';
 
-var styles = {"component":"modal__component_le65w"};
-require('./mobile.css')
-
-var ModalMobileComponent = forwardRef(function (_a, ref) {
-    var children = _a.children, className = _a.className, restProps = __rest(_a, ["children", "className"]);
-    return (React.createElement(BaseModal, __assign({}, restProps, { ref: ref, transitionProps: __assign({ classNames: transitions }, restProps.transitionProps), className: cn(className, styles.component) }), children));
-});
+var ModalMobileComponent = forwardRef(function (props, ref) { return (React.createElement(Modal, __assign({}, props, { ref: ref, view: 'mobile' }))); });
 var ModalMobile = Object.assign(ModalMobileComponent, {
-    Content: ContentMobile,
-    Header: HeaderMobile,
-    Footer: FooterMobile,
+    Content: Content,
+    Header: Header,
+    Footer: Footer,
     Closer: Closer,
 });