API du composant Menu · Needless UI

Import

import-menu.ts

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

NuiMenuTrigger

Ouvre un menu. S’applique généralement à un nuiButton.

Sélecteur: [nuiMenuTrigger]
Exporté sous: nuiMenuTrigger

NuiMenuTrigger: Propriétés
Nom	Type	Par défaut	Description
`nuiMenuTrigger`Input	`Menu`		Le menu à ouvrir : la référence `ngMenu` d’un `nuiMenu`.

NuiMenu

Un menu d’éléments, affiché dans un popover à côté de son déclencheur. Son export ngMenu est le menu Angular Aria qu’attendent les déclencheurs et les sous-menus.

Sélecteur: [nuiMenu]
Exporté sous: ngMenu

NuiMenu: Propriétés
Nom	Type	Par défaut	Description
`wrap`Input	`boolean`	`true`	Indique si les flèches reviennent du dernier élément au premier.
`typeaheadDelay`Input	`number`	`500`	Délai en millisecondes avant la réinitialisation de la recherche par saisie.
`disabled`Input	`boolean`	`false`	Désactive tout le menu.
`enter`Input	`NuiEnter`		Son entrée en scène : `zoom`, `fade`, `drop`, `rise`, `unfold`, `flip`, `swing`, `slide` ou `none`.
`motion`Input	`NuiMotion`		Le ressort qui l’anime : `snappy`, `bouncy`, `jelly`, `elastic`, `lazy`, `mechanical` ou `none`.
`spring`Input	`NuiSpring`		N’importe quel ressort, sous la forme `{ stiffness, damping, mass }`, compilé en CSS à l’exécution. Il a priorité sur `motion`.
`corners`Input	`NuiCorners`		La forme de ses coins : `round`, `squircle`, `bevel`, `scoop`, `notch` ou `square`.
`radius`Input	`NuiRadius`		La taille de ses coins : `none`, `small`, `medium`, `large` ou `full`.
`density`Input	`NuiDensity`		La place qu’il occupe : `compact`, `regular` ou `roomy`.
`itemSelected`Output	`V`		Émet la valeur de l’élément choisi. Sur le menu racine, il se déclenche aussi pour les éléments des sous-menus.

Les inputs de personnalisation que vous ne définissez pas suivent l’attribut data-nui-* le plus proche. Consultez le guide de personnalisation.

NuiMenuItem

Un élément d’un nuiMenu.

Sélecteur: [nuiMenuItem]

NuiMenuItem: Propriétés
Nom	Type	Par défaut	Description
`value`Input	`V`		Identifie l’élément. Doit être unique dans tout le menu, sous-menus compris.
`disabled`Input	`boolean`	`false`	Désactive l’élément. Il reste atteignable avec les flèches, mais ne peut pas être choisi.
`submenu`Input	`Menu`		Un `nuiMenu` imbriqué que cet élément ouvre.
`role`Input	`'menuitem' \| 'menuitemcheckbox' \| 'menuitemradio'`	`'menuitem'`	`menuitem`, `menuitemcheckbox` ou `menuitemradio`.
`checked`Input	`boolean \| undefined`		État coché d’un élément case à cocher ou radio.
`tone`Input	`'neutral' \| 'danger'`	`'neutral'`	`danger` pour les actions destructrices.
`searchTerm`Input	`string`		Texte utilisé par la recherche par saisie. Par défaut, le libellé de l’élément.
`selected`Output	`V`		Émet la valeur de l’élément lorsqu’il est choisi à la souris ou au clavier.

NuiMenuSeparator

Une ligne entre des groupes d’éléments.

Sélecteur: [nuiMenuSeparator]

NuiMenuShortcut

Une indication de raccourci clavier, alignée à la fin d’un élément.

Sélecteur: [nuiMenuShortcut]