@alfalab/core-components-universal-modal 3.0.7 → 3.1.0-alfasans

package/src/desktop/components/center-modal/center-modal.tsx

@@ -4,7 +4,7 @@ import cn from 'classnames';
 import { BaseModal } from '@alfalab/core-components-base-modal';
 import { isMacOS, isSafari } from '@alfalab/core-components-shared';
 
-import { useModalWheel } from '../../hooks/useModalWheel';
+import { useScrollableContainerRef } from '../../hooks/use-scrollable-container-ref';
 import { type UniversalModalDesktopProps } from '../../types/props';
 import { getFullSizeModalTransitions } from '../../utils/get-full-size-modal-transitions';
 import { getHeightStyle } from '../../utils/get-height-style';
@@ -30,14 +30,16 @@ export const CenterModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps
         verticalAlign = 'center',
         overlay = true,
         margin,
-        scrollableContainerRef,
+        scrollableContainerRef: scrollableContainerRefProp,
         onClose,
         ...restProps
     } = props;
 
     const componentRef = useRef<HTMLDivElement>(null);
-
-    const { wheelDeltaY, handleWheel } = useModalWheel(overlay);
+    const { handleWheel, scrollableContainerRef } = useScrollableContainerRef({
+        overlay,
+        refObject: scrollableContainerRefProp,
+    });
 
     const {
         isFullSizeModal,
@@ -45,6 +47,8 @@ export const CenterModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps
         backdropTransitions: fullSizeModalBackdropTransitions,
     } = getFullSizeModalTransitions({ verticalAlign, width, height });
 
