@fluentui/react-menu 9.0.0-rc.10 → 9.0.0-rc.13
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +160 -1
- package/CHANGELOG.md +48 -2
- package/dist/index.d.ts +3 -53
- package/lib/components/Menu/Menu.types.js.map +1 -1
- package/lib/components/Menu/useMenu.js +5 -5
- package/lib/components/Menu/useMenu.js.map +1 -1
- package/lib/components/MenuDivider/useMenuDividerStyles.js +4 -8
- package/lib/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
- package/lib/components/MenuGroup/useMenuGroupStyles.js +0 -5
- package/lib/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +0 -5
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
- package/lib/components/MenuItem/useMenuItem.js +1 -1
- package/lib/components/MenuItem/useMenuItem.js.map +1 -1
- package/lib/components/MenuItem/useMenuItemStyles.js +5 -11
- package/lib/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js +0 -5
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js +0 -5
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib/components/MenuList/useMenuListStyles.js +0 -5
- package/lib/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopover.js +1 -1
- package/lib/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib/components/MenuPopover/useMenuPopoverStyles.js +0 -5
- package/lib/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroup.js +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroup.js.map +1 -1
- package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js +0 -5
- package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
- package/lib/components/MenuTrigger/useMenuTrigger.js +1 -1
- package/lib/components/MenuTrigger/useMenuTrigger.js.map +1 -1
- package/lib/index.js +11 -20
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/Menu/useMenu.js +4 -4
- package/lib-commonjs/components/Menu/useMenu.js.map +1 -1
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js +5 -9
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.js.map +1 -1
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js +1 -6
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.js.map +1 -1
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js +1 -6
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItem.js +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItem.js.map +1 -1
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js +6 -12
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js +1 -6
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.js.map +1 -1
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js +1 -6
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.js.map +1 -1
- package/lib-commonjs/components/MenuList/useMenuListStyles.js +1 -6
- package/lib-commonjs/components/MenuList/useMenuListStyles.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopover.js +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopover.js.map +1 -1
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js +1 -6
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.js +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.js.map +1 -1
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js +1 -6
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.js.map +1 -1
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.js +1 -1
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.js.map +1 -1
- package/lib-commonjs/index.js +2 -77
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +10 -10
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuItem/useMenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SACE,gBADF,EAEE,6BAFF,EAGE,gBAHF,EAIE,aAJF,EAKE,qBALF,QAMO,2BANP;AAOA,SAAS,
|
1
|
+
{"version":3,"sources":["components/MenuItem/useMenuItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {\n useEventCallback,\n shouldPreventDefaultOnKeyDown,\n resolveShorthand,\n useMergedRefs,\n getNativeElementProps,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useCharacterSearch } from './useCharacterSearch';\nimport { useMenuTriggerContext_unstable } from '../../contexts/menuTriggerContext';\nimport { ChevronRightRegular as ChevronRightIcon, ChevronLeftRegular as ChevronLeftIcon } from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport type { MenuItemProps, MenuItemState } from './MenuItem.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuItem_unstable = (props: MenuItemProps, ref: React.Ref<HTMLElement>): MenuItemState => {\n const hasIcons = useMenuListContext_unstable(context => context.hasIcons);\n const hasCheckmarks = useMenuListContext_unstable(context => context.hasCheckmarks);\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n const persistOnClickContext = useMenuContext_unstable(context => context.persistOnItemClick);\n const dismissedWithKeyboardRef = React.useRef(false);\n\n const isSubmenuTrigger = useMenuTriggerContext_unstable();\n const hasSubmenu = props.hasSubmenu ?? isSubmenuTrigger;\n\n const { dir } = useFluent();\n const innerRef = React.useRef<HTMLElement>(null);\n\n const state: MenuItemState = {\n hasSubmenu,\n ...props,\n components: {\n root: 'div',\n icon: 'span',\n checkmark: 'span',\n submenuIndicator: 'span',\n content: 'span',\n secondaryContent: 'span',\n },\n root: getNativeElementProps('div', {\n ref: useMergedRefs(ref, innerRef),\n role: 'menuitem',\n tabIndex: 0,\n 'aria-disabled': props.disabled,\n ...props,\n }),\n icon: resolveShorthand(props.icon, { required: hasIcons }),\n checkmark: resolveShorthand(props.checkmark, { required: hasCheckmarks }),\n submenuIndicator: resolveShorthand(props.submenuIndicator, {\n required: hasSubmenu,\n defaultProps: {\n children: dir === 'ltr' ? <ChevronRightIcon /> : <ChevronLeftIcon />,\n },\n }),\n content: resolveShorthand(props.content, {\n required: !!props.children,\n defaultProps: { children: props.children },\n }),\n secondaryContent: resolveShorthand(props.secondaryContent),\n };\n\n const { onClick: onClickOriginal, onKeyDown: onKeyDownOriginal } = state.root;\n state.root.onKeyDown = e => {\n if (shouldPreventDefaultOnKeyDown(e)) {\n if (state.disabled) {\n e.preventDefault();\n e.stopPropagation();\n return;\n }\n\n dismissedWithKeyboardRef.current = true;\n e.preventDefault();\n (e.target as HTMLElement)?.click();\n }\n\n onKeyDownOriginal?.(e);\n };\n\n state.root.onClick = e => {\n if (state.disabled) {\n e.preventDefault();\n e.stopPropagation();\n return;\n }\n\n let shouldPersist = persistOnClickContext;\n // prop wins over context;\n if (state.persistOnClick !== undefined && persistOnClickContext !== state.persistOnClick) {\n shouldPersist = state.persistOnClick;\n }\n\n if (!hasSubmenu && !shouldPersist) {\n setOpen(e, { open: false, keyboard: dismissedWithKeyboardRef.current, bubble: true });\n dismissedWithKeyboardRef.current = false;\n }\n\n onClickOriginal?.(e);\n };\n\n const { onMouseEnter: onMouseEnterOriginal } = state.root;\n state.root.onMouseEnter = useEventCallback(e => {\n innerRef.current?.focus();\n\n onMouseEnterOriginal?.(e);\n });\n\n useCharacterSearch(state, innerRef);\n return state;\n};\n"],"sourceRoot":"../src/"}
|
@@ -3,11 +3,6 @@ import { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons
|
|
3
3
|
import { createFocusOutlineStyle } from '@fluentui/react-tabster';
|
4
4
|
import { tokens } from '@fluentui/react-theme';
|
5
5
|
import { useCheckmarkStyles_unstable } from '../../selectable/index';
|
6
|
-
/**
|
7
|
-
* @deprecated Use `menuItemClassNames.root` instead.
|
8
|
-
*/
|
9
|
-
|
10
|
-
export const menuItemClassName = 'fui-MenuItem';
|
11
6
|
export const menuItemClassNames = {
|
12
7
|
root: 'fui-MenuItem',
|
13
8
|
icon: 'fui-MenuItem__icon',
|
@@ -19,7 +14,7 @@ export const menuItemClassNames = {
|
|
19
14
|
|
20
15
|
const useStyles = /*#__PURE__*/__styles({
|
21
16
|
"focusIndicator": {
|
22
|
-
"
|
17
|
+
"Brovlpu": "ftqa4ok",
|
23
18
|
"Bnmjwt4": "flfsvnh",
|
24
19
|
"Jopkrh": ["f1781m5e", "flvaaa9"],
|
25
20
|
"hhrs2v": "f50u1b5",
|
@@ -55,7 +50,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
55
50
|
"B7oj6ja": ["f1jar5jt", "fyu767a"],
|
56
51
|
"Btl43ni": ["fyu767a", "f1jar5jt"],
|
57
52
|
"qhf8xq": "f10pi13n",
|
58
|
-
"sj55zd": "
|
53
|
+
"sj55zd": "fkfq4zb",
|
59
54
|
"De3pzq": "fxugw4r",
|
60
55
|
"z189sj": ["f81rol6", "frdkuqy"],
|
61
56
|
"uwmqm3": ["frdkuqy", "f81rol6"],
|
@@ -110,10 +105,9 @@ const useStyles = /*#__PURE__*/__styles({
|
|
110
105
|
"t0hwav": "ft33916"
|
111
106
|
}
|
112
107
|
}, {
|
113
|
-
"
|
114
|
-
"d": ["[data-keyboard-nav] .flfsvnh:focus{border-top-color:transparent;}", "[data-keyboard-nav] .f1781m5e:focus{border-right-color:transparent;}", "[data-keyboard-nav] .flvaaa9:focus{border-left-color:transparent;}", "[data-keyboard-nav] .f50u1b5:focus{border-bottom-color:transparent;}", "[data-keyboard-nav] .f1pxpxw8:focus:after{content:\"\";}", "[data-keyboard-nav] .f1149fnl:focus:after{position:absolute;}", "[data-keyboard-nav] .fd1orka:focus:after{pointer-events:none;}", "[data-keyboard-nav] .fq7mjg8:focus:after{z-index:1;}", "[data-keyboard-nav] .fmqgchs:focus:after{border-top-style:solid;}", "[data-keyboard-nav] .f1lv6wi8:focus:after{border-right-style:solid;}", "[data-keyboard-nav] .famjx04:focus:after{border-left-style:solid;}", "[data-keyboard-nav] .f1nbyjd2:focus:after{border-bottom-style:solid;}", "[data-keyboard-nav] .f5n18is:focus:after{border-top-width:2px;}", "[data-keyboard-nav] .f13az7yk:focus:after{border-right-width:2px;}", "[data-keyboard-nav] .f14kwzu1:focus:after{border-left-width:2px;}", "[data-keyboard-nav] .fneogx5:focus:after{border-bottom-width:2px;}", "[data-keyboard-nav] .f1f0b0sl:focus:after{border-bottom-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .flsib9d:focus:after{border-bottom-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .fbewl49:focus:after{border-top-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .fs55jlu:focus:after{border-top-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f1f43d5r:focus:after{border-top-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1ib27sc:focus:after{border-right-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f14s7j5v:focus:after{border-left-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f13oqbgc:focus:after{border-bottom-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1284xzw:focus:after{top:-2px;}", "[data-keyboard-nav] .f14dru39:focus:after{bottom:-2px;}", "[data-keyboard-nav] .fvabyfg:focus:after{left:-2px;}", "[data-keyboard-nav] .f12y1wz2:focus:after{right:-2px;}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f10pi13n{position:relative;}", ".
|
115
|
-
"h": [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".ft1hn21:hover .fui-Icon-filled{display:inline;}", ".f1y6u72f:hover .fui-Icon-filled{color:var(--colorNeutralForeground2BrandSelected);}", ".fuxngvv:hover .fui-Icon-regular{display:none;}", ".f1jp5ecu:hover{color:var(--colorNeutralForeground3Hover);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}"]
|
116
|
-
"f": [".fc1cou1:focus{color:var(--colorNeutralForeground3Hover);}", ".ft33916:focus{color:var(--colorNeutralForegroundDisabled);}"]
|
108
|
+
"f": [".ftqa4ok:focus{outline-style:none;}", ".fc1cou1:focus{color:var(--colorNeutralForeground3Hover);}", ".ft33916:focus{color:var(--colorNeutralForegroundDisabled);}"],
|
109
|
+
"d": ["[data-keyboard-nav] .flfsvnh:focus{border-top-color:transparent;}", "[data-keyboard-nav] .f1781m5e:focus{border-right-color:transparent;}", "[data-keyboard-nav] .flvaaa9:focus{border-left-color:transparent;}", "[data-keyboard-nav] .f50u1b5:focus{border-bottom-color:transparent;}", "[data-keyboard-nav] .f1pxpxw8:focus:after{content:\"\";}", "[data-keyboard-nav] .f1149fnl:focus:after{position:absolute;}", "[data-keyboard-nav] .fd1orka:focus:after{pointer-events:none;}", "[data-keyboard-nav] .fq7mjg8:focus:after{z-index:1;}", "[data-keyboard-nav] .fmqgchs:focus:after{border-top-style:solid;}", "[data-keyboard-nav] .f1lv6wi8:focus:after{border-right-style:solid;}", "[data-keyboard-nav] .famjx04:focus:after{border-left-style:solid;}", "[data-keyboard-nav] .f1nbyjd2:focus:after{border-bottom-style:solid;}", "[data-keyboard-nav] .f5n18is:focus:after{border-top-width:2px;}", "[data-keyboard-nav] .f13az7yk:focus:after{border-right-width:2px;}", "[data-keyboard-nav] .f14kwzu1:focus:after{border-left-width:2px;}", "[data-keyboard-nav] .fneogx5:focus:after{border-bottom-width:2px;}", "[data-keyboard-nav] .f1f0b0sl:focus:after{border-bottom-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .flsib9d:focus:after{border-bottom-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .fbewl49:focus:after{border-top-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .fs55jlu:focus:after{border-top-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f1f43d5r:focus:after{border-top-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1ib27sc:focus:after{border-right-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f14s7j5v:focus:after{border-left-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f13oqbgc:focus:after{border-bottom-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1284xzw:focus:after{top:-2px;}", "[data-keyboard-nav] .f14dru39:focus:after{bottom:-2px;}", "[data-keyboard-nav] .fvabyfg:focus:after{left:-2px;}", "[data-keyboard-nav] .f12y1wz2:focus:after{right:-2px;}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f10pi13n{position:relative;}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f81rol6{padding-right:10px;}", ".frdkuqy{padding-left:10px;}", ".f1d2rq10{height:32px;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1k6fduh{cursor:pointer;}", ".f1q8lukm{-webkit-column-gap:4px;column-gap:4px;}", ".f1ma2n7n{row-gap:4px;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f161knb0{padding-left:2px;}", ".f12huiiw{padding-right:2px;}", ".f3rmtva{background-color:transparent;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f64fuq3{width:20px;}", ".fjamq6b{height:20px;}", ".fe5j1ua{font-size:20px;}", ".fez10in{line-height:0;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}"],
|
110
|
+
"h": [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".ft1hn21:hover .fui-Icon-filled{display:inline;}", ".f1y6u72f:hover .fui-Icon-filled{color:var(--colorNeutralForeground2BrandSelected);}", ".fuxngvv:hover .fui-Icon-regular{display:none;}", ".f1jp5ecu:hover{color:var(--colorNeutralForeground3Hover);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}"]
|
117
111
|
});
|
118
112
|
/** Applies style classnames to slots */
|
119
113
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuItem/useMenuItemStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,YAAmC,UAAnC,QAAqD,gBAArD;AACA,SAAS,mBAAT,EAA8B,oBAA9B,QAA0D,uBAA1D;AACA,SAAS,uBAAT,QAAwC,yBAAxC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AACA,SAAS,2BAAT,QAA4C,wBAA5C;AAKA
|
1
|
+
{"version":3,"sources":["components/MenuItem/useMenuItemStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { MenuItemCheckboxState } from '../MenuItemCheckbox/index';\nimport type { MenuItemSlots, MenuItemState } from './MenuItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuItemClassNames: SlotClassNames<MenuItemSlots> = {\n root: 'fui-MenuItem',\n icon: 'fui-MenuItem__icon',\n checkmark: 'fui-MenuItem__checkmark',\n submenuIndicator: 'fui-MenuItem__submenuIndicator',\n content: 'fui-MenuItem__content',\n secondaryContent: 'fui-MenuItem__secondaryContent',\n};\n\nconst useStyles = makeStyles({\n focusIndicator: createFocusOutlineStyle(),\n root: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n position: 'relative',\n color: tokens.colorNeutralForeground2,\n backgroundColor: tokens.colorNeutralBackground1,\n paddingRight: '10px',\n paddingLeft: '10px',\n height: '32px',\n display: 'flex',\n alignItems: 'center',\n fontSize: tokens.fontSizeBase300,\n cursor: 'pointer',\n ...shorthands.gap('4px'),\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n color: tokens.colorNeutralForeground2Hover,\n\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n },\n\n userSelect: 'none',\n },\n content: {\n paddingLeft: '2px',\n paddingRight: '2px',\n backgroundColor: 'transparent',\n flexGrow: 1,\n },\n secondaryContent: {\n paddingLeft: '2px',\n paddingRight: '2px',\n color: tokens.colorNeutralForeground3,\n ':hover': {\n color: tokens.colorNeutralForeground3Hover,\n },\n ':focus': {\n color: tokens.colorNeutralForeground3Hover,\n },\n },\n icon: {\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n },\n submenuIndicator: {\n width: '20px',\n height: '20px',\n fontSize: '20px',\n lineHeight: 0,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n ':hover': {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n ':focus': {\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n});\n\n/** Applies style classnames to slots */\nexport const useMenuItemStyles_unstable = (state: MenuItemState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n menuItemClassNames.root,\n styles.root,\n styles.focusIndicator,\n state.disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemClassNames.content, styles.content, state.content.className);\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemClassNames.checkmark, state.checkmark.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemClassNames.secondaryContent,\n !state.disabled && styles.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemClassNames.icon, styles.icon, state.icon.className);\n }\n\n if (state.submenuIndicator) {\n state.submenuIndicator.className = mergeClasses(\n menuItemClassNames.submenuIndicator,\n styles.submenuIndicator,\n state.submenuIndicator.className,\n );\n }\n useCheckmarkStyles_unstable(state as MenuItemCheckboxState);\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,11 +1,6 @@
|
|
1
1
|
import { mergeClasses } from '@griffel/react';
|
2
2
|
import { useCheckmarkStyles_unstable } from '../../selectable/index';
|
3
3
|
import { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';
|
4
|
-
/**
|
5
|
-
* @deprecated Use `menuItemCheckboxClassNames.root` instead.
|
6
|
-
*/
|
7
|
-
|
8
|
-
export const menuItemCheckboxClassName = 'fui-MenuItemCheckbox';
|
9
4
|
export const menuItemCheckboxClassNames = {
|
10
5
|
root: 'fui-MenuItemCheckbox',
|
11
6
|
icon: 'fui-MenuItemCheckbox__icon',
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuItemCheckbox/useMenuItemCheckboxStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,QAA6B,gBAA7B;AACA,SAAS,2BAAT,QAA4C,wBAA5C;AAEA,SAAS,0BAAT,QAA2C,+BAA3C;AAGA
|
1
|
+
{"version":3,"sources":["components/MenuItemCheckbox/useMenuItemCheckboxStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,QAA6B,gBAA7B;AACA,SAAS,2BAAT,QAA4C,wBAA5C;AAEA,SAAS,0BAAT,QAA2C,+BAA3C;AAGA,OAAO,MAAM,0BAA0B,GAA4D;AACjG,EAAA,IAAI,EAAE,sBAD2F;AAEjG,EAAA,IAAI,EAAE,4BAF2F;AAGjG,EAAA,SAAS,EAAE,iCAHsF;AAIjG,EAAA,OAAO,EAAE,+BAJwF;AAKjG,EAAA,gBAAgB,EAAE;AAL+E,CAA5F;AAQP,OAAO,MAAM,kCAAkC,GAAI,KAAD,IAAiC;AACjF,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,0BAA0B,CAAC,IAA5B,EAAkC,KAAK,CAAC,IAAN,CAAW,SAA7C,CAAnC;;AAEA,MAAI,KAAK,CAAC,OAAV,EAAmB;AACjB,IAAA,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,YAAY,CAAC,0BAA0B,CAAC,OAA5B,EAAqC,KAAK,CAAC,OAAN,CAAc,SAAnD,CAAtC;AACD;;AAED,MAAI,KAAK,CAAC,gBAAV,EAA4B;AAC1B,IAAA,KAAK,CAAC,gBAAN,CAAuB,SAAvB,GAAmC,YAAY,CAC7C,0BAA0B,CAAC,gBADkB,EAE7C,KAAK,CAAC,gBAAN,CAAuB,SAFsB,CAA/C;AAID;;AAED,MAAI,KAAK,CAAC,IAAV,EAAgB;AACd,IAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,0BAA0B,CAAC,IAA5B,EAAkC,KAAK,CAAC,IAAN,CAAW,SAA7C,CAAnC;AACD;;AAED,MAAI,KAAK,CAAC,SAAV,EAAqB;AACnB,IAAA,KAAK,CAAC,SAAN,CAAgB,SAAhB,GAA4B,YAAY,CAAC,0BAA0B,CAAC,SAA5B,EAAuC,KAAK,CAAC,SAAN,CAAgB,SAAvD,CAAxC;AACD;;AAED,EAAA,0BAA0B,CAAC,KAAD,CAA1B;AACA,EAAA,2BAA2B,CAAC,KAAD,CAA3B;AACD,CAxBM","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { MenuItemSlots } from '../index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';\nimport type { MenuItemCheckboxState } from './MenuItemCheckbox.types';\n\nexport const menuItemCheckboxClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n root: 'fui-MenuItemCheckbox',\n icon: 'fui-MenuItemCheckbox__icon',\n checkmark: 'fui-MenuItemCheckbox__checkmark',\n content: 'fui-MenuItemCheckbox__content',\n secondaryContent: 'fui-MenuItemCheckbox__secondaryContent',\n};\n\nexport const useMenuItemCheckboxStyles_unstable = (state: MenuItemCheckboxState) => {\n state.root.className = mergeClasses(menuItemCheckboxClassNames.root, state.root.className);\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemCheckboxClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemCheckboxClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemCheckboxClassNames.icon, state.icon.className);\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemCheckboxClassNames.checkmark, state.checkmark.className);\n }\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,11 +1,6 @@
|
|
1
1
|
import { mergeClasses } from '@griffel/react';
|
2
2
|
import { useCheckmarkStyles_unstable } from '../../selectable/index';
|
3
3
|
import { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';
|
4
|
-
/**
|
5
|
-
* @deprecated Use `menuItemRadioClassNames.root` instead.
|
6
|
-
*/
|
7
|
-
|
8
|
-
export const menuItemRadioClassName = 'fui-MenuItemRadio';
|
9
4
|
export const menuItemRadioClassNames = {
|
10
5
|
root: 'fui-MenuItemRadio',
|
11
6
|
icon: 'fui-MenuItemRadio__icon',
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuItemRadio/useMenuItemRadioStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,QAA6B,gBAA7B;AACA,SAAS,2BAAT,QAA4C,wBAA5C;AAEA,SAAS,0BAAT,QAA2C,+BAA3C;AAGA
|
1
|
+
{"version":3,"sources":["components/MenuItemRadio/useMenuItemRadioStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,QAA6B,gBAA7B;AACA,SAAS,2BAAT,QAA4C,wBAA5C;AAEA,SAAS,0BAAT,QAA2C,+BAA3C;AAGA,OAAO,MAAM,uBAAuB,GAA4D;AAC9F,EAAA,IAAI,EAAE,mBADwF;AAE9F,EAAA,IAAI,EAAE,yBAFwF;AAG9F,EAAA,SAAS,EAAE,8BAHmF;AAI9F,EAAA,OAAO,EAAE,4BAJqF;AAK9F,EAAA,gBAAgB,EAAE;AAL4E,CAAzF;AAQP,OAAO,MAAM,+BAA+B,GAAI,KAAD,IAA8B;AAC3E,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,uBAAuB,CAAC,IAAzB,EAA+B,KAAK,CAAC,IAAN,CAAW,SAA1C,CAAnC;;AAEA,MAAI,KAAK,CAAC,OAAV,EAAmB;AACjB,IAAA,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,YAAY,CAAC,uBAAuB,CAAC,OAAzB,EAAkC,KAAK,CAAC,OAAN,CAAc,SAAhD,CAAtC;AACD;;AAED,MAAI,KAAK,CAAC,gBAAV,EAA4B;AAC1B,IAAA,KAAK,CAAC,gBAAN,CAAuB,SAAvB,GAAmC,YAAY,CAC7C,uBAAuB,CAAC,gBADqB,EAE7C,KAAK,CAAC,gBAAN,CAAuB,SAFsB,CAA/C;AAID;;AAED,MAAI,KAAK,CAAC,IAAV,EAAgB;AACd,IAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,uBAAuB,CAAC,IAAzB,EAA+B,KAAK,CAAC,IAAN,CAAW,SAA1C,CAAnC;AACD;;AAED,MAAI,KAAK,CAAC,SAAV,EAAqB;AACnB,IAAA,KAAK,CAAC,SAAN,CAAgB,SAAhB,GAA4B,YAAY,CAAC,uBAAuB,CAAC,SAAzB,EAAoC,KAAK,CAAC,SAAN,CAAgB,SAApD,CAAxC;AACD;;AAED,EAAA,0BAA0B,CAAC,KAAD,CAA1B;AACA,EAAA,2BAA2B,CAAC,KAAD,CAA3B;AACD,CAxBM","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { MenuItemSlots } from '../index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles';\nimport type { MenuItemRadioState } from './MenuItemRadio.types';\n\nexport const menuItemRadioClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n root: 'fui-MenuItemRadio',\n icon: 'fui-MenuItemRadio__icon',\n checkmark: 'fui-MenuItemRadio__checkmark',\n content: 'fui-MenuItemRadio__content',\n secondaryContent: 'fui-MenuItemRadio__secondaryContent',\n};\n\nexport const useMenuItemRadioStyles_unstable = (state: MenuItemRadioState) => {\n state.root.className = mergeClasses(menuItemRadioClassNames.root, state.root.className);\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemRadioClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemRadioClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemRadioClassNames.icon, state.icon.className);\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemRadioClassNames.checkmark, state.checkmark.className);\n }\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n};\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuList/useMenuListStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,YAAmC,UAAnC,QAAqD,gBAArD;AAGA
|
1
|
+
{"version":3,"sources":["components/MenuList/useMenuListStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,YAAmC,UAAnC,QAAqD,gBAArD;AAGA,OAAO,MAAM,kBAAkB,GAAkC;AAC/D,EAAA,IAAI,EAAE;AADyD,CAA1D;;AAIP,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAQA;;AAEG;;;AACH,OAAO,MAAM,0BAA0B,GAAI,KAAD,IAAwC;AAChF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,kBAAkB,CAAC,IAApB,EAA0B,MAAM,CAAC,IAAjC,EAAuC,KAAK,CAAC,IAAN,CAAW,SAAlD,CAAnC;AACA,SAAO,KAAP;AACD,CAJM","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport type { MenuListSlots, MenuListState } from './MenuList.types';\n\nexport const menuListClassNames: SlotClassNames<MenuListSlots> = {\n root: 'fui-MenuList',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.gap('2px'),\n },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuListStyles_unstable = (state: MenuListState): MenuListState => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuListClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"sourceRoot":"../src/"}
|
@@ -3,7 +3,7 @@ import { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';
|
|
3
3
|
import { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';
|
4
4
|
import { useMenuContext_unstable } from '../../contexts/menuContext';
|
5
5
|
import { dispatchMenuEnterEvent } from '../../utils/index';
|
6
|
-
import { useFluent } from '@fluentui/react-shared-contexts';
|
6
|
+
import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
|
7
7
|
import { useIsSubmenu } from '../../utils/useIsSubmenu';
|
8
8
|
/**
|
9
9
|
* Create the state required to render MenuPopover.
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,SAAT,EAAoB,GAApB,EAAyB,UAAzB,EAAqC,MAArC,QAAmD,yBAAnD;AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,aAAlD,QAAuE,2BAAvE;AAEA,SAAS,uBAAT,QAAwC,4BAAxC;AACA,SAAS,sBAAT,QAAuC,mBAAvC;AACA,SAAS,
|
1
|
+
{"version":3,"sources":["components/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n const isSubmenu = useIsSubmenu();\n const canDispatchCustomEventRef = React.useRef(true);\n const throttleDispatchTimerRef = React.useRef(0);\n\n const { dir } = useFluent();\n const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n // use DOM listener since react events propagate up the react tree\n // no need to do `contains` logic as menus are all positioned in different portals\n const mouseOverListenerCallbackRef = React.useCallback(\n (node: HTMLElement) => {\n if (node) {\n // Dispatches the custom menu mouse enter event with throttling\n // Needs to trigger on mouseover to support keyboard + mouse together\n // i.e. keyboard opens submenus while cursor is still on the parent\n node.addEventListener('mouseover', e => {\n if (canDispatchCustomEventRef.current) {\n canDispatchCustomEventRef.current = false;\n dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore #16889 Node setTimeout type leaking\n throttleDispatchTimerRef.current = setTimeout(() => (canDispatchCustomEventRef.current = true), 250);\n }\n });\n }\n },\n [popoverRef, throttleDispatchTimerRef],\n );\n\n React.useEffect(() => {\n () => clearTimeout(throttleDispatchTimerRef.current);\n }, []);\n\n const inline = useMenuContext_unstable(context => context.inline) ?? false;\n const rootProps = getNativeElementProps('div', {\n role: 'presentation',\n ...props,\n ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef),\n });\n\n const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n\n rootProps.onMouseEnter = useEventCallback((e: React.MouseEvent<HTMLElement>) => {\n if (openOnHover) {\n setOpen(e, { open: true, keyboard: false });\n }\n\n onMouseEnterOriginal?.(e);\n });\n\n rootProps.onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLElement>) => {\n const key = e.key;\n\n if (key === Escape || (isSubmenu && key === CloseArrowKey)) {\n if (popoverRef.current?.contains(e.target as HTMLElement)) {\n setOpen(e, { open: false, keyboard: true });\n }\n }\n\n if (key === Tab) {\n setOpen(e, { open: false, keyboard: true });\n e.preventDefault();\n }\n\n onKeyDownOriginal?.(e);\n });\n\n return {\n inline,\n components: {\n root: 'div',\n },\n root: rootProps,\n };\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,10 +1,5 @@
|
|
1
1
|
import { shorthands, mergeClasses, __styles } from '@griffel/react';
|
2
2
|
import { tokens } from '@fluentui/react-theme';
|
3
|
-
/**
|
4
|
-
* @deprecated Use `menuPopoverClassNames.root` instead.
|
5
|
-
*/
|
6
|
-
|
7
|
-
export const menuPopoverClassName = 'fui-MenuPopover';
|
8
3
|
export const menuPopoverClassNames = {
|
9
4
|
root: 'fui-MenuPopover'
|
10
5
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,EAAqB,YAArB,kBAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAIA
|
1
|
+
{"version":3,"sources":["components/MenuPopover/useMenuPopoverStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,EAAqB,YAArB,kBAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAIA,OAAO,MAAM,qBAAqB,GAAqC;AACrE,EAAA,IAAI,EAAE;AAD+D,CAAhE;;AAIP,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAaA;;AAEG;;;AACH,OAAO,MAAM,6BAA6B,GAAI,KAAD,IAA8C;AACzF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,qBAAqB,CAAC,IAAvB,EAA6B,MAAM,CAAC,IAApC,EAA0C,KAAK,CAAC,IAAN,CAAW,SAArD,CAAnC;AACA,SAAO,KAAP;AACD,CAJM","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuPopoverClassNames: SlotClassNames<MenuPopoverSlots> = {\n root: 'fui-MenuPopover',\n};\n\nconst useStyles = makeStyles({\n root: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n backgroundColor: tokens.colorNeutralBackground1,\n minWidth: '128px',\n maxWidth: '300px',\n width: 'max-content',\n boxShadow: `${tokens.shadow16}`,\n ...shorthands.padding('4px'),\n ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuPopoverStyles_unstable = (state: MenuPopoverState): MenuPopoverState => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuPopoverClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import { getNativeElementProps, getRTLSafeKey, useMergedRefs } from '@fluentui/react-utilities';
|
3
3
|
import { useFocusFinders } from '@fluentui/react-tabster';
|
4
|
-
import { useFluent } from '@fluentui/react-shared-contexts';
|
4
|
+
import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
|
5
5
|
import { ArrowRight, ArrowLeft } from '@fluentui/keyboard-keys';
|
6
6
|
/**
|
7
7
|
* Create the state required to render MenuSplitGroup.
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuSplitGroup/useMenuSplitGroup.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,EAAgC,aAAhC,EAA+C,aAA/C,QAAoE,2BAApE;AACA,SAAS,eAAT,QAAgC,yBAAhC;AACA,SAAS,
|
1
|
+
{"version":3,"sources":["components/MenuSplitGroup/useMenuSplitGroup.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,EAAgC,aAAhC,EAA+C,aAA/C,QAAoE,2BAApE;AACA,SAAS,eAAT,QAAgC,yBAAhC;AACA,SAAS,kBAAkB,IAAI,SAA/B,QAAgD,iCAAhD;AAEA,SAAS,UAAT,EAAqB,SAArB,QAAsC,yBAAtC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,0BAA0B,GAAG,CACxC,KADwC,EAExC,GAFwC,KAGjB;AACvB,QAAM,QAAQ,GAAG,KAAK,CAAC,MAAN,EAAjB;AACA,QAAM;AAAE,IAAA,GAAF;AAAO,IAAA;AAAP,MAA0B,SAAS,EAAzC;AAEA,QAAM,YAAY,GAAG,aAAa,CAAC,UAAD,EAAa,GAAb,CAAlC;AACA,QAAM,YAAY,GAAG,aAAa,CAAC,SAAD,EAAY,GAAZ,CAAlC;AAEA,QAAM;AAAE,IAAA,iBAAF;AAAqB,IAAA;AAArB,MAA2C,eAAe,EAAhE;AAEA,QAAM,SAAS,GAAG,KAAK,CAAC,WAAN,CACf,CAAD,IAAwC;;;AACtC,UAAM,aAAa,GAAG,cAAc,KAAA,IAAd,IAAA,cAAc,KAAA,KAAA,CAAd,GAAc,KAAA,CAAd,GAAA,cAAc,CAAE,aAAtC;;AACA,QAAI,CAAC,aAAL,EAAoB;AAClB;AACD;;AAED,QAAI,EAAC,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAT,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAE,QAAF,CAAW,aAAX,CAAjB,CAAJ,EAAgD;AAC9C;AACD;;AAED,QAAI,CAAC,CAAC,GAAF,KAAU,YAAd,EAA4B;AAC1B,YAAM,IAAI,GAAG,iBAAiB,CAAC,aAAD,EAA+B;AAAE,QAAA,SAAS,EAAE,QAAQ,CAAC;AAAtB,OAA/B,CAA9B;AACA,MAAA,IAAI,KAAA,IAAJ,IAAA,IAAI,KAAA,KAAA,CAAJ,GAAI,KAAA,CAAJ,GAAA,IAAI,CAAE,KAAN,EAAA;AACD;;AAED,QAAI,CAAC,CAAC,GAAF,KAAU,YAAd,EAA4B;AAC1B,YAAM,IAAI,GAAG,iBAAiB,CAAC,aAAD,EAA+B;AAAE,QAAA,SAAS,EAAE,QAAQ,CAAC;AAAtB,OAA/B,CAA9B;AACA,MAAA,IAAI,KAAA,IAAJ,IAAA,IAAI,KAAA,KAAA,CAAJ,GAAI,KAAA,CAAJ,GAAA,IAAI,CAAE,KAAN,EAAA;AACD;AACF,GApBe,EAqBhB,CAAC,iBAAD,EAAoB,iBAApB,EAAuC,cAAvC,EAAuD,YAAvD,EAAqE,YAArE,CArBgB,CAAlB;AAwBA,SAAO;AACL,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KADP;AAIL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;AACjC,MAAA,IAAI,EAAE,OAD2B;AAEjC,MAAA,GAAG,EAAE,aAAa,CAAC,GAAD,EAAM,QAAN,CAFe;AAGjC,MAAA,SAHiC;AAIjC,SAAG;AAJ8B,KAAR;AAJtB,GAAP;AAWD,CA/CM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, getRTLSafeKey, useMergedRefs } from '@fluentui/react-utilities';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { MenuSplitGroupProps, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport { ArrowRight, ArrowLeft } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render MenuSplitGroup.\n *\n * The returned state can be modified with hooks such as useMenuSplitGroupStyles_unstable,\n * before being passed to renderMenuSplitGroup_unstable.\n *\n * @param props - props from this instance of MenuSplitGroup\n * @param ref - reference to root HTMLElement of MenuSplitGroup\n */\nexport const useMenuSplitGroup_unstable = (\n props: MenuSplitGroupProps,\n ref: React.Ref<HTMLElement>,\n): MenuSplitGroupState => {\n const innerRef = React.useRef<HTMLElement>();\n const { dir, targetDocument } = useFluent();\n\n const nextArrowKey = getRTLSafeKey(ArrowRight, dir);\n const prevArrowKey = getRTLSafeKey(ArrowLeft, dir);\n\n const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n\n const onKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const activeElement = targetDocument?.activeElement;\n if (!activeElement) {\n return;\n }\n\n if (!innerRef.current?.contains(activeElement)) {\n return;\n }\n\n if (e.key === nextArrowKey) {\n const next = findNextFocusable(activeElement as HTMLElement, { container: innerRef.current });\n next?.focus();\n }\n\n if (e.key === prevArrowKey) {\n const prev = findPrevFocusable(activeElement as HTMLElement, { container: innerRef.current });\n prev?.focus();\n }\n },\n [findNextFocusable, findPrevFocusable, targetDocument, nextArrowKey, prevArrowKey],\n );\n\n return {\n components: {\n root: 'div',\n },\n root: getNativeElementProps('div', {\n role: 'group',\n ref: useMergedRefs(ref, innerRef),\n onKeyDown,\n ...props,\n }),\n };\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,11 +1,6 @@
|
|
1
1
|
import { __styles, mergeClasses } from '@griffel/react';
|
2
2
|
import { tokens } from '@fluentui/react-theme';
|
3
3
|
import { menuItemClassNames } from '../MenuItem/useMenuItemStyles';
|
4
|
-
/**
|
5
|
-
* @deprecated Use `menuSplitGroupClassNames.root` instead.
|
6
|
-
*/
|
7
|
-
|
8
|
-
export const menuSplitGroupClassName = 'fui-MenuSplitGroup';
|
9
4
|
export const menuSplitGroupClassNames = {
|
10
5
|
root: 'fui-MenuSplitGroup'
|
11
6
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuSplitGroup/useMenuSplitGroupStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AACA,SAAS,kBAAT,QAAmC,+BAAnC;AAIA
|
1
|
+
{"version":3,"sources":["components/MenuSplitGroup/useMenuSplitGroupStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AACA,SAAS,kBAAT,QAAmC,+BAAnC;AAIA,OAAO,MAAM,wBAAwB,GAAwC;AAC3E,EAAA,IAAI,EAAE;AADqE,CAAtE;AAGP;;AAEG;;AACH,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqBA;;AAEG;;;AACH,OAAO,MAAM,gCAAgC,GAAI,KAAD,IAAoD;AAClG,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,wBAAwB,CAAC,IAA1B,EAAgC,MAAM,CAAC,IAAvC,EAA6C,KAAK,CAAC,IAAN,CAAW,SAAxD,CAAnC;AACA,SAAO,KAAP;AACD,CAJM","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { menuItemClassNames } from '../MenuItem/useMenuItemStyles';\nimport type { MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const menuSplitGroupClassNames: SlotClassNames<MenuSplitGroupSlots> = {\n root: 'fui-MenuSplitGroup',\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n [`& > .${menuItemClassNames.root}:nth-child(1)`]: {\n width: '100%',\n },\n [`& > .${menuItemClassNames.root}:nth-child(2)`]: {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n paddingLeft: 0,\n marginLeft: 'auto',\n ':before': {\n content: '\"\"',\n width: tokens.strokeWidthThin,\n height: '24px',\n backgroundColor: tokens.colorNeutralStroke1,\n },\n },\n },\n});\n\n/**\n * Apply styling to the MenuSplitGroup slots based on the state\n */\nexport const useMenuSplitGroupStyles_unstable = (state: MenuSplitGroupState): MenuSplitGroupState => {\n const styles = useStyles();\n state.root.className = mergeClasses(menuSplitGroupClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"sourceRoot":"../src/"}
|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
2
2
|
import { useMenuContext_unstable } from '../../contexts/menuContext';
|
3
3
|
import { useIsSubmenu } from '../../utils/useIsSubmenu';
|
4
4
|
import { useFocusFinders } from '@fluentui/react-tabster';
|
5
|
-
import { useFluent } from '@fluentui/react-shared-contexts';
|
5
|
+
import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
|
6
6
|
import { ArrowRight, ArrowLeft, Escape, ArrowDown } from '@fluentui/keyboard-keys';
|
7
7
|
import { applyTriggerPropsToChildren, getTriggerChild, useMergedEventCallbacks, useMergedRefs } from '@fluentui/react-utilities';
|
8
8
|
import { shouldPreventDefaultOnKeyDown } from '@fluentui/react-utilities';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { MenuTriggerChildProps, MenuTriggerProps, MenuTriggerState } from './MenuTrigger.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent } from '@fluentui/react-shared-contexts';\nimport { ArrowRight, ArrowLeft, Escape, ArrowDown } from '@fluentui/keyboard-keys';\nimport {\n applyTriggerPropsToChildren,\n getTriggerChild,\n useMergedEventCallbacks,\n useMergedRefs,\n} from '@fluentui/react-utilities';\nimport { shouldPreventDefaultOnKeyDown } from '@fluentui/react-utilities';\n\n/**\n * Create the state required to render MenuTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup menu\n *\n * @param props - props from this instance of MenuTrigger\n */\nexport const useMenuTrigger_unstable = (props: MenuTriggerProps): MenuTriggerState => {\n const { children } = props;\n\n const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n const menuPopoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n const open = useMenuContext_unstable(context => context.open);\n const triggerId = useMenuContext_unstable(context => context.triggerId);\n const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n const openOnContext = useMenuContext_unstable(context => context.openOnContext);\n\n const isSubmenu = useIsSubmenu();\n\n const { findFirstFocusable } = useFocusFinders();\n const focusFirst = React.useCallback(() => {\n const firstFocusable = findFirstFocusable(menuPopoverRef.current);\n firstFocusable?.focus();\n }, [findFirstFocusable, menuPopoverRef]);\n\n const openedWithKeyboardRef = React.useRef(false);\n const hasMouseMoved = React.useRef(false);\n\n const { dir } = useFluent();\n const OpenArrowKey = dir === 'ltr' ? ArrowRight : ArrowLeft;\n\n const child = React.isValidElement(children) ? getTriggerChild(children) : undefined;\n\n const onContextMenu = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n\n if (openOnContext) {\n e.preventDefault();\n setOpen(e, { open: true, keyboard: false });\n }\n };\n\n const onClick = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n\n if (!openOnContext) {\n setOpen(e, { open: !open, keyboard: openedWithKeyboardRef.current });\n openedWithKeyboardRef.current = false;\n }\n };\n\n const onKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n\n if (shouldPreventDefaultOnKeyDown(e)) {\n e.preventDefault();\n openedWithKeyboardRef.current = true;\n (e.target as HTMLElement)?.click();\n }\n\n const key = e.key;\n\n if (!openOnContext && ((isSubmenu && key === OpenArrowKey) || (!isSubmenu && key === ArrowDown))) {\n setOpen(e, { open: true, keyboard: true });\n }\n\n if (key === Escape && !isSubmenu) {\n setOpen(e, { open: false, keyboard: true });\n }\n\n // if menu is already open, can't rely on effects to focus\n if (open && key === OpenArrowKey && isSubmenu) {\n focusFirst();\n }\n };\n\n const onMouseEnter = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n if (openOnHover && hasMouseMoved.current) {\n setOpen(e, { open: true, keyboard: false });\n }\n };\n\n // Opening a menu when a mouse hasn't moved and just entering the trigger is a bad a11y experience\n // First time open the mouse using mousemove and then continue with mouseenter\n // Only use once to determine that the user is using the mouse since it is an expensive event to handle\n const onMouseMove = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n if (openOnHover && !hasMouseMoved.current) {\n setOpen(e, { open: true, keyboard: false });\n hasMouseMoved.current = true;\n }\n };\n\n const onMouseLeave = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n if (openOnHover) {\n setOpen(e, { open: false, keyboard: false });\n }\n };\n\n return {\n isSubmenu,\n children: applyTriggerPropsToChildren<MenuTriggerChildProps>(children, {\n 'aria-haspopup': 'menu',\n 'aria-expanded': !open && !isSubmenu ? undefined : open,\n id: triggerId,\n ...child?.props,\n ref: useMergedRefs(triggerRef, child?.ref),\n onClick: useMergedEventCallbacks(child?.props?.onClick, onClick),\n onMouseEnter: useMergedEventCallbacks(child?.props?.onMouseEnter, onMouseEnter),\n onMouseLeave: useMergedEventCallbacks(child?.props?.onMouseLeave, onMouseLeave),\n onKeyDown: useMergedEventCallbacks(child?.props?.onKeyDown, onKeyDown),\n onContextMenu: useMergedEventCallbacks(child?.props?.onContextMenu, onContextMenu),\n onMouseMove: useMergedEventCallbacks(child?.props?.onMouseMove, onMouseMove),\n }),\n };\n};\n\nconst isTargetDisabled = (e: React.SyntheticEvent | Event) => {\n const isDisabled = (el: HTMLElement) =>\n el.hasAttribute('disabled') || (el.hasAttribute('aria-disabled') && el.getAttribute('aria-disabled') === 'true');\n if (e.target instanceof HTMLElement && isDisabled(e.target)) {\n return true;\n }\n\n return e.currentTarget instanceof HTMLElement && isDisabled(e.currentTarget);\n};\n"],"sourceRoot":"../src/"}
|
1
|
+
{"version":3,"sources":["components/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,SAAS,uBAAT,QAAwC,4BAAxC;AACA,SAAS,YAAT,QAA6B,0BAA7B;AACA,SAAS,eAAT,QAAgC,yBAAhC;AACA,SAAS,kBAAkB,IAAI,SAA/B,QAAgD,iCAAhD;AACA,SAAS,UAAT,EAAqB,SAArB,EAAgC,MAAhC,EAAwC,SAAxC,QAAyD,yBAAzD;AACA,SACE,2BADF,EAEE,eAFF,EAGE,uBAHF,EAIE,aAJF,QAKO,2BALP;AAMA,SAAS,6BAAT,QAA8C,2BAA9C;AAEA;;;;;AAKG;;AACH,OAAO,MAAM,uBAAuB,GAAI,KAAD,IAA8C;;;AACnF,QAAM;AAAE,IAAA;AAAF,MAAe,KAArB;AAEA,QAAM,UAAU,GAAG,uBAAuB,CAAC,OAAO,IAAI,OAAO,CAAC,UAApB,CAA1C;AACA,QAAM,cAAc,GAAG,uBAAuB,CAAC,OAAO,IAAI,OAAO,CAAC,cAApB,CAA9C;AACA,QAAM,OAAO,GAAG,uBAAuB,CAAC,OAAO,IAAI,OAAO,CAAC,OAApB,CAAvC;AACA,QAAM,IAAI,GAAG,uBAAuB,CAAC,OAAO,IAAI,OAAO,CAAC,IAApB,CAApC;AACA,QAAM,SAAS,GAAG,uBAAuB,CAAC,OAAO,IAAI,OAAO,CAAC,SAApB,CAAzC;AACA,QAAM,WAAW,GAAG,uBAAuB,CAAC,OAAO,IAAI,OAAO,CAAC,WAApB,CAA3C;AACA,QAAM,aAAa,GAAG,uBAAuB,CAAC,OAAO,IAAI,OAAO,CAAC,aAApB,CAA7C;AAEA,QAAM,SAAS,GAAG,YAAY,EAA9B;AAEA,QAAM;AAAE,IAAA;AAAF,MAAyB,eAAe,EAA9C;AACA,QAAM,UAAU,GAAG,KAAK,CAAC,WAAN,CAAkB,MAAK;AACxC,UAAM,cAAc,GAAG,kBAAkB,CAAC,cAAc,CAAC,OAAhB,CAAzC;AACA,IAAA,cAAc,KAAA,IAAd,IAAA,cAAc,KAAA,KAAA,CAAd,GAAc,KAAA,CAAd,GAAA,cAAc,CAAE,KAAhB,EAAA;AACD,GAHkB,EAGhB,CAAC,kBAAD,EAAqB,cAArB,CAHgB,CAAnB;AAKA,QAAM,qBAAqB,GAAG,KAAK,CAAC,MAAN,CAAa,KAAb,CAA9B;AACA,QAAM,aAAa,GAAG,KAAK,CAAC,MAAN,CAAa,KAAb,CAAtB;AAEA,QAAM;AAAE,IAAA;AAAF,MAAU,SAAS,EAAzB;AACA,QAAM,YAAY,GAAG,GAAG,KAAK,KAAR,GAAgB,UAAhB,GAA6B,SAAlD;AAEA,QAAM,KAAK,GAAG,aAAA,KAAK,CAAC,cAAN,CAAqB,QAArB,IAAiC,eAAe,CAAC,QAAD,CAAhD,GAA6D,SAA3E;;AAEA,QAAM,aAAa,GAAI,CAAD,IAAqC;AACzD,QAAI,gBAAgB,CAAC,CAAD,CAApB,EAAyB;AACvB;AACD;;AAED,QAAI,aAAJ,EAAmB;AACjB,MAAA,CAAC,CAAC,cAAF;AACA,MAAA,OAAO,CAAC,CAAD,EAAI;AAAE,QAAA,IAAI,EAAE,IAAR;AAAc,QAAA,QAAQ,EAAE;AAAxB,OAAJ,CAAP;AACD;AACF,GATD;;AAWA,QAAM,OAAO,GAAI,CAAD,IAAqC;AACnD,QAAI,gBAAgB,CAAC,CAAD,CAApB,EAAyB;AACvB;AACD;;AAED,QAAI,CAAC,aAAL,EAAoB;AAClB,MAAA,OAAO,CAAC,CAAD,EAAI;AAAE,QAAA,IAAI,EAAE,CAAC,IAAT;AAAe,QAAA,QAAQ,EAAE,qBAAqB,CAAC;AAA/C,OAAJ,CAAP;AACA,MAAA,qBAAqB,CAAC,OAAtB,GAAgC,KAAhC;AACD;AACF,GATD;;AAWA,QAAM,SAAS,GAAI,CAAD,IAAwC;;;AACxD,QAAI,gBAAgB,CAAC,CAAD,CAApB,EAAyB;AACvB;AACD;;AAED,QAAI,6BAA6B,CAAC,CAAD,CAAjC,EAAsC;AACpC,MAAA,CAAC,CAAC,cAAF;AACA,MAAA,qBAAqB,CAAC,OAAtB,GAAgC,IAAhC;AACA,OAAA,EAAA,GAAC,CAAC,CAAC,MAAH,MAAyB,IAAzB,IAAyB,EAAA,KAAA,KAAA,CAAzB,GAAyB,KAAA,CAAzB,GAAyB,EAAA,CAAE,KAAF,EAAzB;AACD;;AAED,UAAM,GAAG,GAAG,CAAC,CAAC,GAAd;;AAEA,QAAI,CAAC,aAAD,KAAoB,SAAS,IAAI,GAAG,KAAK,YAAtB,IAAwC,CAAC,SAAD,IAAc,GAAG,KAAK,SAAjF,CAAJ,EAAkG;AAChG,MAAA,OAAO,CAAC,CAAD,EAAI;AAAE,QAAA,IAAI,EAAE,IAAR;AAAc,QAAA,QAAQ,EAAE;AAAxB,OAAJ,CAAP;AACD;;AAED,QAAI,GAAG,KAAK,MAAR,IAAkB,CAAC,SAAvB,EAAkC;AAChC,MAAA,OAAO,CAAC,CAAD,EAAI;AAAE,QAAA,IAAI,EAAE,KAAR;AAAe,QAAA,QAAQ,EAAE;AAAzB,OAAJ,CAAP;AACD,KAnBuD,CAqBxD;;;AACA,QAAI,IAAI,IAAI,GAAG,KAAK,YAAhB,IAAgC,SAApC,EAA+C;AAC7C,MAAA,UAAU;AACX;AACF,GAzBD;;AA2BA,QAAM,YAAY,GAAI,CAAD,IAAqC;AACxD,QAAI,gBAAgB,CAAC,CAAD,CAApB,EAAyB;AACvB;AACD;;AACD,QAAI,WAAW,IAAI,aAAa,CAAC,OAAjC,EAA0C;AACxC,MAAA,OAAO,CAAC,CAAD,EAAI;AAAE,QAAA,IAAI,EAAE,IAAR;AAAc,QAAA,QAAQ,EAAE;AAAxB,OAAJ,CAAP;AACD;AACF,GAPD,CA5EmF,CAqFnF;AACA;AACA;;;AACA,QAAM,WAAW,GAAI,CAAD,IAAqC;AACvD,QAAI,gBAAgB,CAAC,CAAD,CAApB,EAAyB;AACvB;AACD;;AACD,QAAI,WAAW,IAAI,CAAC,aAAa,CAAC,OAAlC,EAA2C;AACzC,MAAA,OAAO,CAAC,CAAD,EAAI;AAAE,QAAA,IAAI,EAAE,IAAR;AAAc,QAAA,QAAQ,EAAE;AAAxB,OAAJ,CAAP;AACA,MAAA,aAAa,CAAC,OAAd,GAAwB,IAAxB;AACD;AACF,GARD;;AAUA,QAAM,YAAY,GAAI,CAAD,IAAqC;AACxD,QAAI,gBAAgB,CAAC,CAAD,CAApB,EAAyB;AACvB;AACD;;AACD,QAAI,WAAJ,EAAiB;AACf,MAAA,OAAO,CAAC,CAAD,EAAI;AAAE,QAAA,IAAI,EAAE,KAAR;AAAe,QAAA,QAAQ,EAAE;AAAzB,OAAJ,CAAP;AACD;AACF,GAPD;;AASA,SAAO;AACL,IAAA,SADK;AAEL,IAAA,QAAQ,EAAE,2BAA2B,CAAwB,QAAxB,EAAkC;AACrE,uBAAiB,MADoD;AAErE,uBAAiB,CAAC,IAAD,IAAS,CAAC,SAAV,GAAsB,SAAtB,GAAkC,IAFkB;AAGrE,MAAA,EAAE,EAAE,SAHiE;AAIrE,UAAG,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAV,CAJqE;AAKrE,MAAA,GAAG,EAAE,aAAa,CAAC,UAAD,EAAa,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,GAApB,CALmD;AAMrE,MAAA,OAAO,EAAE,uBAAuB,CAAC,CAAA,EAAA,GAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAP,MAAY,IAAZ,IAAY,EAAA,KAAA,KAAA,CAAZ,GAAY,KAAA,CAAZ,GAAY,EAAA,CAAE,OAAf,EAAwB,OAAxB,CANqC;AAOrE,MAAA,YAAY,EAAE,uBAAuB,CAAC,CAAA,EAAA,GAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAP,MAAY,IAAZ,IAAY,EAAA,KAAA,KAAA,CAAZ,GAAY,KAAA,CAAZ,GAAY,EAAA,CAAE,YAAf,EAA6B,YAA7B,CAPgC;AAQrE,MAAA,YAAY,EAAE,uBAAuB,CAAC,CAAA,EAAA,GAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAP,MAAY,IAAZ,IAAY,EAAA,KAAA,KAAA,CAAZ,GAAY,KAAA,CAAZ,GAAY,EAAA,CAAE,YAAf,EAA6B,YAA7B,CARgC;AASrE,MAAA,SAAS,EAAE,uBAAuB,CAAC,CAAA,EAAA,GAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAP,MAAY,IAAZ,IAAY,EAAA,KAAA,KAAA,CAAZ,GAAY,KAAA,CAAZ,GAAY,EAAA,CAAE,SAAf,EAA0B,SAA1B,CATmC;AAUrE,MAAA,aAAa,EAAE,uBAAuB,CAAC,CAAA,EAAA,GAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAP,MAAY,IAAZ,IAAY,EAAA,KAAA,KAAA,CAAZ,GAAY,KAAA,CAAZ,GAAY,EAAA,CAAE,aAAf,EAA8B,aAA9B,CAV+B;AAWrE,MAAA,WAAW,EAAE,uBAAuB,CAAC,CAAA,EAAA,GAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAP,MAAY,IAAZ,IAAY,EAAA,KAAA,KAAA,CAAZ,GAAY,KAAA,CAAZ,GAAY,EAAA,CAAE,WAAf,EAA4B,WAA5B;AAXiC,KAAlC;AAFhC,GAAP;AAgBD,CA3HM;;AA6HP,MAAM,gBAAgB,GAAI,CAAD,IAAoC;AAC3D,QAAM,UAAU,GAAI,EAAD,IACjB,EAAE,CAAC,YAAH,CAAgB,UAAhB,KAAgC,EAAE,CAAC,YAAH,CAAgB,eAAhB,KAAoC,EAAE,CAAC,YAAH,CAAgB,eAAhB,MAAqC,MAD3G;;AAEA,MAAI,CAAC,CAAC,MAAF,YAAoB,WAApB,IAAmC,UAAU,CAAC,CAAC,CAAC,MAAH,CAAjD,EAA6D;AAC3D,WAAO,IAAP;AACD;;AAED,SAAO,CAAC,CAAC,aAAF,YAA2B,WAA3B,IAA0C,UAAU,CAAC,CAAC,CAAC,aAAH,CAA3D;AACD,CARD","sourcesContent":["import * as React from 'react';\nimport { MenuTriggerChildProps, MenuTriggerProps, MenuTriggerState } from './MenuTrigger.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { ArrowRight, ArrowLeft, Escape, ArrowDown } from '@fluentui/keyboard-keys';\nimport {\n applyTriggerPropsToChildren,\n getTriggerChild,\n useMergedEventCallbacks,\n useMergedRefs,\n} from '@fluentui/react-utilities';\nimport { shouldPreventDefaultOnKeyDown } from '@fluentui/react-utilities';\n\n/**\n * Create the state required to render MenuTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup menu\n *\n * @param props - props from this instance of MenuTrigger\n */\nexport const useMenuTrigger_unstable = (props: MenuTriggerProps): MenuTriggerState => {\n const { children } = props;\n\n const triggerRef = useMenuContext_unstable(context => context.triggerRef);\n const menuPopoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n const setOpen = useMenuContext_unstable(context => context.setOpen);\n const open = useMenuContext_unstable(context => context.open);\n const triggerId = useMenuContext_unstable(context => context.triggerId);\n const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n const openOnContext = useMenuContext_unstable(context => context.openOnContext);\n\n const isSubmenu = useIsSubmenu();\n\n const { findFirstFocusable } = useFocusFinders();\n const focusFirst = React.useCallback(() => {\n const firstFocusable = findFirstFocusable(menuPopoverRef.current);\n firstFocusable?.focus();\n }, [findFirstFocusable, menuPopoverRef]);\n\n const openedWithKeyboardRef = React.useRef(false);\n const hasMouseMoved = React.useRef(false);\n\n const { dir } = useFluent();\n const OpenArrowKey = dir === 'ltr' ? ArrowRight : ArrowLeft;\n\n const child = React.isValidElement(children) ? getTriggerChild(children) : undefined;\n\n const onContextMenu = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n\n if (openOnContext) {\n e.preventDefault();\n setOpen(e, { open: true, keyboard: false });\n }\n };\n\n const onClick = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n\n if (!openOnContext) {\n setOpen(e, { open: !open, keyboard: openedWithKeyboardRef.current });\n openedWithKeyboardRef.current = false;\n }\n };\n\n const onKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n\n if (shouldPreventDefaultOnKeyDown(e)) {\n e.preventDefault();\n openedWithKeyboardRef.current = true;\n (e.target as HTMLElement)?.click();\n }\n\n const key = e.key;\n\n if (!openOnContext && ((isSubmenu && key === OpenArrowKey) || (!isSubmenu && key === ArrowDown))) {\n setOpen(e, { open: true, keyboard: true });\n }\n\n if (key === Escape && !isSubmenu) {\n setOpen(e, { open: false, keyboard: true });\n }\n\n // if menu is already open, can't rely on effects to focus\n if (open && key === OpenArrowKey && isSubmenu) {\n focusFirst();\n }\n };\n\n const onMouseEnter = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n if (openOnHover && hasMouseMoved.current) {\n setOpen(e, { open: true, keyboard: false });\n }\n };\n\n // Opening a menu when a mouse hasn't moved and just entering the trigger is a bad a11y experience\n // First time open the mouse using mousemove and then continue with mouseenter\n // Only use once to determine that the user is using the mouse since it is an expensive event to handle\n const onMouseMove = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n if (openOnHover && !hasMouseMoved.current) {\n setOpen(e, { open: true, keyboard: false });\n hasMouseMoved.current = true;\n }\n };\n\n const onMouseLeave = (e: React.MouseEvent<HTMLElement>) => {\n if (isTargetDisabled(e)) {\n return;\n }\n if (openOnHover) {\n setOpen(e, { open: false, keyboard: false });\n }\n };\n\n return {\n isSubmenu,\n children: applyTriggerPropsToChildren<MenuTriggerChildProps>(children, {\n 'aria-haspopup': 'menu',\n 'aria-expanded': !open && !isSubmenu ? undefined : open,\n id: triggerId,\n ...child?.props,\n ref: useMergedRefs(triggerRef, child?.ref),\n onClick: useMergedEventCallbacks(child?.props?.onClick, onClick),\n onMouseEnter: useMergedEventCallbacks(child?.props?.onMouseEnter, onMouseEnter),\n onMouseLeave: useMergedEventCallbacks(child?.props?.onMouseLeave, onMouseLeave),\n onKeyDown: useMergedEventCallbacks(child?.props?.onKeyDown, onKeyDown),\n onContextMenu: useMergedEventCallbacks(child?.props?.onContextMenu, onContextMenu),\n onMouseMove: useMergedEventCallbacks(child?.props?.onMouseMove, onMouseMove),\n }),\n };\n};\n\nconst isTargetDisabled = (e: React.SyntheticEvent | Event) => {\n const isDisabled = (el: HTMLElement) =>\n el.hasAttribute('disabled') || (el.hasAttribute('aria-disabled') && el.getAttribute('aria-disabled') === 'true');\n if (e.target instanceof HTMLElement && isDisabled(e.target)) {\n return true;\n }\n\n return e.currentTarget instanceof HTMLElement && isDisabled(e.currentTarget);\n};\n"],"sourceRoot":"../src/"}
|
package/lib/index.js
CHANGED
@@ -1,26 +1,17 @@
|
|
1
|
-
export {
|
1
|
+
export { MenuProvider, useMenuContext_unstable } from './contexts/menuContext';
|
2
2
|
export { MenuTriggerContextProvider, useMenuTriggerContext_unstable } from './contexts/menuTriggerContext';
|
3
3
|
export { MenuGroupContextProvider, useMenuGroupContext_unstable } from './contexts/menuGroupContext';
|
4
|
-
export {
|
4
|
+
export { MenuListProvider, useMenuListContext_unstable } from './contexts/menuListContext';
|
5
5
|
export { Menu, renderMenu_unstable, useMenuContextValues_unstable, useMenu_unstable } from './Menu';
|
6
|
-
export { MenuDivider,
|
7
|
-
|
8
|
-
export {
|
9
|
-
|
10
|
-
export {
|
11
|
-
|
12
|
-
export {
|
13
|
-
|
14
|
-
export {
|
15
|
-
menuItemCheckboxClassName, menuItemCheckboxClassNames, renderMenuItemCheckbox_unstable, useMenuItemCheckboxStyles_unstable, useMenuItemCheckbox_unstable } from './MenuItemCheckbox';
|
16
|
-
export { MenuItemRadio, // eslint-disable-next-line deprecation/deprecation
|
17
|
-
menuItemRadioClassName, menuItemRadioClassNames, renderMenuItemRadio_unstable, useMenuItemRadioStyles_unstable, useMenuItemRadio_unstable } from './MenuItemRadio';
|
18
|
-
export { MenuList, // eslint-disable-next-line deprecation/deprecation
|
19
|
-
menuListClassName, menuListClassNames, renderMenuList_unstable, useMenuListContextValues_unstable, useMenuListStyles_unstable, useMenuList_unstable } from './MenuList';
|
20
|
-
export { MenuPopover, // eslint-disable-next-line deprecation/deprecation
|
21
|
-
menuPopoverClassName, menuPopoverClassNames, renderMenuPopover_unstable, useMenuPopoverStyles_unstable, useMenuPopover_unstable } from './MenuPopover';
|
22
|
-
export { MenuSplitGroup, // eslint-disable-next-line deprecation/deprecation
|
23
|
-
menuSplitGroupClassName, menuSplitGroupClassNames, renderMenuSplitGroup_unstable, useMenuSplitGroupStyles_unstable, useMenuSplitGroup_unstable } from './MenuSplitGroup';
|
6
|
+
export { MenuDivider, menuDividerClassNames, renderMenuDivider_unstable, useMenuDividerStyles_unstable, useMenuDivider_unstable } from './MenuDivider';
|
7
|
+
export { MenuGroup, menuGroupClassNames, renderMenuGroup_unstable, useMenuGroupContextValues_unstable, useMenuGroupStyles_unstable, useMenuGroup_unstable } from './MenuGroup';
|
8
|
+
export { MenuGroupHeader, menuGroupHeaderClassNames, renderMenuGroupHeader_unstable, useMenuGroupHeaderStyles_unstable, useMenuGroupHeader_unstable } from './MenuGroupHeader';
|
9
|
+
export { MenuItem, menuItemClassNames, renderMenuItem_unstable, useMenuItemStyles_unstable, useMenuItem_unstable } from './MenuItem';
|
10
|
+
export { MenuItemCheckbox, menuItemCheckboxClassNames, renderMenuItemCheckbox_unstable, useMenuItemCheckboxStyles_unstable, useMenuItemCheckbox_unstable } from './MenuItemCheckbox';
|
11
|
+
export { MenuItemRadio, menuItemRadioClassNames, renderMenuItemRadio_unstable, useMenuItemRadioStyles_unstable, useMenuItemRadio_unstable } from './MenuItemRadio';
|
12
|
+
export { MenuList, menuListClassNames, renderMenuList_unstable, useMenuListContextValues_unstable, useMenuListStyles_unstable, useMenuList_unstable } from './MenuList';
|
13
|
+
export { MenuPopover, menuPopoverClassNames, renderMenuPopover_unstable, useMenuPopoverStyles_unstable, useMenuPopover_unstable } from './MenuPopover';
|
14
|
+
export { MenuSplitGroup, menuSplitGroupClassNames, renderMenuSplitGroup_unstable, useMenuSplitGroupStyles_unstable, useMenuSplitGroup_unstable } from './MenuSplitGroup';
|
24
15
|
export { MenuTrigger, renderMenuTrigger_unstable, useMenuTrigger_unstable } from './MenuTrigger';
|
25
16
|
export { useCheckmarkStyles_unstable } from './selectable/index';
|
26
17
|
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,SAAS,
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,EAAuB,uBAAvB,QAAsD,wBAAtD;AAEA,SAAS,0BAAT,EAAqC,8BAArC,QAA2E,+BAA3E;AACA,SAAS,wBAAT,EAAmC,4BAAnC,QAAuE,6BAAvE;AAEA,SAAS,gBAAT,EAA2B,2BAA3B,QAA8D,4BAA9D;AAGA,SAAS,IAAT,EAAe,mBAAf,EAAoC,6BAApC,EAAmE,gBAAnE,QAA2F,QAA3F;AAEA,SACE,WADF,EAEE,qBAFF,EAGE,0BAHF,EAIE,6BAJF,EAKE,uBALF,QAMO,eANP;AAQA,SACE,SADF,EAEE,mBAFF,EAGE,wBAHF,EAIE,kCAJF,EAKE,2BALF,EAME,qBANF,QAOO,aAPP;AASA,SACE,eADF,EAEE,yBAFF,EAGE,8BAHF,EAIE,iCAJF,EAKE,2BALF,QAMO,mBANP;AAQA,SACE,QADF,EAEE,kBAFF,EAGE,uBAHF,EAIE,0BAJF,EAKE,oBALF,QAMO,YANP;AAQA,SACE,gBADF,EAEE,0BAFF,EAGE,+BAHF,EAIE,kCAJF,EAKE,4BALF,QAMO,oBANP;AAQA,SACE,aADF,EAEE,uBAFF,EAGE,4BAHF,EAIE,+BAJF,EAKE,yBALF,QAMO,iBANP;AAQA,SACE,QADF,EAEE,kBAFF,EAGE,uBAHF,EAIE,iCAJF,EAKE,0BALF,EAME,oBANF,QAOO,YAPP;AAiBA,SACE,WADF,EAEE,qBAFF,EAGE,0BAHF,EAIE,6BAJF,EAKE,uBALF,QAMO,eANP;AAQA,SACE,cADF,EAEE,wBAFF,EAGE,6BAHF,EAIE,gCAJF,EAKE,0BALF,QAMO,kBANP;AAQA,SAAS,WAAT,EAAsB,0BAAtB,EAAkD,uBAAlD,QAAiF,eAAjF;AAGA,SAAS,2BAAT,QAA4C,oBAA5C","sourcesContent":["export { MenuProvider, useMenuContext_unstable } from './contexts/menuContext';\nexport type { MenuContextValue } from './contexts/menuContext';\nexport { MenuTriggerContextProvider, useMenuTriggerContext_unstable } from './contexts/menuTriggerContext';\nexport { MenuGroupContextProvider, useMenuGroupContext_unstable } from './contexts/menuGroupContext';\nexport type { MenuGroupContextValue } from './contexts/menuGroupContext';\nexport { MenuListProvider, useMenuListContext_unstable } from './contexts/menuListContext';\nexport type { MenuListContextValue } from './contexts/menuListContext';\n\nexport { Menu, renderMenu_unstable, useMenuContextValues_unstable, useMenu_unstable } from './Menu';\nexport type { MenuContextValues, MenuOpenChangeData, MenuOpenEvents, MenuProps, MenuSlots, MenuState } from './Menu';\nexport {\n MenuDivider,\n menuDividerClassNames,\n renderMenuDivider_unstable,\n useMenuDividerStyles_unstable,\n useMenuDivider_unstable,\n} from './MenuDivider';\nexport type { MenuDividerProps, MenuDividerSlots, MenuDividerState } from './MenuDivider';\nexport {\n MenuGroup,\n menuGroupClassNames,\n renderMenuGroup_unstable,\n useMenuGroupContextValues_unstable,\n useMenuGroupStyles_unstable,\n useMenuGroup_unstable,\n} from './MenuGroup';\nexport type { MenuGroupContextValues, MenuGroupProps, MenuGroupSlots, MenuGroupState } from './MenuGroup';\nexport {\n MenuGroupHeader,\n menuGroupHeaderClassNames,\n renderMenuGroupHeader_unstable,\n useMenuGroupHeaderStyles_unstable,\n useMenuGroupHeader_unstable,\n} from './MenuGroupHeader';\nexport type { MenuGroupHeaderProps, MenuGroupHeaderSlots, MenuGroupHeaderState } from './MenuGroupHeader';\nexport {\n MenuItem,\n menuItemClassNames,\n renderMenuItem_unstable,\n useMenuItemStyles_unstable,\n useMenuItem_unstable,\n} from './MenuItem';\nexport type { MenuItemProps, MenuItemSlots, MenuItemState } from './MenuItem';\nexport {\n MenuItemCheckbox,\n menuItemCheckboxClassNames,\n renderMenuItemCheckbox_unstable,\n useMenuItemCheckboxStyles_unstable,\n useMenuItemCheckbox_unstable,\n} from './MenuItemCheckbox';\nexport type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox';\nexport {\n MenuItemRadio,\n menuItemRadioClassNames,\n renderMenuItemRadio_unstable,\n useMenuItemRadioStyles_unstable,\n useMenuItemRadio_unstable,\n} from './MenuItemRadio';\nexport type { MenuItemRadioProps, MenuItemRadioState } from './MenuItemRadio';\nexport {\n MenuList,\n menuListClassNames,\n renderMenuList_unstable,\n useMenuListContextValues_unstable,\n useMenuListStyles_unstable,\n useMenuList_unstable,\n} from './MenuList';\nexport type {\n MenuCheckedValueChangeData,\n MenuCheckedValueChangeEvent,\n MenuListContextValues,\n MenuListProps,\n MenuListSlots,\n MenuListState,\n UninitializedMenuListState,\n} from './MenuList';\nexport {\n MenuPopover,\n menuPopoverClassNames,\n renderMenuPopover_unstable,\n useMenuPopoverStyles_unstable,\n useMenuPopover_unstable,\n} from './MenuPopover';\nexport type { MenuPopoverProps, MenuPopoverSlots, MenuPopoverState } from './MenuPopover';\nexport {\n MenuSplitGroup,\n menuSplitGroupClassNames,\n renderMenuSplitGroup_unstable,\n useMenuSplitGroupStyles_unstable,\n useMenuSplitGroup_unstable,\n} from './MenuSplitGroup';\nexport type { MenuSplitGroupProps, MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup';\nexport { MenuTrigger, renderMenuTrigger_unstable, useMenuTrigger_unstable } from './MenuTrigger';\nexport type { MenuTriggerChildProps, MenuTriggerProps, MenuTriggerState } from './MenuTrigger';\n\nexport { useCheckmarkStyles_unstable } from './selectable/index';\nexport type { MenuItemSelectableProps, MenuItemSelectableState, SelectableHandler } from './selectable/index';\n"],"sourceRoot":"../src/"}
|
@@ -35,8 +35,8 @@ const useIsSubmenu_1 = /*#__PURE__*/require("../../utils/useIsSubmenu");
|
|
35
35
|
const useMenu_unstable = props => {
|
36
36
|
const triggerId = react_utilities_1.useId('menu');
|
37
37
|
const isSubmenu = useIsSubmenu_1.useIsSubmenu();
|
38
|
-
const [contextTarget, setContextTarget] = react_positioning_1.
|
39
|
-
const
|
38
|
+
const [contextTarget, setContextTarget] = react_positioning_1.usePositioningMouseTarget();
|
39
|
+
const positioningState = {
|
40
40
|
position: isSubmenu ? 'after' : 'below',
|
41
41
|
align: isSubmenu ? 'top' : 'start',
|
42
42
|
target: props.openOnContext ? contextTarget : undefined,
|
@@ -69,7 +69,7 @@ const useMenu_unstable = props => {
|
|
69
69
|
const {
|
70
70
|
targetRef: triggerRef,
|
71
71
|
containerRef: menuPopoverRef
|
72
|
-
} = react_positioning_1.
|
72
|
+
} = react_positioning_1.usePositioning(positioningState);
|
73
73
|
const initialState = {
|
74
74
|
hoverDelay: 500,
|
75
75
|
triggerId,
|
@@ -135,7 +135,7 @@ const useMenuSelectableState = state => {
|
|
135
135
|
const useMenuOpenState = state => {
|
136
136
|
const {
|
137
137
|
targetDocument
|
138
|
-
} = react_shared_contexts_1.
|
138
|
+
} = react_shared_contexts_1.useFluent_unstable();
|
139
139
|
const parentSetOpen = menuContext_1.useMenuContext_unstable(context => context.setOpen);
|
140
140
|
const onOpenChange = react_utilities_1.useEventCallback((e, data) => {
|
141
141
|
var _a;
|