@videojs/react 10.0.0-rc.1 → 10.0.0-rc.3

package/dist/dev/i18n/use-lazy-translations.js

@@ -1,34 +1,65 @@
 import { findLocaleKeys, getBrowserTranslations, registerI18n, shouldAttemptBrowserTranslation } from "@videojs/core/i18n";
+import { c } from "react-compiler-runtime";
 import { useEffect, useLayoutEffect, useRef, useState } from "react";
 import { mergeLocaleOverlays } from "@videojs/utils/dom";
 //#region src/i18n/use-lazy-translations.ts
 function useLazyTranslations(resolvedLocale, loader) {
-	const [lazyLayer, setLazyLayer] = useState({});
+	const $ = c(8);
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = {};
+		$[0] = t0;
+	} else t0 = $[0];
+	const [lazyLayer, setLazyLayer] = useState(t0);
 	const lazySeqRef = useRef(0);
-	useLayoutEffect(() => {
-		lazySeqRef.current += 1;
-		setLazyLayer({});
-	}, [resolvedLocale]);
-	useEffect(() => {
-		const seq = lazySeqRef.current;
-		const locale = resolvedLocale;
-		(async () => {
-			try {
-				const { merged, loadedTags } = await mergeLocaleOverlays(locale, loader, findLocaleKeys);
-				if (seq !== lazySeqRef.current) return;
-				if (shouldAttemptBrowserTranslation(locale, loadedTags, merged)) {
-					const browser = await getBrowserTranslations(locale);
+	let t1;
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = () => {
+			lazySeqRef.current = lazySeqRef.current + 1;
+			setLazyLayer({});
+		};
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== resolvedLocale) {
+		t2 = [resolvedLocale];
+		$[2] = resolvedLocale;
+		$[3] = t2;
+	} else t2 = $[3];
+	useLayoutEffect(t1, t2);
+	let t3;
+	let t4;
+	if ($[4] !== loader || $[5] !== resolvedLocale) {
+		t3 = () => {
+			const seq = lazySeqRef.current;
+			const locale = resolvedLocale;
+			(async () => {
+				try {
+					const { merged, loadedTags } = await mergeLocaleOverlays(locale, loader, findLocaleKeys);
+					if (seq !== lazySeqRef.current) return;
+					if (shouldAttemptBrowserTranslation(locale, loadedTags, merged)) {
+						const browser = await getBrowserTranslations(locale);
+						if (seq !== lazySeqRef.current) return;
+						if (Object.keys(browser).length) registerI18n(locale, browser);
+					}
 					if (seq !== lazySeqRef.current) return;
-					if (Object.keys(browser).length) registerI18n(locale, browser);
-				}
-				if (seq !== lazySeqRef.current) return;
-				setLazyLayer(merged);
-			} catch {}
-		})();
-		return () => {
-			if (lazySeqRef.current === seq) lazySeqRef.current += 1;
+					setLazyLayer(merged);
+				} catch {}
+			})();
+			return () => {
+				if (lazySeqRef.current === seq) lazySeqRef.current = lazySeqRef.current + 1;
+			};
 		};
-	}, [resolvedLocale, loader]);
+		t4 = [resolvedLocale, loader];
+		$[4] = loader;
+		$[5] = resolvedLocale;
+		$[6] = t3;
+		$[7] = t4;
+	} else {
+		t3 = $[6];
+		t4 = $[7];
+	}
+	useEffect(t3, t4);
 	return lazyLayer;
 }
 //#endregion

