npm - @hh.ru/magritte-ui-menu - Versions diffs - 1.0.6 → 1.0.7 - Mend

@hh.ru/magritte-ui-menu 1.0.6 → 1.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (21) hide show

package/Item.js CHANGED Viewed

@@ -3,7 +3,6 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { forwardRef, useContext, useRef, useState, useEffect, cloneElement } from 'react';
 import { createPortal } from 'react-dom';
 import classnames from 'classnames';
-import { throttle } from '@hh.ru/magritte-common-func-utils';
 import { keyboardMatches, keyboardKeys } from '@hh.ru/magritte-common-keyboard';
 import { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';
 import { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';
@@ -13,10 +12,13 @@ import { CheckOutlinedSize24, ChevronRightOutlinedSize24 } from '@hh.ru/magritte
 import { DisabledWrapper } from './DisabledWrapper.js';
 import { DROP_PROPS } from './Drop.js';
 import { MenuContext } from './context.js';
+import { useSubmenuSafeZone } from './useSubmenuSafeZone.js';
 import { isSwitchComponent } from '@hh.ru/magritte-ui-switch';
 import { Text } from '@hh.ru/magritte-ui-typography';
-import { s as styles } from './menu-DURXc54a.js';
+import { s as styles } from './menu-DKXKF84l.js';
 import '@hh.ru/magritte-common-use-disabled';
+import '@hh.ru/magritte-common-func-utils';
+import './safeZone.js';
 const DEFAULT_ICON_PROPS = {
     neutral: {},
@@ -38,29 +40,6 @@ const SUBMENU_DROP_PLACEMENT = [
     'left-bottom',
     'left-center',
 ];
-const MIN_MOUSE_MOVE_SQUARED = 16;
-const MOUSE_MOVE_THROTTLE_MS = 50;
-const SCROLL_THROTTLE_MS = 300;
-const SUBMENU_CLOSE_DELAY_MS = 300;
-const sign = (P, A, B) => {
-    return (A.x - B.x) * (P.y - B.y) >= (P.x - B.x) * (A.y - B.y);
-};
-const isPointInsideTriangle = (P, A, B, C) => {
-    const values = [sign(P, A, B), sign(P, B, C), sign(P, C, A)];
-    return (values[0] && values[1] && values[2]) || (!values[0] && !values[1] && !values[2]);
-};
-const findNearestSubmenuEdge = (dropCoords, submenuCoords) => {
-    if (submenuCoords.right > dropCoords.right) {
-        return [
-            { x: submenuCoords.left, y: submenuCoords.top },
-            { x: submenuCoords.left, y: submenuCoords.bottom },
-        ];
-    }
-    return [
-        { x: submenuCoords.right, y: submenuCoords.top },
-        { x: submenuCoords.right, y: submenuCoords.bottom },
-    ];
-};
 const MenuItem = forwardRef(({ children, className, disabled = false, icon, subitems, selected, style = 'neutral', rightContent, subtitle, tag, ...props }, ref) => {
     const { isMobile } = useBreakpoint();
     const contextValue = useContext(MenuContext);
@@ -70,107 +49,30 @@ const MenuItem = forwardRef(({ children, className, disabled = false, icon, subi
     const submenuRef = useRef(null);
     const [hasHover, setHover] = useState(false);
     const [submenuVisible, setSubmenuVisible] = useState(false);
-    const submenuCloseTimeoutRef = useRef(null);
     const hasSwitch = !selected && isSwitchComponent(rightContent);
     const hasSubmenu = !selected && !isSwitchComponent(rightContent) && submenuAllowed && subitems;
+    const { trackPointer, cancelPendingClose } = useSubmenuSafeZone({
+        active: submenuVisible,
+        dropContainer: dropContainer ?? null,
+        itemRef,
+        submenuRef,
+        onClose: () => setSubmenuVisible(false),
+    });
     const showSubmenu = () => {
-        if (submenuCloseTimeoutRef.current !== null) {
-            clearTimeout(submenuCloseTimeoutRef.current);
-            submenuCloseTimeoutRef.current = null;
-        }
+        cancelPendingClose();
         setSubmenuVisible(true);
         setItemWithVisibleSubmenu?.(itemRef.current);
     };
-    const stateRef = useRef({
-        dropCoords: null,
-        prevMouseCoords: null,
-        submenuCoords: null,
-    });
     useEffect(() => {
         if (itemWithVisibleSubmenu !== itemRef.current) {
-            if (submenuCloseTimeoutRef.current !== null) {
-                clearTimeout(submenuCloseTimeoutRef.current);
-                submenuCloseTimeoutRef.current = null;
-            }
+            cancelPendingClose();
             setSubmenuVisible(false);
         }
-    }, [itemWithVisibleSubmenu]);
-    useEffect(() => {
-        if (!dropContainer || !itemRef.current || !submenuVisible || !submenuRef.current) {
-            return void 0;
-        }
-        const checkIfMouseIsMovingTowardsSubmenu = throttle((event) => {
-            const currentMouseCoords = { x: event.clientX, y: event.clientY };
-            const isMouseOverItemOrSubmenu = itemRef.current?.contains(event.target) ||
-                submenuRef.current?.contains(event.target);
-            if (isMouseOverItemOrSubmenu) {
-                if (submenuCloseTimeoutRef.current !== null) {
-                    clearTimeout(submenuCloseTimeoutRef.current);
-                    submenuCloseTimeoutRef.current = null;
-                }
-            }
-            else if (stateRef.current.dropCoords !== null &&
-                stateRef.current.prevMouseCoords !== null &&
-                stateRef.current.submenuCoords !== null) {
-                const deltaX = currentMouseCoords.x - stateRef.current.prevMouseCoords.x;
-                const deltaY = currentMouseCoords.y - stateRef.current.prevMouseCoords.y;
-                if (deltaX * deltaX + deltaY * deltaY < MIN_MOUSE_MOVE_SQUARED) {
-                    return;
-                }
-                const nearestSubmenuEdge = findNearestSubmenuEdge(stateRef.current.dropCoords, stateRef.current.submenuCoords);
-                const isMouseMovingTowardsSubmenu = isPointInsideTriangle(currentMouseCoords, stateRef.current.prevMouseCoords, nearestSubmenuEdge[0], nearestSubmenuEdge[1]);
-                if (isMouseMovingTowardsSubmenu && submenuCloseTimeoutRef.current !== null) {
-                    clearTimeout(submenuCloseTimeoutRef.current);
-                    submenuCloseTimeoutRef.current = null;
-                }
-                if (!isMouseMovingTowardsSubmenu && submenuCloseTimeoutRef.current === null) {
-                    submenuCloseTimeoutRef.current = setTimeout(() => {
-                        submenuCloseTimeoutRef.current = null;
-                        setSubmenuVisible(false);
-                    }, SUBMENU_CLOSE_DELAY_MS);
-                }
-            }
-            stateRef.current.prevMouseCoords = currentMouseCoords;
-        }, MOUSE_MOVE_THROTTLE_MS);
-        const checkIfMouseIsOverItemOrSubmenu = throttle(() => {
-            if (stateRef.current.prevMouseCoords !== null) {
-                const elementUnderMouse = document.elementFromPoint(stateRef.current.prevMouseCoords.x, stateRef.current.prevMouseCoords.y);
-                const isMouseOverItemOrSubmenu = itemRef.current?.contains(elementUnderMouse) || submenuRef.current?.contains(elementUnderMouse);
-                if (isMouseOverItemOrSubmenu && submenuCloseTimeoutRef.current !== null) {
-                    clearTimeout(submenuCloseTimeoutRef.current);
-                    submenuCloseTimeoutRef.current = null;
-                }
-                if (!isMouseOverItemOrSubmenu && submenuCloseTimeoutRef.current === null) {
-                    submenuCloseTimeoutRef.current = setTimeout(() => {
-                        submenuCloseTimeoutRef.current = null;
-                        setSubmenuVisible(false);
-                    }, SUBMENU_CLOSE_DELAY_MS);
-                }
-            }
-        }, SCROLL_THROTTLE_MS);
-        document.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
-        dropContainer.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
-        document.addEventListener('scroll', checkIfMouseIsOverItemOrSubmenu, { capture: true, passive: true });
-        stateRef.current.dropCoords = dropContainer.getBoundingClientRect();
-        stateRef.current.submenuCoords = submenuRef.current.getBoundingClientRect();
-        return () => {
-            document.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
-            dropContainer.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
-            document.removeEventListener('scroll', checkIfMouseIsOverItemOrSubmenu, { capture: true });
-            checkIfMouseIsMovingTowardsSubmenu.cancel();
-            checkIfMouseIsOverItemOrSubmenu.cancel();
-            if (submenuCloseTimeoutRef.current !== null) {
-                clearTimeout(submenuCloseTimeoutRef.current);
-                submenuCloseTimeoutRef.current = null;
-            }
-            stateRef.current = {
-                dropCoords: null,
-                prevMouseCoords: null,
-                submenuCoords: null,
-            };
-        };
-    }, [dropContainer, submenuVisible, setSubmenuVisible]);
+    }, [itemWithVisibleSubmenu, cancelPendingClose]);
     return (jsxs(Fragment, { children: [jsx(DisabledWrapper, { disabled: disabled, children: jsxs("div", { ...props, "aria-disabled": disabled, className: classnames(className, { [styles.disabled]: disabled }, styles.dropContentMargin, styles.item, styles[style]), onClick: (event) => {
+                        if (disabled) {
+                            return;
+                        }
                         props.onClick?.(event);
                         if (hasSwitch) {
                             rightContent.props.onClick?.();
@@ -179,6 +81,9 @@ const MenuItem = forwardRef(({ children, className, disabled = false, icon, subi
                             showSubmenu();
                         }
                     }, onKeyDown: (event) => {
+                        if (disabled) {
+                            return;
+                        }
                         props.onKeyDown?.(event);
                         if (keyboardMatches(event, [keyboardKeys.Enter, keyboardKeys.Space])) {
                             event.preventDefault();
@@ -193,26 +98,32 @@ const MenuItem = forwardRef(({ children, className, disabled = false, icon, subi
                             }
                         }
                     }, onMouseEnter: (event) => {
-                        props.onMouseEnter?.(event);
-                        if (!isMobile) {
-                            setHover(true);
-                            stateRef.current.prevMouseCoords = { x: event.clientX, y: event.clientY };
-                            if (hasSubmenu && !submenuVisible) {
-                                showSubmenu();
+                        if (!disabled) {
+                            props.onMouseEnter?.(event);
+                            if (!isMobile) {
+                                setHover(true);
+                                trackPointer({ x: event.clientX, y: event.clientY });
+                                if (hasSubmenu && !submenuVisible) {
+                                    showSubmenu();
+                                }
                             }
                         }
                     }, onMouseLeave: (event) => {
-                        props.onMouseLeave?.(event);
+                        if (!disabled) {
+                            props.onMouseLeave?.(event);
+                        }
                         if (!isMobile) {
                             setHover(false);
                         }
                     }, onMouseMove: (event) => {
-                        props.onMouseMove?.(event);
-                        if (!isMobile) {
-                            setHover(true);
-                            stateRef.current.prevMouseCoords = { x: event.clientX, y: event.clientY };
-                            if (hasSubmenu && !submenuVisible) {
-                                showSubmenu();
+                        if (!disabled) {
+                            props.onMouseMove?.(event);
+                            if (!isMobile) {
+                                setHover(true);
+                                trackPointer({ x: event.clientX, y: event.clientY });
+                                if (hasSubmenu && !submenuVisible) {
+                                    showSubmenu();
+                                }
                             }
                         }
                     }, ref: itemRefCallback, role: "menuitem", tabIndex: disabled ? -1 : 0, children: [icon && (jsx("div", { className: styles.itemIcon, children: jsx(IconDefaultPropsContext, { props: DEFAULT_ICON_PROPS[style], children: icon }) })), jsxs("div", { className: styles.itemText, children: [jsx(Text, { ellipsis: true, style: TEXT_STYLE[style], typography: isMobile ? 'label-2-regular' : 'label-3-regular', children: children }), subtitle && (jsx(Text, { ellipsis: true, style: SECONDARY_TEXT_STYLE[style], typography: "label-3-regular", children: subtitle }))] }), tag && (jsx("div", { className: styles.itemTag, children: cloneElement(tag, { onSurface: hasHover }) })), selected && (jsx("div", { className: styles.itemRightContent, children: jsx(CheckOutlinedSize24, { initialColor: "secondary" }) })), hasSwitch && (jsx("div", { className: styles.itemRightContent, onClick: (event) => event.stopPropagation(), children: rightContent })), hasSubmenu && (jsxs("div", { className: styles.itemRightContent, children: [jsx(Text, { ellipsis: true, style: SECONDARY_TEXT_STYLE[style], typography: "label-3-regular", children: rightContent }), jsx(ChevronRightOutlinedSize24, { initialColor: "secondary" })] }))] }) }), hasSubmenu && (jsxs(MenuContext.Provider, { value: { ...contextValue, submenuAllowed: false }, children: [jsx(Drop, { ...DROP_PROPS, activatorRef: itemRef, lockPlacement: true, onClose: () => setSubmenuVisible(false), placement: SUBMENU_DROP_PLACEMENT, ref: submenuRef, visible: visible && submenuVisible, children: subitems }), mobileSubmenuContainer &&

package/Item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Item.js","sources":["src/Item.tsx"],"sourcesContent":["import { cloneElement, forwardRef, useContext, useEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport classnames from 'classnames';\n\nimport { throttle } from '@hh.ru/magritte-common-func-utils';\nimport { keyboardKeys, keyboardMatches } from '@hh.ru/magritte-common-keyboard';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { type DropProps, Drop } from '@hh.ru/magritte-ui-drop';\nimport { type IconProps, IconDefaultPropsContext } from '@hh.ru/magritte-ui-icon';\nimport { CheckOutlinedSize24, ChevronRightOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { DisabledWrapper } from '@hh.ru/magritte-ui-menu/DisabledWrapper';\nimport { DROP_PROPS } from '@hh.ru/magritte-ui-menu/Drop';\nimport { MenuContext } from '@hh.ru/magritte-ui-menu/context';\nimport { type MenuItemProps } from '@hh.ru/magritte-ui-menu/types';\nimport { isSwitchComponent } from '@hh.ru/magritte-ui-switch';\nimport { type TagProps } from '@hh.ru/magritte-ui-tag';\nimport { type TextStyle, Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from './menu.less';\n\nconst DEFAULT_ICON_PROPS: Record<NonNullable<MenuItemProps['style']>, Partial<IconProps>> = {\n neutral: {},\n negative: { initialColor: 'negative' },\n};\n\nconst TEXT_STYLE: Record<NonNullable<MenuItemProps['style']>, TextStyle> = {\n neutral: 'primary',\n negative: 'negative',\n};\n\nconst SECONDARY_TEXT_STYLE: Record<NonNullable<MenuItemProps['style']>, TextStyle> = {\n neutral: 'secondary',\n negative: 'negative-secondary',\n};\n\nconst SUBMENU_DROP_PLACEMENT: DropProps['placement'] = [\n 'right-top',\n 'right-bottom',\n 'right-center',\n 'left-top',\n 'left-bottom',\n 'left-center',\n];\n\nconst MIN_MOUSE_MOVE_SQUARED = 16;\nconst MOUSE_MOVE_THROTTLE_MS = 50;\nconst SCROLL_THROTTLE_MS = 300;\nconst SUBMENU_CLOSE_DELAY_MS = 300;\n\ntype Point = { x: number; y: number };\n\nconst sign = (P: Point, A: Point, B: Point): boolean => {\n return (A.x - B.x) * (P.y - B.y) >= (P.x - B.x) * (A.y - B.y);\n};\n\nconst isPointInsideTriangle = (P: Point, A: Point, B: Point, C: Point): boolean => {\n const values = [sign(P, A, B), sign(P, B, C), sign(P, C, A)];\n return (values[0] && values[1] && values[2]) \|\| (!values[0] && !values[1] && !values[2]);\n};\n\nconst findNearestSubmenuEdge = (dropCoords: DOMRect, submenuCoords: DOMRect): [Point, Point] => {\n if (submenuCoords.right > dropCoords.right) {\n return [\n { x: submenuCoords.left, y: submenuCoords.top },\n { x: submenuCoords.left, y: submenuCoords.bottom },\n ];\n }\n return [\n { x: submenuCoords.right, y: submenuCoords.top },\n { x: submenuCoords.right, y: submenuCoords.bottom },\n ];\n};\n\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(\n (\n {\n children,\n className,\n disabled = false,\n icon,\n subitems,\n selected,\n style = 'neutral',\n rightContent,\n subtitle,\n tag,\n ...props\n },\n ref\n ) => {\n const { isMobile } = useBreakpoint();\n const contextValue = useContext(MenuContext);\n const {\n dropContainer,\n itemWithVisibleSubmenu,\n mobileSubmenuContainer,\n mobileTitleContainer,\n setItemWithVisibleSubmenu,\n submenuAllowed,\n visible,\n } = contextValue;\n const itemRef = useRef<HTMLDivElement>(null);\n const itemRefCallback = useMultipleRefs(itemRef, ref);\n const submenuRef = useRef<HTMLDivElement>(null);\n const [hasHover, setHover] = useState(false);\n const [submenuVisible, setSubmenuVisible] = useState(false);\n const submenuCloseTimeoutRef = useRef<ReturnType<typeof setTimeout> \| null>(null);\n\n const hasSwitch = !selected && isSwitchComponent(rightContent);\n const hasSubmenu = !selected && !isSwitchComponent(rightContent) && submenuAllowed && subitems;\n\n const showSubmenu = () => {\n if (submenuCloseTimeoutRef.current !== null) {\n clearTimeout(submenuCloseTimeoutRef.current);\n submenuCloseTimeoutRef.current = null;\n }\n setSubmenuVisible(true);\n setItemWithVisibleSubmenu?.(itemRef.current);\n };\n\n const stateRef = useRef<{\n dropCoords: DOMRect \| null;\n prevMouseCoords: Point \| null;\n submenuCoords: DOMRect \| null;\n }>({\n dropCoords: null,\n prevMouseCoords: null,\n submenuCoords: null,\n });\n\n useEffect(() => {\n if (itemWithVisibleSubmenu !== itemRef.current) {\n if (submenuCloseTimeoutRef.current !== null) {\n clearTimeout(submenuCloseTimeoutRef.current);\n submenuCloseTimeoutRef.current = null;\n }\n setSubmenuVisible(false);\n }\n }, [itemWithVisibleSubmenu]);\n\n useEffect(() => {\n if (!dropContainer \|\| !itemRef.current \|\| !submenuVisible \|\| !submenuRef.current) {\n return void 0;\n }\n\n const checkIfMouseIsMovingTowardsSubmenu = throttle((event: MouseEvent) => {\n const currentMouseCoords: Point = { x: event.clientX, y: event.clientY };\n\n const isMouseOverItemOrSubmenu =\n itemRef.current?.contains(event.target as HTMLElement) \|\|\n submenuRef.current?.contains(event.target as HTMLElement);\n\n if (isMouseOverItemOrSubmenu) {\n if (submenuCloseTimeoutRef.current !== null) {\n clearTimeout(submenuCloseTimeoutRef.current);\n submenuCloseTimeoutRef.current = null;\n }\n } else if (\n stateRef.current.dropCoords !== null &&\n stateRef.current.prevMouseCoords !== null &&\n stateRef.current.submenuCoords !== null\n ) {\n const deltaX = currentMouseCoords.x - stateRef.current.prevMouseCoords.x;\n const deltaY = currentMouseCoords.y - stateRef.current.prevMouseCoords.y;\n if (deltaX * deltaX + deltaY * deltaY < MIN_MOUSE_MOVE_SQUARED) {\n return;\n }\n\n const nearestSubmenuEdge = findNearestSubmenuEdge(\n stateRef.current.dropCoords,\n stateRef.current.submenuCoords\n );\n\n const isMouseMovingTowardsSubmenu = isPointInsideTriangle(\n currentMouseCoords,\n stateRef.current.prevMouseCoords,\n nearestSubmenuEdge[0],\n nearestSubmenuEdge[1]\n );\n\n if (isMouseMovingTowardsSubmenu && submenuCloseTimeoutRef.current !== null) {\n clearTimeout(submenuCloseTimeoutRef.current);\n submenuCloseTimeoutRef.current = null;\n }\n\n if (!isMouseMovingTowardsSubmenu && submenuCloseTimeoutRef.current === null) {\n submenuCloseTimeoutRef.current = setTimeout(() => {\n submenuCloseTimeoutRef.current = null;\n setSubmenuVisible(false);\n }, SUBMENU_CLOSE_DELAY_MS);\n }\n }\n\n stateRef.current.prevMouseCoords = currentMouseCoords;\n }, MOUSE_MOVE_THROTTLE_MS);\n\n const checkIfMouseIsOverItemOrSubmenu = throttle(() => {\n if (stateRef.current.prevMouseCoords !== null) {\n const elementUnderMouse = document.elementFromPoint(\n stateRef.current.prevMouseCoords.x,\n stateRef.current.prevMouseCoords.y\n );\n\n const isMouseOverItemOrSubmenu =\n itemRef.current?.contains(elementUnderMouse) \|\| submenuRef.current?.contains(elementUnderMouse);\n\n if (isMouseOverItemOrSubmenu && submenuCloseTimeoutRef.current !== null) {\n clearTimeout(submenuCloseTimeoutRef.current);\n submenuCloseTimeoutRef.current = null;\n }\n\n if (!isMouseOverItemOrSubmenu && submenuCloseTimeoutRef.current === null) {\n submenuCloseTimeoutRef.current = setTimeout(() => {\n submenuCloseTimeoutRef.current = null;\n setSubmenuVisible(false);\n }, SUBMENU_CLOSE_DELAY_MS);\n }\n }\n }, SCROLL_THROTTLE_MS);\n\n document.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n dropContainer.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n document.addEventListener('scroll', checkIfMouseIsOverItemOrSubmenu, { capture: true, passive: true });\n\n stateRef.current.dropCoords = dropContainer.getBoundingClientRect();\n stateRef.current.submenuCoords = submenuRef.current.getBoundingClientRect();\n\n return () => {\n document.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n dropContainer.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n document.removeEventListener('scroll', checkIfMouseIsOverItemOrSubmenu, { capture: true });\n checkIfMouseIsMovingTowardsSubmenu.cancel();\n checkIfMouseIsOverItemOrSubmenu.cancel();\n\n if (submenuCloseTimeoutRef.current !== null) {\n clearTimeout(submenuCloseTimeoutRef.current);\n submenuCloseTimeoutRef.current = null;\n }\n\n stateRef.current = {\n dropCoords: null,\n prevMouseCoords: null,\n submenuCoords: null,\n };\n };\n }, [dropContainer, submenuVisible, setSubmenuVisible]);\n\n return (\n <>\n <DisabledWrapper disabled={disabled}>\n <div\n {...props}\n aria-disabled={disabled}\n className={classnames(\n className,\n { [styles.disabled]: disabled },\n styles.dropContentMargin,\n styles.item,\n styles[style]\n )}\n onClick={(event) => {\n props.onClick?.(event);\n if (hasSwitch) {\n rightContent.props.onClick?.();\n }\n if (hasSubmenu) {\n showSubmenu();\n }\n }}\n onKeyDown={(event) => {\n props.onKeyDown?.(event);\n if (keyboardMatches(event, [keyboardKeys.Enter, keyboardKeys.Space])) {\n event.preventDefault();\n if (hasSwitch) {\n rightContent.props.onClick?.();\n } else if (hasSubmenu) {\n showSubmenu();\n } else {\n (event.target as HTMLElement).click();\n }\n }\n }}\n onMouseEnter={(event) => {\n props.onMouseEnter?.(event);\n if (!isMobile) {\n setHover(true);\n stateRef.current.prevMouseCoords = { x: event.clientX, y: event.clientY };\n\n if (hasSubmenu && !submenuVisible) {\n showSubmenu();\n }\n }\n }}\n onMouseLeave={(event) => {\n props.onMouseLeave?.(event);\n if (!isMobile) {\n setHover(false);\n }\n }}\n onMouseMove={(event) => {\n props.onMouseMove?.(event);\n if (!isMobile) {\n setHover(true);\n stateRef.current.prevMouseCoords = { x: event.clientX, y: event.clientY };\n\n if (hasSubmenu && !submenuVisible) {\n showSubmenu();\n }\n }\n }}\n ref={itemRefCallback}\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n >\n {icon && (\n <div className={styles.itemIcon}>\n <IconDefaultPropsContext props={DEFAULT_ICON_PROPS[style]}>\n {icon}\n </IconDefaultPropsContext>\n </div>\n )}\n <div className={styles.itemText}>\n <Text\n ellipsis\n style={TEXT_STYLE[style]}\n typography={isMobile ? 'label-2-regular' : 'label-3-regular'}\n >\n {children}\n </Text>\n {subtitle && (\n <Text ellipsis style={SECONDARY_TEXT_STYLE[style]} typography=\"label-3-regular\">\n {subtitle}\n </Text>\n )}\n </div>\n {tag && (\n <div className={styles.itemTag}>\n {cloneElement(tag as React.ReactElement<TagProps>, { onSurface: hasHover })}\n </div>\n )}\n {selected && (\n <div className={styles.itemRightContent}>\n <CheckOutlinedSize24 initialColor=\"secondary\" />\n </div>\n )}\n {hasSwitch && (\n <div className={styles.itemRightContent} onClick={(event) => event.stopPropagation()}>\n {rightContent}\n </div>\n )}\n {hasSubmenu && (\n <div className={styles.itemRightContent}>\n <Text ellipsis style={SECONDARY_TEXT_STYLE[style]} typography=\"label-3-regular\">\n {rightContent}\n </Text>\n <ChevronRightOutlinedSize24 initialColor=\"secondary\" />\n </div>\n )}\n </div>\n </DisabledWrapper>\n {hasSubmenu && (\n <MenuContext.Provider value={{ ...contextValue, submenuAllowed: false }}>\n <Drop\n {...DROP_PROPS}\n activatorRef={itemRef}\n lockPlacement\n onClose={() => setSubmenuVisible(false)}\n placement={SUBMENU_DROP_PLACEMENT}\n ref={submenuRef}\n visible={visible && submenuVisible}\n >\n {subitems}\n </Drop>\n {mobileSubmenuContainer &&\n createPortal(submenuVisible ? subitems : null, mobileSubmenuContainer)}\n {mobileTitleContainer && createPortal(submenuVisible ? children : null, mobileTitleContainer)}\n </MenuContext.Provider>\n )}\n </>\n );\n }\n);\n\nMenuItem.displayName = 'MenuItem';\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
1	+ {"version":3,"file":"Item.js","sources":["src/Item.tsx"],"sourcesContent":["import { cloneElement, forwardRef, useContext, useEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport classnames from 'classnames';\n\nimport { keyboardKeys, keyboardMatches } from '@hh.ru/magritte-common-keyboard';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { type DropProps, Drop } from '@hh.ru/magritte-ui-drop';\nimport { type IconProps, IconDefaultPropsContext } from '@hh.ru/magritte-ui-icon';\nimport { CheckOutlinedSize24, ChevronRightOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { DisabledWrapper } from '@hh.ru/magritte-ui-menu/DisabledWrapper';\nimport { DROP_PROPS } from '@hh.ru/magritte-ui-menu/Drop';\nimport { MenuContext } from '@hh.ru/magritte-ui-menu/context';\nimport { type MenuItemProps } from '@hh.ru/magritte-ui-menu/types';\nimport { useSubmenuSafeZone } from '@hh.ru/magritte-ui-menu/useSubmenuSafeZone';\nimport { isSwitchComponent } from '@hh.ru/magritte-ui-switch';\nimport { type TagProps } from '@hh.ru/magritte-ui-tag';\nimport { type TextStyle, Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from './menu.less';\n\nconst DEFAULT_ICON_PROPS: Record<NonNullable<MenuItemProps['style']>, Partial<IconProps>> = {\n neutral: {},\n negative: { initialColor: 'negative' },\n};\n\nconst TEXT_STYLE: Record<NonNullable<MenuItemProps['style']>, TextStyle> = {\n neutral: 'primary',\n negative: 'negative',\n};\n\nconst SECONDARY_TEXT_STYLE: Record<NonNullable<MenuItemProps['style']>, TextStyle> = {\n neutral: 'secondary',\n negative: 'negative-secondary',\n};\n\nconst SUBMENU_DROP_PLACEMENT: DropProps['placement'] = [\n 'right-top',\n 'right-bottom',\n 'right-center',\n 'left-top',\n 'left-bottom',\n 'left-center',\n];\n\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(\n (\n {\n children,\n className,\n disabled = false,\n icon,\n subitems,\n selected,\n style = 'neutral',\n rightContent,\n subtitle,\n tag,\n ...props\n },\n ref\n ) => {\n const { isMobile } = useBreakpoint();\n const contextValue = useContext(MenuContext);\n const {\n dropContainer,\n itemWithVisibleSubmenu,\n mobileSubmenuContainer,\n mobileTitleContainer,\n setItemWithVisibleSubmenu,\n submenuAllowed,\n visible,\n } = contextValue;\n const itemRef = useRef<HTMLDivElement>(null);\n const itemRefCallback = useMultipleRefs(itemRef, ref);\n const submenuRef = useRef<HTMLDivElement>(null);\n const [hasHover, setHover] = useState(false);\n const [submenuVisible, setSubmenuVisible] = useState(false);\n\n const hasSwitch = !selected && isSwitchComponent(rightContent);\n const hasSubmenu = !selected && !isSwitchComponent(rightContent) && submenuAllowed && subitems;\n\n const { trackPointer, cancelPendingClose } = useSubmenuSafeZone({\n active: submenuVisible,\n dropContainer: dropContainer ?? null,\n itemRef,\n submenuRef,\n onClose: () => setSubmenuVisible(false),\n });\n\n const showSubmenu = () => {\n cancelPendingClose();\n setSubmenuVisible(true);\n setItemWithVisibleSubmenu?.(itemRef.current);\n };\n\n useEffect(() => {\n if (itemWithVisibleSubmenu !== itemRef.current) {\n cancelPendingClose();\n setSubmenuVisible(false);\n }\n }, [itemWithVisibleSubmenu, cancelPendingClose]);\n\n return (\n <>\n <DisabledWrapper disabled={disabled}>\n <div\n {...props}\n aria-disabled={disabled}\n className={classnames(\n className,\n { [styles.disabled]: disabled },\n styles.dropContentMargin,\n styles.item,\n styles[style]\n )}\n onClick={(event) => {\n if (disabled) {\n return;\n }\n props.onClick?.(event);\n if (hasSwitch) {\n rightContent.props.onClick?.();\n }\n if (hasSubmenu) {\n showSubmenu();\n }\n }}\n onKeyDown={(event) => {\n if (disabled) {\n return;\n }\n props.onKeyDown?.(event);\n if (keyboardMatches(event, [keyboardKeys.Enter, keyboardKeys.Space])) {\n event.preventDefault();\n if (hasSwitch) {\n rightContent.props.onClick?.();\n } else if (hasSubmenu) {\n showSubmenu();\n } else {\n (event.target as HTMLElement).click();\n }\n }\n }}\n onMouseEnter={(event) => {\n if (!disabled) {\n props.onMouseEnter?.(event);\n if (!isMobile) {\n setHover(true);\n trackPointer({ x: event.clientX, y: event.clientY });\n\n if (hasSubmenu && !submenuVisible) {\n showSubmenu();\n }\n }\n }\n }}\n onMouseLeave={(event) => {\n if (!disabled) {\n props.onMouseLeave?.(event);\n }\n if (!isMobile) {\n setHover(false);\n }\n }}\n onMouseMove={(event) => {\n if (!disabled) {\n props.onMouseMove?.(event);\n if (!isMobile) {\n setHover(true);\n trackPointer({ x: event.clientX, y: event.clientY });\n\n if (hasSubmenu && !submenuVisible) {\n showSubmenu();\n }\n }\n }\n }}\n ref={itemRefCallback}\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n >\n {icon && (\n <div className={styles.itemIcon}>\n <IconDefaultPropsContext props={DEFAULT_ICON_PROPS[style]}>\n {icon}\n </IconDefaultPropsContext>\n </div>\n )}\n <div className={styles.itemText}>\n <Text\n ellipsis\n style={TEXT_STYLE[style]}\n typography={isMobile ? 'label-2-regular' : 'label-3-regular'}\n >\n {children}\n </Text>\n {subtitle && (\n <Text ellipsis style={SECONDARY_TEXT_STYLE[style]} typography=\"label-3-regular\">\n {subtitle}\n </Text>\n )}\n </div>\n {tag && (\n <div className={styles.itemTag}>\n {cloneElement(tag as React.ReactElement<TagProps>, { onSurface: hasHover })}\n </div>\n )}\n {selected && (\n <div className={styles.itemRightContent}>\n <CheckOutlinedSize24 initialColor=\"secondary\" />\n </div>\n )}\n {hasSwitch && (\n <div className={styles.itemRightContent} onClick={(event) => event.stopPropagation()}>\n {rightContent}\n </div>\n )}\n {hasSubmenu && (\n <div className={styles.itemRightContent}>\n <Text ellipsis style={SECONDARY_TEXT_STYLE[style]} typography=\"label-3-regular\">\n {rightContent}\n </Text>\n <ChevronRightOutlinedSize24 initialColor=\"secondary\" />\n </div>\n )}\n </div>\n </DisabledWrapper>\n {hasSubmenu && (\n <MenuContext.Provider value={{ ...contextValue, submenuAllowed: false }}>\n <Drop\n {...DROP_PROPS}\n activatorRef={itemRef}\n lockPlacement\n onClose={() => setSubmenuVisible(false)}\n placement={SUBMENU_DROP_PLACEMENT}\n ref={submenuRef}\n visible={visible && submenuVisible}\n >\n {subitems}\n </Drop>\n {mobileSubmenuContainer &&\n createPortal(submenuVisible ? subitems : null, mobileSubmenuContainer)}\n {mobileTitleContainer && createPortal(submenuVisible ? children : null, mobileTitleContainer)}\n </MenuContext.Provider>\n )}\n </>\n );\n }\n);\n\nMenuItem.displayName = 'MenuItem';\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/Menu.js CHANGED Viewed

@@ -13,18 +13,20 @@ import { MenuQuickActions } from './QuickActions.js';
 import { MenuSectionHeader } from './SectionHeader.js';
 import { MenuContext } from './context.js';
 import { NavBar } from '@hh.ru/magritte-ui-nav-bar';
-import { s as styles } from './menu-DURXc54a.js';
+import { s as styles } from './menu-DKXKF84l.js';
 import '@hh.ru/magritte-ui-bottom-sheet';
 import '@hh.ru/magritte-ui-divider';
 import '@hh.ru/magritte-ui-drop';
 import 'react-dom';
-import '@hh.ru/magritte-common-func-utils';
 import '@hh.ru/magritte-common-keyboard';
 import '@hh.ru/magritte-common-use-multiple-refs';
 import '@hh.ru/magritte-ui-icon';
 import './DisabledWrapper.js';
 import '@hh.ru/magritte-common-use-disabled';
 import '@hh.ru/magritte-ui-typography';
+import './useSubmenuSafeZone.js';
+import '@hh.ru/magritte-common-func-utils';
+import './safeZone.js';
 import '@hh.ru/magritte-ui-switch';
 import '@hh.ru/magritte-ui-section-header';

package/Menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.js","sources":["src/Menu.tsx"],"sourcesContent":["import { useLayoutEffect, useRef, useState } from 'react';\nimport classnames from 'classnames';\n\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { ChevronLeftOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { MenuBottomSheet } from '@hh.ru/magritte-ui-menu/BottomSheet';\nimport { MenuDivider } from '@hh.ru/magritte-ui-menu/Divider';\nimport { MenuDrop } from '@hh.ru/magritte-ui-menu/Drop';\nimport { MenuItem } from '@hh.ru/magritte-ui-menu/Item';\nimport { MenuQuickAction } from '@hh.ru/magritte-ui-menu/QuickAction';\nimport { MenuQuickActions } from '@hh.ru/magritte-ui-menu/QuickActions';\nimport { MenuSectionHeader } from '@hh.ru/magritte-ui-menu/SectionHeader';\nimport { type MenuContextProps, MenuContext } from '@hh.ru/magritte-ui-menu/context';\nimport { type MenuProps } from '@hh.ru/magritte-ui-menu/types';\nimport { NavBar } from '@hh.ru/magritte-ui-nav-bar';\n\nimport styles from './menu.less';\n\ninterface MenuComponents {\n BottomSheet: typeof MenuBottomSheet;\n Divider: typeof MenuDivider;\n Drop: typeof MenuDrop;\n Item: typeof MenuItem;\n QuickAction: typeof MenuQuickAction;\n QuickActions: typeof MenuQuickActions;\n SectionHeader: typeof MenuSectionHeader;\n}\n\nexport const Menu: React.FC<MenuProps> & MenuComponents = ({\n activatorRef,\n children,\n onClose,\n placement,\n visible,\n render,\n}) => {\n const { isMobile } = useBreakpoint();\n const mobileMenuContainerRef = useRef<HTMLDivElement>(null);\n const [mobileSubmenuContainer, setMobileSubmenuContainer] = useState<HTMLDivElement \| null>(null);\n const [mobileTitleContainer, setMobileTitleContainer] = useState<HTMLDivElement \| null>(null);\n const [itemWithVisibleSubmenu, setItemWithVisibleSubmenu] = useState<HTMLDivElement \| null>(null);\n const [dropContainer, setDropContainer] = useState<HTMLDivElement \| null>(null);\n\n const contextValue: MenuContextProps = {\n activatorRef,\n dropContainer,\n itemWithVisibleSubmenu,\n mobileSubmenuContainer,\n mobileTitleContainer,\n onAfterExit: () => {\n setItemWithVisibleSubmenu(null);\n },\n onClose,\n placement,\n setDropContainer,\n setItemWithVisibleSubmenu,\n submenuAllowed: true,\n visible,\n };\n\n useLayoutEffect(() => {\n const mobileMenuContainer = mobileMenuContainerRef.current;\n if (!mobileMenuContainer) {\n return;\n }\n\n mobileMenuContainer.style.height =\n itemWithVisibleSubmenu !== null && mobileSubmenuContainer !== null\n ? `${mobileSubmenuContainer.offsetHeight}px`\n : ``;\n }, [itemWithVisibleSubmenu, mobileSubmenuContainer]);\n\n if (isMobile) {\n const mobileChildren = (\n <div\n className={classnames(styles.mobileMenuContainer, {\n [styles.mobileMenuContainerSlide]: itemWithVisibleSubmenu !== null,\n })}\n ref={mobileMenuContainerRef}\n >\n <div className={styles.mobileMainMenuContainer}>{children}</div>\n <div className={styles.mobileSubmenuContainer} ref={setMobileSubmenuContainer} />\n </div>\n );\n\n const closeMobileSubmenu = () => setItemWithVisibleSubmenu(null);\n\n return (\n <MenuContext.Provider value={contextValue}>\n {render ? (\n render({\n children: mobileChildren,\n closeMobileSubmenu,\n mobileSubmenuVisible: itemWithVisibleSubmenu !== null,\n })\n ) : (\n <Menu.BottomSheet\n header={\n itemWithVisibleSubmenu !== null && (\n <NavBar>\n <NavBar.Actions\n centered\n left={<ChevronLeftOutlinedSize24 onClick={closeMobileSubmenu} />}\n >\n <NavBar.TitleContainer centered title={<div ref={setMobileTitleContainer} />} />\n </NavBar.Actions>\n </NavBar>\n )\n }\n >\n {mobileChildren}\n </Menu.BottomSheet>\n )}\n </MenuContext.Provider>\n );\n }\n\n return (\n <MenuContext.Provider value={contextValue}>\n {render ? render({ children }) : <Menu.Drop>{children}</Menu.Drop>}\n </MenuContext.Provider>\n );\n};\n\nMenu.BottomSheet = MenuBottomSheet;\nMenu.Divider = MenuDivider;\nMenu.Drop = MenuDrop;\nMenu.Item = MenuItem;\nMenu.QuickAction = MenuQuickAction;\nMenu.QuickActions = MenuQuickActions;\nMenu.SectionHeader = MenuSectionHeader;\n"],"names":["_jsxs","_jsx"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~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"}
1	+ {"version":3,"file":"Menu.js","sources":["src/Menu.tsx"],"sourcesContent":["import { useLayoutEffect, useRef, useState } from 'react';\nimport classnames from 'classnames';\n\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { ChevronLeftOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { MenuBottomSheet } from '@hh.ru/magritte-ui-menu/BottomSheet';\nimport { MenuDivider } from '@hh.ru/magritte-ui-menu/Divider';\nimport { MenuDrop } from '@hh.ru/magritte-ui-menu/Drop';\nimport { MenuItem } from '@hh.ru/magritte-ui-menu/Item';\nimport { MenuQuickAction } from '@hh.ru/magritte-ui-menu/QuickAction';\nimport { MenuQuickActions } from '@hh.ru/magritte-ui-menu/QuickActions';\nimport { MenuSectionHeader } from '@hh.ru/magritte-ui-menu/SectionHeader';\nimport { type MenuContextProps, MenuContext } from '@hh.ru/magritte-ui-menu/context';\nimport { type MenuProps } from '@hh.ru/magritte-ui-menu/types';\nimport { NavBar } from '@hh.ru/magritte-ui-nav-bar';\n\nimport styles from './menu.less';\n\ninterface MenuComponents {\n BottomSheet: typeof MenuBottomSheet;\n Divider: typeof MenuDivider;\n Drop: typeof MenuDrop;\n Item: typeof MenuItem;\n QuickAction: typeof MenuQuickAction;\n QuickActions: typeof MenuQuickActions;\n SectionHeader: typeof MenuSectionHeader;\n}\n\nexport const Menu: React.FC<MenuProps> & MenuComponents = ({\n activatorRef,\n children,\n onClose,\n placement,\n visible,\n render,\n}) => {\n const { isMobile } = useBreakpoint();\n const mobileMenuContainerRef = useRef<HTMLDivElement>(null);\n const [mobileSubmenuContainer, setMobileSubmenuContainer] = useState<HTMLDivElement \| null>(null);\n const [mobileTitleContainer, setMobileTitleContainer] = useState<HTMLDivElement \| null>(null);\n const [itemWithVisibleSubmenu, setItemWithVisibleSubmenu] = useState<HTMLDivElement \| null>(null);\n const [dropContainer, setDropContainer] = useState<HTMLDivElement \| null>(null);\n\n const contextValue: MenuContextProps = {\n activatorRef,\n dropContainer,\n itemWithVisibleSubmenu,\n mobileSubmenuContainer,\n mobileTitleContainer,\n onAfterExit: () => {\n setItemWithVisibleSubmenu(null);\n },\n onClose,\n placement,\n setDropContainer,\n setItemWithVisibleSubmenu,\n submenuAllowed: true,\n visible,\n };\n\n useLayoutEffect(() => {\n const mobileMenuContainer = mobileMenuContainerRef.current;\n if (!mobileMenuContainer) {\n return;\n }\n\n mobileMenuContainer.style.height =\n itemWithVisibleSubmenu !== null && mobileSubmenuContainer !== null\n ? `${mobileSubmenuContainer.offsetHeight}px`\n : ``;\n }, [itemWithVisibleSubmenu, mobileSubmenuContainer]);\n\n if (isMobile) {\n const mobileChildren = (\n <div\n className={classnames(styles.mobileMenuContainer, {\n [styles.mobileMenuContainerSlide]: itemWithVisibleSubmenu !== null,\n })}\n ref={mobileMenuContainerRef}\n >\n <div className={styles.mobileMainMenuContainer}>{children}</div>\n <div className={styles.mobileSubmenuContainer} ref={setMobileSubmenuContainer} />\n </div>\n );\n\n const closeMobileSubmenu = () => setItemWithVisibleSubmenu(null);\n\n return (\n <MenuContext.Provider value={contextValue}>\n {render ? (\n render({\n children: mobileChildren,\n closeMobileSubmenu,\n mobileSubmenuVisible: itemWithVisibleSubmenu !== null,\n })\n ) : (\n <Menu.BottomSheet\n header={\n itemWithVisibleSubmenu !== null && (\n <NavBar>\n <NavBar.Actions\n centered\n left={<ChevronLeftOutlinedSize24 onClick={closeMobileSubmenu} />}\n >\n <NavBar.TitleContainer centered title={<div ref={setMobileTitleContainer} />} />\n </NavBar.Actions>\n </NavBar>\n )\n }\n >\n {mobileChildren}\n </Menu.BottomSheet>\n )}\n </MenuContext.Provider>\n );\n }\n\n return (\n <MenuContext.Provider value={contextValue}>\n {render ? render({ children }) : <Menu.Drop>{children}</Menu.Drop>}\n </MenuContext.Provider>\n );\n};\n\nMenu.BottomSheet = MenuBottomSheet;\nMenu.Divider = MenuDivider;\nMenu.Drop = MenuDrop;\nMenu.Item = MenuItem;\nMenu.QuickAction = MenuQuickAction;\nMenu.QuickActions = MenuQuickActions;\nMenu.SectionHeader = MenuSectionHeader;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/QuickAction.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { forwardRef } from 'react';
 import classnames from 'classnames';
 import { DisabledWrapper } from './DisabledWrapper.js';
 import { Text } from '@hh.ru/magritte-ui-typography';
-import { s as styles } from './menu-DURXc54a.js';
+import { s as styles } from './menu-DKXKF84l.js';
 import '@hh.ru/magritte-common-use-disabled';
 import '@hh.ru/magritte-ui-icon';

package/QuickActions.js CHANGED Viewed

@@ -2,7 +2,7 @@ import './index.css';
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import classnames from 'classnames';
-import { s as styles } from './menu-DURXc54a.js';
+import { s as styles } from './menu-DKXKF84l.js';
 const MenuQuickActions = forwardRef(({ children, className, ...props }, ref) => {
     return (jsx("div", { ...props, className: classnames(className, styles.quickActions), ref: ref, children: children }));

package/SectionHeader.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';
 import { SectionHeader } from '@hh.ru/magritte-ui-section-header';
-import { s as styles } from './menu-DURXc54a.js';
+import { s as styles } from './menu-DKXKF84l.js';
 const MenuSectionHeader = forwardRef((props, ref) => {
     const { isMobile } = useBreakpoint();

package/index.css CHANGED Viewed

@@ -19,159 +19,159 @@
   --magritte-color-background-state-negative-secondary-hovered-v24-7-3:#3D2622;
   --magritte-color-background-state-negative-secondary-pressed-v24-7-3:#3D2622;
 }
-.magritte-disabled___ZuG-J_1-0-6{
+.magritte-disabled___ZuG-J_1-0-7{
   pointer-events:none;
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-drop-content-margin___q01ll_1-0-6{
+  body.magritte-old-layout .magritte-drop-content-margin___q01ll_1-0-7{
     margin:0 12px;
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-drop-content-margin___q01ll_1-0-6{
+  body:not(.magritte-old-layout) .magritte-drop-content-margin___q01ll_1-0-7{
     margin:0 12px;
   }
 }
-.magritte-item___HyDAw_1-0-6{
+.magritte-item___HyDAw_1-0-7{
   display:flex;
   gap:12px;
   align-items:center;
   padding:12px 16px;
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-item___HyDAw_1-0-6{
+  body.magritte-old-layout .magritte-item___HyDAw_1-0-7{
     cursor:pointer;
     border-radius:12px;
     padding:10px 12px;
   }
-  body.magritte-old-layout .magritte-item___HyDAw_1-0-6.focus-visible{
+  body.magritte-old-layout .magritte-item___HyDAw_1-0-7.focus-visible{
     outline:4px solid var(--magritte-color-stroke-state-focused-accessible-v24-7-3);
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-item___HyDAw_1-0-6{
+  body:not(.magritte-old-layout) .magritte-item___HyDAw_1-0-7{
     cursor:pointer;
     border-radius:12px;
     padding:10px 12px;
   }
-  body:not(.magritte-old-layout) .magritte-item___HyDAw_1-0-6.focus-visible{
+  body:not(.magritte-old-layout) .magritte-item___HyDAw_1-0-7.focus-visible{
     outline:4px solid var(--magritte-color-stroke-state-focused-accessible-v24-7-3);
   }
 }
-.magritte-neutral___WyGeQ_1-0-6:active{
+.magritte-neutral___WyGeQ_1-0-7:active{
   background-color:var(--magritte-color-background-state-secondary-pressed-v24-7-3);
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-neutral___WyGeQ_1-0-6:hover:not(:active){
+  body.magritte-old-layout .magritte-neutral___WyGeQ_1-0-7:hover:not(:active){
     background-color:var(--magritte-color-background-state-secondary-hovered-v24-7-3);
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-neutral___WyGeQ_1-0-6:hover:not(:active){
+  body:not(.magritte-old-layout) .magritte-neutral___WyGeQ_1-0-7:hover:not(:active){
     background-color:var(--magritte-color-background-state-secondary-hovered-v24-7-3);
   }
 }
-.magritte-negative___F7a0c_1-0-6:active{
+.magritte-negative___F7a0c_1-0-7:active{
   background-color:var(--magritte-color-background-state-negative-secondary-pressed-v24-7-3);
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-negative___F7a0c_1-0-6:hover:not(:active){
+  body.magritte-old-layout .magritte-negative___F7a0c_1-0-7:hover:not(:active){
     background-color:var(--magritte-color-background-state-negative-secondary-hovered-v24-7-3);
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-negative___F7a0c_1-0-6:hover:not(:active){
+  body:not(.magritte-old-layout) .magritte-negative___F7a0c_1-0-7:hover:not(:active){
     background-color:var(--magritte-color-background-state-negative-secondary-hovered-v24-7-3);
   }
 }
-.magritte-item-icon___yCv9l_1-0-6{
+.magritte-item-icon___yCv9l_1-0-7{
   flex:0 0 auto;
   padding:4px 0;
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-item-icon___yCv9l_1-0-6{
+  body.magritte-old-layout .magritte-item-icon___yCv9l_1-0-7{
     padding:0;
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-item-icon___yCv9l_1-0-6{
+  body:not(.magritte-old-layout) .magritte-item-icon___yCv9l_1-0-7{
     padding:0;
   }
 }
-.magritte-item-text___GL3A5_1-0-6{
+.magritte-item-text___GL3A5_1-0-7{
   flex:1 1 auto;
   min-width:0;
   padding:4px 0;
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-item-text___GL3A5_1-0-6{
+  body.magritte-old-layout .magritte-item-text___GL3A5_1-0-7{
     padding:0;
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-item-text___GL3A5_1-0-6{
+  body:not(.magritte-old-layout) .magritte-item-text___GL3A5_1-0-7{
     padding:0;
   }
 }
-.magritte-item-tag___KX5wL_1-0-6{
+.magritte-item-tag___KX5wL_1-0-7{
   flex:0 1 auto;
   min-width:0;
   padding:4px 0;
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-item-tag___KX5wL_1-0-6{
+  body.magritte-old-layout .magritte-item-tag___KX5wL_1-0-7{
     padding:0;
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-item-tag___KX5wL_1-0-6{
+  body:not(.magritte-old-layout) .magritte-item-tag___KX5wL_1-0-7{
     padding:0;
   }
 }
-.magritte-item-right-content___U2hc1_1-0-6{
+.magritte-item-right-content___U2hc1_1-0-7{
   flex:0 1 auto;
   min-width:0;
   display:flex;
   align-items:center;
   gap:8px;
 }
-.magritte-mobile-menu-container___zlY08_1-0-6{
+.magritte-mobile-menu-container___zlY08_1-0-7{
   position:relative;
   overflow:hidden;
 }
-.magritte-mobile-main-menu-container___fOW3d_1-0-6{
+.magritte-mobile-main-menu-container___fOW3d_1-0-7{
   position:relative;
 }
-.magritte-mobile-submenu-container___od1Ev_1-0-6{
+.magritte-mobile-submenu-container___od1Ev_1-0-7{
   position:absolute;
   inset:0 -100% auto 100%;
 }
 @media (prefers-reduced-motion: no-preference){
-  .magritte-mobile-main-menu-container___fOW3d_1-0-6,
-  .magritte-mobile-submenu-container___od1Ev_1-0-6{
+  .magritte-mobile-main-menu-container___fOW3d_1-0-7,
+  .magritte-mobile-submenu-container___od1Ev_1-0-7{
     transition:transform var(--magritte-semantic-animation-time-m-duration-v24-7-3) var(--magritte-semantic-animation-ease-base-timing-function-v24-7-3);
   }
 }
-.magritte-mobile-menu-container-slide___HXiEx_1-0-6 .magritte-mobile-main-menu-container___fOW3d_1-0-6,
-.magritte-mobile-menu-container-slide___HXiEx_1-0-6 .magritte-mobile-submenu-container___od1Ev_1-0-6{
+.magritte-mobile-menu-container-slide___HXiEx_1-0-7 .magritte-mobile-main-menu-container___fOW3d_1-0-7,
+.magritte-mobile-menu-container-slide___HXiEx_1-0-7 .magritte-mobile-submenu-container___od1Ev_1-0-7{
   transform:translateX(-100%);
 }
-.magritte-quick-actions___HvUJ3_1-0-6{
+.magritte-quick-actions___HvUJ3_1-0-7{
   display:flex;
   gap:4px;
   margin:0 16px 4px;
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-quick-actions___HvUJ3_1-0-6{
+  body.magritte-old-layout .magritte-quick-actions___HvUJ3_1-0-7{
     margin:0 12px 4px;
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-quick-actions___HvUJ3_1-0-6{
+  body:not(.magritte-old-layout) .magritte-quick-actions___HvUJ3_1-0-7{
     margin:0 12px 4px;
   }
 }
-.magritte-quick-action___1K5Ip_1-0-6{
+.magritte-quick-action___1K5Ip_1-0-7{
   display:flex;
   flex-direction:column;
   align-items:center;
@@ -182,31 +182,31 @@
   min-width:0;
   padding:14px 12px;
 }
-.magritte-quick-action___1K5Ip_1-0-6:active{
+.magritte-quick-action___1K5Ip_1-0-7:active{
   background-color:var(--magritte-color-background-state-secondary-pressed-v24-7-3);
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-6{
+  body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-7{
     cursor:pointer;
   }
-  body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-6:hover:not(:active){
+  body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-7:hover:not(:active){
     background-color:var(--magritte-color-background-state-secondary-hovered-v24-7-3);
   }
-  body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-6.focus-visible{
+  body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-7.focus-visible{
     outline:4px solid var(--magritte-color-stroke-state-focused-accessible-v24-7-3);
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-6{
+  body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-7{
     cursor:pointer;
   }
-  body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-6:hover:not(:active){
+  body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-7:hover:not(:active){
     background-color:var(--magritte-color-background-state-secondary-hovered-v24-7-3);
   }
-  body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-6.focus-visible{
+  body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-7.focus-visible{
     outline:4px solid var(--magritte-color-stroke-state-focused-accessible-v24-7-3);
   }
 }
-.magritte-quick-action-text___diFW5_1-0-6{
+.magritte-quick-action-text___diFW5_1-0-7{
   max-width:100%;
 }

package/index.js CHANGED Viewed

@@ -14,15 +14,17 @@ import './Drop.js';
 import '@hh.ru/magritte-ui-drop';
 import './Item.js';
 import 'react-dom';
-import '@hh.ru/magritte-common-func-utils';
 import '@hh.ru/magritte-common-keyboard';
 import '@hh.ru/magritte-common-use-multiple-refs';
 import '@hh.ru/magritte-ui-icon';
 import './DisabledWrapper.js';
 import '@hh.ru/magritte-common-use-disabled';
 import '@hh.ru/magritte-ui-typography';
+import './useSubmenuSafeZone.js';
+import '@hh.ru/magritte-common-func-utils';
+import './safeZone.js';
 import '@hh.ru/magritte-ui-switch';
-import './menu-DURXc54a.js';
+import './menu-DKXKF84l.js';
 import './QuickAction.js';
 import './QuickActions.js';
 import './SectionHeader.js';

package/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/menu-DKXKF84l.js ADDED Viewed

@@ -0,0 +1,5 @@
+import './index.css';
+var styles = {"disabled":"magritte-disabled___ZuG-J_1-0-7","drop-content-margin":"magritte-drop-content-margin___q01ll_1-0-7","dropContentMargin":"magritte-drop-content-margin___q01ll_1-0-7","item":"magritte-item___HyDAw_1-0-7","neutral":"magritte-neutral___WyGeQ_1-0-7","negative":"magritte-negative___F7a0c_1-0-7","item-icon":"magritte-item-icon___yCv9l_1-0-7","itemIcon":"magritte-item-icon___yCv9l_1-0-7","item-text":"magritte-item-text___GL3A5_1-0-7","itemText":"magritte-item-text___GL3A5_1-0-7","item-tag":"magritte-item-tag___KX5wL_1-0-7","itemTag":"magritte-item-tag___KX5wL_1-0-7","item-right-content":"magritte-item-right-content___U2hc1_1-0-7","itemRightContent":"magritte-item-right-content___U2hc1_1-0-7","mobile-menu-container":"magritte-mobile-menu-container___zlY08_1-0-7","mobileMenuContainer":"magritte-mobile-menu-container___zlY08_1-0-7","mobile-main-menu-container":"magritte-mobile-main-menu-container___fOW3d_1-0-7","mobileMainMenuContainer":"magritte-mobile-main-menu-container___fOW3d_1-0-7","mobile-submenu-container":"magritte-mobile-submenu-container___od1Ev_1-0-7","mobileSubmenuContainer":"magritte-mobile-submenu-container___od1Ev_1-0-7","mobile-menu-container-slide":"magritte-mobile-menu-container-slide___HXiEx_1-0-7","mobileMenuContainerSlide":"magritte-mobile-menu-container-slide___HXiEx_1-0-7","quick-actions":"magritte-quick-actions___HvUJ3_1-0-7","quickActions":"magritte-quick-actions___HvUJ3_1-0-7","quick-action":"magritte-quick-action___1K5Ip_1-0-7","quickAction":"magritte-quick-action___1K5Ip_1-0-7","quick-action-text":"magritte-quick-action-text___diFW5_1-0-7","quickActionText":"magritte-quick-action-text___diFW5_1-0-7"};
+export { styles as s };
+//# sourceMappingURL=menu-DKXKF84l.js.map

package/menu-DKXKF84l.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"menu-DKXKF84l.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@hh.ru/magritte-ui-menu",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "main": "index.js",
   "types": "index.d.ts",
   "sideEffects": [
@@ -44,5 +44,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "8ebd3956f032a7ae6df4f4e21e96ebb60b1e5424"
+  "gitHead": "adc83fc2c408e1d347e82ccd5973c0cb8840fdba"
 }

package/safeZone.d.ts ADDED Viewed

@@ -0,0 +1,42 @@
+/**
+ * Геометрия «безопасного треугольника» (подменю с учётом направления курсора).
+ *
+ * Пока подменю открыто и курсор уходит с родительского пункта, подменю должно
+ * оставаться открытым, если курсор движется в его сторону. «Движение в сторону»
+ * моделируется треугольником: его вершина — предыдущая позиция курсора, а
+ * основание — ближайшая к родительскому меню грань подменю. Если текущая позиция
+ * курсора попадает внутрь этого треугольника, считаем, что курсор движется
+ * к подменю.
+ *
+ * Эти хелперы намеренно чистые (без DOM и без React), чтобы их можно было
+ * тестировать изолированно. У аргументов типа `DOMRect` читаются только
+ * `left`/`right`/`top`/`bottom`, поэтому подойдёт любой похожий на прямоугольник
+ * объект.
+ */
+export interface Point {
+    x: number;
+    y: number;
+}
+/** Минимальный квадрат смещения курсора, при котором пересчитываем направление (4px). */
+export declare const MIN_MOUSE_MOVE_SQUARED = 16;
+/**
+ * Знак векторного произведения (A - B) и (P - B): показывает, с какой стороны
+ * от прямой B → A лежит точка P. Условие `>= 0` относит точку на прямой к «плюсу».
+ */
+export declare const pointSignRelativeToEdge: (P: Point, A: Point, B: Point) => boolean;
+/** Лежит ли точка P внутри треугольника A, B, C (включая границу). */
+export declare const isPointInsideTriangle: (P: Point, A: Point, B: Point, C: Point) => boolean;
+/**
+ * Вертикальная грань подменю, обращённая к родительскому меню. Если подменю
+ * открыто вправо (его правая грань выходит за правую грань дропа), ближайшая
+ * грань — левая сторона подменю; иначе подменю открыто влево, и ближайшая
+ * грань — правая сторона подменю.
+ */
+export declare const findNearestSubmenuEdge: (dropCoords: DOMRect, submenuCoords: DOMRect) => [Point, Point];
+/** Сместился ли курсор с прошлой выборки достаточно, чтобы пересчитать направление. */
+export declare const hasMovedEnough: (prev: Point, current: Point) => boolean;
+/**
+ * Движется ли курсор, переместившись из `prev` в `current`, в сторону подменю,
+ * заданного `submenuCoords` (относительно родительского `dropCoords`).
+ */
+export declare const isMovingTowardsSubmenu: (prev: Point, current: Point, dropCoords: DOMRect, submenuCoords: DOMRect) => boolean;

package/safeZone.js ADDED Viewed

@@ -0,0 +1,69 @@
+import './index.css';
+/**
+ * Геометрия «безопасного треугольника» (подменю с учётом направления курсора).
+ *
+ * Пока подменю открыто и курсор уходит с родительского пункта, подменю должно
+ * оставаться открытым, если курсор движется в его сторону. «Движение в сторону»
+ * моделируется треугольником: его вершина — предыдущая позиция курсора, а
+ * основание — ближайшая к родительскому меню грань подменю. Если текущая позиция
+ * курсора попадает внутрь этого треугольника, считаем, что курсор движется
+ * к подменю.
+ *
+ * Эти хелперы намеренно чистые (без DOM и без React), чтобы их можно было
+ * тестировать изолированно. У аргументов типа `DOMRect` читаются только
+ * `left`/`right`/`top`/`bottom`, поэтому подойдёт любой похожий на прямоугольник
+ * объект.
+ */
+/** Минимальный квадрат смещения курсора, при котором пересчитываем направление (4px). */
+const MIN_MOUSE_MOVE_SQUARED = 16;
+/**
+ * Знак векторного произведения (A - B) и (P - B): показывает, с какой стороны
+ * от прямой B → A лежит точка P. Условие `>= 0` относит точку на прямой к «плюсу».
+ */
+const pointSignRelativeToEdge = (P, A, B) => {
+    return (A.x - B.x) * (P.y - B.y) >= (P.x - B.x) * (A.y - B.y);
+};
+/** Лежит ли точка P внутри треугольника A, B, C (включая границу). */
+const isPointInsideTriangle = (P, A, B, C) => {
+    const values = [
+        pointSignRelativeToEdge(P, A, B),
+        pointSignRelativeToEdge(P, B, C),
+        pointSignRelativeToEdge(P, C, A),
+    ];
+    return (values[0] && values[1] && values[2]) || (!values[0] && !values[1] && !values[2]);
+};
+/**
+ * Вертикальная грань подменю, обращённая к родительскому меню. Если подменю
+ * открыто вправо (его правая грань выходит за правую грань дропа), ближайшая
+ * грань — левая сторона подменю; иначе подменю открыто влево, и ближайшая
+ * грань — правая сторона подменю.
+ */
+const findNearestSubmenuEdge = (dropCoords, submenuCoords) => {
+    if (submenuCoords.right > dropCoords.right) {
+        return [
+            { x: submenuCoords.left, y: submenuCoords.top },
+            { x: submenuCoords.left, y: submenuCoords.bottom },
+        ];
+    }
+    return [
+        { x: submenuCoords.right, y: submenuCoords.top },
+        { x: submenuCoords.right, y: submenuCoords.bottom },
+    ];
+};
+/** Сместился ли курсор с прошлой выборки достаточно, чтобы пересчитать направление. */
+const hasMovedEnough = (prev, current) => {
+    const deltaX = current.x - prev.x;
+    const deltaY = current.y - prev.y;
+    return deltaX * deltaX + deltaY * deltaY >= MIN_MOUSE_MOVE_SQUARED;
+};
+/**
+ * Движется ли курсор, переместившись из `prev` в `current`, в сторону подменю,
+ * заданного `submenuCoords` (относительно родительского `dropCoords`).
+ */
+const isMovingTowardsSubmenu = (prev, current, dropCoords, submenuCoords) => {
+    const [edgeStart, edgeEnd] = findNearestSubmenuEdge(dropCoords, submenuCoords);
+    return isPointInsideTriangle(current, prev, edgeStart, edgeEnd);
+};
+export { MIN_MOUSE_MOVE_SQUARED, findNearestSubmenuEdge, hasMovedEnough, isMovingTowardsSubmenu, isPointInsideTriangle, pointSignRelativeToEdge };
+//# sourceMappingURL=safeZone.js.map

package/safeZone.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"safeZone.js","sources":["src/safeZone.ts"],"sourcesContent":["/**\n * Геометрия «безопасного треугольника» (подменю с учётом направления курсора).\n *\n * Пока подменю открыто и курсор уходит с родительского пункта, подменю должно\n * оставаться открытым, если курсор движется в его сторону. «Движение в сторону»\n * моделируется треугольником: его вершина — предыдущая позиция курсора, а\n * основание — ближайшая к родительскому меню грань подменю. Если текущая позиция\n * курсора попадает внутрь этого треугольника, считаем, что курсор движется\n * к подменю.\n *\n * Эти хелперы намеренно чистые (без DOM и без React), чтобы их можно было\n * тестировать изолированно. У аргументов типа `DOMRect` читаются только\n * `left`/`right`/`top`/`bottom`, поэтому подойдёт любой похожий на прямоугольник\n * объект.\n */\n\nexport interface Point {\n x: number;\n y: number;\n}\n\n/** Минимальный квадрат смещения курсора, при котором пересчитываем направление (4px). */\nexport const MIN_MOUSE_MOVE_SQUARED = 16;\n\n/**\n * Знак векторного произведения (A - B) и (P - B): показывает, с какой стороны\n * от прямой B → A лежит точка P. Условие `>= 0` относит точку на прямой к «плюсу».\n */\nexport const pointSignRelativeToEdge = (P: Point, A: Point, B: Point): boolean => {\n return (A.x - B.x) * (P.y - B.y) >= (P.x - B.x) * (A.y - B.y);\n};\n\n/** Лежит ли точка P внутри треугольника A, B, C (включая границу). */\nexport const isPointInsideTriangle = (P: Point, A: Point, B: Point, C: Point): boolean => {\n const values = [\n pointSignRelativeToEdge(P, A, B),\n pointSignRelativeToEdge(P, B, C),\n pointSignRelativeToEdge(P, C, A),\n ];\n return (values[0] && values[1] && values[2]) || (!values[0] && !values[1] && !values[2]);\n};\n\n/**\n * Вертикальная грань подменю, обращённая к родительскому меню. Если подменю\n * открыто вправо (его правая грань выходит за правую грань дропа), ближайшая\n * грань — левая сторона подменю; иначе подменю открыто влево, и ближайшая\n * грань — правая сторона подменю.\n */\nexport const findNearestSubmenuEdge = (dropCoords: DOMRect, submenuCoords: DOMRect): [Point, Point] => {\n if (submenuCoords.right > dropCoords.right) {\n return [\n { x: submenuCoords.left, y: submenuCoords.top },\n { x: submenuCoords.left, y: submenuCoords.bottom },\n ];\n }\n return [\n { x: submenuCoords.right, y: submenuCoords.top },\n { x: submenuCoords.right, y: submenuCoords.bottom },\n ];\n};\n\n/** Сместился ли курсор с прошлой выборки достаточно, чтобы пересчитать направление. */\nexport const hasMovedEnough = (prev: Point, current: Point): boolean => {\n const deltaX = current.x - prev.x;\n const deltaY = current.y - prev.y;\n return deltaX * deltaX + deltaY * deltaY >= MIN_MOUSE_MOVE_SQUARED;\n};\n\n/**\n * Движется ли курсор, переместившись из `prev` в `current`, в сторону подменю,\n * заданного `submenuCoords` (относительно родительского `dropCoords`).\n */\nexport const isMovingTowardsSubmenu = (\n prev: Point,\n current: Point,\n dropCoords: DOMRect,\n submenuCoords: DOMRect\n): boolean => {\n const [edgeStart, edgeEnd] = findNearestSubmenuEdge(dropCoords, submenuCoords);\n return isPointInsideTriangle(current, prev, edgeStart, edgeEnd);\n};\n"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;AAcG;AAOH;AACO,MAAM,sBAAsB,GAAG,GAAG;AAEzC;;;AAGG;AACU,MAAA,uBAAuB,GAAG,CAAC,CAAQ,EAAE,CAAQ,EAAE,CAAQ,KAAa;AAC7E,IAAA,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;AAClE,EAAE;AAEF;AACO,MAAM,qBAAqB,GAAG,CAAC,CAAQ,EAAE,CAAQ,EAAE,CAAQ,EAAE,CAAQ,KAAa;AACrF,IAAA,MAAM,MAAM,GAAG;AACX,QAAA,uBAAuB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;AAChC,QAAA,uBAAuB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;AAChC,QAAA,uBAAuB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;KACnC,CAAC;AACF,IAAA,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;AAC7F,EAAE;AAEF;;;;;AAKG;MACU,sBAAsB,GAAG,CAAC,UAAmB,EAAE,aAAsB,KAAoB;IAClG,IAAI,aAAa,CAAC,KAAK,GAAG,UAAU,CAAC,KAAK,EAAE;QACxC,OAAO;YACH,EAAE,CAAC,EAAE,aAAa,CAAC,IAAI,EAAE,CAAC,EAAE,aAAa,CAAC,GAAG,EAAE;YAC/C,EAAE,CAAC,EAAE,aAAa,CAAC,IAAI,EAAE,CAAC,EAAE,aAAa,CAAC,MAAM,EAAE;SACrD,CAAC;KACL;IACD,OAAO;QACH,EAAE,CAAC,EAAE,aAAa,CAAC,KAAK,EAAE,CAAC,EAAE,aAAa,CAAC,GAAG,EAAE;QAChD,EAAE,CAAC,EAAE,aAAa,CAAC,KAAK,EAAE,CAAC,EAAE,aAAa,CAAC,MAAM,EAAE;KACtD,CAAC;AACN,EAAE;AAEF;MACa,cAAc,GAAG,CAAC,IAAW,EAAE,OAAc,KAAa;IACnE,MAAM,MAAM,GAAG,OAAO,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC;IAClC,MAAM,MAAM,GAAG,OAAO,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC;IAClC,OAAO,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,IAAI,sBAAsB,CAAC;AACvE,EAAE;AAEF;;;AAGG;AACI,MAAM,sBAAsB,GAAG,CAClC,IAAW,EACX,OAAc,EACd,UAAmB,EACnB,aAAsB,KACb;AACT,IAAA,MAAM,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG,sBAAsB,CAAC,UAAU,EAAE,aAAa,CAAC,CAAC;IAC/E,OAAO,qBAAqB,CAAC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC;AACpE;;;;"}

package/useSubmenuSafeZone.d.ts ADDED Viewed

@@ -0,0 +1,31 @@
+import { type RefObject } from 'react';
+import { type Point } from '@hh.ru/magritte-ui-menu/safeZone';
+export declare const MOUSE_MOVE_THROTTLE_MS = 50;
+export declare const SCROLL_THROTTLE_MS = 300;
+export declare const SUBMENU_CLOSE_DELAY_MS = 300;
+interface UseSubmenuSafeZoneParams {
+    /** Активно ли отслеживание безопасной зоны (подменю открыто). */
+    active: boolean;
+    /** Скролл-контейнер, в котором рендерится родительское меню. */
+    dropContainer: HTMLElement | null;
+    /** Элемент родительского пункта меню. */
+    itemRef: RefObject<HTMLElement | null>;
+    /** Элемент дропа подменю. */
+    submenuRef: RefObject<HTMLElement | null>;
+    /** Вызывается, когда безопасная зона решает, что подменю нужно закрыть. */
+    onClose: () => void;
+}
+interface UseSubmenuSafeZoneResult {
+    /** Запоминает последнюю позицию курсора (вызывать из обработчиков указателя пункта). */
+    trackPointer: (point: Point) => void;
+    /** Отменяет запланированное закрытие (вызывать при (пере)открытии подменю). */
+    cancelPendingClose: () => void;
+}
+/**
+ * Держит подменю открытым, пока курсор движется в его сторону, иначе планирует
+ * отложенное закрытие. Инкапсулирует подписку на DOM-события, кэширование
+ * координат, троттлинг и учёт таймера закрытия, чтобы это поведение можно было
+ * проверять независимо от компонента `MenuItem`.
+ */
+export declare const useSubmenuSafeZone: ({ active, dropContainer, itemRef, submenuRef, onClose, }: UseSubmenuSafeZoneParams) => UseSubmenuSafeZoneResult;
+export {};

package/useSubmenuSafeZone.js ADDED Viewed

@@ -0,0 +1,105 @@
+import './index.css';
+import { useRef, useCallback, useEffect } from 'react';
+import { throttle } from '@hh.ru/magritte-common-func-utils';
+import { hasMovedEnough, isMovingTowardsSubmenu } from './safeZone.js';
+const MOUSE_MOVE_THROTTLE_MS = 50;
+const SCROLL_THROTTLE_MS = 300;
+const SUBMENU_CLOSE_DELAY_MS = 300;
+/**
+ * Держит подменю открытым, пока курсор движется в его сторону, иначе планирует
+ * отложенное закрытие. Инкапсулирует подписку на DOM-события, кэширование
+ * координат, троттлинг и учёт таймера закрытия, чтобы это поведение можно было
+ * проверять независимо от компонента `MenuItem`.
+ */
+const useSubmenuSafeZone = ({ active, dropContainer, itemRef, submenuRef, onClose, }) => {
+    const stateRef = useRef({
+        dropCoords: null,
+        prevMouseCoords: null,
+        submenuCoords: null,
+    });
+    const closeTimeoutRef = useRef(null);
+    // Храним в ref, чтобы новая ссылка `onClose` на каждом рендере не заставляла
+    // эффект переподписывать слушатели.
+    const onCloseRef = useRef(onClose);
+    onCloseRef.current = onClose;
+    const cancelPendingClose = useCallback(() => {
+        if (closeTimeoutRef.current !== null) {
+            clearTimeout(closeTimeoutRef.current);
+            closeTimeoutRef.current = null;
+        }
+    }, []);
+    const trackPointer = useCallback((point) => {
+        stateRef.current.prevMouseCoords = point;
+    }, []);
+    useEffect(() => {
+        if (!active || !dropContainer || !itemRef.current || !submenuRef.current) {
+            return void 0;
+        }
+        const scheduleClose = () => {
+            if (closeTimeoutRef.current === null) {
+                closeTimeoutRef.current = setTimeout(() => {
+                    closeTimeoutRef.current = null;
+                    onCloseRef.current();
+                }, SUBMENU_CLOSE_DELAY_MS);
+            }
+        };
+        const checkIfMouseIsMovingTowardsSubmenu = throttle((event) => {
+            const currentMouseCoords = { x: event.clientX, y: event.clientY };
+            const isMouseOverItemOrSubmenu = itemRef.current?.contains(event.target) ||
+                submenuRef.current?.contains(event.target);
+            if (isMouseOverItemOrSubmenu) {
+                cancelPendingClose();
+            }
+            else if (stateRef.current.dropCoords !== null &&
+                stateRef.current.prevMouseCoords !== null &&
+                stateRef.current.submenuCoords !== null) {
+                if (!hasMovedEnough(stateRef.current.prevMouseCoords, currentMouseCoords)) {
+                    return;
+                }
+                const movingTowardsSubmenu = isMovingTowardsSubmenu(stateRef.current.prevMouseCoords, currentMouseCoords, stateRef.current.dropCoords, stateRef.current.submenuCoords);
+                if (movingTowardsSubmenu) {
+                    cancelPendingClose();
+                }
+                else {
+                    scheduleClose();
+                }
+            }
+            stateRef.current.prevMouseCoords = currentMouseCoords;
+        }, MOUSE_MOVE_THROTTLE_MS);
+        const checkIfMouseIsOverItemOrSubmenu = throttle(() => {
+            if (stateRef.current.prevMouseCoords !== null) {
+                const elementUnderMouse = document.elementFromPoint(stateRef.current.prevMouseCoords.x, stateRef.current.prevMouseCoords.y);
+                const isMouseOverItemOrSubmenu = itemRef.current?.contains(elementUnderMouse) || submenuRef.current?.contains(elementUnderMouse);
+                if (isMouseOverItemOrSubmenu) {
+                    cancelPendingClose();
+                }
+                else {
+                    scheduleClose();
+                }
+            }
+        }, SCROLL_THROTTLE_MS);
+        document.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
+        dropContainer.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
+        document.addEventListener('scroll', checkIfMouseIsOverItemOrSubmenu, { capture: true, passive: true });
+        stateRef.current.dropCoords = dropContainer.getBoundingClientRect();
+        stateRef.current.submenuCoords = submenuRef.current.getBoundingClientRect();
+        return () => {
+            document.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
+            dropContainer.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
+            document.removeEventListener('scroll', checkIfMouseIsOverItemOrSubmenu, { capture: true });
+            checkIfMouseIsMovingTowardsSubmenu.cancel();
+            checkIfMouseIsOverItemOrSubmenu.cancel();
+            cancelPendingClose();
+            stateRef.current = {
+                dropCoords: null,
+                prevMouseCoords: null,
+                submenuCoords: null,
+            };
+        };
+    }, [active, dropContainer, itemRef, submenuRef, cancelPendingClose]);
+    return { trackPointer, cancelPendingClose };
+};
+export { MOUSE_MOVE_THROTTLE_MS, SCROLL_THROTTLE_MS, SUBMENU_CLOSE_DELAY_MS, useSubmenuSafeZone };
+//# sourceMappingURL=useSubmenuSafeZone.js.map

package/useSubmenuSafeZone.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useSubmenuSafeZone.js","sources":["src/useSubmenuSafeZone.ts"],"sourcesContent":["import { type RefObject, useCallback, useEffect, useRef } from 'react';\n\nimport { throttle } from '@hh.ru/magritte-common-func-utils';\nimport { type Point, hasMovedEnough, isMovingTowardsSubmenu } from '@hh.ru/magritte-ui-menu/safeZone';\n\nexport const MOUSE_MOVE_THROTTLE_MS = 50;\nexport const SCROLL_THROTTLE_MS = 300;\nexport const SUBMENU_CLOSE_DELAY_MS = 300;\n\ninterface UseSubmenuSafeZoneParams {\n /** Активно ли отслеживание безопасной зоны (подменю открыто). */\n active: boolean;\n /** Скролл-контейнер, в котором рендерится родительское меню. */\n dropContainer: HTMLElement | null;\n /** Элемент родительского пункта меню. */\n itemRef: RefObject<HTMLElement | null>;\n /** Элемент дропа подменю. */\n submenuRef: RefObject<HTMLElement | null>;\n /** Вызывается, когда безопасная зона решает, что подменю нужно закрыть. */\n onClose: () => void;\n}\n\ninterface UseSubmenuSafeZoneResult {\n /** Запоминает последнюю позицию курсора (вызывать из обработчиков указателя пункта). */\n trackPointer: (point: Point) => void;\n /** Отменяет запланированное закрытие (вызывать при (пере)открытии подменю). */\n cancelPendingClose: () => void;\n}\n\n/**\n * Держит подменю открытым, пока курсор движется в его сторону, иначе планирует\n * отложенное закрытие. Инкапсулирует подписку на DOM-события, кэширование\n * координат, троттлинг и учёт таймера закрытия, чтобы это поведение можно было\n * проверять независимо от компонента `MenuItem`.\n */\nexport const useSubmenuSafeZone = ({\n active,\n dropContainer,\n itemRef,\n submenuRef,\n onClose,\n}: UseSubmenuSafeZoneParams): UseSubmenuSafeZoneResult => {\n const stateRef = useRef<{\n dropCoords: DOMRect | null;\n prevMouseCoords: Point | null;\n submenuCoords: DOMRect | null;\n }>({\n dropCoords: null,\n prevMouseCoords: null,\n submenuCoords: null,\n });\n\n const closeTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n // Храним в ref, чтобы новая ссылка `onClose` на каждом рендере не заставляла\n // эффект переподписывать слушатели.\n const onCloseRef = useRef(onClose);\n onCloseRef.current = onClose;\n\n const cancelPendingClose = useCallback(() => {\n if (closeTimeoutRef.current !== null) {\n clearTimeout(closeTimeoutRef.current);\n closeTimeoutRef.current = null;\n }\n }, []);\n\n const trackPointer = useCallback((point: Point) => {\n stateRef.current.prevMouseCoords = point;\n }, []);\n\n useEffect(() => {\n if (!active || !dropContainer || !itemRef.current || !submenuRef.current) {\n return void 0;\n }\n\n const scheduleClose = () => {\n if (closeTimeoutRef.current === null) {\n closeTimeoutRef.current = setTimeout(() => {\n closeTimeoutRef.current = null;\n onCloseRef.current();\n }, SUBMENU_CLOSE_DELAY_MS);\n }\n };\n\n const checkIfMouseIsMovingTowardsSubmenu = throttle((event: MouseEvent) => {\n const currentMouseCoords: Point = { x: event.clientX, y: event.clientY };\n\n const isMouseOverItemOrSubmenu =\n itemRef.current?.contains(event.target as HTMLElement) ||\n submenuRef.current?.contains(event.target as HTMLElement);\n\n if (isMouseOverItemOrSubmenu) {\n cancelPendingClose();\n } else if (\n stateRef.current.dropCoords !== null &&\n stateRef.current.prevMouseCoords !== null &&\n stateRef.current.submenuCoords !== null\n ) {\n if (!hasMovedEnough(stateRef.current.prevMouseCoords, currentMouseCoords)) {\n return;\n }\n\n const movingTowardsSubmenu = isMovingTowardsSubmenu(\n stateRef.current.prevMouseCoords,\n currentMouseCoords,\n stateRef.current.dropCoords,\n stateRef.current.submenuCoords\n );\n\n if (movingTowardsSubmenu) {\n cancelPendingClose();\n } else {\n scheduleClose();\n }\n }\n\n stateRef.current.prevMouseCoords = currentMouseCoords;\n }, MOUSE_MOVE_THROTTLE_MS);\n\n const checkIfMouseIsOverItemOrSubmenu = throttle(() => {\n if (stateRef.current.prevMouseCoords !== null) {\n const elementUnderMouse = document.elementFromPoint(\n stateRef.current.prevMouseCoords.x,\n stateRef.current.prevMouseCoords.y\n );\n\n const isMouseOverItemOrSubmenu =\n itemRef.current?.contains(elementUnderMouse) || submenuRef.current?.contains(elementUnderMouse);\n\n if (isMouseOverItemOrSubmenu) {\n cancelPendingClose();\n } else {\n scheduleClose();\n }\n }\n }, SCROLL_THROTTLE_MS);\n\n document.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n dropContainer.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n document.addEventListener('scroll', checkIfMouseIsOverItemOrSubmenu, { capture: true, passive: true });\n\n stateRef.current.dropCoords = dropContainer.getBoundingClientRect();\n stateRef.current.submenuCoords = submenuRef.current.getBoundingClientRect();\n\n return () => {\n document.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n dropContainer.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n document.removeEventListener('scroll', checkIfMouseIsOverItemOrSubmenu, { capture: true });\n checkIfMouseIsMovingTowardsSubmenu.cancel();\n checkIfMouseIsOverItemOrSubmenu.cancel();\n\n cancelPendingClose();\n\n stateRef.current = {\n dropCoords: null,\n prevMouseCoords: null,\n submenuCoords: null,\n };\n };\n }, [active, dropContainer, itemRef, submenuRef, cancelPendingClose]);\n\n return { trackPointer, cancelPendingClose };\n};\n"],"names":[],"mappings":"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"}

package/menu-DURXc54a.js DELETED Viewed

@@ -1,5 +0,0 @@
-import './index.css';
-var styles = {"disabled":"magritte-disabled___ZuG-J_1-0-6","drop-content-margin":"magritte-drop-content-margin___q01ll_1-0-6","dropContentMargin":"magritte-drop-content-margin___q01ll_1-0-6","item":"magritte-item___HyDAw_1-0-6","neutral":"magritte-neutral___WyGeQ_1-0-6","negative":"magritte-negative___F7a0c_1-0-6","item-icon":"magritte-item-icon___yCv9l_1-0-6","itemIcon":"magritte-item-icon___yCv9l_1-0-6","item-text":"magritte-item-text___GL3A5_1-0-6","itemText":"magritte-item-text___GL3A5_1-0-6","item-tag":"magritte-item-tag___KX5wL_1-0-6","itemTag":"magritte-item-tag___KX5wL_1-0-6","item-right-content":"magritte-item-right-content___U2hc1_1-0-6","itemRightContent":"magritte-item-right-content___U2hc1_1-0-6","mobile-menu-container":"magritte-mobile-menu-container___zlY08_1-0-6","mobileMenuContainer":"magritte-mobile-menu-container___zlY08_1-0-6","mobile-main-menu-container":"magritte-mobile-main-menu-container___fOW3d_1-0-6","mobileMainMenuContainer":"magritte-mobile-main-menu-container___fOW3d_1-0-6","mobile-submenu-container":"magritte-mobile-submenu-container___od1Ev_1-0-6","mobileSubmenuContainer":"magritte-mobile-submenu-container___od1Ev_1-0-6","mobile-menu-container-slide":"magritte-mobile-menu-container-slide___HXiEx_1-0-6","mobileMenuContainerSlide":"magritte-mobile-menu-container-slide___HXiEx_1-0-6","quick-actions":"magritte-quick-actions___HvUJ3_1-0-6","quickActions":"magritte-quick-actions___HvUJ3_1-0-6","quick-action":"magritte-quick-action___1K5Ip_1-0-6","quickAction":"magritte-quick-action___1K5Ip_1-0-6","quick-action-text":"magritte-quick-action-text___diFW5_1-0-6","quickActionText":"magritte-quick-action-text___diFW5_1-0-6"};
-export { styles as s };
-//# sourceMappingURL=menu-DURXc54a.js.map

package/menu-DURXc54a.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"menu-DURXc54a.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}