پرتوپرتو

PostBulkActionBar (نوار اعمال گروهی)

نوار شناور پایین صفحه که با انتخاب چند پست در PostList ظاهر می‌شود — تگ، بولتن، طبقه‌بندی، خروجی، پرچم.

معرفی

<PostBulkActionBar> همان الگوی Gmail / Linear / Notion: وقتی یک یا چند پست انتخاب می‌شوند، یک نوار شناور رند در پایین viewport می‌چسبد و اکشن‌های گروهی را نمایش می‌دهد. به‌طور پیش‌فرض داخل <PostList> Auto-wired است و فقط وقتی onSelectedIdsChange تنظیم شده فعال می‌شود.

  • چه زمانی استفاده کنیم: برای فیدهایی که نیاز به اعمال یک عمل روی چند پست دارند (تگ‌گذاری، خروجی، طبقه‌بندی sentiment).
  • چه زمانی استفاده نکنیم: برای اکشن تک‌پستی — از <PostActions> روی خود کارت استفاده کنید.

زمین بازی

زمین بازی
تنظیمات
داده
3
کد این نمونه به‌صورت خودکار قابل تولید نیست — برای کد آماده‌ی copy/paste به بخش «استفاده» در بالای صفحه مراجعه کنید.

استفاده

به‌طور خودکار توسط <PostList> رندر می‌شود وقتی onSelectedIdsChange ست شده. برای استفاده‌ی مستقل:

import { PostBulkActionBar } from '@parto-system-design/ui'
;<PostBulkActionBar
  selectedCount={selectedIds.length}
  selectedIds={selectedIds}
  onClear={() => setSelectedIds([])}
  actions={[
    { id: 'tag', label: 'تگ', icon: Tag, onClick: (ids) => bulkTag(ids) },
    {
      id: 'export',
      label: 'خروجی',
      icon: Download,
      options: [
        { id: 'csv', label: 'CSV' },
        { id: 'json', label: 'JSON' },
      ],
      onClick: (ids, opt) => exportAs(ids, opt),
    },
  ]}
/>

کیبورد

  • Esc → پاک کردن انتخاب
  • a (وقتی نوار قابل مشاهده است) → انتخاب همه (در <PostList> پیاده‌سازی می‌شود)

کامپوننت‌های مرتبط

  • برای اکشن‌های تک‌کارتی → <PostActions>
  • برای کنترل selection state → selectedIds و onSelectedIdsChange در <PostList>