DS | Adila.co
Componentes

Menubar

Componente menubar do design system adila.co.

Instalação

bun add @adila-sh/ui

Uso

import {
  Menubar,
  MenubarMenu,
  MenubarTrigger,
  MenubarContent,
  MenubarItem,
  MenubarSeparator,
  MenubarShortcut,
} from '@adila-sh/ui';

export function Example() {
  return (
    <Menubar>
      <MenubarMenu>
        <MenubarTrigger>Arquivo</MenubarTrigger>
        <MenubarContent>
          <MenubarItem>
            Novo <MenubarShortcut>⌘N</MenubarShortcut>
          </MenubarItem>
          <MenubarSeparator />
          <MenubarItem variant="destructive">Sair</MenubarItem>
        </MenubarContent>
      </MenubarMenu>
    </Menubar>
  );
}

Cada MenubarMenu combina MenubarTrigger e MenubarContent. Além dos itens simples, há MenubarCheckboxItem, MenubarRadioGroup/MenubarRadioItem e submenus com MenubarSub, MenubarSubTrigger e MenubarSubContent.

Dependências

  • lucide-react

Componentes relacionados

Nesta página