@hh.ru/magritte-ui-menu 1.0.4 → 1.0.5
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.
- package/Item.js +25 -2
- package/Item.js.map +1 -1
- package/Menu.js +1 -1
- package/QuickAction.js +1 -1
- package/QuickActions.js +1 -1
- package/SectionHeader.js +1 -1
- package/index.css +43 -43
- package/index.js +1 -1
- package/menu-ChEsgmKq.js +5 -0
- package/menu-ChEsgmKq.js.map +1 -0
- package/package.json +2 -2
- package/menu-C4s0Y0kc.js +0 -5
- package/menu-C4s0Y0kc.js.map +0 -1
package/Item.js
CHANGED
|
@@ -15,7 +15,7 @@ import { DROP_PROPS } from './Drop.js';
|
|
|
15
15
|
import { MenuContext } from './context.js';
|
|
16
16
|
import { isSwitchComponent } from '@hh.ru/magritte-ui-switch';
|
|
17
17
|
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
18
|
-
import { s as styles } from './menu-
|
|
18
|
+
import { s as styles } from './menu-ChEsgmKq.js';
|
|
19
19
|
import '@hh.ru/magritte-common-use-disabled';
|
|
20
20
|
|
|
21
21
|
const DEFAULT_ICON_PROPS = {
|
|
@@ -38,6 +38,7 @@ const SUBMENU_DROP_PLACEMENT = [
|
|
|
38
38
|
'left-bottom',
|
|
39
39
|
'left-center',
|
|
40
40
|
];
|
|
41
|
+
const SUBMENU_CLOSE_DELAY_MS = 500;
|
|
41
42
|
const MOUSE_MOVE_THROTTLE_MS = 50;
|
|
42
43
|
const MIN_MOUSE_MOVE_SQUARED = 16;
|
|
43
44
|
const sign = (P, A, B) => {
|
|
@@ -68,9 +69,14 @@ const MenuItem = forwardRef(({ children, className, disabled = false, icon, subi
|
|
|
68
69
|
const submenuRef = useRef(null);
|
|
69
70
|
const [hasHover, setHover] = useState(false);
|
|
70
71
|
const [submenuVisible, setSubmenuVisible] = useState(false);
|
|
72
|
+
const submenuCloseTimeoutRef = useRef(null);
|
|
71
73
|
const hasSwitch = !selected && isSwitchComponent(rightContent);
|
|
72
74
|
const hasSubmenu = !selected && !isSwitchComponent(rightContent) && submenuAllowed && subitems;
|
|
73
75
|
const showSubmenu = () => {
|
|
76
|
+
if (submenuCloseTimeoutRef.current !== null) {
|
|
77
|
+
clearTimeout(submenuCloseTimeoutRef.current);
|
|
78
|
+
submenuCloseTimeoutRef.current = null;
|
|
79
|
+
}
|
|
74
80
|
setSubmenuVisible(true);
|
|
75
81
|
setItemWithVisibleSubmenu?.(itemRef.current);
|
|
76
82
|
};
|
|
@@ -82,6 +88,10 @@ const MenuItem = forwardRef(({ children, className, disabled = false, icon, subi
|
|
|
82
88
|
});
|
|
83
89
|
useEffect(() => {
|
|
84
90
|
if (itemWithVisibleSubmenu !== itemRef.current) {
|
|
91
|
+
if (submenuCloseTimeoutRef.current !== null) {
|
|
92
|
+
clearTimeout(submenuCloseTimeoutRef.current);
|
|
93
|
+
submenuCloseTimeoutRef.current = null;
|
|
94
|
+
}
|
|
85
95
|
setSubmenuVisible(false);
|
|
86
96
|
}
|
|
87
97
|
}, [itemWithVisibleSubmenu]);
|
|
@@ -102,7 +112,16 @@ const MenuItem = forwardRef(({ children, className, disabled = false, icon, subi
|
|
|
102
112
|
}
|
|
103
113
|
const nearestSubmenuEdge = findNearestSubmenuEdge(stateRef.current.dropCoords, stateRef.current.submenuCoords);
|
|
104
114
|
const isMouseMovingTowardsSubmenu = isPointInsideTriangle(currentMouseCoords, stateRef.current.prevMouseCoords, nearestSubmenuEdge[0], nearestSubmenuEdge[1]);
|
|
105
|
-
|
|
115
|
+
if (isMouseMovingTowardsSubmenu && submenuCloseTimeoutRef.current !== null) {
|
|
116
|
+
clearTimeout(submenuCloseTimeoutRef.current);
|
|
117
|
+
submenuCloseTimeoutRef.current = null;
|
|
118
|
+
}
|
|
119
|
+
if (!isMouseMovingTowardsSubmenu && submenuCloseTimeoutRef.current === null) {
|
|
120
|
+
submenuCloseTimeoutRef.current = setTimeout(() => {
|
|
121
|
+
submenuCloseTimeoutRef.current = null;
|
|
122
|
+
setSubmenuVisible(false);
|
|
123
|
+
}, SUBMENU_CLOSE_DELAY_MS);
|
|
124
|
+
}
|
|
106
125
|
}
|
|
107
126
|
stateRef.current.prevMouseCoords = currentMouseCoords;
|
|
108
127
|
}, MOUSE_MOVE_THROTTLE_MS);
|
|
@@ -114,6 +133,10 @@ const MenuItem = forwardRef(({ children, className, disabled = false, icon, subi
|
|
|
114
133
|
document.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
|
|
115
134
|
dropContainer.removeEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);
|
|
116
135
|
checkIfMouseIsMovingTowardsSubmenu.cancel();
|
|
136
|
+
if (submenuCloseTimeoutRef.current !== null) {
|
|
137
|
+
clearTimeout(submenuCloseTimeoutRef.current);
|
|
138
|
+
submenuCloseTimeoutRef.current = null;
|
|
139
|
+
}
|
|
117
140
|
stateRef.current = {
|
|
118
141
|
dropCoords: null,
|
|
119
142
|
isMouseOutsideItem: null,
|
package/Item.js.map
CHANGED
|
@@ -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 MOUSE_MOVE_THROTTLE_MS = 50;\nconst MIN_MOUSE_MOVE_SQUARED = 16;\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 } = 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 showSubmenu = () => {\n setSubmenuVisible(true);\n setItemWithVisibleSubmenu?.(itemRef.current);\n };\n\n const stateRef = useRef<{\n dropCoords: DOMRect | null;\n isMouseOutsideItem: boolean | null;\n prevMouseCoords: Point | null;\n submenuCoords: DOMRect | null;\n }>({\n dropCoords: null,\n isMouseOutsideItem: null,\n prevMouseCoords: null,\n submenuCoords: null,\n });\n\n useEffect(() => {\n if (itemWithVisibleSubmenu !== itemRef.current) {\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 if (\n stateRef.current.dropCoords !== null &&\n stateRef.current.isMouseOutsideItem &&\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 setSubmenuVisible((value) => value && isMouseMovingTowardsSubmenu);\n }\n\n stateRef.current.prevMouseCoords = currentMouseCoords;\n }, MOUSE_MOVE_THROTTLE_MS);\n\n document.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n dropContainer.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\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 checkIfMouseIsMovingTowardsSubmenu.cancel();\n\n stateRef.current = {\n dropCoords: null,\n isMouseOutsideItem: null,\n prevMouseCoords: null,\n submenuCoords: null,\n };\n };\n }, [dropContainer, submenuVisible, setSubmenuVisible]);\n\n return (\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 if (\n hasSubmenu &&\n !(submenuVisible && submenuRef.current?.contains(event.target as HTMLElement))\n ) {\n showSubmenu();\n stateRef.current.isMouseOutsideItem = false;\n }\n }\n }}\n onMouseLeave={(event) => {\n props.onMouseLeave?.(event);\n if (!isMobile) {\n setHover(false);\n if (hasSubmenu) {\n stateRef.current.isMouseOutsideItem = true;\n }\n }\n }}\n onMouseMove={(event) => {\n props.onMouseMove?.(event);\n if (\n hasSubmenu &&\n !(submenuVisible && submenuRef.current?.contains(event.target as HTMLElement))\n ) {\n showSubmenu();\n stateRef.current.isMouseOutsideItem = false;\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]}>{icon}</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 <MenuContext.Provider value={{ ...contextValue, submenuAllowed: false }}>\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 <Drop\n {...DROP_PROPS}\n activatorRef={itemRef}\n onClose={() => setSubmenuVisible(false)}\n placement={SUBMENU_DROP_PLACEMENT}\n ref={submenuRef}\n visible={submenuVisible}\n >\n {subitems}\n </Drop>\n {mobileSubmenuContainer &&\n createPortal(submenuVisible ? subitems : null, mobileSubmenuContainer)}\n {mobileTitleContainer &&\n createPortal(submenuVisible ? children : null, mobileTitleContainer)}\n </MenuContext.Provider>\n )}\n </div>\n </DisabledWrapper>\n );\n }\n);\n\nMenuItem.displayName = 'Menu.Item';\n"],"names":["_jsx","_jsxs"],"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 { 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 SUBMENU_CLOSE_DELAY_MS = 500;\n\nconst MOUSE_MOVE_THROTTLE_MS = 50;\nconst MIN_MOUSE_MOVE_SQUARED = 16;\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 } = 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 isMouseOutsideItem: boolean | null;\n prevMouseCoords: Point | null;\n submenuCoords: DOMRect | null;\n }>({\n dropCoords: null,\n isMouseOutsideItem: 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 if (\n stateRef.current.dropCoords !== null &&\n stateRef.current.isMouseOutsideItem &&\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 document.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\n dropContainer.addEventListener('mousemove', checkIfMouseIsMovingTowardsSubmenu);\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 checkIfMouseIsMovingTowardsSubmenu.cancel();\n\n if (submenuCloseTimeoutRef.current !== null) {\n clearTimeout(submenuCloseTimeoutRef.current);\n submenuCloseTimeoutRef.current = null;\n }\n\n stateRef.current = {\n dropCoords: null,\n isMouseOutsideItem: null,\n prevMouseCoords: null,\n submenuCoords: null,\n };\n };\n }, [dropContainer, submenuVisible, setSubmenuVisible]);\n\n return (\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 if (\n hasSubmenu &&\n !(submenuVisible && submenuRef.current?.contains(event.target as HTMLElement))\n ) {\n showSubmenu();\n stateRef.current.isMouseOutsideItem = false;\n }\n }\n }}\n onMouseLeave={(event) => {\n props.onMouseLeave?.(event);\n if (!isMobile) {\n setHover(false);\n if (hasSubmenu) {\n stateRef.current.isMouseOutsideItem = true;\n }\n }\n }}\n onMouseMove={(event) => {\n props.onMouseMove?.(event);\n if (\n hasSubmenu &&\n !(submenuVisible && submenuRef.current?.contains(event.target as HTMLElement))\n ) {\n showSubmenu();\n stateRef.current.isMouseOutsideItem = false;\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]}>{icon}</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 <MenuContext.Provider value={{ ...contextValue, submenuAllowed: false }}>\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 <Drop\n {...DROP_PROPS}\n activatorRef={itemRef}\n onClose={() => setSubmenuVisible(false)}\n placement={SUBMENU_DROP_PLACEMENT}\n ref={submenuRef}\n visible={submenuVisible}\n >\n {subitems}\n </Drop>\n {mobileSubmenuContainer &&\n createPortal(submenuVisible ? subitems : null, mobileSubmenuContainer)}\n {mobileTitleContainer &&\n createPortal(submenuVisible ? children : null, mobileTitleContainer)}\n </MenuContext.Provider>\n )}\n </div>\n </DisabledWrapper>\n );\n }\n);\n\nMenuItem.displayName = 'Menu.Item';\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
package/Menu.js
CHANGED
|
@@ -13,7 +13,7 @@ import { MenuQuickActions } from './QuickActions.js';
|
|
|
13
13
|
import { MenuSectionHeader } from './SectionHeader.js';
|
|
14
14
|
import { MenuContext } from './context.js';
|
|
15
15
|
import { NavBar } from '@hh.ru/magritte-ui-nav-bar';
|
|
16
|
-
import { s as styles } from './menu-
|
|
16
|
+
import { s as styles } from './menu-ChEsgmKq.js';
|
|
17
17
|
import '@hh.ru/magritte-ui-bottom-sheet';
|
|
18
18
|
import '@hh.ru/magritte-ui-divider';
|
|
19
19
|
import '@hh.ru/magritte-ui-drop';
|
package/QuickAction.js
CHANGED
|
@@ -4,7 +4,7 @@ import { forwardRef } from 'react';
|
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import { DisabledWrapper } from './DisabledWrapper.js';
|
|
6
6
|
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
7
|
-
import { s as styles } from './menu-
|
|
7
|
+
import { s as styles } from './menu-ChEsgmKq.js';
|
|
8
8
|
import '@hh.ru/magritte-common-use-disabled';
|
|
9
9
|
import '@hh.ru/magritte-ui-icon';
|
|
10
10
|
|
package/QuickActions.js
CHANGED
|
@@ -2,7 +2,7 @@ import './index.css';
|
|
|
2
2
|
import { jsx } from 'react/jsx-runtime';
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
4
|
import classnames from 'classnames';
|
|
5
|
-
import { s as styles } from './menu-
|
|
5
|
+
import { s as styles } from './menu-ChEsgmKq.js';
|
|
6
6
|
|
|
7
7
|
const MenuQuickActions = forwardRef(({ children, className, ...props }, ref) => {
|
|
8
8
|
return (jsx("div", { ...props, className: classnames(className, styles.quickActions), ref: ref, children: children }));
|
package/SectionHeader.js
CHANGED
|
@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
4
|
import { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';
|
|
5
5
|
import { SectionHeader } from '@hh.ru/magritte-ui-section-header';
|
|
6
|
-
import { s as styles } from './menu-
|
|
6
|
+
import { s as styles } from './menu-ChEsgmKq.js';
|
|
7
7
|
|
|
8
8
|
const MenuSectionHeader = forwardRef((props, ref) => {
|
|
9
9
|
const { isMobile } = useBreakpoint();
|
package/index.css
CHANGED
|
@@ -19,159 +19,159 @@
|
|
|
19
19
|
--magritte-color-background-state-negative-secondary-hovered-v24-7-3:#3D2622;
|
|
20
20
|
--magritte-color-background-state-negative-secondary-pressed-v24-7-3:#3D2622;
|
|
21
21
|
}
|
|
22
|
-
.magritte-disabled___ZuG-J_1-0-
|
|
22
|
+
.magritte-disabled___ZuG-J_1-0-5{
|
|
23
23
|
pointer-events:none;
|
|
24
24
|
}
|
|
25
25
|
@media (min-width: 1020px){
|
|
26
|
-
body.magritte-old-layout .magritte-drop-content-margin___q01ll_1-0-
|
|
26
|
+
body.magritte-old-layout .magritte-drop-content-margin___q01ll_1-0-5{
|
|
27
27
|
margin:0 12px;
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
30
|
@media (min-width: 1024px){
|
|
31
|
-
body:not(.magritte-old-layout) .magritte-drop-content-margin___q01ll_1-0-
|
|
31
|
+
body:not(.magritte-old-layout) .magritte-drop-content-margin___q01ll_1-0-5{
|
|
32
32
|
margin:0 12px;
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
|
-
.magritte-item___HyDAw_1-0-
|
|
35
|
+
.magritte-item___HyDAw_1-0-5{
|
|
36
36
|
display:flex;
|
|
37
37
|
gap:12px;
|
|
38
38
|
align-items:center;
|
|
39
39
|
padding:12px 16px;
|
|
40
40
|
}
|
|
41
41
|
@media (min-width: 1020px){
|
|
42
|
-
body.magritte-old-layout .magritte-item___HyDAw_1-0-
|
|
42
|
+
body.magritte-old-layout .magritte-item___HyDAw_1-0-5{
|
|
43
43
|
cursor:pointer;
|
|
44
44
|
border-radius:12px;
|
|
45
45
|
padding:10px 12px;
|
|
46
46
|
}
|
|
47
|
-
body.magritte-old-layout .magritte-item___HyDAw_1-0-
|
|
47
|
+
body.magritte-old-layout .magritte-item___HyDAw_1-0-5.focus-visible{
|
|
48
48
|
outline:4px solid var(--magritte-color-stroke-state-focused-accessible-v24-7-3);
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
51
|
@media (min-width: 1024px){
|
|
52
|
-
body:not(.magritte-old-layout) .magritte-item___HyDAw_1-0-
|
|
52
|
+
body:not(.magritte-old-layout) .magritte-item___HyDAw_1-0-5{
|
|
53
53
|
cursor:pointer;
|
|
54
54
|
border-radius:12px;
|
|
55
55
|
padding:10px 12px;
|
|
56
56
|
}
|
|
57
|
-
body:not(.magritte-old-layout) .magritte-item___HyDAw_1-0-
|
|
57
|
+
body:not(.magritte-old-layout) .magritte-item___HyDAw_1-0-5.focus-visible{
|
|
58
58
|
outline:4px solid var(--magritte-color-stroke-state-focused-accessible-v24-7-3);
|
|
59
59
|
}
|
|
60
60
|
}
|
|
61
|
-
.magritte-neutral___WyGeQ_1-0-
|
|
61
|
+
.magritte-neutral___WyGeQ_1-0-5:active{
|
|
62
62
|
background-color:var(--magritte-color-background-state-secondary-pressed-v24-7-3);
|
|
63
63
|
}
|
|
64
64
|
@media (min-width: 1020px){
|
|
65
|
-
body.magritte-old-layout .magritte-neutral___WyGeQ_1-0-
|
|
65
|
+
body.magritte-old-layout .magritte-neutral___WyGeQ_1-0-5:hover:not(:active){
|
|
66
66
|
background-color:var(--magritte-color-background-state-secondary-hovered-v24-7-3);
|
|
67
67
|
}
|
|
68
68
|
}
|
|
69
69
|
@media (min-width: 1024px){
|
|
70
|
-
body:not(.magritte-old-layout) .magritte-neutral___WyGeQ_1-0-
|
|
70
|
+
body:not(.magritte-old-layout) .magritte-neutral___WyGeQ_1-0-5:hover:not(:active){
|
|
71
71
|
background-color:var(--magritte-color-background-state-secondary-hovered-v24-7-3);
|
|
72
72
|
}
|
|
73
73
|
}
|
|
74
|
-
.magritte-negative___F7a0c_1-0-
|
|
74
|
+
.magritte-negative___F7a0c_1-0-5:active{
|
|
75
75
|
background-color:var(--magritte-color-background-state-negative-secondary-pressed-v24-7-3);
|
|
76
76
|
}
|
|
77
77
|
@media (min-width: 1020px){
|
|
78
|
-
body.magritte-old-layout .magritte-negative___F7a0c_1-0-
|
|
78
|
+
body.magritte-old-layout .magritte-negative___F7a0c_1-0-5:hover:not(:active){
|
|
79
79
|
background-color:var(--magritte-color-background-state-negative-secondary-hovered-v24-7-3);
|
|
80
80
|
}
|
|
81
81
|
}
|
|
82
82
|
@media (min-width: 1024px){
|
|
83
|
-
body:not(.magritte-old-layout) .magritte-negative___F7a0c_1-0-
|
|
83
|
+
body:not(.magritte-old-layout) .magritte-negative___F7a0c_1-0-5:hover:not(:active){
|
|
84
84
|
background-color:var(--magritte-color-background-state-negative-secondary-hovered-v24-7-3);
|
|
85
85
|
}
|
|
86
86
|
}
|
|
87
|
-
.magritte-item-icon___yCv9l_1-0-
|
|
87
|
+
.magritte-item-icon___yCv9l_1-0-5{
|
|
88
88
|
flex:0 0 auto;
|
|
89
89
|
padding:4px 0;
|
|
90
90
|
}
|
|
91
91
|
@media (min-width: 1020px){
|
|
92
|
-
body.magritte-old-layout .magritte-item-icon___yCv9l_1-0-
|
|
92
|
+
body.magritte-old-layout .magritte-item-icon___yCv9l_1-0-5{
|
|
93
93
|
padding:0;
|
|
94
94
|
}
|
|
95
95
|
}
|
|
96
96
|
@media (min-width: 1024px){
|
|
97
|
-
body:not(.magritte-old-layout) .magritte-item-icon___yCv9l_1-0-
|
|
97
|
+
body:not(.magritte-old-layout) .magritte-item-icon___yCv9l_1-0-5{
|
|
98
98
|
padding:0;
|
|
99
99
|
}
|
|
100
100
|
}
|
|
101
|
-
.magritte-item-text___GL3A5_1-0-
|
|
101
|
+
.magritte-item-text___GL3A5_1-0-5{
|
|
102
102
|
flex:1 1 auto;
|
|
103
103
|
min-width:0;
|
|
104
104
|
padding:4px 0;
|
|
105
105
|
}
|
|
106
106
|
@media (min-width: 1020px){
|
|
107
|
-
body.magritte-old-layout .magritte-item-text___GL3A5_1-0-
|
|
107
|
+
body.magritte-old-layout .magritte-item-text___GL3A5_1-0-5{
|
|
108
108
|
padding:0;
|
|
109
109
|
}
|
|
110
110
|
}
|
|
111
111
|
@media (min-width: 1024px){
|
|
112
|
-
body:not(.magritte-old-layout) .magritte-item-text___GL3A5_1-0-
|
|
112
|
+
body:not(.magritte-old-layout) .magritte-item-text___GL3A5_1-0-5{
|
|
113
113
|
padding:0;
|
|
114
114
|
}
|
|
115
115
|
}
|
|
116
|
-
.magritte-item-tag___KX5wL_1-0-
|
|
116
|
+
.magritte-item-tag___KX5wL_1-0-5{
|
|
117
117
|
flex:0 1 auto;
|
|
118
118
|
min-width:0;
|
|
119
119
|
padding:4px 0;
|
|
120
120
|
}
|
|
121
121
|
@media (min-width: 1020px){
|
|
122
|
-
body.magritte-old-layout .magritte-item-tag___KX5wL_1-0-
|
|
122
|
+
body.magritte-old-layout .magritte-item-tag___KX5wL_1-0-5{
|
|
123
123
|
padding:0;
|
|
124
124
|
}
|
|
125
125
|
}
|
|
126
126
|
@media (min-width: 1024px){
|
|
127
|
-
body:not(.magritte-old-layout) .magritte-item-tag___KX5wL_1-0-
|
|
127
|
+
body:not(.magritte-old-layout) .magritte-item-tag___KX5wL_1-0-5{
|
|
128
128
|
padding:0;
|
|
129
129
|
}
|
|
130
130
|
}
|
|
131
|
-
.magritte-item-right-content___U2hc1_1-0-
|
|
131
|
+
.magritte-item-right-content___U2hc1_1-0-5{
|
|
132
132
|
flex:0 1 auto;
|
|
133
133
|
min-width:0;
|
|
134
134
|
display:flex;
|
|
135
135
|
align-items:center;
|
|
136
136
|
gap:8px;
|
|
137
137
|
}
|
|
138
|
-
.magritte-mobile-menu-container___zlY08_1-0-
|
|
138
|
+
.magritte-mobile-menu-container___zlY08_1-0-5{
|
|
139
139
|
position:relative;
|
|
140
140
|
overflow:hidden;
|
|
141
141
|
}
|
|
142
|
-
.magritte-mobile-main-menu-container___fOW3d_1-0-
|
|
142
|
+
.magritte-mobile-main-menu-container___fOW3d_1-0-5{
|
|
143
143
|
position:relative;
|
|
144
144
|
}
|
|
145
|
-
.magritte-mobile-submenu-container___od1Ev_1-0-
|
|
145
|
+
.magritte-mobile-submenu-container___od1Ev_1-0-5{
|
|
146
146
|
position:absolute;
|
|
147
147
|
inset:0 -100% auto 100%;
|
|
148
148
|
}
|
|
149
149
|
@media (prefers-reduced-motion: no-preference){
|
|
150
|
-
.magritte-mobile-main-menu-container___fOW3d_1-0-
|
|
151
|
-
.magritte-mobile-submenu-container___od1Ev_1-0-
|
|
150
|
+
.magritte-mobile-main-menu-container___fOW3d_1-0-5,
|
|
151
|
+
.magritte-mobile-submenu-container___od1Ev_1-0-5{
|
|
152
152
|
transition:transform var(--magritte-semantic-animation-time-m-duration-v24-7-3) var(--magritte-semantic-animation-ease-base-timing-function-v24-7-3);
|
|
153
153
|
}
|
|
154
154
|
}
|
|
155
|
-
.magritte-mobile-menu-container-slide___HXiEx_1-0-
|
|
156
|
-
.magritte-mobile-menu-container-slide___HXiEx_1-0-
|
|
155
|
+
.magritte-mobile-menu-container-slide___HXiEx_1-0-5 .magritte-mobile-main-menu-container___fOW3d_1-0-5,
|
|
156
|
+
.magritte-mobile-menu-container-slide___HXiEx_1-0-5 .magritte-mobile-submenu-container___od1Ev_1-0-5{
|
|
157
157
|
transform:translateX(-100%);
|
|
158
158
|
}
|
|
159
|
-
.magritte-quick-actions___HvUJ3_1-0-
|
|
159
|
+
.magritte-quick-actions___HvUJ3_1-0-5{
|
|
160
160
|
display:flex;
|
|
161
161
|
gap:4px;
|
|
162
162
|
margin:0 16px 4px;
|
|
163
163
|
}
|
|
164
164
|
@media (min-width: 1020px){
|
|
165
|
-
body.magritte-old-layout .magritte-quick-actions___HvUJ3_1-0-
|
|
165
|
+
body.magritte-old-layout .magritte-quick-actions___HvUJ3_1-0-5{
|
|
166
166
|
margin:0 12px 4px;
|
|
167
167
|
}
|
|
168
168
|
}
|
|
169
169
|
@media (min-width: 1024px){
|
|
170
|
-
body:not(.magritte-old-layout) .magritte-quick-actions___HvUJ3_1-0-
|
|
170
|
+
body:not(.magritte-old-layout) .magritte-quick-actions___HvUJ3_1-0-5{
|
|
171
171
|
margin:0 12px 4px;
|
|
172
172
|
}
|
|
173
173
|
}
|
|
174
|
-
.magritte-quick-action___1K5Ip_1-0-
|
|
174
|
+
.magritte-quick-action___1K5Ip_1-0-5{
|
|
175
175
|
display:flex;
|
|
176
176
|
flex-direction:column;
|
|
177
177
|
align-items:center;
|
|
@@ -182,31 +182,31 @@
|
|
|
182
182
|
min-width:0;
|
|
183
183
|
padding:14px 12px;
|
|
184
184
|
}
|
|
185
|
-
.magritte-quick-action___1K5Ip_1-0-
|
|
185
|
+
.magritte-quick-action___1K5Ip_1-0-5:active{
|
|
186
186
|
background-color:var(--magritte-color-background-state-secondary-pressed-v24-7-3);
|
|
187
187
|
}
|
|
188
188
|
@media (min-width: 1020px){
|
|
189
|
-
body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-
|
|
189
|
+
body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-5{
|
|
190
190
|
cursor:pointer;
|
|
191
191
|
}
|
|
192
|
-
body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-
|
|
192
|
+
body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-5:hover:not(:active){
|
|
193
193
|
background-color:var(--magritte-color-background-state-secondary-hovered-v24-7-3);
|
|
194
194
|
}
|
|
195
|
-
body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-
|
|
195
|
+
body.magritte-old-layout .magritte-quick-action___1K5Ip_1-0-5.focus-visible{
|
|
196
196
|
outline:4px solid var(--magritte-color-stroke-state-focused-accessible-v24-7-3);
|
|
197
197
|
}
|
|
198
198
|
}
|
|
199
199
|
@media (min-width: 1024px){
|
|
200
|
-
body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-
|
|
200
|
+
body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-5{
|
|
201
201
|
cursor:pointer;
|
|
202
202
|
}
|
|
203
|
-
body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-
|
|
203
|
+
body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-5:hover:not(:active){
|
|
204
204
|
background-color:var(--magritte-color-background-state-secondary-hovered-v24-7-3);
|
|
205
205
|
}
|
|
206
|
-
body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-
|
|
206
|
+
body:not(.magritte-old-layout) .magritte-quick-action___1K5Ip_1-0-5.focus-visible{
|
|
207
207
|
outline:4px solid var(--magritte-color-stroke-state-focused-accessible-v24-7-3);
|
|
208
208
|
}
|
|
209
209
|
}
|
|
210
|
-
.magritte-quick-action-text___diFW5_1-0-
|
|
210
|
+
.magritte-quick-action-text___diFW5_1-0-5{
|
|
211
211
|
max-width:100%;
|
|
212
212
|
}
|
package/index.js
CHANGED
|
@@ -22,7 +22,7 @@ import './DisabledWrapper.js';
|
|
|
22
22
|
import '@hh.ru/magritte-common-use-disabled';
|
|
23
23
|
import '@hh.ru/magritte-ui-typography';
|
|
24
24
|
import '@hh.ru/magritte-ui-switch';
|
|
25
|
-
import './menu-
|
|
25
|
+
import './menu-ChEsgmKq.js';
|
|
26
26
|
import './QuickAction.js';
|
|
27
27
|
import './QuickActions.js';
|
|
28
28
|
import './SectionHeader.js';
|
package/menu-ChEsgmKq.js
ADDED
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import './index.css';
|
|
2
|
+
var styles = {"disabled":"magritte-disabled___ZuG-J_1-0-5","drop-content-margin":"magritte-drop-content-margin___q01ll_1-0-5","dropContentMargin":"magritte-drop-content-margin___q01ll_1-0-5","item":"magritte-item___HyDAw_1-0-5","neutral":"magritte-neutral___WyGeQ_1-0-5","negative":"magritte-negative___F7a0c_1-0-5","item-icon":"magritte-item-icon___yCv9l_1-0-5","itemIcon":"magritte-item-icon___yCv9l_1-0-5","item-text":"magritte-item-text___GL3A5_1-0-5","itemText":"magritte-item-text___GL3A5_1-0-5","item-tag":"magritte-item-tag___KX5wL_1-0-5","itemTag":"magritte-item-tag___KX5wL_1-0-5","item-right-content":"magritte-item-right-content___U2hc1_1-0-5","itemRightContent":"magritte-item-right-content___U2hc1_1-0-5","mobile-menu-container":"magritte-mobile-menu-container___zlY08_1-0-5","mobileMenuContainer":"magritte-mobile-menu-container___zlY08_1-0-5","mobile-main-menu-container":"magritte-mobile-main-menu-container___fOW3d_1-0-5","mobileMainMenuContainer":"magritte-mobile-main-menu-container___fOW3d_1-0-5","mobile-submenu-container":"magritte-mobile-submenu-container___od1Ev_1-0-5","mobileSubmenuContainer":"magritte-mobile-submenu-container___od1Ev_1-0-5","mobile-menu-container-slide":"magritte-mobile-menu-container-slide___HXiEx_1-0-5","mobileMenuContainerSlide":"magritte-mobile-menu-container-slide___HXiEx_1-0-5","quick-actions":"magritte-quick-actions___HvUJ3_1-0-5","quickActions":"magritte-quick-actions___HvUJ3_1-0-5","quick-action":"magritte-quick-action___1K5Ip_1-0-5","quickAction":"magritte-quick-action___1K5Ip_1-0-5","quick-action-text":"magritte-quick-action-text___diFW5_1-0-5","quickActionText":"magritte-quick-action-text___diFW5_1-0-5"};
|
|
3
|
+
|
|
4
|
+
export { styles as s };
|
|
5
|
+
//# sourceMappingURL=menu-ChEsgmKq.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-ChEsgmKq.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hh.ru/magritte-ui-menu",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.5",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"types": "index.d.ts",
|
|
6
6
|
"sideEffects": [
|
|
@@ -44,5 +44,5 @@
|
|
|
44
44
|
"publishConfig": {
|
|
45
45
|
"access": "public"
|
|
46
46
|
},
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "4f03f111922951e25dcee7e5ce8ea032a5a91b4a"
|
|
48
48
|
}
|
package/menu-C4s0Y0kc.js
DELETED
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import './index.css';
|
|
2
|
-
var styles = {"disabled":"magritte-disabled___ZuG-J_1-0-4","drop-content-margin":"magritte-drop-content-margin___q01ll_1-0-4","dropContentMargin":"magritte-drop-content-margin___q01ll_1-0-4","item":"magritte-item___HyDAw_1-0-4","neutral":"magritte-neutral___WyGeQ_1-0-4","negative":"magritte-negative___F7a0c_1-0-4","item-icon":"magritte-item-icon___yCv9l_1-0-4","itemIcon":"magritte-item-icon___yCv9l_1-0-4","item-text":"magritte-item-text___GL3A5_1-0-4","itemText":"magritte-item-text___GL3A5_1-0-4","item-tag":"magritte-item-tag___KX5wL_1-0-4","itemTag":"magritte-item-tag___KX5wL_1-0-4","item-right-content":"magritte-item-right-content___U2hc1_1-0-4","itemRightContent":"magritte-item-right-content___U2hc1_1-0-4","mobile-menu-container":"magritte-mobile-menu-container___zlY08_1-0-4","mobileMenuContainer":"magritte-mobile-menu-container___zlY08_1-0-4","mobile-main-menu-container":"magritte-mobile-main-menu-container___fOW3d_1-0-4","mobileMainMenuContainer":"magritte-mobile-main-menu-container___fOW3d_1-0-4","mobile-submenu-container":"magritte-mobile-submenu-container___od1Ev_1-0-4","mobileSubmenuContainer":"magritte-mobile-submenu-container___od1Ev_1-0-4","mobile-menu-container-slide":"magritte-mobile-menu-container-slide___HXiEx_1-0-4","mobileMenuContainerSlide":"magritte-mobile-menu-container-slide___HXiEx_1-0-4","quick-actions":"magritte-quick-actions___HvUJ3_1-0-4","quickActions":"magritte-quick-actions___HvUJ3_1-0-4","quick-action":"magritte-quick-action___1K5Ip_1-0-4","quickAction":"magritte-quick-action___1K5Ip_1-0-4","quick-action-text":"magritte-quick-action-text___diFW5_1-0-4","quickActionText":"magritte-quick-action-text___diFW5_1-0-4"};
|
|
3
|
-
|
|
4
|
-
export { styles as s };
|
|
5
|
-
//# sourceMappingURL=menu-C4s0Y0kc.js.map
|
package/menu-C4s0Y0kc.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"menu-C4s0Y0kc.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|