API do componente Menu · Needless UI

Importação

import-menu.ts

import {
  NuiMenu,
  NuiMenuItem,
  NuiMenuSeparator,
  NuiMenuShortcut,
  NuiMenuTrigger,
} from '@needless-ui/angular/menu';

Abre um menu. Normalmente aplicado a um nuiButton.

NuiMenuTrigger: Propriedades
Nome	Tipo	Padrão	Descrição
`nuiMenuTrigger`Input	`Menu`		O menu a ser aberto: a referência `ngMenu` de um `nuiMenu`.

Um menu de itens, renderizado como popover ao lado do seu gatilho. Seu export ngMenu é o menu do Angular Aria que gatilhos e submenus recebem.

NuiMenu: Propriedades
Nome	Tipo	Padrão	Descrição
`wrap`Input	`boolean`	`true`	Indica se as setas passam do último item para o primeiro.
`typeaheadDelay`Input	`number`	`500`	Milissegundos até a busca por digitação reiniciar.
`disabled`Input	`boolean`	`false`	Desativa o menu inteiro.
`enter`Input	`NuiEnter`		Como ele entra em cena: `zoom`, `fade`, `drop`, `rise`, `unfold`, `flip`, `swing`, `slide` ou `none`.
`motion`Input	`NuiMotion`		A mola com que ele se move: `snappy`, `bouncy`, `jelly`, `elastic`, `lazy`, `mechanical` ou `none`.
`spring`Input	`NuiSpring`		Qualquer mola, no formato `{ stiffness, damping, mass }`, compilada para CSS em tempo de execução. Tem prioridade sobre `motion`.
`corners`Input	`NuiCorners`		O formato dos cantos: `round`, `squircle`, `bevel`, `scoop`, `notch` ou `square`.
`radius`Input	`NuiRadius`		O tamanho dos cantos: `none`, `small`, `medium`, `large` ou `full`.
`density`Input	`NuiDensity`		Quanto espaço ele ocupa: `compact`, `regular` ou `roomy`.
`itemSelected`Output	`V`		Emite o valor do item escolhido. No menu raiz, também dispara para itens de submenus.

Os inputs de personalização que você não definir seguem o atributo data-nui-* mais próximo. Veja o guia de personalização.

Um item de um nuiMenu.

NuiMenuItem: Propriedades
Nome	Tipo	Padrão	Descrição
`value`Input	`V`		Identifica o item. Deve ser único em todo o menu, incluindo os submenus.
`disabled`Input	`boolean`	`false`	Desativa o item. Ele continua alcançável pelas setas, mas não pode ser escolhido.
`submenu`Input	`Menu`		Um `nuiMenu` aninhado que este item abre.
`role`Input	`'menuitem' \| 'menuitemcheckbox' \| 'menuitemradio'`	`'menuitem'`	`menuitem`, `menuitemcheckbox` ou `menuitemradio`.
`checked`Input	`boolean \| undefined`		Estado marcado de um item de checkbox ou radio.
`tone`Input	`'neutral' \| 'danger'`	`'neutral'`	`danger` para ações destrutivas.
`searchTerm`Input	`string`		Texto usado pela busca por digitação. Por padrão, é o rótulo do item.
`selected`Output	`V`		Emite o valor do item quando ele é escolhido com o mouse ou o teclado.

Uma linha entre grupos de itens.

Uma dica de atalho de teclado, alinhada ao final de um item.