@videojs/react 10.0.0-beta.3 → 10.0.0-beta.30

package/dist/dev/presets/video/error-dialog.js

@@ -1,51 +0,0 @@
-'use client';
-
-import { usePlayer } from "../../player/context.js";
-import { AlertDialogClose } from "../../ui/alert-dialog/alert-dialog-close.js";
-import { AlertDialogDescription } from "../../ui/alert-dialog/alert-dialog-description.js";
-import { AlertDialogPopup } from "../../ui/alert-dialog/alert-dialog-popup.js";
-import { AlertDialogRoot } from "../../ui/alert-dialog/alert-dialog-root.js";
-import { AlertDialogTitle } from "../../ui/alert-dialog/alert-dialog-title.js";
-import { selectError } from "@videojs/core/dom";
-import { useRef } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/presets/video/error-dialog.tsx
-function ErrorDialog({ classes }) {
-	const errorState = usePlayer(selectError);
-	const lastError = useRef(errorState?.error);
-	if (errorState?.error) lastError.current = errorState.error;
-	if (!errorState) return null;
-	return /* @__PURE__ */ jsx(AlertDialogRoot, {
-		open: !!errorState.error,
-		onOpenChange: (open) => {
-			if (!open) errorState.dismissError();
-		},
-		children: /* @__PURE__ */ jsx(AlertDialogPopup, {
-			className: classes?.root,
-			children: /* @__PURE__ */ jsxs("div", {
-				className: classes?.dialog,
-				children: [/* @__PURE__ */ jsxs("div", {
-					className: classes?.content,
-					children: [/* @__PURE__ */ jsx(AlertDialogTitle, {
-						className: classes?.title,
-						children: "Something went wrong."
-					}), /* @__PURE__ */ jsx(AlertDialogDescription, {
-						className: classes?.description,
-						children: lastError.current?.message ?? "An error occurred while trying to play the video. Please try again."
-					})]
-				}), /* @__PURE__ */ jsx("div", {
-					className: classes?.actions,
-					children: /* @__PURE__ */ jsx(AlertDialogClose, {
-						className: classes?.close,
-						children: "OK"
-					})
-				})]
-			})
-		})
-	});
-}
-
-//#endregion
-export { ErrorDialog };
-//# sourceMappingURL=error-dialog.js.map

package/dist/dev/presets/video/error-dialog.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"error-dialog.js","names":["AlertDialog.Root","AlertDialog.Popup","AlertDialog.Title","AlertDialog.Description","AlertDialog.Close"],"sources":["../../../../src/presets/video/error-dialog.tsx"],"sourcesContent":["'use client';\n\nimport { selectError } from '@videojs/core/dom';\nimport { type ReactNode, useRef } from 'react';\nimport { usePlayer } from '@/player/context';\nimport { AlertDialog } from '@/ui/alert-dialog';\n\nexport interface ErrorDialogClasses {\n  root?: string;\n  dialog?: string;\n  content?: string;\n  title?: string;\n  description?: string;\n  actions?: string;\n  close?: string;\n}\n\nexport function ErrorDialog({ classes }: { classes?: ErrorDialogClasses }): ReactNode {\n  const errorState = usePlayer(selectError);\n  const lastError = useRef(errorState?.error);\n  if (errorState?.error) lastError.current = errorState.error;\n\n  if (!errorState) return null;\n\n  return (\n    <AlertDialog.Root\n      open={!!errorState.error}\n      onOpenChange={(open) => {\n        if (!open) errorState.dismissError();\n      }}\n    >\n      <AlertDialog.Popup className={classes?.root}>\n        <div className={classes?.dialog}>\n          <div className={classes?.content}>\n            <AlertDialog.Title className={classes?.title}>Something went wrong.</AlertDialog.Title>\n            <AlertDialog.Description className={classes?.description}>\n              {lastError.current?.message ?? 'An error occurred while trying to play the video. Please try again.'}\n            </AlertDialog.Description>\n          </div>\n          <div className={classes?.actions}>\n            <AlertDialog.Close className={classes?.close}>OK</AlertDialog.Close>\n          </div>\n        </div>\n      </AlertDialog.Popup>\n    </AlertDialog.Root>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAiBA,SAAgB,YAAY,EAAE,WAAwD;CACpF,MAAM,aAAa,UAAU,YAAY;CACzC,MAAM,YAAY,OAAO,YAAY,MAAM;AAC3C,KAAI,YAAY,MAAO,WAAU,UAAU,WAAW;AAEtD,KAAI,CAAC,WAAY,QAAO;AAExB,QACE,oBAACA;EACC,MAAM,CAAC,CAAC,WAAW;EACnB,eAAe,SAAS;AACtB,OAAI,CAAC,KAAM,YAAW,cAAc;;YAGtC,oBAACC;GAAkB,WAAW,SAAS;aACrC,qBAAC;IAAI,WAAW,SAAS;eACvB,qBAAC;KAAI,WAAW,SAAS;gBACvB,oBAACC;MAAkB,WAAW,SAAS;gBAAO;OAAyC,EACvF,oBAACC;MAAwB,WAAW,SAAS;gBAC1C,UAAU,SAAS,WAAW;OACP;MACtB,EACN,oBAAC;KAAI,WAAW,SAAS;eACvB,oBAACC;MAAkB,WAAW,SAAS;gBAAO;OAAsB;MAChE;KACF;IACY;GACH"}

