DropdownMenu

Um menu com suporte a grupos, atalhos, ícones, submenus, e seleção por radio ou checkbox.

Utilização

index.tsx
import {
  DropdownMenu,
  DropdownMenuTrigger,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuSeparator,
  DropdownMenuShortcut
} from "@convertcompany/ui";

Exemplos

Com atalhos

Com grupos e rótulos

Com submenus

Com Checkbox e Radio

Props

Este componente é baseado na biblioteca Radix UI Dropdown Menu, e suas props seguem os padrões dos componentes Radix.

PropriedadeTipo
childrenConteúdo que envolve o trigger e o menu.
ReactNode
PropriedadeTipo
asChildPermite renderizar o trigger como um elemento filho.
boolean
PropriedadeTipo
classNameClasse CSS adicional para o conteúdo do menu.
string
childrenItens e grupos dentro do menu.
ReactNode
PropriedadeTipo
childrenConteúdo do item.
ReactNode
classNameClasse CSS adicional.
string
onSelectFunção executada ao selecionar o item.
() => void
checkedEstado de seleção (apenas checkbox/radio).
boolean
PropriedadeTipo
childrenConteúdo do submenu.
ReactNode
classNameClasse CSS adicional.
string
PropriedadeTipo
childrenConteúdo do componente.
ReactNode
classNameClasse CSS adicional.
string
PropriedadeTipo
childrenTexto do atalho exibido no item.
ReactNode
classNameClasse CSS adicional.
string