1000 songs in your app.

import { IPod } from "ipod-simulator/react";
import {
  defaultSongs, defaultPlaylists,
  type Song, type Playlist,
} from "ipod-simulator";

const songs: Song[] = [...defaultSongs, {
  id: "my-song",
  name: "My song",
  artistName: "My artist",
  previewUrl: "/music/my-song.mp3",
}];

const playlists: Playlist[] = [...defaultPlaylists, {
  id: "favorites",
  name: "Favorites",
  songIds: ["my-song"],
}];

export default function App() {
  return <IPod songs={songs} playlists={playlists} />;
}

Independent project. Not affiliated with or endorsed by Apple.

<ipod-simulator></ipod-simulator>

<script type="module">
  import { createIPod, defaultSongs, defaultPlaylists } from
    "https://cdn.jsdelivr.net/npm/ipod-simulator@latest/dist/index.js";

  const element = document.querySelector("ipod-simulator");
  const ipod = await createIPod(element, {
    songs: [...defaultSongs, {
      id: "my-song",
      name: "My song",
      artistName: "My artist",
      previewUrl: "/music/my-song.mp3",
    }],
    playlists: [...defaultPlaylists, {
      id: "favorites",
      name: "Favorites",
      songIds: ["my-song"],
    }],
  });
</script>

Independent project. Not affiliated with or endorsed by Apple.