package/dist/dev/skins/dist/default/default/tailwind/components/icon-state.js

@@ -1,29 +0,0 @@
-//#region ../skins/dist/default/default/tailwind/components/icon-state.js
-const iconState = {
-	play: {
-		button: "group",
-		restart: "hidden opacity-0 group-data-ended:block group-data-ended:opacity-100",
-		play: "hidden opacity-0 group-not-data-ended:group-data-paused:block group-not-data-ended:group-data-paused:opacity-100",
-		pause: "hidden opacity-0 group-not-data-paused:group-not-data-ended:block group-not-data-paused:group-not-data-ended:opacity-100"
-	},
-	mute: {
-		button: "group",
-		volumeOff: "hidden opacity-0 group-data-muted:block group-data-muted:opacity-100",
-		volumeLow: "hidden opacity-0 group-not-data-muted:group-data-[volume-level=low]:block group-not-data-muted:group-data-[volume-level=low]:opacity-100",
-		volumeHigh: "hidden opacity-0 group-not-data-muted:group-not-data-[volume-level=low]:block group-not-data-muted:group-not-data-[volume-level=low]:opacity-100"
-	},
-	fullscreen: {
-		button: "group",
-		enter: "hidden opacity-0 group-not-data-fullscreen:block group-not-data-fullscreen:opacity-100",
-		exit: "hidden opacity-0 group-data-fullscreen:block group-data-fullscreen:opacity-100"
-	},
-	captions: {
-		button: "group",
-		off: "hidden opacity-0 group-not-data-active:block group-not-data-active:opacity-100",
-		on: "hidden opacity-0 group-data-active:block group-data-active:opacity-100"
-	}
-};
-
-//#endregion
-export { iconState };
-//# sourceMappingURL=icon-state.js.map

package/dist/dev/skins/dist/default/default/tailwind/components/icon-state.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"icon-state.js","names":[],"sources":["../../../../../../../../../skins/dist/default/default/tailwind/components/icon-state.js"],"sourcesContent":["//#region src/default/tailwind/components/icon-state.ts\nconst iconState = {\n\tplay: {\n\t\tbutton: \"group\",\n\t\trestart: \"hidden opacity-0 group-data-ended:block group-data-ended:opacity-100\",\n\t\tplay: \"hidden opacity-0 group-not-data-ended:group-data-paused:block group-not-data-ended:group-data-paused:opacity-100\",\n\t\tpause: \"hidden opacity-0 group-not-data-paused:group-not-data-ended:block group-not-data-paused:group-not-data-ended:opacity-100\"\n\t},\n\tmute: {\n\t\tbutton: \"group\",\n\t\tvolumeOff: \"hidden opacity-0 group-data-muted:block group-data-muted:opacity-100\",\n\t\tvolumeLow: \"hidden opacity-0 group-not-data-muted:group-data-[volume-level=low]:block group-not-data-muted:group-data-[volume-level=low]:opacity-100\",\n\t\tvolumeHigh: \"hidden opacity-0 group-not-data-muted:group-not-data-[volume-level=low]:block group-not-data-muted:group-not-data-[volume-level=low]:opacity-100\"\n\t},\n\tfullscreen: {\n\t\tbutton: \"group\",\n\t\tenter: \"hidden opacity-0 group-not-data-fullscreen:block group-not-data-fullscreen:opacity-100\",\n\t\texit: \"hidden opacity-0 group-data-fullscreen:block group-data-fullscreen:opacity-100\"\n\t},\n\tcaptions: {\n\t\tbutton: \"group\",\n\t\toff: \"hidden opacity-0 group-not-data-active:block group-not-data-active:opacity-100\",\n\t\ton: \"hidden opacity-0 group-data-active:block group-data-active:opacity-100\"\n\t}\n};\n\n//#endregion\nexport { iconState };\n//# sourceMappingURL=icon-state.js.map"],"mappings":";AACA,MAAM,YAAY;CACjB,MAAM;EACL,QAAQ;EACR,SAAS;EACT,MAAM;EACN,OAAO;EACP;CACD,MAAM;EACL,QAAQ;EACR,WAAW;EACX,WAAW;EACX,YAAY;EACZ;CACD,YAAY;EACX,QAAQ;EACR,OAAO;EACP,MAAM;EACN;CACD,UAAU;EACT,QAAQ;EACR,KAAK;EACL,IAAI;EACJ;CACD"}

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

