Dialog
მოდალური ფანჯარა Base UI Dialog-ზე: ფოკუსის ჩაკეტვა, Escape-ით დახურვა, ლოკალიზებული დახურვის ღილაკი. ეს გვერდი სერვერ-კომპონენტია — Dialog-ს „use client“ wrapper არ სჭირდება.
მაგალითი
import { Button } from "@llc-conciergia/ui/button";
import {
Dialog, DialogClose, DialogContent, DialogDescription,
DialogFooter, DialogHeader, DialogTitle, DialogTrigger,
} from "@llc-conciergia/ui/dialog";
<Dialog>
<DialogTrigger render={<Button variant="destructive" />}>ჯავშნის გაუქმება</DialogTrigger>
<DialogContent>
<DialogHeader>
<DialogTitle>ჯავშნის გაუქმება</DialogTitle>
<DialogDescription>ქმედება შეუქცევადია.</DialogDescription>
</DialogHeader>
<DialogFooter>
<DialogClose render={<Button variant="outline" />}>დაბრუნება</DialogClose>
<DialogClose render={<Button variant="destructive" />}>გაუქმება</DialogClose>
</DialogFooter>
</DialogContent>
</Dialog>ინსტალაცია
pnpm add @llc-conciergia/uiimport {
Dialog, DialogClose, DialogContent, DialogDescription,
DialogFooter, DialogHeader, DialogTitle, DialogTrigger,
} from "@llc-conciergia/ui/dialog";npx @llc-conciergia/cli add dialognpx shadcn@latest add https://ui.conciergia.co/r/dialog.jsonProps
| Prop | ტიპი | ნაგულისხმევი | აღწერა |
|---|---|---|---|
| Dialog: open / defaultOpen | boolean | — | კონტროლირებადი ან საწყისი მდგომარეობა. |
| Dialog: onOpenChange | (open: boolean) => void | — | გახსნა/დახურვა (კლიენტიდან). |
| DialogTrigger / DialogClose: render | ReactElement | — | ღილაკად რენდერი, მაგ. <Button />. |
| DialogContent: hideClose | boolean | false | კუთხის დახურვის ღილაკის დამალვა. |
| DialogContent: container | HTMLElement | ref | document.body | Portal-ის კონტეინერი. |