@alfalab/core-components 48.9.0-beta.0 → 48.9.0-beta.2

package/universal-modal/moderncssm/desktop/hooks/useModalWidth.js

@@ -0,0 +1,37 @@
+import { useContext, useEffect } from 'react';
+import { isClient } from '../../../../shared/moderncssm';
+import { ResponsiveContext } from '../../ResponsiveContext.js';
+
+/** Устанавливает необходимую ширину модального окна */
+const useModalWidth = (width, open, componentRef) => {
+    const ref = componentRef;
+    const context = useContext(ResponsiveContext);
+    const { setModalWidth } = context || {};
+    useEffect(() => {
+        if (ref.current) {
+            let viewportWidth = 0;
+            let computedMarginLeft = 0;
+            let computedMarginRight = 0;
+            if (isClient()) {
+                viewportWidth = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
+                computedMarginLeft = parseFloat(window.getComputedStyle(ref.current).marginLeft);
+                computedMarginRight = parseFloat(window.getComputedStyle(ref.current).marginRight);
+            }
+            if (width > viewportWidth || width === 'fullWidth') {
+                ref.current.style.width = `calc(100% - ${computedMarginLeft}px - ${computedMarginRight}px)`;
+                if (setModalWidth) {
+                    setModalWidth(viewportWidth - computedMarginLeft - computedMarginRight);
+                }
+                return;
+            }
+            if (!Number.isNaN(parseFloat(String(width)))) {
+                ref.current.style.width = `${parseFloat(String(width))}px`;
+                if (setModalWidth) {
+                    setModalWidth(width);
+                }
+            }
+        }
+    }, [open, width, ref, setModalWidth, context]);
+};
+
+export { useModalWidth };

package/universal-modal/moderncssm/desktop/index.d.ts

@@ -0,0 +1,12 @@
+export { UniversalModalDesktop, UniversalModalDesktopComponent } from "./Component.desktop";
+export type { UniversalModalDesktopProps } from "./types/props";
+export { HeaderDesktop } from "../components/header/index";
+export type { HeaderDesktopProps } from "../components/header/index";
+export { FooterDesktop } from "../components/footer/index";
+export type { FooterDesktopProps } from "../components/footer/index";
+export { ContentDesktop } from "../components/content/index";
+export type { ContentDesktopProps } from "../components/content/index";
+export { ControlsDesktop } from "../components/controls/index";
+export type { ControlsDesktopProps } from "../components/controls/index";
+export { CrossButtonDesktop } from "./components/buttons/cross-button/index";
+export { ArrowButtonDesktop } from "./components/buttons/arrow-button/index";

package/universal-modal/moderncssm/desktop/index.js

@@ -0,0 +1,49 @@
+export { UniversalModalDesktop, UniversalModalDesktopComponent } from './Component.desktop.js';
+import 'react';
+import '../../../mq/moderncssm';
+export { HeaderDesktop } from '../components/header/desktop/Component.desktop.js';
+import 'classnames';
+import '../../../navigation-bar-private/moderncssm';
+import '../../../base-modal/moderncssm';
+import '../components/header/base-header/index.module.css';
+import '../components/header/mobile/mobile.module.css';
+export { FooterDesktop } from '../components/footer/desktop/Component.desktop.js';
+import '../components/footer/base-footer/index.module.css';
+import '../components/footer/mobile/layout.mobile.module.css';
+import '../components/footer/mobile/mobile.module.css';
+export { ContentDesktop } from '../components/content/desktop/Component.desktop.js';
+import '../components/content/base-content/index.module.css';
+import '../components/content/mobile/mobile.module.css';
+export { ControlsDesktop } from '../components/controls/desktop/Component.desktop.js';
+import '../components/footer/desktop/layout.module.css';
+import '../components/controls/base-controls/index.module.css';
+export { CrossButtonDesktop } from './components/buttons/cross-button/cross-button.js';
+export { ArrowButtonDesktop } from './components/buttons/arrow-button/arrow-button.js';
+import '../ResponsiveContext.js';
+import './components/center-modal/center-modal.js';
+import '../../../shared/moderncssm';
+import './hooks/useModalHeight.js';
+import './hooks/useModalMargin.js';
+import './hooks/useModalWheel.js';
+import './hooks/useModalWidth.js';
+import './components/base-universal-modal-content/base-universal-modal-content.js';
+import '../../../scrollbar/moderncssm';
+import './const/index.js';
+import './components/base-universal-modal-content/base-universal-modal-content.module.css';
+import './components/center-modal/center-modal.module.css';
+import './components/center-modal/safari-transitions.module.css';
+import './components/center-modal/transitions.module.css';
+import './components/side-modal/side-modal.js';
+import '../utils/getMarginValues.js';
+import './components/side-modal/side-modal.module.css';
+import '../components/content/base-content/base-content.js';
+import '../Context.js';
+import '../components/footer/base-footer/base-footer.js';
+import '../components/footer/desktop/desktop.module.css';
+import '../components/header/desktop/desktop.module.css';
+import '../../../button/moderncssm/desktop';
+import '@alfalab/icons-glyph/CrossMediumMIcon';
+import './components/buttons/cross-button/cross-button.module.css';
+import '../../../typography/moderncssm';
+import '@alfalab/icons-glyph/ArrowLeftMediumMIcon';
+import './components/buttons/arrow-button/arrow-button.module.css';

