One answer at a time, and several

// apps/docs/examples/ui/accordion.tsx'use client';
import {  Accordion,  AccordionContent,  AccordionItem,  AccordionTrigger,} from '@workspace/active-ui/components/primitives/accordion';
const QUESTIONS = [  {    value: 'when',    question: 'When are contributions collected?',    answer: 'On the first working day of each month, for that month.',  },  {    value: 'change',    question: 'Can a participant change the investment profile?',    answer: 'Yes, once a quarter, in the participant portal.',  },  {    value: 'leave',    question: 'What happens when a participant leaves?',    answer:      'The accrued capital stays in the scheme until retirement, unless it is transferred to a new employer.',  },];
/** * Questions whose answers open under them: one at a time by default, or * several with `multiple`. The second list opens on the first answer. */export default function AccordionExample() {  return (    <div className="grid w-full max-w-lg gap-10">      <Accordion>        {QUESTIONS.map((item) => (          <AccordionItem key={item.value} value={item.value}>            <AccordionTrigger>{item.question}</AccordionTrigger>            <AccordionContent>{item.answer}</AccordionContent>          </AccordionItem>        ))}      </Accordion>      <Accordion multiple defaultValue={['when']}>        {QUESTIONS.map((item) => (          <AccordionItem key={item.value} value={item.value}>            <AccordionTrigger>{item.question}</AccordionTrigger>            <AccordionContent>{item.answer}</AccordionContent>          </AccordionItem>        ))}      </Accordion>    </div>  );}