{
  "name": "media-player-hls-demo",
  "type": "registry:example",
  "dependencies": [
    "lucide-react",
    "media-chrome",
    "@mux/mux-video-react"
  ],
  "registryDependencies": [
    "button",
    "media-player",
    "select",
    "slider",
    "tooltip"
  ],
  "files": [
    {
      "path": "examples/media-player-hls-demo.tsx",
      "type": "registry:example",
      "content": "import MuxVideo from \"@mux/mux-video-react\";\n\nimport {\n  MediaPlayer,\n  MediaPlayerCaptions,\n  MediaPlayerControls,\n  MediaPlayerControlsOverlay,\n  MediaPlayerError,\n  MediaPlayerFullscreen,\n  MediaPlayerLoading,\n  MediaPlayerPiP,\n  MediaPlayerPlay,\n  MediaPlayerSeek,\n  MediaPlayerSeekBackward,\n  MediaPlayerSeekForward,\n  MediaPlayerSettings,\n  MediaPlayerTime,\n  MediaPlayerVideo,\n  MediaPlayerVolume,\n  MediaPlayerVolumeIndicator,\n} from \"@/registry/bases/radix/ui/media-player\";\n\nexport default function MediaPlayerHlsDemo() {\n  return (\n    <MediaPlayer\n      className=\"[&_video]:size-full [&_video]:object-cover\"\n      autoHide\n    >\n      <MediaPlayerVideo asChild>\n        <MuxVideo playbackId=\"A3VXy02VoUinw01pwyomEO3bHnG4P32xzV7u1j1FSzjNg\" />\n      </MediaPlayerVideo>\n      <MediaPlayerLoading />\n      <MediaPlayerError />\n      <MediaPlayerVolumeIndicator />\n      <MediaPlayerControls className=\"flex-col items-start gap-2.5\">\n        <MediaPlayerControlsOverlay />\n        <MediaPlayerSeek />\n        <div className=\"flex w-full items-center gap-2\">\n          <div className=\"flex flex-1 items-center gap-2\">\n            <MediaPlayerPlay />\n            <MediaPlayerSeekBackward />\n            <MediaPlayerSeekForward />\n            <MediaPlayerVolume expandable />\n            <MediaPlayerTime />\n          </div>\n          <div className=\"flex items-center gap-2\">\n            <MediaPlayerCaptions />\n            <MediaPlayerSettings />\n            <MediaPlayerPiP />\n            <MediaPlayerFullscreen />\n          </div>\n        </div>\n      </MediaPlayerControls>\n    </MediaPlayer>\n  );\n}\n",
      "target": ""
    }
  ]
}