@hh.ru/magritte-ui-menu 1.0.54 → 1.0.56

package/Item.js

@@ -12,18 +12,16 @@ import { CheckOutlinedSize24, ChevronRightOutlinedSize24 } from '@hh.ru/magritte
 import { DisabledWrapper } from './DisabledWrapper.js';
 import { DROP_PROPS } from './Drop.js';
 import { MenuContext } from './context.js';
+import { MENU_ITEM_ICON_DEFAULTS } from './itemIconDefaults.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-BKJV53WD.js';
+import { s as styles } from './menu-D-lOkmjA.js';
 import '@hh.ru/magritte-common-use-disabled';
 import '@hh.ru/magritte-common-func-utils';
 import './safeZone.js';
 
-const DEFAULT_ICON_PROPS = {
-  neutral: {},
-  negative: { initialColor: "negative" }
-};
+const DEFAULT_ICON_PROPS = MENU_ITEM_ICON_DEFAULTS;
 const TEXT_STYLE = {
   neutral: "primary",
   negative: "negative"

package/Item.js.map

@@ -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 { 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 ellipsis style={TEXT_STYLE[style]} typography=\"label-2-regular\">\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":[],"mappings":"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"}
+{"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 { MENU_ITEM_ICON_DEFAULTS } from '@hh.ru/magritte-ui-menu/itemIconDefaults';\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>> = MENU_ITEM_ICON_DEFAULTS;\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 ellipsis style={TEXT_STYLE[style]} typography=\"label-2-regular\">\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":[],"mappings":"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"}

package/Menu.js

@@ -13,7 +13,7 @@ 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-BKJV53WD.js';
+import { s as styles } from './menu-D-lOkmjA.js';
 import '@hh.ru/magritte-ui-bottom-sheet';
 import '@hh.ru/magritte-ui-divider';
 import '@hh.ru/magritte-ui-drop';
@@ -24,6 +24,7 @@ import '@hh.ru/magritte-ui-icon';
 import './DisabledWrapper.js';
 import '@hh.ru/magritte-common-use-disabled';
 import '@hh.ru/magritte-ui-typography';
+import './itemIconDefaults.js';
 import './useSubmenuSafeZone.js';
 import '@hh.ru/magritte-common-func-utils';
 import './safeZone.js';

package/Menu.js.map

@@ -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":[],"mappings":"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"}
+{"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":[],"mappings":"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"}

package/QuickAction.js

@@ -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-BKJV53WD.js';
+import { s as styles } from './menu-D-lOkmjA.js';
 import '@hh.ru/magritte-common-use-disabled';
 import '@hh.ru/magritte-ui-icon';
 

package/QuickActions.js

@@ -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-BKJV53WD.js';
+import { s as styles } from './menu-D-lOkmjA.js';
 
 const MenuQuickActions = forwardRef(({ children, className, ...props }, ref) => {
   return /* @__PURE__ */ jsx("div", { ...props, className: classnames(className, styles.quickActions), ref, children });

package/SectionHeader.js

@@ -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-BKJV53WD.js';
+import { s as styles } from './menu-D-lOkmjA.js';
 
 const MenuSectionHeader = forwardRef((props, ref) => {
   const { isMobile } = useBreakpoint();

package/index.css

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

package/index.js

@@ -20,11 +20,12 @@ import '@hh.ru/magritte-ui-icon';
 import './DisabledWrapper.js';
 import '@hh.ru/magritte-common-use-disabled';
 import '@hh.ru/magritte-ui-typography';
+import './itemIconDefaults.js';
 import './useSubmenuSafeZone.js';
 import '@hh.ru/magritte-common-func-utils';
 import './safeZone.js';
 import '@hh.ru/magritte-ui-switch';
-import './menu-BKJV53WD.js';
+import './menu-D-lOkmjA.js';
 import './QuickAction.js';
 import './QuickActions.js';
 import './SectionHeader.js';

package/index.js.map

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

package/itemIconDefaults.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Пропы, которые айтем меню сам проставляет иконке из пропа `icon`, по значению `style` айтема.
+ *
+ * Вынесено из `Item.tsx` отдельным модулем не ради переиспользования в рантайме — читатель там один.
+ * Второй читатель — Code Connect-шаблон (`figma/MenuItem.cc.ts`): он объявляет эти же значения контекстом для
+ * вложенной иконки, чтобы сниппет не повторял проп, который айтем и так подставляет. Значение, скопированное
+ * в шаблон литералом, разъезжается молча: поменяли здесь — сниппет продолжает публиковать прежнее, и ни сборка,
+ * ни рендер об этом не скажут.
+ *
+ * Модуль обязан оставаться чистыми данными без импортов рантайма (React, стили): шаблон инлайнится сборщиком,
+ * и всё, что сюда попадёт, поедет в бандл каждого энтри.
+ */
+export declare const MENU_ITEM_ICON_DEFAULTS: {
+    readonly neutral: {};
+    readonly negative: {
+        readonly initialColor: 'negative';
+    };
+};

package/itemIconDefaults.js

@@ -0,0 +1,8 @@
+import './index.css';
+const MENU_ITEM_ICON_DEFAULTS = {
+  neutral: {},
+  negative: { initialColor: "negative" }
+};
+
+export { MENU_ITEM_ICON_DEFAULTS };
+//# sourceMappingURL=itemIconDefaults.js.map

package/itemIconDefaults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"itemIconDefaults.js","sources":["src/itemIconDefaults.ts"],"sourcesContent":["/**\n * Пропы, которые айтем меню сам проставляет иконке из пропа `icon`, по значению `style` айтема.\n *\n * Вынесено из `Item.tsx` отдельным модулем не ради переиспользования в рантайме — читатель там один.\n * Второй читатель — Code Connect-шаблон (`figma/MenuItem.cc.ts`): он объявляет эти же значения контекстом для\n * вложенной иконки, чтобы сниппет не повторял проп, который айтем и так подставляет. Значение, скопированное\n * в шаблон литералом, разъезжается молча: поменяли здесь — сниппет продолжает публиковать прежнее, и ни сборка,\n * ни рендер об этом не скажут.\n *\n * Модуль обязан оставаться чистыми данными без импортов рантайма (React, стили): шаблон инлайнится сборщиком,\n * и всё, что сюда попадёт, поедет в бандл каждого энтри.\n */\nexport const MENU_ITEM_ICON_DEFAULTS = {\n    neutral: {},\n    negative: { initialColor: 'negative' },\n} as const;\n"],"names":[],"mappings":"AAYO,MAAM,uBAA0B,GAAA;AAAA,EACnC,SAAS,EAAC;AAAA,EACV,QAAA,EAAU,EAAE,YAAA,EAAc,UAAW,EAAA;AACzC;;;;"}

package/menu-D-lOkmjA.js

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

package/menu-D-lOkmjA.js.map

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hh.ru/magritte-ui-menu",
-  "version": "1.0.54",
+  "version": "1.0.56",
   "main": "index.js",
   "types": "index.d.ts",
   "sideEffects": [
@@ -17,7 +17,11 @@
     "ts-check": "yarn root:ts-check $(pwd)",
     "test": "yarn root:test $(pwd)",
     "test:types": "yarn root:test:types $(pwd)",
-    "watch": "yarn root:watch $(pwd)"
+    "watch": "yarn root:watch $(pwd)",
+    "figma-publish": "yarn root:figma-publish $(pwd)",
+    "figma-unpublish": "yarn root:figma-unpublish $(pwd)",
+    "figma-snapshot-check": "yarn root:figma-snapshot $(pwd)",
+    "figma-snapshot-update": "yarn root:figma-snapshot $(pwd) --update"
   },
   "dependencies": {
     "@hh.ru/magritte-common-func-utils": "1.3.17",
@@ -25,7 +29,7 @@
     "@hh.ru/magritte-common-use-disabled": "1.0.17",
     "@hh.ru/magritte-common-use-multiple-refs": "1.1.13",
     "@hh.ru/magritte-design-tokens": "26.0.2",
-    "@hh.ru/magritte-ui-bottom-sheet": "9.4.54",
+    "@hh.ru/magritte-ui-bottom-sheet": "9.4.55",
     "@hh.ru/magritte-ui-breakpoint": "6.1.3",
     "@hh.ru/magritte-ui-divider": "3.2.13",
     "@hh.ru/magritte-ui-drop": "12.3.64",
@@ -45,5 +49,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "5c3c2c1bf7101bd746688b009408e18f03fe200a"
+  "gitHead": "51c32c8cee9bb273937378996ab89aeb50d9aa48"
 }

package/menu-BKJV53WD.js

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

package/menu-BKJV53WD.js.map

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