package/universal-modal/moderncssm/desktop/types/props.d.ts

@@ -0,0 +1,46 @@
+import { BaseModalProps } from "../../../../base-modal";
+import { TMargin } from "../../typings/margin-type";
+type BaseUniversalModalProps = {
+    /**
+     * Расположение по горизонтали и сторона с которой модал “выезжает” при открытии
+     * @default center
+     */
+    horizontalAlign?: 'start' | 'center' | 'end';
+    /**
+     * Расположение модального окна по вертикали
+     * @default center
+     */
+    verticalAlign?: 'top' | 'center' | 'bottom';
+    /**
+     * Ширина модального окна
+     * fullWidth - ширина модального окна подстроится под viewport
+     * minWidth - 500
+     * @default 500
+     */
+    width?: number | 'fullWidth';
+    /**
+     * Высота модального окна
+     * fullHeight - высота модального окна подстроится под viewport
+     * minHeight - 264
+     * @default fullHeight
+     */
+    height?: number | 'fullHeight';
+    /**
+     * Наличие оверлея
+     * @default true
+     */
+    overlay?: boolean;
+    /**
+     * Устанавливает отступы модального окна
+     * По умолчанию для бокового модала 0px, для центрального auto
+     */
+    margin?: TMargin;
+    /**
+     * Хэндлер закрытия модалки
+     */
+    onClose?: () => void;
+};
+type UniversalModalDesktopProps = BaseUniversalModalProps & Pick<BaseModalProps, 'children' | 'dataTestId' | 'open' | 'className' | 'wrapperClassName' | 'onUnmount' | 'transitionProps'>;
+type ModalBySideProps = UniversalModalDesktopProps;
+type ModalByCenterProps = UniversalModalDesktopProps;
+export { BaseUniversalModalProps, UniversalModalDesktopProps, ModalBySideProps, ModalByCenterProps };

package/universal-modal/moderncssm/desktop/types/props.js

@@ -0,0 +1 @@
+

package/universal-modal/moderncssm/desktop/vars.css

@@ -0,0 +1,2 @@
+/* */
+

package/universal-modal/moderncssm/index.d.ts

@@ -0,0 +1,10 @@
+export { UniversalModalResponsive, UniversalModal } from "./Component.responsive";
+export type { UniversalModalResponsiveProps } from "./typings/index";
+export { ContentResponsive } from "./components/content/index";
+export type { ContentResponsiveProps } from "./components/content/index";
+export { ControlsResponsive } from "./components/controls/index";
+export type { ControlsResponsiveProps } from "./components/controls/index";
+export { HeaderResponsive } from "./components/header/index";
+export type { HeaderResponsiveProps } from "./components/header/index";
+export { FooterResponsive } from "./components/footer/index";
+export type { FooterResponsiveProps } from "./components/footer/index";

package/universal-modal/moderncssm/index.js

