-
-
Notifications
You must be signed in to change notification settings - Fork 32.5k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Menu][material-next] Copy v5 Menu components (#39301)
- Loading branch information
Showing
13 changed files
with
1,543 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,97 @@ | ||
/* eslint-disable no-restricted-imports */ | ||
import * as React from 'react'; | ||
import { SxProps } from '@mui/system'; | ||
import { InternalStandardProps as StandardProps, Theme } from '@mui/material'; | ||
import { PaperProps } from '@mui/material/Paper'; | ||
import { PopoverProps } from '@mui/material/Popover'; | ||
import { MenuListProps } from '@mui/material/MenuList'; | ||
import { TransitionProps } from '@mui/material/transitions/transition'; | ||
import { MenuClasses } from './menuClasses'; | ||
|
||
export interface MenuProps extends StandardProps<PopoverProps> { | ||
/** | ||
* An HTML element, or a function that returns one. | ||
* It's used to set the position of the menu. | ||
*/ | ||
anchorEl?: PopoverProps['anchorEl']; | ||
/** | ||
* If `true` (Default) will focus the `[role="menu"]` if no focusable child is found. Disabled | ||
* children are not focusable. If you set this prop to `false` focus will be placed | ||
* on the parent modal container. This has severe accessibility implications | ||
* and should only be considered if you manage focus otherwise. | ||
* @default true | ||
*/ | ||
autoFocus?: boolean; | ||
/** | ||
* Menu contents, normally `MenuItem`s. | ||
*/ | ||
children?: React.ReactNode; | ||
/** | ||
* Override or extend the styles applied to the component. | ||
*/ | ||
classes?: Partial<MenuClasses>; | ||
/** | ||
* When opening the menu will not focus the active item but the `[role="menu"]` | ||
* unless `autoFocus` is also set to `false`. Not using the default means not | ||
* following WAI-ARIA authoring practices. Please be considerate about possible | ||
* accessibility implications. | ||
* @default false | ||
*/ | ||
disableAutoFocusItem?: boolean; | ||
/** | ||
* Props applied to the [`MenuList`](/material-ui/api/menu-list/) element. | ||
* @default {} | ||
*/ | ||
MenuListProps?: Partial<MenuListProps>; | ||
/** | ||
* Callback fired when the component requests to be closed. | ||
* | ||
* @param {object} event The event source of the callback. | ||
* @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`, `"tabKeyDown"`. | ||
*/ | ||
onClose?: PopoverProps['onClose']; | ||
/** | ||
* If `true`, the component is shown. | ||
*/ | ||
open: boolean; | ||
/** | ||
* `classes` prop applied to the [`Popover`](/material-ui/api/popover/) element. | ||
*/ | ||
PopoverClasses?: PopoverProps['classes']; | ||
/** | ||
* The system prop that allows defining system overrides as well as additional CSS styles. | ||
*/ | ||
sx?: SxProps<Theme>; | ||
/** | ||
* The length of the transition in `ms`, or 'auto' | ||
* @default 'auto' | ||
*/ | ||
transitionDuration?: TransitionProps['timeout'] | 'auto'; | ||
/** | ||
* Props applied to the transition element. | ||
* By default, the element is based on this [`Transition`](http://reactcommunity.org/react-transition-group/transition/) component. | ||
* @default {} | ||
*/ | ||
TransitionProps?: TransitionProps; | ||
/** | ||
* The variant to use. Use `menu` to prevent selected items from impacting the initial focus. | ||
* @default 'selectedMenu' | ||
*/ | ||
variant?: 'menu' | 'selectedMenu'; | ||
} | ||
|
||
export declare const MenuPaper: React.FC<PaperProps>; | ||
|
||
/** | ||
* | ||
* Demos: | ||
* | ||
* - [App Bar](https://mui.com/material-ui/react-app-bar/) | ||
* - [Menu](https://mui.com/material-ui/react-menu/) | ||
* | ||
* API: | ||
* | ||
* - [Menu API](https://mui.com/material-ui/api/menu/) | ||
* - inherits [Popover API](https://mui.com/material-ui/api/popover/) | ||
*/ | ||
export default function Menu(props: MenuProps): JSX.Element; |
Oops, something went wrong.