@react-md/menu

Create accessible dropdown menus that auto-position themselves to stay within
the viewport. The menus are entirely navigable with a keyboard along with some
additional behavior:

- ArrowUp and ArrowDown to focus the previous/next MenuItem that also
allows wrapping
- Home and End to focus the first/last Menuitem in the menu
- type the starting letters of a MenuItem to focus it

> More information on the built-in accessibility can be found in the
> accessibility example
> on the documentation site.

Installation

``sh
npm install --save @react-md/menu
`

You will also need to install the following packages for their styles:

`sh
npm install --save @react-md/theme \
@react-md/typography \
@react-md/icon \
@react-md/list \
@react-md/button \
@react-md/states \
@react-md/utils
`

Documentation

You should check out the
full documentation for live examples
and more customization information, but an example usage is shown below.

Usage

`tsx
import { render } from "react-dom";
import { DropdownMenu, MenuItem } from "@react-md/menu";

const App = () => (

console.log("Clicked Item 1")}>Item 1
console.log("Clicked Item 2")}>Item 2
console.log("Clicked Item 3")}>Item 3

);

render(, document.getElementById("root"));
``