@@ -0,0 +1,65 @@
+export { UniversalModal, UniversalModalResponsive } from './Component.responsive.js';
+export { ContentResponsive } from './components/content/responsive/Component.responsive.js';
+import 'react';
+import 'classnames';
+import '../../base-modal/moderncssm';
+import './components/content/base-content/index.module.css';
+import './components/content/mobile/mobile.module.css';
+export { ControlsResponsive } from './components/controls/responsive/Component.responsive.js';
+import './components/footer/desktop/layout.module.css';
+import './components/controls/base-controls/index.module.css';
+export { HeaderResponsive } from './components/header/responsive/Component.responsive.js';
+import '../../navigation-bar-private/moderncssm';
+import './ResponsiveContext.js';
+import './components/header/base-header/index.module.css';
+import './components/header/desktop/desktop.module.css';
+import './components/header/mobile/mobile.module.css';
+export { FooterResponsive } from './components/footer/responsive/Component.responsive.js';
+import './components/footer/base-footer/index.module.css';
+import './components/footer/desktop/desktop.module.css';
+import './components/footer/mobile/layout.mobile.module.css';
+import './components/footer/mobile/mobile.module.css';
+import '../../mq/moderncssm';
+import './desktop/Component.desktop.js';
+import './components/content/desktop/Component.desktop.js';
+import './components/content/base-content/base-content.js';
+import './Context.js';
+import './components/controls/desktop/Component.desktop.js';
+import './components/footer/desktop/Component.desktop.js';
+import './desktop/const/index.js';
+import './components/footer/base-footer/base-footer.js';
+import './components/header/desktop/Component.desktop.js';
+import './desktop/components/center-modal/center-modal.js';
+import '../../shared/moderncssm';
+import './desktop/hooks/useModalHeight.js';
+import './desktop/hooks/useModalMargin.js';
+import './desktop/hooks/useModalWheel.js';
+import './desktop/hooks/useModalWidth.js';
+import './desktop/components/base-universal-modal-content/base-universal-modal-content.js';
+import '../../scrollbar/moderncssm';
+import './desktop/components/base-universal-modal-content/base-universal-modal-content.module.css';
+import './desktop/components/center-modal/center-modal.module.css';
+import './desktop/components/center-modal/safari-transitions.module.css';
+import './desktop/components/center-modal/transitions.module.css';
+import './desktop/components/side-modal/side-modal.js';
+import './utils/getMarginValues.js';
+import './desktop/components/side-modal/side-modal.module.css';
+import '../../button/moderncssm/desktop';
+import '@alfalab/icons-glyph/CrossMediumMIcon';
+import './desktop/components/buttons/cross-button/cross-button.module.css';
+import '../../typography/moderncssm';
+import '@alfalab/icons-glyph/ArrowLeftMediumMIcon';
+import './desktop/components/buttons/arrow-button/arrow-button.module.css';
+import './mobile/Component.mobile.js';
+import './components/content/mobile/Component.mobile.js';
+import './components/controls/mobile/Component.mobile.js';
+import './components/footer/mobile/Component.mobile.js';
+import './components/header/mobile/Component.mobile.js';
+import './mobile/mobile.module.css';
+import './mobile/transitions/right-side-transitions.mobile.module.css';
+import './mobile/transitions/transitions.mobile.module.css';
+import '../../button/moderncssm/mobile';
+import '@alfalab/icons-glyph/CrossMIcon';
+import './mobile/components/buttons/cross-button/cross-button.module.css';
+import '@alfalab/icons-glyph/ChevronLeftMIcon';
+import './mobile/components/buttons/arrow-button/arrow-button.module.css';

package/universal-modal/moderncssm/mobile/Component.mobile.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import React from 'react';
+declare const UniversalModalMobileComponent: React.ForwardRefExoticComponent<import("./types/props").BaseUniversalModalMobileProps & Pick<import("../../../base-modal").BaseModalProps, "children" | "className" | "open" | "dataTestId" | "wrapperClassName" | "transitionProps" | "onUnmount"> & React.RefAttributes<HTMLDivElement>>;
+declare const UniversalModalMobile: React.ForwardRefExoticComponent<import("./types/props").BaseUniversalModalMobileProps & Pick<import("../../../base-modal").BaseModalProps, "children" | "className" | "open" | "dataTestId" | "wrapperClassName" | "transitionProps" | "onUnmount"> & React.RefAttributes<HTMLDivElement>> & {
+    Header: React.FC<import("../components/header/index").HeaderMobileProps>;
+    Content: React.FC<import("../components/content/base-content/base-content").ContentProps>;
+    Footer: React.FC<import("../components/footer/base-footer/base-footer").FooterProps>;
+    Controls: React.FC<import("../components/controls/index").ControlsMobileProps>;
+};
+export { UniversalModalMobileComponent, UniversalModalMobile };

