@videojs/react 10.0.0-beta.29 → 10.0.0-beta.30
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/default/index.js +2 -1
- package/dist/default/media/shaka-video/index.js +2 -0
- package/dist/default/media/shaka-video/media.js +21 -0
- package/dist/default/media/shaka-video/media.js.map +1 -0
- package/dist/default/presets/audio/minimal-skin.css +1 -3
- package/dist/default/presets/audio/skin.css +1 -3
- package/dist/default/presets/live-audio/minimal-skin.css +1 -3
- package/dist/default/presets/live-audio/skin.css +1 -3
- package/dist/default/presets/live-video/minimal-skin.css +2 -31
- package/dist/default/presets/live-video/minimal-skin.js +2 -6
- package/dist/default/presets/live-video/minimal-skin.js.map +1 -1
- package/dist/default/presets/live-video/minimal-skin.tailwind.js +2 -6
- package/dist/default/presets/live-video/minimal-skin.tailwind.js.map +1 -1
- package/dist/default/presets/live-video/skin.css +2 -33
- package/dist/default/presets/live-video/skin.js +2 -6
- package/dist/default/presets/live-video/skin.js.map +1 -1
- package/dist/default/presets/live-video/skin.tailwind.js +2 -6
- package/dist/default/presets/live-video/skin.tailwind.js.map +1 -1
- package/dist/default/presets/video/minimal-skin.css +2 -31
- package/dist/default/presets/video/minimal-skin.js +2 -6
- package/dist/default/presets/video/minimal-skin.js.map +1 -1
- package/dist/default/presets/video/minimal-skin.tailwind.js +2 -6
- package/dist/default/presets/video/minimal-skin.tailwind.js.map +1 -1
- package/dist/default/presets/video/skin.css +2 -33
- package/dist/default/presets/video/skin.js +2 -6
- package/dist/default/presets/video/skin.js.map +1 -1
- package/dist/default/presets/video/skin.tailwind.js +2 -6
- package/dist/default/presets/video/skin.tailwind.js.map +1 -1
- package/dist/default/skins/dist/default/default/tailwind/components/button.js +1 -1
- package/dist/default/skins/dist/default/default/tailwind/components/button.js.map +1 -1
- package/dist/default/skins/dist/default/default/tailwind/components/menu.js +2 -2
- package/dist/default/skins/dist/default/default/tailwind/components/menu.js.map +1 -1
- package/dist/default/skins/dist/default/default/tailwind/components/poster.js +1 -7
- package/dist/default/skins/dist/default/default/tailwind/components/poster.js.map +1 -1
- package/dist/default/skins/dist/default/default/tailwind/video.tailwind.js +1 -10
- package/dist/default/skins/dist/default/default/tailwind/video.tailwind.js.map +1 -1
- package/dist/default/skins/dist/default/minimal/tailwind/components/button.js +1 -1
- package/dist/default/skins/dist/default/minimal/tailwind/components/button.js.map +1 -1
- package/dist/default/skins/dist/default/minimal/tailwind/components/menu.js +2 -2
- package/dist/default/skins/dist/default/minimal/tailwind/components/menu.js.map +1 -1
- package/dist/default/skins/dist/default/minimal/tailwind/components/poster.js +1 -7
- package/dist/default/skins/dist/default/minimal/tailwind/components/poster.js.map +1 -1
- package/dist/default/skins/dist/default/minimal/tailwind/video.tailwind.js +1 -10
- package/dist/default/skins/dist/default/minimal/tailwind/video.tailwind.js.map +1 -1
- package/dist/default/ui/thumbnail/thumbnail.js +18 -1
- package/dist/default/ui/thumbnail/thumbnail.js.map +1 -1
- package/dist/default/ui/title/index.js +2 -0
- package/dist/default/ui/title/title.js +44 -0
- package/dist/default/ui/title/title.js.map +1 -0
- package/dist/dev/index.d.ts +3 -2
- package/dist/dev/index.js +2 -1
- package/dist/dev/media/shaka-video/index.d.ts +2 -0
- package/dist/dev/media/shaka-video/index.js +2 -0
- package/dist/dev/media/shaka-video/media.d.ts +13 -0
- package/dist/dev/media/shaka-video/media.d.ts.map +1 -0
- package/dist/dev/media/shaka-video/media.js +21 -0
- package/dist/dev/media/shaka-video/media.js.map +1 -0
- package/dist/dev/presets/audio/minimal-skin.css +1 -3
- package/dist/dev/presets/audio/skin.css +1 -3
- package/dist/dev/presets/live-audio/minimal-skin.css +1 -3
- package/dist/dev/presets/live-audio/skin.css +1 -3
- package/dist/dev/presets/live-video/minimal-skin.css +2 -31
- package/dist/dev/presets/live-video/minimal-skin.js +2 -6
- package/dist/dev/presets/live-video/minimal-skin.js.map +1 -1
- package/dist/dev/presets/live-video/minimal-skin.tailwind.js +2 -6
- package/dist/dev/presets/live-video/minimal-skin.tailwind.js.map +1 -1
- package/dist/dev/presets/live-video/skin.css +2 -33
- package/dist/dev/presets/live-video/skin.js +2 -6
- package/dist/dev/presets/live-video/skin.js.map +1 -1
- package/dist/dev/presets/live-video/skin.tailwind.js +2 -6
- package/dist/dev/presets/live-video/skin.tailwind.js.map +1 -1
- package/dist/dev/presets/types.d.ts +0 -2
- package/dist/dev/presets/types.d.ts.map +1 -1
- package/dist/dev/presets/video/minimal-skin.css +2 -31
- package/dist/dev/presets/video/minimal-skin.js +2 -6
- package/dist/dev/presets/video/minimal-skin.js.map +1 -1
- package/dist/dev/presets/video/minimal-skin.tailwind.js +2 -6
- package/dist/dev/presets/video/minimal-skin.tailwind.js.map +1 -1
- package/dist/dev/presets/video/skin.css +2 -33
- package/dist/dev/presets/video/skin.js +2 -6
- package/dist/dev/presets/video/skin.js.map +1 -1
- package/dist/dev/presets/video/skin.tailwind.js +2 -6
- package/dist/dev/presets/video/skin.tailwind.js.map +1 -1
- package/dist/dev/skins/dist/default/default/tailwind/components/button.js +1 -1
- package/dist/dev/skins/dist/default/default/tailwind/components/button.js.map +1 -1
- package/dist/dev/skins/dist/default/default/tailwind/components/menu.js +2 -2
- package/dist/dev/skins/dist/default/default/tailwind/components/menu.js.map +1 -1
- package/dist/dev/skins/dist/default/default/tailwind/components/poster.js +1 -7
- package/dist/dev/skins/dist/default/default/tailwind/components/poster.js.map +1 -1
- package/dist/dev/skins/dist/default/default/tailwind/video.tailwind.js +1 -10
- package/dist/dev/skins/dist/default/default/tailwind/video.tailwind.js.map +1 -1
- package/dist/dev/skins/dist/default/minimal/tailwind/components/button.js +1 -1
- package/dist/dev/skins/dist/default/minimal/tailwind/components/button.js.map +1 -1
- package/dist/dev/skins/dist/default/minimal/tailwind/components/menu.js +2 -2
- package/dist/dev/skins/dist/default/minimal/tailwind/components/menu.js.map +1 -1
- package/dist/dev/skins/dist/default/minimal/tailwind/components/poster.js +1 -7
- package/dist/dev/skins/dist/default/minimal/tailwind/components/poster.js.map +1 -1
- package/dist/dev/skins/dist/default/minimal/tailwind/video.tailwind.js +1 -10
- package/dist/dev/skins/dist/default/minimal/tailwind/video.tailwind.js.map +1 -1
- package/dist/dev/ui/thumbnail/thumbnail.d.ts.map +1 -1
- package/dist/dev/ui/thumbnail/thumbnail.js +18 -1
- package/dist/dev/ui/thumbnail/thumbnail.js.map +1 -1
- package/dist/dev/ui/title/index.d.ts +2 -0
- package/dist/dev/ui/title/index.js +2 -0
- package/dist/dev/ui/title/title.d.ts +27 -0
- package/dist/dev/ui/title/title.d.ts.map +1 -0
- package/dist/dev/ui/title/title.js +47 -0
- package/dist/dev/ui/title/title.js.map +1 -0
- package/docs/README.md +1 -1
- package/docs/concepts/presets.md +4 -4
- package/docs/concepts/skins.md +8 -48
- package/docs/how-to/add-a-poster-placeholder.md +133 -0
- package/docs/how-to/customize-skins.md +10 -92
- package/docs/how-to/migrate-from-mux-player.md +14 -8
- package/docs/llms.txt +3 -0
- package/docs/reference/feature-fullscreen.md +9 -8
- package/docs/reference/feature-metadata.md +129 -0
- package/docs/reference/feature-orientation-lock.md +94 -8
- package/docs/reference/feature-text-tracks.md +10 -0
- package/docs/reference/menu.md +0 -1
- package/docs/reference/thumbnail.md +4 -0
- package/docs/reference/title.md +208 -0
- package/package.json +8 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"minimal-skin.js","names":["Popover.Root","Popover.Trigger","Popover.Popup","VolumeSlider.Root","VolumeSlider.Track","VolumeSlider.Fill","VolumeSlider.Thumb","Tooltip.Root","Tooltip.Trigger","Tooltip.Popup","Tooltip.Label","Tooltip.Shortcut","Menu.Root","Menu.Trigger","Menu.Content","Menu.RadioGroup","Menu.RadioItem","Menu.ItemIndicator","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","VolumeIndicator.Root","VolumeIndicator.Fill","VolumeIndicator.Value","StatusIndicator.Root","StatusIndicator.Value"],"sources":["../../../../src/presets/live-video/minimal-skin.tsx"],"sourcesContent":["'use client';\n\nimport { captionsText } from '@videojs/core/i18n/text/menu';\nimport { cn } from '@videojs/utils/style';\nimport { type ComponentProps, type CSSProperties, forwardRef, type ReactNode } from 'react';\nimport { useTranslator } from '@/i18n/context';\nimport {\n AirPlayEnterIcon,\n AirPlayExitIcon,\n CaptionsOffIcon,\n CaptionsOnIcon,\n CastEnterIcon,\n CastExitIcon,\n CheckIcon,\n FullscreenEnterIcon,\n FullscreenExitIcon,\n PauseIcon,\n PipEnterIcon,\n PipExitIcon,\n PlayIcon,\n RestartIcon,\n SpinnerIcon,\n VolumeHighIcon,\n VolumeLowIcon,\n VolumeOffIcon,\n} from '@/icons/minimal';\nimport { Container } from '@/player/container';\nimport { usePlayer } from '@/player/context';\nimport { AirPlayButton } from '@/ui/airplay-button';\nimport { BufferingIndicator } from '@/ui/buffering-indicator';\nimport { CaptionsButton } from '@/ui/captions-button';\nimport { useCaptionsOptions } from '@/ui/captions-radio-group';\nimport { CastButton } from '@/ui/cast-button';\nimport { Controls } from '@/ui/controls';\nimport { ErrorDialog } from '@/ui/error-dialog';\nimport { FullscreenButton } from '@/ui/fullscreen-button';\nimport { Gesture } from '@/ui/gesture';\nimport { Hotkey } from '@/ui/hotkey';\nimport { LiveButton } from '@/ui/live-button';\nimport { Menu } from '@/ui/menu';\nimport { MuteButton } from '@/ui/mute-button';\nimport { PiPButton } from '@/ui/pip-button';\nimport { PlayButton } from '@/ui/play-button';\nimport { Popover } from '@/ui/popover';\nimport { Poster } from '@/ui/poster';\nimport { StatusAnnouncer } from '@/ui/status-announcer';\nimport { StatusIndicator } from '@/ui/status-indicator';\nimport { Tooltip } from '@/ui/tooltip';\nimport { VolumeIndicator } from '@/ui/volume-indicator';\nimport { VolumeSlider } from '@/ui/volume-slider';\nimport type { BaseVideoSkinProps } from '../types';\n\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\nexport type MinimalLiveVideoSkinProps = BaseVideoSkinProps;\n\nconst Button = forwardRef<HTMLButtonElement, ComponentProps<'button'>>(function Button({ className, ...props }, ref) {\n return (\n <button\n ref={ref}\n type=\"button\"\n className={cn('media-button media-button--subtle media-button--icon', className)}\n {...props}\n />\n );\n});\n\nfunction VolumePopover(): ReactNode {\n const volumeUnavailable = usePlayer((s) => s.volumeAvailability !== 'available');\n\n const muteButton = (\n <MuteButton className=\"media-button--mute\" render={<Button />}>\n <VolumeOffIcon className=\"media-icon media-icon--volume-off\" />\n <VolumeLowIcon className=\"media-icon media-icon--volume-low\" />\n <VolumeHighIcon className=\"media-icon media-icon--volume-high\" />\n </MuteButton>\n );\n\n if (volumeUnavailable) return muteButton;\n\n return (\n <Popover.Root openOnHover delay={200} closeDelay={100} side=\"right\">\n <Popover.Trigger render={muteButton} />\n <Popover.Popup className=\"media-popover media-popover--volume\">\n <VolumeSlider.Root className=\"media-slider\" orientation=\"horizontal\" thumbAlignment=\"edge\">\n <VolumeSlider.Track className=\"media-slider__track\">\n <VolumeSlider.Fill className=\"media-slider__fill\" />\n </VolumeSlider.Track>\n <VolumeSlider.Thumb className=\"media-slider__thumb media-slider__thumb--persistent\" />\n </VolumeSlider.Root>\n </Popover.Popup>\n </Popover.Root>\n );\n}\n\n/**\n * Minimal video skin configured for live playback. Mirrors\n * {@link MinimalVideoSkin} but omits the time slider and the current /\n * duration / remaining time displays. A flexible spacer stretches between\n * the start and end button groups so they sit at opposite edges of the\n * control bar.\n */\nfunction CaptionsTrigger(): ReactNode {\n const t = useTranslator();\n const captions = useCaptionsOptions();\n if (!captions) return null;\n\n const { disabled } = captions;\n\n if (!captions.showMenu) {\n return (\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CaptionsButton className=\"media-button--captions\" render={<Button />}>\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n </CaptionsButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n );\n }\n\n return (\n <Menu.Root side=\"top\" align=\"center\">\n <Menu.Trigger\n disabled={disabled}\n render={\n <CaptionsButton className=\"media-button--captions\" render={<Button />}>\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n </CaptionsButton>\n }\n />\n <Menu.Content className=\"media-popover media-menu media-menu--captions\">\n <Menu.RadioGroup\n className=\"media-menu__group\"\n value={captions.value}\n onValueChange={captions.setValue}\n aria-label={t(captionsText)}\n >\n {captions.options.map((option) => (\n <Menu.RadioItem\n key={option.value}\n className=\"media-menu__item\"\n value={option.value}\n disabled={option.disabled}\n >\n <span>{option.label}</span>\n <Menu.ItemIndicator\n checked={option.value === captions.value}\n forceMount\n className=\"media-menu__indicator\"\n >\n <CheckIcon className=\"media-icon\" />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n ))}\n </Menu.RadioGroup>\n </Menu.Content>\n </Menu.Root>\n );\n}\n\nexport function MinimalLiveVideoSkin(props: MinimalLiveVideoSkinProps): ReactNode {\n const { children, className, renderPoster, placeholder, style, ...rest } = props;\n\n const containerStyle = placeholder\n ? ({ '--media-poster-placeholder': `url(${placeholder})`, ...style } as CSSProperties)\n : style;\n\n return (\n <Container\n className={cn('media-minimal-skin media-minimal-skin--video', className)}\n style={containerStyle}\n {...rest}\n >\n {children}\n\n <Poster render={renderPoster} />\n\n <BufferingIndicator\n render={(props) => (\n <div {...props} className=\"media-buffering-indicator\">\n <SpinnerIcon className=\"media-icon\" />\n </div>\n )}\n />\n\n <ErrorDialog.Root>\n <ErrorDialog.Popup className=\"media-error\">\n <div className=\"media-error__dialog\">\n <div className=\"media-error__content\">\n <ErrorDialog.Title className=\"media-error__title\"></ErrorDialog.Title>\n <ErrorDialog.Description className=\"media-error__description\" />\n </div>\n <div className=\"media-error__actions\">\n <ErrorDialog.Close className=\"media-button media-button--primary\"></ErrorDialog.Close>\n </div>\n </div>\n </ErrorDialog.Popup>\n </ErrorDialog.Root>\n\n <Controls.Root className=\"media-controls\">\n <Tooltip.Provider>\n <div className=\"media-button-group\">\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PlayButton className=\"media-button--play\" render={<Button />}>\n <RestartIcon className=\"media-icon media-icon--restart\" />\n <PlayIcon className=\"media-icon media-icon--play\" />\n <PauseIcon className=\"media-icon media-icon--pause\" />\n </PlayButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <LiveButton className=\"media-button media-button--subtle media-button--live\" />\n\n <VolumePopover />\n </div>\n\n <div className=\"media-time-controls\" aria-hidden=\"true\" />\n\n <div className=\"media-button-group\">\n <CaptionsTrigger />\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CastButton className=\"media-button--cast\" render={<Button />}>\n <CastEnterIcon className=\"media-icon media-icon--cast-enter\" />\n <CastExitIcon className=\"media-icon media-icon--cast-exit\" />\n </CastButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <AirPlayButton className=\"media-button--airplay\" render={<Button />}>\n <AirPlayEnterIcon className=\"media-icon media-icon--airplay-enter\" />\n <AirPlayExitIcon className=\"media-icon media-icon--airplay-exit\" />\n </AirPlayButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PiPButton className=\"media-button--pip\" render={<Button />}>\n <PipEnterIcon className=\"media-icon media-icon--pip-enter\" />\n <PipExitIcon className=\"media-icon media-icon--pip-exit\" />\n </PiPButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <FullscreenButton className=\"media-button--fullscreen\" render={<Button />}>\n <FullscreenEnterIcon className=\"media-icon media-icon--fullscreen-enter\" />\n <FullscreenExitIcon className=\"media-icon media-icon--fullscreen-exit\" />\n </FullscreenButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n </div>\n </Tooltip.Provider>\n </Controls.Root>\n\n <div className=\"media-overlay\" />\n\n {/* Hotkeys */}\n <Hotkey keys=\"Space\" action=\"togglePaused\" />\n <Hotkey keys=\"k\" action=\"togglePaused\" />\n <Hotkey keys=\"m\" action=\"toggleMuted\" />\n <Hotkey keys=\"f\" action=\"toggleFullscreen\" />\n <Hotkey keys=\"c\" action=\"toggleSubtitles\" />\n <Hotkey keys=\"i\" action=\"togglePictureInPicture\" />\n <Hotkey keys=\"ArrowUp\" action=\"volumeStep\" value={0.05} />\n <Hotkey keys=\"ArrowDown\" action=\"volumeStep\" value={-0.05} />\n\n {/* Gestures */}\n <Gesture type=\"tap\" action=\"togglePaused\" pointer=\"mouse\" region=\"center\" />\n <Gesture type=\"tap\" action=\"toggleControls\" pointer=\"touch\" />\n <Gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\" />\n\n {/* Input Indicators */}\n <StatusAnnouncer className=\"media-sr-only\" />\n <div className=\"media-input-indicator-overlay\">\n <VolumeIndicator.Root className=\"media-volume-indicator\">\n <VolumeIndicator.Fill className=\"media-volume-indicator__content\">\n <VolumeHighIcon className=\"media-icon media-icon--volume-high\" />\n <VolumeLowIcon className=\"media-icon media-icon--volume-low\" />\n <VolumeOffIcon className=\"media-icon media-icon--volume-off\" />\n <div className=\"media-volume-indicator__progress\" aria-hidden=\"true\" />\n <VolumeIndicator.Value className=\"media-volume-indicator__value\" />\n </VolumeIndicator.Fill>\n </VolumeIndicator.Root>\n\n <StatusIndicator.Root\n actions={TOP_STATUS_ACTIONS}\n className=\"media-status-indicator media-status-indicator--state\"\n >\n <div className=\"media-status-indicator__content\">\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <FullscreenEnterIcon className=\"media-icon media-icon--fullscreen-enter\" />\n <FullscreenExitIcon className=\"media-icon media-icon--fullscreen-exit\" />\n <PipEnterIcon className=\"media-icon media-icon--pip-enter\" />\n <PipExitIcon className=\"media-icon media-icon--pip-exit\" />\n <StatusIndicator.Value className=\"media-status-indicator__value\" />\n </div>\n </StatusIndicator.Root>\n\n <StatusIndicator.Root\n actions={CENTER_STATUS_ACTIONS}\n className=\"media-status-indicator media-status-indicator--playback\"\n >\n <PlayIcon className=\"media-icon media-icon--play\" />\n <PauseIcon className=\"media-icon media-icon--pause\" />\n </StatusIndicator.Root>\n </div>\n </Container>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"minimal-skin.js","names":["Popover.Root","Popover.Trigger","Popover.Popup","VolumeSlider.Root","VolumeSlider.Track","VolumeSlider.Fill","VolumeSlider.Thumb","Tooltip.Root","Tooltip.Trigger","Tooltip.Popup","Tooltip.Label","Tooltip.Shortcut","Menu.Root","Menu.Trigger","Menu.Content","Menu.RadioGroup","Menu.RadioItem","Menu.ItemIndicator","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","VolumeIndicator.Root","VolumeIndicator.Fill","VolumeIndicator.Value","StatusIndicator.Root","StatusIndicator.Value"],"sources":["../../../../src/presets/live-video/minimal-skin.tsx"],"sourcesContent":["'use client';\n\nimport { captionsText } from '@videojs/core/i18n/text/menu';\nimport { cn } from '@videojs/utils/style';\nimport { type ComponentProps, forwardRef, type ReactNode } from 'react';\nimport { useTranslator } from '@/i18n/context';\nimport {\n AirPlayEnterIcon,\n AirPlayExitIcon,\n CaptionsOffIcon,\n CaptionsOnIcon,\n CastEnterIcon,\n CastExitIcon,\n CheckIcon,\n FullscreenEnterIcon,\n FullscreenExitIcon,\n PauseIcon,\n PipEnterIcon,\n PipExitIcon,\n PlayIcon,\n RestartIcon,\n SpinnerIcon,\n VolumeHighIcon,\n VolumeLowIcon,\n VolumeOffIcon,\n} from '@/icons/minimal';\nimport { Container } from '@/player/container';\nimport { usePlayer } from '@/player/context';\nimport { AirPlayButton } from '@/ui/airplay-button';\nimport { BufferingIndicator } from '@/ui/buffering-indicator';\nimport { CaptionsButton } from '@/ui/captions-button';\nimport { useCaptionsOptions } from '@/ui/captions-radio-group';\nimport { CastButton } from '@/ui/cast-button';\nimport { Controls } from '@/ui/controls';\nimport { ErrorDialog } from '@/ui/error-dialog';\nimport { FullscreenButton } from '@/ui/fullscreen-button';\nimport { Gesture } from '@/ui/gesture';\nimport { Hotkey } from '@/ui/hotkey';\nimport { LiveButton } from '@/ui/live-button';\nimport { Menu } from '@/ui/menu';\nimport { MuteButton } from '@/ui/mute-button';\nimport { PiPButton } from '@/ui/pip-button';\nimport { PlayButton } from '@/ui/play-button';\nimport { Popover } from '@/ui/popover';\nimport { Poster } from '@/ui/poster';\nimport { StatusAnnouncer } from '@/ui/status-announcer';\nimport { StatusIndicator } from '@/ui/status-indicator';\nimport { Tooltip } from '@/ui/tooltip';\nimport { VolumeIndicator } from '@/ui/volume-indicator';\nimport { VolumeSlider } from '@/ui/volume-slider';\nimport type { BaseVideoSkinProps } from '../types';\n\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\nexport type MinimalLiveVideoSkinProps = BaseVideoSkinProps;\n\nconst Button = forwardRef<HTMLButtonElement, ComponentProps<'button'>>(function Button({ className, ...props }, ref) {\n return (\n <button\n ref={ref}\n type=\"button\"\n className={cn('media-button media-button--subtle media-button--icon', className)}\n {...props}\n />\n );\n});\n\nfunction VolumePopover(): ReactNode {\n const volumeUnavailable = usePlayer((s) => s.volumeAvailability !== 'available');\n\n const muteButton = (\n <MuteButton className=\"media-button--mute\" render={<Button />}>\n <VolumeOffIcon className=\"media-icon media-icon--volume-off\" />\n <VolumeLowIcon className=\"media-icon media-icon--volume-low\" />\n <VolumeHighIcon className=\"media-icon media-icon--volume-high\" />\n </MuteButton>\n );\n\n if (volumeUnavailable) return muteButton;\n\n return (\n <Popover.Root openOnHover delay={200} closeDelay={100} side=\"right\">\n <Popover.Trigger render={muteButton} />\n <Popover.Popup className=\"media-popover media-popover--volume\">\n <VolumeSlider.Root className=\"media-slider\" orientation=\"horizontal\" thumbAlignment=\"edge\">\n <VolumeSlider.Track className=\"media-slider__track\">\n <VolumeSlider.Fill className=\"media-slider__fill\" />\n </VolumeSlider.Track>\n <VolumeSlider.Thumb className=\"media-slider__thumb media-slider__thumb--persistent\" />\n </VolumeSlider.Root>\n </Popover.Popup>\n </Popover.Root>\n );\n}\n\n/**\n * Minimal video skin configured for live playback. Mirrors\n * {@link MinimalVideoSkin} but omits the time slider and the current /\n * duration / remaining time displays. A flexible spacer stretches between\n * the start and end button groups so they sit at opposite edges of the\n * control bar.\n */\nfunction CaptionsTrigger(): ReactNode {\n const t = useTranslator();\n const captions = useCaptionsOptions();\n if (!captions) return null;\n\n const { disabled } = captions;\n\n if (!captions.showMenu) {\n return (\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CaptionsButton className=\"media-button--captions\" render={<Button />}>\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n </CaptionsButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n );\n }\n\n return (\n <Menu.Root side=\"top\" align=\"center\">\n <Menu.Trigger\n disabled={disabled}\n render={\n <CaptionsButton className=\"media-button--captions\" render={<Button />}>\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n </CaptionsButton>\n }\n />\n <Menu.Content className=\"media-popover media-menu media-menu--captions\">\n <Menu.RadioGroup\n className=\"media-menu__group\"\n value={captions.value}\n onValueChange={captions.setValue}\n aria-label={t(captionsText)}\n >\n {captions.options.map((option) => (\n <Menu.RadioItem\n key={option.value}\n className=\"media-menu__item\"\n value={option.value}\n disabled={option.disabled}\n >\n <span>{option.label}</span>\n <Menu.ItemIndicator\n checked={option.value === captions.value}\n forceMount\n className=\"media-menu__indicator\"\n >\n <CheckIcon className=\"media-icon\" />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n ))}\n </Menu.RadioGroup>\n </Menu.Content>\n </Menu.Root>\n );\n}\n\nexport function MinimalLiveVideoSkin(props: MinimalLiveVideoSkinProps): ReactNode {\n const { children, className, renderPoster, style, ...rest } = props;\n\n return (\n <Container className={cn('media-minimal-skin media-minimal-skin--video', className)} style={style} {...rest}>\n {children}\n\n <Poster render={renderPoster} />\n\n <BufferingIndicator\n render={(props) => (\n <div {...props} className=\"media-buffering-indicator\">\n <SpinnerIcon className=\"media-icon\" />\n </div>\n )}\n />\n\n <ErrorDialog.Root>\n <ErrorDialog.Popup className=\"media-error\">\n <div className=\"media-error__dialog\">\n <div className=\"media-error__content\">\n <ErrorDialog.Title className=\"media-error__title\"></ErrorDialog.Title>\n <ErrorDialog.Description className=\"media-error__description\" />\n </div>\n <div className=\"media-error__actions\">\n <ErrorDialog.Close className=\"media-button media-button--primary\"></ErrorDialog.Close>\n </div>\n </div>\n </ErrorDialog.Popup>\n </ErrorDialog.Root>\n\n <Controls.Root className=\"media-controls\">\n <Tooltip.Provider>\n <div className=\"media-button-group\">\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PlayButton className=\"media-button--play\" render={<Button />}>\n <RestartIcon className=\"media-icon media-icon--restart\" />\n <PlayIcon className=\"media-icon media-icon--play\" />\n <PauseIcon className=\"media-icon media-icon--pause\" />\n </PlayButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <LiveButton className=\"media-button media-button--subtle media-button--live\" />\n\n <VolumePopover />\n </div>\n\n <div className=\"media-time-controls\" aria-hidden=\"true\" />\n\n <div className=\"media-button-group\">\n <CaptionsTrigger />\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CastButton className=\"media-button--cast\" render={<Button />}>\n <CastEnterIcon className=\"media-icon media-icon--cast-enter\" />\n <CastExitIcon className=\"media-icon media-icon--cast-exit\" />\n </CastButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <AirPlayButton className=\"media-button--airplay\" render={<Button />}>\n <AirPlayEnterIcon className=\"media-icon media-icon--airplay-enter\" />\n <AirPlayExitIcon className=\"media-icon media-icon--airplay-exit\" />\n </AirPlayButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PiPButton className=\"media-button--pip\" render={<Button />}>\n <PipEnterIcon className=\"media-icon media-icon--pip-enter\" />\n <PipExitIcon className=\"media-icon media-icon--pip-exit\" />\n </PiPButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <FullscreenButton className=\"media-button--fullscreen\" render={<Button />}>\n <FullscreenEnterIcon className=\"media-icon media-icon--fullscreen-enter\" />\n <FullscreenExitIcon className=\"media-icon media-icon--fullscreen-exit\" />\n </FullscreenButton>\n }\n />\n <Tooltip.Popup className=\"media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n </div>\n </Tooltip.Provider>\n </Controls.Root>\n\n <div className=\"media-overlay\" />\n\n {/* Hotkeys */}\n <Hotkey keys=\"Space\" action=\"togglePaused\" />\n <Hotkey keys=\"k\" action=\"togglePaused\" />\n <Hotkey keys=\"m\" action=\"toggleMuted\" />\n <Hotkey keys=\"f\" action=\"toggleFullscreen\" />\n <Hotkey keys=\"c\" action=\"toggleSubtitles\" />\n <Hotkey keys=\"i\" action=\"togglePictureInPicture\" />\n <Hotkey keys=\"ArrowUp\" action=\"volumeStep\" value={0.05} />\n <Hotkey keys=\"ArrowDown\" action=\"volumeStep\" value={-0.05} />\n\n {/* Gestures */}\n <Gesture type=\"tap\" action=\"togglePaused\" pointer=\"mouse\" region=\"center\" />\n <Gesture type=\"tap\" action=\"toggleControls\" pointer=\"touch\" />\n <Gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\" />\n\n {/* Input Indicators */}\n <StatusAnnouncer className=\"media-sr-only\" />\n <div className=\"media-input-indicator-overlay\">\n <VolumeIndicator.Root className=\"media-volume-indicator\">\n <VolumeIndicator.Fill className=\"media-volume-indicator__content\">\n <VolumeHighIcon className=\"media-icon media-icon--volume-high\" />\n <VolumeLowIcon className=\"media-icon media-icon--volume-low\" />\n <VolumeOffIcon className=\"media-icon media-icon--volume-off\" />\n <div className=\"media-volume-indicator__progress\" aria-hidden=\"true\" />\n <VolumeIndicator.Value className=\"media-volume-indicator__value\" />\n </VolumeIndicator.Fill>\n </VolumeIndicator.Root>\n\n <StatusIndicator.Root\n actions={TOP_STATUS_ACTIONS}\n className=\"media-status-indicator media-status-indicator--state\"\n >\n <div className=\"media-status-indicator__content\">\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <FullscreenEnterIcon className=\"media-icon media-icon--fullscreen-enter\" />\n <FullscreenExitIcon className=\"media-icon media-icon--fullscreen-exit\" />\n <PipEnterIcon className=\"media-icon media-icon--pip-enter\" />\n <PipExitIcon className=\"media-icon media-icon--pip-exit\" />\n <StatusIndicator.Value className=\"media-status-indicator__value\" />\n </div>\n </StatusIndicator.Root>\n\n <StatusIndicator.Root\n actions={CENTER_STATUS_ACTIONS}\n className=\"media-status-indicator media-status-indicator--playback\"\n >\n <PlayIcon className=\"media-icon media-icon--play\" />\n <PauseIcon className=\"media-icon media-icon--pause\" />\n </StatusIndicator.Root>\n </div>\n </Container>\n );\n}\n"],"mappings":"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"}
|
|
@@ -204,14 +204,10 @@ function CaptionsTrigger() {
|
|
|
204
204
|
});
|
|
205
205
|
}
|
|
206
206
|
function MinimalLiveVideoSkinTailwind(props) {
|
|
207
|
-
const { children, className, renderPoster,
|
|
208
|
-
const containerStyle = placeholder ? {
|
|
209
|
-
"--media-poster-placeholder": `url(${placeholder})`,
|
|
210
|
-
...style
|
|
211
|
-
} : style;
|
|
207
|
+
const { children, className, renderPoster, style, ...rest } = props;
|
|
212
208
|
return /* @__PURE__ */ jsxs(Container, {
|
|
213
209
|
className: cn(container(false), className),
|
|
214
|
-
style
|
|
210
|
+
style,
|
|
215
211
|
...rest,
|
|
216
212
|
children: [
|
|
217
213
|
children,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"minimal-skin.tailwind.js","names":["Popover.Root","Popover.Trigger","Popover.Popup","VolumeSlider.Root","VolumeSlider.Track","VolumeSlider.Fill","VolumeSlider.Thumb","Tooltip.Root","Tooltip.Trigger","Tooltip.Popup","Tooltip.Label","Tooltip.Shortcut","Menu.Root","Menu.Trigger","Menu.Content","Menu.RadioGroup","Menu.RadioItem","Menu.ItemIndicator","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","VolumeIndicator.Root","VolumeIndicator.Fill","VolumeIndicator.Value","StatusIndicator.Root","StatusIndicator.Value"],"sources":["../../../../src/presets/live-video/minimal-skin.tailwind.tsx"],"sourcesContent":["'use client';\n\nimport { captionsText } from '@videojs/core/i18n/text/menu';\nimport {\n bufferingIndicator,\n button,\n buttonGroupEnd,\n buttonGroupStart,\n container,\n controls,\n error,\n icon,\n iconState,\n inputIndicatorOverlay,\n menu,\n overlay,\n popup,\n poster,\n slider,\n spacer,\n statusIndicator,\n volumeIndicator,\n} from '@videojs/skins/minimal/tailwind/video.tailwind';\nimport { cn } from '@videojs/utils/style';\nimport { type ComponentProps, type CSSProperties, forwardRef, type ReactNode } from 'react';\nimport { useTranslator } from '@/i18n/context';\nimport {\n AirPlayEnterIcon,\n AirPlayExitIcon,\n CaptionsOffIcon,\n CaptionsOnIcon,\n CastEnterIcon,\n CastExitIcon,\n CheckIcon,\n FullscreenEnterIcon,\n FullscreenExitIcon,\n PauseIcon,\n PipEnterIcon,\n PipExitIcon,\n PlayIcon,\n RestartIcon,\n SpinnerIcon,\n VolumeHighIcon,\n VolumeLowIcon,\n VolumeOffIcon,\n} from '@/icons/minimal';\nimport { Container } from '@/player/container';\nimport { usePlayer } from '@/player/context';\nimport { AirPlayButton } from '@/ui/airplay-button';\nimport { BufferingIndicator } from '@/ui/buffering-indicator';\nimport { CaptionsButton } from '@/ui/captions-button';\nimport { useCaptionsOptions } from '@/ui/captions-radio-group';\nimport { CastButton } from '@/ui/cast-button';\nimport { Controls } from '@/ui/controls';\nimport { ErrorDialog } from '@/ui/error-dialog';\nimport { FullscreenButton } from '@/ui/fullscreen-button';\nimport { Gesture } from '@/ui/gesture';\nimport { Hotkey } from '@/ui/hotkey';\nimport { LiveButton } from '@/ui/live-button';\nimport { Menu } from '@/ui/menu';\nimport { MuteButton } from '@/ui/mute-button';\nimport { PiPButton } from '@/ui/pip-button';\nimport { PlayButton } from '@/ui/play-button';\nimport { Popover } from '@/ui/popover';\nimport { Poster } from '@/ui/poster';\nimport { StatusAnnouncer } from '@/ui/status-announcer';\nimport { StatusIndicator } from '@/ui/status-indicator';\nimport { Tooltip } from '@/ui/tooltip';\nimport { VolumeIndicator } from '@/ui/volume-indicator';\nimport { VolumeSlider } from '@/ui/volume-slider';\nimport type { MinimalLiveVideoSkinProps } from './minimal-skin';\n\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\nconst Button = forwardRef<HTMLButtonElement, ComponentProps<'button'>>(function Button({ className, ...props }, ref) {\n return (\n <button ref={ref} type=\"button\" className={cn(button.base, button.subtle, button.icon, className)} {...props} />\n );\n});\n\nconst SliderRoot = forwardRef<HTMLDivElement, ComponentProps<'div'>>(function SliderRoot({ className, ...props }, ref) {\n return <div ref={ref} className={cn(slider.root, className)} {...props} />;\n});\n\nconst SliderTrack = forwardRef<HTMLDivElement, ComponentProps<'div'>>(function SliderTrack(\n { className, ...props },\n ref\n) {\n return <div ref={ref} className={cn(slider.track, className)} {...props} />;\n});\n\nconst SliderFill = forwardRef<HTMLDivElement, ComponentProps<'div'> & { type?: 'fill' | 'buffer' }>(function SliderFill(\n { type = 'fill', className, ...props },\n ref\n) {\n return (\n <div\n ref={ref}\n className={cn(slider.fill.base, type === 'fill' ? slider.fill.fill : slider.fill.buffer, className)}\n {...props}\n />\n );\n});\n\nconst SliderThumb = forwardRef<HTMLDivElement, ComponentProps<'div'> & { persistent?: boolean }>(function SliderThumb(\n { persistent, className, ...props },\n ref\n) {\n return (\n <div\n ref={ref}\n className={cn(slider.thumb.base, persistent ? undefined : slider.thumb.interactive, className)}\n {...props}\n />\n );\n});\n\nfunction VolumePopover(): ReactNode {\n const volumeUnavailable = usePlayer((s) => s.volumeAvailability !== 'available');\n\n const muteButton = (\n <MuteButton className={iconState.mute.button} render={<Button />}>\n <VolumeOffIcon className={cn(icon, iconState.mute.volumeOff)} />\n <VolumeLowIcon className={cn(icon, iconState.mute.volumeLow)} />\n <VolumeHighIcon className={cn(icon, iconState.mute.volumeHigh)} />\n </MuteButton>\n );\n\n if (volumeUnavailable) return muteButton;\n\n return (\n <Popover.Root openOnHover delay={200} closeDelay={100} side=\"right\">\n <Popover.Trigger render={muteButton} />\n <Popover.Popup className={cn(popup.volume)}>\n <VolumeSlider.Root orientation=\"horizontal\" thumbAlignment=\"edge\" render={<SliderRoot />}>\n <VolumeSlider.Track render={<SliderTrack />}>\n <VolumeSlider.Fill render={<SliderFill />} />\n </VolumeSlider.Track>\n <VolumeSlider.Thumb render={(props) => <SliderThumb persistent {...props} />} />\n </VolumeSlider.Root>\n </Popover.Popup>\n </Popover.Root>\n );\n}\n\nfunction CaptionsTrigger(): ReactNode {\n const t = useTranslator();\n const captions = useCaptionsOptions();\n if (!captions) return null;\n\n const { disabled } = captions;\n\n if (!captions.showMenu) {\n return (\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CaptionsButton className={iconState.captions.button} render={<Button />}>\n <CaptionsOffIcon className={cn(icon, iconState.captions.off)} />\n <CaptionsOnIcon className={cn(icon, iconState.captions.on)} />\n </CaptionsButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n );\n }\n\n return (\n <Menu.Root side=\"top\" align=\"center\">\n <Menu.Trigger\n disabled={disabled}\n render={\n <CaptionsButton className={iconState.captions.button} render={<Button />}>\n <CaptionsOffIcon className={cn(icon, iconState.captions.off)} />\n <CaptionsOnIcon className={cn(icon, iconState.captions.on)} />\n </CaptionsButton>\n }\n />\n <Menu.Content className={cn(popup.popover, menu.root)}>\n <Menu.RadioGroup\n className={menu.group}\n value={captions.value}\n onValueChange={captions.setValue}\n aria-label={t(captionsText)}\n >\n {captions.options.map((option) => (\n <Menu.RadioItem key={option.value} className={menu.item} value={option.value} disabled={option.disabled}>\n <span>{option.label}</span>\n <Menu.ItemIndicator checked={option.value === captions.value} forceMount className={menu.indicator}>\n <CheckIcon className={cn(icon, menu.icon)} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n ))}\n </Menu.RadioGroup>\n </Menu.Content>\n </Menu.Root>\n );\n}\n\nexport function MinimalLiveVideoSkinTailwind(props: MinimalLiveVideoSkinProps): ReactNode {\n const { children, className, renderPoster, placeholder, style, ...rest } = props;\n\n const containerStyle = placeholder\n ? ({ '--media-poster-placeholder': `url(${placeholder})`, ...style } as CSSProperties)\n : style;\n\n return (\n <Container className={cn(container(false), className)} style={containerStyle} {...rest}>\n {children}\n\n <Poster className={poster(false)} render={renderPoster} />\n\n <BufferingIndicator\n render={(props) => (\n <div {...props} className={bufferingIndicator}>\n <SpinnerIcon className={icon} />\n </div>\n )}\n />\n\n <ErrorDialog.Root>\n <ErrorDialog.Popup className={error.root}>\n <div className={error.dialog}>\n <div className={error.content}>\n <ErrorDialog.Title className={error.title}></ErrorDialog.Title>\n <ErrorDialog.Description className={error.description} />\n </div>\n <div className={error.actions}>\n <ErrorDialog.Close className={cn(button.base, button.primary)}></ErrorDialog.Close>\n </div>\n </div>\n </ErrorDialog.Popup>\n </ErrorDialog.Root>\n\n <Controls.Root\n data-controls=\"\" // Used as a hook for Tailwind has-[] styles\n className={controls}\n >\n <Tooltip.Provider>\n <div className={buttonGroupStart}>\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PlayButton className={iconState.play.button} render={<Button />}>\n <RestartIcon className={cn(icon, iconState.play.restart)} />\n <PlayIcon className={cn(icon, iconState.play.play)} />\n <PauseIcon className={cn(icon, iconState.play.pause)} />\n </PlayButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <LiveButton className={cn(button.base, button.subtle, button.live)} />\n\n <VolumePopover />\n </div>\n\n <div className={spacer} aria-hidden=\"true\" />\n\n <div className={buttonGroupEnd}>\n <CaptionsTrigger />\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CastButton className={iconState.cast.button} render={<Button />}>\n <CastEnterIcon className={cn(icon, iconState.cast.enter)} />\n <CastExitIcon className={cn(icon, iconState.cast.exit)} />\n </CastButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <AirPlayButton className={iconState.airplay.button} render={<Button />}>\n <AirPlayEnterIcon className={cn(icon, iconState.airplay.enter)} />\n <AirPlayExitIcon className={cn(icon, iconState.airplay.exit)} />\n </AirPlayButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PiPButton className={iconState.pip.button} render={<Button />}>\n <PipEnterIcon className={cn(icon, iconState.pip.off)} />\n <PipExitIcon className={cn(icon, iconState.pip.on)} />\n </PiPButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <FullscreenButton className={iconState.fullscreen.button} render={<Button />}>\n <FullscreenEnterIcon className={cn(icon, iconState.fullscreen.enter)} />\n <FullscreenExitIcon className={cn(icon, iconState.fullscreen.exit)} />\n </FullscreenButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n </div>\n </Tooltip.Provider>\n </Controls.Root>\n\n <div className={overlay} />\n\n {/* Hotkeys */}\n <Hotkey keys=\"Space\" action=\"togglePaused\" />\n <Hotkey keys=\"k\" action=\"togglePaused\" />\n <Hotkey keys=\"m\" action=\"toggleMuted\" />\n <Hotkey keys=\"f\" action=\"toggleFullscreen\" />\n <Hotkey keys=\"c\" action=\"toggleSubtitles\" />\n <Hotkey keys=\"i\" action=\"togglePictureInPicture\" />\n <Hotkey keys=\"ArrowUp\" action=\"volumeStep\" value={0.05} />\n <Hotkey keys=\"ArrowDown\" action=\"volumeStep\" value={-0.05} />\n\n {/* Gestures */}\n <Gesture type=\"tap\" action=\"togglePaused\" pointer=\"mouse\" region=\"center\" />\n <Gesture type=\"tap\" action=\"toggleControls\" pointer=\"touch\" />\n <Gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\" />\n\n {/* Input Indicators */}\n <StatusAnnouncer className=\"sr-only\" />\n <div className={inputIndicatorOverlay}>\n <VolumeIndicator.Root className={volumeIndicator.root}>\n <VolumeIndicator.Fill className={volumeIndicator.content}>\n <VolumeHighIcon className={cn(volumeIndicator.icon.base, volumeIndicator.icon.high)} />\n <VolumeLowIcon className={cn(volumeIndicator.icon.base, volumeIndicator.icon.low)} />\n <VolumeOffIcon className={cn(volumeIndicator.icon.base, volumeIndicator.icon.off)} />\n <div aria-hidden=\"true\" className={volumeIndicator.progress} />\n <VolumeIndicator.Value className={volumeIndicator.value} />\n </VolumeIndicator.Fill>\n </VolumeIndicator.Root>\n\n <StatusIndicator.Root actions={TOP_STATUS_ACTIONS} className={statusIndicator.root}>\n <div className={statusIndicator.content}>\n <CaptionsOnIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.captionsOn)} />\n <CaptionsOffIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.captionsOff)} />\n <FullscreenEnterIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.fullscreenEnter)} />\n <FullscreenExitIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.fullscreenExit)} />\n <PipEnterIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.pipEnter)} />\n <PipExitIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.pipExit)} />\n <StatusIndicator.Value className={statusIndicator.value} />\n </div>\n </StatusIndicator.Root>\n\n <StatusIndicator.Root actions={CENTER_STATUS_ACTIONS} className={statusIndicator.playback.root}>\n <PlayIcon className={cn(statusIndicator.playback.icon.base, statusIndicator.playback.icon.play)} />\n <PauseIcon className={cn(statusIndicator.playback.icon.base, statusIndicator.playback.icon.pause)} />\n </StatusIndicator.Root>\n </div>\n </Container>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"minimal-skin.tailwind.js","names":["Popover.Root","Popover.Trigger","Popover.Popup","VolumeSlider.Root","VolumeSlider.Track","VolumeSlider.Fill","VolumeSlider.Thumb","Tooltip.Root","Tooltip.Trigger","Tooltip.Popup","Tooltip.Label","Tooltip.Shortcut","Menu.Root","Menu.Trigger","Menu.Content","Menu.RadioGroup","Menu.RadioItem","Menu.ItemIndicator","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","VolumeIndicator.Root","VolumeIndicator.Fill","VolumeIndicator.Value","StatusIndicator.Root","StatusIndicator.Value"],"sources":["../../../../src/presets/live-video/minimal-skin.tailwind.tsx"],"sourcesContent":["'use client';\n\nimport { captionsText } from '@videojs/core/i18n/text/menu';\nimport {\n bufferingIndicator,\n button,\n buttonGroupEnd,\n buttonGroupStart,\n container,\n controls,\n error,\n icon,\n iconState,\n inputIndicatorOverlay,\n menu,\n overlay,\n popup,\n poster,\n slider,\n spacer,\n statusIndicator,\n volumeIndicator,\n} from '@videojs/skins/minimal/tailwind/video.tailwind';\nimport { cn } from '@videojs/utils/style';\nimport { type ComponentProps, forwardRef, type ReactNode } from 'react';\nimport { useTranslator } from '@/i18n/context';\nimport {\n AirPlayEnterIcon,\n AirPlayExitIcon,\n CaptionsOffIcon,\n CaptionsOnIcon,\n CastEnterIcon,\n CastExitIcon,\n CheckIcon,\n FullscreenEnterIcon,\n FullscreenExitIcon,\n PauseIcon,\n PipEnterIcon,\n PipExitIcon,\n PlayIcon,\n RestartIcon,\n SpinnerIcon,\n VolumeHighIcon,\n VolumeLowIcon,\n VolumeOffIcon,\n} from '@/icons/minimal';\nimport { Container } from '@/player/container';\nimport { usePlayer } from '@/player/context';\nimport { AirPlayButton } from '@/ui/airplay-button';\nimport { BufferingIndicator } from '@/ui/buffering-indicator';\nimport { CaptionsButton } from '@/ui/captions-button';\nimport { useCaptionsOptions } from '@/ui/captions-radio-group';\nimport { CastButton } from '@/ui/cast-button';\nimport { Controls } from '@/ui/controls';\nimport { ErrorDialog } from '@/ui/error-dialog';\nimport { FullscreenButton } from '@/ui/fullscreen-button';\nimport { Gesture } from '@/ui/gesture';\nimport { Hotkey } from '@/ui/hotkey';\nimport { LiveButton } from '@/ui/live-button';\nimport { Menu } from '@/ui/menu';\nimport { MuteButton } from '@/ui/mute-button';\nimport { PiPButton } from '@/ui/pip-button';\nimport { PlayButton } from '@/ui/play-button';\nimport { Popover } from '@/ui/popover';\nimport { Poster } from '@/ui/poster';\nimport { StatusAnnouncer } from '@/ui/status-announcer';\nimport { StatusIndicator } from '@/ui/status-indicator';\nimport { Tooltip } from '@/ui/tooltip';\nimport { VolumeIndicator } from '@/ui/volume-indicator';\nimport { VolumeSlider } from '@/ui/volume-slider';\nimport type { MinimalLiveVideoSkinProps } from './minimal-skin';\n\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\nconst Button = forwardRef<HTMLButtonElement, ComponentProps<'button'>>(function Button({ className, ...props }, ref) {\n return (\n <button ref={ref} type=\"button\" className={cn(button.base, button.subtle, button.icon, className)} {...props} />\n );\n});\n\nconst SliderRoot = forwardRef<HTMLDivElement, ComponentProps<'div'>>(function SliderRoot({ className, ...props }, ref) {\n return <div ref={ref} className={cn(slider.root, className)} {...props} />;\n});\n\nconst SliderTrack = forwardRef<HTMLDivElement, ComponentProps<'div'>>(function SliderTrack(\n { className, ...props },\n ref\n) {\n return <div ref={ref} className={cn(slider.track, className)} {...props} />;\n});\n\nconst SliderFill = forwardRef<HTMLDivElement, ComponentProps<'div'> & { type?: 'fill' | 'buffer' }>(function SliderFill(\n { type = 'fill', className, ...props },\n ref\n) {\n return (\n <div\n ref={ref}\n className={cn(slider.fill.base, type === 'fill' ? slider.fill.fill : slider.fill.buffer, className)}\n {...props}\n />\n );\n});\n\nconst SliderThumb = forwardRef<HTMLDivElement, ComponentProps<'div'> & { persistent?: boolean }>(function SliderThumb(\n { persistent, className, ...props },\n ref\n) {\n return (\n <div\n ref={ref}\n className={cn(slider.thumb.base, persistent ? undefined : slider.thumb.interactive, className)}\n {...props}\n />\n );\n});\n\nfunction VolumePopover(): ReactNode {\n const volumeUnavailable = usePlayer((s) => s.volumeAvailability !== 'available');\n\n const muteButton = (\n <MuteButton className={iconState.mute.button} render={<Button />}>\n <VolumeOffIcon className={cn(icon, iconState.mute.volumeOff)} />\n <VolumeLowIcon className={cn(icon, iconState.mute.volumeLow)} />\n <VolumeHighIcon className={cn(icon, iconState.mute.volumeHigh)} />\n </MuteButton>\n );\n\n if (volumeUnavailable) return muteButton;\n\n return (\n <Popover.Root openOnHover delay={200} closeDelay={100} side=\"right\">\n <Popover.Trigger render={muteButton} />\n <Popover.Popup className={cn(popup.volume)}>\n <VolumeSlider.Root orientation=\"horizontal\" thumbAlignment=\"edge\" render={<SliderRoot />}>\n <VolumeSlider.Track render={<SliderTrack />}>\n <VolumeSlider.Fill render={<SliderFill />} />\n </VolumeSlider.Track>\n <VolumeSlider.Thumb render={(props) => <SliderThumb persistent {...props} />} />\n </VolumeSlider.Root>\n </Popover.Popup>\n </Popover.Root>\n );\n}\n\nfunction CaptionsTrigger(): ReactNode {\n const t = useTranslator();\n const captions = useCaptionsOptions();\n if (!captions) return null;\n\n const { disabled } = captions;\n\n if (!captions.showMenu) {\n return (\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CaptionsButton className={iconState.captions.button} render={<Button />}>\n <CaptionsOffIcon className={cn(icon, iconState.captions.off)} />\n <CaptionsOnIcon className={cn(icon, iconState.captions.on)} />\n </CaptionsButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n );\n }\n\n return (\n <Menu.Root side=\"top\" align=\"center\">\n <Menu.Trigger\n disabled={disabled}\n render={\n <CaptionsButton className={iconState.captions.button} render={<Button />}>\n <CaptionsOffIcon className={cn(icon, iconState.captions.off)} />\n <CaptionsOnIcon className={cn(icon, iconState.captions.on)} />\n </CaptionsButton>\n }\n />\n <Menu.Content className={cn(popup.popover, menu.root)}>\n <Menu.RadioGroup\n className={menu.group}\n value={captions.value}\n onValueChange={captions.setValue}\n aria-label={t(captionsText)}\n >\n {captions.options.map((option) => (\n <Menu.RadioItem key={option.value} className={menu.item} value={option.value} disabled={option.disabled}>\n <span>{option.label}</span>\n <Menu.ItemIndicator checked={option.value === captions.value} forceMount className={menu.indicator}>\n <CheckIcon className={cn(icon, menu.icon)} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n ))}\n </Menu.RadioGroup>\n </Menu.Content>\n </Menu.Root>\n );\n}\n\nexport function MinimalLiveVideoSkinTailwind(props: MinimalLiveVideoSkinProps): ReactNode {\n const { children, className, renderPoster, style, ...rest } = props;\n\n return (\n <Container className={cn(container(false), className)} style={style} {...rest}>\n {children}\n\n <Poster className={poster(false)} render={renderPoster} />\n\n <BufferingIndicator\n render={(props) => (\n <div {...props} className={bufferingIndicator}>\n <SpinnerIcon className={icon} />\n </div>\n )}\n />\n\n <ErrorDialog.Root>\n <ErrorDialog.Popup className={error.root}>\n <div className={error.dialog}>\n <div className={error.content}>\n <ErrorDialog.Title className={error.title}></ErrorDialog.Title>\n <ErrorDialog.Description className={error.description} />\n </div>\n <div className={error.actions}>\n <ErrorDialog.Close className={cn(button.base, button.primary)}></ErrorDialog.Close>\n </div>\n </div>\n </ErrorDialog.Popup>\n </ErrorDialog.Root>\n\n <Controls.Root\n data-controls=\"\" // Used as a hook for Tailwind has-[] styles\n className={controls}\n >\n <Tooltip.Provider>\n <div className={buttonGroupStart}>\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PlayButton className={iconState.play.button} render={<Button />}>\n <RestartIcon className={cn(icon, iconState.play.restart)} />\n <PlayIcon className={cn(icon, iconState.play.play)} />\n <PauseIcon className={cn(icon, iconState.play.pause)} />\n </PlayButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <LiveButton className={cn(button.base, button.subtle, button.live)} />\n\n <VolumePopover />\n </div>\n\n <div className={spacer} aria-hidden=\"true\" />\n\n <div className={buttonGroupEnd}>\n <CaptionsTrigger />\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CastButton className={iconState.cast.button} render={<Button />}>\n <CastEnterIcon className={cn(icon, iconState.cast.enter)} />\n <CastExitIcon className={cn(icon, iconState.cast.exit)} />\n </CastButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <AirPlayButton className={iconState.airplay.button} render={<Button />}>\n <AirPlayEnterIcon className={cn(icon, iconState.airplay.enter)} />\n <AirPlayExitIcon className={cn(icon, iconState.airplay.exit)} />\n </AirPlayButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PiPButton className={iconState.pip.button} render={<Button />}>\n <PipEnterIcon className={cn(icon, iconState.pip.off)} />\n <PipExitIcon className={cn(icon, iconState.pip.on)} />\n </PiPButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <FullscreenButton className={iconState.fullscreen.button} render={<Button />}>\n <FullscreenEnterIcon className={cn(icon, iconState.fullscreen.enter)} />\n <FullscreenExitIcon className={cn(icon, iconState.fullscreen.exit)} />\n </FullscreenButton>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label />\n <Tooltip.Shortcut className={popup.tooltipShortcut} />\n </Tooltip.Popup>\n </Tooltip.Root>\n </div>\n </Tooltip.Provider>\n </Controls.Root>\n\n <div className={overlay} />\n\n {/* Hotkeys */}\n <Hotkey keys=\"Space\" action=\"togglePaused\" />\n <Hotkey keys=\"k\" action=\"togglePaused\" />\n <Hotkey keys=\"m\" action=\"toggleMuted\" />\n <Hotkey keys=\"f\" action=\"toggleFullscreen\" />\n <Hotkey keys=\"c\" action=\"toggleSubtitles\" />\n <Hotkey keys=\"i\" action=\"togglePictureInPicture\" />\n <Hotkey keys=\"ArrowUp\" action=\"volumeStep\" value={0.05} />\n <Hotkey keys=\"ArrowDown\" action=\"volumeStep\" value={-0.05} />\n\n {/* Gestures */}\n <Gesture type=\"tap\" action=\"togglePaused\" pointer=\"mouse\" region=\"center\" />\n <Gesture type=\"tap\" action=\"toggleControls\" pointer=\"touch\" />\n <Gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\" />\n\n {/* Input Indicators */}\n <StatusAnnouncer className=\"sr-only\" />\n <div className={inputIndicatorOverlay}>\n <VolumeIndicator.Root className={volumeIndicator.root}>\n <VolumeIndicator.Fill className={volumeIndicator.content}>\n <VolumeHighIcon className={cn(volumeIndicator.icon.base, volumeIndicator.icon.high)} />\n <VolumeLowIcon className={cn(volumeIndicator.icon.base, volumeIndicator.icon.low)} />\n <VolumeOffIcon className={cn(volumeIndicator.icon.base, volumeIndicator.icon.off)} />\n <div aria-hidden=\"true\" className={volumeIndicator.progress} />\n <VolumeIndicator.Value className={volumeIndicator.value} />\n </VolumeIndicator.Fill>\n </VolumeIndicator.Root>\n\n <StatusIndicator.Root actions={TOP_STATUS_ACTIONS} className={statusIndicator.root}>\n <div className={statusIndicator.content}>\n <CaptionsOnIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.captionsOn)} />\n <CaptionsOffIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.captionsOff)} />\n <FullscreenEnterIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.fullscreenEnter)} />\n <FullscreenExitIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.fullscreenExit)} />\n <PipEnterIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.pipEnter)} />\n <PipExitIcon className={cn(statusIndicator.icon.base, statusIndicator.icon.pipExit)} />\n <StatusIndicator.Value className={statusIndicator.value} />\n </div>\n </StatusIndicator.Root>\n\n <StatusIndicator.Root actions={CENTER_STATUS_ACTIONS} className={statusIndicator.playback.root}>\n <PlayIcon className={cn(statusIndicator.playback.icon.base, statusIndicator.playback.icon.play)} />\n <PauseIcon className={cn(statusIndicator.playback.icon.base, statusIndicator.playback.icon.pause)} />\n </StatusIndicator.Root>\n </div>\n </Container>\n );\n}\n"],"mappings":"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"}
|
|
@@ -452,7 +452,7 @@
|
|
|
452
452
|
@media (prefers-reduced-motion: reduce) {
|
|
453
453
|
.media-default-skin .media-button {
|
|
454
454
|
scale: 1;
|
|
455
|
-
transition-property: background-color, color
|
|
455
|
+
transition-property: background-color, color;
|
|
456
456
|
will-change: auto;
|
|
457
457
|
}
|
|
458
458
|
}
|
|
@@ -497,8 +497,7 @@
|
|
|
497
497
|
transition: opacity 0.25s;
|
|
498
498
|
}
|
|
499
499
|
.media-default-skin media-poster:not([data-visible]),
|
|
500
|
-
.media-default-skin > img:not([data-visible])
|
|
501
|
-
.media-default-skin > img[data-visible]:not([data-loaded]) {
|
|
500
|
+
.media-default-skin > img:not([data-visible]) {
|
|
502
501
|
opacity: 0;
|
|
503
502
|
}
|
|
504
503
|
.media-default-skin media-poster ::slotted(img),
|
|
@@ -517,30 +516,6 @@
|
|
|
517
516
|
border-radius: inherit;
|
|
518
517
|
}
|
|
519
518
|
|
|
520
|
-
/* Blurred placeholder: HTML path targets media-poster::before, React path targets the skin container::before */
|
|
521
|
-
.media-default-skin media-poster::before,
|
|
522
|
-
.media-default-skin::before {
|
|
523
|
-
position: absolute;
|
|
524
|
-
inset: 0;
|
|
525
|
-
pointer-events: none;
|
|
526
|
-
content: "";
|
|
527
|
-
background-image: var(--media-poster-placeholder, none);
|
|
528
|
-
background-repeat: no-repeat;
|
|
529
|
-
background-position: var(--media-object-position, center);
|
|
530
|
-
background-size: var(--media-object-fit, contain);
|
|
531
|
-
filter: blur(var(--media-poster-placeholder-blur, 20px));
|
|
532
|
-
}
|
|
533
|
-
|
|
534
|
-
/* React path: hidden by default, transitions in while poster loads */
|
|
535
|
-
.media-default-skin::before {
|
|
536
|
-
opacity: 0;
|
|
537
|
-
transition: opacity 0.25s;
|
|
538
|
-
}
|
|
539
|
-
/* Show placeholder while the poster is visible but not yet loaded */
|
|
540
|
-
.media-default-skin:has(img[data-visible]:not([data-loaded]))::before {
|
|
541
|
-
opacity: 1;
|
|
542
|
-
}
|
|
543
|
-
|
|
544
519
|
.media-default-skin:fullscreen media-poster ::slotted(img),
|
|
545
520
|
.media-default-skin:fullscreen media-poster img,
|
|
546
521
|
.media-default-skin:fullscreen > img {
|
|
@@ -1145,7 +1120,6 @@
|
|
|
1145
1120
|
transition-timing-function: ease-out;
|
|
1146
1121
|
transition-duration: var(--menu-transition-duration);
|
|
1147
1122
|
transition-property: translate, filter;
|
|
1148
|
-
will-change: translate, filter;
|
|
1149
1123
|
|
|
1150
1124
|
&:where([data-starting-style], [data-ending-style]) {
|
|
1151
1125
|
overflow: hidden;
|
|
@@ -1329,7 +1303,6 @@
|
|
|
1329
1303
|
transition:
|
|
1330
1304
|
translate var(--menu-transition-duration) ease-out,
|
|
1331
1305
|
filter var(--menu-transition-duration) ease-out;
|
|
1332
|
-
will-change: translate, filter;
|
|
1333
1306
|
}
|
|
1334
1307
|
|
|
1335
1308
|
&[data-submenu-expanded="true"] > :not([data-submenu]) {
|
|
@@ -1883,12 +1856,10 @@
|
|
|
1883
1856
|
|
|
1884
1857
|
@media (pointer: fine) {
|
|
1885
1858
|
transition-property: filter, opacity, scale, translate;
|
|
1886
|
-
will-change: filter, opacity, scale, translate;
|
|
1887
1859
|
}
|
|
1888
1860
|
|
|
1889
1861
|
@media (pointer: coarse) {
|
|
1890
1862
|
transition-property: opacity, scale, translate;
|
|
1891
|
-
will-change: opacity, scale, translate;
|
|
1892
1863
|
}
|
|
1893
1864
|
}
|
|
1894
1865
|
|
|
@@ -1973,12 +1944,10 @@
|
|
|
1973
1944
|
|
|
1974
1945
|
@media (pointer: fine) {
|
|
1975
1946
|
transition-property: filter, opacity, scale, translate;
|
|
1976
|
-
will-change: filter, opacity, scale, translate;
|
|
1977
1947
|
}
|
|
1978
1948
|
|
|
1979
1949
|
@media (pointer: coarse) {
|
|
1980
1950
|
transition-property: opacity, scale, translate;
|
|
1981
|
-
will-change: opacity, scale, translate;
|
|
1982
1951
|
}
|
|
1983
1952
|
|
|
1984
1953
|
@container media-root (width > 42rem) {
|
|
@@ -170,14 +170,10 @@ function CaptionsTrigger() {
|
|
|
170
170
|
});
|
|
171
171
|
}
|
|
172
172
|
function LiveVideoSkin(props) {
|
|
173
|
-
const { children, className, renderPoster,
|
|
174
|
-
const containerStyle = placeholder ? {
|
|
175
|
-
"--media-poster-placeholder": `url(${placeholder})`,
|
|
176
|
-
...style
|
|
177
|
-
} : style;
|
|
173
|
+
const { children, className, renderPoster, style, ...rest } = props;
|
|
178
174
|
return /* @__PURE__ */ jsxs(Container, {
|
|
179
175
|
className: cn("media-default-skin media-default-skin--video", className),
|
|
180
|
-
style
|
|
176
|
+
style,
|
|
181
177
|
...rest,
|
|
182
178
|
children: [
|
|
183
179
|
children,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"skin.js","names":["Popover.Root","Popover.Trigger","Popover.Popup","VolumeSlider.Root","VolumeSlider.Track","VolumeSlider.Fill","VolumeSlider.Thumb","Tooltip.Root","Tooltip.Trigger","Tooltip.Popup","Tooltip.Label","Tooltip.Shortcut","Menu.Root","Menu.Trigger","Menu.Content","Menu.RadioGroup","Menu.RadioItem","Menu.ItemIndicator","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","VolumeIndicator.Root","VolumeIndicator.Fill","VolumeIndicator.Value","StatusIndicator.Root","StatusIndicator.Value"],"sources":["../../../../src/presets/live-video/skin.tsx"],"sourcesContent":["'use client';\n\nimport { captionsText } from '@videojs/core/i18n/text/menu';\nimport { cn } from '@videojs/utils/style';\nimport { type ComponentProps, type CSSProperties, forwardRef, type ReactNode } from 'react';\nimport { useTranslator } from '@/i18n/context';\nimport {\n AirPlayEnterIcon,\n AirPlayExitIcon,\n CaptionsOffIcon,\n CaptionsOnIcon,\n CastEnterIcon,\n CastExitIcon,\n CheckIcon,\n FullscreenEnterIcon,\n FullscreenExitIcon,\n PauseIcon,\n PipEnterIcon,\n PipExitIcon,\n PlayIcon,\n RestartIcon,\n SpinnerIcon,\n VolumeHighIcon,\n VolumeLowIcon,\n VolumeOffIcon,\n} from '@/icons';\nimport { Container } from '@/player/container';\nimport { usePlayer } from '@/player/context';\nimport { AirPlayButton } from '@/ui/airplay-button';\nimport { BufferingIndicator } from '@/ui/buffering-indicator';\nimport { CaptionsButton } from '@/ui/captions-button';\nimport { useCaptionsOptions } from '@/ui/captions-radio-group';\nimport { CastButton } from '@/ui/cast-button';\nimport { Controls } from '@/ui/controls';\nimport { ErrorDialog } from '@/ui/error-dialog';\nimport { FullscreenButton } from '@/ui/fullscreen-button';\nimport { Gesture } from '@/ui/gesture';\nimport { Hotkey } from '@/ui/hotkey';\nimport { LiveButton } from '@/ui/live-button';\nimport { Menu } from '@/ui/menu';\nimport { MuteButton } from '@/ui/mute-button';\nimport { PiPButton } from '@/ui/pip-button';\nimport { PlayButton } from '@/ui/play-button';\nimport { Popover } from '@/ui/popover';\nimport { Poster } from '@/ui/poster';\nimport { StatusAnnouncer } from '@/ui/status-announcer';\nimport { StatusIndicator } from '@/ui/status-indicator';\nimport { Tooltip } from '@/ui/tooltip';\nimport { VolumeIndicator } from '@/ui/volume-indicator';\nimport { VolumeSlider } from '@/ui/volume-slider';\nimport type { BaseVideoSkinProps } from '../types';\n\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\nexport type LiveVideoSkinProps = BaseVideoSkinProps;\n\nconst Button = forwardRef<HTMLButtonElement, ComponentProps<'button'>>(function Button({ className, ...props }, ref) {\n return (\n <button\n ref={ref}\n type=\"button\"\n className={cn('media-button media-button--subtle media-button--icon', className)}\n {...props}\n />\n );\n});\n\nfunction VolumePopover(): ReactNode {\n const volumeUnavailable = usePlayer((s) => s.volumeAvailability !== 'available');\n\n const muteButton = (\n <MuteButton className=\"media-button--mute\" render={<Button />}>\n <VolumeOffIcon className=\"media-icon media-icon--volume-off\" />\n <VolumeLowIcon className=\"media-icon media-icon--volume-low\" />\n <VolumeHighIcon className=\"media-icon media-icon--volume-high\" />\n </MuteButton>\n );\n\n if (volumeUnavailable) return muteButton;\n\n return (\n <Popover.Root openOnHover delay={200} closeDelay={100} side=\"top\">\n <Popover.Trigger render={muteButton} />\n <Popover.Popup className=\"media-surface media-popover media-popover--volume\">\n <VolumeSlider.Root className=\"media-slider\" orientation=\"vertical\" thumbAlignment=\"edge\">\n <VolumeSlider.Track className=\"media-slider__track\">\n <VolumeSlider.Fill className=\"media-slider__fill\" />\n </VolumeSlider.Track>\n <VolumeSlider.Thumb className=\"media-slider__thumb media-slider__thumb--persistent\" />\n </VolumeSlider.Root>\n </Popover.Popup>\n </Popover.Root>\n );\n}\n\n/**\n * Default video skin configured for live playback. Mirrors {@link VideoSkin}\n * but omits the time slider and the duration / current-time displays. A\n * flexible spacer stretches between the start and end button groups so they\n * sit at opposite edges of the control bar.\n */\nfunction CaptionsTrigger(): ReactNode {\n const t = useTranslator();\n const captions = useCaptionsOptions();\n if (!captions) return null;\n\n const { disabled } = captions;\n\n if (!captions.showMenu) {\n return (\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CaptionsButton className=\"media-button--captions\" render={<Button />}>\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n </CaptionsButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n );\n }\n\n const { options, setValue, value } = captions;\n\n return (\n <Menu.Root side=\"top\" align=\"center\">\n <Menu.Trigger\n disabled={disabled}\n render={\n <CaptionsButton className=\"media-button--captions\" render={<Button />}>\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n </CaptionsButton>\n }\n />\n <Menu.Content className=\"media-surface media-popover media-menu media-menu--captions\">\n <Menu.RadioGroup\n className=\"media-menu__group\"\n value={value}\n onValueChange={setValue}\n aria-label={t(captionsText)}\n >\n {options.map((option) => (\n <Menu.RadioItem\n key={option.value}\n className=\"media-menu__item\"\n value={option.value}\n disabled={option.disabled}\n >\n <span>{option.label}</span>\n <Menu.ItemIndicator checked={option.value === value} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-icon\" />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n ))}\n </Menu.RadioGroup>\n </Menu.Content>\n </Menu.Root>\n );\n}\n\nexport function LiveVideoSkin(props: LiveVideoSkinProps): ReactNode {\n const { children, className, renderPoster, placeholder, style, ...rest } = props;\n\n const containerStyle = placeholder\n ? ({ '--media-poster-placeholder': `url(${placeholder})`, ...style } as CSSProperties)\n : style;\n\n return (\n <Container\n className={cn('media-default-skin media-default-skin--video', className)}\n style={containerStyle}\n {...rest}\n >\n {children}\n\n <Poster render={renderPoster} />\n\n <BufferingIndicator\n render={(props) => (\n <div {...props} className=\"media-buffering-indicator\">\n <SpinnerIcon className=\"media-icon\" />\n </div>\n )}\n />\n\n <ErrorDialog.Root>\n <ErrorDialog.Popup className=\"media-error\">\n <div className=\"media-error__dialog media-surface\">\n <div className=\"media-error__content\">\n <ErrorDialog.Title className=\"media-error__title\"></ErrorDialog.Title>\n <ErrorDialog.Description className=\"media-error__description\" />\n </div>\n <div className=\"media-error__actions\">\n <ErrorDialog.Close className=\"media-button media-button--primary\"></ErrorDialog.Close>\n </div>\n </div>\n </ErrorDialog.Popup>\n </ErrorDialog.Root>\n\n <Controls.Root className=\"media-surface media-controls media-controls--root\">\n <Tooltip.Provider>\n <div className=\"media-surface media-controls media-controls--primary\">\n <div className=\"media-button-group\">\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PlayButton className=\"media-button--play\" render={<Button />}>\n <RestartIcon className=\"media-icon media-icon--restart\" />\n <PlayIcon className=\"media-icon media-icon--play\" />\n <PauseIcon className=\"media-icon media-icon--pause\" />\n </PlayButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <LiveButton className=\"media-button media-button--subtle media-button--live\" />\n </div>\n\n <div className=\"media-time-controls\" aria-hidden=\"true\" />\n\n <div className=\"media-button-group\">\n <VolumePopover />\n\n <CaptionsTrigger />\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CastButton className=\"media-button--cast\" render={<Button />}>\n <CastEnterIcon className=\"media-icon media-icon--cast-enter\" />\n <CastExitIcon className=\"media-icon media-icon--cast-exit\" />\n </CastButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <AirPlayButton className=\"media-button--airplay\" render={<Button />}>\n <AirPlayEnterIcon className=\"media-icon media-icon--airplay-enter\" />\n <AirPlayExitIcon className=\"media-icon media-icon--airplay-exit\" />\n </AirPlayButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PiPButton className=\"media-button--pip\" render={<Button />}>\n <PipEnterIcon className=\"media-icon media-icon--pip-enter\" />\n <PipExitIcon className=\"media-icon media-icon--pip-exit\" />\n </PiPButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <FullscreenButton className=\"media-button--fullscreen\" render={<Button />}>\n <FullscreenEnterIcon className=\"media-icon media-icon--fullscreen-enter\" />\n <FullscreenExitIcon className=\"media-icon media-icon--fullscreen-exit\" />\n </FullscreenButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n </div>\n </div>\n </Tooltip.Provider>\n </Controls.Root>\n\n <div className=\"media-overlay\" />\n\n {/* Hotkeys */}\n <Hotkey keys=\"Space\" action=\"togglePaused\" />\n <Hotkey keys=\"k\" action=\"togglePaused\" />\n <Hotkey keys=\"m\" action=\"toggleMuted\" />\n <Hotkey keys=\"f\" action=\"toggleFullscreen\" />\n <Hotkey keys=\"c\" action=\"toggleSubtitles\" />\n <Hotkey keys=\"i\" action=\"togglePictureInPicture\" />\n <Hotkey keys=\"ArrowUp\" action=\"volumeStep\" value={0.05} />\n <Hotkey keys=\"ArrowDown\" action=\"volumeStep\" value={-0.05} />\n\n {/* Gestures */}\n <Gesture type=\"tap\" action=\"togglePaused\" pointer=\"mouse\" region=\"center\" />\n <Gesture type=\"tap\" action=\"toggleControls\" pointer=\"touch\" />\n <Gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\" />\n\n {/* Input Indicators */}\n <StatusAnnouncer className=\"media-sr-only\" />\n <div className=\"media-input-indicator-overlay\">\n <VolumeIndicator.Root className=\"media-surface media-volume-indicator\">\n <VolumeIndicator.Fill className=\"media-volume-indicator__content\">\n <VolumeHighIcon className=\"media-icon media-icon--volume-high\" />\n <VolumeLowIcon className=\"media-icon media-icon--volume-low\" />\n <VolumeOffIcon className=\"media-icon media-icon--volume-off\" />\n <VolumeIndicator.Value className=\"media-volume-indicator__value\" />\n </VolumeIndicator.Fill>\n </VolumeIndicator.Root>\n\n <StatusIndicator.Root\n actions={TOP_STATUS_ACTIONS}\n className=\"media-surface media-status-indicator media-status-indicator--state\"\n >\n <div className=\"media-status-indicator__content\">\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <FullscreenEnterIcon className=\"media-icon media-icon--fullscreen-enter\" />\n <FullscreenExitIcon className=\"media-icon media-icon--fullscreen-exit\" />\n <PipEnterIcon className=\"media-icon media-icon--pip-enter\" />\n <PipExitIcon className=\"media-icon media-icon--pip-exit\" />\n <StatusIndicator.Value className=\"media-status-indicator__value\" />\n </div>\n </StatusIndicator.Root>\n\n <StatusIndicator.Root\n actions={CENTER_STATUS_ACTIONS}\n className=\"media-status-indicator media-status-indicator--playback\"\n >\n <PlayIcon className=\"media-icon media-icon--play\" />\n <PauseIcon className=\"media-icon media-icon--pause\" />\n </StatusIndicator.Root>\n </div>\n </Container>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"skin.js","names":["Popover.Root","Popover.Trigger","Popover.Popup","VolumeSlider.Root","VolumeSlider.Track","VolumeSlider.Fill","VolumeSlider.Thumb","Tooltip.Root","Tooltip.Trigger","Tooltip.Popup","Tooltip.Label","Tooltip.Shortcut","Menu.Root","Menu.Trigger","Menu.Content","Menu.RadioGroup","Menu.RadioItem","Menu.ItemIndicator","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","VolumeIndicator.Root","VolumeIndicator.Fill","VolumeIndicator.Value","StatusIndicator.Root","StatusIndicator.Value"],"sources":["../../../../src/presets/live-video/skin.tsx"],"sourcesContent":["'use client';\n\nimport { captionsText } from '@videojs/core/i18n/text/menu';\nimport { cn } from '@videojs/utils/style';\nimport { type ComponentProps, forwardRef, type ReactNode } from 'react';\nimport { useTranslator } from '@/i18n/context';\nimport {\n AirPlayEnterIcon,\n AirPlayExitIcon,\n CaptionsOffIcon,\n CaptionsOnIcon,\n CastEnterIcon,\n CastExitIcon,\n CheckIcon,\n FullscreenEnterIcon,\n FullscreenExitIcon,\n PauseIcon,\n PipEnterIcon,\n PipExitIcon,\n PlayIcon,\n RestartIcon,\n SpinnerIcon,\n VolumeHighIcon,\n VolumeLowIcon,\n VolumeOffIcon,\n} from '@/icons';\nimport { Container } from '@/player/container';\nimport { usePlayer } from '@/player/context';\nimport { AirPlayButton } from '@/ui/airplay-button';\nimport { BufferingIndicator } from '@/ui/buffering-indicator';\nimport { CaptionsButton } from '@/ui/captions-button';\nimport { useCaptionsOptions } from '@/ui/captions-radio-group';\nimport { CastButton } from '@/ui/cast-button';\nimport { Controls } from '@/ui/controls';\nimport { ErrorDialog } from '@/ui/error-dialog';\nimport { FullscreenButton } from '@/ui/fullscreen-button';\nimport { Gesture } from '@/ui/gesture';\nimport { Hotkey } from '@/ui/hotkey';\nimport { LiveButton } from '@/ui/live-button';\nimport { Menu } from '@/ui/menu';\nimport { MuteButton } from '@/ui/mute-button';\nimport { PiPButton } from '@/ui/pip-button';\nimport { PlayButton } from '@/ui/play-button';\nimport { Popover } from '@/ui/popover';\nimport { Poster } from '@/ui/poster';\nimport { StatusAnnouncer } from '@/ui/status-announcer';\nimport { StatusIndicator } from '@/ui/status-indicator';\nimport { Tooltip } from '@/ui/tooltip';\nimport { VolumeIndicator } from '@/ui/volume-indicator';\nimport { VolumeSlider } from '@/ui/volume-slider';\nimport type { BaseVideoSkinProps } from '../types';\n\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\nexport type LiveVideoSkinProps = BaseVideoSkinProps;\n\nconst Button = forwardRef<HTMLButtonElement, ComponentProps<'button'>>(function Button({ className, ...props }, ref) {\n return (\n <button\n ref={ref}\n type=\"button\"\n className={cn('media-button media-button--subtle media-button--icon', className)}\n {...props}\n />\n );\n});\n\nfunction VolumePopover(): ReactNode {\n const volumeUnavailable = usePlayer((s) => s.volumeAvailability !== 'available');\n\n const muteButton = (\n <MuteButton className=\"media-button--mute\" render={<Button />}>\n <VolumeOffIcon className=\"media-icon media-icon--volume-off\" />\n <VolumeLowIcon className=\"media-icon media-icon--volume-low\" />\n <VolumeHighIcon className=\"media-icon media-icon--volume-high\" />\n </MuteButton>\n );\n\n if (volumeUnavailable) return muteButton;\n\n return (\n <Popover.Root openOnHover delay={200} closeDelay={100} side=\"top\">\n <Popover.Trigger render={muteButton} />\n <Popover.Popup className=\"media-surface media-popover media-popover--volume\">\n <VolumeSlider.Root className=\"media-slider\" orientation=\"vertical\" thumbAlignment=\"edge\">\n <VolumeSlider.Track className=\"media-slider__track\">\n <VolumeSlider.Fill className=\"media-slider__fill\" />\n </VolumeSlider.Track>\n <VolumeSlider.Thumb className=\"media-slider__thumb media-slider__thumb--persistent\" />\n </VolumeSlider.Root>\n </Popover.Popup>\n </Popover.Root>\n );\n}\n\n/**\n * Default video skin configured for live playback. Mirrors {@link VideoSkin}\n * but omits the time slider and the duration / current-time displays. A\n * flexible spacer stretches between the start and end button groups so they\n * sit at opposite edges of the control bar.\n */\nfunction CaptionsTrigger(): ReactNode {\n const t = useTranslator();\n const captions = useCaptionsOptions();\n if (!captions) return null;\n\n const { disabled } = captions;\n\n if (!captions.showMenu) {\n return (\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CaptionsButton className=\"media-button--captions\" render={<Button />}>\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n </CaptionsButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n );\n }\n\n const { options, setValue, value } = captions;\n\n return (\n <Menu.Root side=\"top\" align=\"center\">\n <Menu.Trigger\n disabled={disabled}\n render={\n <CaptionsButton className=\"media-button--captions\" render={<Button />}>\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n </CaptionsButton>\n }\n />\n <Menu.Content className=\"media-surface media-popover media-menu media-menu--captions\">\n <Menu.RadioGroup\n className=\"media-menu__group\"\n value={value}\n onValueChange={setValue}\n aria-label={t(captionsText)}\n >\n {options.map((option) => (\n <Menu.RadioItem\n key={option.value}\n className=\"media-menu__item\"\n value={option.value}\n disabled={option.disabled}\n >\n <span>{option.label}</span>\n <Menu.ItemIndicator checked={option.value === value} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-icon\" />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n ))}\n </Menu.RadioGroup>\n </Menu.Content>\n </Menu.Root>\n );\n}\n\nexport function LiveVideoSkin(props: LiveVideoSkinProps): ReactNode {\n const { children, className, renderPoster, style, ...rest } = props;\n\n return (\n <Container className={cn('media-default-skin media-default-skin--video', className)} style={style} {...rest}>\n {children}\n\n <Poster render={renderPoster} />\n\n <BufferingIndicator\n render={(props) => (\n <div {...props} className=\"media-buffering-indicator\">\n <SpinnerIcon className=\"media-icon\" />\n </div>\n )}\n />\n\n <ErrorDialog.Root>\n <ErrorDialog.Popup className=\"media-error\">\n <div className=\"media-error__dialog media-surface\">\n <div className=\"media-error__content\">\n <ErrorDialog.Title className=\"media-error__title\"></ErrorDialog.Title>\n <ErrorDialog.Description className=\"media-error__description\" />\n </div>\n <div className=\"media-error__actions\">\n <ErrorDialog.Close className=\"media-button media-button--primary\"></ErrorDialog.Close>\n </div>\n </div>\n </ErrorDialog.Popup>\n </ErrorDialog.Root>\n\n <Controls.Root className=\"media-surface media-controls media-controls--root\">\n <Tooltip.Provider>\n <div className=\"media-surface media-controls media-controls--primary\">\n <div className=\"media-button-group\">\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PlayButton className=\"media-button--play\" render={<Button />}>\n <RestartIcon className=\"media-icon media-icon--restart\" />\n <PlayIcon className=\"media-icon media-icon--play\" />\n <PauseIcon className=\"media-icon media-icon--pause\" />\n </PlayButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <LiveButton className=\"media-button media-button--subtle media-button--live\" />\n </div>\n\n <div className=\"media-time-controls\" aria-hidden=\"true\" />\n\n <div className=\"media-button-group\">\n <VolumePopover />\n\n <CaptionsTrigger />\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <CastButton className=\"media-button--cast\" render={<Button />}>\n <CastEnterIcon className=\"media-icon media-icon--cast-enter\" />\n <CastExitIcon className=\"media-icon media-icon--cast-exit\" />\n </CastButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <AirPlayButton className=\"media-button--airplay\" render={<Button />}>\n <AirPlayEnterIcon className=\"media-icon media-icon--airplay-enter\" />\n <AirPlayExitIcon className=\"media-icon media-icon--airplay-exit\" />\n </AirPlayButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <PiPButton className=\"media-button--pip\" render={<Button />}>\n <PipEnterIcon className=\"media-icon media-icon--pip-enter\" />\n <PipExitIcon className=\"media-icon media-icon--pip-exit\" />\n </PiPButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <FullscreenButton className=\"media-button--fullscreen\" render={<Button />}>\n <FullscreenEnterIcon className=\"media-icon media-icon--fullscreen-enter\" />\n <FullscreenExitIcon className=\"media-icon media-icon--fullscreen-exit\" />\n </FullscreenButton>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label />\n <Tooltip.Shortcut className=\"media-tooltip__kbd\" />\n </Tooltip.Popup>\n </Tooltip.Root>\n </div>\n </div>\n </Tooltip.Provider>\n </Controls.Root>\n\n <div className=\"media-overlay\" />\n\n {/* Hotkeys */}\n <Hotkey keys=\"Space\" action=\"togglePaused\" />\n <Hotkey keys=\"k\" action=\"togglePaused\" />\n <Hotkey keys=\"m\" action=\"toggleMuted\" />\n <Hotkey keys=\"f\" action=\"toggleFullscreen\" />\n <Hotkey keys=\"c\" action=\"toggleSubtitles\" />\n <Hotkey keys=\"i\" action=\"togglePictureInPicture\" />\n <Hotkey keys=\"ArrowUp\" action=\"volumeStep\" value={0.05} />\n <Hotkey keys=\"ArrowDown\" action=\"volumeStep\" value={-0.05} />\n\n {/* Gestures */}\n <Gesture type=\"tap\" action=\"togglePaused\" pointer=\"mouse\" region=\"center\" />\n <Gesture type=\"tap\" action=\"toggleControls\" pointer=\"touch\" />\n <Gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\" />\n\n {/* Input Indicators */}\n <StatusAnnouncer className=\"media-sr-only\" />\n <div className=\"media-input-indicator-overlay\">\n <VolumeIndicator.Root className=\"media-surface media-volume-indicator\">\n <VolumeIndicator.Fill className=\"media-volume-indicator__content\">\n <VolumeHighIcon className=\"media-icon media-icon--volume-high\" />\n <VolumeLowIcon className=\"media-icon media-icon--volume-low\" />\n <VolumeOffIcon className=\"media-icon media-icon--volume-off\" />\n <VolumeIndicator.Value className=\"media-volume-indicator__value\" />\n </VolumeIndicator.Fill>\n </VolumeIndicator.Root>\n\n <StatusIndicator.Root\n actions={TOP_STATUS_ACTIONS}\n className=\"media-surface media-status-indicator media-status-indicator--state\"\n >\n <div className=\"media-status-indicator__content\">\n <CaptionsOnIcon className=\"media-icon media-icon--captions-on\" />\n <CaptionsOffIcon className=\"media-icon media-icon--captions-off\" />\n <FullscreenEnterIcon className=\"media-icon media-icon--fullscreen-enter\" />\n <FullscreenExitIcon className=\"media-icon media-icon--fullscreen-exit\" />\n <PipEnterIcon className=\"media-icon media-icon--pip-enter\" />\n <PipExitIcon className=\"media-icon media-icon--pip-exit\" />\n <StatusIndicator.Value className=\"media-status-indicator__value\" />\n </div>\n </StatusIndicator.Root>\n\n <StatusIndicator.Root\n actions={CENTER_STATUS_ACTIONS}\n className=\"media-status-indicator media-status-indicator--playback\"\n >\n <PlayIcon className=\"media-icon media-icon--play\" />\n <PauseIcon className=\"media-icon media-icon--pause\" />\n </StatusIndicator.Root>\n </div>\n </Container>\n );\n}\n"],"mappings":"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"}
|
|
@@ -201,14 +201,10 @@ function CaptionsTrigger() {
|
|
|
201
201
|
});
|
|
202
202
|
}
|
|
203
203
|
function LiveVideoSkinTailwind(props) {
|
|
204
|
-
const { children, className, renderPoster,
|
|
205
|
-
const containerStyle = placeholder ? {
|
|
206
|
-
"--media-poster-placeholder": `url(${placeholder})`,
|
|
207
|
-
...style
|
|
208
|
-
} : style;
|
|
204
|
+
const { children, className, renderPoster, style, ...rest } = props;
|
|
209
205
|
return /* @__PURE__ */ jsxs(Container, {
|
|
210
206
|
className: cn(container(false), className),
|
|
211
|
-
style
|
|
207
|
+
style,
|
|
212
208
|
...rest,
|
|
213
209
|
children: [
|
|
214
210
|
children,
|