컴포넌트
ToggleIos
드래그하면 손가락을 따라 노브가 움직이고 놓으면 가까운 쪽으로 스냅되는, 탄성 스퀴시 표현이 들어간 iOS 스타일 토글 스위치.
- 분류
- 컴포넌트
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/ToggleIos-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| defaultChecked | boolean | false | 비제어 모드에서의 초기 켜짐/꺼짐 상태. |
| checked | boolean | undefined | 제어 모드로 쓸 때의 현재 상태값(지정 시 비제어 내부 상태 대신 사용). |
| onChange | (checked: boolean) => void | undefined | 상태가 실제로 바뀔 때 새 boolean 값과 함께 호출되는 콜백. |
| disabled | boolean | false | true면 드래그/클릭/키보드 토글을 모두 막고 흐리게 표시. |
| size | "sm" | "md" | "lg" | "md" | 트랙/노브 크기 프리셋. |
| label | string | "iOS 토글" | 스크린리더용 접근성 라벨(aria-labelledby로 연결). |