package/universal-modal/moderncssm/mobile/Component.mobile.js

@@ -0,0 +1,40 @@
+import React, { forwardRef } from 'react';
+import cn from 'classnames';
+import { BaseModal } from '../../../base-modal/moderncssm';
+import '../../../mq/moderncssm';
+import '../components/content/base-content/index.module.css';
+import { ContentMobile } from '../components/content/mobile/Component.mobile.js';
+import '../components/footer/desktop/layout.module.css';
+import '../components/controls/base-controls/index.module.css';
+import { ControlsMobile } from '../components/controls/mobile/Component.mobile.js';
+import '../ResponsiveContext.js';
+import '../components/footer/base-footer/index.module.css';
+import '../components/footer/desktop/desktop.module.css';
+import { FooterMobile } from '../components/footer/mobile/Component.mobile.js';
+import '../../../navigation-bar-private/moderncssm';
+import '../components/header/base-header/index.module.css';
+import '../components/header/desktop/desktop.module.css';
+import { HeaderMobile } from '../components/header/mobile/Component.mobile.js';
+import styles from './mobile.module.css';
+import rightSideTransitions from './transitions/right-side-transitions.mobile.module.css';
+import transitions from './transitions/transitions.mobile.module.css';
+import '../components/content/base-content/base-content.js';
+import '../Context.js';
+import '../components/content/mobile/mobile.module.css';
+import '../components/footer/base-footer/base-footer.js';
+import '../components/footer/mobile/layout.mobile.module.css';
+import '../components/footer/mobile/mobile.module.css';
+import '../components/header/mobile/mobile.module.css';
+
+const UniversalModalMobileComponent = forwardRef(({ children, className, dataTestId, onClose, appearance = 'bottom', ...restProps }, ref) => (React.createElement(BaseModal, { ...restProps, dataTestId: dataTestId, ref: ref, transitionProps: {
+        timeout: appearance === 'right' ? 360 : 200,
+        classNames: appearance === 'right' ? rightSideTransitions : transitions,
+    }, className: cn(className, styles.component), scrollHandler: 'content', contentClassName: styles.content }, children)));
+const UniversalModalMobile = Object.assign(UniversalModalMobileComponent, {
+    Header: HeaderMobile,
+    Content: ContentMobile,
+    Footer: FooterMobile,
+    Controls: ControlsMobile,
+});
+
+export { UniversalModalMobile, UniversalModalMobileComponent };

package/universal-modal/moderncssm/mobile/components/buttons/arrow-button/arrow-button.d.ts

@@ -0,0 +1,6 @@
+import { FC, MouseEvent } from 'react';
+type ArrowButtonDesktopProps = {
+    onClick?: (e: MouseEvent) => void;
+};
+declare const ArrowButtonMobile: FC<ArrowButtonDesktopProps>;
+export { ArrowButtonMobile };

package/universal-modal/moderncssm/mobile/components/buttons/arrow-button/arrow-button.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { ButtonMobile } from '../../../../../../button/moderncssm/mobile';
+import { ChevronLeftMIcon } from '@alfalab/icons-glyph/ChevronLeftMIcon';
+import styles from './arrow-button.module.css';
+
+const ArrowButtonMobile = (props) => {
+    const { onClick } = props;
+    return (React.createElement(ButtonMobile, { shape: 'rounded', size: 32, leftAddons: React.createElement(ChevronLeftMIcon, { className: styles.icon }), className: styles.button, onClick: onClick }));
+};
+
+export { ArrowButtonMobile };

package/universal-modal/moderncssm/mobile/components/buttons/arrow-button/arrow-button.module.css

@@ -0,0 +1,11 @@
+/* */
+
+.button.button {
+    padding: 0 7px;
+    width: 24px;
+    height: 24px;
+}
+
+.icon {
+    fill: var(--color-light-neutral-translucent-700);
+}

package/universal-modal/moderncssm/mobile/components/buttons/arrow-button/index.d.ts

@@ -0,0 +1 @@
+export { ArrowButtonMobile } from "./arrow-button";

