아이콘 버튼
툴바처럼 밀도가 높은 영역의 익숙한 액션에 사용한다. label이 필수라 아이콘만 보여도 접근 가능한 이름을 항상 제공한다.
상태
default
invisible
danger
disabled
활용 방법
Compact toolbar
의미가 익숙하지 않은 액션에는 텍스트 Button을 사용한다.
Preview
tsx
<IconButton icon={<Star />} label="Star repository" />
속성
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| icon | ReactNode | - | 필수 아이콘 |
| label | string | - | 필수 접근성 이름과 native tooltip |
| variant | "default" | "primary" | "danger" | "invisible" | "default" | |
| size | "small" | "medium" | "large" | "medium" |