آکاردئون (Accordion)

import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from '@parto-system-design/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>
  )
}

<Accordion type="single" collapsible className="w-full">
  <AccordionItem value="q1">
    <AccordionTrigger>نرخ تعامل چطور محاسبه می‌شود؟</AccordionTrigger>
    <AccordionContent>
      نسبت تعاملات (لایک، کامنت، ذخیره) به تعداد فالوورها در دوره انتخاب‌شده. این عدد به صورت درصد نمایش داده می‌شود.
    </AccordionContent>
  </AccordionItem>
  <AccordionItem value="q2">
    <AccordionTrigger>چه پلتفرم‌هایی پشتیبانی می‌شوند؟</AccordionTrigger>
    <AccordionContent>اینستاگرام، توییتر، تیک‌تاک، یوتیوب، لینکدین، تلگرام، و تردز.</AccordionContent>
  </AccordionItem>
</Accordion>

<Accordion type="multiple">
  <AccordionItem value="instagram">
    <AccordionTrigger>اینستاگرام</AccordionTrigger>
    <AccordionContent>تنظیمات مربوط به اینستاگرام...</AccordionContent>
  </AccordionItem>
  <AccordionItem value="twitter">
    <AccordionTrigger>توییتر</AccordionTrigger>
    <AccordionContent>تنظیمات مربوط به توییتر...</AccordionContent>
  </AccordionItem>
</Accordion>