@videojs/react 10.0.0-alpha.6 → 10.0.0-alpha.9

package/dist/default/ui/error-dialog/error-dialog.js

@@ -1,54 +0,0 @@
-'use client';
-
-import { renderElement } from "../../utils/use-render.js";
-import { forwardRef, useEffect, useRef, useState } from "react";
-
-//#region src/ui/error-dialog/error-dialog.tsx
-/**
-* Displays an error dialog when media playback encounters an error.
-*
-* @example
-* ```tsx
-* <ErrorDialog />
-*
-* <ErrorDialog
-*   render={(props, state) => (
-*     <div {...props}>Something went wrong</div>
-*   )}
-* />
-* ```
-*/
-const ErrorDialog = forwardRef(function ErrorDialog(componentProps, forwardedRef) {
-	const { render, className, style, ...elementProps } = componentProps;
-	const dialogRef = useRef(null);
-	const [hasError, setHasError] = useState(false);
-	useEffect(() => {
-		const handle = setTimeout(() => {}, 2e3);
-		return () => clearTimeout(handle);
-	}, []);
-	useEffect(() => {
-		if (!hasError) return;
-		requestAnimationFrame(() => {
-			dialogRef.current?.focus();
-		});
-	}, [hasError]);
-	return renderElement("div", {
-		render,
-		className,
-		style
-	}, {
-		state: {
-			visible: hasError,
-			onDismiss: () => setHasError(false)
-		},
-		ref: [forwardedRef, dialogRef],
-		props: [{
-			role: "alertdialog",
-			tabIndex: -1
-		}, elementProps]
-	});
-});
-
-//#endregion
-export { ErrorDialog };
-//# sourceMappingURL=error-dialog.js.map

package/dist/default/ui/error-dialog/error-dialog.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"error-dialog.js","names":[],"sources":["../../../../src/ui/error-dialog/error-dialog.tsx"],"sourcesContent":["'use client';\n\nimport type { ForwardedRef } from 'react';\nimport { forwardRef, useEffect, useRef, useState } from 'react';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\n\ntype ErrorDialogState = { visible: boolean; onDismiss: () => void };\n\nexport interface ErrorDialogProps extends UIComponentProps<'div', ErrorDialogState> {\n  'aria-labelledby': string;\n  'aria-describedby'?: string;\n  dismiss?: () => void;\n}\n\nconst DEBUG = false;\n\n/**\n * Displays an error dialog when media playback encounters an error.\n *\n * @example\n * ```tsx\n * <ErrorDialog />\n *\n * <ErrorDialog\n *   render={(props, state) => (\n *     <div {...props}>Something went wrong</div>\n *   )}\n * />\n * ```\n */\nexport const ErrorDialog = forwardRef(function ErrorDialog(\n  componentProps: ErrorDialogProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const { render, className, style, ...elementProps } = componentProps;\n  const dialogRef = useRef<HTMLDivElement>(null);\n\n  const [hasError, setHasError] = useState(false);\n\n  // FIXME: This is just debugging code\n  useEffect(() => {\n    const handle = setTimeout(() => {\n      if (!DEBUG) return;\n      setHasError(true);\n    }, 2000);\n\n    return () => clearTimeout(handle);\n  }, []);\n\n  // Focus the dialog when it becomes visible to ensure it's announced by screen readers.\n  // Wait a frame for the accessibility tree to update with the dialog before focusing.\n  useEffect(() => {\n    if (!hasError) return;\n    requestAnimationFrame(() => {\n      dialogRef.current?.focus();\n    });\n  }, [hasError]);\n\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state: {\n        visible: hasError,\n        onDismiss: () => setHasError(false),\n      },\n      ref: [forwardedRef, dialogRef],\n      props: [\n        {\n          role: 'alertdialog',\n          tabIndex: -1,\n        },\n        elementProps,\n      ],\n    }\n  );\n});\n\nexport namespace ErrorDialog {\n  export type Props = ErrorDialogProps;\n  export type State = ErrorDialogState;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA+BA,MAAa,cAAc,WAAW,SAAS,YAC7C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACtD,MAAM,YAAY,OAAuB,KAAK;CAE9C,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;AAG/C,iBAAgB;EACd,MAAM,SAAS,iBAAiB,IAG7B,IAAK;AAER,eAAa,aAAa,OAAO;IAChC,EAAE,CAAC;AAIN,iBAAgB;AACd,MAAI,CAAC,SAAU;AACf,8BAA4B;AAC1B,aAAU,SAAS,OAAO;IAC1B;IACD,CAAC,SAAS,CAAC;AAEd,QAAO,cACL,OACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE,OAAO;GACL,SAAS;GACT,iBAAiB,YAAY,MAAM;GACpC;EACD,KAAK,CAAC,cAAc,UAAU;EAC9B,OAAO,CACL;GACE,MAAM;GACN,UAAU;GACX,EACD,aACD;EACF,CACF;EACD"}