@@ -1,8 +0,0 @@
-import { cn } from "@videojs/utils/style";
-
-//#region ../skins/dist/default/default/tailwind/components/root.js
-const root = cn("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", "**:box-border **:m-0", "[&_button]:font-[inherit]", "motion-safe:[interpolate-size:allow-keywords]", "[&:fullscreen]:rounded-none");
-
-//#endregion
-export { root };
-//# sourceMappingURL=root.js.map

package/dist/dev/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 { cn } from \"@videojs/utils/style\";\n\n//#region src/default/tailwind/components/root.ts\nconst root = cn(\"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\", \"**:box-border **:m-0\", \"[&_button]:font-[inherit]\", \"motion-safe:[interpolate-size:allow-keywords]\", \"[&:fullscreen]:rounded-none\");\n\n//#endregion\nexport { root };\n//# sourceMappingURL=root.js.map"],"mappings":";;;AAGA,MAAM,OAAO,GAAG,8DAA8D,wCAAwC,uHAAuH,wBAAwB,6BAA6B,iDAAiD,8BAA8B"}

package/dist/dev/skins/dist/default/minimal/tailwind/components/icon-state.js

@@ -1,29 +0,0 @@
-//#region ../skins/dist/default/minimal/tailwind/components/icon-state.js
-const iconState = {
-	play: {
-		button: "group",
-		restart: "hidden opacity-0 group-data-ended:block group-data-ended:opacity-100",
-		play: "hidden opacity-0 group-not-data-ended:group-data-paused:block group-not-data-ended:group-data-paused:opacity-100",
-		pause: "hidden opacity-0 group-not-data-paused:group-not-data-ended:block group-not-data-paused:group-not-data-ended:opacity-100"
-	},
-	mute: {
-		button: "group",
-		volumeOff: "hidden opacity-0 group-data-muted:block group-data-muted:opacity-100",
-		volumeLow: "hidden opacity-0 group-not-data-muted:group-data-[volume-level=low]:block group-not-data-muted:group-data-[volume-level=low]:opacity-100",
-		volumeHigh: "hidden opacity-0 group-not-data-muted:group-not-data-[volume-level=low]:block group-not-data-muted:group-not-data-[volume-level=low]:opacity-100"
-	},
-	fullscreen: {
-		button: "group",
-		enter: "hidden opacity-0 group-not-data-fullscreen:block group-not-data-fullscreen:opacity-100",
-		exit: "hidden opacity-0 group-data-fullscreen:block group-data-fullscreen:opacity-100"
-	},
-	captions: {
-		button: "group",
-		off: "hidden opacity-0 group-not-data-active:block group-not-data-active:opacity-100",
-		on: "hidden opacity-0 group-data-active:block group-data-active:opacity-100"
-	}
-};
-
-//#endregion
-export { iconState };
-//# sourceMappingURL=icon-state.js.map

package/dist/dev/skins/dist/default/minimal/tailwind/components/icon-state.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"icon-state.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/icon-state.js"],"sourcesContent":["//#region src/minimal/tailwind/components/icon-state.ts\nconst iconState = {\n\tplay: {\n\t\tbutton: \"group\",\n\t\trestart: \"hidden opacity-0 group-data-ended:block group-data-ended:opacity-100\",\n\t\tplay: \"hidden opacity-0 group-not-data-ended:group-data-paused:block group-not-data-ended:group-data-paused:opacity-100\",\n\t\tpause: \"hidden opacity-0 group-not-data-paused:group-not-data-ended:block group-not-data-paused:group-not-data-ended:opacity-100\"\n\t},\n\tmute: {\n\t\tbutton: \"group\",\n\t\tvolumeOff: \"hidden opacity-0 group-data-muted:block group-data-muted:opacity-100\",\n\t\tvolumeLow: \"hidden opacity-0 group-not-data-muted:group-data-[volume-level=low]:block group-not-data-muted:group-data-[volume-level=low]:opacity-100\",\n\t\tvolumeHigh: \"hidden opacity-0 group-not-data-muted:group-not-data-[volume-level=low]:block group-not-data-muted:group-not-data-[volume-level=low]:opacity-100\"\n\t},\n\tfullscreen: {\n\t\tbutton: \"group\",\n\t\tenter: \"hidden opacity-0 group-not-data-fullscreen:block group-not-data-fullscreen:opacity-100\",\n\t\texit: \"hidden opacity-0 group-data-fullscreen:block group-data-fullscreen:opacity-100\"\n\t},\n\tcaptions: {\n\t\tbutton: \"group\",\n\t\toff: \"hidden opacity-0 group-not-data-active:block group-not-data-active:opacity-100\",\n\t\ton: \"hidden opacity-0 group-data-active:block group-data-active:opacity-100\"\n\t}\n};\n\n//#endregion\nexport { iconState };\n//# sourceMappingURL=icon-state.js.map"],"mappings":";AACA,MAAM,YAAY;CACjB,MAAM;EACL,QAAQ;EACR,SAAS;EACT,MAAM;EACN,OAAO;EACP;CACD,MAAM;EACL,QAAQ;EACR,WAAW;EACX,WAAW;EACX,YAAY;EACZ;CACD,YAAY;EACX,QAAQ;EACR,OAAO;EACP,MAAM;EACN;CACD,UAAU;EACT,QAAQ;EACR,KAAK;EACL,IAAI;EACJ;CACD"}

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

