컴포넌트
CheckboxDraw
체크 시 SVG stroke로 체크마크가 왼쪽에서 오른쪽으로 그려지고 박스가 브랜드 그라데이션으로 채워지는 접근성 체크박스.
- 분류
- 컴포넌트
- 난이도
- easy
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/CheckboxDraw-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| defaultChecked | boolean | false | 비제어 모드의 초기 체크 상태. |
| label | string | "동의합니다" | 체크박스 옆에 표시되고 aria-labelledby로 연결되는 라벨 텍스트. |
| size | "sm" | "md" | "lg" | "md" | 박스/라벨/스트로크 크기 프리셋. |
| drawDuration | number | 420 | 체크마크 stroke 드로잉 애니메이션 길이(ms). |
| disabled | boolean | false | 비활성화 여부(클릭/키보드 토글 차단). |