Accordion

core

수직으로 쌓인 펼침/접힘 패널. single(한 개)/multiple(여러 개) 모드와 collapsible 지원.

100%

Core·Shells·Surfaces로 구성된 공유 UI 컴포넌트 라이브러리입니다. 차트는 opt-charts가 담당합니다.

여러 패널을 동시에 열 수 있습니다.

이 패널도 함께 열려 있습니다.

2026년 2월 4일

생성된 테스트 결과를 찾지 못했습니다.

Accordion 항목이 문서 메타에 연결되어 있지만 현재 생성 파일에는 없습니다.

테스트를 추가한 뒤 `bun run generate:test-results`를 실행하거나 `testDescribe` 매핑을 다시 확인하세요.

Prop	타입	기본값	설명
`type`	`"single" \| "multiple"`	—	한 개만 열림(single) 또는 여러 개 열림(multiple). 기본 single
`value`	`string \| string[] \| null`	—	열린 항목 값. single은 string\|null, multiple은 string[]
`defaultValue`	`string \| string[] \| null`	—	비제어 초기 열림 값
`onValueChange`	`(value: string \| string[] \| null) => void`	—	열림 변경 콜백
`collapsible`	`boolean`	—	single 모드에서 열린 패널을 다시 닫을 수 있게 허용
`disabled`	`boolean`	—	전체 비활성화
`animated`	`boolean`	—	콘텐츠 enter/leave 애니메이션 (기본 true)
`children`	`ReactNode`	—	AccordionItem 목록

Prop	타입	기본값	설명
`children`*	`ReactNode`	—	헤더 라벨 (쉐브론 아이콘 자동 추가)

Prop	타입	기본값	설명
`children`*	`ReactNode`	—	펼쳐지는 패널 본문

tsx

import {
  AccordionRoot,
  AccordionItem,
  AccordionTrigger,
  AccordionContent,
} from "@reopt-ai/opt-ui";