Navegar componentes
← Componentes

MoreMenu

MiscExemplo
MoreMenu é um botão de três pontos que abre uma lista de ações. Use-o para ações secundárias que não precisam estar sempre visíveis, como em linhas de tabela, headers de card ou toolbars.
Importação
import {MoreMenu} from '@pharos-ds/core/MoreMenu';

Exemplos

Área interativa

variant
size
isDisabled
Código
import {MoreMenu} from '@pharos-ds/core/MoreMenu';

<MoreMenu
  variant="ghost"
  size="md"
  isDisabled={false}
 />

Boas práticas

  • Faça: Use para ações de overflow ou secundárias; mantenha ações primárias visíveis fora do menu.
  • Faça: Use dividers ou sections para agrupar ações relacionadas quando o menu tiver muitos itens.
  • Evite: Oculte ações primárias dentro de um MoreMenu; elas devem estar diretamente visíveis.

Props

PropTipoPadrãoDescrição
items *DropdownMenuOption[]Itens de menu: array de dados de ações, dividers e sections. Mesmo tipo da prop items do DropdownMenu.
labelstring'More options'Label acessível para o botão trigger (aria-label) e texto do tooltip.
variantButtonVariant'ghost'Variante de estilo visual do botão trigger.
sizeButtonSize'md'Tamanho do botão trigger.
iconReactNodeSubstitui o ícone padrão de três pontos. Aceita qualquer ReactNode.
isDisabledbooleanfalseSe o trigger do menu está desabilitado.
xstyleStyleXStylesEstilos StyleX para customização de layout (margens, posicionamento, dimensionamento). Deve ser um valor stylex.create(), não um objeto de estilo inline como style={{}}.
Pacote: @pharos-ds/core · Import: @pharos-ds/core/MoreMenu
MoreMenu · Pharos