Sheet

نصب

pnpm dlx @simurgh-ui/cli add sheet

import {
  Sheet,
  SheetTrigger,
  SheetContent,
  SheetTitle,
  SheetDescription,
  SheetClose,
} from '@simurgh-ui/react/sheet';
import '@simurgh-ui/styles/sheet.css';

پیش‌نمایش واقعی

Live component Sheet ◆

Open filters

استفاده

<Sheet>
  <SheetTrigger>بازکردن فیلترها</SheetTrigger>
  <SheetContent side="right">
    <SheetTitle>فیلترها</SheetTitle>
    <SheetDescription>نتایج قابل‌مشاهده را محدود کنید.</SheetDescription>
    <SheetClose>تمام</SheetClose>
  </SheetContent>
</Sheet>

Sheet modal است و focus را trap و پس از بستن به opener بازمی‌گرداند. Escape سطح بالایی را می‌بندد. side جهت فیزیکی panel است؛ اثر آن را در RTL بررسی کنید. title، description و close قابل‌مشاهده لازم‌اند.

Last verified on 2026-08-13 against Simurgh registry 0.1.1.