menubar

Horizontal application menu bar with cross-menu keyboard navigation.

A headless menubar (WAI-ARIA menubar) — a row of menus with cross-menu keyboard navigation.

import { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem } from '@fluixi/menubar';

<Menubar>
  <MenubarMenu value="file">
    <MenubarTrigger>File</MenubarTrigger>
    <MenubarContent>
      <MenubarItem onSelect={n}>New</MenubarItem>
    </MenubarContent>
  </MenubarMenu>
  <MenubarMenu value="edit">
    <MenubarTrigger>Edit</MenubarTrigger>
    <MenubarContent><MenubarItem>Undo</MenubarItem></MenubarContent>
  </MenubarMenu>
</Menubar>

Left/Right rove between triggers (and switch the open menu), Down opens a menu, Up/Down navigate items with type-ahead, onSelect/Escape/outside close.

Part of the Fluixi UI component library. Made with ☕ by the Fluixi team.

Examples

menubar