ContextMenu

სასტუმროს მოქმედებების მენიუ: ისრებით ნავიგაცია, ტექსტით ძიება, Escape და ჩადგმული ქვემენიუები.

მაგალითი

ჯავშანი #104 · მარიამი

@llc-conciergia/ui/context-menu

import {
  ContextMenu,
  ContextMenuTrigger,
  ContextMenuContent,
  ContextMenuGroup,
  ContextMenuLabel,
  ContextMenuItem,
  ContextMenuSeparator,
} from "@llc-conciergia/ui/context-menu";

<ContextMenu>
  <ContextMenuTrigger tabIndex={0} className="border border-border p-6">
    ჯავშანი #104 · მარიამი
  </ContextMenuTrigger>
  <ContextMenuContent>
    <ContextMenuGroup>
      <ContextMenuLabel>ჯავშანი #104</ContextMenuLabel>
      <ContextMenuItem>გახსნა</ContextMenuItem>
      <ContextMenuItem>რედაქტირება</ContextMenuItem>
    </ContextMenuGroup>
    <ContextMenuSeparator />
    <ContextMenuItem variant="destructive">გაუქმება</ContextMenuItem>
  </ContextMenuContent>
</ContextMenu>;

ინსტალაცია

terminal

pnpm add @llc-conciergia/ui

იმპორტი

import {
  ContextMenu,
  ContextMenuTrigger,
  ContextMenuContent,
  ContextMenuGroup,
  ContextMenuLabel,
  ContextMenuItem,
  ContextMenuSeparator,
} from "@llc-conciergia/ui/context-menu";

Conciergia CLI

npx @llc-conciergia/cli add context-menu

shadcn CLI

npx shadcn@latest add https://ui.conciergia.co/r/context-menu.json

შენიშვნები

წარწერებს აპლიკაცია აწვდის ka/en/ru ენებზე. ზემოთ/ქვემოთ ისრები გადაადგილდება ელემენტებს შორის, მარჯვენა/მარცხენა ხსნის/ხურავს ქვემენიუს. disabled მოქმედება არ სრულდება.

Props

Prop	ტიპი	ნაგულისხმევი	აღწერა
ContextMenu: open / defaultOpen / onOpenChange	boolean / (open, details) => void	—	კონტროლირებადი ან საწყისი გახსნა; callback კლიენტის კომპონენტში.
ContextMenuTrigger	Base UI Trigger props	—	გამხსნელი; render, ref და className მხარდაჭერილია. მარჯვენა კლიკი ან ხანგრძლივი შეხება; კლავიატურისთვის დაამატეთ tabIndex={0}.
ContextMenuContent: side / align / sideOffset	Positioner props	—	პოზიცია: bottom / start / 4.
ContextMenuContent: container	HTMLElement \| RefObject	—	პორტალის კონტეინერი; ნაგულისხმევად document.body.
ContextMenuContent	Base UI Popup props	—	className, render, ref, finalFocus და children გადაეცემა popup-ს.
ContextMenuGroup / ContextMenuLabel	Group / GroupLabel props	—	დასათაურებული ჯგუფი; Label იღებს inset?: boolean-ს.
ContextMenuItem: variant / inset	"default" \| "destructive" / boolean	—	ჩვეულებრივი ან გამაუქმებელი მოქმედება; inset ტოვებს ადგილს ინდიკატორისთვის.
ContextMenuItem	Base UI Item props	—	onClick, disabled, closeOnClick, render, ref და className.
ContextMenuCheckboxItem	Base UI CheckboxItem props	—	checked / defaultChecked / onCheckedChange, disabled, closeOnClick; ჩაშენებული მონიშვნის ინდიკატორი.
ContextMenuRadioGroup / ContextMenuRadioItem	Base UI RadioGroup / RadioItem props	—	value / defaultValue / onValueChange ჯგუფზე; value, disabled, closeOnClick ელემენტზე.
ContextMenuSeparator	Base UI Separator props	—	გამყოფი ხაზი.
ContextMenuShortcut	span props	—	კლავიშების ტექსტი; თვითონ მალსახმობს არ არეგისტრირებს.
ContextMenuSub	Base UI SubmenuRoot props	—	ქვემენიუს open / defaultOpen / onOpenChange / closeParentOnEsc.
ContextMenuSubTrigger	Base UI SubmenuTrigger props & { inset?: boolean }	—	ქვემენიუს გამხსნელი, disabled და მარჯვენა ისარი.
ContextMenuSubContent	ContextMenuContentProps	—	ქვემენიუს პოზიცია: right / start / 4.