components / transport
transport.
playback controls — skip, play/pause, shuffle and repeat. every control appears only when handed a callback, so the same component covers a full player and a listen-only page with nothing but a play button. repeat cycles off → all → one and announces the mode it moves to.
full
paused · shuffle off · repeat off
play only, three sizes
buffering / disabled
installation
bunx @justin06lee/chrome@latest add transportprops
| name | type | default | description |
|---|---|---|---|
| playing * | boolean | - | |
| onPlayPause * | () => void | - | |
| onPrevious | () => void | - | omit and the button doesn't render. |
| onNext | () => void | - | omit and the button doesn't render. |
| shuffle | boolean | - | pass with onShuffleChange to show the toggle. |
| onShuffleChange | (next: boolean) => void | - | |
| repeat | 'off' | 'all' | 'one' | 'off' | pass with onRepeatChange to show the toggle. |
| onRepeatChange | (next: RepeatMode) => void | - | |
| loading | boolean | false | spinner in place of the play glyph — buffering, or waiting on a remote. |
| size | 'sm' | 'md' | 'lg' | 'md' | |
| disabled | boolean | false | |
| className | string | - |