package/dist/dev/i18n/use-lazy-translations.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-lazy-translations.js","names":[],"sources":["../../../src/i18n/use-lazy-translations.ts"],"sourcesContent":["import {\n  type FlatTranslations,\n  findLocaleKeys,\n  getBrowserTranslations,\n  type Locale,\n  registerI18n,\n  shouldAttemptBrowserTranslation,\n} from '@videojs/core/i18n';\nimport { mergeLocaleOverlays } from '@videojs/utils/dom';\nimport { useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nexport type LocaleLoader = (tag: string) => Promise<Partial<FlatTranslations> | undefined>;\n\nexport function useLazyTranslations(resolvedLocale: Locale, loader: LocaleLoader): Partial<FlatTranslations> {\n  const [lazyLayer, setLazyLayer] = useState<Partial<FlatTranslations>>({});\n  const lazySeqRef = useRef(0);\n\n  // rerun when `resolvedLocale` changes even though the reset callback does not reference it.\n  // oxlint-disable-next-line react/exhaustive-deps\n  useLayoutEffect(() => {\n    lazySeqRef.current += 1;\n    setLazyLayer({});\n  }, [resolvedLocale]);\n\n  useEffect(() => {\n    const seq = lazySeqRef.current;\n    const locale = resolvedLocale;\n\n    // Locale loading and browser translation are async; ignore stale results\n    // after locale changes or unmount.\n    void (async () => {\n      try {\n        const { merged, loadedTags } = await mergeLocaleOverlays(locale, loader, findLocaleKeys);\n\n        if (seq !== lazySeqRef.current) return;\n\n        if (shouldAttemptBrowserTranslation(locale, loadedTags, merged)) {\n          const browser = await getBrowserTranslations(locale);\n\n          if (seq !== lazySeqRef.current) return;\n\n          if (Object.keys(browser).length) registerI18n(locale, browser);\n        }\n\n        if (seq !== lazySeqRef.current) return;\n\n        setLazyLayer(merged);\n      } catch {\n        // Registry and prop translations still work if lazy loading fails.\n      }\n    })();\n\n    return () => {\n      if (lazySeqRef.current === seq) {\n        lazySeqRef.current += 1;\n      }\n    };\n  }, [resolvedLocale, loader]);\n\n  return lazyLayer;\n}\n"],"mappings":";;;;AAaA,SAAgB,oBAAoB,gBAAwB,QAAiD;CAC3G,MAAM,CAAC,WAAW,gBAAgB,SAAoC,CAAC,CAAC;CACxE,MAAM,aAAa,OAAO,CAAC;CAI3B,sBAAsB;EACpB,WAAW,WAAW;EACtB,aAAa,CAAC,CAAC;CACjB,GAAG,CAAC,cAAc,CAAC;CAEnB,gBAAgB;EACd,MAAM,MAAM,WAAW;EACvB,MAAM,SAAS;EAIf,CAAM,YAAY;GAChB,IAAI;IACF,MAAM,EAAE,QAAQ,eAAe,MAAM,oBAAoB,QAAQ,QAAQ,cAAc;IAEvF,IAAI,QAAQ,WAAW,SAAS;IAEhC,IAAI,gCAAgC,QAAQ,YAAY,MAAM,GAAG;KAC/D,MAAM,UAAU,MAAM,uBAAuB,MAAM;KAEnD,IAAI,QAAQ,WAAW,SAAS;KAEhC,IAAI,OAAO,KAAK,OAAO,CAAC,CAAC,QAAQ,aAAa,QAAQ,OAAO;IAC/D;IAEA,IAAI,QAAQ,WAAW,SAAS;IAEhC,aAAa,MAAM;GACrB,QAAQ,CAER;EACF,EAAA,CAAG;EAEH,aAAa;GACX,IAAI,WAAW,YAAY,KACzB,WAAW,WAAW;EAE1B;CACF,GAAG,CAAC,gBAAgB,MAAM,CAAC;CAE3B,OAAO;AACT"}
+{"version":3,"file":"use-lazy-translations.js","names":["{}","() => {\n    lazySeqRef.current += 1;\n    setLazyLayer({});\n  }","[resolvedLocale]","() => {\n    const seq = lazySeqRef.current;\n    const locale = resolvedLocale;\n\n    // Locale loading and browser translation are async; ignore stale results\n    // after locale changes or unmount.\n    void (async () => {\n      try {\n        const { merged, loadedTags } = await mergeLocaleOverlays(locale, loader, findLocaleKeys);\n\n        if (seq !== lazySeqRef.current) return;\n\n        if (shouldAttemptBrowserTranslation(locale, loadedTags, merged)) {\n          const browser = await getBrowserTranslations(locale);\n\n          if (seq !== lazySeqRef.current) return;\n\n          if (Object.keys(browser).length) registerI18n(locale, browser);\n        }\n\n        if (seq !== lazySeqRef.current) return;\n\n        setLazyLayer(merged);\n      } catch {\n        // Registry and prop translations still work if lazy loading fails.\n      }\n    })();\n\n    return () => {\n      if (lazySeqRef.current === seq) {\n        lazySeqRef.current += 1;\n      }\n    };\n  }","[resolvedLocale, loader]"],"sources":["../../../src/i18n/use-lazy-translations.ts"],"sourcesContent":["import {\n  type FlatTranslations,\n  findLocaleKeys,\n  getBrowserTranslations,\n  type Locale,\n  registerI18n,\n  shouldAttemptBrowserTranslation,\n} from '@videojs/core/i18n';\nimport { mergeLocaleOverlays } from '@videojs/utils/dom';\nimport { useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nexport type LocaleLoader = (tag: string) => Promise<Partial<FlatTranslations> | undefined>;\n\nexport function useLazyTranslations(resolvedLocale: Locale, loader: LocaleLoader): Partial<FlatTranslations> {\n  const [lazyLayer, setLazyLayer] = useState<Partial<FlatTranslations>>({});\n  const lazySeqRef = useRef(0);\n\n  // rerun when `resolvedLocale` changes even though the reset callback does not reference it.\n  // oxlint-disable-next-line react/exhaustive-deps\n  useLayoutEffect(() => {\n    lazySeqRef.current += 1;\n    setLazyLayer({});\n  }, [resolvedLocale]);\n\n  useEffect(() => {\n    const seq = lazySeqRef.current;\n    const locale = resolvedLocale;\n\n    // Locale loading and browser translation are async; ignore stale results\n    // after locale changes or unmount.\n    void (async () => {\n      try {\n        const { merged, loadedTags } = await mergeLocaleOverlays(locale, loader, findLocaleKeys);\n\n        if (seq !== lazySeqRef.current) return;\n\n        if (shouldAttemptBrowserTranslation(locale, loadedTags, merged)) {\n          const browser = await getBrowserTranslations(locale);\n\n          if (seq !== lazySeqRef.current) return;\n\n          if (Object.keys(browser).length) registerI18n(locale, browser);\n        }\n\n        if (seq !== lazySeqRef.current) return;\n\n        setLazyLayer(merged);\n      } catch {\n        // Registry and prop translations still work if lazy loading fails.\n      }\n    })();\n\n    return () => {\n      if (lazySeqRef.current === seq) {\n        lazySeqRef.current += 1;\n      }\n    };\n  }, [resolvedLocale, loader]);\n\n  return lazyLayer;\n}\n"],"mappings":";;;;;AAaA,SAAgB,oBAAoB,gBAAwB,QAAiD;;CACrCA,IAAAA;;EAAC,KAAA,CAAA;;;CAAvE,MAAM,CAAC,WAAW,gBAAgB,SAAoCA,EAAE;CACxE,MAAM,aAAa,OAAO,CAAC;CAIXC,IAAAA;;EAAM,WAAA;GACpB,WAAW,UAAX,WAAW,UAAW;GACtB,aAAa,CAAC,CAAC;EACjB;;;CAAGC,IAAAA;CAAC,IAAA,EAAA,OAAA,gBAAA;EAAD,KAAA,CAAC,cAAc;EAAd,EAAA,KAAA;;;CAHJ,gBAAgBD,IAGbC,EAAgB;CAETC,IAAAA;CAiCPC,IAAAA;CAzBoE,IAAA,EAAA,OAAA,UAAA,EAAA,OANtD,gBAAA;EAFP,WAAM;GACd,MAAM,MAAM,WAAW;GACvB,MAAM,SAAS;GAIV,CAAC,YAAY;IAChB,IAAI;KACF,MAAM,EAAE,QAAQ,eAAe,MAAM,oBAAoB,QAAQ,QAAQ,cAAc;KAEvF,IAAI,QAAQ,WAAW,SAAS;KAEhC,IAAI,gCAAgC,QAAQ,YAAY,MAAM,GAAG;MAC/D,MAAM,UAAU,MAAM,uBAAuB,MAAM;MAEnD,IAAI,QAAQ,WAAW,SAAS;MAEhC,IAAI,OAAO,KAAK,OAAO,CAAC,CAAC,QAAQ,aAAa,QAAQ,OAAO;KAC/D;KAEA,IAAI,QAAQ,WAAW,SAAS;KAEhC,aAAa,MAAM;IACrB,QAAQ,CAER;GACF,EAAA,CAAG;GAEH,aAAa;IACX,IAAI,WAAW,YAAY,KACzB,WAAW,UAAX,WAAW,UAAW;GAE1B;EACF;EAAG,KAAA,CAAC,gBAAgB,MAAM;EAzB6C,EAAA,KAAA;EANtD,EAAA,KAAA;;;;;;;CAFjB,UAAUD,IAiCPC,EAAwB;CAE3B,OAAO;AACT"}

package/dist/dev/i18n/use-merged-translations.js

@@ -1,22 +1,42 @@
 import { useRegistryEpoch } from "./use-registry-epoch.js";
 import { flattenTranslations, getI18nTranslations } from "@videojs/core/i18n";
-import { useMemo } from "react";
+import { c } from "react-compiler-runtime";
 //#region src/i18n/use-merged-translations.ts
 function useMergedTranslations(resolvedLocale, lazyLayer, translationsProp) {
-	const registryEpoch = useRegistryEpoch();
-	return useMemo(() => {
-		const registryLayer = getI18nTranslations(resolvedLocale);
-		return {
+	const $ = c(10);
+	useRegistryEpoch();
+	let t0;
+	if ($[0] !== resolvedLocale) {
+		t0 = getI18nTranslations(resolvedLocale);
+		$[0] = resolvedLocale;
+		$[1] = t0;
+	} else t0 = $[1];
+	const registryLayer = t0;
+	let t1;
+	if ($[2] !== translationsProp) {
+		t1 = translationsProp ?? {};
+		$[2] = translationsProp;
+		$[3] = t1;
+	} else t1 = $[3];
+	let t2;
+	if ($[4] !== t1) {
+		t2 = flattenTranslations(t1);
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== lazyLayer || $[7] !== registryLayer || $[8] !== t2) {
+		t3 = {
 			...lazyLayer,
 			...registryLayer,
-			...flattenTranslations(translationsProp ?? {})
+			...t2
 		};
-	}, [
-		resolvedLocale,
-		lazyLayer,
-		translationsProp,
-		registryEpoch
-	]);
+		$[6] = lazyLayer;
+		$[7] = registryLayer;
+		$[8] = t2;
+		$[9] = t3;
+	} else t3 = $[9];
+	return t3;
 }
 //#endregion
 export { useMergedTranslations };

package/dist/dev/i18n/use-merged-translations.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-merged-translations.js","names":[],"sources":["../../../src/i18n/use-merged-translations.ts"],"sourcesContent":["import {\n  type FlatTranslations,\n  flattenTranslations,\n  getI18nTranslations,\n  type Locale,\n  type Translations,\n} from '@videojs/core/i18n';\nimport { useMemo } from 'react';\n\nimport { useRegistryEpoch } from './use-registry-epoch';\n\nexport function useMergedTranslations(\n  resolvedLocale: Locale,\n  lazyLayer: Partial<FlatTranslations>,\n  translationsProp?: Partial<Translations>\n): FlatTranslations {\n  const registryEpoch = useRegistryEpoch();\n\n  return useMemo(() => {\n    void registryEpoch;\n    const registryLayer = getI18nTranslations(resolvedLocale);\n\n    return {\n      ...lazyLayer,\n      ...registryLayer,\n      ...flattenTranslations(translationsProp ?? {}),\n    } as FlatTranslations;\n  }, [resolvedLocale, lazyLayer, translationsProp, registryEpoch]);\n}\n"],"mappings":";;;;AAWA,SAAgB,sBACd,gBACA,WACA,kBACkB;CAClB,MAAM,gBAAgB,iBAAiB;CAEvC,OAAO,cAAc;EAEnB,MAAM,gBAAgB,oBAAoB,cAAc;EAExD,OAAO;GACL,GAAG;GACH,GAAG;GACH,GAAG,oBAAoB,oBAAoB,CAAC,CAAC;EAC/C;CACF,GAAG;EAAC;EAAgB;EAAW;EAAkB;CAAa,CAAC;AACjE"}
+{"version":3,"file":"use-merged-translations.js","names":["getI18nTranslations(resolvedLocale)","translationsProp ?? {}","flattenTranslations(translationsProp ?? {})","{\n      ...lazyLayer,\n      ...registryLayer,\n      ...flattenTranslations(translationsProp ?? {}),\n    }"],"sources":["../../../src/i18n/use-merged-translations.ts"],"sourcesContent":["import {\n  type FlatTranslations,\n  flattenTranslations,\n  getI18nTranslations,\n  type Locale,\n  type Translations,\n} from '@videojs/core/i18n';\nimport { useMemo } from 'react';\n\nimport { useRegistryEpoch } from './use-registry-epoch';\n\nexport function useMergedTranslations(\n  resolvedLocale: Locale,\n  lazyLayer: Partial<FlatTranslations>,\n  translationsProp?: Partial<Translations>\n): FlatTranslations {\n  const registryEpoch = useRegistryEpoch();\n\n  return useMemo(() => {\n    void registryEpoch;\n    const registryLayer = getI18nTranslations(resolvedLocale);\n\n    return {\n      ...lazyLayer,\n      ...registryLayer,\n      ...flattenTranslations(translationsProp ?? {}),\n    } as FlatTranslations;\n  }, [resolvedLocale, lazyLayer, translationsProp, registryEpoch]);\n}\n"],"mappings":";;;;AAWA,SAAgB,sBACd,gBACA,WACA,kBACkB;;CACI,iBAAiB;CAIfA,IAAAA;CAAoB,IAAA,EAAA,OAAA,gBAAA;EAApB,KAAA,oBAAoB,cAAc;EAAd,EAAA,KAAA;;;CAA1C,MAAM,gBAAgBA;CAKGC,IAAAA;;EAAoB,KAAA,oBAAA,CAAC;EAArB,EAAA,KAAA;;;CAApBC,IAAAA;CAAoBD,IAAAA,EAAAA,OAAAA,IAAAA;EAApB,KAAA,oBAAoBA,EAAsB;EAAtBA,EAAAA,KAAAA;;;CAHlBE,IAAAA;CACF,IAAA,EAAA,OAAA,aAAA,EAAA,OACA,iBAAA,EAAA,OACAD,IAAAA;EAHE,KAAA;GACL,GAAG;GACH,GAAG;GACH,GAAGA;EACL;EAHK,EAAA,KAAA;EACA,EAAA,KAAA;EACAA,EAAAA,KAAAA;;;CAPP,OAISC;AAMX"}

package/dist/dev/i18n/use-registry-epoch.js

@@ -1,13 +1,27 @@
 import { onI18nRegistryChange } from "@videojs/core/i18n";
+import { c } from "react-compiler-runtime";
 import { useEffect, useReducer } from "react";
 //#region src/i18n/use-registry-epoch.ts
 function useRegistryEpoch() {
-	const [epoch, invalidate] = useReducer((value) => value + 1, 0);
-	useEffect(() => {
-		return onI18nRegistryChange(() => invalidate());
-	}, []);
+	const $ = c(2);
+	const [epoch, invalidate] = useReducer(_temp, 0);
+	let t0;
+	let t1;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = () => onI18nRegistryChange(() => invalidate());
+		t1 = [];
+		$[0] = t0;
+		$[1] = t1;
+	} else {
+		t0 = $[0];
+		t1 = $[1];
+	}
+	useEffect(t0, t1);
 	return epoch;
 }
+function _temp(value) {
+	return value + 1;
+}
 //#endregion
 export { useRegistryEpoch };
 

package/dist/dev/i18n/use-registry-epoch.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-registry-epoch.js","names":[],"sources":["../../../src/i18n/use-registry-epoch.ts"],"sourcesContent":["import { onI18nRegistryChange } from '@videojs/core/i18n';\nimport { useEffect, useReducer } from 'react';\n\nexport function useRegistryEpoch(): number {\n  const [epoch, invalidate] = useReducer((value: number) => value + 1, 0);\n\n  useEffect(() => {\n    return onI18nRegistryChange(() => invalidate());\n  }, []);\n\n  return epoch;\n}\n"],"mappings":";;;AAGA,SAAgB,mBAA2B;CACzC,MAAM,CAAC,OAAO,cAAc,YAAY,UAAkB,QAAQ,GAAG,CAAC;CAEtE,gBAAgB;EACd,OAAO,2BAA2B,WAAW,CAAC;CAChD,GAAG,CAAC,CAAC;CAEL,OAAO;AACT"}
+{"version":3,"file":"use-registry-epoch.js","names":["(value: number) => value + 1","() => {\n    return onI18nRegistryChange(() => invalidate());\n  }","[]"],"sources":["../../../src/i18n/use-registry-epoch.ts"],"sourcesContent":["import { onI18nRegistryChange } from '@videojs/core/i18n';\nimport { useEffect, useReducer } from 'react';\n\nexport function useRegistryEpoch(): number {\n  const [epoch, invalidate] = useReducer((value: number) => value + 1, 0);\n\n  useEffect(() => {\n    return onI18nRegistryChange(() => invalidate());\n  }, []);\n\n  return epoch;\n}\n"],"mappings":";;;;AAGA,SAAgB,mBAA2B;;CACzC,MAAM,CAAC,OAAO,cAAc,WAAWA,OAA8B,CAAC;CAE5DC,IAAAA;CAEPC,IAAAA;;EAFO,WACD,2BAA2B,WAAW,CAAC;EAC7C,KAAA,CAAC;;;;;;;CAFJ,UAAUD,IAEPC,EAAE;CAEL,OAAO;AACT;AAPyC,SAAA,MAAC,OAAA;CAAkB,OAAA,QAAQ"}

package/dist/dev/index.d.ts

@@ -7,23 +7,23 @@ import { Container, ContainerProps } from "./player/container.js";
 import { PlayerContextValue, useContainer, useContainerAttach, useMedia, useMediaAttach, useOptionalContainer, useOptionalPlayer, usePlayer, usePlayerContext } from "./player/context.js";
 import { CreatePlayerConfig, CreatePlayerResult, PlayerProps, createPlayer } from "./player/create-player.js";
 import { HTMLProps, RenderFunction, RenderProp, UIComponentProps } from "./utils/types.js";
-import { AirPlayButton, AirPlayButtonProps } from "./ui/airplay-button/airplay-button.js";
+import { AirPlayButton, AirPlayButtonProps } from "./ui/airplay-button/component.js";
 import { index_parts_d_exports as index_parts_d_exports$2 } from "./ui/dialog/index.parts.js";
 import { index_parts_d_exports } from "./ui/alert-dialog/index.parts.js";
 import "./ui/alert-dialog/index.js";
 import { AudioTrackOption, AudioTrackOptionsProps, AudioTrackOptionsResult, useAudioTrackOptions } from "./ui/audio-track/use-audio-track-options.js";
 import "./ui/audio-track/index.js";
-import { AudioTrackRadioGroupLegacy } from "./ui/audio-track-radio-group/audio-track-radio-group.js";
+import { AudioTrackRadioGroupLegacy } from "./ui/audio-track-radio-group/component.js";
 import "./ui/audio-track-radio-group/index.js";
-import { BufferingIndicator, BufferingIndicatorProps } from "./ui/buffering-indicator/buffering-indicator.js";
-import { CaptionsButton, CaptionsButtonProps } from "./ui/captions-button/captions-button.js";
+import { BufferingIndicator, BufferingIndicatorProps } from "./ui/buffering-indicator/component.js";
+import { CaptionsButton, CaptionsButtonProps } from "./ui/captions-button/component.js";
 import { CaptionsOption, CaptionsOptionsProps, CaptionsOptionsResult, useCaptionsOptions } from "./ui/captions-radio-group/use-captions-options.js";
-import { CaptionsRadioGroupLegacy } from "./ui/captions-radio-group/captions-radio-group.js";
+import { CaptionsRadioGroupLegacy } from "./ui/captions-radio-group/component.js";
 import "./ui/captions-radio-group/index.js";
-import { CastButton, CastButtonProps } from "./ui/cast-button/cast-button.js";
-import { ControlsContentProps } from "./ui/controls/controls-content.js";
-import { ControlsGroupProps } from "./ui/controls/controls-group.js";
-import { ControlsRootProps } from "./ui/controls/controls-root.js";
+import { CastButton, CastButtonProps } from "./ui/cast-button/component.js";
+import { ControlsContentProps } from "./ui/controls/content.js";
+import { ControlsGroupProps } from "./ui/controls/group.js";
+import { ControlsRootProps } from "./ui/controls/root.js";
 import { index_parts_d_exports as index_parts_d_exports$1 } from "./ui/controls/index.parts.js";
 import "./ui/controls/index.js";
 import { DialogContextValue, useDialogContext } from "./ui/dialog/context.js";
@@ -31,79 +31,87 @@ import "./ui/dialog/index.js";
 import { ErrorDialogContextValue, useErrorDialogContext } from "./ui/error-dialog/context.js";
 import { index_parts_d_exports as index_parts_d_exports$3 } from "./ui/error-dialog/index.parts.js";
 import "./ui/error-dialog/index.js";
-import { FullscreenButton, FullscreenButtonProps } from "./ui/fullscreen-button/fullscreen-button.js";
-import { Gesture, GestureProps, MediaGesture, MediaGestureProps } from "./ui/gesture/gesture.js";
+import { FullscreenButton, FullscreenButtonProps } from "./ui/fullscreen-button/component.js";
+import { Gesture, GestureProps, MediaGesture, MediaGestureProps } from "./ui/gesture/component.js";
 import { UseDoubleTapGestureOptions, useDoubleTapGesture } from "./ui/gesture/use-doubletap-gesture.js";
 import { UseTapGestureOptions, useTapGesture } from "./ui/gesture/use-tap-gesture.js";
 import { useButton } from "./ui/hooks/use-button.js";
 import { useSlider } from "./ui/hooks/use-slider.js";
-import { Hotkey, HotkeyProps, MediaHotkey, MediaHotkeyProps } from "./ui/hotkey/hotkey.js";
+import { Hotkey, HotkeyProps, MediaHotkey, MediaHotkeyProps } from "./ui/hotkey/component.js";
 import { UseHotkeyOptions, useHotkey } from "./ui/hotkey/use-hotkey.js";
 import { useHotkeyShortcut } from "./ui/hotkey/use-hotkey-shortcut.js";
-import { LiveButton, LiveButtonProps } from "./ui/live-button/live-button.js";
+import { LiveButton, LiveButtonProps } from "./ui/live-button/component.js";
 import { MenuContextValue, useMenuContext, useOptionalMenuContext } from "./ui/menu/context.js";
 import { index_parts_d_exports as index_parts_d_exports$4 } from "./ui/menu/index.parts.js";
 import "./ui/menu/index.js";
-import { MuteButton, MuteButtonProps } from "./ui/mute-button/mute-button.js";
-import { PiPButton, PiPButtonProps } from "./ui/pip-button/pip-button.js";
-import { PlayButton, PlayButtonProps } from "./ui/play-button/play-button.js";
+import { MuteButton, MuteButtonProps } from "./ui/mute-button/component.js";
+import { PiPButton, PiPButtonProps } from "./ui/pip-button/component.js";
+import { PlayButton, PlayButtonProps } from "./ui/play-button/component.js";
 import { PlaybackRateOption, PlaybackRateOptionsProps, PlaybackRateOptionsResult, usePlaybackRateOptions } from "./ui/playback-rate/use-playback-rate-options.js";
 import "./ui/playback-rate/index.js";
-import { PlaybackRateButton, PlaybackRateButtonProps } from "./ui/playback-rate-button/playback-rate-button.js";
-import { PlaybackRateRadioGroupLegacy } from "./ui/playback-rate-radio-group/playback-rate-radio-group.js";
+import { PlaybackRateButton, PlaybackRateButtonProps } from "./ui/playback-rate-button/component.js";
+import { PlaybackRateRadioGroupLegacy } from "./ui/playback-rate-radio-group/component.js";
 import "./ui/playback-rate-radio-group/index.js";
 import { PopoverContextValue, usePopoverContext } from "./ui/popover/context.js";
 import { index_parts_d_exports as index_parts_d_exports$5 } from "./ui/popover/index.parts.js";
 import "./ui/popover/index.js";
-import { Poster, PosterProps } from "./ui/poster/poster.js";
+import { PosterImageProps } from "./ui/poster/image.js";
+import { PosterRootProps } from "./ui/poster/root.js";
+import { index_parts_d_exports as index_parts_d_exports$6 } from "./ui/poster/index.parts.js";
+import "./ui/poster/index.js";
 import { QualityOption, QualityOptionsProps, QualityOptionsResult, useQualityOptions } from "./ui/quality/use-quality-options.js";
 import "./ui/quality/index.js";
-import { QualityRadioGroupLegacy } from "./ui/quality-radio-group/quality-radio-group.js";
+import { QualityRadioGroupLegacy } from "./ui/quality-radio-group/component.js";
 import "./ui/quality-radio-group/index.js";
-import { SeekButton, SeekButtonProps } from "./ui/seek-button/seek-button.js";
-import { SeekIndicatorRootProps } from "./ui/seek-indicator/seek-indicator-root.js";
-import { SeekIndicatorValueProps } from "./ui/seek-indicator/seek-indicator-value.js";
-import { index_parts_d_exports as index_parts_d_exports$6 } from "./ui/seek-indicator/index.parts.js";
+import { SeekButton, SeekButtonProps } from "./ui/seek-button/component.js";
+import { SeekIndicatorRootProps } from "./ui/seek-indicator/root.js";
+import { SeekIndicatorValueProps } from "./ui/seek-indicator/value.js";
+import { index_parts_d_exports as index_parts_d_exports$7 } from "./ui/seek-indicator/index.parts.js";
 import "./ui/seek-indicator/index.js";
-import { SliderBufferProps } from "./ui/slider/slider-buffer.js";
-import { SliderFillProps } from "./ui/slider/slider-fill.js";
-import { SliderRootProps } from "./ui/slider/slider-root.js";
-import { SliderThumbProps } from "./ui/slider/slider-thumb.js";
-import { Thumbnail, ThumbnailProps } from "./ui/thumbnail/thumbnail.js";
-import { SliderThumbnailProps } from "./ui/slider/slider-thumbnail.js";
-import { SliderTrackProps } from "./ui/slider/slider-track.js";
-import { SliderValueProps } from "./ui/slider/slider-value.js";
-import { index_parts_d_exports as index_parts_d_exports$7 } from "./ui/slider/index.parts.js";
+import { SliderBufferProps } from "./ui/slider/buffer.js";
+import { SliderFillProps } from "./ui/slider/fill.js";
+import { SliderRootProps } from "./ui/slider/root.js";
+import { SliderThumbProps } from "./ui/slider/thumb.js";
+import { ThumbnailImageProps } from "./ui/thumbnail/image.js";
+import { ThumbnailRootProps } from "./ui/thumbnail/root.js";
+import { SliderThumbnailRootProps } from "./ui/slider/thumbnail/root.js";
+import { SliderTrackProps } from "./ui/slider/track.js";
+import { SliderValueProps } from "./ui/slider/value.js";
+import { index_parts_d_exports as index_parts_d_exports$8 } from "./ui/slider/index.parts.js";
 import "./ui/slider/index.js";
-import { StatusAnnouncer, StatusAnnouncerProps } from "./ui/status-announcer/status-announcer.js";
-import { StatusIndicatorRootProps } from "./ui/status-indicator/status-indicator-root.js";
-import { StatusIndicatorValueProps } from "./ui/status-indicator/status-indicator-value.js";
-import { index_parts_d_exports as index_parts_d_exports$8 } from "./ui/status-indicator/index.parts.js";
+import { StatusAnnouncer, StatusAnnouncerProps } from "./ui/status-announcer/component.js";
+import { StatusIndicatorRootProps } from "./ui/status-indicator/root.js";
+import { StatusIndicatorValueProps } from "./ui/status-indicator/value.js";
+import { index_parts_d_exports as index_parts_d_exports$9 } from "./ui/status-indicator/index.parts.js";
 import "./ui/status-indicator/index.js";
-import { index_parts_d_exports as index_parts_d_exports$9 } from "./ui/time/index.parts.js";
+import { index_parts_d_exports as index_parts_d_exports$10 } from "./ui/thumbnail/index.parts.js";
+import "./ui/thumbnail/index.js";
+import { index_parts_d_exports as index_parts_d_exports$11 } from "./ui/time/index.parts.js";
 import "./ui/time/index.js";
-import { TimeSliderChapterTitleProps, TimeSliderChapterTitleState } from "./ui/time-slider/time-slider-chapters/time-slider-chapter-title.js";
-import { TimeSliderChapterState, TimeSliderChaptersProps, TimeSliderChaptersState } from "./ui/time-slider/time-slider-chapters/time-slider-chapters.js";
-import { index_parts_d_exports as index_parts_d_exports$10 } from "./ui/time-slider/index.parts.js";
+import { TimeSliderChapterTitleProps, TimeSliderChapterTitleState } from "./ui/time-slider/chapter-title.js";
+import { TimeSliderChapterState, TimeSliderChaptersProps, TimeSliderChaptersState } from "./ui/time-slider/chapters.js";
+import { index_parts_d_exports as index_parts_d_exports$12 } from "./ui/time-slider/index.parts.js";
 import "./ui/time-slider/index.js";
-import { Title, TitleProps } from "./ui/title/title.js";
+import { Title, TitleProps } from "./ui/title/component.js";
+import "./ui/title/index.js";
 import { TooltipContent, TooltipContextValue, useTooltipContext } from "./ui/tooltip/context.js";
-import { index_parts_d_exports as index_parts_d_exports$11 } from "./ui/tooltip/index.parts.js";
+import { index_parts_d_exports as index_parts_d_exports$13 } from "./ui/tooltip/index.parts.js";
 import "./ui/tooltip/index.js";
-import { VolumeIndicatorFillProps } from "./ui/volume-indicator/volume-indicator-fill.js";
-import { VolumeIndicatorRootProps } from "./ui/volume-indicator/volume-indicator-root.js";
-import { VolumeIndicatorValueProps } from "./ui/volume-indicator/volume-indicator-value.js";
-import { index_parts_d_exports as index_parts_d_exports$12 } from "./ui/volume-indicator/index.parts.js";
+import { VolumeIndicatorFillProps } from "./ui/volume-indicator/fill.js";
+import { VolumeIndicatorRootProps } from "./ui/volume-indicator/root.js";
+import { VolumeIndicatorValueProps } from "./ui/volume-indicator/value.js";
+import { index_parts_d_exports as index_parts_d_exports$14 } from "./ui/volume-indicator/index.parts.js";
 import "./ui/volume-indicator/index.js";
-import { index_parts_d_exports as index_parts_d_exports$13 } from "./ui/volume-popover/index.parts.js";
+import { index_parts_d_exports as index_parts_d_exports$15 } from "./ui/volume-popover/index.parts.js";
 import "./ui/volume-popover/index.js";
-import { index_parts_d_exports as index_parts_d_exports$14 } from "./ui/volume-slider/index.parts.js";
+import { index_parts_d_exports as index_parts_d_exports$16 } from "./ui/volume-slider/index.parts.js";
 import "./ui/volume-slider/index.js";
 import { mergeProps } from "./utils/merge-props.js";
 import { useAttachMedia } from "./utils/use-attach-media.js";
 import { composeRefs, useComposedRefs } from "./utils/use-composed-refs.js";
 import { useDestroy } from "./utils/use-destroy.js";
 import { useLatestRef } from "./utils/use-latest-ref.js";
+import { MediaEventHandler, MediaEventPropName, MediaEventProps, useMediaEvents } from "./utils/use-media-events.js";
 import { useMediaExtension } from "./utils/use-media-extension.js";
 import { useMediaInstance } from "./utils/use-media-instance.js";
 import { renderElement } from "./utils/use-render.js";
@@ -114,10 +122,10 @@ import { useSelector, useStore } from "@videojs/store/react";
 export * from "@videojs/core/dom";
 export * from "@videojs/media/dom";
 declare namespace index_d_exports {
-  export { AirPlayButton, AirPlayButtonProps, index_parts_d_exports as AlertDialog, AudioTrackOption, AudioTrackOptionsProps, AudioTrackOptionsResult, AudioTrackRadioGroupLegacy as AudioTrackRadioGroup, BufferingIndicator, BufferingIndicatorProps, CaptionsButton, CaptionsButtonProps, CaptionsOption, CaptionsOptionsProps, CaptionsOptionsResult, CaptionsRadioGroupLegacy as CaptionsRadioGroup, CastButton, CastButtonProps, Comparator, Container, ContainerProps, index_parts_d_exports$1 as Controls, ControlsContentProps, ControlsGroupProps, ControlsRootProps, CreateI18nOptions, CreateI18nResult, CreatePlayerConfig, CreatePlayerResult, DEFAULT_SEEK_STEP, index_parts_d_exports$2 as Dialog, DialogContextValue, index_parts_d_exports$3 as ErrorDialog, ErrorDialogContextValue, FlatTranslations, FullscreenButton, FullscreenButtonProps, Gesture, GestureProps, HTMLProps, Hotkey, HotkeyProps, I18nContext, I18nContextValue, I18nProvider, I18nProviderProps, IndicatorStatus, InputAction, InputIndicatorLabels, LiveButton, LiveButtonProps, Locale, MediaGesture, MediaGestureProps, MediaHotkey, MediaHotkeyProps, index_parts_d_exports$4 as Menu, MenuContextValue, MuteButton, MuteButtonProps, NodeListLike, PiPButton, PiPButtonProps, PlayButton, PlayButtonProps, PlaybackRateButton, PlaybackRateButtonProps, PlaybackRateOption, PlaybackRateOptionsProps, PlaybackRateOptionsResult, PlaybackRateRadioGroupLegacy as PlaybackRateRadioGroup, PlayerContextValue, PlayerProps, index_parts_d_exports$5 as Popover, PopoverContextValue, Poster, PosterProps, QualityOption, QualityOptionsProps, QualityOptionsResult, QualityRadioGroupLegacy as QualityRadioGroup, RenderFunction, RenderProp, SeekButton, SeekButtonProps, index_parts_d_exports$6 as SeekIndicator, SeekIndicatorRootProps, SeekIndicatorValueProps, Selector, index_parts_d_exports$7 as Slider, SliderBufferProps, SliderFillProps, SliderRootProps, SliderThumbProps, SliderThumbnailProps, SliderTrackProps, SliderValueProps, StatusAnnouncer, StatusAnnouncerProps, index_parts_d_exports$8 as StatusIndicator, StatusIndicatorRootProps, StatusIndicatorValueProps, Text, TextProps, Thumbnail, ThumbnailProps, index_parts_d_exports$9 as Time, index_parts_d_exports$10 as TimeSlider, TimeSliderChapterState, TimeSliderChapterTitleProps, TimeSliderChapterTitleState, TimeSliderChaptersProps, TimeSliderChaptersState, Title, TitleProps, index_parts_d_exports$11 as Tooltip, TooltipContent, TooltipContextValue, TranslationParams, Translations, Translator, UIComponentProps, UseDoubleTapGestureOptions, UseHotkeyOptions, UseTapGestureOptions, index_parts_d_exports$12 as VolumeIndicator, VolumeIndicatorFillProps, VolumeIndicatorRootProps, VolumeIndicatorValueProps, index_parts_d_exports$13 as VolumePopover, index_parts_d_exports$14 as VolumeSlider, composeRefs, createI18n, createPlayer, createSelector, createTranslator, findLocaleKeys, getI18nTranslations, hasMetadata, hasRegisteredLocale, isMediaAudioTrackCapable, isMediaBufferCapable, isMediaErrorCapable, isMediaLiveCapable, isMediaPauseCapable, isMediaPlaybackRateCapable, isMediaRemotePlaybackCapable, isMediaSeekCapable, isMediaSourceCapable, isMediaStreamTypeCapable, isMediaTextTrackCapable, isMediaVideoDimensionsCapable, isMediaVideoRenditionCapable, isMediaVolumeCapable, isQuerySelectorAllCapable, mergeProps, onI18nRegistryChange, registerI18n, renderElement, shallowEqual, useAttachMedia, useAudioTrackOptions, useButton, useCaptionsOptions, useComposedRefs, useContainer, useContainerAttach, useDestroy, useDialogContext, useDoubleTapGesture, useErrorDialogContext, useHotkey, useHotkeyShortcut, useLatestRef, useLocale, useMedia, useMediaAttach, useMediaExtension, useMediaInstance, useMenuContext, useOptionalContainer, useOptionalMenuContext, useOptionalPlayer, usePlaybackRateOptions, usePlayer, usePlayerContext, usePopoverContext, useQualityOptions, useSelector, useSlider, useStore, useTapGesture, useTooltipContext, useTranslator };
+  export { AirPlayButton, AirPlayButtonProps, index_parts_d_exports as AlertDialog, AudioTrackOption, AudioTrackOptionsProps, AudioTrackOptionsResult, AudioTrackRadioGroupLegacy as AudioTrackRadioGroup, BufferingIndicator, BufferingIndicatorProps, CaptionsButton, CaptionsButtonProps, CaptionsOption, CaptionsOptionsProps, CaptionsOptionsResult, CaptionsRadioGroupLegacy as CaptionsRadioGroup, CastButton, CastButtonProps, Comparator, Container, ContainerProps, index_parts_d_exports$1 as Controls, ControlsContentProps, ControlsGroupProps, ControlsRootProps, CreateI18nOptions, CreateI18nResult, CreatePlayerConfig, CreatePlayerResult, DEFAULT_SEEK_STEP, index_parts_d_exports$2 as Dialog, DialogContextValue, index_parts_d_exports$3 as ErrorDialog, ErrorDialogContextValue, FlatTranslations, FullscreenButton, FullscreenButtonProps, Gesture, GestureProps, HTMLProps, Hotkey, HotkeyProps, I18nContext, I18nContextValue, I18nProvider, I18nProviderProps, IndicatorStatus, InputAction, InputIndicatorLabels, LiveButton, LiveButtonProps, Locale, MediaEventHandler, MediaEventPropName, MediaEventProps, MediaGesture, MediaGestureProps, MediaHotkey, MediaHotkeyProps, index_parts_d_exports$4 as Menu, MenuContextValue, MuteButton, MuteButtonProps, NodeListLike, PiPButton, PiPButtonProps, PlayButton, PlayButtonProps, PlaybackRateButton, PlaybackRateButtonProps, PlaybackRateOption, PlaybackRateOptionsProps, PlaybackRateOptionsResult, PlaybackRateRadioGroupLegacy as PlaybackRateRadioGroup, PlayerContextValue, PlayerProps, index_parts_d_exports$5 as Popover, PopoverContextValue, index_parts_d_exports$6 as Poster, PosterImageProps, PosterRootProps, QualityOption, QualityOptionsProps, QualityOptionsResult, QualityRadioGroupLegacy as QualityRadioGroup, RenderFunction, RenderProp, SeekButton, SeekButtonProps, index_parts_d_exports$7 as SeekIndicator, SeekIndicatorRootProps, SeekIndicatorValueProps, Selector, index_parts_d_exports$8 as Slider, SliderBufferProps, SliderFillProps, SliderRootProps, SliderThumbProps, SliderThumbnailRootProps, SliderTrackProps, SliderValueProps, StatusAnnouncer, StatusAnnouncerProps, index_parts_d_exports$9 as StatusIndicator, StatusIndicatorRootProps, StatusIndicatorValueProps, Text, TextProps, index_parts_d_exports$10 as Thumbnail, ThumbnailImageProps, ThumbnailRootProps, index_parts_d_exports$11 as Time, index_parts_d_exports$12 as TimeSlider, TimeSliderChapterState, TimeSliderChapterTitleProps, TimeSliderChapterTitleState, TimeSliderChaptersProps, TimeSliderChaptersState, Title, TitleProps, index_parts_d_exports$13 as Tooltip, TooltipContent, TooltipContextValue, TranslationParams, Translations, Translator, UIComponentProps, UseDoubleTapGestureOptions, UseHotkeyOptions, UseTapGestureOptions, index_parts_d_exports$14 as VolumeIndicator, VolumeIndicatorFillProps, VolumeIndicatorRootProps, VolumeIndicatorValueProps, index_parts_d_exports$15 as VolumePopover, index_parts_d_exports$16 as VolumeSlider, composeRefs, createI18n, createPlayer, createSelector, createTranslator, findLocaleKeys, getI18nTranslations, hasMetadata, hasRegisteredLocale, isMediaAudioTrackCapable, isMediaBufferCapable, isMediaErrorCapable, isMediaLiveCapable, isMediaPauseCapable, isMediaPlaybackRateCapable, isMediaRemotePlaybackCapable, isMediaSeekCapable, isMediaSourceCapable, isMediaStreamTypeCapable, isMediaTextTrackCapable, isMediaVideoDimensionsCapable, isMediaVideoRenditionCapable, isMediaVolumeCapable, isQuerySelectorAllCapable, mergeProps, onI18nRegistryChange, registerI18n, renderElement, shallowEqual, useAttachMedia, useAudioTrackOptions, useButton, useCaptionsOptions, useComposedRefs, useContainer, useContainerAttach, useDestroy, useDialogContext, useDoubleTapGesture, useErrorDialogContext, useHotkey, useHotkeyShortcut, useLatestRef, useLocale, useMedia, useMediaAttach, useMediaEvents, useMediaExtension, useMediaInstance, useMenuContext, useOptionalContainer, useOptionalMenuContext, useOptionalPlayer, usePlaybackRateOptions, usePlayer, usePlayerContext, usePopoverContext, useQualityOptions, useSelector, useSlider, useStore, useTapGesture, useTooltipContext, useTranslator };
 }
 import * as import__videojs_core_dom from "@videojs/core/dom";
 import * as import__videojs_media_dom from "@videojs/media/dom";
 //#endregion
-export { AirPlayButton, type AirPlayButtonProps, index_parts_d_exports as AlertDialog, type AudioTrackOption, type AudioTrackOptionsProps, type AudioTrackOptionsResult, AudioTrackRadioGroupLegacy as AudioTrackRadioGroup, BufferingIndicator, type BufferingIndicatorProps, CaptionsButton, type CaptionsButtonProps, type CaptionsOption, type CaptionsOptionsProps, type CaptionsOptionsResult, CaptionsRadioGroupLegacy as CaptionsRadioGroup, CastButton, type CastButtonProps, type Comparator, Container, type ContainerProps, index_parts_d_exports$1 as Controls, type ControlsContentProps, type ControlsGroupProps, type ControlsRootProps, type CreateI18nOptions, type CreateI18nResult, type CreatePlayerConfig, type CreatePlayerResult, DEFAULT_SEEK_STEP, index_parts_d_exports$2 as Dialog, type DialogContextValue, index_parts_d_exports$3 as ErrorDialog, type ErrorDialogContextValue, type FlatTranslations, FullscreenButton, type FullscreenButtonProps, Gesture, type GestureProps, type HTMLProps, Hotkey, type HotkeyProps, I18nContext, type I18nContextValue, I18nProvider, type I18nProviderProps, type IndicatorStatus, type InputAction, type InputIndicatorLabels, LiveButton, type LiveButtonProps, type Locale, MediaGesture, type MediaGestureProps, MediaHotkey, type MediaHotkeyProps, index_parts_d_exports$4 as Menu, type MenuContextValue, MuteButton, type MuteButtonProps, type NodeListLike, PiPButton, type PiPButtonProps, PlayButton, type PlayButtonProps, PlaybackRateButton, type PlaybackRateButtonProps, type PlaybackRateOption, type PlaybackRateOptionsProps, type PlaybackRateOptionsResult, PlaybackRateRadioGroupLegacy as PlaybackRateRadioGroup, type PlayerContextValue, type PlayerProps, index_parts_d_exports$5 as Popover, type PopoverContextValue, Poster, type PosterProps, type QualityOption, type QualityOptionsProps, type QualityOptionsResult, QualityRadioGroupLegacy as QualityRadioGroup, type RenderFunction, type RenderProp, SeekButton, type SeekButtonProps, index_parts_d_exports$6 as SeekIndicator, type SeekIndicatorRootProps, type SeekIndicatorValueProps, type Selector, index_parts_d_exports$7 as Slider, type SliderBufferProps, type SliderFillProps, type SliderRootProps, type SliderThumbProps, type SliderThumbnailProps, type SliderTrackProps, type SliderValueProps, StatusAnnouncer, type StatusAnnouncerProps, index_parts_d_exports$8 as StatusIndicator, type StatusIndicatorRootProps, type StatusIndicatorValueProps, Text, type TextProps, Thumbnail, type ThumbnailProps, index_parts_d_exports$9 as Time, index_parts_d_exports$10 as TimeSlider, type TimeSliderChapterState, type TimeSliderChapterTitleProps, type TimeSliderChapterTitleState, type TimeSliderChaptersProps, type TimeSliderChaptersState, Title, type TitleProps, index_parts_d_exports$11 as Tooltip, type TooltipContent, type TooltipContextValue, type TranslationParams, type Translations, type Translator, type UIComponentProps, type UseDoubleTapGestureOptions, type UseHotkeyOptions, type UseTapGestureOptions, index_parts_d_exports$12 as VolumeIndicator, type VolumeIndicatorFillProps, type VolumeIndicatorRootProps, type VolumeIndicatorValueProps, index_parts_d_exports$13 as VolumePopover, index_parts_d_exports$14 as VolumeSlider, composeRefs, createI18n, createPlayer, createSelector, createTranslator, findLocaleKeys, getI18nTranslations, hasMetadata, hasRegisteredLocale, index_d_exports, isMediaAudioTrackCapable, isMediaBufferCapable, isMediaErrorCapable, isMediaLiveCapable, isMediaPauseCapable, isMediaPlaybackRateCapable, isMediaRemotePlaybackCapable, isMediaSeekCapable, isMediaSourceCapable, isMediaStreamTypeCapable, isMediaTextTrackCapable, isMediaVideoDimensionsCapable, isMediaVideoRenditionCapable, isMediaVolumeCapable, isQuerySelectorAllCapable, mergeProps, onI18nRegistryChange, registerI18n, renderElement, shallowEqual, useAttachMedia, useAudioTrackOptions, useButton, useCaptionsOptions, useComposedRefs, useContainer, useContainerAttach, useDestroy, useDialogContext, useDoubleTapGesture, useErrorDialogContext, useHotkey, useHotkeyShortcut, useLatestRef, useLocale, useMedia, useMediaAttach, useMediaExtension, useMediaInstance, useMenuContext, useOptionalContainer, useOptionalMenuContext, useOptionalPlayer, usePlaybackRateOptions, usePlayer, usePlayerContext, usePopoverContext, useQualityOptions, useSelector, useSlider, useStore, useTapGesture, useTooltipContext, useTranslator };
+export { AirPlayButton, type AirPlayButtonProps, index_parts_d_exports as AlertDialog, type AudioTrackOption, type AudioTrackOptionsProps, type AudioTrackOptionsResult, AudioTrackRadioGroupLegacy as AudioTrackRadioGroup, BufferingIndicator, type BufferingIndicatorProps, CaptionsButton, type CaptionsButtonProps, type CaptionsOption, type CaptionsOptionsProps, type CaptionsOptionsResult, CaptionsRadioGroupLegacy as CaptionsRadioGroup, CastButton, type CastButtonProps, type Comparator, Container, type ContainerProps, index_parts_d_exports$1 as Controls, type ControlsContentProps, type ControlsGroupProps, type ControlsRootProps, type CreateI18nOptions, type CreateI18nResult, type CreatePlayerConfig, type CreatePlayerResult, DEFAULT_SEEK_STEP, index_parts_d_exports$2 as Dialog, type DialogContextValue, index_parts_d_exports$3 as ErrorDialog, type ErrorDialogContextValue, type FlatTranslations, FullscreenButton, type FullscreenButtonProps, Gesture, type GestureProps, type HTMLProps, Hotkey, type HotkeyProps, I18nContext, type I18nContextValue, I18nProvider, type I18nProviderProps, type IndicatorStatus, type InputAction, type InputIndicatorLabels, LiveButton, type LiveButtonProps, type Locale, type MediaEventHandler, type MediaEventPropName, type MediaEventProps, MediaGesture, type MediaGestureProps, MediaHotkey, type MediaHotkeyProps, index_parts_d_exports$4 as Menu, type MenuContextValue, MuteButton, type MuteButtonProps, type NodeListLike, PiPButton, type PiPButtonProps, PlayButton, type PlayButtonProps, PlaybackRateButton, type PlaybackRateButtonProps, type PlaybackRateOption, type PlaybackRateOptionsProps, type PlaybackRateOptionsResult, PlaybackRateRadioGroupLegacy as PlaybackRateRadioGroup, type PlayerContextValue, type PlayerProps, index_parts_d_exports$5 as Popover, type PopoverContextValue, index_parts_d_exports$6 as Poster, type PosterImageProps, type PosterRootProps, type QualityOption, type QualityOptionsProps, type QualityOptionsResult, QualityRadioGroupLegacy as QualityRadioGroup, type RenderFunction, type RenderProp, SeekButton, type SeekButtonProps, index_parts_d_exports$7 as SeekIndicator, type SeekIndicatorRootProps, type SeekIndicatorValueProps, type Selector, index_parts_d_exports$8 as Slider, type SliderBufferProps, type SliderFillProps, type SliderRootProps, type SliderThumbProps, type SliderThumbnailRootProps, type SliderTrackProps, type SliderValueProps, StatusAnnouncer, type StatusAnnouncerProps, index_parts_d_exports$9 as StatusIndicator, type StatusIndicatorRootProps, type StatusIndicatorValueProps, Text, type TextProps, index_parts_d_exports$10 as Thumbnail, type ThumbnailImageProps, type ThumbnailRootProps, index_parts_d_exports$11 as Time, index_parts_d_exports$12 as TimeSlider, type TimeSliderChapterState, type TimeSliderChapterTitleProps, type TimeSliderChapterTitleState, type TimeSliderChaptersProps, type TimeSliderChaptersState, Title, type TitleProps, index_parts_d_exports$13 as Tooltip, type TooltipContent, type TooltipContextValue, type TranslationParams, type Translations, type Translator, type UIComponentProps, type UseDoubleTapGestureOptions, type UseHotkeyOptions, type UseTapGestureOptions, index_parts_d_exports$14 as VolumeIndicator, type VolumeIndicatorFillProps, type VolumeIndicatorRootProps, type VolumeIndicatorValueProps, index_parts_d_exports$15 as VolumePopover, index_parts_d_exports$16 as VolumeSlider, composeRefs, createI18n, createPlayer, createSelector, createTranslator, findLocaleKeys, getI18nTranslations, hasMetadata, hasRegisteredLocale, index_d_exports, isMediaAudioTrackCapable, isMediaBufferCapable, isMediaErrorCapable, isMediaLiveCapable, isMediaPauseCapable, isMediaPlaybackRateCapable, isMediaRemotePlaybackCapable, isMediaSeekCapable, isMediaSourceCapable, isMediaStreamTypeCapable, isMediaTextTrackCapable, isMediaVideoDimensionsCapable, isMediaVideoRenditionCapable, isMediaVolumeCapable, isQuerySelectorAllCapable, mergeProps, onI18nRegistryChange, registerI18n, renderElement, shallowEqual, useAttachMedia, useAudioTrackOptions, useButton, useCaptionsOptions, useComposedRefs, useContainer, useContainerAttach, useDestroy, useDialogContext, useDoubleTapGesture, useErrorDialogContext, useHotkey, useHotkeyShortcut, useLatestRef, useLocale, useMedia, useMediaAttach, useMediaEvents, useMediaExtension, useMediaInstance, useMenuContext, useOptionalContainer, useOptionalMenuContext, useOptionalPlayer, usePlaybackRateOptions, usePlayer, usePlayerContext, usePopoverContext, useQualityOptions, useSelector, useSlider, useStore, useTapGesture, useTooltipContext, useTranslator };
 //# sourceMappingURL=index.d.ts.map

package/dist/dev/index.js

@@ -16,54 +16,55 @@ import { useButton } from "./ui/hooks/use-button.js";
 import { useHotkeyShortcut } from "./ui/hotkey/use-hotkey-shortcut.js";
 import { useMenuContext, useOptionalMenuContext } from "./ui/menu/context.js";
 import { useTooltipContext } from "./ui/tooltip/context.js";
-import { AirPlayButton } from "./ui/airplay-button/airplay-button.js";
+import { AirPlayButton } from "./ui/airplay-button/component.js";
 import { useDialogContext } from "./ui/dialog/context.js";
 import { index_parts_exports as index_parts_exports$2 } from "./ui/dialog/index.parts.js";
 import { index_parts_exports } from "./ui/alert-dialog/index.parts.js";
 import { useAudioTrackOptions } from "./ui/audio-track/use-audio-track-options.js";
-import { AudioTrackRadioGroupLegacy } from "./ui/audio-track-radio-group/audio-track-radio-group.js";
-import { BufferingIndicator } from "./ui/buffering-indicator/buffering-indicator.js";
-import { CaptionsButton } from "./ui/captions-button/captions-button.js";
+import { AudioTrackRadioGroupLegacy } from "./ui/audio-track-radio-group/component.js";
+import { BufferingIndicator } from "./ui/buffering-indicator/component.js";
+import { CaptionsButton } from "./ui/captions-button/component.js";
 import { useCaptionsOptions } from "./ui/captions-radio-group/use-captions-options.js";
-import { CaptionsRadioGroupLegacy } from "./ui/captions-radio-group/captions-radio-group.js";
-import { CastButton } from "./ui/cast-button/cast-button.js";
+import { CaptionsRadioGroupLegacy } from "./ui/captions-radio-group/component.js";
+import { CastButton } from "./ui/cast-button/component.js";
 import { index_parts_exports as index_parts_exports$1 } from "./ui/controls/index.parts.js";
 import { useErrorDialogContext } from "./ui/error-dialog/context.js";
 import { index_parts_exports as index_parts_exports$3 } from "./ui/error-dialog/index.parts.js";
-import { FullscreenButton } from "./ui/fullscreen-button/fullscreen-button.js";
-import { Gesture, MediaGesture } from "./ui/gesture/gesture.js";
+import { FullscreenButton } from "./ui/fullscreen-button/component.js";
+import { Gesture, MediaGesture } from "./ui/gesture/component.js";
 import { useDoubleTapGesture } from "./ui/gesture/use-doubletap-gesture.js";
 import { useTapGesture } from "./ui/gesture/use-tap-gesture.js";
 import { useSlider } from "./ui/hooks/use-slider.js";
-import { Hotkey, MediaHotkey } from "./ui/hotkey/hotkey.js";
+import { Hotkey, MediaHotkey } from "./ui/hotkey/component.js";
 import { useHotkey } from "./ui/hotkey/use-hotkey.js";
-import { LiveButton } from "./ui/live-button/live-button.js";
+import { LiveButton } from "./ui/live-button/component.js";
 import { index_parts_exports as index_parts_exports$4 } from "./ui/menu/index.parts.js";
-import { MuteButton } from "./ui/mute-button/mute-button.js";
-import { PiPButton } from "./ui/pip-button/pip-button.js";
-import { PlayButton } from "./ui/play-button/play-button.js";
+import { MuteButton } from "./ui/mute-button/component.js";
+import { PiPButton } from "./ui/pip-button/component.js";
+import { PlayButton } from "./ui/play-button/component.js";
 import { usePlaybackRateOptions } from "./ui/playback-rate/use-playback-rate-options.js";
-import { PlaybackRateButton } from "./ui/playback-rate-button/playback-rate-button.js";
-import { PlaybackRateRadioGroupLegacy } from "./ui/playback-rate-radio-group/playback-rate-radio-group.js";
+import { PlaybackRateButton } from "./ui/playback-rate-button/component.js";
+import { PlaybackRateRadioGroupLegacy } from "./ui/playback-rate-radio-group/component.js";
 import { usePopoverContext } from "./ui/popover/context.js";
 import { index_parts_exports as index_parts_exports$5 } from "./ui/popover/index.parts.js";
-import { Poster } from "./ui/poster/poster.js";
+import { index_parts_exports as index_parts_exports$6 } from "./ui/poster/index.parts.js";
 import { useQualityOptions } from "./ui/quality/use-quality-options.js";
-import { QualityRadioGroupLegacy } from "./ui/quality-radio-group/quality-radio-group.js";
-import { SeekButton } from "./ui/seek-button/seek-button.js";
-import { index_parts_exports as index_parts_exports$6 } from "./ui/seek-indicator/index.parts.js";
-import { Thumbnail } from "./ui/thumbnail/thumbnail.js";
-import { index_parts_exports as index_parts_exports$7 } from "./ui/slider/index.parts.js";
-import { StatusAnnouncer } from "./ui/status-announcer/status-announcer.js";
-import { index_parts_exports as index_parts_exports$8 } from "./ui/status-indicator/index.parts.js";
-import { index_parts_exports as index_parts_exports$9 } from "./ui/time/index.parts.js";
-import { index_parts_exports as index_parts_exports$10 } from "./ui/time-slider/index.parts.js";
-import { Title } from "./ui/title/title.js";
-import { index_parts_exports as index_parts_exports$11 } from "./ui/tooltip/index.parts.js";
-import { index_parts_exports as index_parts_exports$12 } from "./ui/volume-indicator/index.parts.js";
-import { index_parts_exports as index_parts_exports$13 } from "./ui/volume-popover/index.parts.js";
-import { index_parts_exports as index_parts_exports$14 } from "./ui/volume-slider/index.parts.js";
+import { QualityRadioGroupLegacy } from "./ui/quality-radio-group/component.js";
+import { SeekButton } from "./ui/seek-button/component.js";
+import { index_parts_exports as index_parts_exports$7 } from "./ui/seek-indicator/index.parts.js";
+import { index_parts_exports as index_parts_exports$10 } from "./ui/thumbnail/index.parts.js";
+import { index_parts_exports as index_parts_exports$8 } from "./ui/slider/index.parts.js";
+import { StatusAnnouncer } from "./ui/status-announcer/component.js";
+import { index_parts_exports as index_parts_exports$9 } from "./ui/status-indicator/index.parts.js";
+import { index_parts_exports as index_parts_exports$11 } from "./ui/time/index.parts.js";
+import { index_parts_exports as index_parts_exports$12 } from "./ui/time-slider/index.parts.js";
+import { Title } from "./ui/title/component.js";
+import { index_parts_exports as index_parts_exports$13 } from "./ui/tooltip/index.parts.js";
+import { index_parts_exports as index_parts_exports$14 } from "./ui/volume-indicator/index.parts.js";
+import { index_parts_exports as index_parts_exports$15 } from "./ui/volume-popover/index.parts.js";
+import { index_parts_exports as index_parts_exports$16 } from "./ui/volume-slider/index.parts.js";
 import { useAttachMedia } from "./utils/use-attach-media.js";
+import { useMediaEvents } from "./utils/use-media-events.js";
 import { useMediaExtension } from "./utils/use-media-extension.js";
 import { useMediaInstance } from "./utils/use-media-instance.js";
 import { hasMetadata, isMediaAudioTrackCapable, isMediaBufferCapable, isMediaErrorCapable, isMediaLiveCapable, isMediaPauseCapable, isMediaPlaybackRateCapable, isMediaRemotePlaybackCapable, isMediaSeekCapable, isMediaSourceCapable, isMediaStreamTypeCapable, isMediaTextTrackCapable, isMediaVideoDimensionsCapable, isMediaVideoRenditionCapable, isMediaVolumeCapable, isQuerySelectorAllCapable } from "@videojs/media";
@@ -71,4 +72,4 @@ import { createSelector, shallowEqual } from "@videojs/store";
 import { useSelector, useStore } from "@videojs/store/react";
 export * from "@videojs/core/dom";
 export * from "@videojs/media/dom";
-export { AirPlayButton, index_parts_exports as AlertDialog, AudioTrackRadioGroupLegacy as AudioTrackRadioGroup, BufferingIndicator, CaptionsButton, CaptionsRadioGroupLegacy as CaptionsRadioGroup, CastButton, Container, index_parts_exports$1 as Controls, DEFAULT_SEEK_STEP, index_parts_exports$2 as Dialog, index_parts_exports$3 as ErrorDialog, FullscreenButton, Gesture, Hotkey, I18nContext, I18nProvider, LiveButton, MediaGesture, MediaHotkey, index_parts_exports$4 as Menu, MuteButton, PiPButton, PlayButton, PlaybackRateButton, PlaybackRateRadioGroupLegacy as PlaybackRateRadioGroup, index_parts_exports$5 as Popover, Poster, QualityRadioGroupLegacy as QualityRadioGroup, SeekButton, index_parts_exports$6 as SeekIndicator, index_parts_exports$7 as Slider, StatusAnnouncer, index_parts_exports$8 as StatusIndicator, Text, Thumbnail, index_parts_exports$9 as Time, index_parts_exports$10 as TimeSlider, Title, index_parts_exports$11 as Tooltip, index_parts_exports$12 as VolumeIndicator, index_parts_exports$13 as VolumePopover, index_parts_exports$14 as VolumeSlider, composeRefs, createI18n, createPlayer, createSelector, createTranslator, findLocaleKeys, getI18nTranslations, hasMetadata, hasRegisteredLocale, isMediaAudioTrackCapable, isMediaBufferCapable, isMediaErrorCapable, isMediaLiveCapable, isMediaPauseCapable, isMediaPlaybackRateCapable, isMediaRemotePlaybackCapable, isMediaSeekCapable, isMediaSourceCapable, isMediaStreamTypeCapable, isMediaTextTrackCapable, isMediaVideoDimensionsCapable, isMediaVideoRenditionCapable, isMediaVolumeCapable, isQuerySelectorAllCapable, mergeProps, onI18nRegistryChange, registerI18n, renderElement, shallowEqual, useAttachMedia, useAudioTrackOptions, useButton, useCaptionsOptions, useComposedRefs, useContainer, useContainerAttach, useDestroy, useDialogContext, useDoubleTapGesture, useErrorDialogContext, useHotkey, useHotkeyShortcut, useLatestRef, useLocale, useMedia, useMediaAttach, useMediaExtension, useMediaInstance, useMenuContext, useOptionalContainer, useOptionalMenuContext, useOptionalPlayer, usePlaybackRateOptions, usePlayer, usePlayerContext, usePopoverContext, useQualityOptions, useSelector, useSlider, useStore, useTapGesture, useTooltipContext, useTranslator };
+export { AirPlayButton, index_parts_exports as AlertDialog, AudioTrackRadioGroupLegacy as AudioTrackRadioGroup, BufferingIndicator, CaptionsButton, CaptionsRadioGroupLegacy as CaptionsRadioGroup, CastButton, Container, index_parts_exports$1 as Controls, DEFAULT_SEEK_STEP, index_parts_exports$2 as Dialog, index_parts_exports$3 as ErrorDialog, FullscreenButton, Gesture, Hotkey, I18nContext, I18nProvider, LiveButton, MediaGesture, MediaHotkey, index_parts_exports$4 as Menu, MuteButton, PiPButton, PlayButton, PlaybackRateButton, PlaybackRateRadioGroupLegacy as PlaybackRateRadioGroup, index_parts_exports$5 as Popover, index_parts_exports$6 as Poster, QualityRadioGroupLegacy as QualityRadioGroup, SeekButton, index_parts_exports$7 as SeekIndicator, index_parts_exports$8 as Slider, StatusAnnouncer, index_parts_exports$9 as StatusIndicator, Text, index_parts_exports$10 as Thumbnail, index_parts_exports$11 as Time, index_parts_exports$12 as TimeSlider, Title, index_parts_exports$13 as Tooltip, index_parts_exports$14 as VolumeIndicator, index_parts_exports$15 as VolumePopover, index_parts_exports$16 as VolumeSlider, composeRefs, createI18n, createPlayer, createSelector, createTranslator, findLocaleKeys, getI18nTranslations, hasMetadata, hasRegisteredLocale, isMediaAudioTrackCapable, isMediaBufferCapable, isMediaErrorCapable, isMediaLiveCapable, isMediaPauseCapable, isMediaPlaybackRateCapable, isMediaRemotePlaybackCapable, isMediaSeekCapable, isMediaSourceCapable, isMediaStreamTypeCapable, isMediaTextTrackCapable, isMediaVideoDimensionsCapable, isMediaVideoRenditionCapable, isMediaVolumeCapable, isQuerySelectorAllCapable, mergeProps, onI18nRegistryChange, registerI18n, renderElement, shallowEqual, useAttachMedia, useAudioTrackOptions, useButton, useCaptionsOptions, useComposedRefs, useContainer, useContainerAttach, useDestroy, useDialogContext, useDoubleTapGesture, useErrorDialogContext, useHotkey, useHotkeyShortcut, useLatestRef, useLocale, useMedia, useMediaAttach, useMediaEvents, useMediaExtension, useMediaInstance, useMenuContext, useOptionalContainer, useOptionalMenuContext, useOptionalPlayer, usePlaybackRateOptions, usePlayer, usePlayerContext, usePopoverContext, useQualityOptions, useSelector, useSlider, useStore, useTapGesture, useTooltipContext, useTranslator };