package/universal-modal/moderncssm/mobile/components/buttons/arrow-button/index.js

@@ -0,0 +1,5 @@
+export { ArrowButtonMobile } from './arrow-button.js';
+import 'react';
+import '../../../../../../button/moderncssm/mobile';
+import '@alfalab/icons-glyph/ChevronLeftMIcon';
+import './arrow-button.module.css';

package/universal-modal/moderncssm/mobile/components/buttons/cross-button/cross-button.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+type CrossButtonProps = {
+    onClick?: () => void;
+};
+declare const CrossButtonMobile: FC<CrossButtonProps>;
+export { CrossButtonMobile };

package/universal-modal/moderncssm/mobile/components/buttons/cross-button/cross-button.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { ButtonMobile } from '../../../../../../button/moderncssm/mobile';
+import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
+import styles from './cross-button.module.css';
+
+const CrossButtonMobile = (props) => {
+    const { onClick } = props;
+    return (React.createElement(ButtonMobile, { leftAddons: React.createElement(CrossMIcon, { className: styles.icon }), size: 32, shape: 'rounded', className: styles.button, onClick: onClick }));
+};
+
+export { CrossButtonMobile };

package/universal-modal/moderncssm/mobile/components/buttons/cross-button/cross-button.module.css

@@ -0,0 +1,11 @@
+/* */
+
+.button.button {
+    padding: 0 7px;
+    width: 24px;
+    height: 24px;
+}
+
+.icon {
+    fill: var(--color-light-neutral-translucent-700);
+}

package/universal-modal/moderncssm/mobile/components/buttons/cross-button/index.d.ts

@@ -0,0 +1 @@
+export { CrossButtonMobile } from "./cross-button";

package/universal-modal/moderncssm/mobile/components/buttons/cross-button/index.js

@@ -0,0 +1,5 @@
+export { CrossButtonMobile } from './cross-button.js';
+import 'react';
+import '../../../../../../button/moderncssm/mobile';
+import '@alfalab/icons-glyph/CrossMIcon';
+import './cross-button.module.css';

package/universal-modal/moderncssm/mobile/index.d.ts

@@ -0,0 +1,12 @@
+export { UniversalModalMobile, UniversalModalMobileComponent } from "./Component.mobile";
+export type { UniversalModalMobileProps } from "./types/props";
+export { HeaderMobile } from "../components/header/index";
+export type { HeaderMobileProps } from "../components/header/index";
+export { FooterMobile } from "../components/footer/index";
+export type { FooterMobileProps } from "../components/footer/index";
+export { ContentMobile } from "../components/content/index";
+export type { ContentMobileProps } from "../components/content/index";
+export { ControlsMobile } from "../components/controls/index";
+export type { ControlsMobileProps } from "../components/controls/index";
+export { CrossButtonMobile } from "./components/buttons/cross-button/index";
+export { ArrowButtonMobile } from "./components/buttons/arrow-button/index";

package/universal-modal/moderncssm/mobile/index.js

@@ -0,0 +1,35 @@
+export { UniversalModalMobile, UniversalModalMobileComponent } from './Component.mobile.js';
+import 'react';
+import '../../../mq/moderncssm';
+import 'classnames';
+import '../../../navigation-bar-private/moderncssm';
+import '../../../base-modal/moderncssm';
+import '../ResponsiveContext.js';
+import '../components/header/base-header/index.module.css';
+import '../components/header/desktop/desktop.module.css';
+export { HeaderMobile } from '../components/header/mobile/Component.mobile.js';
+import '../components/footer/base-footer/index.module.css';
+import '../components/footer/desktop/desktop.module.css';
+import '../components/footer/desktop/layout.module.css';
+export { FooterMobile } from '../components/footer/mobile/Component.mobile.js';
+import '../components/content/base-content/index.module.css';
+export { ContentMobile } from '../components/content/mobile/Component.mobile.js';
+import '../components/controls/base-controls/index.module.css';
+export { ControlsMobile } from '../components/controls/mobile/Component.mobile.js';
+export { CrossButtonMobile } from './components/buttons/cross-button/cross-button.js';
+export { ArrowButtonMobile } from './components/buttons/arrow-button/arrow-button.js';
+import './mobile.module.css';
+import './transitions/right-side-transitions.mobile.module.css';
+import './transitions/transitions.mobile.module.css';
+import '../components/content/base-content/base-content.js';
+import '../Context.js';
+import '../components/content/mobile/mobile.module.css';
+import '../components/footer/base-footer/base-footer.js';
+import '../components/footer/mobile/layout.mobile.module.css';
+import '../components/footer/mobile/mobile.module.css';
+import '../components/header/mobile/mobile.module.css';
+import '../../../button/moderncssm/mobile';
+import '@alfalab/icons-glyph/CrossMIcon';
+import './components/buttons/cross-button/cross-button.module.css';
+import '@alfalab/icons-glyph/ChevronLeftMIcon';
+import './components/buttons/arrow-button/arrow-button.module.css';

