@fluentui/react-menu 9.0.0-rc.6 → 9.0.0-rc.9
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +170 -9
- package/CHANGELOG.md +184 -139
- package/dist/{react-menu.d.ts → index.d.ts} +0 -0
- package/{lib → dist}/tsdoc-metadata.json +0 -0
- package/lib/index.js +25 -16
- package/lib/index.js.map +1 -1
- package/lib-commonjs/index.js +486 -17
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +13 -13
- package/lib/Menu.d.ts +0 -1
- package/lib/MenuDivider.d.ts +0 -1
- package/lib/MenuGroup.d.ts +0 -1
- package/lib/MenuGroupHeader.d.ts +0 -1
- package/lib/MenuItem.d.ts +0 -1
- package/lib/MenuItemCheckbox.d.ts +0 -1
- package/lib/MenuItemRadio.d.ts +0 -1
- package/lib/MenuList.d.ts +0 -1
- package/lib/MenuPopover.d.ts +0 -1
- package/lib/MenuSplitGroup.d.ts +0 -1
- package/lib/MenuTrigger.d.ts +0 -1
- package/lib/components/Menu/Menu.d.ts +0 -6
- package/lib/components/Menu/Menu.types.d.ts +0 -113
- package/lib/components/Menu/index.d.ts +0 -5
- package/lib/components/Menu/renderMenu.d.ts +0 -5
- package/lib/components/Menu/useMenu.d.ts +0 -10
- package/lib/components/Menu/useMenuContextValues.d.ts +0 -2
- package/lib/components/MenuDivider/MenuDivider.d.ts +0 -6
- package/lib/components/MenuDivider/MenuDivider.types.d.ts +0 -6
- package/lib/components/MenuDivider/index.d.ts +0 -5
- package/lib/components/MenuDivider/renderMenuDivider.d.ts +0 -6
- package/lib/components/MenuDivider/useMenuDivider.d.ts +0 -6
- package/lib/components/MenuDivider/useMenuDividerStyles.d.ts +0 -8
- package/lib/components/MenuGroup/MenuGroup.d.ts +0 -6
- package/lib/components/MenuGroup/MenuGroup.types.d.ts +0 -15
- package/lib/components/MenuGroup/index.d.ts +0 -6
- package/lib/components/MenuGroup/renderMenuGroup.d.ts +0 -6
- package/lib/components/MenuGroup/useMenuGroup.d.ts +0 -6
- package/lib/components/MenuGroup/useMenuGroupContextValues.d.ts +0 -2
- package/lib/components/MenuGroup/useMenuGroupStyles.d.ts +0 -8
- package/lib/components/MenuGroupHeader/MenuGroupHeader.d.ts +0 -6
- package/lib/components/MenuGroupHeader/MenuGroupHeader.types.d.ts +0 -6
- package/lib/components/MenuGroupHeader/index.d.ts +0 -5
- package/lib/components/MenuGroupHeader/renderMenuGroupHeader.d.ts +0 -6
- package/lib/components/MenuGroupHeader/useMenuGroupHeader.d.ts +0 -6
- package/lib/components/MenuGroupHeader/useMenuGroupHeaderStyles.d.ts +0 -8
- package/lib/components/MenuItem/MenuItem.d.ts +0 -6
- package/lib/components/MenuItem/MenuItem.types.d.ts +0 -43
- package/lib/components/MenuItem/index.d.ts +0 -5
- package/lib/components/MenuItem/renderMenuItem.d.ts +0 -5
- package/lib/components/MenuItem/useCharacterSearch.d.ts +0 -3
- package/lib/components/MenuItem/useMenuItem.d.ts +0 -6
- package/lib/components/MenuItem/useMenuItemStyles.d.ts +0 -9
- package/lib/components/MenuItemCheckbox/MenuItemCheckbox.d.ts +0 -6
- package/lib/components/MenuItemCheckbox/MenuItemCheckbox.types.d.ts +0 -4
- package/lib/components/MenuItemCheckbox/index.d.ts +0 -5
- package/lib/components/MenuItemCheckbox/renderMenuItemCheckbox.d.ts +0 -3
- package/lib/components/MenuItemCheckbox/useMenuItemCheckbox.d.ts +0 -4
- package/lib/components/MenuItemCheckbox/useMenuItemCheckboxStyles.d.ts +0 -9
- package/lib/components/MenuItemRadio/MenuItemRadio.d.ts +0 -6
- package/lib/components/MenuItemRadio/MenuItemRadio.types.d.ts +0 -4
- package/lib/components/MenuItemRadio/index.d.ts +0 -5
- package/lib/components/MenuItemRadio/renderMenuItemRadio.d.ts +0 -6
- package/lib/components/MenuItemRadio/useMenuItemRadio.d.ts +0 -6
- package/lib/components/MenuItemRadio/useMenuItemRadioStyles.d.ts +0 -9
- package/lib/components/MenuList/MenuList.d.ts +0 -6
- package/lib/components/MenuList/MenuList.types.d.ts +0 -55
- package/lib/components/MenuList/index.d.ts +0 -6
- package/lib/components/MenuList/renderMenuList.d.ts +0 -5
- package/lib/components/MenuList/useMenuList.d.ts +0 -6
- package/lib/components/MenuList/useMenuListContextValues.d.ts +0 -2
- package/lib/components/MenuList/useMenuListStyles.d.ts +0 -11
- package/lib/components/MenuPopover/MenuPopover.d.ts +0 -6
- package/lib/components/MenuPopover/MenuPopover.types.d.ts +0 -18
- package/lib/components/MenuPopover/index.d.ts +0 -5
- package/lib/components/MenuPopover/renderMenuPopover.d.ts +0 -5
- package/lib/components/MenuPopover/useMenuPopover.d.ts +0 -12
- package/lib/components/MenuPopover/useMenuPopoverStyles.d.ts +0 -11
- package/lib/components/MenuSplitGroup/MenuSplitGroup.d.ts +0 -6
- package/lib/components/MenuSplitGroup/MenuSplitGroup.types.d.ts +0 -14
- package/lib/components/MenuSplitGroup/index.d.ts +0 -5
- package/lib/components/MenuSplitGroup/renderMenuSplitGroup.d.ts +0 -5
- package/lib/components/MenuSplitGroup/useMenuSplitGroup.d.ts +0 -12
- package/lib/components/MenuSplitGroup/useMenuSplitGroupStyles.d.ts +0 -11
- package/lib/components/MenuTrigger/MenuTrigger.d.ts +0 -8
- package/lib/components/MenuTrigger/MenuTrigger.types.d.ts +0 -20
- package/lib/components/MenuTrigger/index.d.ts +0 -4
- package/lib/components/MenuTrigger/renderMenuTrigger.d.ts +0 -7
- package/lib/components/MenuTrigger/useMenuTrigger.d.ts +0 -8
- package/lib/components/index.d.ts +0 -2
- package/lib/contexts/menuContext.d.ts +0 -16
- package/lib/contexts/menuGroupContext.d.ts +0 -13
- package/lib/contexts/menuListContext.d.ts +0 -15
- package/lib/contexts/menuTriggerContext.d.ts +0 -3
- package/lib/index.d.ts +0 -16
- package/lib/selectable/index.d.ts +0 -2
- package/lib/selectable/types.d.ts +0 -34
- package/lib/selectable/useCheckmarkStyles.d.ts +0 -8
- package/lib/utils/index.d.ts +0 -1
- package/lib/utils/useIsSubmenu.d.ts +0 -9
- package/lib/utils/useOnMenuEnter.d.ts +0 -23
- package/lib-commonjs/Menu.d.ts +0 -1
- package/lib-commonjs/MenuDivider.d.ts +0 -1
- package/lib-commonjs/MenuGroup.d.ts +0 -1
- package/lib-commonjs/MenuGroupHeader.d.ts +0 -1
- package/lib-commonjs/MenuItem.d.ts +0 -1
- package/lib-commonjs/MenuItemCheckbox.d.ts +0 -1
- package/lib-commonjs/MenuItemRadio.d.ts +0 -1
- package/lib-commonjs/MenuList.d.ts +0 -1
- package/lib-commonjs/MenuPopover.d.ts +0 -1
- package/lib-commonjs/MenuSplitGroup.d.ts +0 -1
- package/lib-commonjs/MenuTrigger.d.ts +0 -1
- package/lib-commonjs/components/Menu/Menu.d.ts +0 -6
- package/lib-commonjs/components/Menu/Menu.types.d.ts +0 -113
- package/lib-commonjs/components/Menu/index.d.ts +0 -5
- package/lib-commonjs/components/Menu/renderMenu.d.ts +0 -5
- package/lib-commonjs/components/Menu/useMenu.d.ts +0 -10
- package/lib-commonjs/components/Menu/useMenuContextValues.d.ts +0 -2
- package/lib-commonjs/components/MenuDivider/MenuDivider.d.ts +0 -6
- package/lib-commonjs/components/MenuDivider/MenuDivider.types.d.ts +0 -6
- package/lib-commonjs/components/MenuDivider/index.d.ts +0 -5
- package/lib-commonjs/components/MenuDivider/renderMenuDivider.d.ts +0 -6
- package/lib-commonjs/components/MenuDivider/useMenuDivider.d.ts +0 -6
- package/lib-commonjs/components/MenuDivider/useMenuDividerStyles.d.ts +0 -8
- package/lib-commonjs/components/MenuGroup/MenuGroup.d.ts +0 -6
- package/lib-commonjs/components/MenuGroup/MenuGroup.types.d.ts +0 -15
- package/lib-commonjs/components/MenuGroup/index.d.ts +0 -6
- package/lib-commonjs/components/MenuGroup/renderMenuGroup.d.ts +0 -6
- package/lib-commonjs/components/MenuGroup/useMenuGroup.d.ts +0 -6
- package/lib-commonjs/components/MenuGroup/useMenuGroupContextValues.d.ts +0 -2
- package/lib-commonjs/components/MenuGroup/useMenuGroupStyles.d.ts +0 -8
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.d.ts +0 -6
- package/lib-commonjs/components/MenuGroupHeader/MenuGroupHeader.types.d.ts +0 -6
- package/lib-commonjs/components/MenuGroupHeader/index.d.ts +0 -5
- package/lib-commonjs/components/MenuGroupHeader/renderMenuGroupHeader.d.ts +0 -6
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeader.d.ts +0 -6
- package/lib-commonjs/components/MenuGroupHeader/useMenuGroupHeaderStyles.d.ts +0 -8
- package/lib-commonjs/components/MenuItem/MenuItem.d.ts +0 -6
- package/lib-commonjs/components/MenuItem/MenuItem.types.d.ts +0 -43
- package/lib-commonjs/components/MenuItem/index.d.ts +0 -5
- package/lib-commonjs/components/MenuItem/renderMenuItem.d.ts +0 -5
- package/lib-commonjs/components/MenuItem/useCharacterSearch.d.ts +0 -3
- package/lib-commonjs/components/MenuItem/useMenuItem.d.ts +0 -6
- package/lib-commonjs/components/MenuItem/useMenuItemStyles.d.ts +0 -9
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.d.ts +0 -6
- package/lib-commonjs/components/MenuItemCheckbox/MenuItemCheckbox.types.d.ts +0 -4
- package/lib-commonjs/components/MenuItemCheckbox/index.d.ts +0 -5
- package/lib-commonjs/components/MenuItemCheckbox/renderMenuItemCheckbox.d.ts +0 -3
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckbox.d.ts +0 -4
- package/lib-commonjs/components/MenuItemCheckbox/useMenuItemCheckboxStyles.d.ts +0 -9
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.d.ts +0 -6
- package/lib-commonjs/components/MenuItemRadio/MenuItemRadio.types.d.ts +0 -4
- package/lib-commonjs/components/MenuItemRadio/index.d.ts +0 -5
- package/lib-commonjs/components/MenuItemRadio/renderMenuItemRadio.d.ts +0 -6
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadio.d.ts +0 -6
- package/lib-commonjs/components/MenuItemRadio/useMenuItemRadioStyles.d.ts +0 -9
- package/lib-commonjs/components/MenuList/MenuList.d.ts +0 -6
- package/lib-commonjs/components/MenuList/MenuList.types.d.ts +0 -55
- package/lib-commonjs/components/MenuList/index.d.ts +0 -6
- package/lib-commonjs/components/MenuList/renderMenuList.d.ts +0 -5
- package/lib-commonjs/components/MenuList/useMenuList.d.ts +0 -6
- package/lib-commonjs/components/MenuList/useMenuListContextValues.d.ts +0 -2
- package/lib-commonjs/components/MenuList/useMenuListStyles.d.ts +0 -11
- package/lib-commonjs/components/MenuPopover/MenuPopover.d.ts +0 -6
- package/lib-commonjs/components/MenuPopover/MenuPopover.types.d.ts +0 -18
- package/lib-commonjs/components/MenuPopover/index.d.ts +0 -5
- package/lib-commonjs/components/MenuPopover/renderMenuPopover.d.ts +0 -5
- package/lib-commonjs/components/MenuPopover/useMenuPopover.d.ts +0 -12
- package/lib-commonjs/components/MenuPopover/useMenuPopoverStyles.d.ts +0 -11
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.d.ts +0 -6
- package/lib-commonjs/components/MenuSplitGroup/MenuSplitGroup.types.d.ts +0 -14
- package/lib-commonjs/components/MenuSplitGroup/index.d.ts +0 -5
- package/lib-commonjs/components/MenuSplitGroup/renderMenuSplitGroup.d.ts +0 -5
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroup.d.ts +0 -12
- package/lib-commonjs/components/MenuSplitGroup/useMenuSplitGroupStyles.d.ts +0 -11
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.d.ts +0 -8
- package/lib-commonjs/components/MenuTrigger/MenuTrigger.types.d.ts +0 -20
- package/lib-commonjs/components/MenuTrigger/index.d.ts +0 -4
- package/lib-commonjs/components/MenuTrigger/renderMenuTrigger.d.ts +0 -7
- package/lib-commonjs/components/MenuTrigger/useMenuTrigger.d.ts +0 -8
- package/lib-commonjs/components/index.d.ts +0 -2
- package/lib-commonjs/contexts/menuContext.d.ts +0 -16
- package/lib-commonjs/contexts/menuGroupContext.d.ts +0 -13
- package/lib-commonjs/contexts/menuListContext.d.ts +0 -15
- package/lib-commonjs/contexts/menuTriggerContext.d.ts +0 -3
- package/lib-commonjs/index.d.ts +0 -16
- package/lib-commonjs/selectable/index.d.ts +0 -2
- package/lib-commonjs/selectable/types.d.ts +0 -34
- package/lib-commonjs/selectable/useCheckmarkStyles.d.ts +0 -8
- package/lib-commonjs/utils/index.d.ts +0 -1
- package/lib-commonjs/utils/useIsSubmenu.d.ts +0 -9
- package/lib-commonjs/utils/useOnMenuEnter.d.ts +0 -23
@@ -1,55 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
3
|
-
import type { MenuListContextValue } from '../../contexts/menuListContext';
|
4
|
-
import type { SelectableHandler } from '../../selectable/index';
|
5
|
-
export declare type MenuCheckedValueChangeEvent = React.MouseEvent | React.KeyboardEvent;
|
6
|
-
export declare type MenuCheckedValueChangeData = {
|
7
|
-
/** The name of the value */
|
8
|
-
name: string;
|
9
|
-
/** The items for this value that are checked */
|
10
|
-
checkedItems: string[];
|
11
|
-
};
|
12
|
-
export declare type MenuListCommons = {
|
13
|
-
/**
|
14
|
-
* Callback when checked items change for value with a name
|
15
|
-
*
|
16
|
-
* @param event - React's original SyntheticEvent
|
17
|
-
* @param data - A data object with relevant information
|
18
|
-
*/
|
19
|
-
onCheckedValueChange?: (e: MenuCheckedValueChangeEvent, data: MenuCheckedValueChangeData) => void;
|
20
|
-
/**
|
21
|
-
* Map of all checked values
|
22
|
-
*/
|
23
|
-
checkedValues: Record<string, string[]>;
|
24
|
-
/**
|
25
|
-
* Default values to be checked on mount
|
26
|
-
*/
|
27
|
-
defaultCheckedValues?: Record<string, string[]>;
|
28
|
-
/**
|
29
|
-
* States that menu items can contain icons and reserve slots for item alignment
|
30
|
-
*/
|
31
|
-
hasIcons?: boolean;
|
32
|
-
/**
|
33
|
-
* States that menu items can contain selectable items and reserve slots for item alignment
|
34
|
-
*/
|
35
|
-
hasCheckmarks?: boolean;
|
36
|
-
};
|
37
|
-
export declare type MenuListSlots = {
|
38
|
-
root: Slot<'div'>;
|
39
|
-
};
|
40
|
-
export declare type MenuListProps = ComponentProps<MenuListSlots> & Partial<MenuListCommons>;
|
41
|
-
export declare type MenuListState = ComponentState<MenuListSlots> & MenuListCommons & {
|
42
|
-
/**
|
43
|
-
* Callback to set focus on the next menu item by first character
|
44
|
-
*/
|
45
|
-
setFocusByFirstCharacter: NonNullable<MenuListContextValue['setFocusByFirstCharacter']>;
|
46
|
-
toggleCheckbox: SelectableHandler;
|
47
|
-
/**
|
48
|
-
* Selects a radio item, will de-select the currently selected ratio item
|
49
|
-
*/
|
50
|
-
selectRadio: SelectableHandler;
|
51
|
-
};
|
52
|
-
export declare type MenuListContextValues = {
|
53
|
-
menuList: MenuListContextValue;
|
54
|
-
};
|
55
|
-
export declare type UninitializedMenuListState = Omit<MenuListState, 'setFocusByFirstCharacter' | 'toggleCheckbox' | 'selectRadio' | 'checkedValues'> & Partial<Pick<MenuListState, 'checkedValues'>>;
|
@@ -1,6 +0,0 @@
|
|
1
|
-
export * from './MenuList';
|
2
|
-
export type { MenuCheckedValueChangeData, MenuCheckedValueChangeEvent, MenuListContextValues, MenuListProps, MenuListSlots, MenuListState, UninitializedMenuListState, } from './MenuList.types';
|
3
|
-
export * from './renderMenuList';
|
4
|
-
export * from './useMenuList';
|
5
|
-
export * from './useMenuListStyles';
|
6
|
-
export * from './useMenuListContextValues';
|
@@ -1,6 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { MenuListProps, MenuListState } from './MenuList.types';
|
3
|
-
/**
|
4
|
-
* Returns the props and state required to render the component
|
5
|
-
*/
|
6
|
-
export declare const useMenuList_unstable: (props: MenuListProps, ref: React.Ref<HTMLElement>) => MenuListState;
|
@@ -1,11 +0,0 @@
|
|
1
|
-
import type { SlotClassNames } from '@fluentui/react-utilities';
|
2
|
-
import type { MenuListSlots, MenuListState } from './MenuList.types';
|
3
|
-
/**
|
4
|
-
* @deprecated Use `menuListClassNames.root` instead.
|
5
|
-
*/
|
6
|
-
export declare const menuListClassName = "fui-MenuList";
|
7
|
-
export declare const menuListClassNames: SlotClassNames<MenuListSlots>;
|
8
|
-
/**
|
9
|
-
* Apply styling to the Menu slots based on the state
|
10
|
-
*/
|
11
|
-
export declare const useMenuListStyles_unstable: (state: MenuListState) => MenuListState;
|
@@ -1,6 +0,0 @@
|
|
1
|
-
import type { MenuPopoverProps } from './MenuPopover.types';
|
2
|
-
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
3
|
-
/**
|
4
|
-
* Popover intended to wrap `MenuList` and adds styling and interaction support specific to menus
|
5
|
-
*/
|
6
|
-
export declare const MenuPopover: ForwardRefComponent<MenuPopoverProps>;
|
@@ -1,18 +0,0 @@
|
|
1
|
-
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
2
|
-
export declare type MenuPopoverSlots = {
|
3
|
-
root: Slot<'div'>;
|
4
|
-
};
|
5
|
-
/**
|
6
|
-
* MenuPopover Props
|
7
|
-
*/
|
8
|
-
export declare type MenuPopoverProps = ComponentProps<MenuPopoverSlots>;
|
9
|
-
/**
|
10
|
-
* State used in rendering MenuPopover
|
11
|
-
*/
|
12
|
-
export declare type MenuPopoverState = ComponentState<MenuPopoverSlots> & {
|
13
|
-
/**
|
14
|
-
* Root menus are rendered out of DOM order on `document.body`, use this to render the menu in DOM order
|
15
|
-
* This option is disregarded for submenus
|
16
|
-
*/
|
17
|
-
inline: boolean;
|
18
|
-
};
|
@@ -1,12 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';
|
3
|
-
/**
|
4
|
-
* Create the state required to render MenuPopover.
|
5
|
-
*
|
6
|
-
* The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,
|
7
|
-
* before being passed to renderMenuPopover_unstable.
|
8
|
-
*
|
9
|
-
* @param props - props from this instance of MenuPopover
|
10
|
-
* @param ref - reference to root HTMLElement of MenuPopover
|
11
|
-
*/
|
12
|
-
export declare const useMenuPopover_unstable: (props: MenuPopoverProps, ref: React.Ref<HTMLElement>) => MenuPopoverState;
|
@@ -1,11 +0,0 @@
|
|
1
|
-
import type { MenuPopoverSlots, MenuPopoverState } from './MenuPopover.types';
|
2
|
-
import type { SlotClassNames } from '@fluentui/react-utilities';
|
3
|
-
/**
|
4
|
-
* @deprecated Use `menuPopoverClassNames.root` instead.
|
5
|
-
*/
|
6
|
-
export declare const menuPopoverClassName = "fui-MenuPopover";
|
7
|
-
export declare const menuPopoverClassNames: SlotClassNames<MenuPopoverSlots>;
|
8
|
-
/**
|
9
|
-
* Apply styling to the Menu slots based on the state
|
10
|
-
*/
|
11
|
-
export declare const useMenuPopoverStyles_unstable: (state: MenuPopoverState) => MenuPopoverState;
|
@@ -1,6 +0,0 @@
|
|
1
|
-
import type { MenuSplitGroupProps } from './MenuSplitGroup.types';
|
2
|
-
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
3
|
-
/**
|
4
|
-
* Layout wrapper that provides extra keyboard navigation behavior for two `MenuItem` components.
|
5
|
-
*/
|
6
|
-
export declare const MenuSplitGroup: ForwardRefComponent<MenuSplitGroupProps>;
|
@@ -1,14 +0,0 @@
|
|
1
|
-
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
2
|
-
export declare type MenuSplitGroupSlots = {
|
3
|
-
root: Slot<'div'>;
|
4
|
-
};
|
5
|
-
declare type MenuSplitGroupCommons = {};
|
6
|
-
/**
|
7
|
-
* MenuSplitGroup Props
|
8
|
-
*/
|
9
|
-
export declare type MenuSplitGroupProps = ComponentProps<MenuSplitGroupSlots> & MenuSplitGroupCommons;
|
10
|
-
/**
|
11
|
-
* State used in rendering MenuSplitGroup
|
12
|
-
*/
|
13
|
-
export declare type MenuSplitGroupState = ComponentState<MenuSplitGroupSlots> & MenuSplitGroupCommons;
|
14
|
-
export {};
|
@@ -1,12 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { MenuSplitGroupProps, MenuSplitGroupState } from './MenuSplitGroup.types';
|
3
|
-
/**
|
4
|
-
* Create the state required to render MenuSplitGroup.
|
5
|
-
*
|
6
|
-
* The returned state can be modified with hooks such as useMenuSplitGroupStyles_unstable,
|
7
|
-
* before being passed to renderMenuSplitGroup_unstable.
|
8
|
-
*
|
9
|
-
* @param props - props from this instance of MenuSplitGroup
|
10
|
-
* @param ref - reference to root HTMLElement of MenuSplitGroup
|
11
|
-
*/
|
12
|
-
export declare const useMenuSplitGroup_unstable: (props: MenuSplitGroupProps, ref: React.Ref<HTMLElement>) => MenuSplitGroupState;
|
@@ -1,11 +0,0 @@
|
|
1
|
-
import type { MenuSplitGroupSlots, MenuSplitGroupState } from './MenuSplitGroup.types';
|
2
|
-
import type { SlotClassNames } from '@fluentui/react-utilities';
|
3
|
-
/**
|
4
|
-
* @deprecated Use `menuSplitGroupClassNames.root` instead.
|
5
|
-
*/
|
6
|
-
export declare const menuSplitGroupClassName = "fui-MenuSplitGroup";
|
7
|
-
export declare const menuSplitGroupClassNames: SlotClassNames<MenuSplitGroupSlots>;
|
8
|
-
/**
|
9
|
-
* Apply styling to the MenuSplitGroup slots based on the state
|
10
|
-
*/
|
11
|
-
export declare const useMenuSplitGroupStyles_unstable: (state: MenuSplitGroupState) => MenuSplitGroupState;
|
@@ -1,8 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { MenuTriggerProps } from './MenuTrigger.types';
|
3
|
-
import type { FluentTriggerComponent } from '@fluentui/react-utilities';
|
4
|
-
/**
|
5
|
-
* Wraps a trigger element as an only child
|
6
|
-
* and adds the necessary event handling to open a popup menu
|
7
|
-
*/
|
8
|
-
export declare const MenuTrigger: React.FC<MenuTriggerProps> & FluentTriggerComponent;
|
@@ -1,20 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
export declare type MenuTriggerProps = {
|
3
|
-
/**
|
4
|
-
* Explicitly require single child or render function
|
5
|
-
*/
|
6
|
-
children: (React.ReactElement & {
|
7
|
-
ref?: React.Ref<unknown>;
|
8
|
-
}) | ((props: MenuTriggerChildProps) => React.ReactElement | null);
|
9
|
-
};
|
10
|
-
/**
|
11
|
-
* Props that are passed to the child of the MenuTrigger when cloned to ensure correct behaviour for the Menu
|
12
|
-
*/
|
13
|
-
export declare type MenuTriggerChildProps = Required<Pick<React.HTMLAttributes<HTMLElement>, 'onClick' | 'onMouseEnter' | 'onMouseLeave' | 'onMouseMove' | 'onContextMenu' | 'onKeyDown' | 'aria-haspopup' | 'id'>> & {
|
14
|
-
ref?: React.Ref<never>;
|
15
|
-
'aria-expanded': boolean | undefined;
|
16
|
-
};
|
17
|
-
export declare type MenuTriggerState = {
|
18
|
-
children: React.ReactElement | null;
|
19
|
-
isSubmenu: boolean;
|
20
|
-
};
|
@@ -1,8 +0,0 @@
|
|
1
|
-
import { MenuTriggerProps, MenuTriggerState } from './MenuTrigger.types';
|
2
|
-
/**
|
3
|
-
* Create the state required to render MenuTrigger.
|
4
|
-
* Clones the only child component and adds necessary event handling behaviours to open a popup menu
|
5
|
-
*
|
6
|
-
* @param props - props from this instance of MenuTrigger
|
7
|
-
*/
|
8
|
-
export declare const useMenuTrigger_unstable: (props: MenuTriggerProps) => MenuTriggerState;
|
@@ -1,16 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { ContextSelector, Context } from '@fluentui/react-context-selector';
|
3
|
-
import type { MenuListProps } from '../components/index';
|
4
|
-
import type { MenuState } from '../components/Menu/index';
|
5
|
-
export declare const MenuContext: Context<MenuContextValue>;
|
6
|
-
/**
|
7
|
-
* Context shared between Menu and its children components
|
8
|
-
*
|
9
|
-
* Extends and drills down MenuList props to simplify API
|
10
|
-
*/
|
11
|
-
export declare type MenuContextValue = MenuListProps & Pick<MenuState, 'openOnHover' | 'openOnContext' | 'triggerRef' | 'menuPopoverRef' | 'setOpen' | 'isSubmenu' | 'triggerId' | 'hasIcons' | 'hasCheckmarks' | 'persistOnItemClick' | 'inline'> & {
|
12
|
-
open: boolean;
|
13
|
-
triggerId: string;
|
14
|
-
};
|
15
|
-
export declare const MenuProvider: React.Provider<MenuContextValue> & React.FC<React.ProviderProps<MenuContextValue>>;
|
16
|
-
export declare const useMenuContext_unstable: <T>(selector: ContextSelector<MenuContextValue, T>) => T;
|
@@ -1,13 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
/**
|
3
|
-
* Context used to guarantee correct aria-relationship between header
|
4
|
-
* and group information
|
5
|
-
*/
|
6
|
-
export declare type MenuGroupContextValue = {
|
7
|
-
/**
|
8
|
-
* Element id applied to the `MenuGroupHeader` component
|
9
|
-
*/
|
10
|
-
headerId: string;
|
11
|
-
};
|
12
|
-
export declare const MenuGroupContextProvider: React.Provider<MenuGroupContextValue>;
|
13
|
-
export declare const useMenuGroupContext_unstable: () => MenuGroupContextValue;
|
@@ -1,15 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { ContextSelector, Context } from '@fluentui/react-context-selector';
|
3
|
-
import type { SelectableHandler } from '../selectable/index';
|
4
|
-
import type { MenuListProps } from '../components/index';
|
5
|
-
export declare const MenuListContext: Context<MenuListContextValue>;
|
6
|
-
/**
|
7
|
-
* Context shared between MenuList and its children components
|
8
|
-
*/
|
9
|
-
export declare type MenuListContextValue = Pick<MenuListProps, 'checkedValues' | 'onCheckedValueChange' | 'hasIcons' | 'hasCheckmarks'> & {
|
10
|
-
setFocusByFirstCharacter?: (e: React.KeyboardEvent<HTMLElement>, itemEl: HTMLElement) => void;
|
11
|
-
toggleCheckbox?: SelectableHandler;
|
12
|
-
selectRadio?: SelectableHandler;
|
13
|
-
};
|
14
|
-
export declare const MenuListProvider: React.Provider<MenuListContextValue> & React.FC<React.ProviderProps<MenuListContextValue>>;
|
15
|
-
export declare const useMenuListContext_unstable: <T>(selector: ContextSelector<MenuListContextValue, T>) => T;
|
package/lib/index.d.ts
DELETED
@@ -1,16 +0,0 @@
|
|
1
|
-
export * from './contexts/menuContext';
|
2
|
-
export * from './contexts/menuTriggerContext';
|
3
|
-
export * from './contexts/menuGroupContext';
|
4
|
-
export * from './contexts/menuListContext';
|
5
|
-
export * from './Menu';
|
6
|
-
export * from './MenuDivider';
|
7
|
-
export * from './MenuGroup';
|
8
|
-
export * from './MenuGroupHeader';
|
9
|
-
export * from './MenuItem';
|
10
|
-
export * from './MenuItemCheckbox';
|
11
|
-
export * from './MenuItemRadio';
|
12
|
-
export * from './MenuList';
|
13
|
-
export * from './MenuPopover';
|
14
|
-
export * from './MenuSplitGroup';
|
15
|
-
export * from './MenuTrigger';
|
16
|
-
export * from './selectable/index';
|
@@ -1,34 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
export declare type SelectableHandler = (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked: boolean) => void;
|
3
|
-
/**
|
4
|
-
* Props for selecatble menu items
|
5
|
-
*/
|
6
|
-
export declare type MenuItemSelectableProps = {
|
7
|
-
/**
|
8
|
-
* Follows input convention
|
9
|
-
* https://www.w3schools.com/jsref/prop_checkbox_name.asp
|
10
|
-
*/
|
11
|
-
name: string;
|
12
|
-
/**
|
13
|
-
* Follows input convention
|
14
|
-
* https://www.w3schools.com/jsref/prop_checkbox_value.asp
|
15
|
-
*/
|
16
|
-
value: string;
|
17
|
-
};
|
18
|
-
/**
|
19
|
-
* State for selectable menu items
|
20
|
-
*/
|
21
|
-
export declare type MenuItemSelectableState = MenuItemSelectableProps & {
|
22
|
-
/**
|
23
|
-
* Checked items for a value with `name`
|
24
|
-
*/
|
25
|
-
checkedItems: string[];
|
26
|
-
/**
|
27
|
-
* Callback when checked items changes for a given value with `name`
|
28
|
-
*/
|
29
|
-
onCheckedValueChange: (e: React.MouseEvent | React.KeyboardEvent, name: string, checkedItems: string[]) => void;
|
30
|
-
/**
|
31
|
-
* Selectable is checked
|
32
|
-
*/
|
33
|
-
checked: boolean;
|
34
|
-
};
|
@@ -1,8 +0,0 @@
|
|
1
|
-
import type { MenuItemSelectableState } from './types';
|
2
|
-
import type { MenuItemState } from '../components/MenuItem/MenuItem.types';
|
3
|
-
/**
|
4
|
-
* Applies styles to a checkmark slot for selectable menu items
|
5
|
-
*
|
6
|
-
* @param state - should contain a `checkmark` slot
|
7
|
-
*/
|
8
|
-
export declare const useCheckmarkStyles_unstable: (state: MenuItemSelectableState & Pick<MenuItemState, 'checkmark'>) => void;
|
package/lib/utils/index.d.ts
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
export * from './useOnMenuEnter';
|
@@ -1,9 +0,0 @@
|
|
1
|
-
/**
|
2
|
-
* A component can be a part of a submenu whether its menu context `isSubmenu` flag is true
|
3
|
-
* or whether it is a part of a `MenuList`
|
4
|
-
*
|
5
|
-
* A simple hook to check box contexts easily
|
6
|
-
*
|
7
|
-
* @returns whether the component is part of a submenu
|
8
|
-
*/
|
9
|
-
export declare function useIsSubmenu(): boolean;
|
@@ -1,23 +0,0 @@
|
|
1
|
-
import type { UseOnClickOrScrollOutsideOptions } from '@fluentui/react-utilities';
|
2
|
-
/**
|
3
|
-
* Name of the custom event
|
4
|
-
*/
|
5
|
-
export declare const MENU_ENTER_EVENT = "fuimenuenter";
|
6
|
-
/**
|
7
|
-
* This hook works similarly to @see {useOnClickOutside}
|
8
|
-
*
|
9
|
-
* Problem: Trying to behave the same as system menus:
|
10
|
-
* When the mouse leaves a stack of nested menus the stack should not dismiss.
|
11
|
-
* However if the mouse leaves a stack of menus and enters a parent menu all its children menu should dismiss.
|
12
|
-
*
|
13
|
-
* We don't use the native mouseenter event because it would trigger too many times in the document
|
14
|
-
* Instead, dispatch custom DOM event from the menu so that it can bubble
|
15
|
-
* Each nested menu can use the listener to check if the event is from a child or parent menu
|
16
|
-
*/
|
17
|
-
export declare const useOnMenuMouseEnter: (options: UseOnClickOrScrollOutsideOptions) => void;
|
18
|
-
/**
|
19
|
-
* Dispatches the custom MouseEvent enter event. Similar to calling `el.click()`
|
20
|
-
* @param el element for the event target
|
21
|
-
* @param nativeEvent the native mouse event this is mapped to
|
22
|
-
*/
|
23
|
-
export declare const dispatchMenuEnterEvent: (el: HTMLElement, nativeEvent: MouseEvent) => void;
|
package/lib-commonjs/Menu.d.ts
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/Menu/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuDivider/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuGroup/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuGroupHeader/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuItem/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuItemCheckbox/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuItemRadio/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuList/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuPopover/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuSplitGroup/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/MenuTrigger/index';
|
@@ -1,113 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import { ComponentProps, ComponentState } from '@fluentui/react-utilities';
|
3
|
-
import { usePopperMouseTarget, PositioningShorthand } from '@fluentui/react-positioning';
|
4
|
-
import { MenuListCommons } from '../MenuList/MenuList.types';
|
5
|
-
import { MenuContextValue } from '../../contexts/menuContext';
|
6
|
-
declare type MenuCommons = MenuListCommons & {
|
7
|
-
/**
|
8
|
-
* Whether the popup is open
|
9
|
-
*/
|
10
|
-
open: boolean;
|
11
|
-
/**
|
12
|
-
* Call back when the component requests to change value
|
13
|
-
* The `open` value is used as a hint when directly controlling the component
|
14
|
-
*/
|
15
|
-
onOpenChange?: (e: MenuOpenEvents, data: MenuOpenChangeData) => void;
|
16
|
-
/**
|
17
|
-
* Whether the popup is open by default
|
18
|
-
*/
|
19
|
-
defaultOpen?: boolean;
|
20
|
-
openOnHover: boolean;
|
21
|
-
/**
|
22
|
-
* Opens the menu on right click (context menu), removes all other menu open interactions
|
23
|
-
*/
|
24
|
-
openOnContext?: boolean;
|
25
|
-
/**
|
26
|
-
* Root menus are rendered out of DOM order on `document.body`, use this to render the menu in DOM order
|
27
|
-
* This option is disregarded for submenus
|
28
|
-
*/
|
29
|
-
inline?: boolean;
|
30
|
-
/**
|
31
|
-
* Do not dismiss the menu when a menu item is clicked
|
32
|
-
*/
|
33
|
-
persistOnItemClick?: boolean;
|
34
|
-
/**
|
35
|
-
* Sets the delay for mouse open/close for the popover one mouse enter/leave
|
36
|
-
*/
|
37
|
-
hoverDelay?: number;
|
38
|
-
};
|
39
|
-
export declare type MenuSlots = {};
|
40
|
-
/**
|
41
|
-
* Extends and drills down Menulist props to simplify API
|
42
|
-
*/
|
43
|
-
export declare type MenuProps = Partial<MenuCommons> & ComponentProps<MenuSlots> & {
|
44
|
-
/**
|
45
|
-
* Can contain two children including {@link MenuTrigger} and {@link MenuPopover}.
|
46
|
-
* Alternatively can only contain {@link MenuPopover} if using a custom `target`.
|
47
|
-
*/
|
48
|
-
children: [JSX.Element, JSX.Element] | JSX.Element;
|
49
|
-
/**
|
50
|
-
* Configures the positioned menu
|
51
|
-
*/
|
52
|
-
positioning?: PositioningShorthand;
|
53
|
-
};
|
54
|
-
export declare type MenuState = MenuCommons & ComponentState<MenuSlots> & {
|
55
|
-
/**
|
56
|
-
* Callback to open/close the popup
|
57
|
-
*/
|
58
|
-
setOpen: (e: MenuOpenEvents, data: MenuOpenChangeData) => void;
|
59
|
-
/**
|
60
|
-
* Internal react node that just simplifies handling children
|
61
|
-
*/
|
62
|
-
menuPopover: React.ReactNode;
|
63
|
-
/**
|
64
|
-
* Internal react node that just simplifies handling children
|
65
|
-
*/
|
66
|
-
menuTrigger: React.ReactNode;
|
67
|
-
/**
|
68
|
-
* The ref for the popup
|
69
|
-
*/
|
70
|
-
menuPopoverRef: React.MutableRefObject<HTMLElement>;
|
71
|
-
/**
|
72
|
-
* The ref for the MenuTrigger, used for popup positioning
|
73
|
-
*/
|
74
|
-
triggerRef: React.MutableRefObject<HTMLElement>;
|
75
|
-
/**
|
76
|
-
* Id for the MenuTrigger element for aria relationship
|
77
|
-
*/
|
78
|
-
triggerId: string;
|
79
|
-
/**
|
80
|
-
* Whether this menu is a submenu
|
81
|
-
*/
|
82
|
-
isSubmenu: boolean;
|
83
|
-
/**
|
84
|
-
* Anchors the popper to the mouse click for context events
|
85
|
-
*/
|
86
|
-
contextTarget: ReturnType<typeof usePopperMouseTarget>[0];
|
87
|
-
/**
|
88
|
-
* A callback to set the target of the popper to the mouse click for context events
|
89
|
-
*/
|
90
|
-
setContextTarget: ReturnType<typeof usePopperMouseTarget>[1];
|
91
|
-
};
|
92
|
-
/**
|
93
|
-
* Data attached to open/close events
|
94
|
-
*/
|
95
|
-
export declare type MenuOpenChangeData = {
|
96
|
-
open: boolean;
|
97
|
-
/**
|
98
|
-
* Indicates whether the change of state was a keyboard interaction
|
99
|
-
*/
|
100
|
-
keyboard?: boolean;
|
101
|
-
/**
|
102
|
-
* indicates whether the request for the open state was bubbled from a nested menu
|
103
|
-
*/
|
104
|
-
bubble?: boolean;
|
105
|
-
};
|
106
|
-
export declare type MenuContextValues = {
|
107
|
-
menu: MenuContextValue;
|
108
|
-
};
|
109
|
-
/**
|
110
|
-
* The supported events that will trigger open/close of the menu
|
111
|
-
*/
|
112
|
-
export declare type MenuOpenEvents = MouseEvent | TouchEvent | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement> | React.FocusEvent<HTMLElement>;
|
113
|
-
export {};
|
@@ -1,10 +0,0 @@
|
|
1
|
-
import type { MenuProps, MenuState } from './Menu.types';
|
2
|
-
/**
|
3
|
-
* Create the state required to render Menu.
|
4
|
-
*
|
5
|
-
* The returned state can be modified with hooks such as useMenuStyles,
|
6
|
-
* before being passed to renderMenu_unstable.
|
7
|
-
*
|
8
|
-
* @param props - props from this instance of Menu
|
9
|
-
*/
|
10
|
-
export declare const useMenu_unstable: (props: MenuProps) => MenuState;
|