{
"components": [],
"elements": [],
"react": [
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/announcer.tsx"
},
"name": "MediaAnnouncer",
"displayName": "MediaAnnouncer",
"doctags": [
{
"name": "docs",
"text": "https://www.vidstack.io/docs/player/components/display/announcer"
},
{
"name": "example",
"text": "```tsx\n\n```"
}
],
"instance": "MediaAnnouncerInstance",
"attributes": "HTMLAttributes",
"propsType": "MediaAnnouncerProps",
"ref": {
"type": {
"primitive": "object",
"concise": "HTMLElement",
"full": "HTMLElement"
}
}
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/audio-layout.tsx"
},
"name": "DefaultAudioLayout",
"displayName": "DefaultAudioLayout",
"docs": "The audio layout is our production-ready UI that's displayed when the media view type is set to\n'audio'. It includes support for audio tracks, slider chapters, captions, live streams\nand more out of the box.",
"doctags": [
{
"name": "attr",
"text": "data-match - Whether this layout is being used."
},
{
"name": "attr",
"text": "data-sm - The small layout is active"
},
{
"name": "attr",
"text": "data-lg - The large layout is active."
},
{
"name": "attr",
"text": "data-size - The active layout size (sm or lg)."
},
{
"name": "example",
"text": "```tsx\n\n \n \n\n```"
}
],
"attributes": "RefAttributes",
"props": [
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
},
{
"name": "icons",
"type": {
"primitive": "object",
"concise": "DefaultLayoutIcons",
"full": "DefaultLayoutIcons"
},
"docs": "The icons to be rendered and displayed inside the layout."
},
{
"name": "colorScheme",
"type": {
"primitive": "string",
"concise": "'light' | 'dark' | 'system' | 'default'",
"full": "'light' | 'dark' | 'system' | 'default'"
},
"docs": "Whether light or dark color theme should be active. Defaults to user operating system\npreference.",
"doctags": [
{
"name": "see",
"text": "https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme"
}
]
},
{
"name": "download",
"type": {
"primitive": "mixed",
"concise": "FileDownloadInfo",
"full": "string | boolean | { url: string; filename: string; }"
},
"docs": "Sets the download URL and filename for the download button."
},
{
"name": "showTooltipDelay",
"default": "700",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "Specifies the number of milliseconds to wait before tooltips are visible after interacting\nwith a control."
},
{
"name": "showMenuDelay",
"default": "0",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "Specifies the number of milliseconds to wait before menus are visible after opening them."
},
{
"name": "hideQualityBitrate",
"default": "false",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether the bitrate should be hidden in the settings quality menu next to each option."
},
{
"name": "smallLayoutWhen",
"default": "`({ width, height }) => width < 576 || height < 380`",
"type": {
"primitive": "boolean",
"concise": "boolean | MediaPlayerQuery",
"full": "boolean | MediaPlayerQuery"
},
"docs": "Determines when the small (e.g., mobile) UI should be displayed."
},
{
"name": "thumbnails",
"type": {
"primitive": "string",
"concise": "ThumbnailSrc",
"full": "string | ThumbnailImageInit[] | ThumbnailStoryboard | MuxThumbnailStoryboard"
},
"docs": "The thumbnails resource.",
"doctags": [
{
"name": "see",
"text": "https://www.vidstack.io/docs/wc/player/core-concepts/loading#thumbnails"
}
]
},
{
"name": "translations",
"type": {
"primitive": "object",
"concise": "Partial",
"full": "{ Announcements?: string; Accessibility?: string; AirPlay?: string; Audio?: string; Auto?: string; Boost?: string; Captions?: string; \"Caption Styles\"?: string; \"Captions look like this\"?: string; Chapters?: string; \"Closed-Captions Off\"?: string; \"Closed-Captions On\"?: string; Connected?: string; Continue?: string; Connecting?: string; Default?: string; Disabled?: string; Disconnected?: string; \"Display Background\"?: string; Download?: string; \"Enter Fullscreen\"?: string; \"Enter PiP\"?: string; \"Exit Fullscreen\"?: string; \"Exit PiP\"?: string; Font?: string; Family?: string; Fullscreen?: string; \"Google Cast\"?: string; \"Keyboard Animations\"?: string; LIVE?: string; Loop?: string; Mute?: string; Normal?: string; Off?: string; Pause?: string; Play?: string; Playback?: string; PiP?: string; Quality?: string; Replay?: string; Reset?: string; \"Seek Backward\"?: string; \"Seek Forward\"?: string; Seek?: string; Settings?: string; \"Skip To Live\"?: string; Speed?: string; Size?: string; Color?: string; Opacity?: string; Shadow?: string; Text?: string; \"Text Background\"?: string; Track?: string; Unmute?: string; Volume?: string; }"
},
"docs": "Translation map from english to your desired language for words used throughout the layout."
},
{
"name": "menuContainer",
"default": "`document.body`",
"type": {
"primitive": "string",
"concise": "string | HTMLElement",
"full": "string | HTMLElement"
},
"docs": "A document query selector string or `HTMLElement` to mount menus inside."
},
{
"name": "menuGroup",
"type": {
"primitive": "string",
"concise": "'top' | 'bottom'",
"full": "'top' | 'bottom'"
},
"docs": "Specifies whether menu buttons should be placed in the top or bottom controls group. This\nonly applies to the large video layout."
},
{
"name": "noAudioGain",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Disable audio boost slider in the settings menu."
},
{
"name": "audioGains",
"type": {
"primitive": "object",
"concise": "number[] | { min: number; max: number; step: number; }",
"full": "number[] | { min: number; max: number; step: number; }"
},
"docs": "The audio gain options to be displayed in the settings menu."
},
{
"name": "noModal",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether modal menus should be disabled when the small layout is active. A modal menu is\na floating panel that floats up from the bottom of the screen (outside of the player). It's\nenabled by default as it provides a better user experience for touch devices."
},
{
"name": "noScrubGesture",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether to disable scrubbing by touch swiping left or right on the player canvas."
},
{
"name": "sliderChaptersMinWidth",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "The minimum width of the slider to start displaying slider chapters when available."
},
{
"name": "disableTimeSlider",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether the time slider should be disabled."
},
{
"name": "noGestures",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether all gestures such as press to play or seek should not be active."
},
{
"name": "noKeyboardAnimations",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether keyboard actions should not be displayed."
},
{
"name": "playbackRates",
"type": {
"primitive": "object",
"concise": "number[] | { min: number; max: number; step: number; }",
"full": "number[] | { min: number; max: number; step: number; }"
},
"docs": "The playback rate options to be displayed in the settings menu."
},
{
"name": "seekStep",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "The number of seconds to seek forward or backward when pressing the seek button or using\nkeyboard shortcuts."
},
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "DefaultAudioLayoutSlots",
"full": "DefaultAudioLayoutSlots"
},
"docs": "Provide additional content to be inserted in specific positions."
},
{
"name": "asChild",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
}
],
"propsType": "DefaultAudioLayoutProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/audio-layout.tsx"
},
"name": "AudioLayout",
"displayName": "AudioLayout"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/audio-layout.tsx"
},
"name": "DefaultAudioMenus",
"displayName": "DefaultAudioMenus",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "Slots",
"full": "{ chaptersMenu?: ReactNode; settingsMenu?: ReactNode; settingsMenuStartItems?: ReactNode; settingsMenuEndItems?: ReactNode; settingsMenuItemsStart?: ReactNode; settingsMenuItemsEnd?: ReactNode; playbackMenuItemsStart?: ReactNode; playbackMenuItemsEnd?: ReactNode; playbackMenuLoop?: ReactNode; accessibilityMenuItemsStart?: ReactNode; accessibilityMenuItemsEnd?: ReactNode; audioMenuItemsStart?: ReactNode; audioMenuItemsEnd?: ReactNode; captionsMenuItemsStart?: ReactNode; captionsMenuItemsEnd?: ReactNode; beforeChaptersMenu?: ReactNode; beforeSettingsMenu?: ReactNode; beforeSettingsMenuStartItems?: ReactNode; beforeSettingsMenuEndItems?: ReactNode; beforeSettingsMenuItemsStart?: ReactNode; beforeSettingsMenuItemsEnd?: ReactNode; beforePlaybackMenuItemsStart?: ReactNode; beforePlaybackMenuItemsEnd?: ReactNode; beforePlaybackMenuLoop?: ReactNode; beforeAccessibilityMenuItemsStart?: ReactNode; beforeAccessibilityMenuItemsEnd?: ReactNode; beforeAudioMenuItemsStart?: ReactNode; beforeAudioMenuItemsEnd?: ReactNode; beforeCaptionsMenuItemsStart?: ReactNode; beforeCaptionsMenuItemsEnd?: ReactNode; afterChaptersMenu?: ReactNode; afterSettingsMenu?: ReactNode; afterSettingsMenuStartItems?: ReactNode; afterSettingsMenuEndItems?: ReactNode; afterSettingsMenuItemsStart?: ReactNode; afterSettingsMenuItemsEnd?: ReactNode; afterPlaybackMenuItemsStart?: ReactNode; afterPlaybackMenuItemsEnd?: ReactNode; afterPlaybackMenuLoop?: ReactNode; afterAccessibilityMenuItemsStart?: ReactNode; afterAccessibilityMenuItemsEnd?: ReactNode; afterAudioMenuItemsStart?: ReactNode; afterAudioMenuItemsEnd?: ReactNode; afterCaptionsMenuItemsStart?: ReactNode; afterCaptionsMenuItemsEnd?: ReactNode; }"
}
}
],
"propsType": "{ slots?: Slots; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/audio-layout.tsx"
},
"name": "DefaultAudioTitle",
"displayName": "DefaultAudioTitle"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/audio-layout.tsx"
},
"name": "AudioTitle",
"displayName": "AudioTitle",
"props": [
{
"name": "title",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "chapterTitle",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
}
],
"propsType": "{ title: string; chapterTitle: string; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/announcer.tsx"
},
"name": "DefaultAnnouncer",
"displayName": "DefaultAnnouncer"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultPlayButton",
"displayName": "DefaultPlayButton",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
}
],
"propsType": "DefaultMediaButtonProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultMuteButton",
"displayName": "DefaultMuteButton",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
}
],
"propsType": "DefaultMediaButtonProps",
"ref": {
"type": {
"primitive": "object",
"concise": "HTMLButtonElement",
"full": "HTMLButtonElement"
}
}
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultCaptionButton",
"displayName": "DefaultCaptionButton",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
}
],
"propsType": "DefaultMediaButtonProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultPIPButton",
"displayName": "DefaultPIPButton",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
}
],
"propsType": "DefaultMediaButtonProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultFullscreenButton",
"displayName": "DefaultFullscreenButton",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
}
],
"propsType": "DefaultMediaButtonProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultSeekButton",
"displayName": "DefaultSeekButton",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
},
{
"name": "backward",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
}
],
"propsType": "DefaultMediaButtonProps & { backward?: boolean; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultAirPlayButton",
"displayName": "DefaultAirPlayButton",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
}
],
"propsType": "DefaultMediaButtonProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultGoogleCastButton",
"displayName": "DefaultGoogleCastButton",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
}
],
"propsType": "DefaultMediaButtonProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultLiveButton",
"displayName": "DefaultLiveButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/buttons.tsx"
},
"name": "DefaultDownloadButton",
"displayName": "DefaultDownloadButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/captions.tsx"
},
"name": "DefaultCaptions",
"displayName": "DefaultCaptions"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/controls.tsx"
},
"name": "DefaultControlsSpacer",
"displayName": "DefaultControlsSpacer"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/keyboard-display.tsx"
},
"name": "DefaultKeyboardDisplay",
"displayName": "DefaultKeyboardDisplay",
"attributes": "RefAttributes",
"props": [
{
"name": "icons",
"type": {
"primitive": "object",
"concise": "Partial",
"full": "{ Play?: DefaultLayoutIcon; Pause?: DefaultLayoutIcon; Mute?: DefaultLayoutIcon; VolumeUp?: DefaultLayoutIcon; VolumeDown?: DefaultLayoutIcon; EnterFullscreen?: DefaultLayoutIcon; ExitFullscreen?: DefaultLayoutIcon; EnterPiP?: DefaultLayoutIcon; ExitPiP?: DefaultLayoutIcon; CaptionsOn?: DefaultLayoutIcon; CaptionsOff?: DefaultLayoutIcon; SeekForward?: DefaultLayoutIcon; SeekBackward?: DefaultLayoutIcon; }"
}
},
{
"name": "asChild",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
}
],
"propsType": "DefaultKeyboardDisplayProps",
"ref": {
"type": {
"primitive": "object",
"concise": "HTMLElement",
"full": "HTMLElement"
}
}
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/accessibility-menu.tsx"
},
"name": "DefaultAccessibilityMenu",
"displayName": "DefaultAccessibilityMenu",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "Slots",
"full": "{ chaptersMenu?: ReactNode; settingsMenu?: ReactNode; settingsMenuStartItems?: ReactNode; settingsMenuEndItems?: ReactNode; settingsMenuItemsStart?: ReactNode; settingsMenuItemsEnd?: ReactNode; playbackMenuItemsStart?: ReactNode; playbackMenuItemsEnd?: ReactNode; playbackMenuLoop?: ReactNode; accessibilityMenuItemsStart?: ReactNode; accessibilityMenuItemsEnd?: ReactNode; audioMenuItemsStart?: ReactNode; audioMenuItemsEnd?: ReactNode; captionsMenuItemsStart?: ReactNode; captionsMenuItemsEnd?: ReactNode; beforeChaptersMenu?: ReactNode; beforeSettingsMenu?: ReactNode; beforeSettingsMenuStartItems?: ReactNode; beforeSettingsMenuEndItems?: ReactNode; beforeSettingsMenuItemsStart?: ReactNode; beforeSettingsMenuItemsEnd?: ReactNode; beforePlaybackMenuItemsStart?: ReactNode; beforePlaybackMenuItemsEnd?: ReactNode; beforePlaybackMenuLoop?: ReactNode; beforeAccessibilityMenuItemsStart?: ReactNode; beforeAccessibilityMenuItemsEnd?: ReactNode; beforeAudioMenuItemsStart?: ReactNode; beforeAudioMenuItemsEnd?: ReactNode; beforeCaptionsMenuItemsStart?: ReactNode; beforeCaptionsMenuItemsEnd?: ReactNode; afterChaptersMenu?: ReactNode; afterSettingsMenu?: ReactNode; afterSettingsMenuStartItems?: ReactNode; afterSettingsMenuEndItems?: ReactNode; afterSettingsMenuItemsStart?: ReactNode; afterSettingsMenuItemsEnd?: ReactNode; afterPlaybackMenuItemsStart?: ReactNode; afterPlaybackMenuItemsEnd?: ReactNode; afterPlaybackMenuLoop?: ReactNode; afterAccessibilityMenuItemsStart?: ReactNode; afterAccessibilityMenuItemsEnd?: ReactNode; afterAudioMenuItemsStart?: ReactNode; afterAudioMenuItemsEnd?: ReactNode; afterCaptionsMenuItemsStart?: ReactNode; afterCaptionsMenuItemsEnd?: ReactNode; }"
}
}
],
"propsType": "DefaultAccessibilityMenuProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/accessibility-menu.tsx"
},
"name": "DefaultAnnouncementsMenuCheckbox",
"displayName": "DefaultAnnouncementsMenuCheckbox"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/accessibility-menu.tsx"
},
"name": "DefaultKeyboardAnimationsMenuCheckbox",
"displayName": "DefaultKeyboardAnimationsMenuCheckbox"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/audio-menu.tsx"
},
"name": "DefaultAudioMenu",
"displayName": "DefaultAudioMenu",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "Slots",
"full": "{ chaptersMenu?: ReactNode; settingsMenu?: ReactNode; settingsMenuStartItems?: ReactNode; settingsMenuEndItems?: ReactNode; settingsMenuItemsStart?: ReactNode; settingsMenuItemsEnd?: ReactNode; playbackMenuItemsStart?: ReactNode; playbackMenuItemsEnd?: ReactNode; playbackMenuLoop?: ReactNode; accessibilityMenuItemsStart?: ReactNode; accessibilityMenuItemsEnd?: ReactNode; audioMenuItemsStart?: ReactNode; audioMenuItemsEnd?: ReactNode; captionsMenuItemsStart?: ReactNode; captionsMenuItemsEnd?: ReactNode; beforeChaptersMenu?: ReactNode; beforeSettingsMenu?: ReactNode; beforeSettingsMenuStartItems?: ReactNode; beforeSettingsMenuEndItems?: ReactNode; beforeSettingsMenuItemsStart?: ReactNode; beforeSettingsMenuItemsEnd?: ReactNode; beforePlaybackMenuItemsStart?: ReactNode; beforePlaybackMenuItemsEnd?: ReactNode; beforePlaybackMenuLoop?: ReactNode; beforeAccessibilityMenuItemsStart?: ReactNode; beforeAccessibilityMenuItemsEnd?: ReactNode; beforeAudioMenuItemsStart?: ReactNode; beforeAudioMenuItemsEnd?: ReactNode; beforeCaptionsMenuItemsStart?: ReactNode; beforeCaptionsMenuItemsEnd?: ReactNode; afterChaptersMenu?: ReactNode; afterSettingsMenu?: ReactNode; afterSettingsMenuStartItems?: ReactNode; afterSettingsMenuEndItems?: ReactNode; afterSettingsMenuItemsStart?: ReactNode; afterSettingsMenuItemsEnd?: ReactNode; afterPlaybackMenuItemsStart?: ReactNode; afterPlaybackMenuItemsEnd?: ReactNode; afterPlaybackMenuLoop?: ReactNode; afterAccessibilityMenuItemsStart?: ReactNode; afterAccessibilityMenuItemsEnd?: ReactNode; afterAudioMenuItemsStart?: ReactNode; afterAudioMenuItemsEnd?: ReactNode; afterCaptionsMenuItemsStart?: ReactNode; afterCaptionsMenuItemsEnd?: ReactNode; }"
}
}
],
"propsType": "DefaultAudioMenuProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/audio-menu.tsx"
},
"name": "DefaultAudioBoostMenuSection",
"displayName": "DefaultAudioBoostMenuSection"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/audio-menu.tsx"
},
"name": "DefaultAudioGainSlider",
"displayName": "DefaultAudioGainSlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/audio-menu.tsx"
},
"name": "DefaultAudioTracksMenu",
"displayName": "DefaultAudioTracksMenu"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/captions-menu.tsx"
},
"name": "DefaultCaptionMenu",
"displayName": "DefaultCaptionMenu",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "Slots",
"full": "{ chaptersMenu?: ReactNode; settingsMenu?: ReactNode; settingsMenuStartItems?: ReactNode; settingsMenuEndItems?: ReactNode; settingsMenuItemsStart?: ReactNode; settingsMenuItemsEnd?: ReactNode; playbackMenuItemsStart?: ReactNode; playbackMenuItemsEnd?: ReactNode; playbackMenuLoop?: ReactNode; accessibilityMenuItemsStart?: ReactNode; accessibilityMenuItemsEnd?: ReactNode; audioMenuItemsStart?: ReactNode; audioMenuItemsEnd?: ReactNode; captionsMenuItemsStart?: ReactNode; captionsMenuItemsEnd?: ReactNode; beforeChaptersMenu?: ReactNode; beforeSettingsMenu?: ReactNode; beforeSettingsMenuStartItems?: ReactNode; beforeSettingsMenuEndItems?: ReactNode; beforeSettingsMenuItemsStart?: ReactNode; beforeSettingsMenuItemsEnd?: ReactNode; beforePlaybackMenuItemsStart?: ReactNode; beforePlaybackMenuItemsEnd?: ReactNode; beforePlaybackMenuLoop?: ReactNode; beforeAccessibilityMenuItemsStart?: ReactNode; beforeAccessibilityMenuItemsEnd?: ReactNode; beforeAudioMenuItemsStart?: ReactNode; beforeAudioMenuItemsEnd?: ReactNode; beforeCaptionsMenuItemsStart?: ReactNode; beforeCaptionsMenuItemsEnd?: ReactNode; afterChaptersMenu?: ReactNode; afterSettingsMenu?: ReactNode; afterSettingsMenuStartItems?: ReactNode; afterSettingsMenuEndItems?: ReactNode; afterSettingsMenuItemsStart?: ReactNode; afterSettingsMenuItemsEnd?: ReactNode; afterPlaybackMenuItemsStart?: ReactNode; afterPlaybackMenuItemsEnd?: ReactNode; afterPlaybackMenuLoop?: ReactNode; afterAccessibilityMenuItemsStart?: ReactNode; afterAccessibilityMenuItemsEnd?: ReactNode; afterAudioMenuItemsStart?: ReactNode; afterAudioMenuItemsEnd?: ReactNode; afterCaptionsMenuItemsStart?: ReactNode; afterCaptionsMenuItemsEnd?: ReactNode; }"
}
}
],
"propsType": "DefaultCaptionMenuProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/chapters-menu.tsx"
},
"name": "DefaultChaptersMenu",
"displayName": "DefaultChaptersMenu",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
},
{
"name": "placement",
"type": {
"primitive": "string",
"concise": "MenuPlacement",
"full": "'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end' | MenuPlacementSide"
}
},
{
"name": "portalClass",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "Slots",
"full": "{ chaptersMenu?: ReactNode; settingsMenu?: ReactNode; settingsMenuStartItems?: ReactNode; settingsMenuEndItems?: ReactNode; settingsMenuItemsStart?: ReactNode; settingsMenuItemsEnd?: ReactNode; playbackMenuItemsStart?: ReactNode; playbackMenuItemsEnd?: ReactNode; playbackMenuLoop?: ReactNode; accessibilityMenuItemsStart?: ReactNode; accessibilityMenuItemsEnd?: ReactNode; audioMenuItemsStart?: ReactNode; audioMenuItemsEnd?: ReactNode; captionsMenuItemsStart?: ReactNode; captionsMenuItemsEnd?: ReactNode; beforeChaptersMenu?: ReactNode; beforeSettingsMenu?: ReactNode; beforeSettingsMenuStartItems?: ReactNode; beforeSettingsMenuEndItems?: ReactNode; beforeSettingsMenuItemsStart?: ReactNode; beforeSettingsMenuItemsEnd?: ReactNode; beforePlaybackMenuItemsStart?: ReactNode; beforePlaybackMenuItemsEnd?: ReactNode; beforePlaybackMenuLoop?: ReactNode; beforeAccessibilityMenuItemsStart?: ReactNode; beforeAccessibilityMenuItemsEnd?: ReactNode; beforeAudioMenuItemsStart?: ReactNode; beforeAudioMenuItemsEnd?: ReactNode; beforeCaptionsMenuItemsStart?: ReactNode; beforeCaptionsMenuItemsEnd?: ReactNode; afterChaptersMenu?: ReactNode; afterSettingsMenu?: ReactNode; afterSettingsMenuStartItems?: ReactNode; afterSettingsMenuEndItems?: ReactNode; afterSettingsMenuItemsStart?: ReactNode; afterSettingsMenuItemsEnd?: ReactNode; afterPlaybackMenuItemsStart?: ReactNode; afterPlaybackMenuItemsEnd?: ReactNode; afterPlaybackMenuLoop?: ReactNode; afterAccessibilityMenuItemsStart?: ReactNode; afterAccessibilityMenuItemsEnd?: ReactNode; afterAudioMenuItemsStart?: ReactNode; afterAudioMenuItemsEnd?: ReactNode; afterCaptionsMenuItemsStart?: ReactNode; afterCaptionsMenuItemsEnd?: ReactNode; }"
}
}
],
"propsType": "DefaultMediaMenuProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultFontMenu",
"displayName": "DefaultFontMenu"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultFontFamilyMenu",
"displayName": "DefaultFontFamilyMenu"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultFontSizeSlider",
"displayName": "DefaultFontSizeSlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultTextColorInput",
"displayName": "DefaultTextColorInput"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultTextOpacitySlider",
"displayName": "DefaultTextOpacitySlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultTextShadowMenu",
"displayName": "DefaultTextShadowMenu"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultTextBgInput",
"displayName": "DefaultTextBgInput"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultTextBgOpacitySlider",
"displayName": "DefaultTextBgOpacitySlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultDisplayBgInput",
"displayName": "DefaultDisplayBgInput"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultDisplayBgOpacitySlider",
"displayName": "DefaultDisplayBgOpacitySlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultFontSetting",
"displayName": "DefaultFontSetting",
"propsType": "DefaultFontSettingProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultFontRadioGroup",
"displayName": "DefaultFontRadioGroup",
"props": [
{
"name": "id",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "label",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "value",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "values",
"type": {
"primitive": "any",
"concise": "FontRadioOption",
"full": "FontRadioOption"
}
}
],
"propsType": "DefaultFontRadioGroupProps",
"callbacks": [
{
"name": "onChange",
"type": {
"primitive": "function",
"concise": "(value: string) => void",
"full": "(value: string) => void"
},
"parameters": [
{
"name": "value",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
}
]
}
]
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/font-menu.tsx"
},
"name": "DefaultResetMenuItem",
"displayName": "DefaultResetMenuItem"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/items/menu-checkbox.tsx"
},
"name": "DefaultMenuCheckbox",
"displayName": "DefaultMenuCheckbox",
"props": [
{
"name": "label",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "checked",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
},
{
"name": "storageKey",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "defaultChecked",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
}
],
"propsType": "DefaultMenuCheckboxProps",
"callbacks": [
{
"name": "onChange",
"type": {
"primitive": "function",
"concise": "(checked: boolean, trigger?: Event) => void",
"full": "(checked: boolean, trigger?: Event) => void"
},
"parameters": [
{
"name": "checked",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
},
{
"name": "trigger",
"type": {
"primitive": "object",
"concise": "Event",
"full": "Event"
}
}
]
}
]
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/items/menu-items.tsx"
},
"name": "DefaultMenuSection",
"displayName": "DefaultMenuSection",
"props": [
{
"name": "label",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "value",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "DefaultMenuSectionProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/items/menu-items.tsx"
},
"name": "DefaultMenuButton",
"displayName": "DefaultMenuButton",
"props": [
{
"name": "label",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "hint",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "disabled",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
},
{
"name": "Icon",
"type": {
"primitive": "function",
"concise": "DefaultLayoutIcon",
"full": "DefaultLayoutIcon"
}
}
],
"propsType": "DefaultMenuButtonProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/items/menu-items.tsx"
},
"name": "DefaultMenuItem",
"displayName": "DefaultMenuItem",
"props": [
{
"name": "label",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "DefaultMenuItemProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/items/menu-items.tsx"
},
"name": "DefaultMenuRadioGroup",
"displayName": "DefaultMenuRadioGroup",
"props": [
{
"name": "value",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "options",
"type": {
"primitive": "object",
"concise": "{ label: string; value: string; }[]",
"full": "{ label: string; value: string; }[]"
}
}
],
"propsType": "DefaultMenuRadioGroupProps",
"callbacks": [
{
"name": "onChange",
"type": {
"primitive": "function",
"concise": "(newValue: string) => void",
"full": "(newValue: string) => void"
},
"parameters": [
{
"name": "newValue",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
}
]
}
]
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/items/menu-slider.tsx"
},
"name": "DefaultMenuSliderItem",
"displayName": "DefaultMenuSliderItem",
"props": [
{
"name": "label",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "value",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "UpIcon",
"type": {
"primitive": "function",
"concise": "DefaultLayoutIcon",
"full": "DefaultLayoutIcon"
}
},
{
"name": "DownIcon",
"type": {
"primitive": "function",
"concise": "DefaultLayoutIcon",
"full": "DefaultLayoutIcon"
}
},
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
},
{
"name": "isMin",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
},
{
"name": "isMax",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
}
],
"propsType": "DefaultMenuSliderItemProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/items/menu-slider.tsx"
},
"name": "DefaultSliderParts",
"displayName": "DefaultSliderParts"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/items/menu-slider.tsx"
},
"name": "DefaultSliderSteps",
"displayName": "DefaultSliderSteps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/playback-menu.tsx"
},
"name": "DefaultPlaybackMenu",
"displayName": "DefaultPlaybackMenu",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "Slots",
"full": "{ chaptersMenu?: ReactNode; settingsMenu?: ReactNode; settingsMenuStartItems?: ReactNode; settingsMenuEndItems?: ReactNode; settingsMenuItemsStart?: ReactNode; settingsMenuItemsEnd?: ReactNode; playbackMenuItemsStart?: ReactNode; playbackMenuItemsEnd?: ReactNode; playbackMenuLoop?: ReactNode; accessibilityMenuItemsStart?: ReactNode; accessibilityMenuItemsEnd?: ReactNode; audioMenuItemsStart?: ReactNode; audioMenuItemsEnd?: ReactNode; captionsMenuItemsStart?: ReactNode; captionsMenuItemsEnd?: ReactNode; beforeChaptersMenu?: ReactNode; beforeSettingsMenu?: ReactNode; beforeSettingsMenuStartItems?: ReactNode; beforeSettingsMenuEndItems?: ReactNode; beforeSettingsMenuItemsStart?: ReactNode; beforeSettingsMenuItemsEnd?: ReactNode; beforePlaybackMenuItemsStart?: ReactNode; beforePlaybackMenuItemsEnd?: ReactNode; beforePlaybackMenuLoop?: ReactNode; beforeAccessibilityMenuItemsStart?: ReactNode; beforeAccessibilityMenuItemsEnd?: ReactNode; beforeAudioMenuItemsStart?: ReactNode; beforeAudioMenuItemsEnd?: ReactNode; beforeCaptionsMenuItemsStart?: ReactNode; beforeCaptionsMenuItemsEnd?: ReactNode; afterChaptersMenu?: ReactNode; afterSettingsMenu?: ReactNode; afterSettingsMenuStartItems?: ReactNode; afterSettingsMenuEndItems?: ReactNode; afterSettingsMenuItemsStart?: ReactNode; afterSettingsMenuItemsEnd?: ReactNode; afterPlaybackMenuItemsStart?: ReactNode; afterPlaybackMenuItemsEnd?: ReactNode; afterPlaybackMenuLoop?: ReactNode; afterAccessibilityMenuItemsStart?: ReactNode; afterAccessibilityMenuItemsEnd?: ReactNode; afterAudioMenuItemsStart?: ReactNode; afterAudioMenuItemsEnd?: ReactNode; afterCaptionsMenuItemsStart?: ReactNode; afterCaptionsMenuItemsEnd?: ReactNode; }"
}
}
],
"propsType": "DefaultPlaybackMenuProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/playback-menu.tsx"
},
"name": "DefaultLoopMenuCheckbox",
"displayName": "DefaultLoopMenuCheckbox"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/playback-menu.tsx"
},
"name": "DefaultAutoQualityMenuCheckbox",
"displayName": "DefaultAutoQualityMenuCheckbox"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/playback-menu.tsx"
},
"name": "DefaultQualityMenuSection",
"displayName": "DefaultQualityMenuSection"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/playback-menu.tsx"
},
"name": "DefaultQualitySlider",
"displayName": "DefaultQualitySlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/playback-menu.tsx"
},
"name": "DefaultSpeedMenuSection"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/playback-menu.tsx"
},
"name": "DefaultSpeedSlider",
"displayName": "DefaultSpeedSlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/menus/settings-menu.tsx"
},
"name": "DefaultSettingsMenu",
"displayName": "DefaultSettingsMenu",
"props": [
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
},
{
"name": "placement",
"type": {
"primitive": "string",
"concise": "MenuPlacement",
"full": "'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end' | MenuPlacementSide"
}
},
{
"name": "portalClass",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "Slots",
"full": "{ chaptersMenu?: ReactNode; settingsMenu?: ReactNode; settingsMenuStartItems?: ReactNode; settingsMenuEndItems?: ReactNode; settingsMenuItemsStart?: ReactNode; settingsMenuItemsEnd?: ReactNode; playbackMenuItemsStart?: ReactNode; playbackMenuItemsEnd?: ReactNode; playbackMenuLoop?: ReactNode; accessibilityMenuItemsStart?: ReactNode; accessibilityMenuItemsEnd?: ReactNode; audioMenuItemsStart?: ReactNode; audioMenuItemsEnd?: ReactNode; captionsMenuItemsStart?: ReactNode; captionsMenuItemsEnd?: ReactNode; beforeChaptersMenu?: ReactNode; beforeSettingsMenu?: ReactNode; beforeSettingsMenuStartItems?: ReactNode; beforeSettingsMenuEndItems?: ReactNode; beforeSettingsMenuItemsStart?: ReactNode; beforeSettingsMenuItemsEnd?: ReactNode; beforePlaybackMenuItemsStart?: ReactNode; beforePlaybackMenuItemsEnd?: ReactNode; beforePlaybackMenuLoop?: ReactNode; beforeAccessibilityMenuItemsStart?: ReactNode; beforeAccessibilityMenuItemsEnd?: ReactNode; beforeAudioMenuItemsStart?: ReactNode; beforeAudioMenuItemsEnd?: ReactNode; beforeCaptionsMenuItemsStart?: ReactNode; beforeCaptionsMenuItemsEnd?: ReactNode; afterChaptersMenu?: ReactNode; afterSettingsMenu?: ReactNode; afterSettingsMenuStartItems?: ReactNode; afterSettingsMenuEndItems?: ReactNode; afterSettingsMenuItemsStart?: ReactNode; afterSettingsMenuItemsEnd?: ReactNode; afterPlaybackMenuItemsStart?: ReactNode; afterPlaybackMenuItemsEnd?: ReactNode; afterPlaybackMenuLoop?: ReactNode; afterAccessibilityMenuItemsStart?: ReactNode; afterAccessibilityMenuItemsEnd?: ReactNode; afterAudioMenuItemsStart?: ReactNode; afterAudioMenuItemsEnd?: ReactNode; afterCaptionsMenuItemsStart?: ReactNode; afterCaptionsMenuItemsEnd?: ReactNode; }"
}
}
],
"propsType": "DefaultMediaMenuProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/sliders.tsx"
},
"name": "DefaultVolumePopup",
"displayName": "DefaultVolumePopup",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "DefaultLayoutSlots",
"full": "DefaultLayoutSlots"
}
},
{
"name": "tooltip",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
},
{
"name": "orientation",
"type": {
"primitive": "string",
"concise": "SliderOrientation",
"full": "'horizontal' | 'vertical'"
}
}
],
"propsType": "DefaultVolumePopupProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/sliders.tsx"
},
"name": "DefaultVolumeSlider",
"displayName": "DefaultVolumeSlider",
"instance": "VolumeSliderInstance",
"attributes": "HTMLAttributes",
"props": [
{
"name": "asChild",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
},
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "RootProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/sliders.tsx"
},
"name": "DefaultTimeSlider",
"displayName": "DefaultTimeSlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/time.tsx"
},
"name": "DefaultTimeGroup",
"displayName": "DefaultTimeGroup",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "DefaultTimeGroupSlots",
"full": "DefaultTimeGroupSlots"
}
}
],
"propsType": "{ slots?: DefaultTimeGroupSlots; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/time.tsx"
},
"name": "DefaultTimeInfo",
"displayName": "DefaultTimeInfo",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "DefaultTimeInfoSlots",
"full": "DefaultTimeInfoSlots"
}
}
],
"propsType": "{ slots?: DefaultTimeInfoSlots; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/time.tsx"
},
"name": "DefaultTimeInvert",
"displayName": "DefaultTimeInvert",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "DefaultTimeInfoSlots",
"full": "DefaultTimeInfoSlots"
}
}
],
"propsType": "{ slots?: DefaultTimeInfoSlots; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/title.tsx"
},
"name": "DefaultTitle",
"displayName": "DefaultTitle"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/ui/tooltip.tsx"
},
"name": "DefaultTooltip",
"displayName": "DefaultTooltip",
"props": [
{
"name": "content",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "placement",
"type": {
"primitive": "string",
"concise": "TooltipPlacement",
"full": "TooltipPlacementSide | 'top center' | 'top start' | 'top end' | 'bottom center' | 'bottom start' | 'bottom end' | 'right center' | 'right start' | 'right end' | 'left center' | 'left start' | 'left end'"
}
},
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "DefaultTooltipProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "DefaultVideoLayout",
"displayName": "DefaultVideoLayout",
"docs": "The video layout is our production-ready UI that's displayed when the media view type is set to\n'video'. It includes support for picture-in-picture, fullscreen, slider chapters, slider\npreviews, captions, audio/quality settings, live streams, and more out of the box.",
"doctags": [
{
"name": "attr",
"text": "data-match - Whether this layout is being used."
},
{
"name": "attr",
"text": "data-sm - The small layout is active"
},
{
"name": "attr",
"text": "data-lg - The large layout is active."
},
{
"name": "attr",
"text": "data-size - The active layout size (sm or lg)."
},
{
"name": "example",
"text": "```tsx\n\n \n \n\n```"
}
],
"attributes": "RefAttributes",
"props": [
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
},
{
"name": "icons",
"type": {
"primitive": "object",
"concise": "DefaultLayoutIcons",
"full": "DefaultLayoutIcons"
},
"docs": "The icons to be rendered and displayed inside the layout."
},
{
"name": "colorScheme",
"type": {
"primitive": "string",
"concise": "'light' | 'dark' | 'system' | 'default'",
"full": "'light' | 'dark' | 'system' | 'default'"
},
"docs": "Whether light or dark color theme should be active. Defaults to user operating system\npreference.",
"doctags": [
{
"name": "see",
"text": "https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme"
}
]
},
{
"name": "download",
"type": {
"primitive": "mixed",
"concise": "FileDownloadInfo",
"full": "string | boolean | { url: string; filename: string; }"
},
"docs": "Sets the download URL and filename for the download button."
},
{
"name": "showTooltipDelay",
"default": "700",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "Specifies the number of milliseconds to wait before tooltips are visible after interacting\nwith a control."
},
{
"name": "showMenuDelay",
"default": "0",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "Specifies the number of milliseconds to wait before menus are visible after opening them."
},
{
"name": "hideQualityBitrate",
"default": "false",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether the bitrate should be hidden in the settings quality menu next to each option."
},
{
"name": "smallLayoutWhen",
"default": "`({ width, height }) => width < 576 || height < 380`",
"type": {
"primitive": "boolean",
"concise": "boolean | MediaPlayerQuery",
"full": "boolean | MediaPlayerQuery"
},
"docs": "Determines when the small (e.g., mobile) UI should be displayed."
},
{
"name": "thumbnails",
"type": {
"primitive": "string",
"concise": "ThumbnailSrc",
"full": "string | ThumbnailImageInit[] | ThumbnailStoryboard | MuxThumbnailStoryboard"
},
"docs": "The thumbnails resource.",
"doctags": [
{
"name": "see",
"text": "https://www.vidstack.io/docs/wc/player/core-concepts/loading#thumbnails"
}
]
},
{
"name": "translations",
"type": {
"primitive": "object",
"concise": "Partial",
"full": "{ Announcements?: string; Accessibility?: string; AirPlay?: string; Audio?: string; Auto?: string; Boost?: string; Captions?: string; \"Caption Styles\"?: string; \"Captions look like this\"?: string; Chapters?: string; \"Closed-Captions Off\"?: string; \"Closed-Captions On\"?: string; Connected?: string; Continue?: string; Connecting?: string; Default?: string; Disabled?: string; Disconnected?: string; \"Display Background\"?: string; Download?: string; \"Enter Fullscreen\"?: string; \"Enter PiP\"?: string; \"Exit Fullscreen\"?: string; \"Exit PiP\"?: string; Font?: string; Family?: string; Fullscreen?: string; \"Google Cast\"?: string; \"Keyboard Animations\"?: string; LIVE?: string; Loop?: string; Mute?: string; Normal?: string; Off?: string; Pause?: string; Play?: string; Playback?: string; PiP?: string; Quality?: string; Replay?: string; Reset?: string; \"Seek Backward\"?: string; \"Seek Forward\"?: string; Seek?: string; Settings?: string; \"Skip To Live\"?: string; Speed?: string; Size?: string; Color?: string; Opacity?: string; Shadow?: string; Text?: string; \"Text Background\"?: string; Track?: string; Unmute?: string; Volume?: string; }"
},
"docs": "Translation map from english to your desired language for words used throughout the layout."
},
{
"name": "menuContainer",
"default": "`document.body`",
"type": {
"primitive": "string",
"concise": "string | HTMLElement",
"full": "string | HTMLElement"
},
"docs": "A document query selector string or `HTMLElement` to mount menus inside."
},
{
"name": "menuGroup",
"type": {
"primitive": "string",
"concise": "'top' | 'bottom'",
"full": "'top' | 'bottom'"
},
"docs": "Specifies whether menu buttons should be placed in the top or bottom controls group. This\nonly applies to the large video layout."
},
{
"name": "noAudioGain",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Disable audio boost slider in the settings menu."
},
{
"name": "audioGains",
"type": {
"primitive": "object",
"concise": "number[] | { min: number; max: number; step: number; }",
"full": "number[] | { min: number; max: number; step: number; }"
},
"docs": "The audio gain options to be displayed in the settings menu."
},
{
"name": "noModal",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether modal menus should be disabled when the small layout is active. A modal menu is\na floating panel that floats up from the bottom of the screen (outside of the player). It's\nenabled by default as it provides a better user experience for touch devices."
},
{
"name": "noScrubGesture",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether to disable scrubbing by touch swiping left or right on the player canvas."
},
{
"name": "sliderChaptersMinWidth",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "The minimum width of the slider to start displaying slider chapters when available."
},
{
"name": "disableTimeSlider",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether the time slider should be disabled."
},
{
"name": "noGestures",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether all gestures such as press to play or seek should not be active."
},
{
"name": "noKeyboardAnimations",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether keyboard actions should not be displayed."
},
{
"name": "playbackRates",
"type": {
"primitive": "object",
"concise": "number[] | { min: number; max: number; step: number; }",
"full": "number[] | { min: number; max: number; step: number; }"
},
"docs": "The playback rate options to be displayed in the settings menu."
},
{
"name": "seekStep",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "The number of seconds to seek forward or backward when pressing the seek button or using\nkeyboard shortcuts."
},
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "DefaultVideoLayoutSlots",
"full": "DefaultVideoLayoutSlots"
},
"docs": "Provide additional content to be inserted in specific positions."
},
{
"name": "asChild",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
}
],
"propsType": "DefaultVideoLayoutProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "VideoLayout",
"displayName": "VideoLayout",
"propsType": "{ streamType: any; isLoadLayout: any; isSmallLayout: any; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "DefaultVideoLargeLayout",
"displayName": "DefaultVideoLargeLayout"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "DefaultVideoSmallLayout",
"displayName": "DefaultVideoSmallLayout"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "DefaultVideoStartDuration",
"displayName": "DefaultVideoStartDuration"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "DefaultVideoGestures",
"displayName": "DefaultVideoGestures"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "DefaultBufferingIndicator",
"displayName": "DefaultBufferingIndicator"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "DefaultVideoMenus",
"displayName": "DefaultVideoMenus",
"props": [
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "Slots",
"full": "{ chaptersMenu?: ReactNode; settingsMenu?: ReactNode; settingsMenuStartItems?: ReactNode; settingsMenuEndItems?: ReactNode; settingsMenuItemsStart?: ReactNode; settingsMenuItemsEnd?: ReactNode; playbackMenuItemsStart?: ReactNode; playbackMenuItemsEnd?: ReactNode; playbackMenuLoop?: ReactNode; accessibilityMenuItemsStart?: ReactNode; accessibilityMenuItemsEnd?: ReactNode; audioMenuItemsStart?: ReactNode; audioMenuItemsEnd?: ReactNode; captionsMenuItemsStart?: ReactNode; captionsMenuItemsEnd?: ReactNode; beforeChaptersMenu?: ReactNode; beforeSettingsMenu?: ReactNode; beforeSettingsMenuStartItems?: ReactNode; beforeSettingsMenuEndItems?: ReactNode; beforeSettingsMenuItemsStart?: ReactNode; beforeSettingsMenuItemsEnd?: ReactNode; beforePlaybackMenuItemsStart?: ReactNode; beforePlaybackMenuItemsEnd?: ReactNode; beforePlaybackMenuLoop?: ReactNode; beforeAccessibilityMenuItemsStart?: ReactNode; beforeAccessibilityMenuItemsEnd?: ReactNode; beforeAudioMenuItemsStart?: ReactNode; beforeAudioMenuItemsEnd?: ReactNode; beforeCaptionsMenuItemsStart?: ReactNode; beforeCaptionsMenuItemsEnd?: ReactNode; afterChaptersMenu?: ReactNode; afterSettingsMenu?: ReactNode; afterSettingsMenuStartItems?: ReactNode; afterSettingsMenuEndItems?: ReactNode; afterSettingsMenuItemsStart?: ReactNode; afterSettingsMenuItemsEnd?: ReactNode; afterPlaybackMenuItemsStart?: ReactNode; afterPlaybackMenuItemsEnd?: ReactNode; afterPlaybackMenuLoop?: ReactNode; afterAccessibilityMenuItemsStart?: ReactNode; afterAccessibilityMenuItemsEnd?: ReactNode; afterAudioMenuItemsStart?: ReactNode; afterAudioMenuItemsEnd?: ReactNode; afterCaptionsMenuItemsStart?: ReactNode; afterCaptionsMenuItemsEnd?: ReactNode; }"
}
}
],
"propsType": "{ slots?: Slots; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "DefaultVideoLoadLayout",
"displayName": "DefaultVideoLoadLayout"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/default/video-layout.tsx"
},
"name": "DefaultVideoKeyboardDisplay",
"displayName": "DefaultVideoKeyboardDisplay"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrLayout",
"displayName": "PlyrLayout",
"attributes": "RefAttributes",
"props": [
{
"name": "icons",
"type": {
"primitive": "object",
"concise": "PlyrLayoutIcons",
"full": "PlyrLayoutIcons"
},
"docs": "The icons to be rendered and displayed inside the layout."
},
{
"name": "posterFrame",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "The frame of the video to use as the poster. This only works with Remotion sources at the\nmoment."
},
{
"name": "clickToPlay",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Press the video container to toggle play/pause."
},
{
"name": "clickToFullscreen",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Double-press the video container to toggle fullscreen."
},
{
"name": "controls",
"type": {
"primitive": "object",
"concise": "PlyrControl[]",
"full": "PlyrControl[]"
},
"docs": "The controls to be included in the layout and their order specified by the position in the\narray."
},
{
"name": "displayDuration",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Whether the duration should be displayed. This is ignored if `toggleTime` is `true`."
},
{
"name": "download",
"type": {
"primitive": "mixed",
"concise": "FileDownloadInfo",
"full": "string | boolean | { url: string; filename: string; }"
},
"docs": "Sets the download URL and filename for the download button. The download button must be\nincluded in the `controls` prop for this to take effect."
},
{
"name": "markers",
"type": {
"primitive": "object",
"concise": "PlyrMarker[]",
"full": "PlyrMarker[]"
},
"docs": "Points on the time slider which should be visually marked for the user."
},
{
"name": "invertTime",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Display the current time as a countdown rather than an incremental counter."
},
{
"name": "thumbnails",
"type": {
"primitive": "string",
"concise": "ThumbnailSrc",
"full": "string | ThumbnailImageInit[] | ThumbnailStoryboard | MuxThumbnailStoryboard"
},
"docs": "The thumbnails resource.",
"doctags": [
{
"name": "see",
"text": "https://www.vidstack.io/docs/wc/player/core-concepts/loading#thumbnails"
}
]
},
{
"name": "toggleTime",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
},
"docs": "Allow users to press to toggle the inverted time."
},
{
"name": "translations",
"type": {
"primitive": "object",
"concise": "Partial",
"full": "{ AirPlay?: string; Audio?: string; Auto?: string; Captions?: string; Default?: string; Disabled?: string; Download?: string; \"Enter Fullscreen\"?: string; \"Enter PiP\"?: string; \"Exit Fullscreen\"?: string; \"Exit PiP\"?: string; LIVE?: string; Loop?: string; Mute?: string; Normal?: string; Pause?: string; Play?: string; Quality?: string; Reset?: string; Seek?: string; Settings?: string; Speed?: string; Unmute?: string; Volume?: string; Start?: string; End?: string; Ad?: string; All?: string; Buffered?: string; \"Current time\"?: string; \"Disable captions\"?: string; Duration?: string; \"Enable captions\"?: string; Enabled?: string; Forward?: string; \"Go back to previous menu\"?: string; Played?: string; Restart?: string; Rewind?: string; }"
},
"docs": "Translation map from english to your desired language for words used throughout the layout."
},
{
"name": "seekTime",
"type": {
"primitive": "number",
"concise": "number",
"full": "number"
},
"docs": "The time, in seconds, to seek when a user hits fast forward or rewind."
},
{
"name": "speed",
"type": {
"primitive": "object",
"concise": "(string | number)[]",
"full": "(string | number)[]"
},
"docs": "The speed options to display in the UI."
},
{
"name": "slots",
"type": {
"primitive": "object",
"concise": "PlyrLayoutSlots",
"full": "PlyrLayoutSlots"
},
"docs": "Provide additional content to be inserted in specific positions."
},
{
"name": "asChild",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
}
],
"propsType": "PlyrLayoutElementProps",
"ref": {
"type": {
"primitive": "object",
"concise": "HTMLElement",
"full": "HTMLElement"
}
}
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrAudioLayout",
"displayName": "PlyrAudioLayout"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrVideoLayout",
"displayName": "PlyrVideoLayout"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrPlayLargeButton",
"displayName": "PlyrPlayLargeButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrPreviewScrubbing",
"displayName": "PlyrPreviewScrubbing"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrPoster",
"displayName": "PlyrPoster"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrAudioControls",
"displayName": "PlyrAudioControls"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrVideoControls",
"displayName": "PlyrVideoControls"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrAirPlayButton",
"displayName": "PlyrAirPlayButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrCaptionsButton",
"displayName": "PlyrCaptionsButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrFullscreenButton",
"displayName": "PlyrFullscreenButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrPIPButton",
"displayName": "PlyrPIPButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrMuteButton",
"displayName": "PlyrMuteButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrPlayButton",
"displayName": "PlyrPlayButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrRestartButton",
"displayName": "PlyrRestartButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrFastForwardButton",
"displayName": "PlyrFastForwardButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrRewindButton",
"displayName": "PlyrRewindButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrTimeSlider",
"displayName": "PlyrTimeSlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrVolumeSlider",
"displayName": "PlyrVolumeSlider"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrVolume",
"displayName": "PlyrVolume",
"props": [
{
"name": "type",
"type": {
"primitive": "string",
"concise": "PlyrControl",
"full": "'progress' | 'captions' | 'volume' | 'download' | 'airplay' | 'current-time' | 'duration' | 'fast-forward' | 'fullscreen' | 'mute' | 'mute+volume' | 'pip' | 'play-large' | 'play' | 'restart' | 'rewind' | 'settings'"
}
}
],
"propsType": "{ type: PlyrControl; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrCurrentTime",
"displayName": "PlyrCurrentTime"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrDuration",
"displayName": "PlyrDuration"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrDownloadButton",
"displayName": "PlyrDownloadButton"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrGestures",
"displayName": "PlyrGestures"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrCaptions",
"displayName": "PlyrCaptions"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrSettings",
"displayName": "PlyrSettings"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrMenuButton",
"displayName": "PlyrMenuButton",
"props": [
{
"name": "label",
"type": {
"primitive": "string",
"concise": "PlyrLayoutWord",
"full": "'AirPlay' | 'Audio' | 'Auto' | 'Captions' | 'Default' | 'Disabled' | 'Download' | 'Enter Fullscreen' | 'Enter PiP' | 'Exit Fullscreen' | 'Exit PiP' | 'LIVE' | 'Loop' | 'Mute' | 'Normal' | 'Pause' | 'Play' | 'Quality' | 'Reset' | 'Seek' | 'Settings' | 'Speed' | 'Unmute' | 'Volume' | 'Start' | 'End' | 'Ad' | 'All' | 'Buffered' | 'Current time' | 'Disable captions' | 'Duration' | 'Enable captions' | 'Enabled' | 'Forward' | 'Go back to previous menu' | 'Played' | 'Restart' | 'Rewind'"
}
},
{
"name": "hint",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "open",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
},
{
"name": "disabled",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
}
],
"propsType": "{ label: PlyrLayoutWord; hint?: string; open: boolean; disabled: boolean; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrMenu",
"displayName": "PlyrMenu",
"props": [
{
"name": "label",
"type": {
"primitive": "string",
"concise": "PlyrLayoutWord",
"full": "'AirPlay' | 'Audio' | 'Auto' | 'Captions' | 'Default' | 'Disabled' | 'Download' | 'Enter Fullscreen' | 'Enter PiP' | 'Exit Fullscreen' | 'Exit PiP' | 'LIVE' | 'Loop' | 'Mute' | 'Normal' | 'Pause' | 'Play' | 'Quality' | 'Reset' | 'Seek' | 'Settings' | 'Speed' | 'Unmute' | 'Volume' | 'Start' | 'End' | 'Ad' | 'All' | 'Buffered' | 'Current time' | 'Disable captions' | 'Duration' | 'Enable captions' | 'Enabled' | 'Forward' | 'Go back to previous menu' | 'Played' | 'Restart' | 'Rewind'"
}
},
{
"name": "hint",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "disabled",
"type": {
"primitive": "any",
"concise": "any",
"full": "any"
}
},
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "{ label: PlyrLayoutWord; hint?: string; disabled: any; children: ReactNode; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrAudioMenu",
"displayName": "PlyrAudioMenu"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrSpeedMenu",
"displayName": "PlyrSpeedMenu"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrCaptionsMenu",
"displayName": "PlyrCaptionsMenu"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/layouts/plyr/layout.tsx"
},
"name": "PlyrQualityMenu",
"displayName": "PlyrQualityMenu"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/player.tsx"
},
"name": "MediaPlayer",
"displayName": "MediaPlayer",
"docs": "All media components exist inside the `` component. This component's main\nresponsibilities are to manage media state updates, dispatch media events, handle media\nrequests, and expose media state through HTML attributes and CSS properties for styling\npurposes.",
"doctags": [
{
"name": "docs",
"text": "https://www.vidstack.io/docs/player/components/media/player"
},
{
"name": "example",
"text": "```tsx\n\n \n\n```"
}
],
"instance": "MediaPlayerInstance",
"attributes": "HTMLAttributes",
"props": [
{
"name": "src",
"type": {
"primitive": "string",
"concise": "PlayerSrc",
"full": "PlayerSrc | RemotionSrc"
},
"docs": "The URL or object of the current media resource/s to be considered for playback.",
"doctags": [
{
"name": "see",
"text": "https://vidstack.io/docs/player/core-concepts/loading#sources"
}
]
},
{
"name": "aspectRatio",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
}
},
{
"name": "asChild",
"type": {
"primitive": "boolean",
"concise": "boolean",
"full": "boolean"
}
},
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "MediaPlayerProps",
"ref": {
"type": {
"primitive": "object",
"concise": "MediaPlayerInstance",
"full": "MediaPlayerInstance"
}
}
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/primitives/nodes.tsx"
},
"name": "Primitive",
"propsType": "Primitives"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/primitives/slot.tsx"
},
"namespace": "Slot",
"name": "Slot",
"displayName": "Slot",
"attributes": "HTMLAttributes",
"props": [
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "SlotProps",
"ref": {
"type": {
"primitive": "object",
"concise": "HTMLElement",
"full": "HTMLElement"
}
}
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/primitives/slot.tsx"
},
"name": "SlotClone",
"displayName": "SlotClone",
"props": [
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "SlotCloneProps",
"ref": {
"type": {
"primitive": "any",
"concise": "any",
"full": "any"
}
}
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/primitives/slot.tsx"
},
"namespace": "Slot",
"name": "Slottable",
"props": [
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "{ children: ReactNode; }"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/provider.tsx"
},
"name": "MediaProvider",
"displayName": "MediaProvider",
"docs": "Renders the current provider at this component location.",
"doctags": [
{
"name": "docs",
"text": "https://www.vidstack.io/docs/player/components/media/provider"
},
{
"name": "example",
"text": "```tsx\n\n \n\n```"
}
],
"instance": "MediaProviderInstance",
"attributes": "HTMLAttributes",
"props": [
{
"name": "loaders",
"type": {
"primitive": "object",
"concise": "(new () => MediaProviderLoader)[]",
"full": "(new () => MediaProviderLoader)[]"
}
},
{
"name": "iframeProps",
"type": {
"primitive": "object",
"concise": "IframeHTMLAttributes",
"full": "IframeHTMLAttributes"
}
},
{
"name": "mediaProps",
"type": {
"primitive": "object",
"concise": "HTMLAttributes",
"full": "HTMLAttributes"
}
},
{
"name": "children",
"type": {
"primitive": "mixed",
"concise": "ReactNode",
"full": "string | number | bigint | boolean | ReactElement> | Iterable | ReactPortal | Promise"
}
}
],
"propsType": "MediaProviderProps",
"ref": {
"type": {
"primitive": "object",
"concise": "MediaProviderInstance",
"full": "MediaProviderInstance"
}
}
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/provider.tsx"
},
"name": "MediaOutlet",
"displayName": "MediaOutlet",
"props": [
{
"name": "provider",
"type": {
"primitive": "object",
"concise": "MediaProviderInstance",
"full": "MediaProviderInstance"
}
},
{
"name": "mediaProps",
"type": {
"primitive": "object",
"concise": "HTMLAttributes",
"full": "HTMLAttributes"
}
},
{
"name": "iframeProps",
"type": {
"primitive": "object",
"concise": "IframeHTMLAttributes",
"full": "IframeHTMLAttributes"
}
}
],
"propsType": "MediaOutletProps"
},
{
"type": "react",
"file": {
"path": "/Users/aidenlx/repo/vidstack-player/packages/react/src/components/text-track.tsx"
},
"name": "Track",
"displayName": "Track",
"docs": "Creates a new `TextTrack` object and adds it to the player.",
"doctags": [
{
"name": "see",
"text": "https://www.vidstack.io/docs/player/api/text-tracks"
},
{
"name": "example",
"text": "```tsx\n\n \n \n \n\n```"
}
],
"props": [
{
"name": "id",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
},
"docs": "A unique identifier.",
"doctags": [
{
"name": "see",
"text": "https://developer.mozilla.org/en-US/docs/Web/API/TextTrack/id"
}
],
"readonly": true
},
{
"name": "src",
"type": {
"primitive": "string",
"concise": "string",
"full": "string"
},
"docs": "URL of the text track resource. This attribute must be specified and its URL value must have\nthe same origin as the document — unless the