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/dev/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/dev/presets/video/skin.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"skin.d.ts","names":[],"sources":["../../../../src/presets/video/skin.tsx"],"mappings":";;;~~KA+EY~~,iBAAiB;iBAkTb,UAAU,OAAO,iBAAiB"}
1	+ {"version":3,"file":"skin.d.ts","names":[],"sources":["../../../../src/presets/video/skin.tsx"],"mappings":";;;KA6EY,iBAAiB;iBAkTb,UAAU,OAAO,iBAAiB"}

package/dist/dev/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",

package/dist/dev/presets/video/skin.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"skin.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","Tooltip.Shortcut","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","Time.Value","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/skin.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 { 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';\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 { BaseVideoSkinProps } from '../types';\n\nconst SEEK_TIME = 10;\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\nexport type VideoSkinProps = 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\nfunction MenuChevron({ flipped = false }: { flipped?: boolean }): ReactNode {\n return <ChevronIcon className={cn('media-icon media-menu__chevron', flipped ? 'media-icon--flipped' : 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 aria-label={t(settingsText)} className=\"media-button--settings\" render={<Button />}>\n <GearIcon className=\"media-icon media-icon--settings\" />\n </Menu.Trigger>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label>{t(settingsText)}</Tooltip.Label>\n </Tooltip.Popup>\n </Tooltip.Root>\n <Menu.Content className=\"media-surface media-popover media-menu media-menu--settings\">\n <div className=\"media-menu__group\">\n {hasQuality ? (\n <Menu.Root>\n <Menu.Trigger\n className=\"media-menu__item media-menu__item--submenu\"\n render={(props) => (\n <div {...props}>\n <QualityIcon className=\"media-icon\" />\n <span>{t(qualityText)}</span>\n <span className=\"media-menu__hint\">\n <span className=\"media-menu__hint-label\">{quality.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className=\"media-menu__panel\">\n <Menu.Item className=\"media-menu__back\">\n <MenuChevron flipped />\n {t(qualityText)}\n </Menu.Item>\n <Menu.Separator className=\"media-menu__separator\" />\n <QualityRadioGroup\n className=\"media-menu__group\"\n aria-label={t(qualityText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className=\"media-menu__item\">\n <span>\n {item.label}\n {item.tier ? <sup className=\"media-menu__tier\">{item.tier}</sup> : null}\n </span>\n {item.badge ? <span className=\"media-badge\">{item.badge}</span> : null}\n <Menu.ItemIndicator checked={item.checked} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-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=\"media-menu__item media-menu__item--submenu\"\n render={(props) => (\n <div {...props}>\n <SpeechIcon className=\"media-icon\" />\n <span>{t(audioText)}</span>\n <span className=\"media-menu__hint\">\n <span className=\"media-menu__hint-label\">{audioTrack.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className=\"media-menu__panel\">\n <Menu.Item className=\"media-menu__back\">\n <MenuChevron flipped />\n {t(audioText)}\n </Menu.Item>\n <Menu.Separator className=\"media-menu__separator\" />\n <AudioTrackRadioGroup\n className=\"media-menu__group\"\n aria-label={t(audioText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className=\"media-menu__item\">\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-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=\"media-menu__item media-menu__item--submenu\"\n render={(props) => (\n <div {...props}>\n <SpeedIcon className=\"media-icon\" />\n <span>{t(speedText)}</span>\n <span className=\"media-menu__hint\">\n <span className=\"media-menu__hint-label\">{playbackRate.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className=\"media-menu__panel\">\n <Menu.Item className=\"media-menu__back\">\n <MenuChevron flipped />\n {t(speedText)}\n </Menu.Item>\n <Menu.Separator className=\"media-menu__separator\" />\n <PlaybackRateRadioGroup\n className=\"media-menu__group\"\n aria-label={t(playbackRateText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className=\"media-menu__item\">\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-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=\"media-menu__item media-menu__item--submenu\"\n render={(props) => (\n <div {...props}>\n <CaptionsOffIcon className=\"media-icon\" />\n <span>{t(captionsText)}</span>\n <span className=\"media-menu__hint\">\n <span className=\"media-menu__hint-label\">{captions.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className=\"media-menu__panel\">\n <Menu.Item className=\"media-menu__back\">\n <MenuChevron flipped />\n {t(captionsText)}\n </Menu.Item>\n <Menu.Separator className=\"media-menu__separator\" />\n <CaptionsRadioGroup\n className=\"media-menu__group\"\n aria-label={t(captionsText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className=\"media-menu__item\">\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-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\nfunction CastControl() {\n return (\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}\n\nfunction AirPlayControl() {\n return (\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}\n\nfunction PiPControl() {\n return (\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}\nfunction FullscreenControl() {\n return (\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 );\n}\n\nexport function VideoSkin(props: VideoSkinProps): ReactNode {\n const { children, className, poster, 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 && (\n <Poster src={isString(poster) ? poster : undefined} render={isRenderProp(poster) ? poster : undefined} />\n )}\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 <VolumePopover />\n </div>\n\n <div className=\"media-time-controls\">\n <Time.Value type=\"current\" className=\"media-time\" />\n <TimeSlider.Root className=\"media-slider\">\n <TimeSlider.Chapters\n className=\"media-slider__chapters\"\n renderChapter={(props) => (\n <div {...props} className={cn(props.className, 'media-slider__chapter')}>\n <TimeSlider.Track className=\"media-slider__track media-slider__chapter-track\">\n <TimeSlider.Buffer className=\"media-slider__buffer\" />\n <TimeSlider.Fill className=\"media-slider__fill\" />\n </TimeSlider.Track>\n </div>\n )}\n />\n <TimeSlider.Thumb className=\"media-slider__thumb\" />\n\n <TimeSlider.Preview overflow=\"visible\" className=\"media-slider__preview\">\n <div className=\"media-surface media-thumbnail media-slider__thumbnail\">\n <Slider.Thumbnail className=\"media-thumbnail__image\" />\n <SpinnerIcon className=\"media-thumbnail__spinner media-icon\" />\n </div>\n <div className=\"media-slider__value\">\n <TimeSlider.ChapterTitle className=\"media-slider__chapter-title\" />\n <TimeSlider.Value type=\"pointer\" className=\"media-time\" />\n </div>\n </TimeSlider.Preview>\n </TimeSlider.Root>\n <Time.Value toggle type=\"remaining\" className=\"media-time\" />\n </div>\n\n <div className=\"media-button-group\">\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 <SettingsMenu />\n </div>\n </div>\n\n <div className=\"media-surface media-controls media-controls--secondary\">\n <div className=\"media-button-group\">\n <CastControl />\n <AirPlayControl />\n <PiPControl />\n <FullscreenControl />\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=\"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=\"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 <SeekIndicator.Root className=\"media-seek-indicator\">\n <ChevronIcon className=\"media-icon media-icon--seek\" />\n <SeekIndicator.Value className=\"media-seek-indicator__value\" />\n </SeekIndicator.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","Menu.Root","Tooltip.Root","Tooltip.Trigger","Menu.Trigger","Tooltip.Popup","Tooltip.Label","Menu.Content","Menu.Item","Menu.Separator","Menu.RadioItem","Menu.ItemIndicator","Tooltip.Shortcut","ErrorDialog.Root","ErrorDialog.Popup","ErrorDialog.Title","ErrorDialog.Description","ErrorDialog.Close","Controls.Root","Tooltip.Provider","Time.Value","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/skin.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 { 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';\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 { BaseVideoSkinProps } from '../types';\n\nconst SEEK_TIME = 10;\nconst TOP_STATUS_ACTIONS = ['toggleSubtitles', 'toggleFullscreen', 'togglePictureInPicture'] as const;\nconst CENTER_STATUS_ACTIONS = ['togglePaused'] as const;\n\nexport type VideoSkinProps = 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\nfunction MenuChevron({ flipped = false }: { flipped?: boolean }): ReactNode {\n return <ChevronIcon className={cn('media-icon media-menu__chevron', flipped ? 'media-icon--flipped' : 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 aria-label={t(settingsText)} className=\"media-button--settings\" render={<Button />}>\n <GearIcon className=\"media-icon media-icon--settings\" />\n </Menu.Trigger>\n }\n />\n <Tooltip.Popup className=\"media-surface media-tooltip\">\n <Tooltip.Label>{t(settingsText)}</Tooltip.Label>\n </Tooltip.Popup>\n </Tooltip.Root>\n <Menu.Content className=\"media-surface media-popover media-menu media-menu--settings\">\n <div className=\"media-menu__group\">\n {hasQuality ? (\n <Menu.Root>\n <Menu.Trigger\n className=\"media-menu__item media-menu__item--submenu\"\n render={(props) => (\n <div {...props}>\n <QualityIcon className=\"media-icon\" />\n <span>{t(qualityText)}</span>\n <span className=\"media-menu__hint\">\n <span className=\"media-menu__hint-label\">{quality.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className=\"media-menu__panel\">\n <Menu.Item className=\"media-menu__back\">\n <MenuChevron flipped />\n {t(qualityText)}\n </Menu.Item>\n <Menu.Separator className=\"media-menu__separator\" />\n <QualityRadioGroup\n className=\"media-menu__group\"\n aria-label={t(qualityText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className=\"media-menu__item\">\n <span>\n {item.label}\n {item.tier ? <sup className=\"media-menu__tier\">{item.tier}</sup> : null}\n </span>\n {item.badge ? <span className=\"media-badge\">{item.badge}</span> : null}\n <Menu.ItemIndicator checked={item.checked} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-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=\"media-menu__item media-menu__item--submenu\"\n render={(props) => (\n <div {...props}>\n <SpeechIcon className=\"media-icon\" />\n <span>{t(audioText)}</span>\n <span className=\"media-menu__hint\">\n <span className=\"media-menu__hint-label\">{audioTrack.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className=\"media-menu__panel\">\n <Menu.Item className=\"media-menu__back\">\n <MenuChevron flipped />\n {t(audioText)}\n </Menu.Item>\n <Menu.Separator className=\"media-menu__separator\" />\n <AudioTrackRadioGroup\n className=\"media-menu__group\"\n aria-label={t(audioText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className=\"media-menu__item\">\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-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=\"media-menu__item media-menu__item--submenu\"\n render={(props) => (\n <div {...props}>\n <SpeedIcon className=\"media-icon\" />\n <span>{t(speedText)}</span>\n <span className=\"media-menu__hint\">\n <span className=\"media-menu__hint-label\">{playbackRate.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className=\"media-menu__panel\">\n <Menu.Item className=\"media-menu__back\">\n <MenuChevron flipped />\n {t(speedText)}\n </Menu.Item>\n <Menu.Separator className=\"media-menu__separator\" />\n <PlaybackRateRadioGroup\n className=\"media-menu__group\"\n aria-label={t(playbackRateText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className=\"media-menu__item\">\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-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=\"media-menu__item media-menu__item--submenu\"\n render={(props) => (\n <div {...props}>\n <CaptionsOffIcon className=\"media-icon\" />\n <span>{t(captionsText)}</span>\n <span className=\"media-menu__hint\">\n <span className=\"media-menu__hint-label\">{captions.selectedLabel}</span>\n <MenuChevron />\n </span>\n </div>\n )}\n />\n <Menu.Content className=\"media-menu__panel\">\n <Menu.Item className=\"media-menu__back\">\n <MenuChevron flipped />\n {t(captionsText)}\n </Menu.Item>\n <Menu.Separator className=\"media-menu__separator\" />\n <CaptionsRadioGroup\n className=\"media-menu__group\"\n aria-label={t(captionsText)}\n renderItem={(props, item) => (\n <Menu.RadioItem {...props} className=\"media-menu__item\">\n <span>{item.label}</span>\n <Menu.ItemIndicator checked={item.checked} forceMount className=\"media-menu__indicator\">\n <CheckIcon className=\"media-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\nfunction CastControl() {\n return (\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}\n\nfunction AirPlayControl() {\n return (\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}\n\nfunction PiPControl() {\n return (\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}\nfunction FullscreenControl() {\n return (\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 );\n}\n\nexport function VideoSkin(props: VideoSkinProps): 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 <VolumePopover />\n </div>\n\n <div className=\"media-time-controls\">\n <Time.Value type=\"current\" className=\"media-time\" />\n <TimeSlider.Root className=\"media-slider\">\n <TimeSlider.Chapters\n className=\"media-slider__chapters\"\n renderChapter={(props) => (\n <div {...props} className={cn(props.className, 'media-slider__chapter')}>\n <TimeSlider.Track className=\"media-slider__track media-slider__chapter-track\">\n <TimeSlider.Buffer className=\"media-slider__buffer\" />\n <TimeSlider.Fill className=\"media-slider__fill\" />\n </TimeSlider.Track>\n </div>\n )}\n />\n <TimeSlider.Thumb className=\"media-slider__thumb\" />\n\n <TimeSlider.Preview overflow=\"visible\" className=\"media-slider__preview\">\n <div className=\"media-surface media-thumbnail media-slider__thumbnail\">\n <Slider.Thumbnail className=\"media-thumbnail__image\" />\n <SpinnerIcon className=\"media-thumbnail__spinner media-icon\" />\n </div>\n <div className=\"media-slider__value\">\n <TimeSlider.ChapterTitle className=\"media-slider__chapter-title\" />\n <TimeSlider.Value type=\"pointer\" className=\"media-time\" />\n </div>\n </TimeSlider.Preview>\n </TimeSlider.Root>\n <Time.Value toggle type=\"remaining\" className=\"media-time\" />\n </div>\n\n <div className=\"media-button-group\">\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 <SettingsMenu />\n </div>\n </div>\n\n <div className=\"media-surface media-controls media-controls--secondary\">\n <div className=\"media-button-group\">\n <CastControl />\n <AirPlayControl />\n <PiPControl />\n <FullscreenControl />\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=\"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=\"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 <SeekIndicator.Root className=\"media-seek-indicator\">\n <ChevronIcon className=\"media-icon media-icon--seek\" />\n <SeekIndicator.Value className=\"media-seek-indicator__value\" />\n </SeekIndicator.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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"}