package/dist/default/ui/error-dialog/index.js

@@ -1,3 +0,0 @@
-import { ErrorDialog } from "./error-dialog.js";
-
-export { ErrorDialog };

package/dist/dev/ui/error-dialog/error-dialog.d.ts

@@ -1,35 +0,0 @@
-import { UIComponentProps } from "../../utils/types.js";
-import * as react from "react";
-
-//#region src/ui/error-dialog/error-dialog.d.ts
-type ErrorDialogState = {
-  visible: boolean;
-  onDismiss: () => void;
-};
-interface ErrorDialogProps extends UIComponentProps<'div', ErrorDialogState> {
-  'aria-labelledby': string;
-  'aria-describedby'?: string;
-  dismiss?: () => void;
-}
-/**
- * Displays an error dialog when media playback encounters an error.
- *
- * @example
- * ```tsx
- * <ErrorDialog />
- *
- * <ErrorDialog
- *   render={(props, state) => (
- *     <div {...props}>Something went wrong</div>
- *   )}
- * />
- * ```
- */
-declare const ErrorDialog: react.ForwardRefExoticComponent<Omit<ErrorDialogProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-declare namespace ErrorDialog {
-  type Props = ErrorDialogProps;
-  type State = ErrorDialogState;
-}
-//#endregion
-export { ErrorDialog, ErrorDialogProps };
-//# sourceMappingURL=error-dialog.d.ts.map

package/dist/dev/ui/error-dialog/error-dialog.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"error-dialog.d.ts","names":[],"sources":["../../../../src/ui/error-dialog/error-dialog.tsx"],"mappings":";;;;KAOK,gBAAA;EAAqB,OAAA;EAAkB,SAAA;AAAA;AAAA,UAE3B,gBAAA,SAAyB,gBAAA,QAAwB,gBAAA;EAChE,iBAAA;EACA,kBAAA;EACA,OAAA;AAAA;;;;;;;;;;;AAmBF;;;;cAAa,WAAA,EAAW,KAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,gBAAA,WAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,kBAgDP,WAAA;EAAA,KACH,KAAA,GAAQ,gBAAA;EAAA,KACR,KAAA,GAAQ,gBAAA;AAAA"}

package/dist/dev/ui/error-dialog/error-dialog.js

@@ -1,54 +0,0 @@
-'use client';
-
-import { renderElement } from "../../utils/use-render.js";
-import { forwardRef, useEffect, useRef, useState } from "react";
-
-//#region src/ui/error-dialog/error-dialog.tsx
-/**
-* Displays an error dialog when media playback encounters an error.
-*
-* @example
-* ```tsx
-* <ErrorDialog />
-*
-* <ErrorDialog
-*   render={(props, state) => (
-*     <div {...props}>Something went wrong</div>
-*   )}
-* />
-* ```
-*/
-const ErrorDialog = forwardRef(function ErrorDialog(componentProps, forwardedRef) {
-	const { render, className, style, ...elementProps } = componentProps;
-	const dialogRef = useRef(null);
-	const [hasError, setHasError] = useState(false);
-	useEffect(() => {
-		const handle = setTimeout(() => {}, 2e3);
-		return () => clearTimeout(handle);
-	}, []);
-	useEffect(() => {
-		if (!hasError) return;
-		requestAnimationFrame(() => {
-			dialogRef.current?.focus();
-		});
-	}, [hasError]);
-	return renderElement("div", {
-		render,
-		className,
-		style
-	}, {
-		state: {
-			visible: hasError,
-			onDismiss: () => setHasError(false)
-		},
-		ref: [forwardedRef, dialogRef],
-		props: [{
-			role: "alertdialog",
-			tabIndex: -1
-		}, elementProps]
-	});
-});
-
-//#endregion
-export { ErrorDialog };
-//# sourceMappingURL=error-dialog.js.map

