@videojs/react 10.0.0-beta.21 → 10.0.0-beta.23

package/dist/dev/media/dash-video/index.d.ts

@@ -1,13 +1,12 @@
-import * as react from "react";
-import { PropsWithChildren, VideoHTMLAttributes } from "react";
-import { DashMedia } from "@videojs/core/dom/media/dash";
-import { InferClassProps } from "@videojs/utils/types";
+import * as _$react from "react";
+import { ReactNode, VideoHTMLAttributes } from "react";
+import { DashMediaProps } from "@videojs/core/dom/media/dash";
 
 //#region src/media/dash-video/index.d.ts
-type DashVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>> & InferClassProps<typeof DashMedia>;
-declare const DashVideo: react.ForwardRefExoticComponent<VideoHTMLAttributes<HTMLVideoElement> & {
-  children?: react.ReactNode | undefined;
-} & Partial<Pick<DashMedia, "src" | "currentTime" | "volume" | "muted" | "playbackRate">> & react.RefAttributes<HTMLVideoElement>>;
+interface DashVideoProps extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof DashMediaProps>, Partial<DashMediaProps> {
+  children?: ReactNode;
+}
+declare const DashVideo: _$react.ForwardRefExoticComponent<DashVideoProps & _$react.RefAttributes<HTMLVideoElement>>;
 declare namespace DashVideo {
   type Props = DashVideoProps;
 }

package/dist/dev/media/dash-video/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/dash-video/index.tsx"],"mappings":";;;;;;KAWY,cAAA,GAAiB,iBAAA,CAAkB,mBAAA,CAAoB,gBAAA,KACjE,eAAA,QAAuB,SAAA;AAAA,cAEZ,SAAA,QAAS,yBAAA,CAAA,mBAAA,CAAA,gBAAA;aAAA,KAAA,CAAA,SAAA;AAAA;kBAYL,SAAA;EAAA,KACH,KAAA,GAAQ,cAAA;AAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/dash-video/index.tsx"],"mappings":";;;;;UAWiB,cAAA,SACP,IAAA,CAAK,mBAAA,CAAoB,gBAAA,SAAyB,cAAA,GACxD,OAAA,CAAQ,cAAA;EACV,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,SAAA,EAAS,OAAA,CAAA,yBAAA,CAAA,cAAA,GAAA,OAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBAaL,SAAA;EAAA,KACH,KAAA,GAAQ,cAAA;AAAA"}

package/dist/dev/media/dash-video/index.js

@@ -1,17 +1,17 @@
 "use client";
 import { useComposedRefs } from "../../utils/use-composed-refs.js";
