پرتوپرتو

آکاردئون (Accordion)

کامپوننت محتوای تاشو برای نمایش و مخفی کردن بخش‌ها

معرفی

کامپوننت Accordion برای نمایش محتوای تاشو استفاده می‌شود که کاربر می‌تواند بخش‌های مختلف را باز و بسته کند.

استفاده

import {
  Accordion,
  AccordionItem,
  AccordionTrigger,
  AccordionContent,
} from '@parto/ui';

export default function MyComponent() {
  return (
    <Accordion type="single" collapsible>
      <AccordionItem value="item-1">
        <AccordionTrigger>سوال اول</AccordionTrigger>
        <AccordionContent>
          پاسخ سوال اول در اینجا قرار می‌گیرد.
        </AccordionContent>
      </AccordionItem>
      <AccordionItem value="item-2">
        <AccordionTrigger>سوال دوم</AccordionTrigger>
        <AccordionContent>
          پاسخ سوال دوم در اینجا قرار می‌گیرد.
        </AccordionContent>
      </AccordionItem>
    </Accordion>
  );
}

ویژگی‌ها

  • پشتیبانی از حالت تک انتخاب یا چند انتخاب
  • انیمیشن نرم باز و بسته شدن
  • کاملاً قابل دسترس با کیبورد
  • سازگار با RTL