VideoPlayer
A styled, reusable video player: an object-contain
video on a black stage with the on-theme VideoControls (auto-hiding
while playing). Used on its own (e.g. clip preview) so a plain video matches
the player's look instead of the unstyled native controls, and composed by
the player feature, which layers its subtitle overlay on top via overlay.
Interfaces¶
VideoPlayerOverlayContext¶
Defined in: src/shared/components/VideoPlayer.tsx:14
Context passed to a VideoPlayerProps.overlay render function.
Properties¶
| Property | Type | Description | Defined in |
|---|---|---|---|
controlsShown |
boolean |
Whether the control bar is currently shown (overlays lift above it). | src/shared/components/VideoPlayer.tsx:16 |
VideoPlayerProps¶
Defined in: src/shared/components/VideoPlayer.tsx:19
Properties¶
| Property | Type | Description | Defined in |
|---|---|---|---|
className? |
string |
Container (sizing) classes; defaults to a 16:9 box. | src/shared/components/VideoPlayer.tsx:22 |
crossOrigin? |
"" | "anonymous" | "use-credentials" |
crossOrigin for the <video> (needed to record cross-origin media). |
src/shared/components/VideoPlayer.tsx:26 |
id? |
string |
id for the <video> (the player uses it to record clips). |
src/shared/components/VideoPlayer.tsx:24 |
keyboardControls? |
boolean |
Toggle play/pause on the spacebar (for the primary, on-page player). | src/shared/components/VideoPlayer.tsx:30 |
onVideoEl? |
(el) => void |
Receives the <video> element as it mounts / unmounts. |
src/shared/components/VideoPlayer.tsx:28 |
overlay? |
(ctx) => ReactNode |
Renders an overlay above the video (e.g. subtitles). | src/shared/components/VideoPlayer.tsx:32 |
src |
string | null | undefined |
- | src/shared/components/VideoPlayer.tsx:20 |
Functions¶
VideoPlayer()¶
Defined in: src/shared/components/VideoPlayer.tsx:41
The VideoPlayer component.
Parameters¶
| Parameter | Type | Description |
|---|---|---|
props |
VideoPlayerProps |
The player props. |
Returns¶
Element
The styled video player.