+    const withoutOverlay = !overlay;
+
     return (
         <BaseModal
             {...restProps}
@@ -53,14 +57,14 @@ export const CenterModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps
             ref={ref}
             componentRef={componentRef}
             scrollHandler='content'
-            disableBlockingScroll={!overlay}
-            wrapperClassName={cn({
+            disableBlockingScroll={withoutOverlay}
+            wrapperClassName={cn(styles.baseModalContainer, {
                 [styles.wrapperJustifyStart]: verticalAlign === 'top',
                 [styles.wrapperJustifyCenter]: verticalAlign === 'center',
                 [styles.wrapperJustifyEnd]: verticalAlign === 'bottom',
+                [styles.withoutOverlay]: withoutOverlay,
             })}
-            className={cn(styles.component, className, {
-                [styles.overlayHidden]: !overlay,
+            className={cn(styles.component, className, styles.baseModalComponent, {
                 ...getMarginStyles({ styles, margin }),
             })}
             transitionProps={{
@@ -69,7 +73,7 @@ export const CenterModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps
                 ...restProps.transitionProps,
             }}
             backdropProps={{
-                transparent: !overlay,
+                shouldRender: overlay,
                 ...(isFullSizeModal && fullSizeModalBackdropTransitions),
                 ...restProps.backdropProps,
             }}
@@ -82,11 +86,7 @@ export const CenterModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps
             onWheel={handleWheel}
             onClose={onClose}
         >
-            <ModalContent
-                height={height}
-                wheelDeltaY={wheelDeltaY}
-                scrollableContainerRef={scrollableContainerRef}
-            >
+            <ModalContent height={height} scrollableContainerRef={scrollableContainerRef}>
                 {children}
             </ModalContent>
         </BaseModal>

package/src/desktop/components/center-modal/index.module.css

@@ -1,2 +1,3 @@
-@import 'center-modal.module.css';
+@import './center-modal.module.css';
+@import '../../styles/common.module.css';
 @import '../../styles/margins.module.css';

package/src/desktop/components/modal-content/modal-content.tsx

@@ -6,21 +6,22 @@ import { type BaseModalProps } from '@alfalab/core-components-base-modal';
 import { Scrollbar } from '@alfalab/core-components-scrollbar';
 
 import { useModalHighlighted } from '../../hooks/use-modal-highlighted';
-import { useOutsideScroll } from '../../hooks/use-outside-scroll';
 import { useSetScrollbarHeight } from '../../hooks/use-set-scrollbar-height';
 import { type UniversalModalDesktopProps } from '../../types/props';
 import { setFooterAndHeaderRefs } from '../../utils/set-footer-and-header-refs';
 
 import styles from './modal-content.module.css';
 
-interface Props
-    extends Pick<BaseModalProps, 'children'>,
-        Pick<UniversalModalDesktopProps, 'height' | 'scrollableContainerRef'> {
-    wheelDeltaY: number;
-}
+type PickedBaseModalProps = Pick<BaseModalProps, 'children'>;
+type PickedUniversalModalDesktopProps = Pick<
+    UniversalModalDesktopProps,
+    'height' | 'scrollableContainerRef'
+>;
+
+type Props = PickedBaseModalProps & PickedUniversalModalDesktopProps;
 
 export const ModalContent: FC<Props> = (props) => {
-    const { children, wheelDeltaY, height, scrollableContainerRef = null } = props;
+    const { children, height, scrollableContainerRef = null } = props;
 
     const scrollableNodeRef = useRef<HTMLDivElement>(null);
     const scrollbarContentNodeRef = useRef<HTMLDivElement>(null);
@@ -31,8 +32,6 @@ export const ModalContent: FC<Props> = (props) => {
 
     const { handleScroll } = useModalHighlighted({ scrollbarContentNodeRef, scrollableNodeRef });
 
-    useOutsideScroll({ scrollableNodeRef, wheelDeltaY });
-
     const { enhancedChildren } = setFooterAndHeaderRefs({
         children,
         headerElementRef,

package/src/desktop/components/side-modal/index.module.css

@@ -1,2 +1,3 @@
-@import 'side-modal.module.css';
+@import './side-modal.module.css';
+@import '../../styles/common.module.css';
 @import '../../styles/margins.module.css';

package/src/desktop/components/side-modal/side-modal.module.css

@@ -31,8 +31,4 @@
     */
     will-change: transform;
     backface-visibility: hidden;
-
-    &.overlayHidden {
-        box-shadow: var(--shadow-m);
-    }
 }

package/src/desktop/components/side-modal/side-modal.tsx

@@ -3,7 +3,7 @@ import cn from 'classnames';
 
 import { BaseModal } from '@alfalab/core-components-base-modal';
 
-import { useModalWheel } from '../../hooks/useModalWheel';
+import { useScrollableContainerRef } from '../../hooks/use-scrollable-container-ref';
 import { type UniversalModalDesktopProps } from '../../types/props';
 import { getFullSizeModalTransitions } from '../../utils/get-full-size-modal-transitions';
 import { getHeightStyle } from '../../utils/get-height-style';
@@ -27,14 +27,16 @@ export const SideModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>(
         className,
         children,
         margin,
-        scrollableContainerRef,
+        scrollableContainerRef: scrollableContainerRefProp,
         onClose,
         ...restProps
     } = props;
     const componentRef = useRef<HTMLDivElement>(null);
     const contentRef = useRef<HTMLDivElement>(null);
-
-    const { wheelDeltaY, handleWheel } = useModalWheel(overlay);
+    const { handleWheel, scrollableContainerRef } = useScrollableContainerRef({
+        overlay,
+        refObject: scrollableContainerRefProp,
+    });
 
     const {
         isFullSizeModal,
@@ -42,6 +44,8 @@ export const SideModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>(
         backdropTransitions: fullSizeModalBackdropTransitions,
     } = getFullSizeModalTransitions({ verticalAlign, width, height });
 
+    const withoutOverlay = !overlay;
+
     return (
         <BaseModal
             {...restProps}
@@ -51,15 +55,15 @@ export const SideModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>(
             componentRef={componentRef}
             contentElementRef={contentRef}
             scrollHandler='content'
-            disableBlockingScroll={!overlay}
-            wrapperClassName={cn(styles.wrapper, {
+            disableBlockingScroll={withoutOverlay}
+            wrapperClassName={cn(styles.wrapper, styles.baseModalContainer, {
                 [styles.wrapperAlignStart]: horizontalAlign === 'start',
                 [styles.wrapperAlignEnd]: horizontalAlign === 'end',
                 [styles.wrapperJustifyCenter]: verticalAlign === 'center',
                 [styles.wrapperJustifyEnd]: verticalAlign === 'bottom',
+                [styles.withoutOverlay]: withoutOverlay,
             })}
-            className={cn(styles.component, className, {
-                [styles.overlayHidden]: !overlay,
+            className={cn(styles.component, className, styles.baseModalComponent, {
                 ...getMarginStyles({ styles, margin }),
             })}
             contentClassName={styles.content}
@@ -72,7 +76,7 @@ export const SideModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>(
                 ...restProps.transitionProps,
             }}
             backdropProps={{
-                transparent: !overlay,
+                shouldRender: overlay,
                 ...(isFullSizeModal && fullSizeModalBackdropTransitions),
                 ...restProps.backdropProps,
             }}
@@ -85,11 +89,7 @@ export const SideModal = forwardRef<HTMLDivElement, UniversalModalDesktopProps>(
             onWheel={handleWheel}
             onClose={onClose}
         >
-            <ModalContent
-                height={height}
-                wheelDeltaY={wheelDeltaY}
-                scrollableContainerRef={scrollableContainerRef}
-            >
+            <ModalContent height={height} scrollableContainerRef={scrollableContainerRef}>
                 {children}
             </ModalContent>
         </BaseModal>

package/src/desktop/hooks/use-scrollable-container-ref.ts

@@ -0,0 +1,29 @@
+import { type RefObject, useCallback, useRef, type WheelEvent } from 'react';
+
+interface Params {
+    overlay: boolean;
+    refObject?: RefObject<HTMLDivElement>;
+}
+
+export const useScrollableContainerRef = ({ overlay, refObject }: Params) => {
+    const innerScrollableContainerRef = useRef<HTMLDivElement>(null);
+    const scrollableContainerRef = refObject || innerScrollableContainerRef;
+
+    const handleWheel = useCallback(
+        (e: WheelEvent<HTMLElement>) => {
+            if (!overlay || e.target !== e.currentTarget) {
+                return;
+            }
+
+            scrollableContainerRef.current?.scrollBy({
+                top: e.deltaY,
+            });
+        },
+        [overlay, scrollableContainerRef],
+    );
+
+    return {
+        handleWheel,
+        scrollableContainerRef,
+    };
+};

package/src/desktop/styles/common.module.css

@@ -0,0 +1,10 @@
+.baseModalContainer {
+    &.withoutOverlay {
+        pointer-events: none;
+
+        & .baseModalComponent {
+            pointer-events: auto;
+            box-shadow: var(--shadow-m);
+        }
+    }
+}

package/cssm/desktop/hooks/use-outside-scroll.d.ts

@@ -1,8 +0,0 @@
-import { type RefObject } from 'react';
-interface Params {
-    scrollableNodeRef: RefObject<HTMLDivElement>;
-    wheelDeltaY: number;
-}
-/** Изменение позиции скролла */
-export declare const useOutsideScroll: (params: Params) => void;
-export {};

package/cssm/desktop/hooks/use-outside-scroll.js

@@ -1,21 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-/** Изменение позиции скролла */
-var useOutsideScroll = function (params) {
-    var scrollableNodeRef = params.scrollableNodeRef, wheelDeltaY = params.wheelDeltaY;
-    React.useEffect(function () {
-        if (scrollableNodeRef.current) {
-            scrollableNodeRef.current.scrollBy({
-                top: wheelDeltaY,
-            });
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [wheelDeltaY]);
-};
-
-exports.useOutsideScroll = useOutsideScroll;
-//# sourceMappingURL=use-outside-scroll.js.map

package/cssm/desktop/hooks/use-outside-scroll.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-outside-scroll.js","sources":["../../../src/desktop/hooks/use-outside-scroll.ts"],"sourcesContent":["import { type RefObject, useEffect } from 'react';\n\ninterface Params {\n    scrollableNodeRef: RefObject<HTMLDivElement>;\n    wheelDeltaY: number;\n}\n\n/** Изменение позиции скролла */\nexport const useOutsideScroll = (params: Params) => {\n    const { scrollableNodeRef, wheelDeltaY } = params;\n\n    useEffect(() => {\n        if (scrollableNodeRef.current) {\n            scrollableNodeRef.current.scrollBy({\n                top: wheelDeltaY,\n            });\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [wheelDeltaY]);\n};\n"],"names":["useEffect"],"mappings":";;;;;;AAOA;AACO,IAAM,gBAAgB,GAAG,UAAC,MAAc,EAAA;IACnC,IAAA,iBAAiB,GAAkB,MAAM,CAAA,iBAAxB,EAAE,WAAW,GAAK,MAAM,CAAA,WAAX;AAEtC,IAAAA,eAAS,CAAC,YAAA;AACN,QAAA,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC3B,YAAA,iBAAiB,CAAC,OAAO,CAAC,QAAQ,CAAC;AAC/B,gBAAA,GAAG,EAAE,WAAW;AACnB,aAAA,CAAC;;;AAGV,KAAC,EAAE,CAAC,WAAW,CAAC,CAAC;AACrB;;;;"}

package/cssm/desktop/hooks/useModalWheel.d.ts

@@ -1,5 +0,0 @@
-import { type WheelEvent } from 'react';
-export declare const useModalWheel: (overlay: boolean) => {
-    wheelDeltaY: number;
-    handleWheel: (e: WheelEvent<HTMLElement>) => void;
-};

package/cssm/desktop/hooks/useModalWheel.js

@@ -1,20 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-var useModalWheel = function (overlay) {
-    var _a = React.useState(0), wheelDeltaY = _a[0], setWheelDeltaY = _a[1];
-    // передаем e.deltaY от события на элементе dialog компонента base-modal
-    var handleWheel = function (e) {
-        var target = e.target;
-        if (target.getAttribute('role') === 'dialog' && overlay) {
-            setWheelDeltaY(e.deltaY);
-        }
-    };
-    return { wheelDeltaY: wheelDeltaY, handleWheel: handleWheel };
-};
-
-exports.useModalWheel = useModalWheel;
-//# sourceMappingURL=useModalWheel.js.map

package/cssm/desktop/hooks/useModalWheel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useModalWheel.js","sources":["../../../src/desktop/hooks/useModalWheel.ts"],"sourcesContent":["import { useState, type WheelEvent } from 'react';\n\nexport const useModalWheel = (overlay: boolean) => {\n    const [wheelDeltaY, setWheelDeltaY] = useState<number>(0);\n\n    // передаем e.deltaY от события на элементе dialog компонента base-modal\n    const handleWheel = (e: WheelEvent<HTMLElement>) => {\n        const target = e.target as HTMLDivElement;\n\n        if (target.getAttribute('role') === 'dialog' && overlay) {\n            setWheelDeltaY(e.deltaY);\n        }\n    };\n\n    return { wheelDeltaY, handleWheel };\n};\n"],"names":["useState"],"mappings":";;;;;;AAEO,IAAM,aAAa,GAAG,UAAC,OAAgB,EAAA;IACpC,IAAA,EAAA,GAAgCA,cAAQ,CAAS,CAAC,CAAC,EAAlD,WAAW,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,cAAc,GAAA,EAAA,CAAA,CAAA,CAAuB;;IAGzD,IAAM,WAAW,GAAG,UAAC,CAA0B,EAAA;AAC3C,QAAA,IAAM,MAAM,GAAG,CAAC,CAAC,MAAwB;QAEzC,IAAI,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,QAAQ,IAAI,OAAO,EAAE;AACrD,YAAA,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC;;AAEhC,KAAC;AAED,IAAA,OAAO,EAAE,WAAW,EAAA,WAAA,EAAE,WAAW,EAAA,WAAA,EAAE;AACvC;;;;"}

package/desktop/hooks/use-outside-scroll.d.ts

@@ -1,8 +0,0 @@
-import { type RefObject } from 'react';
-interface Params {
-    scrollableNodeRef: RefObject<HTMLDivElement>;
-    wheelDeltaY: number;
-}
-/** Изменение позиции скролла */
-export declare const useOutsideScroll: (params: Params) => void;
-export {};

package/desktop/hooks/use-outside-scroll.js

@@ -1,21 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-/** Изменение позиции скролла */
-var useOutsideScroll = function (params) {
-    var scrollableNodeRef = params.scrollableNodeRef, wheelDeltaY = params.wheelDeltaY;
-    React.useEffect(function () {
-        if (scrollableNodeRef.current) {
-            scrollableNodeRef.current.scrollBy({
-                top: wheelDeltaY,
-            });
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [wheelDeltaY]);
-};
-
-exports.useOutsideScroll = useOutsideScroll;
-//# sourceMappingURL=use-outside-scroll.js.map

package/desktop/hooks/use-outside-scroll.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-outside-scroll.js","sources":["../../src/desktop/hooks/use-outside-scroll.ts"],"sourcesContent":["import { type RefObject, useEffect } from 'react';\n\ninterface Params {\n    scrollableNodeRef: RefObject<HTMLDivElement>;\n    wheelDeltaY: number;\n}\n\n/** Изменение позиции скролла */\nexport const useOutsideScroll = (params: Params) => {\n    const { scrollableNodeRef, wheelDeltaY } = params;\n\n    useEffect(() => {\n        if (scrollableNodeRef.current) {\n            scrollableNodeRef.current.scrollBy({\n                top: wheelDeltaY,\n            });\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [wheelDeltaY]);\n};\n"],"names":["useEffect"],"mappings":";;;;;;AAOA;AACO,IAAM,gBAAgB,GAAG,UAAC,MAAc,EAAA;IACnC,IAAA,iBAAiB,GAAkB,MAAM,CAAA,iBAAxB,EAAE,WAAW,GAAK,MAAM,CAAA,WAAX;AAEtC,IAAAA,eAAS,CAAC,YAAA;AACN,QAAA,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC3B,YAAA,iBAAiB,CAAC,OAAO,CAAC,QAAQ,CAAC;AAC/B,gBAAA,GAAG,EAAE,WAAW;AACnB,aAAA,CAAC;;;AAGV,KAAC,EAAE,CAAC,WAAW,CAAC,CAAC;AACrB;;;;"}

package/desktop/hooks/useModalWheel.d.ts

@@ -1,5 +0,0 @@
-import { type WheelEvent } from 'react';
-export declare const useModalWheel: (overlay: boolean) => {
-    wheelDeltaY: number;
-    handleWheel: (e: WheelEvent<HTMLElement>) => void;
-};

package/desktop/hooks/useModalWheel.js

@@ -1,20 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-var useModalWheel = function (overlay) {
-    var _a = React.useState(0), wheelDeltaY = _a[0], setWheelDeltaY = _a[1];
-    // передаем e.deltaY от события на элементе dialog компонента base-modal
-    var handleWheel = function (e) {
-        var target = e.target;
-        if (target.getAttribute('role') === 'dialog' && overlay) {
-            setWheelDeltaY(e.deltaY);
-        }
-    };
-    return { wheelDeltaY: wheelDeltaY, handleWheel: handleWheel };
-};
-
-exports.useModalWheel = useModalWheel;
-//# sourceMappingURL=useModalWheel.js.map

package/desktop/hooks/useModalWheel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useModalWheel.js","sources":["../../src/desktop/hooks/useModalWheel.ts"],"sourcesContent":["import { useState, type WheelEvent } from 'react';\n\nexport const useModalWheel = (overlay: boolean) => {\n    const [wheelDeltaY, setWheelDeltaY] = useState<number>(0);\n\n    // передаем e.deltaY от события на элементе dialog компонента base-modal\n    const handleWheel = (e: WheelEvent<HTMLElement>) => {\n        const target = e.target as HTMLDivElement;\n\n        if (target.getAttribute('role') === 'dialog' && overlay) {\n            setWheelDeltaY(e.deltaY);\n        }\n    };\n\n    return { wheelDeltaY, handleWheel };\n};\n"],"names":["useState"],"mappings":";;;;;;AAEO,IAAM,aAAa,GAAG,UAAC,OAAgB,EAAA;IACpC,IAAA,EAAA,GAAgCA,cAAQ,CAAS,CAAC,CAAC,EAAlD,WAAW,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,cAAc,GAAA,EAAA,CAAA,CAAA,CAAuB;;IAGzD,IAAM,WAAW,GAAG,UAAC,CAA0B,EAAA;AAC3C,QAAA,IAAM,MAAM,GAAG,CAAC,CAAC,MAAwB;QAEzC,IAAI,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,QAAQ,IAAI,OAAO,EAAE;AACrD,YAAA,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC;;AAEhC,KAAC;AAED,IAAA,OAAO,EAAE,WAAW,EAAA,WAAA,EAAE,WAAW,EAAA,WAAA,EAAE;AACvC;;;;"}

package/esm/desktop/hooks/use-outside-scroll.d.ts

@@ -1,8 +0,0 @@
-import { type RefObject } from 'react';
-interface Params {
-    scrollableNodeRef: RefObject<HTMLDivElement>;
-    wheelDeltaY: number;
-}
-/** Изменение позиции скролла */
-export declare const useOutsideScroll: (params: Params) => void;
-export {};

package/esm/desktop/hooks/use-outside-scroll.js

@@ -1,17 +0,0 @@
-import { useEffect } from 'react';
-
-/** Изменение позиции скролла */
-var useOutsideScroll = function (params) {
-    var scrollableNodeRef = params.scrollableNodeRef, wheelDeltaY = params.wheelDeltaY;
-    useEffect(function () {
-        if (scrollableNodeRef.current) {
-            scrollableNodeRef.current.scrollBy({
-                top: wheelDeltaY,
-            });
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [wheelDeltaY]);
-};
-
-export { useOutsideScroll };
-//# sourceMappingURL=use-outside-scroll.js.map

package/esm/desktop/hooks/use-outside-scroll.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-outside-scroll.js","sources":["../../../src/desktop/hooks/use-outside-scroll.ts"],"sourcesContent":["import { type RefObject, useEffect } from 'react';\n\ninterface Params {\n    scrollableNodeRef: RefObject<HTMLDivElement>;\n    wheelDeltaY: number;\n}\n\n/** Изменение позиции скролла */\nexport const useOutsideScroll = (params: Params) => {\n    const { scrollableNodeRef, wheelDeltaY } = params;\n\n    useEffect(() => {\n        if (scrollableNodeRef.current) {\n            scrollableNodeRef.current.scrollBy({\n                top: wheelDeltaY,\n            });\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [wheelDeltaY]);\n};\n"],"names":[],"mappings":";;AAOA;AACO,IAAM,gBAAgB,GAAG,UAAC,MAAc,EAAA;IACnC,IAAA,iBAAiB,GAAkB,MAAM,CAAA,iBAAxB,EAAE,WAAW,GAAK,MAAM,CAAA,WAAX;AAEtC,IAAA,SAAS,CAAC,YAAA;AACN,QAAA,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC3B,YAAA,iBAAiB,CAAC,OAAO,CAAC,QAAQ,CAAC;AAC/B,gBAAA,GAAG,EAAE,WAAW;AACnB,aAAA,CAAC;;;AAGV,KAAC,EAAE,CAAC,WAAW,CAAC,CAAC;AACrB;;;;"}

package/esm/desktop/hooks/useModalWheel.d.ts

@@ -1,5 +0,0 @@
-import { type WheelEvent } from 'react';
-export declare const useModalWheel: (overlay: boolean) => {
-    wheelDeltaY: number;
-    handleWheel: (e: WheelEvent<HTMLElement>) => void;
-};

package/esm/desktop/hooks/useModalWheel.js

@@ -1,16 +0,0 @@
-import { useState } from 'react';
-
-var useModalWheel = function (overlay) {
-    var _a = useState(0), wheelDeltaY = _a[0], setWheelDeltaY = _a[1];
-    // передаем e.deltaY от события на элементе dialog компонента base-modal
-    var handleWheel = function (e) {
-        var target = e.target;
-        if (target.getAttribute('role') === 'dialog' && overlay) {
-            setWheelDeltaY(e.deltaY);
-        }
-    };
-    return { wheelDeltaY: wheelDeltaY, handleWheel: handleWheel };
-};
-
-export { useModalWheel };
-//# sourceMappingURL=useModalWheel.js.map

package/esm/desktop/hooks/useModalWheel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useModalWheel.js","sources":["../../../src/desktop/hooks/useModalWheel.ts"],"sourcesContent":["import { useState, type WheelEvent } from 'react';\n\nexport const useModalWheel = (overlay: boolean) => {\n    const [wheelDeltaY, setWheelDeltaY] = useState<number>(0);\n\n    // передаем e.deltaY от события на элементе dialog компонента base-modal\n    const handleWheel = (e: WheelEvent<HTMLElement>) => {\n        const target = e.target as HTMLDivElement;\n\n        if (target.getAttribute('role') === 'dialog' && overlay) {\n            setWheelDeltaY(e.deltaY);\n        }\n    };\n\n    return { wheelDeltaY, handleWheel };\n};\n"],"names":[],"mappings":";;AAEO,IAAM,aAAa,GAAG,UAAC,OAAgB,EAAA;IACpC,IAAA,EAAA,GAAgC,QAAQ,CAAS,CAAC,CAAC,EAAlD,WAAW,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,cAAc,GAAA,EAAA,CAAA,CAAA,CAAuB;;IAGzD,IAAM,WAAW,GAAG,UAAC,CAA0B,EAAA;AAC3C,QAAA,IAAM,MAAM,GAAG,CAAC,CAAC,MAAwB;QAEzC,IAAI,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,QAAQ,IAAI,OAAO,EAAE;AACrD,YAAA,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC;;AAEhC,KAAC;AAED,IAAA,OAAO,EAAE,WAAW,EAAA,WAAA,EAAE,WAAW,EAAA,WAAA,EAAE;AACvC;;;;"}

package/modern/desktop/hooks/use-outside-scroll.d.ts

@@ -1,8 +0,0 @@
-import { type RefObject } from 'react';
-interface Params {
-    scrollableNodeRef: RefObject<HTMLDivElement>;
-    wheelDeltaY: number;
-}
-/** Изменение позиции скролла */
-export declare const useOutsideScroll: (params: Params) => void;
-export {};

package/modern/desktop/hooks/use-outside-scroll.js

@@ -1,17 +0,0 @@
-import { useEffect } from 'react';
-
-/** Изменение позиции скролла */
-const useOutsideScroll = (params) => {
-    const { scrollableNodeRef, wheelDeltaY } = params;
-    useEffect(() => {
-        if (scrollableNodeRef.current) {
-            scrollableNodeRef.current.scrollBy({
-                top: wheelDeltaY,
-            });
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [wheelDeltaY]);
-};
-
-export { useOutsideScroll };
-//# sourceMappingURL=use-outside-scroll.js.map

package/modern/desktop/hooks/use-outside-scroll.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-outside-scroll.js","sources":["../../../src/desktop/hooks/use-outside-scroll.ts"],"sourcesContent":["import { type RefObject, useEffect } from 'react';\n\ninterface Params {\n    scrollableNodeRef: RefObject<HTMLDivElement>;\n    wheelDeltaY: number;\n}\n\n/** Изменение позиции скролла */\nexport const useOutsideScroll = (params: Params) => {\n    const { scrollableNodeRef, wheelDeltaY } = params;\n\n    useEffect(() => {\n        if (scrollableNodeRef.current) {\n            scrollableNodeRef.current.scrollBy({\n                top: wheelDeltaY,\n            });\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [wheelDeltaY]);\n};\n"],"names":[],"mappings":";;AAOA;AACa,MAAA,gBAAgB,GAAG,CAAC,MAAc,KAAI;AAC/C,IAAA,MAAM,EAAE,iBAAiB,EAAE,WAAW,EAAE,GAAG,MAAM;IAEjD,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC3B,YAAA,iBAAiB,CAAC,OAAO,CAAC,QAAQ,CAAC;AAC/B,gBAAA,GAAG,EAAE,WAAW;AACnB,aAAA,CAAC;;;AAGV,KAAC,EAAE,CAAC,WAAW,CAAC,CAAC;AACrB;;;;"}

package/modern/desktop/hooks/useModalWheel.d.ts

@@ -1,5 +0,0 @@
-import { type WheelEvent } from 'react';
-export declare const useModalWheel: (overlay: boolean) => {
-    wheelDeltaY: number;
-    handleWheel: (e: WheelEvent<HTMLElement>) => void;
-};

package/modern/desktop/hooks/useModalWheel.js

@@ -1,16 +0,0 @@
-import { useState } from 'react';
-
-const useModalWheel = (overlay) => {
-    const [wheelDeltaY, setWheelDeltaY] = useState(0);
-    // передаем e.deltaY от события на элементе dialog компонента base-modal
-    const handleWheel = (e) => {
-        const target = e.target;
-        if (target.getAttribute('role') === 'dialog' && overlay) {
-            setWheelDeltaY(e.deltaY);
-        }
-    };
-    return { wheelDeltaY, handleWheel };
-};
-
-export { useModalWheel };
-//# sourceMappingURL=useModalWheel.js.map

package/modern/desktop/hooks/useModalWheel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useModalWheel.js","sources":["../../../src/desktop/hooks/useModalWheel.ts"],"sourcesContent":["import { useState, type WheelEvent } from 'react';\n\nexport const useModalWheel = (overlay: boolean) => {\n    const [wheelDeltaY, setWheelDeltaY] = useState<number>(0);\n\n    // передаем e.deltaY от события на элементе dialog компонента base-modal\n    const handleWheel = (e: WheelEvent<HTMLElement>) => {\n        const target = e.target as HTMLDivElement;\n\n        if (target.getAttribute('role') === 'dialog' && overlay) {\n            setWheelDeltaY(e.deltaY);\n        }\n    };\n\n    return { wheelDeltaY, handleWheel };\n};\n"],"names":[],"mappings":";;AAEa,MAAA,aAAa,GAAG,CAAC,OAAgB,KAAI;IAC9C,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAS,CAAC,CAAC;;AAGzD,IAAA,MAAM,WAAW,GAAG,CAAC,CAA0B,KAAI;AAC/C,QAAA,MAAM,MAAM,GAAG,CAAC,CAAC,MAAwB;QAEzC,IAAI,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,QAAQ,IAAI,OAAO,EAAE;AACrD,YAAA,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC;;AAEhC,KAAC;AAED,IAAA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE;AACvC;;;;"}

package/moderncssm/desktop/hooks/use-outside-scroll.d.ts

@@ -1,8 +0,0 @@
-import { type RefObject } from 'react';
-interface Params {
-    scrollableNodeRef: RefObject<HTMLDivElement>;
-    wheelDeltaY: number;
-}
-/** Изменение позиции скролла */
-export declare const useOutsideScroll: (params: Params) => void;
-export {};

package/moderncssm/desktop/hooks/use-outside-scroll.js

@@ -1,17 +0,0 @@
-import { useEffect } from 'react';
-
-/** Изменение позиции скролла */
-const useOutsideScroll = (params) => {
-    const { scrollableNodeRef, wheelDeltaY } = params;
-    useEffect(() => {
-        if (scrollableNodeRef.current) {
-            scrollableNodeRef.current.scrollBy({
-                top: wheelDeltaY,
-            });
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [wheelDeltaY]);
-};
-
-export { useOutsideScroll };
-//# sourceMappingURL=use-outside-scroll.js.map

package/moderncssm/desktop/hooks/use-outside-scroll.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-outside-scroll.js","sources":["../../../src/desktop/hooks/use-outside-scroll.ts"],"sourcesContent":["import { type RefObject, useEffect } from 'react';\n\ninterface Params {\n    scrollableNodeRef: RefObject<HTMLDivElement>;\n    wheelDeltaY: number;\n}\n\n/** Изменение позиции скролла */\nexport const useOutsideScroll = (params: Params) => {\n    const { scrollableNodeRef, wheelDeltaY } = params;\n\n    useEffect(() => {\n        if (scrollableNodeRef.current) {\n            scrollableNodeRef.current.scrollBy({\n                top: wheelDeltaY,\n            });\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [wheelDeltaY]);\n};\n"],"names":[],"mappings":";;AAOA;AACa,MAAA,gBAAgB,GAAG,CAAC,MAAc,KAAI;AAC/C,IAAA,MAAM,EAAE,iBAAiB,EAAE,WAAW,EAAE,GAAG,MAAM;IAEjD,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC3B,YAAA,iBAAiB,CAAC,OAAO,CAAC,QAAQ,CAAC;AAC/B,gBAAA,GAAG,EAAE,WAAW;AACnB,aAAA,CAAC;;;AAGV,KAAC,EAAE,CAAC,WAAW,CAAC,CAAC;AACrB;;;;"}

package/moderncssm/desktop/hooks/useModalWheel.d.ts

@@ -1,5 +0,0 @@
-import { type WheelEvent } from 'react';
-export declare const useModalWheel: (overlay: boolean) => {
-    wheelDeltaY: number;
-    handleWheel: (e: WheelEvent<HTMLElement>) => void;
-};

package/moderncssm/desktop/hooks/useModalWheel.js

@@ -1,16 +0,0 @@
-import { useState } from 'react';
-
-const useModalWheel = (overlay) => {
-    const [wheelDeltaY, setWheelDeltaY] = useState(0);
-    // передаем e.deltaY от события на элементе dialog компонента base-modal
-    const handleWheel = (e) => {
-        const target = e.target;
-        if (target.getAttribute('role') === 'dialog' && overlay) {
-            setWheelDeltaY(e.deltaY);
-        }
-    };
-    return { wheelDeltaY, handleWheel };
-};
-
-export { useModalWheel };
-//# sourceMappingURL=useModalWheel.js.map

package/moderncssm/desktop/hooks/useModalWheel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useModalWheel.js","sources":["../../../src/desktop/hooks/useModalWheel.ts"],"sourcesContent":["import { useState, type WheelEvent } from 'react';\n\nexport const useModalWheel = (overlay: boolean) => {\n    const [wheelDeltaY, setWheelDeltaY] = useState<number>(0);\n\n    // передаем e.deltaY от события на элементе dialog компонента base-modal\n    const handleWheel = (e: WheelEvent<HTMLElement>) => {\n        const target = e.target as HTMLDivElement;\n\n        if (target.getAttribute('role') === 'dialog' && overlay) {\n            setWheelDeltaY(e.deltaY);\n        }\n    };\n\n    return { wheelDeltaY, handleWheel };\n};\n"],"names":[],"mappings":";;AAEa,MAAA,aAAa,GAAG,CAAC,OAAgB,KAAI;IAC9C,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAS,CAAC,CAAC;;AAGzD,IAAA,MAAM,WAAW,GAAG,CAAC,CAA0B,KAAI;AAC/C,QAAA,MAAM,MAAM,GAAG,CAAC,CAAC,MAAwB;QAEzC,IAAI,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,QAAQ,IAAI,OAAO,EAAE;AACrD,YAAA,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC;;AAEhC,KAAC;AAED,IAAA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE;AACvC;;;;"}

package/src/desktop/hooks/use-outside-scroll.ts

@@ -1,20 +0,0 @@
-import { type RefObject, useEffect } from 'react';
-
-interface Params {
-    scrollableNodeRef: RefObject<HTMLDivElement>;
-    wheelDeltaY: number;
-}
-
-/** Изменение позиции скролла */
-export const useOutsideScroll = (params: Params) => {
-    const { scrollableNodeRef, wheelDeltaY } = params;
-
-    useEffect(() => {
-        if (scrollableNodeRef.current) {
-            scrollableNodeRef.current.scrollBy({
-                top: wheelDeltaY,
-            });
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [wheelDeltaY]);
-};

package/src/desktop/hooks/useModalWheel.ts

@@ -1,16 +0,0 @@
-import { useState, type WheelEvent } from 'react';
-
-export const useModalWheel = (overlay: boolean) => {
-    const [wheelDeltaY, setWheelDeltaY] = useState<number>(0);
-
-    // передаем e.deltaY от события на элементе dialog компонента base-modal
-    const handleWheel = (e: WheelEvent<HTMLElement>) => {
-        const target = e.target as HTMLDivElement;
-
-        if (target.getAttribute('role') === 'dialog' && overlay) {
-            setWheelDeltaY(e.deltaY);
-        }
-    };
-
-    return { wheelDeltaY, handleWheel };
-};