package/dist/dev/presets/video/skin.tailwind.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"skin.tailwind.d.ts","names":[],"sources":["../../../../src/presets/video/skin.tailwind.tsx"],"mappings":";;;~~iBAqXgB~~,kBAAkB,OAAO,iBAAiB"}
1	+ {"version":3,"file":"skin.tailwind.d.ts","names":[],"sources":["../../../../src/presets/video/skin.tailwind.tsx"],"mappings":";;;iBAmXgB,kBAAkB,OAAO,iBAAiB"}

package/dist/dev/presets/video/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";
@@ -98,9 +97,8 @@ import { seekIndicator } from "../../skins/dist/default/default/tailwind/compone
 import { bufferingIndicator, buttonGroupEnd, buttonGroupStart, container, controls, error, menu, popup, primaryControls, secondaryControls, slider, statusIndicator, thumbnail, time, volumeIndicator } from "../../skins/dist/default/default/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/skin.tailwind.tsx
 const SEEK_TIME = 10;
 const TOP_STATUS_ACTIONS = [
@@ -387,7 +385,7 @@ function SettingsMenu() {
 	});
 }
 function VideoSkinTailwind(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
@@ -398,10 +396,9 @@ function VideoSkinTailwind(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,
@@ -492,7 +489,7 @@ function VideoSkinTailwind(props) {
 							children: [/* @__PURE__ */ jsxs(TooltipRoot, {
 								side: "top",
 								children: [/* @__PURE__ */ jsx(TooltipTrigger, { render: /* @__PURE__ */ jsxs(CaptionsButton, {
-									className: iconState.captions.button,
+									className: cn(button.captions, iconState.captions.button),
 									render: /* @__PURE__ */ jsx(Button, {}),
 									children: [/* @__PURE__ */ jsx(CaptionsOffIcon, { className: cn(icon, iconState.captions.off) }), /* @__PURE__ */ jsx(CaptionsOnIcon, { className: cn(icon, iconState.captions.on) })]
 								}) }), /* @__PURE__ */ jsxs(TooltipPopup, {