Media Player

PlayerContainer

Container component for the player with fullscreen support

PlayerContainer

A container component that handles fullscreen functionality and provides the player wrapper.

Props

Prop

Type

Usage

import { 
  MediaProvider,
  PlayerProvider, 
  PlayerContainer, 
  ShakaVideo,
  DefaultControls
} from '@shelby-protocol/player'

function CustomPlayer() {
  return (
    <MediaProvider>
      <PlayerProvider>
        <PlayerContainer className="rounded-lg overflow-hidden">
          <ShakaVideo
            src="https://example.com/video.m3u8"
            poster="https://example.com/poster.jpg"
            className="w-full"
          />
          <DefaultControls title="My Video" />
        </PlayerContainer>
      </PlayerProvider>
    </MediaProvider>
  )
}