package/universal-modal/moderncssm/mobile/mobile.module.css

@@ -0,0 +1,21 @@
+/* */
+
+.component {
+    top: var(--gap-0);
+    height: 100%;
+    width: 100%;
+    overflow-x: hidden;
+    overflow-y: auto;
+    max-width: 600px;
+    display: flex;
+    flex-direction: column
+}
+
+.component .content {
+        height: auto;
+    }
+
+.component.component {
+    position: fixed;
+    flex: 1;
+}

package/universal-modal/moderncssm/mobile/transitions/right-side-transitions.mobile.module.css

@@ -0,0 +1,23 @@
+/* */
+
+.appear,
+.enter {
+    transform: translateX(100%);
+}
+
+.appearActive,
+.enterActive {
+    transform: translateX(0);
+    transition: transform 280ms ease-in-out;
+    transition-delay: 80ms;
+}
+
+.exit {
+    transform: translateX(0);
+}
+
+.exitActive,
+.exitDone {
+    transform: translateX(100%);
+    transition: transform 280ms ease-in-out;
+}

package/universal-modal/moderncssm/mobile/transitions/transitions.mobile.module.css

@@ -0,0 +1,24 @@
+.appear,
+.enter {
+    opacity: 0;
+    transform: translateY(15px);
+}
+
+.appearActive,
+.enterActive {
+    opacity: 1;
+    transform: translateY(0);
+    transition: opacity 200ms ease-in, transform 200ms ease-in;
+}
+
+.exit {
+    opacity: 1;
+    transform: translateY(0);
+}
+
+.exitActive,
+.exitDone {
+    opacity: 0;
+    transform: translateY(15px);
+    transition: opacity 200ms ease-out, transform 200ms ease-out;
+}

package/universal-modal/moderncssm/mobile/types/props.d.ts

@@ -0,0 +1,11 @@
+import { BaseModalProps } from "../../../../base-modal";
+type BaseUniversalModalMobileProps = {
+    /**
+     * Хэндлер закрытия модалки
+     */
+    onClose?: () => void;
+    /** Сторона с которой будет появляться модальное окно */
+    appearance?: 'bottom' | 'right';
+};
+type UniversalModalMobileProps = BaseUniversalModalMobileProps & Pick<BaseModalProps, 'children' | 'dataTestId' | 'open' | 'className' | 'wrapperClassName' | 'onUnmount' | 'transitionProps'>;
+export { BaseUniversalModalMobileProps, UniversalModalMobileProps };

package/universal-modal/moderncssm/mobile/types/props.js

@@ -0,0 +1 @@
+

package/universal-modal/moderncssm/mobile/vars.css

@@ -0,0 +1,2 @@
+/* */
+

package/universal-modal/moderncssm/shared/index.d.ts

@@ -0,0 +1,2 @@
+export { ModalContext } from "../Context";
+export { getUniversalModalTestIds } from "../utils/getUniversalModalTestIds";

package/universal-modal/moderncssm/shared/index.js

@@ -0,0 +1,4 @@
+export { ModalContext } from '../Context.js';
+export { getUniversalModalTestIds } from '../utils/getUniversalModalTestIds.js';
+import '../../../base-modal/moderncssm';
+import '../../../shared/moderncssm';

package/universal-modal/moderncssm/typings/index.d.ts

