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 | Description |
|---|---|---|
className | string | Additional CSS classes for the container |
children | ReactNode | Child components (video and controls) |
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>
)
}