-import { attachMediaElement } from "../../utils/attach-media-element.js";
-import { mediaProps } from "../../utils/media-props.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 { DashMedia } from "@videojs/core/dom/media/dash";
+import { DashMedia, dashMediaDefaultProps } from "@videojs/core/dom/media/dash";
 //#region src/media/dash-video/index.tsx
 const DashVideo = forwardRef(function DashVideo({ children, ...props }, ref) {
-	const mediaApi = useMediaInstance(DashMedia);
+	const media = useMediaInstance(DashMedia);
 	return /* @__PURE__ */ jsx("video", {
-		ref: useComposedRefs(attachMediaElement(mediaApi), ref),
-		...mediaProps(mediaApi, DashMedia, props),
+		ref: useComposedRefs(useAttachMedia(media), ref),
+		...useSyncProps(media, props, dashMediaDefaultProps),
 		children
 	});
 });

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/dash-video/index.tsx"],"sourcesContent":["'use client';\n\nimport { DashMedia } from '@videojs/core/dom/media/dash';\nimport type { InferClassProps } from '@videojs/utils/types';\nimport type { PropsWithChildren, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { attachMediaElement } from '../../utils/attach-media-element';\nimport { mediaProps } from '../../utils/media-props';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\n\nexport type DashVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>> &\n  InferClassProps<typeof DashMedia>;\n\nexport const DashVideo = forwardRef<HTMLVideoElement, DashVideoProps>(function DashVideo({ children, ...props }, ref) {\n  const mediaApi = useMediaInstance(DashMedia);\n\n  const composedRef = useComposedRefs(attachMediaElement(mediaApi), ref);\n\n  return (\n    <video ref={composedRef} {...mediaProps(mediaApi, DashMedia, props)}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace DashVideo {\n  export type Props = DashVideoProps;\n}\n"],"mappings":";;;;;;;;;AAcA,MAAa,YAAY,WAA6C,SAAS,UAAU,EAAE,UAAU,GAAG,SAAS,KAAK;CACpH,MAAM,WAAW,iBAAiB,UAAU;AAI5C,QACE,oBAAC,SAAD;EAAO,KAHW,gBAAgB,mBAAmB,SAAS,EAAE,IAAI;EAG3C,GAAI,WAAW,UAAU,WAAW,MAAM;EAChE;EACK,CAAA;EAEV"}
+{"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 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);\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":";;;;;;;;;AAiBA,MAAa,YAAY,WAA6C,SAAS,UAAU,EAAE,UAAU,GAAG,SAAS,KAAK;CACpH,MAAM,QAAQ,iBAAiB,UAAU;AAKzC,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,sBAAsB;EAI9D;EACK,CAAA;EAEV"}

package/dist/dev/media/hls-video/index.d.ts

@@ -1,13 +1,12 @@
-import * as react from "react";
-import { PropsWithChildren, VideoHTMLAttributes } from "react";
-import { HlsMedia } from "@videojs/core/dom/media/hls";
-import { InferClassProps } from "@videojs/utils/types";
+import * as _$react from "react";
+import { ReactNode, VideoHTMLAttributes } from "react";
+import { HlsMediaProps } from "@videojs/core/dom/media/hls";
 
 //#region src/media/hls-video/index.d.ts
-type HlsVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>> & InferClassProps<typeof HlsMedia>;
-declare const HlsVideo: react.ForwardRefExoticComponent<VideoHTMLAttributes<HTMLVideoElement> & {
-  children?: react.ReactNode | undefined;
-} & Partial<Pick<HlsMedia, "src" | "currentTime" | "volume" | "muted" | "playbackRate" | "preload" | "type" | "preferPlayback" | "config" | "debug">> & react.RefAttributes<HTMLVideoElement>>;
+interface HlsVideoProps extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof HlsMediaProps>, Partial<HlsMediaProps> {
+  children?: ReactNode;
+}
+declare const HlsVideo: _$react.ForwardRefExoticComponent<HlsVideoProps & _$react.RefAttributes<HTMLVideoElement>>;
 declare namespace HlsVideo {
   type Props = HlsVideoProps;
 }

package/dist/dev/media/hls-video/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/hls-video/index.tsx"],"mappings":";;;;;;KAWY,aAAA,GAAgB,iBAAA,CAAkB,mBAAA,CAAoB,gBAAA,KAAqB,eAAA,QAAuB,QAAA;AAAA,cAEjG,QAAA,QAAQ,yBAAA,CAAA,mBAAA,CAAA,gBAAA;aAAA,KAAA,CAAA,SAAA;AAAA;kBAYJ,QAAA;EAAA,KACH,KAAA,GAAQ,aAAA;AAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/hls-video/index.tsx"],"mappings":";;;;;UAWiB,aAAA,SACP,IAAA,CAAK,mBAAA,CAAoB,gBAAA,SAAyB,aAAA,GACxD,OAAA,CAAQ,aAAA;EACV,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,QAAA,EAAQ,OAAA,CAAA,yBAAA,CAAA,aAAA,GAAA,OAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBAaJ,QAAA;EAAA,KACH,KAAA,GAAQ,aAAA;AAAA"}

package/dist/dev/media/hls-video/index.js

@@ -1,17 +1,17 @@
 "use client";
 import { useComposedRefs } from "../../utils/use-composed-refs.js";
-import { attachMediaElement } from "../../utils/attach-media-element.js";
-import { mediaProps } from "../../utils/media-props.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 { HlsMedia } from "@videojs/core/dom/media/hls";
+import { HlsMedia, hlsMediaDefaultProps } from "@videojs/core/dom/media/hls";
 //#region src/media/hls-video/index.tsx
 const HlsVideo = forwardRef(function HlsVideo({ children, ...props }, ref) {
-	const mediaApi = useMediaInstance(HlsMedia);
+	const media = useMediaInstance(HlsMedia);
 	return /* @__PURE__ */ jsx("video", {
-		ref: useComposedRefs(attachMediaElement(mediaApi), ref),
-		...mediaProps(mediaApi, HlsMedia, props),
+		ref: useComposedRefs(useAttachMedia(media), ref),
+		...useSyncProps(media, props, hlsMediaDefaultProps),
 		children
 	});
 });

package/dist/dev/media/hls-video/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/hls-video/index.tsx"],"sourcesContent":["'use client';\n\nimport { HlsMedia } from '@videojs/core/dom/media/hls';\nimport type { InferClassProps } from '@videojs/utils/types';\nimport type { PropsWithChildren, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { attachMediaElement } from '../../utils/attach-media-element';\nimport { mediaProps } from '../../utils/media-props';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\n\nexport type HlsVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>> & InferClassProps<typeof HlsMedia>;\n\nexport const HlsVideo = forwardRef<HTMLVideoElement, HlsVideoProps>(function HlsVideo({ children, ...props }, ref) {\n  const mediaApi = useMediaInstance(HlsMedia);\n\n  const composedRef = useComposedRefs(attachMediaElement(mediaApi), ref);\n\n  return (\n    <video ref={composedRef} {...mediaProps(mediaApi, HlsMedia, props)}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace HlsVideo {\n  export type Props = HlsVideoProps;\n}\n"],"mappings":";;;;;;;;;AAaA,MAAa,WAAW,WAA4C,SAAS,SAAS,EAAE,UAAU,GAAG,SAAS,KAAK;CACjH,MAAM,WAAW,iBAAiB,SAAS;AAI3C,QACE,oBAAC,SAAD;EAAO,KAHW,gBAAgB,mBAAmB,SAAS,EAAE,IAAI;EAG3C,GAAI,WAAW,UAAU,UAAU,MAAM;EAC/D;EACK,CAAA;EAEV"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/hls-video/index.tsx"],"sourcesContent":["'use client';\n\nimport type { HlsMediaProps } from '@videojs/core/dom/media/hls';\nimport { HlsMedia, hlsMediaDefaultProps } from '@videojs/core/dom/media/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 HlsVideoProps\n  extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof HlsMediaProps>,\n    Partial<HlsMediaProps> {\n  children?: ReactNode;\n}\n\nexport const HlsVideo = forwardRef<HTMLVideoElement, HlsVideoProps>(function HlsVideo({ children, ...props }, ref) {\n  const media = useMediaInstance(HlsMedia);\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 HlsVideo {\n  export type Props = HlsVideoProps;\n}\n"],"mappings":";;;;;;;;;AAiBA,MAAa,WAAW,WAA4C,SAAS,SAAS,EAAE,UAAU,GAAG,SAAS,KAAK;CACjH,MAAM,QAAQ,iBAAiB,SAAS;AAKxC,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,qBAAqB;EAI7D;EACK,CAAA;EAEV"}

package/dist/dev/media/mux-audio/index.d.ts

@@ -1,13 +1,15 @@
-import * as react from "react";
-import { AudioHTMLAttributes, PropsWithChildren } from "react";
-import { MuxAudioMedia } from "@videojs/core/dom/media/mux";
-import { InferClassProps } from "@videojs/utils/types";
+import * as _$react from "react";
+import { AudioHTMLAttributes, ReactNode } from "react";
+import { MuxMediaProps } from "@videojs/core/dom/media/mux";
 
 //#region src/media/mux-audio/index.d.ts
-type MuxAudioProps = PropsWithChildren<AudioHTMLAttributes<HTMLAudioElement>> & InferClassProps<typeof MuxAudioMedia>;
-declare const MuxAudio: react.ForwardRefExoticComponent<AudioHTMLAttributes<HTMLAudioElement> & {
-  children?: react.ReactNode | undefined;
-} & Partial<Pick<MuxAudioMedia, "src" | "currentTime" | "volume" | "muted" | "playbackRate" | "preload" | "type" | "preferPlayback" | "config" | "debug" | "metadata" | "MuxDataSdk" | "beaconCollectionDomain" | "disableCookies" | "envKey" | "playerSoftwareName" | "playerSoftwareVersion" | "playerInitTime">> & react.RefAttributes<HTMLAudioElement>>;
+interface MuxAudioProps extends Omit<AudioHTMLAttributes<HTMLAudioElement>, keyof MuxMediaProps>, Partial<MuxMediaProps> {
+  children?: ReactNode;
+}
+declare const MuxAudio: _$react.ForwardRefExoticComponent<MuxAudioProps & _$react.RefAttributes<HTMLAudioElement>>;
+declare namespace MuxAudio {
+  type Props = MuxAudioProps;
+}
 //#endregion
-export { MuxAudio, MuxAudio as default, MuxAudioProps };
+export { MuxAudio, MuxAudioProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/dev/media/mux-audio/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/mux-audio/index.tsx"],"mappings":";;;;;;KASY,aAAA,GAAgB,iBAAA,CAAkB,mBAAA,CAAoB,gBAAA,KAChE,eAAA,QAAuB,aAAA;AAAA,cAEZ,QAAA,QAAQ,yBAAA,CAAA,mBAAA,CAAA,gBAAA;aAAA,KAAA,CAAA,SAAA;AAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/mux-audio/index.tsx"],"mappings":";;;;;UAWiB,aAAA,SACP,IAAA,CAAK,mBAAA,CAAoB,gBAAA,SAAyB,aAAA,GACxD,OAAA,CAAQ,aAAA;EACV,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,QAAA,EAAQ,OAAA,CAAA,yBAAA,CAAA,aAAA,GAAA,OAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBAaJ,QAAA;EAAA,KACH,KAAA,GAAQ,aAAA;AAAA"}

package/dist/dev/media/mux-audio/index.js

@@ -1,20 +1,21 @@
+"use client";
 import { useComposedRefs } from "../../utils/use-composed-refs.js";
-import { attachMediaElement } from "../../utils/attach-media-element.js";
-import { mediaProps } from "../../utils/media-props.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 { MuxAudioMedia } from "@videojs/core/dom/media/mux";
+import { MuxAudioMedia, muxMediaDefaultProps } from "@videojs/core/dom/media/mux";
 //#region src/media/mux-audio/index.tsx
-const MuxAudio = forwardRef(({ children, ...props }, ref) => {
-	const mediaApi = useMediaInstance(MuxAudioMedia);
+const MuxAudio = forwardRef(function MuxAudio({ children, ...props }, ref) {
+	const media = useMediaInstance(MuxAudioMedia);
 	return /* @__PURE__ */ jsx("audio", {
-		ref: useComposedRefs(attachMediaElement(mediaApi), ref),
-		...mediaProps(mediaApi, MuxAudioMedia, props),
+		ref: useComposedRefs(useAttachMedia(media), ref),
+		...useSyncProps(media, props, muxMediaDefaultProps),
 		children
 	});
 });
 //#endregion
-export { MuxAudio, MuxAudio as default };
+export { MuxAudio };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-audio/index.tsx"],"sourcesContent":["import { MuxAudioMedia } from '@videojs/core/dom/media/mux';\nimport type { InferClassProps } from '@videojs/utils/types';\nimport type { AudioHTMLAttributes, PropsWithChildren } from 'react';\nimport { forwardRef } from 'react';\nimport { attachMediaElement } from '../../utils/attach-media-element';\nimport { mediaProps } from '../../utils/media-props';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\n\nexport type MuxAudioProps = PropsWithChildren<AudioHTMLAttributes<HTMLAudioElement>> &\n  InferClassProps<typeof MuxAudioMedia>;\n\nexport const MuxAudio = forwardRef<HTMLAudioElement, MuxAudioProps>(({ children, ...props }, ref) => {\n  const mediaApi = useMediaInstance(MuxAudioMedia);\n\n  const composedRef = useComposedRefs(attachMediaElement(mediaApi), ref);\n\n  return (\n    <audio ref={composedRef} {...mediaProps(mediaApi, MuxAudioMedia, props)}>\n      {children}\n    </audio>\n  );\n});\n\nexport default MuxAudio;\n"],"mappings":";;;;;;;;AAYA,MAAa,WAAW,YAA6C,EAAE,UAAU,GAAG,SAAS,QAAQ;CACnG,MAAM,WAAW,iBAAiB,cAAc;AAIhD,QACE,oBAAC,SAAD;EAAO,KAHW,gBAAgB,mBAAmB,SAAS,EAAE,IAAI;EAG3C,GAAI,WAAW,UAAU,eAAe,MAAM;EACpE;EACK,CAAA;EAEV"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-audio/index.tsx"],"sourcesContent":["'use client';\n\nimport type { MuxMediaProps } from '@videojs/core/dom/media/mux';\nimport { MuxAudioMedia, muxMediaDefaultProps } 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 MuxMediaProps>,\n    Partial<MuxMediaProps> {\n  children?: ReactNode;\n}\n\nexport const MuxAudio = forwardRef<HTMLAudioElement, MuxAudioProps>(function MuxAudio({ children, ...props }, ref) {\n  const media = useMediaInstance(MuxAudioMedia);\n  const attachRef = useAttachMedia(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const htmlProps = useSyncProps(media, props, muxMediaDefaultProps);\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":";;;;;;;;;AAiBA,MAAa,WAAW,WAA4C,SAAS,SAAS,EAAE,UAAU,GAAG,SAAS,KAAK;CACjH,MAAM,QAAQ,iBAAiB,cAAc;AAK7C,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,qBAAqB;EAI7D;EACK,CAAA;EAEV"}

package/dist/dev/media/mux-video/index.d.ts

@@ -1,13 +1,12 @@
-import * as react from "react";
-import { PropsWithChildren, VideoHTMLAttributes } from "react";
-import { MuxVideoMedia } from "@videojs/core/dom/media/mux";
-import { InferClassProps } from "@videojs/utils/types";
+import * as _$react from "react";
+import { ReactNode, VideoHTMLAttributes } from "react";
+import { MuxMediaProps } from "@videojs/core/dom/media/mux";
 
 //#region src/media/mux-video/index.d.ts
-type MuxVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>> & InferClassProps<typeof MuxVideoMedia>;
-declare const MuxVideo: react.ForwardRefExoticComponent<VideoHTMLAttributes<HTMLVideoElement> & {
-  children?: react.ReactNode | undefined;
-} & Partial<Pick<MuxVideoMedia, "src" | "currentTime" | "volume" | "muted" | "playbackRate" | "preload" | "type" | "preferPlayback" | "config" | "debug" | "metadata" | "MuxDataSdk" | "beaconCollectionDomain" | "disableCookies" | "envKey" | "playerSoftwareName" | "playerSoftwareVersion" | "playerInitTime">> & react.RefAttributes<HTMLVideoElement>>;
+interface MuxVideoProps extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof MuxMediaProps>, Partial<MuxMediaProps> {
+  children?: ReactNode;
+}
+declare const MuxVideo: _$react.ForwardRefExoticComponent<MuxVideoProps & _$react.RefAttributes<HTMLVideoElement>>;
 declare namespace MuxVideo {
   type Props = MuxVideoProps;
 }

package/dist/dev/media/mux-video/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/mux-video/index.tsx"],"mappings":";;;;;;KAWY,aAAA,GAAgB,iBAAA,CAAkB,mBAAA,CAAoB,gBAAA,KAChE,eAAA,QAAuB,aAAA;AAAA,cAEZ,QAAA,QAAQ,yBAAA,CAAA,mBAAA,CAAA,gBAAA;aAAA,KAAA,CAAA,SAAA;AAAA;kBAYJ,QAAA;EAAA,KACH,KAAA,GAAQ,aAAA;AAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/mux-video/index.tsx"],"mappings":";;;;;UAWiB,aAAA,SACP,IAAA,CAAK,mBAAA,CAAoB,gBAAA,SAAyB,aAAA,GACxD,OAAA,CAAQ,aAAA;EACV,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,QAAA,EAAQ,OAAA,CAAA,yBAAA,CAAA,aAAA,GAAA,OAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBAaJ,QAAA;EAAA,KACH,KAAA,GAAQ,aAAA;AAAA"}

package/dist/dev/media/mux-video/index.js

@@ -1,17 +1,17 @@
 "use client";
 import { useComposedRefs } from "../../utils/use-composed-refs.js";
-import { attachMediaElement } from "../../utils/attach-media-element.js";
-import { mediaProps } from "../../utils/media-props.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 { MuxVideoMedia } from "@videojs/core/dom/media/mux";
+import { MuxVideoMedia, muxMediaDefaultProps } from "@videojs/core/dom/media/mux";
 //#region src/media/mux-video/index.tsx
 const MuxVideo = forwardRef(function MuxVideo({ children, ...props }, ref) {
-	const mediaApi = useMediaInstance(MuxVideoMedia);
+	const media = useMediaInstance(MuxVideoMedia);
 	return /* @__PURE__ */ jsx("video", {
-		ref: useComposedRefs(attachMediaElement(mediaApi), ref),
-		...mediaProps(mediaApi, MuxVideoMedia, props),
+		ref: useComposedRefs(useAttachMedia(media), ref),
+		...useSyncProps(media, props, muxMediaDefaultProps),
 		children
 	});
 });

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-video/index.tsx"],"sourcesContent":["'use client';\n\nimport { MuxVideoMedia } from '@videojs/core/dom/media/mux';\nimport type { InferClassProps } from '@videojs/utils/types';\nimport type { PropsWithChildren, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { attachMediaElement } from '../../utils/attach-media-element';\nimport { mediaProps } from '../../utils/media-props';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\n\nexport type MuxVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>> &\n  InferClassProps<typeof MuxVideoMedia>;\n\nexport const MuxVideo = forwardRef<HTMLVideoElement, MuxVideoProps>(function MuxVideo({ children, ...props }, ref) {\n  const mediaApi = useMediaInstance(MuxVideoMedia);\n\n  const composedRef = useComposedRefs(attachMediaElement(mediaApi), ref);\n\n  return (\n    <video ref={composedRef} {...mediaProps(mediaApi, MuxVideoMedia, props)}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace MuxVideo {\n  export type Props = MuxVideoProps;\n}\n"],"mappings":";;;;;;;;;AAcA,MAAa,WAAW,WAA4C,SAAS,SAAS,EAAE,UAAU,GAAG,SAAS,KAAK;CACjH,MAAM,WAAW,iBAAiB,cAAc;AAIhD,QACE,oBAAC,SAAD;EAAO,KAHW,gBAAgB,mBAAmB,SAAS,EAAE,IAAI;EAG3C,GAAI,WAAW,UAAU,eAAe,MAAM;EACpE;EACK,CAAA;EAEV"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-video/index.tsx"],"sourcesContent":["'use client';\n\nimport type { MuxMediaProps } from '@videojs/core/dom/media/mux';\nimport { MuxVideoMedia, muxMediaDefaultProps } 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 MuxMediaProps>,\n    Partial<MuxMediaProps> {\n  children?: ReactNode;\n}\n\nexport const MuxVideo = forwardRef<HTMLVideoElement, MuxVideoProps>(function MuxVideo({ children, ...props }, ref) {\n  const media = useMediaInstance(MuxVideoMedia);\n  const attachRef = useAttachMedia(media);\n  const composedRef = useComposedRefs(attachRef, ref);\n  const htmlProps = useSyncProps(media, props, muxMediaDefaultProps);\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":";;;;;;;;;AAiBA,MAAa,WAAW,WAA4C,SAAS,SAAS,EAAE,UAAU,GAAG,SAAS,KAAK;CACjH,MAAM,QAAQ,iBAAiB,cAAc;AAK7C,QACE,oBAAC,SAAD;EAAO,KAJW,gBADF,eAAe,MAAM,EACQ,IAAI;EAIxB,GAHT,aAAa,OAAO,OAAO,qBAAqB;EAI7D;EACK,CAAA;EAEV"}

package/dist/dev/media/native-hls-video/index.d.ts

@@ -1,13 +1,12 @@
-import * as react from "react";
-import { PropsWithChildren, VideoHTMLAttributes } from "react";
-import { NativeHlsMedia } from "@videojs/core/dom/media/native-hls";
-import { InferClassProps } from "@videojs/utils/types";
+import * as _$react from "react";
+import { ReactNode, VideoHTMLAttributes } from "react";
+import { NativeHlsMediaProps } from "@videojs/core/dom/media/native-hls";
 
 //#region src/media/native-hls-video/index.d.ts
-type NativeHlsVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>> & InferClassProps<typeof NativeHlsMedia>;
-declare const NativeHlsVideo: react.ForwardRefExoticComponent<VideoHTMLAttributes<HTMLVideoElement> & {
-  children?: react.ReactNode | undefined;
-} & Partial<Pick<NativeHlsMedia, "src" | "currentTime" | "volume" | "muted" | "playbackRate" | "preload">> & react.RefAttributes<HTMLVideoElement>>;
+interface NativeHlsVideoProps extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof NativeHlsMediaProps>, Partial<NativeHlsMediaProps> {
+  children?: ReactNode;
+}
+declare const NativeHlsVideo: _$react.ForwardRefExoticComponent<NativeHlsVideoProps & _$react.RefAttributes<HTMLVideoElement>>;
 declare namespace NativeHlsVideo {
   type Props = NativeHlsVideoProps;
 }

package/dist/dev/media/native-hls-video/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/native-hls-video/index.tsx"],"mappings":";;;;;;KAWY,mBAAA,GAAsB,iBAAA,CAAkB,mBAAA,CAAoB,gBAAA,KACtE,eAAA,QAAuB,cAAA;AAAA,cAEZ,cAAA,QAAc,yBAAA,CAAA,mBAAA,CAAA,gBAAA;aAAA,KAAA,CAAA,SAAA;AAAA;kBAeV,cAAA;EAAA,KACH,KAAA,GAAQ,mBAAA;AAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/native-hls-video/index.tsx"],"mappings":";;;;;UAWiB,mBAAA,SACP,IAAA,CAAK,mBAAA,CAAoB,gBAAA,SAAyB,mBAAA,GACxD,OAAA,CAAQ,mBAAA;EACV,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,cAAA,EAAc,OAAA,CAAA,yBAAA,CAAA,mBAAA,GAAA,OAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBAgBV,cAAA;EAAA,KACH,KAAA,GAAQ,mBAAA;AAAA"}

package/dist/dev/media/native-hls-video/index.js

@@ -1,17 +1,17 @@
 "use client";
 import { useComposedRefs } from "../../utils/use-composed-refs.js";
-import { attachMediaElement } from "../../utils/attach-media-element.js";
-import { mediaProps } from "../../utils/media-props.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 { NativeHlsMedia } from "@videojs/core/dom/media/native-hls";
+import { NativeHlsMedia, nativeHlsMediaDefaultProps } from "@videojs/core/dom/media/native-hls";
 //#region src/media/native-hls-video/index.tsx
 const NativeHlsVideo = forwardRef(function NativeHlsVideo({ children, ...props }, ref) {
-	const mediaApi = useMediaInstance(NativeHlsMedia);
+	const media = useMediaInstance(NativeHlsMedia);
 	return /* @__PURE__ */ jsx("video", {
-		ref: useComposedRefs(attachMediaElement(mediaApi), ref),
-		...mediaProps(mediaApi, NativeHlsMedia, props),
+		ref: useComposedRefs(useAttachMedia(media), ref),
+		...useSyncProps(media, props, nativeHlsMediaDefaultProps),
 		children
 	});
 });

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/native-hls-video/index.tsx"],"sourcesContent":["'use client';\n\nimport { NativeHlsMedia } from '@videojs/core/dom/media/native-hls';\nimport type { InferClassProps } from '@videojs/utils/types';\nimport type { PropsWithChildren, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { attachMediaElement } from '../../utils/attach-media-element';\nimport { mediaProps } from '../../utils/media-props';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\n\nexport type NativeHlsVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>> &\n  InferClassProps<typeof NativeHlsMedia>;\n\nexport const NativeHlsVideo = forwardRef<HTMLVideoElement, NativeHlsVideoProps>(function NativeHlsVideo(\n  { children, ...props },\n  ref\n) {\n  const mediaApi = useMediaInstance(NativeHlsMedia);\n\n  const composedRef = useComposedRefs(attachMediaElement(mediaApi), ref);\n\n  return (\n    <video ref={composedRef} {...mediaProps(mediaApi, NativeHlsMedia, props)}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace NativeHlsVideo {\n  export type Props = NativeHlsVideoProps;\n}\n"],"mappings":";;;;;;;;;AAcA,MAAa,iBAAiB,WAAkD,SAAS,eACvF,EAAE,UAAU,GAAG,SACf,KACA;CACA,MAAM,WAAW,iBAAiB,eAAe;AAIjD,QACE,oBAAC,SAAD;EAAO,KAHW,gBAAgB,mBAAmB,SAAS,EAAE,IAAI;EAG3C,GAAI,WAAW,UAAU,gBAAgB,MAAM;EACrE;EACK,CAAA;EAEV"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/native-hls-video/index.tsx"],"sourcesContent":["'use client';\n\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);\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":";;;;;;;;;AAiBA,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/dev/media/simple-hls-video/index.d.ts

@@ -1,11 +1,12 @@
-import * as react from "react";
-import { PropsWithChildren, VideoHTMLAttributes } from "react";
+import * as _$react from "react";
+import { ReactNode, VideoHTMLAttributes } from "react";
+import { SpfMediaProps } from "@videojs/spf/dom";
 
 //#region src/media/simple-hls-video/index.d.ts
-type SimpleHlsVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>>;
-declare const SimpleHlsVideo: react.ForwardRefExoticComponent<VideoHTMLAttributes<HTMLVideoElement> & {
-  children?: react.ReactNode | undefined;
-} & react.RefAttributes<HTMLVideoElement>>;
+interface SimpleHlsVideoProps extends Omit<VideoHTMLAttributes<HTMLVideoElement>, keyof SpfMediaProps>, Partial<SpfMediaProps> {
+  children?: ReactNode;
+}
+declare const SimpleHlsVideo: _$react.ForwardRefExoticComponent<SimpleHlsVideoProps & _$react.RefAttributes<HTMLVideoElement>>;
 declare namespace SimpleHlsVideo {
   type Props = SimpleHlsVideoProps;
 }

package/dist/dev/media/simple-hls-video/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/simple-hls-video/index.tsx"],"mappings":";;;;KAUY,mBAAA,GAAsB,iBAAA,CAAkB,mBAAA,CAAoB,gBAAA;AAAA,cAE3D,cAAA,QAAc,yBAAA,CAAA,mBAAA,CAAA,gBAAA;aAAA,KAAA,CAAA,SAAA;AAAA;kBAeV,cAAA;EAAA,KACH,KAAA,GAAQ,mBAAA;AAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/media/simple-hls-video/index.tsx"],"mappings":";;;;;UAYiB,mBAAA,SACP,IAAA,CAAK,mBAAA,CAAoB,gBAAA,SAAyB,aAAA,GACxD,OAAA,CAAQ,aAAA;EACV,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,cAAA,EAAc,OAAA,CAAA,yBAAA,CAAA,mBAAA,GAAA,OAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBAgBV,cAAA;EAAA,KACH,KAAA,GAAQ,mBAAA;AAAA"}

package/dist/dev/media/simple-hls-video/index.js

@@ -1,17 +1,18 @@
 "use client";
 import { useComposedRefs } from "../../utils/use-composed-refs.js";
-import { attachMediaElement } from "../../utils/attach-media-element.js";
-import { mediaProps } from "../../utils/media-props.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 { SimpleHlsMedia } from "@videojs/core/dom/media/simple-hls";
+import { spfMediaDefaultProps } from "@videojs/spf/dom";
 //#region src/media/simple-hls-video/index.tsx
 const SimpleHlsVideo = forwardRef(function SimpleHlsVideo({ children, ...props }, ref) {
-	const mediaApi = useMediaInstance(SimpleHlsMedia);
+	const media = useMediaInstance(SimpleHlsMedia);
 	return /* @__PURE__ */ jsx("video", {
-		ref: useComposedRefs(attachMediaElement(mediaApi), ref),
-		...mediaProps(mediaApi, SimpleHlsMedia, props),
+		ref: useComposedRefs(useAttachMedia(media), ref),
+		...useSyncProps(media, props, spfMediaDefaultProps),
 		children
 	});
 });

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

@@ -1 +1 @@
-{"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 { PropsWithChildren, VideoHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { attachMediaElement } from '../../utils/attach-media-element';\nimport { mediaProps } from '../../utils/media-props';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useMediaInstance } from '../../utils/use-media-instance';\n\nexport type SimpleHlsVideoProps = PropsWithChildren<VideoHTMLAttributes<HTMLVideoElement>>;\n\nexport const SimpleHlsVideo = forwardRef<HTMLVideoElement, SimpleHlsVideoProps>(function SimpleHlsVideo(\n  { children, ...props },\n  ref\n) {\n  const mediaApi = useMediaInstance(SimpleHlsMedia);\n\n  const composedRef = useComposedRefs(attachMediaElement(mediaApi), ref);\n\n  return (\n    <video ref={composedRef} {...mediaProps(mediaApi, SimpleHlsMedia, props)}>\n      {children}\n    </video>\n  );\n});\n\nexport namespace SimpleHlsVideo {\n  export type Props = SimpleHlsVideoProps;\n}\n"],"mappings":";;;;;;;;;AAYA,MAAa,iBAAiB,WAAkD,SAAS,eACvF,EAAE,UAAU,GAAG,SACf,KACA;CACA,MAAM,WAAW,iBAAiB,eAAe;AAIjD,QACE,oBAAC,SAAD;EAAO,KAHW,gBAAgB,mBAAmB,SAAS,EAAE,IAAI;EAG3C,GAAI,WAAW,UAAU,gBAAgB,MAAM;EACrE;EACK,CAAA;EAEV"}
+{"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 { SpfMediaProps } from '@videojs/spf/dom';\nimport { spfMediaDefaultProps } from '@videojs/spf/dom';\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 SpfMediaProps>,\n    Partial<SpfMediaProps> {\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, spfMediaDefaultProps);\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,qBAAqB;EAI7D;EACK,CAAA;EAEV"}

package/dist/dev/media/video.d.ts

@@ -1,9 +1,9 @@
-import * as react from "react";
+import * as _$react from "react";
 import { VideoHTMLAttributes } from "react";
 
 //#region src/media/video.d.ts
 interface VideoProps extends VideoHTMLAttributes<HTMLVideoElement> {}
-declare const Video: react.ForwardRefExoticComponent<VideoProps & react.RefAttributes<HTMLVideoElement>>;
+declare const Video: _$react.ForwardRefExoticComponent<VideoProps & _$react.RefAttributes<HTMLVideoElement>>;
 declare namespace Video {
   type Props = VideoProps;
 }

package/dist/dev/media/video.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"video.d.ts","names":[],"sources":["../../../src/media/video.tsx"],"mappings":";;;;UAQiB,UAAA,SAAmB,mBAAA,CAAoB,gBAAA;AAAA,cAE3C,KAAA,EAAK,KAAA,CAAA,yBAAA,CAAA,UAAA,GAAA,KAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBAWD,KAAA;EAAA,KACH,KAAA,GAAQ,UAAA;AAAA"}
+{"version":3,"file":"video.d.ts","names":[],"sources":["../../../src/media/video.tsx"],"mappings":";;;;UAQiB,UAAA,SAAmB,mBAAA,CAAoB,gBAAA;AAAA,cAE3C,KAAA,EAAK,OAAA,CAAA,yBAAA,CAAA,UAAA,GAAA,OAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBAWD,KAAA;EAAA,KACH,KAAA,GAAQ,UAAA;AAAA"}

package/dist/dev/player/context.d.ts

@@ -1,6 +1,6 @@
 import { MediaContainer } from "@videojs/core/dom";
 import { UnknownState, UnknownStore } from "@videojs/store";
-import * as react from "react";
+import * as _$react from "react";
 import { Dispatch, HTMLAttributes, ReactNode, SetStateAction } from "react";
 import { Media as Media$1 } from "@videojs/core";
 
@@ -48,7 +48,7 @@ declare function useContainerAttach(): Dispatch<SetStateAction<HTMLElement | nul
 interface ContainerProps extends HTMLAttributes<HTMLDivElement> {
   children?: ReactNode;
 }
-declare const Container: react.ForwardRefExoticComponent<ContainerProps & react.RefAttributes<HTMLDivElement>>;
+declare const Container: _$react.ForwardRefExoticComponent<ContainerProps & _$react.RefAttributes<HTMLDivElement>>;
 declare namespace Container {
   type Props = ContainerProps;
 }

package/dist/dev/player/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","names":[],"sources":["../../../src/player/context.tsx"],"mappings":";;;;;;;UAWiB,kBAAA;EACf,KAAA,EAAO,YAAA;EACP,KAAA,EAAO,OAAA;EACP,QAAA,EAAU,QAAA,CAAS,cAAA,CAAe,OAAA;EAClC,SAAA,EAAW,cAAA;EACX,YAAA,EAAc,QAAA,CAAS,cAAA,CAAe,WAAA;AAAA;;iBAqBxB,gBAAA,CAAA,GAAoB,kBAAA;;;;;;iBAWpB,SAAA,CAAA,GAAa,YAAA;;;;;;;iBAOb,SAAA,GAAA,CAAa,QAAA,GAAW,KAAA,EAAO,YAAA,KAAiB,CAAA,GAAI,CAAA;;;;;;;;iBAapD,iBAAA,CAAA,GAAqB,YAAA;;iBAErB,iBAAA,GAAA,CAAqB,QAAA,GAAW,KAAA,EAAO,YAAA,KAAiB,CAAA,GAAI,CAAA;;iBAS5D,QAAA,CAAA,GAAY,OAAA;AA/B5B;AAAA,iBAqCgB,YAAA,CAAA,GAAgB,cAAA;;iBAMhB,cAAA,CAAA,GAAkB,QAAA,CAAS,cAAA,CAAe,OAAA;;iBAM1C,kBAAA,CAAA,GAAsB,QAAA,CAAS,cAAA,CAAe,WAAA;AAAA,UAK7C,cAAA,SAAuB,cAAA,CAAe,cAAA;EACrD,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,SAAA,EAAS,KAAA,CAAA,yBAAA,CAAA,cAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,kBA8BL,SAAA;EAAA,KACH,KAAA,GAAQ,cAAA;AAAA"}
+{"version":3,"file":"context.d.ts","names":[],"sources":["../../../src/player/context.tsx"],"mappings":";;;;;;;UAWiB,kBAAA;EACf,KAAA,EAAO,YAAA;EACP,KAAA,EAAO,OAAA;EACP,QAAA,EAAU,QAAA,CAAS,cAAA,CAAe,OAAA;EAClC,SAAA,EAAW,cAAA;EACX,YAAA,EAAc,QAAA,CAAS,cAAA,CAAe,WAAA;AAAA;;iBAqBxB,gBAAA,CAAA,GAAoB,kBAAA;;;;;;iBAWpB,SAAA,CAAA,GAAa,YAAA;;;;;;;iBAOb,SAAA,GAAA,CAAa,QAAA,GAAW,KAAA,EAAO,YAAA,KAAiB,CAAA,GAAI,CAAA;;;;;;;;iBAapD,iBAAA,CAAA,GAAqB,YAAA;;iBAErB,iBAAA,GAAA,CAAqB,QAAA,GAAW,KAAA,EAAO,YAAA,KAAiB,CAAA,GAAI,CAAA;;iBAS5D,QAAA,CAAA,GAAY,OAAA;AA/B5B;AAAA,iBAqCgB,YAAA,CAAA,GAAgB,cAAA;;iBAMhB,cAAA,CAAA,GAAkB,QAAA,CAAS,cAAA,CAAe,OAAA;;iBAM1C,kBAAA,CAAA,GAAsB,QAAA,CAAS,cAAA,CAAe,WAAA;AAAA,UAK7C,cAAA,SAAuB,cAAA,CAAe,cAAA;EACrD,QAAA,GAAW,SAAA;AAAA;AAAA,cAGA,SAAA,EAAS,OAAA,CAAA,yBAAA,CAAA,cAAA,GAAA,OAAA,CAAA,aAAA,CAAA,cAAA;AAAA,kBA8BL,SAAA;EAAA,KACH,KAAA,GAAQ,cAAA;AAAA"}

package/dist/dev/presets/audio/minimal-skin.css

@@ -213,7 +213,8 @@
     cursor: not-allowed;
   }
 
-  &[data-availability="unavailable"] {
+  &[data-availability="unavailable"],
+  &[data-availability="unsupported"] {
     display: none;
   }
 }

package/dist/dev/presets/audio/skin.css

@@ -220,7 +220,8 @@
     cursor: not-allowed;
   }
 
-  &[data-availability="unavailable"] {
+  &[data-availability="unavailable"],
+  &[data-availability="unsupported"] {
     display: none;
   }
 }

package/dist/dev/presets/audio/skin.js

@@ -4,7 +4,7 @@ import { AlertDialogPopup } from "../../ui/alert-dialog/alert-dialog-popup.js";
 import { AlertDialogTitle } from "../../ui/alert-dialog/alert-dialog-title.js";
 import { ErrorDialogDescription } from "../../ui/error-dialog/error-dialog-description.js";
 import { ErrorDialogRoot } from "../../ui/error-dialog/error-dialog-root.js";
-import { MediaHotkey } from "../../ui/hotkey/media-hotkey.js";
+import { Hotkey } from "../../ui/hotkey/hotkey.js";
 import { MuteButton } from "../../ui/mute-button/mute-button.js";
 import { PlayButton } from "../../ui/play-button/play-button.js";
 import { PlaybackRateButton } from "../../ui/playback-rate-button/playback-rate-button.js";
@@ -199,67 +199,67 @@ function AudioSkin(props) {
 					})
 				] })
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "Space",
 				action: "togglePaused"
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "k",
 				action: "togglePaused"
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "m",
 				action: "toggleMuted"
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "ArrowRight",
 				action: "seekStep",
 				value: 5
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "ArrowLeft",
 				action: "seekStep",
 				value: -5
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "l",
 				action: "seekStep",
 				value: 10
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "j",
 				action: "seekStep",
 				value: -10
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "ArrowUp",
 				action: "volumeStep",
 				value: .05
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "ArrowDown",
 				action: "volumeStep",
 				value: -.05
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "0-9",
 				action: "seekToPercent"
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "Home",
 				action: "seekToPercent",
 				value: 0
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "End",
 				action: "seekToPercent",
 				value: 100
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: ">",
 				action: "speedUp"
 			}),
-			/* @__PURE__ */ jsx(MediaHotkey, {
+			/* @__PURE__ */ jsx(Hotkey, {
 				keys: "<",
 				action: "speedDown"
 			})