@videojs/react 10.0.0-beta.25 → 10.0.0-beta.27

package/docs/reference/volume-slider.md

@@ -12,7 +12,7 @@ tsx
 
 ## Behavior
 
-Controls the media volume level. The slider maps its 0–100 internal range to the media’s 0–1 volume scale. When the media is muted, the fill level drops to 0 regardless of the stored volume value.
+Controls the media volume level. The slider maps its 0–100 internal range to the media’s 0–1 volume scale. When the media is muted, the fill level drops to 0 regardless of the stored volume value. When volume control is unavailable, the HTML custom element receives native `hidden`, `data-hidden`, and disabled ARIA semantics; the React component returns `null`.
 
 ## Styling
 
@@ -30,7 +30,7 @@ css
 
 ## Accessibility
 
-Renders with `role="slider"` and automatic `aria-label` of “Volume”. Override with the `label` prop. Keyboard controls:
+Renders with `role="slider"` and an automatic `aria-label` that resolves to “Volume” from the active locale. Override with the `label` prop. Keyboard controls:
 
 *   Arrow Left / Arrow Right: step by `step` increment
 *   Page Up / Page Down: step by `largeStep` increment
@@ -45,31 +45,21 @@ Scroll wheel support:
 
 Nest sub-components for full control over the slider’s DOM structure. This example includes a track, fill bar, draggable thumb, and a tooltip that shows the volume percentage on hover.
 
-Mute
-
-0%
-
 App.tsx
 
 App.css
 
 ```
-import { createPlayer, MuteButton, VolumeSlider } from '@videojs/react';
+import { Container, createPlayer, MuteButton, VolumeSlider } from '@videojs/react';
 import { Video, videoFeatures } from '@videojs/react/video';
 
-const Player = createPlayer({ features: videoFeatures });
+const { Player } = createPlayer({ features: videoFeatures });
 
 export default function WithParts() {
   return (
-    <Player.Provider>
-      <Player.Container className="media-container">
-        <Video
-          src="https://stream.mux.com/BV3YZtogl89mg9VcNBhhnHm02Y34zI1nlMuMQfAbl3dM/highest.mp4"
-          autoPlay
-          muted
-          playsInline
-          loop
-        />
+    <Player>
+      <Container className="media-container">
+        <Video src="https://stream.mux.com/BV3YZtogl89mg9VcNBhhnHm02Y34zI1nlMuMQfAbl3dM/highest.mp4" autoPlay muted playsInline loop />
         <MuteButton
           className="media-mute-button"
           render={(props, state) => <button {...props}>{state.muted ? 'Unmute' : 'Mute'}</button>}
@@ -81,8 +71,8 @@ export default function WithParts() {
           <VolumeSlider.Thumb className="media-slider-thumb" />
           <VolumeSlider.Value type="pointer" className="media-slider-value" />
         </VolumeSlider.Root>
-      </Player.Container>
-    </Player.Provider>
+      </Container>
+    </Player>
   );
 }
 ```
@@ -217,9 +207,9 @@ Whether the slider is non-interactive.
 
 `label`
 
-`string | function`
+`Text | string | Text) | function`
 
-`'Volume'`
+`''`
 
 ▸
 
@@ -229,7 +219,7 @@ Custom label for the slider.
 
 Type
 
-`string | ((state: SliderState) => string)`
+`Text | string | ((state: SliderState) => string | Text)`
 
 `largeStep`
 
@@ -329,6 +319,10 @@ Type
 
 `'available' | 'unavailable' | 'unsupported'`
 
+`hidden`
+
+`boolean`
+
 `value`
 
 `number`
@@ -457,6 +451,8 @@ Type
 
 `'available' | 'unavailable' | 'unsupported'`
 
+`data-hidden`
+
 #### CSS custom properties
 
 Variable

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@videojs/react",
   "type": "module",
