@ozen-ui/kit 0.7.0 → 0.8.0

package/__inner__/cjs/components/Modal/Modal.css

@@ -1,22 +1,18 @@
-.no-scroll {
-  overflow: hidden;
-}
-
 .Modal {
   position: fixed;
   z-index: var(--z-index-modal);
   inset: 0;
 }
 
-.Modal:not(.Modal_hasBackdrop) {
+  .Modal:not(.Modal_hasBackdrop) {
     pointer-events: none;
   }
 
-.Modal:not(.Modal_hasBackdrop) .Modal-Window {
+  .Modal:not(.Modal_hasBackdrop) .Modal-Window {
       pointer-events: auto;
     }
 
-.Modal-Window {
+  .Modal-Window {
     position: absolute;
     inset-block-start: 50%;
     inset-inline-start: 50%;
@@ -27,7 +23,7 @@
     padding: var(--space-2xl);
   }
 
-.Modal_hidden {
+  .Modal_hidden {
     visibility: hidden;
   }
 

package/__inner__/cjs/components/Modal/Modal.d.ts

@@ -1,6 +1,6 @@
 import './Modal.css';
 import React from 'react';
-import type { ReactNode } from 'react';
+import type { ReactNode, RefObject } from 'react';
 import { CSSTransitionProps } from 'react-transition-group/CSSTransition';
 import { type BackdropProps } from '../Backdrop';
 import { type PaperProps } from '../Paper';
@@ -30,6 +30,12 @@ export type ModalProps = {
     hideBackdrop?: boolean;
     /** Если {true} предотвращает размонтирование компонента при событии закрыть */
     keepMounted?: boolean;
+    /** Если {true} отключает блокировку прокрутки основного экрана приложения */
+    disableScrollLock?: boolean;
+    /** Если {true} отключает закрытие окна при клике за его пределами */
+    disableClickOutside?: boolean;
+    /** Если {true} отключает закрытие окна при нажатии на клавишу ESC */
+    disableEscapeKeyDown?: boolean;
     /** Свойства компонента Backdrop (подложка) */
     backdropProps?: BackdropProps & {
         'data-testid'?: string;
@@ -48,6 +54,8 @@ export type ModalProps = {
     'data-testid'?: string;
     /** Контейнер для монтирования всплывающего окна */
     container?: PortalProps['container'];
+    /** Список ссылок на элементы при клике на которые Modal не будет закрываться (см. хук useClickOutside) */
+    ignoreClickOutsideRefs?: Array<RefObject<HTMLElement>>;
 } & PortalProps;
 export type ModalRef = PortalRef;
 export declare const Modal: React.ForwardRefExoticComponent<{
@@ -74,6 +82,12 @@ export declare const Modal: React.ForwardRefExoticComponent<{
     hideBackdrop?: boolean | undefined;
     /** Если {true} предотвращает размонтирование компонента при событии закрыть */
     keepMounted?: boolean | undefined;
+    /** Если {true} отключает блокировку прокрутки основного экрана приложения */
+    disableScrollLock?: boolean | undefined;
+    /** Если {true} отключает закрытие окна при клике за его пределами */
+    disableClickOutside?: boolean | undefined;
+    /** Если {true} отключает закрытие окна при нажатии на клавишу ESC */
+    disableEscapeKeyDown?: boolean | undefined;
     /** Свойства компонента Backdrop (подложка) */
     backdropProps?: (import("../Backdrop").BackdropBaseProps & {
         as?: "div" | undefined;
@@ -100,6 +114,8 @@ export declare const Modal: React.ForwardRefExoticComponent<{
     'data-testid'?: string | undefined;
     /** Контейнер для монтирования всплывающего окна */
     container?: PortalProps['container'];
+    /** Список ссылок на элементы при клике на которые Modal не будет закрываться (см. хук useClickOutside) */
+    ignoreClickOutsideRefs?: React.RefObject<HTMLElement>[] | undefined;
 } & import("../Portal").PortalBaseProps & {
     as?: "div" | undefined;
 } & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "container"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/Modal/Modal.js

@@ -12,25 +12,27 @@ var useMultiRef_1 = require("../../hooks/useMultiRef");
 var classname_1 = require("../../utils/classname");
 var isKey_1 = require("../../utils/isKey");
 var Backdrop_1 = require("../Backdrop");
-var Paper_1 = require("../Paper");
 var Portal_1 = require("../Portal");
+var components_1 = require("./components");
 var index_1 = require("./index");
 exports.cnModal = (0, classname_1.cn)('Modal');
 exports.Modal = (0, react_1.forwardRef)(function (_a, ref) {
-    var _b = _a.open, open = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, _d = _a.hideBackdrop, hideBackdrop = _d === void 0 ? false : _d, children = _a.children, onEnter = _a.onEnter, onEntered = _a.onEntered, onExit = _a.onExit, onExitedProp = _a.onExited, onClose = _a.onClose, backdropProps = _a.backdropProps, windowProps = _a.windowProps, transitionProps = _a.transitionProps, className = _a.className, other = tslib_1.__rest(_a, ["open", "keepMounted", "hideBackdrop", "children", "onEnter", "onEntered", "onExit", "onExited", "onClose", "backdropProps", "windowProps", "transitionProps", "className"]);
+    var _b = _a.open, open = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, _d = _a.hideBackdrop, hideBackdrop = _d === void 0 ? false : _d, _e = _a.disableScrollLock, disableScrollLock = _e === void 0 ? false : _e, _f = _a.disableClickOutside, disableClickOutside = _f === void 0 ? false : _f, _g = _a.disableEscapeKeyDown, disableEscapeKeyDown = _g === void 0 ? false : _g, children = _a.children, onEnter = _a.onEnter, onEntered = _a.onEntered, onExit = _a.onExit, onExitedProp = _a.onExited, onClose = _a.onClose, backdropProps = _a.backdropProps, windowProps = _a.windowProps, transitionProps = _a.transitionProps, className = _a.className, ignoreClickOutsideRefs = _a.ignoreClickOutsideRefs, other = tslib_1.__rest(_a, ["open", "keepMounted", "hideBackdrop", "disableScrollLock", "disableClickOutside", "disableEscapeKeyDown", "children", "onEnter", "onEntered", "onExit", "onExited", "onClose", "backdropProps", "windowProps", "transitionProps", "className", "ignoreClickOutsideRefs"]);
     var hasBackdrop = !hideBackdrop;
-    var hasScrollOnBody = (0, react_1.useRef)(null);
     var modalInnerRef = (0, react_1.useRef)(null);
     var focusedElement = (0, react_1.useRef)(null);
     var isClickOutSide = (0, react_1.useRef)(null);
-    var _e = tslib_1.__read((0, react_1.useState)(false), 2), openState = _e[0], setOpenState = _e[1];
-    var _f = (0, index_1.useModalManager)(modalInnerRef, 1000, openState), isTop = _f.isTop, refsClickOutside = _f.refsClickOutside;
+    var _h = tslib_1.__read((0, react_1.useState)(false), 2), openState = _h[0], setOpenState = _h[1];
+    var _j = (0, index_1.useModalManager)(modalInnerRef, 1000, openState), isTop = _j.isTop, refsClickOutside = _j.refsClickOutside;
     (0, useClickOutside_1.useClickOutside)({
-        refs: tslib_1.__spreadArray([modalInnerRef], tslib_1.__read(refsClickOutside), false),
+        refs: tslib_1.__spreadArray(tslib_1.__spreadArray([
+            modalInnerRef
+        ], tslib_1.__read(refsClickOutside), false), tslib_1.__read((ignoreClickOutsideRefs || [])), false),
         handler: function () {
             isClickOutSide.current = true;
             onClose === null || onClose === void 0 ? void 0 : onClose();
-        }
+        },
+        active: !disableClickOutside
     });
     (0, react_1.useEffect)(function () {
         var _a;
@@ -66,21 +68,11 @@ exports.Modal = (0, react_1.forwardRef)(function (_a, ref) {
             }
             onClose === null || onClose === void 0 ? void 0 : onClose();
         },
-        active: isTop
+        active: isTop && !disableEscapeKeyDown
     });
-    // Блокирует прокрутку основного окна приложения
-    (0, react_1.useEffect)(function () {
-        if (openState) {
-            hasScrollOnBody.current = document.body.classList.contains('no-scroll');
-            document.body.classList.add('no-scroll');
-        }
-        else if (!hasScrollOnBody.current) {
-            document.body.classList.remove('no-scroll');
-        }
-    }, [openState]);
     return (react_1["default"].createElement(react_transition_group_1.CSSTransition, tslib_1.__assign({ classNames: (0, exports.cnModal)({ animation: true }), timeout: 300 }, transitionProps, { "in": openState, onEnter: onEnter, onEntered: onEntered, onExit: onExit, onExited: onExited, unmountOnExit: !keepMounted, appear: true }),
-        react_1["default"].createElement(Portal_1.Portal, tslib_1.__assign({}, other, { className: (0, exports.cnModal)({ hidden: keepMounted && !openState, hasBackdrop: hasBackdrop }, [className]), ref: (0, useMultiRef_1.useMultiRef)([modalInnerRef, ref]) }),
-            !hideBackdrop && (react_1["default"].createElement(Backdrop_1.Backdrop, tslib_1.__assign({ zIndex: -1 }, backdropProps, { onClick: onClose, open: openState, className: backdropProps === null || backdropProps === void 0 ? void 0 : backdropProps.className }))),
-            react_1["default"].createElement(Paper_1.Paper, tslib_1.__assign({ radius: "s", background: "main" }, windowProps, { className: (0, exports.cnModal)('Window', [windowProps === null || windowProps === void 0 ? void 0 : windowProps.className]), tabIndex: -1, ref: (0, useMultiRef_1.useMultiRef)([trapRef, windowProps === null || windowProps === void 0 ? void 0 : windowProps.ref]) }), children))));
+        react_1["default"].createElement(Portal_1.Portal, tslib_1.__assign({}, other, { className: (0, exports.cnModal)({ hidden: keepMounted && !openState, hasBackdrop: hasBackdrop }, [className]), ref: ref }),
+            !hideBackdrop && (react_1["default"].createElement(Backdrop_1.Backdrop, tslib_1.__assign({ zIndex: -1, onClick: onClose }, backdropProps, { open: openState, className: backdropProps === null || backdropProps === void 0 ? void 0 : backdropProps.className }))),
+            react_1["default"].createElement(components_1.ModalConsumer, tslib_1.__assign({}, windowProps, { open: openState && !disableScrollLock, ref: (0, useMultiRef_1.useMultiRef)([modalInnerRef, trapRef, windowProps === null || windowProps === void 0 ? void 0 : windowProps.ref]) }), children))));
 });
 exports.Modal.displayName = 'Modal';

package/__inner__/cjs/components/Modal/components/ModalConsumer.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { PaperProps } from '../../Paper';
+export declare const ModalConsumer: FC<PaperProps & {
+    open: boolean;
+}>;

package/__inner__/cjs/components/Modal/components/ModalConsumer.js

@@ -0,0 +1,15 @@
+"use strict";
+exports.__esModule = true;
+exports.ModalConsumer = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var useLockBodyScroll_1 = require("../../../hooks/useLockBodyScroll");
+var Paper_1 = require("../../Paper");
+var index_1 = require("../index");
+exports.ModalConsumer = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, className = _a.className, open = _a.open, other = tslib_1.__rest(_a, ["children", "className", "open"]);
+    // Блокирует прокрутку основного окна приложения
+    (0, useLockBodyScroll_1.useLockBodyScroll)(open);
+    return (react_1["default"].createElement(Paper_1.Paper, tslib_1.__assign({ radius: "s", background: "main" }, other, { className: (0, index_1.cnModal)('Window', [className]), tabIndex: -1, ref: ref }), children));
+});
+exports.ModalConsumer.displayName = 'ModalConsumer';

package/__inner__/cjs/components/Modal/components/index.d.ts

@@ -0,0 +1 @@
+export * from './ModalConsumer';

package/__inner__/cjs/components/Modal/components/index.js

@@ -0,0 +1,4 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./ModalConsumer"), exports);

package/__inner__/cjs/hooks/useLockBodyScroll/index.d.ts

@@ -0,0 +1 @@
+export * from './useLockBodyScroll';

package/__inner__/cjs/hooks/useLockBodyScroll/index.js

@@ -0,0 +1,4 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./useLockBodyScroll"), exports);

package/__inner__/cjs/hooks/useLockBodyScroll/useLockBodyScroll.d.ts

@@ -0,0 +1 @@
+export declare function useLockBodyScroll(active?: boolean): void;

package/__inner__/cjs/hooks/useLockBodyScroll/useLockBodyScroll.js

@@ -0,0 +1,18 @@
+"use strict";
+exports.__esModule = true;
+exports.useLockBodyScroll = void 0;
+var useIsomorphicEffect_1 = require("../useIsomorphicEffect");
+function useLockBodyScroll(active) {
+    if (active === void 0) { active = false; }
+    (0, useIsomorphicEffect_1.useIsomorphicEffect)(function () {
+        if (!active) {
+            return undefined;
+        }
+        var originalStyle = window.getComputedStyle(document.body).overflow;
+        document.body.style.overflow = 'hidden';
+        return function () {
+            document.body.style.overflow = originalStyle;
+        };
+    }, [active]);
+}
+exports.useLockBodyScroll = useLockBodyScroll;

package/__inner__/esm/components/Modal/Modal.css

@@ -1,22 +1,18 @@
-.no-scroll {
-  overflow: hidden;
-}
-
 .Modal {
   position: fixed;
   z-index: var(--z-index-modal);
   inset: 0;
 }
 
-.Modal:not(.Modal_hasBackdrop) {
+  .Modal:not(.Modal_hasBackdrop) {
     pointer-events: none;
   }
 
-.Modal:not(.Modal_hasBackdrop) .Modal-Window {
+  .Modal:not(.Modal_hasBackdrop) .Modal-Window {
       pointer-events: auto;
     }
 
-.Modal-Window {
+  .Modal-Window {
     position: absolute;
     inset-block-start: 50%;
     inset-inline-start: 50%;
@@ -27,7 +23,7 @@
     padding: var(--space-2xl);
   }
 
-.Modal_hidden {
+  .Modal_hidden {
     visibility: hidden;
   }
 

package/__inner__/esm/components/Modal/Modal.d.ts

@@ -1,6 +1,6 @@
 import './Modal.css';
 import React from 'react';
-import type { ReactNode } from 'react';
+import type { ReactNode, RefObject } from 'react';
 import { CSSTransitionProps } from 'react-transition-group/CSSTransition';
 import { type BackdropProps } from '../Backdrop';
 import { type PaperProps } from '../Paper';
@@ -30,6 +30,12 @@ export type ModalProps = {
     hideBackdrop?: boolean;
     /** Если {true} предотвращает размонтирование компонента при событии закрыть */
     keepMounted?: boolean;
+    /** Если {true} отключает блокировку прокрутки основного экрана приложения */
+    disableScrollLock?: boolean;
+    /** Если {true} отключает закрытие окна при клике за его пределами */
+    disableClickOutside?: boolean;
+    /** Если {true} отключает закрытие окна при нажатии на клавишу ESC */
+    disableEscapeKeyDown?: boolean;
     /** Свойства компонента Backdrop (подложка) */
     backdropProps?: BackdropProps & {
         'data-testid'?: string;
@@ -48,6 +54,8 @@ export type ModalProps = {
     'data-testid'?: string;
     /** Контейнер для монтирования всплывающего окна */
     container?: PortalProps['container'];
+    /** Список ссылок на элементы при клике на которые Modal не будет закрываться (см. хук useClickOutside) */
+    ignoreClickOutsideRefs?: Array<RefObject<HTMLElement>>;
 } & PortalProps;
 export type ModalRef = PortalRef;
 export declare const Modal: React.ForwardRefExoticComponent<{
@@ -74,6 +82,12 @@ export declare const Modal: React.ForwardRefExoticComponent<{
     hideBackdrop?: boolean | undefined;
     /** Если {true} предотвращает размонтирование компонента при событии закрыть */
     keepMounted?: boolean | undefined;
+    /** Если {true} отключает блокировку прокрутки основного экрана приложения */
+    disableScrollLock?: boolean | undefined;
+    /** Если {true} отключает закрытие окна при клике за его пределами */
+    disableClickOutside?: boolean | undefined;
+    /** Если {true} отключает закрытие окна при нажатии на клавишу ESC */
+    disableEscapeKeyDown?: boolean | undefined;
     /** Свойства компонента Backdrop (подложка) */
     backdropProps?: (import("../Backdrop").BackdropBaseProps & {
         as?: "div" | undefined;
@@ -100,6 +114,8 @@ export declare const Modal: React.ForwardRefExoticComponent<{
     'data-testid'?: string | undefined;
     /** Контейнер для монтирования всплывающего окна */
     container?: PortalProps['container'];
+    /** Список ссылок на элементы при клике на которые Modal не будет закрываться (см. хук useClickOutside) */
+    ignoreClickOutsideRefs?: React.RefObject<HTMLElement>[] | undefined;
 } & import("../Portal").PortalBaseProps & {
     as?: "div" | undefined;
 } & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "container"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/Modal/Modal.js

@@ -9,25 +9,27 @@ import { useMultiRef } from '../../hooks/useMultiRef';
 import { cn } from '../../utils/classname';
 import { isKey } from '../../utils/isKey';
 import { Backdrop } from '../Backdrop';
-import { Paper } from '../Paper';
 import { Portal } from '../Portal';
+import { ModalConsumer } from './components';
 import { useModalManager } from './index';
 export var cnModal = cn('Modal');
 export var Modal = forwardRef(function (_a, ref) {
-    var _b = _a.open, open = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, _d = _a.hideBackdrop, hideBackdrop = _d === void 0 ? false : _d, children = _a.children, onEnter = _a.onEnter, onEntered = _a.onEntered, onExit = _a.onExit, onExitedProp = _a.onExited, onClose = _a.onClose, backdropProps = _a.backdropProps, windowProps = _a.windowProps, transitionProps = _a.transitionProps, className = _a.className, other = __rest(_a, ["open", "keepMounted", "hideBackdrop", "children", "onEnter", "onEntered", "onExit", "onExited", "onClose", "backdropProps", "windowProps", "transitionProps", "className"]);
+    var _b = _a.open, open = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, _d = _a.hideBackdrop, hideBackdrop = _d === void 0 ? false : _d, _e = _a.disableScrollLock, disableScrollLock = _e === void 0 ? false : _e, _f = _a.disableClickOutside, disableClickOutside = _f === void 0 ? false : _f, _g = _a.disableEscapeKeyDown, disableEscapeKeyDown = _g === void 0 ? false : _g, children = _a.children, onEnter = _a.onEnter, onEntered = _a.onEntered, onExit = _a.onExit, onExitedProp = _a.onExited, onClose = _a.onClose, backdropProps = _a.backdropProps, windowProps = _a.windowProps, transitionProps = _a.transitionProps, className = _a.className, ignoreClickOutsideRefs = _a.ignoreClickOutsideRefs, other = __rest(_a, ["open", "keepMounted", "hideBackdrop", "disableScrollLock", "disableClickOutside", "disableEscapeKeyDown", "children", "onEnter", "onEntered", "onExit", "onExited", "onClose", "backdropProps", "windowProps", "transitionProps", "className", "ignoreClickOutsideRefs"]);
     var hasBackdrop = !hideBackdrop;
-    var hasScrollOnBody = useRef(null);
     var modalInnerRef = useRef(null);
     var focusedElement = useRef(null);
     var isClickOutSide = useRef(null);
-    var _e = __read(useState(false), 2), openState = _e[0], setOpenState = _e[1];
-    var _f = useModalManager(modalInnerRef, 1000, openState), isTop = _f.isTop, refsClickOutside = _f.refsClickOutside;
+    var _h = __read(useState(false), 2), openState = _h[0], setOpenState = _h[1];
+    var _j = useModalManager(modalInnerRef, 1000, openState), isTop = _j.isTop, refsClickOutside = _j.refsClickOutside;
     useClickOutside({
-        refs: __spreadArray([modalInnerRef], __read(refsClickOutside), false),
+        refs: __spreadArray(__spreadArray([
+            modalInnerRef
+        ], __read(refsClickOutside), false), __read((ignoreClickOutsideRefs || [])), false),
         handler: function () {
             isClickOutSide.current = true;
             onClose === null || onClose === void 0 ? void 0 : onClose();
-        }
+        },
+        active: !disableClickOutside
     });
     useEffect(function () {
         var _a;
@@ -63,21 +65,11 @@ export var Modal = forwardRef(function (_a, ref) {
             }
             onClose === null || onClose === void 0 ? void 0 : onClose();
         },
-        active: isTop
+        active: isTop && !disableEscapeKeyDown
     });
-    // Блокирует прокрутку основного окна приложения
-    useEffect(function () {
-        if (openState) {
-            hasScrollOnBody.current = document.body.classList.contains('no-scroll');
-            document.body.classList.add('no-scroll');
-        }
-        else if (!hasScrollOnBody.current) {
-            document.body.classList.remove('no-scroll');
-        }
-    }, [openState]);
     return (React.createElement(CSSTransition, __assign({ classNames: cnModal({ animation: true }), timeout: 300 }, transitionProps, { "in": openState, onEnter: onEnter, onEntered: onEntered, onExit: onExit, onExited: onExited, unmountOnExit: !keepMounted, appear: true }),
-        React.createElement(Portal, __assign({}, other, { className: cnModal({ hidden: keepMounted && !openState, hasBackdrop: hasBackdrop }, [className]), ref: useMultiRef([modalInnerRef, ref]) }),
-            !hideBackdrop && (React.createElement(Backdrop, __assign({ zIndex: -1 }, backdropProps, { onClick: onClose, open: openState, className: backdropProps === null || backdropProps === void 0 ? void 0 : backdropProps.className }))),
-            React.createElement(Paper, __assign({ radius: "s", background: "main" }, windowProps, { className: cnModal('Window', [windowProps === null || windowProps === void 0 ? void 0 : windowProps.className]), tabIndex: -1, ref: useMultiRef([trapRef, windowProps === null || windowProps === void 0 ? void 0 : windowProps.ref]) }), children))));
+        React.createElement(Portal, __assign({}, other, { className: cnModal({ hidden: keepMounted && !openState, hasBackdrop: hasBackdrop }, [className]), ref: ref }),
+            !hideBackdrop && (React.createElement(Backdrop, __assign({ zIndex: -1, onClick: onClose }, backdropProps, { open: openState, className: backdropProps === null || backdropProps === void 0 ? void 0 : backdropProps.className }))),
+            React.createElement(ModalConsumer, __assign({}, windowProps, { open: openState && !disableScrollLock, ref: useMultiRef([modalInnerRef, trapRef, windowProps === null || windowProps === void 0 ? void 0 : windowProps.ref]) }), children))));
 });
 Modal.displayName = 'Modal';

package/__inner__/esm/components/Modal/components/ModalConsumer.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { PaperProps } from '../../Paper';
+export declare const ModalConsumer: FC<PaperProps & {
+    open: boolean;
+}>;

package/__inner__/esm/components/Modal/components/ModalConsumer.js

@@ -0,0 +1,12 @@
+import { __assign, __rest } from "tslib";
+import React, { forwardRef } from 'react';
+import { useLockBodyScroll } from '../../../hooks/useLockBodyScroll';
+import { Paper } from '../../Paper';
+import { cnModal } from '../index';
+export var ModalConsumer = forwardRef(function (_a, ref) {
+    var children = _a.children, className = _a.className, open = _a.open, other = __rest(_a, ["children", "className", "open"]);
+    // Блокирует прокрутку основного окна приложения
+    useLockBodyScroll(open);
+    return (React.createElement(Paper, __assign({ radius: "s", background: "main" }, other, { className: cnModal('Window', [className]), tabIndex: -1, ref: ref }), children));
+});
+ModalConsumer.displayName = 'ModalConsumer';

package/__inner__/esm/components/Modal/components/index.d.ts

@@ -0,0 +1 @@
+export * from './ModalConsumer';

package/__inner__/esm/components/Modal/components/index.js

@@ -0,0 +1 @@
+export * from './ModalConsumer';

package/__inner__/esm/hooks/useLockBodyScroll/index.d.ts

@@ -0,0 +1 @@
+export * from './useLockBodyScroll';

package/__inner__/esm/hooks/useLockBodyScroll/index.js

@@ -0,0 +1 @@
+export * from './useLockBodyScroll';

package/__inner__/esm/hooks/useLockBodyScroll/useLockBodyScroll.d.ts

@@ -0,0 +1 @@
+export declare function useLockBodyScroll(active?: boolean): void;

package/__inner__/esm/hooks/useLockBodyScroll/useLockBodyScroll.js

@@ -0,0 +1,14 @@
+import { useIsomorphicEffect } from '../useIsomorphicEffect';
+export function useLockBodyScroll(active) {
+    if (active === void 0) { active = false; }
+    useIsomorphicEffect(function () {
+        if (!active) {
+            return undefined;
+        }
+        var originalStyle = window.getComputedStyle(document.body).overflow;
+        document.body.style.overflow = 'hidden';
+        return function () {
+            document.body.style.overflow = originalStyle;
+        };
+    }, [active]);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ozen-ui/kit",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "React component library",
   "files": [
     "*"

package/useLockBodyScroll/package.json

@@ -0,0 +1,5 @@
+{
+	"main": "../__inner__/cjs/hooks/useLockBodyScroll/index.js",
+	"module": "../__inner__/esm/hooks/useLockBodyScroll/index.js",
+	"types": "../__inner__/esm/hooks/useLockBodyScroll/index.d.ts"
+}