@primer/react-brand/esm/VideoPlayer/hooks/useVideo.js

Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.

import { useProvidedRefOrCreate as e } from "../../hooks/useRef.js";
import { useIsElementFullScreen as t } from "./useIsElementFullScreen.js";
import { createContext as n, forwardRef as r, useContext as i, useEffect as a, useReducer as o, useRef as s } from "react";
import { jsx as c } from "react/jsx-runtime";
//#region src/VideoPlayer/hooks/useVideo.tsx
var l = n(null), u = (e, t) => {
	let n = e.ref?.current;
	if (!n) return console.error("Video element is not available, ignoring action", t), e;
	switch (t.type) {
		case "play": return n.play(), {
			...e,
			isPlaying: !0
		};
		case "pause": return n.pause(), {
			...e,
			isPlaying: !1
		};
		case "mute": return n.volume = 0, {
			...e,
			isMuted: !0,
			volumeBeforeMute: e.volume
		};
		case "unmute": {
			let t = e.volumeBeforeMute ?? 1;
			return n.volume = t, {
				...e,
				isMuted: !1,
				volume: t
			};
		}
		case "setVolume": return n.volume = t.payload, {
			...e,
			volume: t.payload
		};
		case "enableCC": return {
			...e,
			ccEnabled: !0
		};
		case "disableCC": return {
			...e,
			ccEnabled: !1
		};
		case "setDuration": return {
			...e,
			duration: t.payload
		};
		default: return e;
	}
}, d = () => {
	let e = i(l);
	if (!e) throw Error("useVideo must be used within a VideoProvider. Did you forget to wrap your component in a <VideoProvider>?");
	return e;
}, f = r(({ children: n }, r) => {
	let i = e(r), d = s(null), [f, p] = o(u, {
		isPlaying: !1,
		isMuted: !1,
		volume: 1,
		volumeBeforeMute: null,
		ccEnabled: !1,
		ref: i,
		duration: 0
	}), [m, h] = t(d.current), g = {
		...f,
		isFullScreen: m,
		fullscreenRef: d,
		play: () => p({ type: "play" }),
		pause: () => p({ type: "pause" }),
		togglePlaying: () => p({ type: f.isPlaying ? "pause" : "play" }),
		mute: () => p({ type: "mute" }),
		unmute: () => p({ type: "unmute" }),
		toggleMute: () => p({ type: f.isMuted ? "unmute" : "mute" }),
		setVolume: (e) => {
			let t = typeof e == "function" ? e(f.volume) : e;
			p({
				type: "setVolume",
				payload: Math.max(0, Math.min(1, t))
			});
		},
		enableCC: () => {
			p({ type: "enableCC" });
		},
		disableCC: () => p({ type: "disableCC" }),
		toggleCC: () => p({ type: f.ccEnabled ? "disableCC" : "enableCC" }),
		enterFullScreen: () => h(!0),
		exitFullScreen: () => h(!1),
		toggleFullScreen: () => h((e) => !e),
		setDuration: (e) => p({
			type: "setDuration",
			payload: e
		}),
		seekToPercent: (e) => {
			let t = f.ref?.current;
			t && (t.currentTime = e / 100 * t.duration);
		},
		seek: (e) => {
			let t = f.ref?.current;
			t && (t.currentTime = typeof e == "function" ? e(t.currentTime) : e);
		}
	};
	return a(() => {
		let e = f.ref?.current;
		if (!e) return;
		let t = {
			play: () => {
				p({ type: "play" });
			},
			playing: () => {
				e.textTracks[0].mode = "hidden";
			},
			pause: () => {
				p({ type: "pause" });
			},
			ended: () => {
				e.currentTime = 0;
			},
			mute: () => {
				p({ type: "mute" });
			},
			unmute: () => {
				p({ type: "unmute" });
			},
			volumechange: () => {
				p({
					type: "setVolume",
					payload: e.volume
				});
			},
			loadedmetadata: () => {
				p({
					type: "setDuration",
					payload: e.duration
				});
			}
		};
		for (let [n, r] of Object.entries(t)) e.addEventListener(n, r);
		return () => {
			for (let [n, r] of Object.entries(t)) e.removeEventListener(n, r);
		};
	}, [f.ref]), /* @__PURE__ */ c(l.Provider, {
		value: g,
		children: n
	});
});
//#endregion
export { l as VideoContext, f as VideoProvider, d as useVideo };

//# sourceMappingURL=useVideo.js.map