Accordion

콘텐츠를 접고 펼치는 컴포넌트예요. 필요한 정보만 단계적으로 노출할 때 써요. 네이티브 <details> 기반이라 JS 없이 동작하고 서버 컴포넌트(RSC)에서 바로 쓸 수 있어요.

사용법

배송은 얼마나 걸리나요?

주문 후 평균 2~3일 내에 도착해요.

교환·반품이 가능한가요?

수령 후 7일 이내 미사용 제품에 한해 가능해요.

기기는 어떻게 등록하나요?

앱에서 QR 코드를 스캔하면 자동으로 등록돼요.

tsx

import { Accordion, AccordionItem } from '@openiot/ui'

<Accordion>
  <AccordionItem title="배송은 얼마나 걸리나요?" defaultOpen>
    주문 후 평균 2~3일 내에 도착해요.
  </AccordionItem>
  <AccordionItem title="교환·반품이 가능한가요?">…</AccordionItem>
</Accordion>

배타 모드

같은 name 을 주면 한 번에 하나만 열려요(네이티브 <details name>).