package/dist/dev/ui/error-dialog/error-dialog.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"error-dialog.js","names":[],"sources":["../../../../src/ui/error-dialog/error-dialog.tsx"],"sourcesContent":["'use client';\n\nimport type { ForwardedRef } from 'react';\nimport { forwardRef, useEffect, useRef, useState } from 'react';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\n\ntype ErrorDialogState = { visible: boolean; onDismiss: () => void };\n\nexport interface ErrorDialogProps extends UIComponentProps<'div', ErrorDialogState> {\n  'aria-labelledby': string;\n  'aria-describedby'?: string;\n  dismiss?: () => void;\n}\n\nconst DEBUG = false;\n\n/**\n * Displays an error dialog when media playback encounters an error.\n *\n * @example\n * ```tsx\n * <ErrorDialog />\n *\n * <ErrorDialog\n *   render={(props, state) => (\n *     <div {...props}>Something went wrong</div>\n *   )}\n * />\n * ```\n */\nexport const ErrorDialog = forwardRef(function ErrorDialog(\n  componentProps: ErrorDialogProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const { render, className, style, ...elementProps } = componentProps;\n  const dialogRef = useRef<HTMLDivElement>(null);\n\n  const [hasError, setHasError] = useState(false);\n\n  // FIXME: This is just debugging code\n  useEffect(() => {\n    const handle = setTimeout(() => {\n      if (!DEBUG) return;\n      setHasError(true);\n    }, 2000);\n\n    return () => clearTimeout(handle);\n  }, []);\n\n  // Focus the dialog when it becomes visible to ensure it's announced by screen readers.\n  // Wait a frame for the accessibility tree to update with the dialog before focusing.\n  useEffect(() => {\n    if (!hasError) return;\n    requestAnimationFrame(() => {\n      dialogRef.current?.focus();\n    });\n  }, [hasError]);\n\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state: {\n        visible: hasError,\n        onDismiss: () => setHasError(false),\n      },\n      ref: [forwardedRef, dialogRef],\n      props: [\n        {\n          role: 'alertdialog',\n          tabIndex: -1,\n        },\n        elementProps,\n      ],\n    }\n  );\n});\n\nexport namespace ErrorDialog {\n  export type Props = ErrorDialogProps;\n  export type State = ErrorDialogState;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA+BA,MAAa,cAAc,WAAW,SAAS,YAC7C,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACtD,MAAM,YAAY,OAAuB,KAAK;CAE9C,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;AAG/C,iBAAgB;EACd,MAAM,SAAS,iBAAiB,IAG7B,IAAK;AAER,eAAa,aAAa,OAAO;IAChC,EAAE,CAAC;AAIN,iBAAgB;AACd,MAAI,CAAC,SAAU;AACf,8BAA4B;AAC1B,aAAU,SAAS,OAAO;IAC1B;IACD,CAAC,SAAS,CAAC;AAEd,QAAO,cACL,OACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE,OAAO;GACL,SAAS;GACT,iBAAiB,YAAY,MAAM;GACpC;EACD,KAAK,CAAC,cAAc,UAAU;EAC9B,OAAO,CACL;GACE,MAAM;GACN,UAAU;GACX,EACD,aACD;EACF,CACF;EACD"}

package/dist/dev/ui/error-dialog/index.d.ts

@@ -1,2 +0,0 @@
-import { ErrorDialog, ErrorDialogProps } from "./error-dialog.js";
-export { ErrorDialog, ErrorDialogProps };

package/dist/dev/ui/error-dialog/index.js

@@ -1,3 +0,0 @@
-import { ErrorDialog } from "./error-dialog.js";
-
-export { ErrorDialog };