@@ -1,8 +0,0 @@
-import { cn } from "@videojs/utils/style";
-
-//#region ../skins/dist/default/minimal/tailwind/components/root.js
-const root = cn("block relative isolate @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", "**:box-border **:m-0", "[&_button]:font-[inherit]", "motion-safe:[interpolate-size:allow-keywords]");
-
-//#endregion
-export { root };
-//# sourceMappingURL=root.js.map

package/dist/dev/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 { cn } from \"@videojs/utils/style\";\n\n//#region src/minimal/tailwind/components/root.ts\nconst root = cn(\"block relative isolate @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\", \"**:box-border **:m-0\", \"[&_button]:font-[inherit]\", \"motion-safe:[interpolate-size:allow-keywords]\");\n\n//#endregion\nexport { root };\n//# sourceMappingURL=root.js.map"],"mappings":";;;AAGA,MAAM,OAAO,GAAG,gDAAgD,2CAA2C,uHAAuH,wBAAwB,6BAA6B,gDAAgD"}

package/dist/dev/utils/attach-media-element.js

@@ -1,12 +0,0 @@
-//#region src/utils/attach-media-element.ts
-function attachMediaElement(media) {
-	return (element) => {
-		if (element) media.attach(element);
-		else media.detach();
-		return () => media.detach();
-	};
-}
-
-//#endregion
-export { attachMediaElement };
-//# sourceMappingURL=attach-media-element.js.map

package/dist/dev/utils/attach-media-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"attach-media-element.js","names":[],"sources":["../../../src/utils/attach-media-element.ts"],"sourcesContent":["interface Attachable {\n  attach(target: EventTarget): void;\n  detach(): void;\n}\n\nexport function attachMediaElement<T extends HTMLVideoElement>(media: Attachable): (element: T | null) => void {\n  return (element: T | null) => {\n    if (element) {\n      media.attach(element);\n    } else {\n      media.detach();\n    }\n    // React 19+ accepts a cleanup function as the return value\n    return () => media.detach();\n  };\n}\n"],"mappings":";AAKA,SAAgB,mBAA+C,OAAgD;AAC7G,SAAQ,YAAsB;AAC5B,MAAI,QACF,OAAM,OAAO,QAAQ;MAErB,OAAM,QAAQ;AAGhB,eAAa,MAAM,QAAQ"}

package/dist/dev/utils/media-props.js

@@ -1,11 +0,0 @@
-//#region src/utils/media-props.ts
-function mediaProps(media, props) {
-	const { src, ...remainingProps } = props;
-	if (props.preload && media.preload !== props.preload) media.preload = props.preload;
-	if (media.src !== src) media.src = src ?? "";
-	return remainingProps;
-}
-
-//#endregion
-export { mediaProps };
-//# sourceMappingURL=media-props.js.map

package/dist/dev/utils/media-props.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"media-props.js","names":[],"sources":["../../../src/utils/media-props.ts"],"sourcesContent":["import type { MediaApi } from '@videojs/core/dom';\nimport type { VideoHTMLAttributes } from 'react';\n\ninterface VideoProps extends VideoHTMLAttributes<HTMLVideoElement> {}\n\nexport function mediaProps(media: MediaApi, props: VideoProps) {\n  const { src, ...remainingProps } = props;\n\n  // Preload can still be passed as a prop to the native media element\n  if (props.preload && media.preload !== props.preload) {\n    media.preload = props.preload as '' | 'none' | 'metadata' | 'auto';\n  }\n\n  if (media.src !== src) {\n    media.src = src ?? '';\n  }\n\n  // The remaining props are passed to the native media element\n  return remainingProps;\n}\n"],"mappings":";AAKA,SAAgB,WAAW,OAAiB,OAAmB;CAC7D,MAAM,EAAE,KAAK,GAAG,mBAAmB;AAGnC,KAAI,MAAM,WAAW,MAAM,YAAY,MAAM,QAC3C,OAAM,UAAU,MAAM;AAGxB,KAAI,MAAM,QAAQ,IAChB,OAAM,MAAM,OAAO;AAIrB,QAAO"}