@@ -0,0 +1,22 @@
+import { UniversalModalDesktopProps } from "../desktop/types/props";
+import { UniversalModalMobileProps } from "../mobile/types/props";
+type TResponsiveModalContext = {
+    modalWidth?: number;
+    modalHeaderHighlighted?: boolean;
+    modalFooterHighlighted?: boolean;
+    setModalWidth?: (width: number) => void;
+    setModalHeaderHighlighted?: (value: boolean) => void;
+    setModalFooterHighlighted?: (value: boolean) => void;
+} | null;
+type UniversalModalResponsiveProps = UniversalModalDesktopProps & UniversalModalMobileProps & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+    /**
+     * Значение по-умолчанию для хука useMatchMedia
+     */
+    defaultMatchMediaValue?: boolean | (() => boolean);
+};
+export { TResponsiveModalContext, UniversalModalResponsiveProps };

package/universal-modal/moderncssm/typings/index.js

@@ -0,0 +1 @@
+

package/universal-modal/moderncssm/typings/margin-type.d.ts

@@ -0,0 +1,3 @@
+type TMarginValue = 0 | 2 | 4 | 8 | 12 | 16 | 20 | 24 | 32 | 40 | 48 | 56 | 64 | 72 | 80 | 96 | 128 | 'auto';
+type TMargin = [TMarginValue, TMarginValue, TMarginValue, TMarginValue] | [TMarginValue, TMarginValue, TMarginValue] | [TMarginValue, TMarginValue] | [TMarginValue];
+export { TMargin };

package/universal-modal/moderncssm/typings/margin-type.js

@@ -0,0 +1 @@
+

package/universal-modal/moderncssm/utils/getMarginValues.d.ts

@@ -0,0 +1,13 @@
+import { TMargin } from "../typings/margin-type";
+declare const getMarginValues: (margin: TMargin) => {
+    top: 0 | 2 | 4 | "auto" | 16 | 24 | 32 | 8 | 12 | 20 | 40 | 48 | 56 | 64 | 72 | 80 | 96 | 128;
+    right: 0 | 2 | 4 | "auto" | 16 | 24 | 32 | 8 | 12 | 20 | 40 | 48 | 56 | 64 | 72 | 80 | 96 | 128;
+    bottom: 0 | 2 | 4 | "auto" | 16 | 24 | 32 | 8 | 12 | 20 | 40 | 48 | 56 | 64 | 72 | 80 | 96 | 128;
+    left: 0 | 2 | 4 | "auto" | 16 | 24 | 32 | 8 | 12 | 20 | 40 | 48 | 56 | 64 | 72 | 80 | 96 | 128;
+} | {
+    top?: undefined;
+    right?: undefined;
+    bottom?: undefined;
+    left?: undefined;
+};
+export { getMarginValues };

package/universal-modal/moderncssm/utils/getMarginValues.js

@@ -0,0 +1,17 @@
+const getMarginValues = (margin) => {
+    if (margin.length === 1) {
+        return { top: margin[0], right: margin[0], bottom: margin[0], left: margin[0] };
+    }
+    if (margin.length === 2) {
+        return { top: margin[0], right: margin[1], bottom: margin[0], left: margin[1] };
+    }
+    if (margin.length === 3) {
+        return { top: margin[0], right: margin[1], bottom: margin[2], left: margin[1] };
+    }
+    if (margin.length === 4) {
+        return { top: margin[0], right: margin[1], bottom: margin[2], left: margin[3] };
+    }
+    return {};
+};
+
+export { getMarginValues };

package/universal-modal/moderncssm/utils/getUniversalModalTestIds.d.ts

@@ -0,0 +1,8 @@
+declare function getUniversalModalTestIds(dataTestId: string): {
+    modal: string;
+    header: string;
+    title: string;
+    content: string;
+    footer: string;
+};
+export { getUniversalModalTestIds };

package/universal-modal/moderncssm/utils/getUniversalModalTestIds.js

@@ -0,0 +1,13 @@
+import { getDataTestId } from '../../../shared/moderncssm';
+
+function getUniversalModalTestIds(dataTestId) {
+    return {
+        modal: dataTestId,
+        header: getDataTestId(dataTestId, 'header'),
+        title: getDataTestId(dataTestId, 'header-title'),
+        content: getDataTestId(dataTestId, 'content'),
+        footer: getDataTestId(dataTestId, 'footer'),
+    };
+}
+
+export { getUniversalModalTestIds };

package/universal-modal/moderncssm/vars.css

@@ -0,0 +1,6 @@
+/* */
+
+:root {
+
+    /* scroll */
+}