사용법
음악 상태를 켜고 끄면 아이콘과 이퀄라이저가 함께 반응해요.
인터페이스
MusicToggleButtonProps
| 속성 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| playing | boolean | — | 제어 재생 상태 |
| defaultPlaying | boolean | false | 초기 재생 상태 |
| onPlayingChange | (playing: boolean) => void | — | 재생 상태 변경 콜백 |
| playingIcon* | ReactNode | — | 재생 중 아이콘 |
| mutedIcon* | ReactNode | — | 음소거 아이콘 |
| playLabel | string | 음악 재생 | 재생 접근성 라벨 |
| muteLabel | string | 음악 끄기 | 음소거 접근성 라벨 |
| className | string | — | 루트 클래스 |
| style | CSSProperties | — | 인라인 스타일·CSS 변수 |
MusicToggleButton 컴포넌트 Props 표
가져오기
모션 CSS는 @goldtreedev/ui/motion.css를 함께 import해요.
@import "@goldtreedev/ui/motion.css";
import { MusicToggleButton } from "@goldtreedev/ui";