Quick Start

Usage

import { Jukebox } from "react-youtube-jukebox"; const tracks = [  { videoId: "yTg4v2Cnfyo", title: "Soul Below", artist: "Ljones" },  { videoId: "s4MQku9Mkwc", title: "Something About Us", artist: "Daft Punk" },]; export function App() {  return <Jukebox tracks={tracks} />;}

By default the first track starts automatically in a muted state. Pass "autoplay={false}" when you want manual playback.

Positioning

Default behavior is a viewport portal render. Use "position" to pin the jukebox to one of the available edge presets.

<Jukebox tracks={tracks} position="top-left" offset={{ x: 20, y: 20 }} />

Use "portal={false}" only when you want inline rendering inside a positioned container.