-  "version": "10.0.0-beta.25",
+  "version": "10.0.0-beta.27",
   "description": "React library for building media players",
   "license": "Apache-2.0",
   "repository": {
@@ -12,7 +12,9 @@
   "main": "dist/default/index.js",
   "module": "dist/default/index.js",
   "types": "dist/dev/index.d.ts",
-  "sideEffects": false,
+  "sideEffects": [
+    "./dist/*/i18n/locales/*/register.js"
+  ],
   "files": [
     "dist",
     "docs"
@@ -34,6 +36,26 @@
       "development": "./dist/dev/icons/*/index.js",
       "default": "./dist/default/icons/*/index.js"
     },
+    "./media/mux-video/hls-js": {
+      "types": "./dist/dev/media/mux-video/hls-js.d.ts",
+      "development": "./dist/dev/media/mux-video/hls-js.js",
+      "default": "./dist/default/media/mux-video/hls-js.js"
+    },
+    "./media/mux-video/spf": {
+      "types": "./dist/dev/media/mux-video/spf.d.ts",
+      "development": "./dist/dev/media/mux-video/spf.js",
+      "default": "./dist/default/media/mux-video/spf.js"
+    },
+    "./media/mux-audio/hls-js": {
+      "types": "./dist/dev/media/mux-audio/hls-js.d.ts",
+      "development": "./dist/dev/media/mux-audio/hls-js.js",
+      "default": "./dist/default/media/mux-audio/hls-js.js"
+    },
+    "./media/mux-audio/spf": {
+      "types": "./dist/dev/media/mux-audio/spf.d.ts",
+      "development": "./dist/dev/media/mux-audio/spf.js",
+      "default": "./dist/default/media/mux-audio/spf.js"
+    },
     "./media/*": {
       "types": "./dist/dev/media/*/index.d.ts",
       "development": "./dist/dev/media/*/index.js",
@@ -93,6 +115,16 @@
       "types": "./dist/dev/presets/live-audio/*.d.ts",
       "development": "./dist/dev/presets/live-audio/*.js",
       "default": "./dist/default/presets/live-audio/*.js"
+    },
+    "./i18n": {
+      "types": "./dist/dev/i18n/index.d.ts",
+      "development": "./dist/dev/i18n/index.js",
+      "default": "./dist/default/i18n/index.js"
+    },
+    "./i18n/locales/*": {
+      "types": "./dist/dev/i18n/locales/*.d.ts",
+      "development": "./dist/dev/i18n/locales/*.js",
+      "default": "./dist/default/i18n/locales/*.js"
     }
   },
   "peerDependencies": {
@@ -100,21 +132,22 @@
     "react-dom": "^18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@videojs/core": "10.0.0-beta.25",
-    "@videojs/spf": "10.0.0-beta.25",
-    "@videojs/store": "10.0.0-beta.25",
-    "@videojs/utils": "10.0.0-beta.25"
+    "@videojs/core": "10.0.0-beta.27",
+    "@videojs/media": "10.0.0-beta.27",
+    "@videojs/utils": "10.0.0-beta.27",
+    "@videojs/store": "10.0.0-beta.27",
+    "@videojs/spf": "10.0.0-beta.27"
   },
   "devDependencies": {
     "@testing-library/react": "^16.3.0",
-    "@types/react": "^19.2.14",
+    "@types/react": "^19.2.17",
     "jsdom": "^26.1.0",
-    "react": "^19.2.4",
-    "react-dom": "^19.2.4",
-    "tsdown": "^0.21.9",
-    "vitest": "^4.1.0",
-    "@videojs/icons": "10.0.0-beta.25",
-    "@videojs/skins": "10.0.0-beta.25"
+    "react": "^19.2.8",
+    "react-dom": "^19.2.8",
+    "tsdown": "^0.22.14",
+    "vitest": "^4.1.10",
+    "@videojs/icons": "10.0.0-beta.27",
+    "@videojs/skins": "10.0.0-beta.27"
   },
   "publishConfig": {
     "access": "public"

package/dist/default/media/dash-video/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/dash-video/index.tsx"],"sourcesContent":["'use client';\n\nimport type { DashMediaProps } from '@videojs/core/dom/media/dash';\nimport { DashMedia, dashMediaDefaultProps } from '@videojs/core/dom/media/dash';\nimport { GoogleCast } from '@videojs/core/dom/media/google-cast';\nimport { addComponent } from '@videojs/core/dom/media/media-host';\nimport type { ReactNode, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { useAttachMedia } from '../../utils/use-attach-media';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\nimport { useSyncProps } from '../../utils/use-sync-props';\n\nexport interface DashVideoProps\n  extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof DashMediaProps>,\n    Partial<DashMediaProps> {\n  children?: ReactNode;\n}\n\nexport const DashVideo = forwardRef<HTMLVideoElement, DashVideoProps>(function DashVideo({ children, ...props }, ref) {\n  const media = useMediaInstance(DashMedia, (media) => {\n    addComponent(media, new GoogleCast());\n  });\n  const attachRef = useAttachMedia(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const htmlProps = useSyncProps(media, props, dashMediaDefaultProps);\n\n  return (\n    <video ref={composedRef} {...htmlProps}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace DashVideo {\n  export type Props = DashVideoProps;\n}\n"],"mappings":";;;;;;;;;;;AAmBA,MAAa,YAAY,WAA6C,SAAS,UAAU,EAAE,UAAU,GAAG,SAAS,KAAK;CACpH,MAAM,QAAQ,iBAAiB,YAAY,UAAU;AACnD,eAAa,OAAO,IAAI,YAAY,CAAC;GACrC;AAKF,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,sBAAsB;EAI9D;EACK,CAAA;EAEV"}

package/dist/default/media/hlsjs-video/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/hlsjs-video/index.tsx"],"sourcesContent":["'use client';\n\nimport { GoogleCast } from '@videojs/core/dom/media/google-cast';\nimport type { HlsMediaProps } from '@videojs/core/dom/media/hls-js';\nimport { HlsJsMedia, hlsMediaDefaultProps } from '@videojs/core/dom/media/hls-js';\nimport { addComponent } from '@videojs/core/dom/media/media-host';\nimport type { ReactNode, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { useAttachMedia } from '../../utils/use-attach-media';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\nimport { useSyncProps } from '../../utils/use-sync-props';\n\nexport interface HlsJsVideoProps\n  extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof HlsMediaProps>,\n    Partial<HlsMediaProps> {\n  children?: ReactNode;\n}\n\nexport const HlsJsVideo = forwardRef<HTMLVideoElement, HlsJsVideoProps>(function HlsJsVideo(\n  { children, ...props },\n  ref\n) {\n  const media = useMediaInstance(HlsJsMedia, (media) => {\n    addComponent(media, new GoogleCast());\n  });\n  const attachRef = useAttachMedia(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const htmlProps = useSyncProps(media, props, hlsMediaDefaultProps);\n\n  return (\n    <video ref={composedRef} {...htmlProps}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace HlsJsVideo {\n  export type Props = HlsJsVideoProps;\n}\n"],"mappings":";;;;;;;;;;;AAmBA,MAAa,aAAa,WAA8C,SAAS,WAC/E,EAAE,UAAU,GAAG,SACf,KACA;CACA,MAAM,QAAQ,iBAAiB,aAAa,UAAU;AACpD,eAAa,OAAO,IAAI,YAAY,CAAC;GACrC;AAKF,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,qBAAqB;EAI7D;EACK,CAAA;EAEV"}

package/dist/default/media/mux-audio/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-audio/index.tsx"],"sourcesContent":["'use client';\n\nimport { GoogleCast } from '@videojs/core/dom/media/google-cast';\nimport type { HlsMediaProps } from '@videojs/core/dom/media/hls-js';\nimport { HlsJsMedia, hlsMediaDefaultProps } from '@videojs/core/dom/media/hls-js';\nimport { addComponent } from '@videojs/core/dom/media/media-host';\nimport { MuxData } from '@videojs/core/dom/media/mux';\nimport type { AudioHTMLAttributes, ReactNode } from 'react';\nimport { forwardRef } from 'react';\nimport { useAttachMedia } from '../../utils/use-attach-media';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\nimport { useSyncProps } from '../../utils/use-sync-props';\n\nexport interface MuxAudioProps\n  extends Omit<AudioHTMLAttributes<HTMLAudioElement>, keyof HlsMediaProps>,\n    Partial<HlsMediaProps> {\n  children?: ReactNode;\n}\n\nexport const MuxAudio = forwardRef<HTMLAudioElement, MuxAudioProps>(function MuxAudio({ children, ...props }, ref) {\n  const media = useMediaInstance(HlsJsMedia, (media) => {\n    addComponent(media, new MuxData({ playerSoftwareName: 'mux-audio' }));\n    addComponent(media, new GoogleCast());\n  });\n  const attachRef = useAttachMedia(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const htmlProps = useSyncProps(media, props, hlsMediaDefaultProps);\n\n  return (\n    <audio ref={composedRef} {...htmlProps}>\n      {children}\n    </audio>\n  );\n});\n\nexport namespace MuxAudio {\n  export type Props = MuxAudioProps;\n}\n"],"mappings":";;;;;;;;;;;;AAoBA,MAAa,WAAW,WAA4C,SAAS,SAAS,EAAE,UAAU,GAAG,SAAS,KAAK;CACjH,MAAM,QAAQ,iBAAiB,aAAa,UAAU;AACpD,eAAa,OAAO,IAAI,QAAQ,EAAE,oBAAoB,aAAa,CAAC,CAAC;AACrE,eAAa,OAAO,IAAI,YAAY,CAAC;GACrC;AAKF,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,qBAAqB;EAI7D;EACK,CAAA;EAEV"}

package/dist/default/media/mux-video/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-video/index.tsx"],"sourcesContent":["'use client';\n\nimport { GoogleCast } from '@videojs/core/dom/media/google-cast';\nimport type { HlsMediaProps } from '@videojs/core/dom/media/hls-js';\nimport { HlsJsMedia, hlsMediaDefaultProps } from '@videojs/core/dom/media/hls-js';\nimport { addComponent } from '@videojs/core/dom/media/media-host';\nimport { MuxData } from '@videojs/core/dom/media/mux';\nimport type { ReactNode, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { useAttachMedia } from '../../utils/use-attach-media';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\nimport { useSyncProps } from '../../utils/use-sync-props';\n\nexport interface MuxVideoProps\n  extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof HlsMediaProps>,\n    Partial<HlsMediaProps> {\n  children?: ReactNode;\n}\n\nexport const MuxVideo = forwardRef<HTMLVideoElement, MuxVideoProps>(function MuxVideo({ children, ...props }, ref) {\n  const media = useMediaInstance(HlsJsMedia, (media) => {\n    addComponent(media, new MuxData({ playerSoftwareName: 'mux-video' }));\n    addComponent(media, new GoogleCast());\n  });\n  const attachRef = useAttachMedia(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const htmlProps = useSyncProps(media, props, hlsMediaDefaultProps);\n\n  return (\n    <video ref={composedRef} {...htmlProps}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace MuxVideo {\n  export type Props = MuxVideoProps;\n}\n"],"mappings":";;;;;;;;;;;;AAoBA,MAAa,WAAW,WAA4C,SAAS,SAAS,EAAE,UAAU,GAAG,SAAS,KAAK;CACjH,MAAM,QAAQ,iBAAiB,aAAa,UAAU;AACpD,eAAa,OAAO,IAAI,QAAQ,EAAE,oBAAoB,aAAa,CAAC,CAAC;AACrE,eAAa,OAAO,IAAI,YAAY,CAAC;GACrC;AAKF,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,qBAAqB;EAI7D;EACK,CAAA;EAEV"}

package/dist/default/media/native-hls-video/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/native-hls-video/index.tsx"],"sourcesContent":["'use client';\n\nimport { GoogleCast } from '@videojs/core/dom/media/google-cast';\nimport { addComponent } from '@videojs/core/dom/media/media-host';\nimport type { NativeHlsMediaProps } from '@videojs/core/dom/media/native-hls';\nimport { NativeHlsMedia, nativeHlsMediaDefaultProps } from '@videojs/core/dom/media/native-hls';\nimport type { ReactNode, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { useAttachMedia } from '../../utils/use-attach-media';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\nimport { useSyncProps } from '../../utils/use-sync-props';\n\nexport interface NativeHlsVideoProps\n  extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof NativeHlsMediaProps>,\n    Partial<NativeHlsMediaProps> {\n  children?: ReactNode;\n}\n\nexport const NativeHlsVideo = forwardRef<HTMLVideoElement, NativeHlsVideoProps>(function NativeHlsVideo(\n  { children, ...props },\n  ref\n) {\n  const media = useMediaInstance(NativeHlsMedia, (media) => {\n    addComponent(media, new GoogleCast());\n  });\n  const attachRef = useAttachMedia(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const htmlProps = useSyncProps(media, props, nativeHlsMediaDefaultProps);\n\n  return (\n    <video ref={composedRef} {...htmlProps}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace NativeHlsVideo {\n  export type Props = NativeHlsVideoProps;\n}\n"],"mappings":";;;;;;;;;;;AAmBA,MAAa,iBAAiB,WAAkD,SAAS,eACvF,EAAE,UAAU,GAAG,SACf,KACA;CACA,MAAM,QAAQ,iBAAiB,iBAAiB,UAAU;AACxD,eAAa,OAAO,IAAI,YAAY,CAAC;GACrC;AAKF,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,2BAA2B;EAInE;EACK,CAAA;EAEV"}

package/dist/default/media/simple-hls-audio-only/index.js

@@ -1,22 +0,0 @@
-"use client";
-import { useComposedRefs } from "../../utils/use-composed-refs.js";
-import { useAttachMedia } from "../../utils/use-attach-media.js";
-import { useMediaInstance } from "../../utils/use-media-instance.js";
-import { useSyncProps } from "../../utils/use-sync-props.js";
-import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-import { SimpleHlsAudioOnlyMedia } from "@videojs/core/dom/media/simple-hls-audio-only";
-import { simpleHlsAudioOnlyMediaDefaultProps } from "@videojs/spf/hls";
-//#region src/media/simple-hls-audio-only/index.tsx
-const SimpleHlsAudioOnly = forwardRef(function SimpleHlsAudioOnly({ children, ...props }, ref) {
-	const media = useMediaInstance(SimpleHlsAudioOnlyMedia);
-	return /* @__PURE__ */ jsx("audio", {
-		ref: useComposedRefs(useAttachMedia(media), ref),
-		...useSyncProps(media, props, simpleHlsAudioOnlyMediaDefaultProps),
-		children
-	});
-});
-//#endregion
-export { SimpleHlsAudioOnly };
-
-//# sourceMappingURL=index.js.map

package/dist/default/media/simple-hls-audio-only/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/simple-hls-audio-only/index.tsx"],"sourcesContent":["'use client';\n\nimport { SimpleHlsAudioOnlyMedia } from '@videojs/core/dom/media/simple-hls-audio-only';\nimport type { SimpleHlsAudioOnlyMediaProps } from '@videojs/spf/hls';\nimport { simpleHlsAudioOnlyMediaDefaultProps } from '@videojs/spf/hls';\nimport type { AudioHTMLAttributes, ReactNode } from 'react';\nimport { forwardRef } from 'react';\nimport { useAttachMedia } from '../../utils/use-attach-media';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\nimport { useSyncProps } from '../../utils/use-sync-props';\n\nexport interface SimpleHlsAudioOnlyProps\n  extends Omit<AudioHTMLAttributes<HTMLAudioElement>, keyof SimpleHlsAudioOnlyMediaProps>,\n    Partial<SimpleHlsAudioOnlyMediaProps> {\n  children?: ReactNode;\n}\n\nexport const SimpleHlsAudioOnly = forwardRef<HTMLAudioElement, SimpleHlsAudioOnlyProps>(function SimpleHlsAudioOnly(\n  { children, ...props },\n  ref\n) {\n  const media = useMediaInstance(SimpleHlsAudioOnlyMedia);\n  const attachRef = useAttachMedia(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const htmlProps = useSyncProps(media, props, simpleHlsAudioOnlyMediaDefaultProps);\n\n  return (\n    <audio ref={composedRef} {...htmlProps}>\n      {children}\n    </audio>\n  );\n});\n\nexport namespace SimpleHlsAudioOnly {\n  export type Props = SimpleHlsAudioOnlyProps;\n}\n"],"mappings":";;;;;;;;;;AAkBA,MAAa,qBAAqB,WAAsD,SAAS,mBAC/F,EAAE,UAAU,GAAG,SACf,KACA;CACA,MAAM,QAAQ,iBAAiB,wBAAwB;AAKvD,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,oCAAoC;EAI5E;EACK,CAAA;EAEV"}

package/dist/default/media/simple-hls-video/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/simple-hls-video/index.tsx"],"sourcesContent":["'use client';\n\nimport { SimpleHlsMedia } from '@videojs/core/dom/media/simple-hls';\nimport type { SimpleHlsMediaProps } from '@videojs/spf/hls';\nimport { simpleHlsMediaDefaultProps } from '@videojs/spf/hls';\nimport type { ReactNode, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { useAttachMedia } from '../../utils/use-attach-media';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\nimport { useSyncProps } from '../../utils/use-sync-props';\n\nexport interface SimpleHlsVideoProps\n  extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof SimpleHlsMediaProps>,\n    Partial<SimpleHlsMediaProps> {\n  children?: ReactNode;\n}\n\nexport const SimpleHlsVideo = forwardRef<HTMLVideoElement, SimpleHlsVideoProps>(function SimpleHlsVideo(\n  { children, ...props },\n  ref\n) {\n  const media = useMediaInstance(SimpleHlsMedia);\n  const attachRef = useAttachMedia(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const htmlProps = useSyncProps(media, props, simpleHlsMediaDefaultProps);\n\n  return (\n    <video ref={composedRef} {...htmlProps}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace SimpleHlsVideo {\n  export type Props = SimpleHlsVideoProps;\n}\n"],"mappings":";;;;;;;;;;AAkBA,MAAa,iBAAiB,WAAkD,SAAS,eACvF,EAAE,UAAU,GAAG,SACf,KACA;CACA,MAAM,QAAQ,iBAAiB,eAAe;AAK9C,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,2BAA2B;EAInE;EACK,CAAA;EAEV"}

package/dist/default/media/vimeo-video/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/vimeo-video/index.tsx"],"sourcesContent":["'use client';\n\nimport type { VimeoMediaProps } from '@videojs/core/dom/media/vimeo';\nimport { buildVimeoIframeSrc, VimeoMedia, vimeoMediaDefaultProps } from '@videojs/core/dom/media/vimeo';\nimport type { ReactNode } from 'react';\nimport { forwardRef, useState } from 'react';\nimport { useAttachIframe } from '../../utils/use-attach-iframe';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\nimport { useSyncProps } from '../../utils/use-sync-props';\n\nexport interface VimeoVideoProps extends Partial<VimeoMediaProps> {\n  children?: ReactNode;\n}\n\nexport const VimeoVideo = forwardRef<HTMLIFrameElement, VimeoVideoProps>(function VimeoVideo(\n  { children, ...rawProps },\n  ref\n) {\n  const media = useMediaInstance(VimeoMedia);\n  const props: Partial<VimeoMediaProps> & Record<string, unknown> = { ...rawProps };\n  const attachRef = useAttachIframe(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const [initialSrc] = useState(() => buildVimeoIframeSrc(props.src ?? '', { ...vimeoMediaDefaultProps, ...props }));\n  const iframeProps = useSyncProps<VimeoMediaProps, Record<string, unknown>>(media, props, vimeoMediaDefaultProps);\n\n  return (\n    <iframe\n      title=\"Vimeo video player\"\n      src={initialSrc}\n      data-cross-origin-frame\n      allow=\"accelerometer; fullscreen; autoplay; encrypted-media; gyroscope; picture-in-picture\"\n      allowFullScreen\n      frameBorder={0}\n      width=\"100%\"\n      height=\"100%\"\n      referrerPolicy={props.config?.referrerPolicy}\n      {...iframeProps}\n      ref={composedRef}\n    >\n      {children}\n    </iframe>\n  );\n});\n\nexport namespace VimeoVideo {\n  export type Props = VimeoVideoProps;\n}\n"],"mappings":";;;;;;;;;AAeA,MAAa,aAAa,WAA+C,SAAS,WAChF,EAAE,UAAU,GAAG,YACf,KACA;CACA,MAAM,QAAQ,iBAAiB,WAAW;CAC1C,MAAM,QAA4D,EAAE,GAAG,UAAU;CAEjF,MAAM,cAAc,gBADF,gBAAgB,MAAM,EACO,IAAI;CACnD,MAAM,CAAC,cAAc,eAAe,oBAAoB,MAAM,OAAO,IAAI;EAAE,GAAG;EAAwB,GAAG;EAAO,CAAC,CAAC;CAClH,MAAM,cAAc,aAAuD,OAAO,OAAO,uBAAuB;AAEhH,QACE,oBAAC,UAAD;EACE,OAAM;EACN,KAAK;EACL,2BAAA;EACA,OAAM;EACN,iBAAA;EACA,aAAa;EACb,OAAM;EACN,QAAO;EACP,gBAAgB,MAAM,QAAQ;EAC9B,GAAI;EACJ,KAAK;EAEJ;EACM,CAAA;EAEX"}

package/dist/default/skins/dist/default/default/tailwind/components/input-feedback.js

@@ -1,40 +0,0 @@
-import { cn } from "@videojs/utils/style";
-//#region ../skins/dist/default/default/tailwind/components/input-feedback.js
-/**
-* NOTE: tailwind.css is required to support the `@property --media-progress-fill` registration and animation keyframes. You should import from either:
-- "@videojs/html/tailwind.css" for HTML skins
-- "@videojs/react/tailwind.css" for React skins
-*/
-const inputFeedback = {
-	root: cn("absolute inset-x-0 top-0 bottom-14 pointer-events-none", "grid grid-cols-3 items-center justify-items-center", "@2xl/media-root:bottom-0", "[color:var(--media-color-primary,oklch(1_0_0))]"),
-	island: {
-		base: cn("group/input-indicator", "[--media-surface-background-color:oklch(0_0_0/0.25)]", "absolute top-3 rounded-full origin-top pointer-events-none", "text-inherit font-medium", "duration-100 ease-out", "data-starting-style:opacity-0", "data-ending-style:opacity-0", "data-starting-style:duration-250", "data-starting-style:ease-in", "data-ending-style:duration-250", "data-ending-style:ease-in", "pointer-coarse:will-change-[scale,translate,opacity]", "pointer-coarse:transition-[scale,translate,opacity]", "pointer-fine:motion-safe:will-change-[scale,translate,filter,opacity]", "pointer-fine:motion-safe:transition-[scale,translate,filter,opacity]", "pointer-fine:motion-safe:data-starting-style:blur-sm", "pointer-fine:motion-safe:data-starting-style:scale-90", "pointer-fine:motion-safe:data-ending-style:blur-sm", "pointer-fine:motion-safe:data-ending-style:scale-90", "motion-safe:data-ending-style:-translate-y-1/4", "[@media(prefers-reduced-transparency:reduce)]:[--media-surface-background-color:oklch(0_0_0)]", "contrast-more:[--media-surface-background-color:oklch(0_0_0)]"),
-		content: cn("flex justify-between items-center gap-2 px-2.5 py-1 w-full", "**:mix-blend-difference"),
-		volume: cn("w-[min(80%,12rem)]", "*:[--media-progress-fill:var(--media-volume-fill)]", "*:rounded-[inherit]", "*:[background-image:linear-gradient(to_right,currentColor_0%,currentColor_var(--media-progress-fill),transparent_var(--media-progress-fill),transparent_100%)]", "*:[transition:--media-progress-fill_200ms_linear]"),
-		shownVolume: cn("data-open:duration-100", "data-min:animate-media-shake", "data-max:animate-media-shake", "motion-reduce:data-min:animate-none", "motion-reduce:data-max:animate-none"),
-		shownStatus: cn("data-open:duration-100"),
-		icon: cn("hidden shrink-0"),
-		shownVolumeHigh: "group-data-[level=high]/input-indicator:block",
-		shownVolumeLow: "group-data-[level=low]/input-indicator:block",
-		shownVolumeOff: "group-data-[level=off]/input-indicator:block",
-		shownCaptionsOn: "group-data-[status=captions-on]/input-indicator:block",
-		shownCaptionsOff: "group-data-[status=captions-off]/input-indicator:block",
-		shownFullscreenEnter: "group-data-[status=fullscreen]/input-indicator:block",
-		shownFullscreenExit: "group-data-[status=exit-fullscreen]/input-indicator:block",
-		shownPipEnter: "group-data-[status=pip]/input-indicator:block",
-		shownPipExit: "group-data-[status=exit-pip]/input-indicator:block",
-		value: "ml-auto"
-	},
-	bubble: {
-		base: cn("group/input-indicator", "col-start-2 row-start-1", "grid place-content-center text-center p-4", "data-direction:gap-1", "@2xl/media-root:data-direction:p-6", "not-data-direction:bg-black/35 not-data-direction:rounded-full not-data-direction:backdrop-blur-sm", "not-data-direction:[transition-property:opacity,scale]", "not-data-direction:duration-200 not-data-direction:ease-out", "motion-reduce:not-data-direction:transition-opacity", "motion-reduce:not-data-direction:duration-50", "not-data-direction:data-starting-style:opacity-0", "not-data-direction:data-ending-style:opacity-0", "not-data-direction:data-starting-style:scale-[0.85]", "not-data-direction:data-ending-style:scale-[0.85]", "not-data-direction:data-ending-style:duration-100", "not-data-direction:data-ending-style:ease-in", "data-[direction=backward]:col-start-1 data-[direction=backward]:justify-self-start", "data-[direction=forward]:col-start-3 data-[direction=forward]:justify-self-end"),
-		icon: "hidden size-[calc(var(--media-icon-size)*1.5)]",
-		shownSeek: cn("group-data-direction/input-indicator:block", "group-data-[direction=backward]/input-indicator:[scale:-1_1]", "motion-safe:transition-[translate,opacity] motion-safe:duration-200 motion-safe:ease-in-out", "motion-safe:group-data-starting-style/input-indicator:opacity-0", "motion-safe:group-data-ending-style/input-indicator:opacity-0", "motion-safe:group-data-[direction=forward]/input-indicator:group-data-starting-style/input-indicator:[translate:-60%_0]", "motion-safe:group-data-[direction=backward]/input-indicator:group-data-starting-style/input-indicator:[translate:60%_0]"),
-		shownPause: "group-data-[status=pause]/input-indicator:block",
-		shownPlay: cn("group-data-[status=play]/input-indicator:block", "group-data-[status=play]/input-indicator:translate-x-px"),
-		time: "tabular-nums"
-	}
-};
-//#endregion
-export { inputFeedback };
-
-//# sourceMappingURL=input-feedback.js.map

package/dist/default/skins/dist/default/default/tailwind/components/input-feedback.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"input-feedback.js","names":[],"sources":["../../../../../../../../../skins/dist/default/default/tailwind/components/input-feedback.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/default/tailwind/components/input-feedback.ts\n/**\n* NOTE: tailwind.css is required to support the `@property --media-progress-fill` registration and animation keyframes. You should import from either:\n- \"@videojs/html/tailwind.css\" for HTML skins\n- \"@videojs/react/tailwind.css\" for React skins\n*/\nconst inputFeedback = {\n\troot: cn(\"absolute inset-x-0 top-0 bottom-14 pointer-events-none\", \"grid grid-cols-3 items-center justify-items-center\", \"@2xl/media-root:bottom-0\", \"[color:var(--media-color-primary,oklch(1_0_0))]\"),\n\tisland: {\n\t\tbase: cn(\"group/input-indicator\", \"[--media-surface-background-color:oklch(0_0_0/0.25)]\", \"absolute top-3 rounded-full origin-top pointer-events-none\", \"text-inherit font-medium\", \"duration-100 ease-out\", \"data-starting-style:opacity-0\", \"data-ending-style:opacity-0\", \"data-starting-style:duration-250\", \"data-starting-style:ease-in\", \"data-ending-style:duration-250\", \"data-ending-style:ease-in\", \"pointer-coarse:will-change-[scale,translate,opacity]\", \"pointer-coarse:transition-[scale,translate,opacity]\", \"pointer-fine:motion-safe:will-change-[scale,translate,filter,opacity]\", \"pointer-fine:motion-safe:transition-[scale,translate,filter,opacity]\", \"pointer-fine:motion-safe:data-starting-style:blur-sm\", \"pointer-fine:motion-safe:data-starting-style:scale-90\", \"pointer-fine:motion-safe:data-ending-style:blur-sm\", \"pointer-fine:motion-safe:data-ending-style:scale-90\", \"motion-safe:data-ending-style:-translate-y-1/4\", \"[@media(prefers-reduced-transparency:reduce)]:[--media-surface-background-color:oklch(0_0_0)]\", \"contrast-more:[--media-surface-background-color:oklch(0_0_0)]\"),\n\t\tcontent: cn(\"flex justify-between items-center gap-2 px-2.5 py-1 w-full\", \"**:mix-blend-difference\"),\n\t\tvolume: cn(\"w-[min(80%,12rem)]\", \"*:[--media-progress-fill:var(--media-volume-fill)]\", \"*:rounded-[inherit]\", \"*:[background-image:linear-gradient(to_right,currentColor_0%,currentColor_var(--media-progress-fill),transparent_var(--media-progress-fill),transparent_100%)]\", \"*:[transition:--media-progress-fill_200ms_linear]\"),\n\t\tshownVolume: cn(\"data-open:duration-100\", \"data-min:animate-media-shake\", \"data-max:animate-media-shake\", \"motion-reduce:data-min:animate-none\", \"motion-reduce:data-max:animate-none\"),\n\t\tshownStatus: cn(\"data-open:duration-100\"),\n\t\ticon: cn(\"hidden shrink-0\"),\n\t\tshownVolumeHigh: \"group-data-[level=high]/input-indicator:block\",\n\t\tshownVolumeLow: \"group-data-[level=low]/input-indicator:block\",\n\t\tshownVolumeOff: \"group-data-[level=off]/input-indicator:block\",\n\t\tshownCaptionsOn: \"group-data-[status=captions-on]/input-indicator:block\",\n\t\tshownCaptionsOff: \"group-data-[status=captions-off]/input-indicator:block\",\n\t\tshownFullscreenEnter: \"group-data-[status=fullscreen]/input-indicator:block\",\n\t\tshownFullscreenExit: \"group-data-[status=exit-fullscreen]/input-indicator:block\",\n\t\tshownPipEnter: \"group-data-[status=pip]/input-indicator:block\",\n\t\tshownPipExit: \"group-data-[status=exit-pip]/input-indicator:block\",\n\t\tvalue: \"ml-auto\"\n\t},\n\tbubble: {\n\t\tbase: cn(\"group/input-indicator\", \"col-start-2 row-start-1\", \"grid place-content-center text-center p-4\", \"data-direction:gap-1\", \"@2xl/media-root:data-direction:p-6\", \"not-data-direction:bg-black/35 not-data-direction:rounded-full not-data-direction:backdrop-blur-sm\", \"not-data-direction:[transition-property:opacity,scale]\", \"not-data-direction:duration-200 not-data-direction:ease-out\", \"motion-reduce:not-data-direction:transition-opacity\", \"motion-reduce:not-data-direction:duration-50\", \"not-data-direction:data-starting-style:opacity-0\", \"not-data-direction:data-ending-style:opacity-0\", \"not-data-direction:data-starting-style:scale-[0.85]\", \"not-data-direction:data-ending-style:scale-[0.85]\", \"not-data-direction:data-ending-style:duration-100\", \"not-data-direction:data-ending-style:ease-in\", \"data-[direction=backward]:col-start-1 data-[direction=backward]:justify-self-start\", \"data-[direction=forward]:col-start-3 data-[direction=forward]:justify-self-end\"),\n\t\ticon: \"hidden size-[calc(var(--media-icon-size)*1.5)]\",\n\t\tshownSeek: cn(\"group-data-direction/input-indicator:block\", \"group-data-[direction=backward]/input-indicator:[scale:-1_1]\", \"motion-safe:transition-[translate,opacity] motion-safe:duration-200 motion-safe:ease-in-out\", \"motion-safe:group-data-starting-style/input-indicator:opacity-0\", \"motion-safe:group-data-ending-style/input-indicator:opacity-0\", \"motion-safe:group-data-[direction=forward]/input-indicator:group-data-starting-style/input-indicator:[translate:-60%_0]\", \"motion-safe:group-data-[direction=backward]/input-indicator:group-data-starting-style/input-indicator:[translate:60%_0]\"),\n\t\tshownPause: \"group-data-[status=pause]/input-indicator:block\",\n\t\tshownPlay: cn(\"group-data-[status=play]/input-indicator:block\", \"group-data-[status=play]/input-indicator:translate-x-px\"),\n\t\ttime: \"tabular-nums\"\n\t}\n};\n//#endregion\nexport { inputFeedback };\n\n//# sourceMappingURL=input-feedback.js.map"],"mappings":";;;;;;;AAOA,MAAM,gBAAgB;CACrB,MAAM,GAAG,0DAA0D,sDAAsD,4BAA4B,kDAAkD;CACvM,QAAQ;EACP,MAAM,GAAG,yBAAyB,wDAAwD,8DAA8D,4BAA4B,yBAAyB,iCAAiC,+BAA+B,oCAAoC,+BAA+B,kCAAkC,6BAA6B,wDAAwD,uDAAuD,yEAAyE,wEAAwE,wDAAwD,yDAAyD,sDAAsD,uDAAuD,kDAAkD,iGAAiG,gEAAgE;EAChkC,SAAS,GAAG,8DAA8D,0BAA0B;EACpG,QAAQ,GAAG,sBAAsB,sDAAsD,uBAAuB,kKAAkK,oDAAoD;EACpU,aAAa,GAAG,0BAA0B,gCAAgC,gCAAgC,uCAAuC,sCAAsC;EACvL,aAAa,GAAG,yBAAyB;EACzC,MAAM,GAAG,kBAAkB;EAC3B,iBAAiB;EACjB,gBAAgB;EAChB,gBAAgB;EAChB,iBAAiB;EACjB,kBAAkB;EAClB,sBAAsB;EACtB,qBAAqB;EACrB,eAAe;EACf,cAAc;EACd,OAAO;EACP;CACD,QAAQ;EACP,MAAM,GAAG,yBAAyB,2BAA2B,6CAA6C,wBAAwB,sCAAsC,sGAAsG,0DAA0D,+DAA+D,uDAAuD,gDAAgD,oDAAoD,kDAAkD,uDAAuD,qDAAqD,qDAAqD,gDAAgD,sFAAsF,iFAAiF;EAC58B,MAAM;EACN,WAAW,GAAG,8CAA8C,gEAAgE,+FAA+F,mEAAmE,iEAAiE,2HAA2H,0HAA0H;EACplB,YAAY;EACZ,WAAW,GAAG,kDAAkD,0DAA0D;EAC1H,MAAM;EACN;CACD"}

package/dist/default/skins/dist/default/default/tailwind/components/root.js

@@ -1,8 +0,0 @@
-import { reset } from "./reset.js";
-import { cn } from "@videojs/utils/style";
-//#region ../skins/dist/default/default/tailwind/components/root.js
-const root = cn(reset, "block relative isolate h-full w-full @container/media-root", "rounded-(--media-border-radius,2rem)", "font-[Inter_Variable,Inter,ui-sans-serif,system-ui,sans-serif] text-[0.8125rem] leading-normal subpixel-antialiased", "outline-2 outline-transparent -outline-offset-4", "transition-[outline-offset,outline-color] duration-100 ease-out", "focus-visible:outline-current focus-visible:outline-offset-2", "scrollbar-thin scrollbar-thumb-current/30", "[@media_(prefers-reduced-transparency:reduce)_or_(prefers-contrast:more)]:scrollbar-auto", "[@media_(prefers-reduced-transparency:reduce)_or_(prefers-contrast:more)]:scrollbar-thumb-current/80", "[--media-current-shadow-color:oklch(from_currentColor_0_0_0/clamp(0,calc((l-0.5)*0.5),0.15))]", "[--media-current-shadow-color-subtle:oklch(from_var(--media-current-shadow-color)_l_c_h/calc(alpha*0.4))]", "[--media-icon-size:18px]");
-//#endregion
-export { root };
-
-//# sourceMappingURL=root.js.map

package/dist/default/skins/dist/default/default/tailwind/components/root.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"root.js","names":[],"sources":["../../../../../../../../../skins/dist/default/default/tailwind/components/root.js"],"sourcesContent":["import { reset } from \"./reset.js\";\nimport { cn } from \"@videojs/utils/style\";\n//#region src/default/tailwind/components/root.ts\nconst root = cn(reset, \"block relative isolate h-full w-full @container/media-root\", \"rounded-(--media-border-radius,2rem)\", \"font-[Inter_Variable,Inter,ui-sans-serif,system-ui,sans-serif] text-[0.8125rem] leading-normal subpixel-antialiased\", \"outline-2 outline-transparent -outline-offset-4\", \"transition-[outline-offset,outline-color] duration-100 ease-out\", \"focus-visible:outline-current focus-visible:outline-offset-2\", \"scrollbar-thin scrollbar-thumb-current/30\", \"[@media_(prefers-reduced-transparency:reduce)_or_(prefers-contrast:more)]:scrollbar-auto\", \"[@media_(prefers-reduced-transparency:reduce)_or_(prefers-contrast:more)]:scrollbar-thumb-current/80\", \"[--media-current-shadow-color:oklch(from_currentColor_0_0_0/clamp(0,calc((l-0.5)*0.5),0.15))]\", \"[--media-current-shadow-color-subtle:oklch(from_var(--media-current-shadow-color)_l_c_h/calc(alpha*0.4))]\", \"[--media-icon-size:18px]\");\n//#endregion\nexport { root };\n\n//# sourceMappingURL=root.js.map"],"mappings":";;;AAGA,MAAM,OAAO,GAAG,OAAO,8DAA8D,wCAAwC,uHAAuH,mDAAmD,mEAAmE,gEAAgE,6CAA6C,4FAA4F,wGAAwG,iGAAiG,6GAA6G,2BAA2B"}

package/dist/default/skins/dist/default/minimal/tailwind/components/input-feedback.js

@@ -1,41 +0,0 @@
-import { cn } from "@videojs/utils/style";
-//#region ../skins/dist/default/minimal/tailwind/components/input-feedback.js
-/**
-* NOTE: tailwind.css is required to support the `@property --media-progress-fill` registration and animation keyframes. You should import from either:
-- "@videojs/html/tailwind.css" for HTML skins
-- "@videojs/react/tailwind.css" for React skins
-*/
-const inputFeedback = {
-	root: cn("absolute inset-x-0 top-0 bottom-14 pointer-events-none", "grid grid-cols-3 items-center justify-items-center overflow-hidden", "rounded-[inherit]", "@2xl/media-root:bottom-0", "[color:var(--media-color-primary,oklch(1_0_0))]"),
-	island: {
-		base: cn("group/input-indicator", "absolute top-0 inset-x-0", "pt-3 pb-32", "flex justify-center", "text-inherit font-medium", "origin-top pointer-events-none", "duration-100 ease-out", "data-starting-style:opacity-0", "data-ending-style:opacity-0", "data-starting-style:duration-400", "data-starting-style:ease-in", "data-ending-style:duration-400", "data-ending-style:ease-in", "[background-image:linear-gradient(to_bottom,oklch(0_0_0/0.35),oklch(0_0_0/0.2)_3rem,oklch(0_0_0/0))]", "text-shadow-2xs text-shadow-(color:--media-current-shadow-color)", "pointer-fine:will-change-[translate,filter,opacity]", "pointer-fine:transition-[translate,filter,opacity]", "pointer-coarse:will-change-[translate,opacity]", "pointer-coarse:transition-[translate,opacity]", "pointer-fine:motion-safe:data-starting-style:blur-sm", "pointer-fine:motion-safe:data-ending-style:blur-sm", "motion-safe:data-ending-style:-translate-y-full"),
-		content: cn("flex justify-between items-center gap-2 px-2.5 py-1", "*:last:ml-auto", "[@media(prefers-reduced-transparency:reduce)]:bg-(--media-controls-background-color)", "[@media(prefers-reduced-transparency:reduce)]:rounded-lg", "contrast-more:bg-(--media-controls-background-color) contrast-more:rounded-lg"),
-		volume: cn("*:data-feedback-island-content:w-[min(80%,14rem)]"),
-		volumeProgress: cn("[--media-progress-fill:var(--media-volume-fill)]", "w-full h-0.75 rounded-full", "[background-image:linear-gradient(to_right,currentColor_0%,currentColor_var(--media-progress-fill),oklch(from_currentColor_l_c_h/0.2)_var(--media-progress-fill),oklch(from_currentColor_l_c_h/0.2)_100%)]", "shadow-[0_1px_0_var(--media-current-shadow-color-subtle)]"),
-		shownVolume: cn("data-open:duration-100", "data-min:*:data-feedback-island-content:animate-media-shake", "data-max:*:data-feedback-island-content:animate-media-shake", "motion-reduce:data-min:*:data-feedback-island-content:animate-none", "motion-reduce:data-max:*:data-feedback-island-content:animate-none"),
-		shownStatus: cn("data-open:duration-100"),
-		icon: cn("hidden shrink-0", "drop-shadow-[0_1px_0_var(--media-current-shadow-color)]"),
-		shownVolumeHigh: "group-data-[level=high]/input-indicator:block",
-		shownVolumeLow: "group-data-[level=low]/input-indicator:block",
-		shownVolumeOff: "group-data-[level=off]/input-indicator:block",
-		shownCaptionsOn: "group-data-[status=captions-on]/input-indicator:block",
-		shownCaptionsOff: "group-data-[status=captions-off]/input-indicator:block",
-		shownFullscreenEnter: "group-data-[status=fullscreen]/input-indicator:block",
-		shownFullscreenExit: "group-data-[status=exit-fullscreen]/input-indicator:block",
-		shownPipEnter: "group-data-[status=pip]/input-indicator:block",
-		shownPipExit: "group-data-[status=exit-pip]/input-indicator:block",
-		value: "ml-auto"
-	},
-	bubble: {
-		base: cn("group/input-indicator", "col-start-2 row-start-1", "grid place-content-center text-center p-4", "data-direction:gap-1", "@2xl/media-root:data-direction:p-6", "not-data-direction:[transition-property:opacity,scale]", "not-data-direction:duration-200 not-data-direction:ease-out", "motion-reduce:not-data-direction:transition-opacity", "motion-reduce:not-data-direction:duration-50", "not-data-direction:data-starting-style:opacity-0", "not-data-direction:data-ending-style:opacity-0", "not-data-direction:data-starting-style:scale-[0.85]", "not-data-direction:data-ending-style:scale-[0.85]", "not-data-direction:data-ending-style:duration-100", "not-data-direction:data-ending-style:ease-in", "data-[direction=backward]:col-start-1 data-[direction=backward]:justify-self-start", "data-[direction=forward]:col-start-3 data-[direction=forward]:justify-self-end"),
-		icon: "hidden size-[calc(var(--media-icon-size)*2)]",
-		shownSeek: cn("group-data-direction/input-indicator:size-[calc(var(--media-icon-size)*1.5)]", "group-data-direction/input-indicator:block", "group-data-[direction=backward]/input-indicator:[scale:-1_1]", "motion-safe:transition-[translate,opacity] motion-safe:duration-200 motion-safe:ease-in-out", "motion-safe:group-data-starting-style/input-indicator:opacity-0", "motion-safe:group-data-ending-style/input-indicator:opacity-0", "motion-safe:group-data-[direction=forward]/input-indicator:group-data-starting-style/input-indicator:[translate:-60%_0]", "motion-safe:group-data-[direction=backward]/input-indicator:group-data-starting-style/input-indicator:[translate:60%_0]"),
-		shownPause: "group-data-[status=pause]/input-indicator:block",
-		shownPlay: "group-data-[status=play]/input-indicator:block",
-		time: "tabular-nums"
-	}
-};
-//#endregion
-export { inputFeedback };
-
-//# sourceMappingURL=input-feedback.js.map

package/dist/default/skins/dist/default/minimal/tailwind/components/input-feedback.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"input-feedback.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/input-feedback.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/components/input-feedback.ts\n/**\n* NOTE: tailwind.css is required to support the `@property --media-progress-fill` registration and animation keyframes. You should import from either:\n- \"@videojs/html/tailwind.css\" for HTML skins\n- \"@videojs/react/tailwind.css\" for React skins\n*/\nconst inputFeedback = {\n\troot: cn(\"absolute inset-x-0 top-0 bottom-14 pointer-events-none\", \"grid grid-cols-3 items-center justify-items-center overflow-hidden\", \"rounded-[inherit]\", \"@2xl/media-root:bottom-0\", \"[color:var(--media-color-primary,oklch(1_0_0))]\"),\n\tisland: {\n\t\tbase: cn(\"group/input-indicator\", \"absolute top-0 inset-x-0\", \"pt-3 pb-32\", \"flex justify-center\", \"text-inherit font-medium\", \"origin-top pointer-events-none\", \"duration-100 ease-out\", \"data-starting-style:opacity-0\", \"data-ending-style:opacity-0\", \"data-starting-style:duration-400\", \"data-starting-style:ease-in\", \"data-ending-style:duration-400\", \"data-ending-style:ease-in\", \"[background-image:linear-gradient(to_bottom,oklch(0_0_0/0.35),oklch(0_0_0/0.2)_3rem,oklch(0_0_0/0))]\", \"text-shadow-2xs text-shadow-(color:--media-current-shadow-color)\", \"pointer-fine:will-change-[translate,filter,opacity]\", \"pointer-fine:transition-[translate,filter,opacity]\", \"pointer-coarse:will-change-[translate,opacity]\", \"pointer-coarse:transition-[translate,opacity]\", \"pointer-fine:motion-safe:data-starting-style:blur-sm\", \"pointer-fine:motion-safe:data-ending-style:blur-sm\", \"motion-safe:data-ending-style:-translate-y-full\"),\n\t\tcontent: cn(\"flex justify-between items-center gap-2 px-2.5 py-1\", \"*:last:ml-auto\", \"[@media(prefers-reduced-transparency:reduce)]:bg-(--media-controls-background-color)\", \"[@media(prefers-reduced-transparency:reduce)]:rounded-lg\", \"contrast-more:bg-(--media-controls-background-color) contrast-more:rounded-lg\"),\n\t\tvolume: cn(\"*:data-feedback-island-content:w-[min(80%,14rem)]\"),\n\t\tvolumeProgress: cn(\"[--media-progress-fill:var(--media-volume-fill)]\", \"w-full h-0.75 rounded-full\", \"[background-image:linear-gradient(to_right,currentColor_0%,currentColor_var(--media-progress-fill),oklch(from_currentColor_l_c_h/0.2)_var(--media-progress-fill),oklch(from_currentColor_l_c_h/0.2)_100%)]\", \"shadow-[0_1px_0_var(--media-current-shadow-color-subtle)]\"),\n\t\tshownVolume: cn(\"data-open:duration-100\", \"data-min:*:data-feedback-island-content:animate-media-shake\", \"data-max:*:data-feedback-island-content:animate-media-shake\", \"motion-reduce:data-min:*:data-feedback-island-content:animate-none\", \"motion-reduce:data-max:*:data-feedback-island-content:animate-none\"),\n\t\tshownStatus: cn(\"data-open:duration-100\"),\n\t\ticon: cn(\"hidden shrink-0\", \"drop-shadow-[0_1px_0_var(--media-current-shadow-color)]\"),\n\t\tshownVolumeHigh: \"group-data-[level=high]/input-indicator:block\",\n\t\tshownVolumeLow: \"group-data-[level=low]/input-indicator:block\",\n\t\tshownVolumeOff: \"group-data-[level=off]/input-indicator:block\",\n\t\tshownCaptionsOn: \"group-data-[status=captions-on]/input-indicator:block\",\n\t\tshownCaptionsOff: \"group-data-[status=captions-off]/input-indicator:block\",\n\t\tshownFullscreenEnter: \"group-data-[status=fullscreen]/input-indicator:block\",\n\t\tshownFullscreenExit: \"group-data-[status=exit-fullscreen]/input-indicator:block\",\n\t\tshownPipEnter: \"group-data-[status=pip]/input-indicator:block\",\n\t\tshownPipExit: \"group-data-[status=exit-pip]/input-indicator:block\",\n\t\tvalue: \"ml-auto\"\n\t},\n\tbubble: {\n\t\tbase: cn(\"group/input-indicator\", \"col-start-2 row-start-1\", \"grid place-content-center text-center p-4\", \"data-direction:gap-1\", \"@2xl/media-root:data-direction:p-6\", \"not-data-direction:[transition-property:opacity,scale]\", \"not-data-direction:duration-200 not-data-direction:ease-out\", \"motion-reduce:not-data-direction:transition-opacity\", \"motion-reduce:not-data-direction:duration-50\", \"not-data-direction:data-starting-style:opacity-0\", \"not-data-direction:data-ending-style:opacity-0\", \"not-data-direction:data-starting-style:scale-[0.85]\", \"not-data-direction:data-ending-style:scale-[0.85]\", \"not-data-direction:data-ending-style:duration-100\", \"not-data-direction:data-ending-style:ease-in\", \"data-[direction=backward]:col-start-1 data-[direction=backward]:justify-self-start\", \"data-[direction=forward]:col-start-3 data-[direction=forward]:justify-self-end\"),\n\t\ticon: \"hidden size-[calc(var(--media-icon-size)*2)]\",\n\t\tshownSeek: cn(\"group-data-direction/input-indicator:size-[calc(var(--media-icon-size)*1.5)]\", \"group-data-direction/input-indicator:block\", \"group-data-[direction=backward]/input-indicator:[scale:-1_1]\", \"motion-safe:transition-[translate,opacity] motion-safe:duration-200 motion-safe:ease-in-out\", \"motion-safe:group-data-starting-style/input-indicator:opacity-0\", \"motion-safe:group-data-ending-style/input-indicator:opacity-0\", \"motion-safe:group-data-[direction=forward]/input-indicator:group-data-starting-style/input-indicator:[translate:-60%_0]\", \"motion-safe:group-data-[direction=backward]/input-indicator:group-data-starting-style/input-indicator:[translate:60%_0]\"),\n\t\tshownPause: \"group-data-[status=pause]/input-indicator:block\",\n\t\tshownPlay: \"group-data-[status=play]/input-indicator:block\",\n\t\ttime: \"tabular-nums\"\n\t}\n};\n//#endregion\nexport { inputFeedback };\n\n//# sourceMappingURL=input-feedback.js.map"],"mappings":";;;;;;;AAOA,MAAM,gBAAgB;CACrB,MAAM,GAAG,0DAA0D,sEAAsE,qBAAqB,4BAA4B,kDAAkD;CAC5O,QAAQ;EACP,MAAM,GAAG,yBAAyB,4BAA4B,cAAc,uBAAuB,4BAA4B,kCAAkC,yBAAyB,iCAAiC,+BAA+B,oCAAoC,+BAA+B,kCAAkC,6BAA6B,wGAAwG,oEAAoE,uDAAuD,sDAAsD,kDAAkD,iDAAiD,wDAAwD,sDAAsD,kDAAkD;EACx5B,SAAS,GAAG,uDAAuD,kBAAkB,wFAAwF,4DAA4D,gFAAgF;EACzT,QAAQ,GAAG,oDAAoD;EAC/D,gBAAgB,GAAG,oDAAoD,8BAA8B,8MAA8M,4DAA4D;EAC/W,aAAa,GAAG,0BAA0B,+DAA+D,+DAA+D,sEAAsE,qEAAqE;EACnT,aAAa,GAAG,yBAAyB;EACzC,MAAM,GAAG,mBAAmB,0DAA0D;EACtF,iBAAiB;EACjB,gBAAgB;EAChB,gBAAgB;EAChB,iBAAiB;EACjB,kBAAkB;EAClB,sBAAsB;EACtB,qBAAqB;EACrB,eAAe;EACf,cAAc;EACd,OAAO;EACP;CACD,QAAQ;EACP,MAAM,GAAG,yBAAyB,2BAA2B,6CAA6C,wBAAwB,sCAAsC,0DAA0D,+DAA+D,uDAAuD,gDAAgD,oDAAoD,kDAAkD,uDAAuD,qDAAqD,qDAAqD,gDAAgD,sFAAsF,iFAAiF;EACt2B,MAAM;EACN,WAAW,GAAG,gFAAgF,8CAA8C,gEAAgE,+FAA+F,mEAAmE,iEAAiE,2HAA2H,0HAA0H;EACpqB,YAAY;EACZ,WAAW;EACX,MAAM;EACN;CACD"}

package/dist/default/skins/dist/default/minimal/tailwind/components/root.js

@@ -1,8 +0,0 @@
-import { reset } from "./reset.js";
-import { cn } from "@videojs/utils/style";
-//#region ../skins/dist/default/minimal/tailwind/components/root.js
-const root = cn(reset, "block relative isolate h-full w-full @container/media-root", "rounded-(--media-border-radius,0.75rem)", "font-[Inter_Variable,Inter,ui-sans-serif,system-ui,sans-serif] text-[0.8125rem] leading-normal subpixel-antialiased", "outline-2 outline-transparent -outline-offset-4", "transition-[outline-offset,outline-color] duration-100 ease-out", "focus-visible:outline-current focus-visible:outline-offset-2", "scrollbar-thin scrollbar-thumb-current/30", "[@media_(prefers-reduced-transparency:reduce)_or_(prefers-contrast:more)]:scrollbar-auto", "[@media_(prefers-reduced-transparency:reduce)_or_(prefers-contrast:more)]:scrollbar-thumb-current/80", "[--media-current-shadow-color:oklch(from_currentColor_0_0_0/clamp(0,calc((l-0.5)*0.5),0.15))]", "[--media-current-shadow-color-subtle:oklch(from_var(--media-current-shadow-color)_l_c_h/calc(alpha*0.4))]", "[--media-icon-size:18px]");
-//#endregion
-export { root };
-
-//# sourceMappingURL=root.js.map

package/dist/default/skins/dist/default/minimal/tailwind/components/root.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"root.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/root.js"],"sourcesContent":["import { reset } from \"./reset.js\";\nimport { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/components/root.ts\nconst root = cn(reset, \"block relative isolate h-full w-full @container/media-root\", \"rounded-(--media-border-radius,0.75rem)\", \"font-[Inter_Variable,Inter,ui-sans-serif,system-ui,sans-serif] text-[0.8125rem] leading-normal subpixel-antialiased\", \"outline-2 outline-transparent -outline-offset-4\", \"transition-[outline-offset,outline-color] duration-100 ease-out\", \"focus-visible:outline-current focus-visible:outline-offset-2\", \"scrollbar-thin scrollbar-thumb-current/30\", \"[@media_(prefers-reduced-transparency:reduce)_or_(prefers-contrast:more)]:scrollbar-auto\", \"[@media_(prefers-reduced-transparency:reduce)_or_(prefers-contrast:more)]:scrollbar-thumb-current/80\", \"[--media-current-shadow-color:oklch(from_currentColor_0_0_0/clamp(0,calc((l-0.5)*0.5),0.15))]\", \"[--media-current-shadow-color-subtle:oklch(from_var(--media-current-shadow-color)_l_c_h/calc(alpha*0.4))]\", \"[--media-icon-size:18px]\");\n//#endregion\nexport { root };\n\n//# sourceMappingURL=root.js.map"],"mappings":";;;AAGA,MAAM,OAAO,GAAG,OAAO,8DAA8D,2CAA2C,uHAAuH,mDAAmD,mEAAmE,gEAAgE,6CAA6C,4FAA4F,wGAAwG,iGAAiG,6GAA6G,2BAA2B"}

package/dist/default/tailwind.css

@@ -1,42 +0,0 @@
-/* -------------------------------------------------------------------------- */
-/* Supporting @keyframes, @properties and @theme for Tailwind CSS             */
-/* -------------------------------------------------------------------------- */
-
-/* -------------------------------------------------------------------------- */
-/* Global @keyframes for all video skins (CSS & Tailwind)                     */
-/* -------------------------------------------------------------------------- */
-
-@keyframes media-shake {
-  0%,
-  100% {
-    translate: 0 0;
-  }
-  20% {
-    translate: -6px 0;
-  }
-  40% {
-    translate: 4px 0;
-  }
-  60% {
-    translate: -2px 0;
-  }
-  80% {
-    translate: 1px 0;
-  }
-}
-
-/* -------------------------------------------------------------------------- */
-/* Global @properties for all video skins (CSS & Tailwind)                    */
-/* -------------------------------------------------------------------------- */
-
-@property --media-progress-fill {
-  syntax: "<percentage>";
-  inherits: true;
-  initial-value: 0%;
-}
-
-
-@theme {
-  --animate-media-shake: media-shake 300ms ease-in-out;
-}
-

package/dist/default/ui/input-indicators/use-indicator-visibility.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-indicator-visibility.js","names":[],"sources":["../../../../src/ui/input-indicators/use-indicator-visibility.ts"],"sourcesContent":["'use client';\n\nimport type { IndicatorVisibilityHandle } from '@videojs/core';\nimport { getIndicatorVisibilityCoordinator } from '@videojs/core/dom';\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useContainer } from '../../player/context';\nimport { useLatestRef } from '../../utils/use-latest-ref';\n\nexport function useIndicatorVisibility(close: () => void): () => void {\n  const container = useContainer();\n  const closeRef = useLatestRef(close);\n  const coordinatorRef = useRef<ReturnType<typeof getIndicatorVisibilityCoordinator> | null>(null);\n  const [handle] = useState<IndicatorVisibilityHandle>(() => ({\n    close: () => closeRef.current(),\n  }));\n\n  useEffect(() => {\n    if (!container) return;\n\n    const coordinator = getIndicatorVisibilityCoordinator(container);\n    coordinatorRef.current = coordinator;\n\n    return coordinator.register(handle);\n  }, [container, handle]);\n\n  return useCallback(() => {\n    coordinatorRef.current?.show(handle);\n  }, [handle]);\n}\n"],"mappings":";;;;;;AASA,SAAgB,uBAAuB,OAA+B;CACpE,MAAM,YAAY,cAAc;CAChC,MAAM,WAAW,aAAa,MAAM;CACpC,MAAM,iBAAiB,OAAoE,KAAK;CAChG,MAAM,CAAC,UAAU,gBAA2C,EAC1D,aAAa,SAAS,SAAS,EAChC,EAAE;AAEH,iBAAgB;AACd,MAAI,CAAC,UAAW;EAEhB,MAAM,cAAc,kCAAkC,UAAU;AAChE,iBAAe,UAAU;AAEzB,SAAO,YAAY,SAAS,OAAO;IAClC,CAAC,WAAW,OAAO,CAAC;AAEvB,QAAO,kBAAkB;AACvB,iBAAe,SAAS,KAAK,OAAO;IACnC,CAAC,OAAO,CAAC"}

package/dist/default/ui/input-indicators/use-input-action-subscription.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-input-action-subscription.js","names":[],"sources":["../../../../src/ui/input-indicators/use-input-action-subscription.ts"],"sourcesContent":["'use client';\n\nimport type { InputActionEvent, MediaSnapshot } from '@videojs/core';\nimport { getMediaSnapshot, subscribeToInputActions } from '@videojs/core/dom';\nimport { useEffect } from 'react';\n\nimport { useContainer, usePlayer } from '../../player/context';\nimport { useLatestRef } from '../../utils/use-latest-ref';\n\nexport function useInputActionSubscription(callback: (event: InputActionEvent, snapshot: MediaSnapshot) => void): void {\n  const container = useContainer();\n  const store = usePlayer();\n  const callbackRef = useLatestRef(callback);\n  const storeRef = useLatestRef(store);\n\n  useEffect(() => {\n    if (!container) return;\n\n    return subscribeToInputActions(container, (event) => {\n      callbackRef.current(event, getMediaSnapshot(storeRef.current));\n    });\n  }, [container]);\n}\n"],"mappings":";;;;;;AASA,SAAgB,2BAA2B,UAA4E;CACrH,MAAM,YAAY,cAAc;CAChC,MAAM,QAAQ,WAAW;CACzB,MAAM,cAAc,aAAa,SAAS;CAC1C,MAAM,WAAW,aAAa,MAAM;AAEpC,iBAAgB;AACd,MAAI,CAAC,UAAW;AAEhB,SAAO,wBAAwB,YAAY,UAAU;AACnD,eAAY,QAAQ,OAAO,iBAAiB,SAAS,QAAQ,CAAC;IAC9D;IACD,CAAC,UAAU,CAAC"}

package/dist/default/ui/input-indicators/use-input-indicator-root.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-input-indicator-root.js","names":[],"sources":["../../../../src/ui/input-indicators/use-input-indicator-root.ts"],"sourcesContent":["'use client';\n\nimport type { IndicatorLifecycleState, InputActionEvent, MediaSnapshot } from '@videojs/core';\nimport type { State as StoreState } from '@videojs/store';\nimport { useState, useSyncExternalStore } from 'react';\n\nimport { useDestroy } from '../../utils/use-destroy';\nimport { useIndicatorVisibility } from './use-indicator-visibility';\nimport { useInputActionSubscription } from './use-input-action-subscription';\nimport { type RenderedIndicatorOptions, useRenderedIndicatorState } from './use-rendered-indicator-state';\n\ninterface InputIndicatorRootCore<IndicatorState extends IndicatorLifecycleState, Props> {\n  readonly state: StoreState<IndicatorState>;\n  setProps(props: Props): void;\n  destroy(): void;\n  close(): void;\n  processEvent(event: InputActionEvent, snapshot: MediaSnapshot): boolean;\n}\n\nexport function useInputIndicatorRoot<IndicatorState extends IndicatorLifecycleState, Props>(\n  createCore: () => InputIndicatorRootCore<IndicatorState, Props>,\n  props: Props,\n  options?: RenderedIndicatorOptions\n) {\n  const [core] = useState(createCore);\n  useDestroy(core);\n  core.setProps(props);\n  const showIndicator = useIndicatorVisibility(() => core.close());\n\n  useInputActionSubscription((event, snapshot) => {\n    if (core.processEvent(event, snapshot)) showIndicator();\n  });\n\n  const currentState = useSyncExternalStore(\n    (callback) => core.state.subscribe(callback),\n    () => core.state.current,\n    () => core.state.current\n  );\n\n  return useRenderedIndicatorState(currentState, options);\n}\n"],"mappings":";;;;;;;AAmBA,SAAgB,sBACd,YACA,OACA,SACA;CACA,MAAM,CAAC,QAAQ,SAAS,WAAW;AACnC,YAAW,KAAK;AAChB,MAAK,SAAS,MAAM;CACpB,MAAM,gBAAgB,6BAA6B,KAAK,OAAO,CAAC;AAEhE,6BAA4B,OAAO,aAAa;AAC9C,MAAI,KAAK,aAAa,OAAO,SAAS,CAAE,gBAAe;GACvD;AAQF,QAAO,0BANc,sBAClB,aAAa,KAAK,MAAM,UAAU,SAAS,QACtC,KAAK,MAAM,eACX,KAAK,MAAM,QAClB,EAE8C,QAAQ"}

package/dist/default/ui/input-indicators/use-rendered-indicator-state.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-rendered-indicator-state.js","names":[],"sources":["../../../../src/ui/input-indicators/use-rendered-indicator-state.ts"],"sourcesContent":["'use client';\n\nimport { getRenderedIndicatorState, type IndicatorLifecycleState, isIndicatorPresent } from '@videojs/core';\nimport { createTransition } from '@videojs/core/dom';\nimport { useLayoutEffect, useRef, useState, useSyncExternalStore } from 'react';\n\nimport { useDestroy } from '../../utils/use-destroy';\n\nexport interface RenderedIndicatorOptions {\n  replayOnUpdate?: boolean | undefined;\n}\n\nexport function useRenderedIndicatorState<State extends IndicatorLifecycleState>(\n  currentState: State,\n  options: RenderedIndicatorOptions = {}\n) {\n  const elementRef = useRef<HTMLElement>(null);\n  const currentStateRef = useRef(currentState);\n  const snapshotRef = useRef(currentState);\n  const [transition] = useState(() => createTransition());\n  useDestroy(transition);\n  currentStateRef.current = currentState;\n\n  const transitionState = useSyncExternalStore(\n    (callback) => transition.state.subscribe(callback),\n    () => transition.state.current,\n    () => transition.state.current\n  );\n\n  const { generation, open } = currentState;\n\n  useLayoutEffect(() => {\n    if (open) {\n      const nextState = currentStateRef.current;\n      if (nextState.generation !== generation) return;\n\n      snapshotRef.current = nextState;\n      const transitionState = transition.state.current;\n      if (!transitionState.active || options.replayOnUpdate !== false) {\n        void transition.open(elementRef.current);\n      } else if (transitionState.status === 'ending') {\n        transition.cancel();\n      }\n      return;\n    }\n\n    const { active, status } = transition.state.current;\n    if (active && status !== 'ending') {\n      void transition.close(elementRef.current);\n    }\n  }, [generation, open, options.replayOnUpdate, transition]);\n\n  return {\n    elementRef,\n    present: isIndicatorPresent(currentState, transitionState),\n    state: getRenderedIndicatorState(currentState, snapshotRef.current, transitionState),\n  };\n}\n"],"mappings":";;;;;;AAYA,SAAgB,0BACd,cACA,UAAoC,EAAE,EACtC;CACA,MAAM,aAAa,OAAoB,KAAK;CAC5C,MAAM,kBAAkB,OAAO,aAAa;CAC5C,MAAM,cAAc,OAAO,aAAa;CACxC,MAAM,CAAC,cAAc,eAAe,kBAAkB,CAAC;AACvD,YAAW,WAAW;AACtB,iBAAgB,UAAU;CAE1B,MAAM,kBAAkB,sBACrB,aAAa,WAAW,MAAM,UAAU,SAAS,QAC5C,WAAW,MAAM,eACjB,WAAW,MAAM,QACxB;CAED,MAAM,EAAE,YAAY,SAAS;AAE7B,uBAAsB;AACpB,MAAI,MAAM;GACR,MAAM,YAAY,gBAAgB;AAClC,OAAI,UAAU,eAAe,WAAY;AAEzC,eAAY,UAAU;GACtB,MAAM,kBAAkB,WAAW,MAAM;AACzC,OAAI,CAAC,gBAAgB,UAAU,QAAQ,mBAAmB,MACnD,YAAW,KAAK,WAAW,QAAQ;YAC/B,gBAAgB,WAAW,SACpC,YAAW,QAAQ;AAErB;;EAGF,MAAM,EAAE,QAAQ,WAAW,WAAW,MAAM;AAC5C,MAAI,UAAU,WAAW,SAClB,YAAW,MAAM,WAAW,QAAQ;IAE1C;EAAC;EAAY;EAAM,QAAQ;EAAgB;EAAW,CAAC;AAE1D,QAAO;EACL;EACA,SAAS,mBAAmB,cAAc,gBAAgB;EAC1D,OAAO,0BAA0B,cAAc,YAAY,SAAS,gBAAgB;EACrF"}

package/dist/default/ui/menu/menu-back.js

@@ -1,30 +0,0 @@
-"use client";
-import { renderElement } from "../../utils/use-render.js";
-import { useSubMenuContext } from "./context.js";
-import { forwardRef, useCallback } from "react";
-//#region src/ui/menu/menu-back.tsx
-/** Button that navigates back to the parent menu view. Place at the top of a submenu Content. */
-const MenuBack = forwardRef(function MenuBack({ render, className, style, label = "Back", onClick, ...elementProps }, forwardedRef) {
-	const parentMenu = useSubMenuContext()?.parentMenu ?? null;
-	const handleClick = useCallback((event) => {
-		onClick?.(event);
-		parentMenu?.pop();
-	}, [onClick, parentMenu]);
-	return renderElement("button", {
-		render,
-		className,
-		style
-	}, {
-		state: parentMenu?.state ?? {},
-		ref: forwardedRef,
-		props: [{
-			type: "button",
-			"aria-label": label,
-			onClick: handleClick
-		}, elementProps]
-	});
-});
-//#endregion
-export { MenuBack };
-
-//# sourceMappingURL=menu-back.js.map

package/dist/default/ui/menu/menu-back.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu-back.js","names":[],"sources":["../../../../src/ui/menu/menu-back.tsx"],"sourcesContent":["'use client';\n\nimport type { MenuState } from '@videojs/core';\nimport { forwardRef, useCallback } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSubMenuContext } from './context';\n\nexport interface MenuBackProps extends UIComponentProps<'button', MenuState> {\n  /** Accessible label for the back button. */\n  label?: string;\n}\n\n/** Button that navigates back to the parent menu view. Place at the top of a submenu Content. */\nexport const MenuBack = forwardRef<HTMLButtonElement, MenuBackProps>(function MenuBack(\n  { render, className, style, label = 'Back', onClick, ...elementProps },\n  forwardedRef\n) {\n  const subMenuCtx = useSubMenuContext();\n  const parentMenu = subMenuCtx?.parentMenu ?? null;\n\n  const handleClick = useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(event);\n      parentMenu?.pop();\n    },\n    [onClick, parentMenu]\n  );\n\n  return renderElement(\n    'button',\n    { render, className, style },\n    {\n      state: parentMenu?.state ?? ({} as MenuState),\n      ref: forwardedRef,\n      props: [\n        {\n          type: 'button' as const,\n          'aria-label': label,\n          onClick: handleClick,\n        },\n        elementProps,\n      ],\n    }\n  );\n});\n\nexport namespace MenuBack {\n  export type Props = MenuBackProps;\n  export type State = MenuState;\n}\n"],"mappings":";;;;;;AAeA,MAAa,WAAW,WAA6C,SAAS,SAC5E,EAAE,QAAQ,WAAW,OAAO,QAAQ,QAAQ,SAAS,GAAG,gBACxD,cACA;CAEA,MAAM,aADa,mBAAmB,EACP,cAAc;CAE7C,MAAM,cAAc,aACjB,UAA+C;AAC9C,YAAU,MAAM;AAChB,cAAY,KAAK;IAEnB,CAAC,SAAS,WAAW,CACtB;AAED,QAAO,cACL,UACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE,OAAO,YAAY,SAAU,EAAE;EAC/B,KAAK;EACL,OAAO,CACL;GACE,MAAM;GACN,cAAc;GACd,SAAS;GACV,EACD,aACD;EACF,CACF;EACD"}