npm - @videojs/react - Versions diffs - 10.0.0-beta.28 → 10.0.0-beta.29 - Mend

@videojs/react 10.0.0-beta.28 → 10.0.0-beta.29

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.

Files changed (259) hide show

package/dist/default/presets/video/minimal-skin.tailwind.js CHANGED Viewed

@@ -2,7 +2,6 @@
 import { useTranslator } from "../../i18n/context.js";
 import { usePlayer } from "../../player/context.js";
 import { Container } from "../../player/container.js";
-import { isRenderProp } from "../../utils/use-render.js";
 import { AirPlayButton } from "../../ui/airplay-button/airplay-button.js";
 import { AlertDialogPopup } from "../../ui/alert-dialog/alert-dialog-popup.js";
 import { useAudioTrackOptions } from "../../ui/audio-track/use-audio-track-options.js";
@@ -103,9 +102,8 @@ import { volumeIndicator } from "../../skins/dist/default/minimal/tailwind/compo
 import { buttonGroupEnd, buttonGroupStart, container, controls, error, menu, popup, slider, thumbnail, time } from "../../skins/dist/default/minimal/tailwind/video.tailwind.js";
 import { forwardRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { isString } from "@videojs/utils/predicate";
-import { audioText, captionsText, playbackRateText, qualityText, settingsText, speedText } from "@videojs/core/i18n/text/menu";
 import { cn } from "@videojs/utils/style";
+import { audioText, captionsText, playbackRateText, qualityText, settingsText, speedText } from "@videojs/core/i18n/text/menu";
 //#region src/presets/video/minimal-skin.tailwind.tsx
 const SEEK_TIME = 10;
 const TOP_STATUS_ACTIONS = [
@@ -392,7 +390,7 @@ function SettingsMenu() {
 	});
 }
 function MinimalVideoSkinTailwind(props) {
-	const { children, className, poster: posterProp, placeholder, style, ...rest } = props;
+	const { children, className, renderPoster, placeholder, style, ...rest } = props;
 	const containerStyle = placeholder ? {
 		"--media-poster-placeholder": `url(${placeholder})`,
 		...style
@@ -403,10 +401,9 @@ function MinimalVideoSkinTailwind(props) {
 		...rest,
 		children: [
 			children,
-			posterProp && /* @__PURE__ */ jsx(Poster, {
-				src: isString(posterProp) ? posterProp : void 0,
-				render: isRenderProp(posterProp) ? posterProp : void 0,
-				className: poster(false)
+			/* @__PURE__ */ jsx(Poster, {
+				className: poster(false),
+				render: renderPoster
 			}),
 			/* @__PURE__ */ jsx(BufferingIndicator, { render: (props) => /* @__PURE__ */ jsx("div", {
 				...props,

package/dist/default/presets/video/minimal-skin.tailwind.js.map CHANGED Viewed

	@@ -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","Menu.Root","Tooltip.Root","Tooltip.Trigger","Menu.Trigger","Tooltip.Popup","Tooltip.Label","Menu.Content","Menu.Item","Menu.Separator","Menu.RadioItem","Menu.ItemIndicator","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","Tooltip.Shortcut","Time.Group","Time.Value","Time.Separator","TimeSlider.Root","TimeSlider.Chapters","TimeSlider.Track","TimeSlider.Buffer","TimeSlider.Fill","TimeSlider.Thumb","TimeSlider.Preview","Slider.Thumbnail","TimeSlider.ChapterTitle","TimeSlider.Value","VolumeIndicator.Root","VolumeIndicator.Fill","VolumeIndicator.Value","StatusIndicator.Root","StatusIndicator.Value","SeekIndicator.Root","SeekIndicator.Value"],"sources":["../../../../src/presets/video/minimal-skin.tailwind.tsx"],"sourcesContent":["'use client';\n\nimport {\n audioText,\n captionsText,\n playbackRateText,\n qualityText,\n settingsText,\n speedText,\n} from '@videojs/core/i18n/text/menu';\nimport {\n badge,\n bufferingIndicator,\n button,\n buttonGroupEnd,\n buttonGroupStart,\n container,\n controls,\n error,\n icon,\n iconFlipped,\n iconState,\n inputIndicatorOverlay,\n menu,\n overlay,\n popup,\n poster,\n seekIndicator,\n slider,\n statusIndicator,\n thumbnail,\n time,\n volumeIndicator,\n} from '@videojs/skins/minimal/tailwind/video.tailwind';\nimport { isString } from '@videojs/utils/predicate';\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 ChevronIcon,\n FullscreenEnterIcon,\n FullscreenExitIcon,\n GearIcon,\n PauseIcon,\n PipEnterIcon,\n PipExitIcon,\n PlayIcon,\n QualityIcon,\n RestartIcon,\n SpeechIcon,\n SpeedIcon,\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 { useAudioTrackOptions } from '@/ui/audio-track';\nimport { AudioTrackRadioGroup } from '@/ui/audio-track-radio-group';\nimport { BufferingIndicator } from '@/ui/buffering-indicator';\nimport { CaptionsButton } from '@/ui/captions-button';\nimport { CaptionsRadioGroup, 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 { Menu } from '@/ui/menu';\nimport { MuteButton } from '@/ui/mute-button';\nimport { PiPButton } from '@/ui/pip-button';\nimport { PlayButton } from '@/ui/play-button';\nimport { usePlaybackRateOptions } from '@/ui/playback-rate';\nimport { PlaybackRateRadioGroup } from '@/ui/playback-rate-radio-group';\nimport { Popover } from '@/ui/popover';\nimport { Poster } from '@/ui/poster';\nimport { useQualityOptions } from '@/ui/quality';\nimport { QualityRadioGroup } from '@/ui/quality-radio-group';\nimport { SeekIndicator } from '@/ui/seek-indicator';\nimport { Slider } from '@/ui/slider';\nimport { StatusAnnouncer } from '@/ui/status-announcer';\nimport { StatusIndicator } from '@/ui/status-indicator';\nimport { Time } from '@/ui/time';\nimport { TimeSlider } from '@/ui/time-slider';\nimport { Tooltip } from '@/ui/tooltip';\nimport { VolumeIndicator } from '@/ui/volume-indicator';\nimport { VolumeSlider } from '@/ui/volume-slider';\nimport { isRenderProp } from '@/utils/use-render';\nimport type { MinimalVideoSkinProps } from './minimal-skin';\n\nconst SEEK_TIME = 10;\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\n/* --------------------------------------- Components ---------------------------------------- /\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={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 MenuChevron({ flipped = false }: { flipped?: boolean }): ReactNode {\n return <ChevronIcon className={cn(icon, menu.icon, menu.chevron, flipped ? iconFlipped : undefined)} />;\n}\n\nfunction SettingsMenu(): ReactNode {\n const t = useTranslator();\n const playbackRate = usePlaybackRateOptions();\n const quality = useQualityOptions();\n const audioTrack = useAudioTrackOptions();\n const captions = useCaptionsOptions();\n const hasPlaybackRate = playbackRate?.state.availability === 'available';\n const hasQuality = quality?.state.availability === 'available';\n const hasAudioTrack = audioTrack?.state.availability === 'available';\n const hasCaptions = captions?.state.availability === 'available';\n\n if (!hasPlaybackRate && !hasQuality && !hasAudioTrack && !hasCaptions) return null;\n\n return (\n <Menu.Root side=\"top\" align=\"center\">\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <Menu.Trigger\n aria-label={t(settingsText)}\n render={<Button className={cn(button.icon, menu.settingsTrigger)} />}\n >\n <GearIcon className={cn(icon, menu.settingsIcon)} />\n </Menu.Trigger>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label>{t(settingsText)}</Tooltip.Label>\n </Tooltip.Popup>\n </Tooltip.Root>\n <Menu.Content className={menu.settings}>\n <div className={menu.group}>\n {hasQuality ? (\n <Menu.Root>\n <Menu.Trigger\n className={menu.item}\n render={(props) => (\n <div {...props}>\n <QualityIcon className={cn(icon, menu.icon)} />\n <span>{t(qualityText)}</span>\n <span className={menu.hint}>\n <span className={menu.hintLabel}>{quality.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className={menu.submenuPanel}>\n <Menu.Item className={menu.back}>\n <MenuChevron flipped />\n {t(qualityText)}\n </Menu.Item>\n <Menu.Separator className={menu.separator} />\n <QualityRadioGroup\n className={menu.group}\n aria-label={t(qualityText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className={menu.item}>\n <span>\n {item.label}\n {item.tier ? <sup className={menu.tier}>{item.tier}</sup> : null}\n </span>\n {item.badge ? <span className={badge}>{item.badge}</span> : null}\n <Menu.ItemIndicator checked={item.checked} forceMount className={menu.indicator}>\n <CheckIcon className={cn(icon, menu.icon)} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n )}\n />\n </Menu.Content>\n </Menu.Root>\n ) : null}\n\n {hasAudioTrack ? (\n <Menu.Root>\n <Menu.Trigger\n className={menu.item}\n render={(props) => (\n <div {...props}>\n <SpeechIcon className={icon} />\n <span>{t(audioText)}</span>\n <span className={menu.hint}>\n <span className={menu.hintLabel}>{audioTrack.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className={menu.submenuPanel}>\n <Menu.Item className={menu.back}>\n <MenuChevron flipped />\n {t(audioText)}\n </Menu.Item>\n <Menu.Separator className={menu.separator} />\n <AudioTrackRadioGroup\n className={menu.group}\n aria-label={t(audioText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className={menu.item}>\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className={menu.indicator}>\n <CheckIcon className={icon} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n )}\n />\n </Menu.Content>\n </Menu.Root>\n ) : null}\n\n {hasPlaybackRate ? (\n <Menu.Root>\n <Menu.Trigger\n className={menu.item}\n render={(props) => (\n <div {...props}>\n <SpeedIcon className={cn(icon, menu.icon)} />\n <span>{t(speedText)}</span>\n <span className={menu.hint}>\n <span className={menu.hintLabel}>{playbackRate.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className={menu.submenuPanel}>\n <Menu.Item className={menu.back}>\n <MenuChevron flipped />\n {t(speedText)}\n </Menu.Item>\n <Menu.Separator className={menu.separator} />\n <PlaybackRateRadioGroup\n className={menu.group}\n aria-label={t(playbackRateText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className={menu.item}>\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className={menu.indicator}>\n <CheckIcon className={cn(icon, menu.icon)} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n )}\n />\n </Menu.Content>\n </Menu.Root>\n ) : null}\n\n {hasCaptions ? (\n <Menu.Root>\n <Menu.Trigger\n className={menu.item}\n render={(props) => (\n <div {...props}>\n <CaptionsOffIcon className={cn(icon, menu.icon)} />\n <span>{t(captionsText)}</span>\n <span className={menu.hint}>\n <span className={menu.hintLabel}>{captions.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className={menu.submenuPanel}>\n <Menu.Item className={menu.back}>\n <MenuChevron flipped />\n {t(captionsText)}\n </Menu.Item>\n <Menu.Separator className={menu.separator} />\n <CaptionsRadioGroup\n className={menu.group}\n aria-label={t(captionsText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className={menu.item}>\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className={menu.indicator}>\n <CheckIcon className={cn(icon, menu.icon)} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n )}\n />\n </Menu.Content>\n </Menu.Root>\n ) : null}\n </div>\n </Menu.Content>\n </Menu.Root>\n );\n}\n\n/ ------------------------------------------ Skin ------------------------------------------- /\n\nexport function MinimalVideoSkinTailwind(props: MinimalVideoSkinProps): ReactNode {\n const { children, className, poster: posterProp, 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 {posterProp && (\n <Poster\n src={isString(posterProp) ? posterProp : undefined}\n render={isRenderProp(posterProp) ? posterProp : undefined}\n className={poster(false)}\n />\n )}\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 <VolumePopover />\n </div>\n\n <div className={time.controls}>\n <Time.Group className={time.group}>\n <Time.Value toggle type=\"current\" className={time.current} />\n <Time.Separator className={time.separator} />\n <Time.Value type=\"duration\" className={time.duration} />\n </Time.Group>\n\n <TimeSlider.Root render={<SliderRoot />}>\n <TimeSlider.Chapters\n className={slider.chapters}\n renderChapter={(props) => (\n <div {...props} className={cn(props.className, slider.chapter.base)}>\n <TimeSlider.Track render={<div className={slider.chapter.track} />}>\n <TimeSlider.Buffer render={<div className={cn(slider.fill.base, slider.fill.buffer)} />} />\n <TimeSlider.Fill render={<div className={cn(slider.fill.base, slider.fill.fill)} />} />\n </TimeSlider.Track>\n </div>\n )}\n />\n <TimeSlider.Thumb render={<SliderThumb />} />\n <TimeSlider.Preview className={slider.preview}>\n <div className={cn(thumbnail.root, slider.thumbnail)}>\n <Slider.Thumbnail className={thumbnail.image} />\n <SpinnerIcon className={cn(icon, thumbnail.spinner)} />\n </div>\n <div className={slider.value}>\n <TimeSlider.ChapterTitle className={slider.chapterTitle} />\n <TimeSlider.Value type=\"pointer\" />\n </div>\n </TimeSlider.Preview>\n </TimeSlider.Root>\n </div>\n\n <div className={cn(buttonGroupEnd, menu.settingsGroup)}>\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 <SettingsMenu />\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=\"ArrowRight\" action=\"seekStep\" value={SEEK_TIME / 2} />\n <Hotkey keys=\"ArrowLeft\" action=\"seekStep\" value={-(SEEK_TIME / 2)} />\n <Hotkey keys=\"l\" action=\"seekStep\" value={SEEK_TIME} />\n <Hotkey keys=\"j\" action=\"seekStep\" value={-SEEK_TIME} />\n <Hotkey keys=\"ArrowUp\" action=\"volumeStep\" value={0.05} />\n <Hotkey keys=\"ArrowDown\" action=\"volumeStep\" value={-0.05} />\n <Hotkey keys=\"0-9\" action=\"seekToPercent\" />\n <Hotkey keys=\"Home\" action=\"seekToPercent\" value={0} />\n <Hotkey keys=\"End\" action=\"seekToPercent\" value={100} />\n <Hotkey keys=\">\" action=\"speedUp\" />\n <Hotkey keys=\"<\" action=\"speedDown\" />\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=\"seekStep\" value={-SEEK_TIME} region=\"left\" />\n <Gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\" />\n <Gesture type=\"doubletap\" action=\"seekStep\" value={SEEK_TIME} region=\"right\" />\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 <SeekIndicator.Root className={seekIndicator.root}>\n <ChevronIcon className={seekIndicator.icon} />\n <SeekIndicator.Value className={seekIndicator.value} />\n </SeekIndicator.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","Menu.Root","Tooltip.Root","Tooltip.Trigger","Menu.Trigger","Tooltip.Popup","Tooltip.Label","Menu.Content","Menu.Item","Menu.Separator","Menu.RadioItem","Menu.ItemIndicator","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","Tooltip.Shortcut","Time.Group","Time.Value","Time.Separator","TimeSlider.Root","TimeSlider.Chapters","TimeSlider.Track","TimeSlider.Buffer","TimeSlider.Fill","TimeSlider.Thumb","TimeSlider.Preview","Slider.Thumbnail","TimeSlider.ChapterTitle","TimeSlider.Value","VolumeIndicator.Root","VolumeIndicator.Fill","VolumeIndicator.Value","StatusIndicator.Root","StatusIndicator.Value","SeekIndicator.Root","SeekIndicator.Value"],"sources":["../../../../src/presets/video/minimal-skin.tailwind.tsx"],"sourcesContent":["'use client';\n\nimport {\n audioText,\n captionsText,\n playbackRateText,\n qualityText,\n settingsText,\n speedText,\n} from '@videojs/core/i18n/text/menu';\nimport {\n badge,\n bufferingIndicator,\n button,\n buttonGroupEnd,\n buttonGroupStart,\n container,\n controls,\n error,\n icon,\n iconFlipped,\n iconState,\n inputIndicatorOverlay,\n menu,\n overlay,\n popup,\n poster,\n seekIndicator,\n slider,\n statusIndicator,\n thumbnail,\n time,\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 ChevronIcon,\n FullscreenEnterIcon,\n FullscreenExitIcon,\n GearIcon,\n PauseIcon,\n PipEnterIcon,\n PipExitIcon,\n PlayIcon,\n QualityIcon,\n RestartIcon,\n SpeechIcon,\n SpeedIcon,\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 { useAudioTrackOptions } from '@/ui/audio-track';\nimport { AudioTrackRadioGroup } from '@/ui/audio-track-radio-group';\nimport { BufferingIndicator } from '@/ui/buffering-indicator';\nimport { CaptionsButton } from '@/ui/captions-button';\nimport { CaptionsRadioGroup, 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 { Menu } from '@/ui/menu';\nimport { MuteButton } from '@/ui/mute-button';\nimport { PiPButton } from '@/ui/pip-button';\nimport { PlayButton } from '@/ui/play-button';\nimport { usePlaybackRateOptions } from '@/ui/playback-rate';\nimport { PlaybackRateRadioGroup } from '@/ui/playback-rate-radio-group';\nimport { Popover } from '@/ui/popover';\nimport { Poster } from '@/ui/poster';\nimport { useQualityOptions } from '@/ui/quality';\nimport { QualityRadioGroup } from '@/ui/quality-radio-group';\nimport { SeekIndicator } from '@/ui/seek-indicator';\nimport { Slider } from '@/ui/slider';\nimport { StatusAnnouncer } from '@/ui/status-announcer';\nimport { StatusIndicator } from '@/ui/status-indicator';\nimport { Time } from '@/ui/time';\nimport { TimeSlider } from '@/ui/time-slider';\nimport { Tooltip } from '@/ui/tooltip';\nimport { VolumeIndicator } from '@/ui/volume-indicator';\nimport { VolumeSlider } from '@/ui/volume-slider';\nimport type { MinimalVideoSkinProps } from './minimal-skin';\n\nconst SEEK_TIME = 10;\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\n/* --------------------------------------- Components ---------------------------------------- /\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={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 MenuChevron({ flipped = false }: { flipped?: boolean }): ReactNode {\n return <ChevronIcon className={cn(icon, menu.icon, menu.chevron, flipped ? iconFlipped : undefined)} />;\n}\n\nfunction SettingsMenu(): ReactNode {\n const t = useTranslator();\n const playbackRate = usePlaybackRateOptions();\n const quality = useQualityOptions();\n const audioTrack = useAudioTrackOptions();\n const captions = useCaptionsOptions();\n const hasPlaybackRate = playbackRate?.state.availability === 'available';\n const hasQuality = quality?.state.availability === 'available';\n const hasAudioTrack = audioTrack?.state.availability === 'available';\n const hasCaptions = captions?.state.availability === 'available';\n\n if (!hasPlaybackRate && !hasQuality && !hasAudioTrack && !hasCaptions) return null;\n\n return (\n <Menu.Root side=\"top\" align=\"center\">\n <Tooltip.Root side=\"top\">\n <Tooltip.Trigger\n render={\n <Menu.Trigger\n aria-label={t(settingsText)}\n render={<Button className={cn(button.icon, menu.settingsTrigger)} />}\n >\n <GearIcon className={cn(icon, menu.settingsIcon)} />\n </Menu.Trigger>\n }\n />\n <Tooltip.Popup className={cn(popup.tooltip)}>\n <Tooltip.Label>{t(settingsText)}</Tooltip.Label>\n </Tooltip.Popup>\n </Tooltip.Root>\n <Menu.Content className={menu.settings}>\n <div className={menu.group}>\n {hasQuality ? (\n <Menu.Root>\n <Menu.Trigger\n className={menu.item}\n render={(props) => (\n <div {...props}>\n <QualityIcon className={cn(icon, menu.icon)} />\n <span>{t(qualityText)}</span>\n <span className={menu.hint}>\n <span className={menu.hintLabel}>{quality.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className={menu.submenuPanel}>\n <Menu.Item className={menu.back}>\n <MenuChevron flipped />\n {t(qualityText)}\n </Menu.Item>\n <Menu.Separator className={menu.separator} />\n <QualityRadioGroup\n className={menu.group}\n aria-label={t(qualityText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className={menu.item}>\n <span>\n {item.label}\n {item.tier ? <sup className={menu.tier}>{item.tier}</sup> : null}\n </span>\n {item.badge ? <span className={badge}>{item.badge}</span> : null}\n <Menu.ItemIndicator checked={item.checked} forceMount className={menu.indicator}>\n <CheckIcon className={cn(icon, menu.icon)} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n )}\n />\n </Menu.Content>\n </Menu.Root>\n ) : null}\n\n {hasAudioTrack ? (\n <Menu.Root>\n <Menu.Trigger\n className={menu.item}\n render={(props) => (\n <div {...props}>\n <SpeechIcon className={icon} />\n <span>{t(audioText)}</span>\n <span className={menu.hint}>\n <span className={menu.hintLabel}>{audioTrack.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className={menu.submenuPanel}>\n <Menu.Item className={menu.back}>\n <MenuChevron flipped />\n {t(audioText)}\n </Menu.Item>\n <Menu.Separator className={menu.separator} />\n <AudioTrackRadioGroup\n className={menu.group}\n aria-label={t(audioText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className={menu.item}>\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className={menu.indicator}>\n <CheckIcon className={icon} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n )}\n />\n </Menu.Content>\n </Menu.Root>\n ) : null}\n\n {hasPlaybackRate ? (\n <Menu.Root>\n <Menu.Trigger\n className={menu.item}\n render={(props) => (\n <div {...props}>\n <SpeedIcon className={cn(icon, menu.icon)} />\n <span>{t(speedText)}</span>\n <span className={menu.hint}>\n <span className={menu.hintLabel}>{playbackRate.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className={menu.submenuPanel}>\n <Menu.Item className={menu.back}>\n <MenuChevron flipped />\n {t(speedText)}\n </Menu.Item>\n <Menu.Separator className={menu.separator} />\n <PlaybackRateRadioGroup\n className={menu.group}\n aria-label={t(playbackRateText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className={menu.item}>\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className={menu.indicator}>\n <CheckIcon className={cn(icon, menu.icon)} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n )}\n />\n </Menu.Content>\n </Menu.Root>\n ) : null}\n\n {hasCaptions ? (\n <Menu.Root>\n <Menu.Trigger\n className={menu.item}\n render={(props) => (\n <div {...props}>\n <CaptionsOffIcon className={cn(icon, menu.icon)} />\n <span>{t(captionsText)}</span>\n <span className={menu.hint}>\n <span className={menu.hintLabel}>{captions.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className={menu.submenuPanel}>\n <Menu.Item className={menu.back}>\n <MenuChevron flipped />\n {t(captionsText)}\n </Menu.Item>\n <Menu.Separator className={menu.separator} />\n <CaptionsRadioGroup\n className={menu.group}\n aria-label={t(captionsText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className={menu.item}>\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className={menu.indicator}>\n <CheckIcon className={cn(icon, menu.icon)} />\n </Menu.ItemIndicator>\n </Menu.RadioItem>\n )}\n />\n </Menu.Content>\n </Menu.Root>\n ) : null}\n </div>\n </Menu.Content>\n </Menu.Root>\n );\n}\n\n/ ------------------------------------------ Skin ------------------------------------------- /\n\nexport function MinimalVideoSkinTailwind(props: MinimalVideoSkinProps): 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 <VolumePopover />\n </div>\n\n <div className={time.controls}>\n <Time.Group className={time.group}>\n <Time.Value toggle type=\"current\" className={time.current} />\n <Time.Separator className={time.separator} />\n <Time.Value type=\"duration\" className={time.duration} />\n </Time.Group>\n\n <TimeSlider.Root render={<SliderRoot />}>\n <TimeSlider.Chapters\n className={slider.chapters}\n renderChapter={(props) => (\n <div {...props} className={cn(props.className, slider.chapter.base)}>\n <TimeSlider.Track render={<div className={slider.chapter.track} />}>\n <TimeSlider.Buffer render={<div className={cn(slider.fill.base, slider.fill.buffer)} />} />\n <TimeSlider.Fill render={<div className={cn(slider.fill.base, slider.fill.fill)} />} />\n </TimeSlider.Track>\n </div>\n )}\n />\n <TimeSlider.Thumb render={<SliderThumb />} />\n <TimeSlider.Preview className={slider.preview}>\n <div className={cn(thumbnail.root, slider.thumbnail)}>\n <Slider.Thumbnail className={thumbnail.image} />\n <SpinnerIcon className={cn(icon, thumbnail.spinner)} />\n </div>\n <div className={slider.value}>\n <TimeSlider.ChapterTitle className={slider.chapterTitle} />\n <TimeSlider.Value type=\"pointer\" />\n </div>\n </TimeSlider.Preview>\n </TimeSlider.Root>\n </div>\n\n <div className={cn(buttonGroupEnd, menu.settingsGroup)}>\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 <SettingsMenu />\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=\"ArrowRight\" action=\"seekStep\" value={SEEK_TIME / 2} />\n <Hotkey keys=\"ArrowLeft\" action=\"seekStep\" value={-(SEEK_TIME / 2)} />\n <Hotkey keys=\"l\" action=\"seekStep\" value={SEEK_TIME} />\n <Hotkey keys=\"j\" action=\"seekStep\" value={-SEEK_TIME} />\n <Hotkey keys=\"ArrowUp\" action=\"volumeStep\" value={0.05} />\n <Hotkey keys=\"ArrowDown\" action=\"volumeStep\" value={-0.05} />\n <Hotkey keys=\"0-9\" action=\"seekToPercent\" />\n <Hotkey keys=\"Home\" action=\"seekToPercent\" value={0} />\n <Hotkey keys=\"End\" action=\"seekToPercent\" value={100} />\n <Hotkey keys=\">\" action=\"speedUp\" />\n <Hotkey keys=\"<\" action=\"speedDown\" />\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=\"seekStep\" value={-SEEK_TIME} region=\"left\" />\n <Gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\" />\n <Gesture type=\"doubletap\" action=\"seekStep\" value={SEEK_TIME} region=\"right\" />\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 <SeekIndicator.Root className={seekIndicator.root}>\n <ChevronIcon className={seekIndicator.icon} />\n <SeekIndicator.Value className={seekIndicator.value} />\n </SeekIndicator.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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"}

package/dist/default/presets/video/skin.css CHANGED Viewed

@@ -557,7 +557,7 @@
     position: relative;
     display: block;
     max-width: var(--thumbnail-max-width);
-    max-height: var(--max-height);
+    max-height: var(--thumbnail-max-height);
     overflow: clip;
     border-radius: inherit;
@@ -612,8 +612,7 @@
   --track-size: calc(var(--spacing) * 1);
   --track-highlighted-size: calc(var(--spacing) * 1.75);
   --track-border-radius: 99px;
-  --thumb-size: calc(var(--spacing) * 2.5);
-  --thumb-active-size: calc(var(--spacing) * 3);
+  --thumb-size: calc(var(--spacing) * 3);
   --chapter-gap: calc(var(--spacing) * 1);
   --chapter-inset-start: calc(var(--chapter-gap) / 2);
   --chapter-inset-end: calc(var(--chapter-gap) / 2);
@@ -666,13 +665,22 @@
       inset-block: 0;
       left: 0;
       width: 100%;
-      transition-property: clip-path;
     }
     &[data-orientation="vertical"] {
       inset-inline: 0;
       bottom: 0;
       height: 100%;
-      transition-property: clip-path;
+    }
+    @media (prefers-reduced-motion: no-preference) {
+      transition: clip-path 200ms ease-out;
+    }
+  }
+  &[data-dragging],
+  &[data-seeking] {
+    .media-slider__fill,
+    .media-slider__buffer {
+      transition-duration: 0ms;
     }
   }
@@ -699,6 +707,14 @@
       clip-path: inset(calc(100% - var(--media-slider-fill)) 0 0 0 round var(--track-border-radius));
     }
   }
+  &[data-dragging] {
+    .media-slider__fill[data-orientation="horizontal"] {
+      clip-path: inset(0 calc(100% - var(--media-slider-pointer)) 0 0 round var(--track-border-radius));
+    }
+    .media-slider__fill[data-orientation="vertical"] {
+      clip-path: inset(calc(100% - var(--media-slider-pointer)) 0 0 0 round var(--track-border-radius));
+    }
+  }
   /* Chapters */
   .media-slider__chapters {
@@ -780,45 +796,6 @@
     }
   }
-  /* Dragging — thumb and fill follow the pointer position */
-  &[data-dragging] {
-    .media-slider__thumb[data-orientation="horizontal"] {
-      left: var(--media-slider-pointer);
-    }
-    .media-slider__thumb[data-orientation="vertical"] {
-      top: calc(100% - var(--media-slider-pointer));
-    }
-    .media-slider__fill[data-orientation="horizontal"] {
-      clip-path: inset(0 calc(100% - var(--media-slider-pointer)) 0 0 round var(--track-border-radius));
-    }
-    .media-slider__fill[data-orientation="vertical"] {
-      clip-path: inset(calc(100% - var(--media-slider-pointer)) 0 0 0 round var(--track-border-radius));
-    }
-  }
-  @media (prefers-reduced-motion: no-preference) {
-    .media-slider__thumb {
-      transition-property: opacity, height, width, outline-offset, left, top;
-    }
-    .media-slider__fill {
-      transition-timing-function: linear;
-      transition-duration: 200ms;
-    }
-    .media-slider__buffer {
-      transition-timing-function: ease-out;
-      transition-duration: 250ms;
-    }
-  }
-  &[data-dragging],
-  &[data-seeking] {
-    .media-slider__thumb,
-    .media-slider__fill,
-    .media-slider__buffer {
-      transition-duration: 0ms;
-    }
-  }
   /* Thumb */
   .media-slider__thumb {
     position: absolute;
@@ -835,10 +812,8 @@
       0 1px 3px 0 oklch(0 0 0 / 0.35),
       0 1px 2px -1px oklch(0 0 0 / 0.35);
     opacity: 0;
+    scale: 0.8;
     translate: -50% -50%;
-    transition-timing-function: ease-out;
-    transition-duration: 150ms;
-    transition-property: opacity, height, width, outline-offset;
     &[data-orientation="horizontal"] {
       top: 50%;
@@ -855,22 +830,12 @@
       opacity: 1;
     }
-    @media (hover: hover) and (pointer: fine) {
-      &:hover {
-        outline-color: oklch(from currentColor l c h / 0.15);
-        outline-offset: 0;
-      }
-    }
     &::after {
       position: absolute;
       inset: -4px;
       content: "";
       border-radius: inherit;
       box-shadow: 0 0 0 2px currentColor;
-      transition-timing-function: ease-out;
-      transition-duration: 150ms;
-      transition-property: opacity, scale;
     }
     &:not(:focus-visible)::after {
@@ -879,37 +844,70 @@
     }
     &.media-slider__thumb--persistent {
-      width: var(--thumb-active-size);
-      height: var(--thumb-active-size);
       opacity: 1;
+      scale: 1;
+    }
+    @media (hover: hover) and (pointer: fine) {
+      &:hover {
+        outline-color: oklch(from currentColor l c h / 0.15);
+        outline-offset: 0;
+      }
     }
-  }
-  &:active .media-slider__thumb,
-  &:focus-within .media-slider__thumb {
-    width: var(--thumb-active-size);
-    height: var(--thumb-active-size);
+    @media (prefers-reduced-motion: no-preference) {
+      transition-timing-function: ease-out;
+      transition-duration: 150ms;
+      transition-property: opacity, outline-offset, left, top, scale;
+      &::after {
+        transition-timing-function: ease-out;
+        transition-duration: 150ms;
+        transition-property: opacity, scale;
+      }
+    }
   }
   @media (hover: hover) and (pointer: fine) {
     &:hover .media-slider__thumb {
       opacity: 1;
+      scale: 1;
+    }
+  }
+  &[data-dragging] .media-slider__thumb {
+    opacity: 1;
+    scale: 0.9;
+    @media (prefers-reduced-motion: no-preference) {
+      transition-property: opacity, outline-offset, scale;
+    }
+    &[data-orientation="horizontal"] {
+      left: var(--media-slider-pointer);
+    }
+    &[data-orientation="vertical"] {
+      top: calc(100% - var(--media-slider-pointer));
     }
   }
   /* Preview */
   .media-slider__preview {
-    --max-width: min(calc(var(--spacing) * 48), 100cqi);
-    --max-height: calc(var(--spacing) * 32);
+    --max-size-factor: 36;
+    --max-size: min(calc(var(--spacing) * var(--max-size-factor)), 100cqi);
-    min-width: var(--max-width);
+    min-width: var(--max-size);
     height: calc(var(--spacing) * 1);
+    @container media-root (width > 42rem) {
+      --max-size-factor: 48;
+    }
     .media-slider__thumbnail,
     .media-slider__value {
       position: absolute;
       left: 50%;
-      max-width: var(--max-width);
+      max-width: var(--max-size);
       opacity: 0;
       filter: blur(8px);
       transform-origin: bottom;
@@ -920,7 +918,8 @@
     }
     .media-slider__thumbnail {
-      --thumbnail-max-width: var(--max-width);
+      --thumbnail-max-width: var(--max-size);
+      --thumbnail-max-height: var(--max-size);
       bottom: calc(100% + (var(--spacing) * 9));
     }
@@ -934,7 +933,7 @@
     .media-slider__chapter-title {
       min-width: 0;
-      max-width: var(--max-width);
+      max-width: var(--max-size);
       padding-inline: calc(var(--spacing) * 6);
       overflow: hidden;
       text-overflow: ellipsis;
@@ -1681,8 +1680,8 @@
    still in the DOM — just `display: none` — so its animations would keep
    running. Set the variables to `none` to short-circuit the keyframes. */
 .media-button--airplay:not([data-airplay-state="connected"]) {
-  --media-icon--airplay__fill-animation: none;
-  --media-icon--airplay__triangle-animation: none;
+  --media-icon-airplay-fill-animation: none;
+  --media-icon-airplay-triangle-animation: none;
 }
 @media (prefers-reduced-motion: reduce) {
@@ -1849,6 +1848,12 @@
   .media-controls--primary,
   .media-controls--secondary {
     position: absolute;
+  }
+  /* Primary must be higher for the preview/thumbnail */
+  .media-controls--primary {
+    z-index: 20;
+  }
+  .media-controls--secondary {
     z-index: 10;
   }
@@ -1865,6 +1870,11 @@
     transform-origin: top;
   }
+  .media-time-controls {
+    flex: 1;
+    padding-inline: calc(var(--spacing) * 2);
+  }
   @container media-root (width < 32rem) {
     .media-controls--primary,
     .media-controls--secondary {
@@ -1915,6 +1925,10 @@
         }
       }
     }
+    .media-button--captions {
+      display: none;
+    }
   }
   @container media-root (width >= 32rem) {
@@ -1951,11 +1965,10 @@
         translate: 0 4px;
       }
     }
-  }
-  .media-time-controls {
-    flex: 1;
-    padding-inline: calc(var(--spacing) * 3);
+    .media-time-controls {
+      padding-inline: calc(var(--spacing) * 3);
+    }
   }
   @media (pointer: fine) {

package/dist/default/presets/video/skin.js CHANGED Viewed

@@ -2,7 +2,6 @@
 import { useTranslator } from "../../i18n/context.js";
 import { usePlayer } from "../../player/context.js";
 import { Container } from "../../player/container.js";
-import { isRenderProp } from "../../utils/use-render.js";
 import { AirPlayButton } from "../../ui/airplay-button/airplay-button.js";
 import { AlertDialogPopup } from "../../ui/alert-dialog/alert-dialog-popup.js";
 import { useAudioTrackOptions } from "../../ui/audio-track/use-audio-track-options.js";
@@ -89,9 +88,8 @@ import VolumeLowIcon from "../../icons/dist/react/default/volume-low.js";
 import VolumeOffIcon from "../../icons/dist/react/default/volume-off.js";
 import { forwardRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { isString } from "@videojs/utils/predicate";
-import { audioText, captionsText, playbackRateText, qualityText, settingsText, speedText } from "@videojs/core/i18n/text/menu";
 import { cn } from "@videojs/utils/style";
+import { audioText, captionsText, playbackRateText, qualityText, settingsText, speedText } from "@videojs/core/i18n/text/menu";
 //#region src/presets/video/skin.tsx
 const SEEK_TIME = 10;
 const TOP_STATUS_ACTIONS = [
@@ -400,7 +398,7 @@ function FullscreenControl() {
 	});
 }
 function VideoSkin(props) {
-	const { children, className, poster, placeholder, style, ...rest } = props;
+	const { children, className, renderPoster, placeholder, style, ...rest } = props;
 	const containerStyle = placeholder ? {
 		"--media-poster-placeholder": `url(${placeholder})`,
 		...style
@@ -411,10 +409,7 @@ function VideoSkin(props) {
 		...rest,
 		children: [
 			children,
-			poster && /* @__PURE__ */ jsx(Poster, {
-				src: isString(poster) ? poster : void 0,
-				render: isRenderProp(poster) ? poster : void 0
-			}),
+			/* @__PURE__ */ jsx(Poster, { render: renderPoster }),
 			/* @__PURE__ */ jsx(BufferingIndicator, { render: (props) => /* @__PURE__ */ jsx("div", {
 				...props,
 				className: "media-buffering-indicator",