Disclosure

core

접기/펼치기 콘텐츠 영역. 3-part anatomy: Root, Trigger, Content.

컴포넌트 의존 관계

깊이

100%

기본 사용

기본 열림 상태

opt-ui는 접근성 프리미티브 기반 UI 컴포넌트 라이브러리입니다. 키보드 탐색과 스크린 리더 지원을 기본 제공합니다.

테스트 커버리지

2026년 2월 4일2/2 통과

2성공

0실패

2전체

트리거 클릭으로 콘텐츠를 토글한다
defaultOpen으로 초기에 열려 있다

DisclosureRoot Props

Prop	타입	기본값	설명
`open`	`boolean`	—	제어 모드: 열림 상태
`setOpen`	`(open: boolean) => void`	—	제어 모드: 상태 변경 핸들러
`defaultOpen`	`boolean`	`false`	비제어 모드: 초기 열림 상태

DisclosureTrigger Props

Prop	타입	기본값	설명
`children`*	`ReactNode`	—	트리거 내용
`className`	`string`	—	기본 스타일 오버라이드

DisclosureContent Props

Prop	타입	기본값	설명
`children`*	`ReactNode`	—	접히는 콘텐츠
`className`	`string`	—	기본 스타일 오버라이드

Import

tsx

import {
  DisclosureRoot,
  DisclosureTrigger,
  DisclosureContent,
} from "@reopt-ai/opt-ui";

키보드 동작

키	동작
Enter / Space	열기/닫기 토글

Disclosure

core

접기/펼치기 콘텐츠 영역. 3-part anatomy: Root, Trigger, Content.

컴포넌트 의존 관계

깊이

100%

기본 사용

기본 열림 상태

opt-ui는 접근성 프리미티브 기반 UI 컴포넌트 라이브러리입니다. 키보드 탐색과 스크린 리더 지원을 기본 제공합니다.

테스트 커버리지

2026년 2월 4일2/2 통과

2성공

0실패

2전체

트리거 클릭으로 콘텐츠를 토글한다
defaultOpen으로 초기에 열려 있다

DisclosureRoot Props

Prop	타입	기본값	설명
`open`	`boolean`	—	제어 모드: 열림 상태
`setOpen`	`(open: boolean) => void`	—	제어 모드: 상태 변경 핸들러
`defaultOpen`	`boolean`	`false`	비제어 모드: 초기 열림 상태

DisclosureTrigger Props

Prop	타입	기본값	설명
`children`*	`ReactNode`	—	트리거 내용
`className`	`string`	—	기본 스타일 오버라이드

DisclosureContent Props

Prop	타입	기본값	설명
`children`*	`ReactNode`	—	접히는 콘텐츠
`className`	`string`	—	기본 스타일 오버라이드

Import

tsx

import {
  DisclosureRoot,
  DisclosureTrigger,
  DisclosureContent,
} from "@reopt-ai/opt-ui";

키보드 동작

키	동작
Enter / Space	열기/닫기 토글