Context Menu

Контекстное меню. Бесплатно, MIT · Навигация и каркас › Меню и команды

Установка

npx valyro-cli@latest add context-menu

npx shadcn@latest add https://valyro.xyz/r/context-menu.json

npm install valyro-ui

import 'valyro-ui/styles.css';
import { ContextMenu } from 'valyro-ui';

Пропсы

Prop	Type	Default
`children` *	`ReactNode`		The target area. Right-click, long-press, Shift+F10 or the ContextMenu key inside it opens the menu. Or, without `items`, the compound form: a `ContextMenu.Trigger` around the area and the rows (`ContextMenu.Item`, `.CheckboxItem`, `.Label`, `.Separator`).
`items`	`MenuItem[]`		Menu rows: actions (with optional submenus), checkboxes, radio groups, separators and labels.
`open`	`boolean`		Controlled open state. A menu opened through this prop (not by the user) appears at `anchorPoint` of the target (its centre by default).
`defaultOpen`	`boolean`	`false`	Initial `open` when uncontrolled.
`onOpenChange`	`(open: boolean) => void`		Called with the new `open` when it changes.
`disabled`	`boolean`	`false`	Ignore the opening gestures and keys, so the browser's native context menu appears instead.
`animation`	`'pop' \| 'spring'`		`pop` (default): the theme's enter. `spring`: the menu and its submenus spring open and one highlight glides between rows.
`className`	`string`		Class for the menu surface.
`anchorPoint`	`{ x: number; y: number }`	`CENTRE`	Where a menu opened through `open` / `defaultOpen` appears, as fractions of the target's box: `{ x: 0, y: 1 }` is its bottom-left corner. Default: the centre. User gestures open at the pointer.

Составные части

ContextMenu.Trigger (ContextMenuTrigger), ContextMenu.Item (ContextMenuItem), ContextMenu.CheckboxItem (ContextMenuCheckboxItem), ContextMenu.Label (ContextMenuLabel), ContextMenu.Separator (ContextMenuSeparator)

Context Menu

Установка

Пропсы

Составные части

Похожие компоненты