@vplayer/react 0.3.0 → 0.4.0

package/dist/index.js

@@ -134,31 +134,31 @@ function S(e, t, n) {
 		complete: (r ? e.complete : n)?.bind(i)
 	};
 }
-var C = [], w = 0, { link: T, unlink: ee, propagate: E, checkDirty: te, shallowPropagate: D } = /* @__PURE__ */ x({
+var C = [], w = 0, { link: T, unlink: ee, propagate: E, checkDirty: te, shallowPropagate: ne } = /* @__PURE__ */ x({
 	update(e) {
 		return e._update();
 	},
 	notify(e) {
-		C[re++] = e, e.flags &= -3;
+		C[ie++] = e, e.flags &= -3;
 	},
 	unwatched(e) {
-		e.depsTail !== void 0 && (e.depsTail = void 0, e.flags = 17, ae(e));
+		e.depsTail !== void 0 && (e.depsTail = void 0, e.flags = 17, oe(e));
 	}
-}), ne = 0, re = 0, O, ie = 0;
-function ae(e) {
+}), re = 0, ie = 0, D, ae = 0;
+function oe(e) {
 	let t = e.depsTail, n = t === void 0 ? e.deps : t.nextDep;
 	for (; n !== void 0;) n = ee(n, e);
 }
-function oe() {
-	if (!(ie > 0)) {
-		for (; ne < re;) {
-			let e = C[ne];
-			C[ne++] = void 0, e.notify();
+function se() {
+	if (!(ae > 0)) {
+		for (; re < ie;) {
+			let e = C[re];
+			C[re++] = void 0, e.notify();
 		}
-		ne = 0, re = 0;
+		re = 0, ie = 0;
 	}
 }
-function se(e, t) {
+function ce(e, t) {
 	let n = typeof e == "function", r = e, i = {
 		_snapshot: n ? void 0 : e,
 		subs: void 0,
@@ -167,10 +167,10 @@ function se(e, t) {
 		depsTail: void 0,
 		flags: +!n,
 		get() {
-			return O !== void 0 && T(i, O, w), i._snapshot;
+			return D !== void 0 && T(i, D, w), i._snapshot;
 		},
 		subscribe(e) {
-			let t = S(e), n = { current: !1 }, r = ce(() => {
+			let t = S(e), n = { current: !1 }, r = le(() => {
 				i.get(), n.current ? t.next?.(i._snapshot) : n.current = !0;
 			});
 			return { unsubscribe: () => {
@@ -178,15 +178,15 @@ function se(e, t) {
 			} };
 		},
 		_update(e) {
-			let a = O, o = t?.compare ?? Object.is;
-			if (n) O = i, ++w, i.depsTail = void 0;
+			let a = D, o = t?.compare ?? Object.is;
+			if (n) D = i, ++w, i.depsTail = void 0;
 			else if (e === void 0) return !1;
 			n && (i.flags = 5);
 			try {
 				let t = i._snapshot, a = typeof e == "function" ? e(t) : e === void 0 && n ? r(t) : e;
 				return t === void 0 || !o(t, a) ? (i._snapshot = a, !0) : !1;
 			} finally {
-				O = a, n && (i.flags &= -5), ae(i);
+				D = a, n && (i.flags &= -5), oe(i);
 			}
 		}
 	};
@@ -195,25 +195,25 @@ function se(e, t) {
 		if (e & 16 || e & 32 && te(i.deps, i)) {
 			if (i._update()) {
 				let e = i.subs;
-				e !== void 0 && D(e);
+				e !== void 0 && ne(e);
 			}
 		} else e & 32 && (i.flags = e & -33);
-		return O !== void 0 && T(i, O, w), i._snapshot;
+		return D !== void 0 && T(i, D, w), i._snapshot;
 	}) : i.set = function(e) {
 		if (i._update(e)) {
 			let e = i.subs;
-			e !== void 0 && (E(e), D(e), oe());
+			e !== void 0 && (E(e), ne(e), se());
 		}
 	}, i;
 }
-function ce(e) {
+function le(e) {
 	let t = () => {
-		let t = O;
-		O = n, ++w, n.depsTail = void 0, n.flags = 6;
+		let t = D;
+		D = n, ++w, n.depsTail = void 0, n.flags = 6;
 		try {
 			return e();
 		} finally {
-			O = t, n.flags &= -5, ae(n);
+			D = t, n.flags &= -5, oe(n);
 		}
 	}, n = {
 		deps: void 0,
@@ -226,16 +226,16 @@ function ce(e) {
 			e & 16 || e & 32 && te(this.deps, this) ? t() : this.flags = 2;
 		},
 		stop() {
-			this.flags = 0, this.depsTail = void 0, ae(this);
+			this.flags = 0, this.depsTail = void 0, oe(this);
 		}
 	};
 	return t(), n;
 }
 //#endregion
 //#region ../../node_modules/@tanstack/store/dist/store.js
-var le = class {
+var ue = class {
 	constructor(e, t) {
-		this.atom = se(e), this.get = this.get.bind(this), this.setState = this.setState.bind(this), this.subscribe = this.subscribe.bind(this), t && (this.actions = t(this));
+		this.atom = ce(e), this.get = this.get.bind(this), this.setState = this.setState.bind(this), this.subscribe = this.subscribe.bind(this), t && (this.actions = t(this));
 	}
 	setState(e) {
 		this.atom.set(e);
@@ -249,10 +249,10 @@ var le = class {
 	subscribe(e) {
 		return this.atom.subscribe(S(e));
 	}
-}, ue = /* @__PURE__ */ b(((t, n) => {
+}, de = /* @__PURE__ */ b(((t, n) => {
 	n.exports = { ...e };
-})), de = /* @__PURE__ */ b(((e) => {
-	var t = ue();
+})), fe = /* @__PURE__ */ b(((e) => {
+	var t = de();
 	function n(e, t) {
 		return e === t && (e !== 0 || 1 / e == 1 / t) || e !== e && t !== t;
 	}
@@ -289,7 +289,7 @@ var le = class {
 	}
 	var d = typeof window > "u" || window.document === void 0 || window.document.createElement === void 0 ? u : c;
 	e.useSyncExternalStore = t.useSyncExternalStore === void 0 ? d : t.useSyncExternalStore;
-})), fe = /* @__PURE__ */ b(((e) => {
+})), pe = /* @__PURE__ */ b(((e) => {
 	process.env.NODE_ENV !== "production" && (function() {
 		function t(e, t) {
 			return e === t && (e !== 0 || 1 / e == 1 / t) || e !== e && t !== t;
@@ -332,13 +332,13 @@ var le = class {
 			return t();
 		}
 		typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
-		var a = ue(), o = typeof Object.is == "function" ? Object.is : t, s = a.useState, c = a.useEffect, l = a.useLayoutEffect, u = a.useDebugValue, d = !1, f = !1, p = typeof window > "u" || window.document === void 0 || window.document.createElement === void 0 ? i : n;
+		var a = de(), o = typeof Object.is == "function" ? Object.is : t, s = a.useState, c = a.useEffect, l = a.useLayoutEffect, u = a.useDebugValue, d = !1, f = !1, p = typeof window > "u" || window.document === void 0 || window.document.createElement === void 0 ? i : n;
 		e.useSyncExternalStore = a.useSyncExternalStore === void 0 ? p : a.useSyncExternalStore, typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
 	})();
-})), pe = /* @__PURE__ */ b(((e, t) => {
-	t.exports = process.env.NODE_ENV === "production" ? de() : fe();
+})), O = /* @__PURE__ */ b(((e, t) => {
+	t.exports = process.env.NODE_ENV === "production" ? fe() : pe();
 })), k = /* @__PURE__ */ b(((e) => {
-	var t = ue(), n = pe();
+	var t = de(), n = O();
 	function r(e, t) {
 		return e === t && (e !== 0 || 1 / e == 1 / t) || e !== e && t !== t;
 	}
@@ -388,7 +388,7 @@ var le = class {
 			return e === t && (e !== 0 || 1 / e == 1 / t) || e !== e && t !== t;
 		}
 		typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
-		var n = ue(), r = pe(), i = typeof Object.is == "function" ? Object.is : t, a = r.useSyncExternalStore, o = n.useRef, s = n.useEffect, c = n.useMemo, l = n.useDebugValue;
+		var n = de(), r = O(), i = typeof Object.is == "function" ? Object.is : t, a = r.useSyncExternalStore, o = n.useRef, s = n.useEffect, c = n.useMemo, l = n.useDebugValue;
 		e.useSyncExternalStoreWithSelector = function(e, t, n, r, u) {
 			var d = o(null);
 			if (d.current === null) {
@@ -645,70 +645,72 @@ function Ne(e, t, n) {
 	} catch {}
 }
 function Pe() {
-	let e = null, t, n, r = !1, i = NaN, a = NaN, o = NaN;
-	function s() {
-		let r = Me();
-		r && e && r.metadata === e && (r.metadata = null), e = null, t = void 0, n = void 0;
+	let e = null, t, n, r, i, a = !1, o = NaN, s = NaN, c = NaN;
+	function l() {
+		let a = Me();
+		a && e && a.metadata === e && (a.metadata = null), e = null, t = void 0, n = void 0, r = void 0, i = void 0;
 	}
-	function c(e) {
+	function u(e) {
 		let t = Me();
-		!t || r || (Ne(t, "play", () => e.play()), Ne(t, "pause", () => e.pause()), Ne(t, "seekbackward", (t) => {
+		!t || a || (Ne(t, "play", () => e.play()), Ne(t, "pause", () => e.pause()), Ne(t, "seekbackward", (t) => {
 			e.skip(-(t.seekOffset ?? ke));
 		}), Ne(t, "seekforward", (t) => {
 			e.skip(t.seekOffset ?? ke);
 		}), Ne(t, "seekto", (t) => {
 			typeof t.seekTime == "number" && e.seek(t.seekTime);
-		}), r = !0);
-	}
-	function l(r, i) {
-		let a = Me();
-		if (!a || typeof MediaMetadata > "u") return;
-		let o = r?.trim() || void 0;
-		if (!o) {
-			s();
+		}), a = !0);
+	}
+	function d(a, o, s) {
+		let c = Me();
+		if (!c || typeof MediaMetadata > "u") return;
+		let u = a?.trim() || void 0, d = o?.artwork ?? s, f = o?.artist?.trim() || void 0, p = o?.album?.trim() || void 0;
+		if (!u) {
+			l();
 			return;
 		}
-		if (e && a.metadata === e && t === o && n === i) return;
-		let c = new MediaMetadata({
-			title: o,
-			artwork: i ? [{ src: i }] : []
+		if (e && c.metadata === e && t === u && n === d && r === f && i === p) return;
+		let m = new MediaMetadata({
+			title: u,
+			...f ? { artist: f } : {},
+			...p ? { album: p } : {},
+			artwork: d ? [{ src: d }] : []
 		});
-		a.metadata = c, e = c, t = o, n = i;
+		c.metadata = m, e = m, t = u, n = d, r = f, i = p;
 	}
-	function u(e) {
+	function f(e) {
 		let t = Me();
 		t && (t.playbackState = e);
 	}
-	function d(e, t, n, r = !1) {
-		let s = Me();
-		if (!(!s || typeof s.setPositionState != "function") && !(!Oe(e) || !Number.isFinite(t) || t < 0) && !(!r && Number.isFinite(i) && Math.abs(t - i) < Ae && e === a && n === o)) try {
-			s.setPositionState({
+	function p(e, t, n, r = !1) {
+		let i = Me();
+		if (!(!i || typeof i.setPositionState != "function") && !(!Oe(e) || !Number.isFinite(t) || t < 0) && !(!r && Number.isFinite(o) && Math.abs(t - o) < Ae && e === s && n === c)) try {
+			i.setPositionState({
 				duration: e,
 				playbackRate: n,
 				position: Math.min(t, e)
-			}), i = t, a = e, o = n;
+			}), o = t, s = e, c = n;
 		} catch {}
 	}
-	function f() {
+	function m() {
 		let e = Me();
 		if (e) {
-			if (r) {
+			if (a) {
 				for (let t of je) Ne(e, t, null);
-				r = !1;
+				a = !1;
 			}
 			e.playbackState = "none";
 		}
-		s(), i = NaN, a = NaN, o = NaN;
+		l(), o = NaN, s = NaN, c = NaN;
 	}
 	return {
-		setup: c,
-		syncMetadata: l,
-		setPlaybackState: u,
-		syncPosition: d,
+		setup: u,
+		syncMetadata: d,
+		setPlaybackState: f,
+		syncPosition: p,
 		get hasMetadata() {
 			return e !== null;
 		},
-		teardown: f
+		teardown: m
 	};
 }
 var Fe = "vplayer", Ie = class {
@@ -1202,7 +1204,7 @@ function st(e, t) {
 	return null;
 }
 function ct() {
-	return new le(lt());
+	return new ue(lt());
 }
 function lt() {
 	return {
@@ -1320,7 +1322,7 @@ function bt(e) {
 			T = !1, te();
 		}));
 	}
-	function D(e, t) {
+	function ne(e, t) {
 		let n = w.at(-1);
 		n?.kind === "save" && n.target.generation === e.generation ? n.progress = t : w.push({
 			kind: "save",
@@ -1328,28 +1330,28 @@ function bt(e) {
 			progress: t
 		}), te();
 	}
-	function ne(e) {
+	function re(e) {
 		w.push({
 			kind: "clear",
 			target: e
 		}), te();
 	}
-	function re(e = E, n = u) {
-		!n || n.ended || t.state.resumeState.status === "prompt" || !Number.isFinite(n.currentTime) || n.currentTime <= 3 || !Oe(n.duration) || (f = Date.now(), p = n.currentTime, D(e, {
+	function ie(e = E, n = u) {
+		!n || n.ended || t.state.resumeState.status === "prompt" || !Number.isFinite(n.currentTime) || n.currentTime <= 3 || !Oe(n.duration) || (f = Date.now(), p = n.currentTime, ne(e, {
 			time: n.currentTime,
 			duration: n.duration
 		}));
 	}
-	function O(e) {
-		!t.state.isPlaying || Date.now() - f < dt || Number.isFinite(p) && Math.abs(e.currentTime - p) < ft || re(E, e);
+	function D(e) {
+		!t.state.isPlaying || Date.now() - f < dt || Number.isFinite(p) && Math.abs(e.currentTime - p) < ft || ie(E, e);
 	}
-	function ie() {
+	function ae() {
 		x++, E = ee(n), S = !1, f = 0, p = NaN, t.setState((e) => ({
 			...e,
 			resumeState: { status: "idle" }
 		}));
 	}
-	function ae(e) {
+	function oe(e) {
 		if (S || !Oe(e.duration)) return;
 		S = !0;
 		let n = E, r = e.duration;
@@ -1380,7 +1382,7 @@ function bt(e) {
 			})), console.warn("[vplayer] playback progress load failed:", r);
 		});
 	}
-	function oe(e) {
+	function se(e) {
 		t.setState((t) => {
 			let n = new Map(t.subtitleTracks.map((e) => [e.id, e]));
 			for (let t of e) {
@@ -1393,7 +1395,7 @@ function bt(e) {
 			};
 		});
 	}
-	function se(e) {
+	function ce(e) {
 		_?.abort();
 		let n = new AbortController();
 		_ = n, t.setState((t) => ({
@@ -1418,7 +1420,7 @@ function bt(e) {
 			}));
 		});
 	}
-	function ce() {
+	function le() {
 		let e = (n.subtitleProviders ?? []).map(({ id: e, label: t }) => ({
 			id: e,
 			label: t
@@ -1431,7 +1433,7 @@ function bt(e) {
 			subtitleSearchError: null
 		}));
 	}
-	function le(e = {}) {
+	function ue(e = {}) {
 		v?.abort();
 		let r = n.subtitleProviders ?? [], i = e.providerId ? r.filter((t) => t.id === e.providerId) : r;
 		if (i.length === 0) {
@@ -1471,7 +1473,7 @@ function bt(e) {
 			}));
 		});
 	}
-	function ue(e) {
+	function de(e) {
 		_?.abort();
 		let r = (n.subtitleProviders ?? []).find((t) => t.id === e.providerId);
 		if (!r) {
@@ -1499,7 +1501,7 @@ function bt(e) {
 					...n.content === void 0 ? { src: n.src } : { content: n.content }
 				}), o = await tt(a, i.signal);
 				if (i.signal.aborted) return;
-				oe([a]), t.setState((e) => ({
+				se([a]), t.setState((e) => ({
 					...e,
 					activeSubtitle: a,
 					subtitleCues: o,
@@ -1517,64 +1519,61 @@ function bt(e) {
 			}
 		})();
 	}
-	n.subtitles?.length && oe(n.subtitles), ce();
-	function de() {
-		return n.mediaSessionArtwork ?? n.poster;
-	}
+	n.subtitles?.length && se(n.subtitles), le();
 	function fe() {
 		o.register({
 			key: "Space",
 			description: "Toggle play/pause",
 			handler: (e) => {
-				e.preventDefault(), k.togglePlay();
+				e.preventDefault(), O.togglePlay();
 			}
 		}), o.register({
 			key: "KeyK",
 			description: "Toggle play/pause",
 			handler: (e) => {
-				e.preventDefault(), k.togglePlay();
+				e.preventDefault(), O.togglePlay();
 			}
 		}), o.register({
 			key: "KeyL",
 			description: "Toggle loop",
 			handler: (e) => {
-				e.preventDefault(), k.toggleLoop();
+				e.preventDefault(), O.toggleLoop();
 			}
 		}), o.register({
 			key: "KeyI",
 			description: "Toggle info panel",
 			handler: (e) => {
-				e.preventDefault(), k.toggleInfoPanel();
+				e.preventDefault(), O.toggleInfoPanel();
 			}
 		}), o.register({
 			key: "KeyF",
 			description: "Toggle fullscreen",
 			handler: (e) => {
-				e.preventDefault(), k.toggleFullscreen();
+				e.preventDefault(), O.toggleFullscreen();
 			}
 		}), o.register({
 			key: "KeyA",
 			description: "Cycle aspect ratio",
 			handler: (e) => {
-				e.preventDefault(), k.cycleAspectRatio();
+				e.preventDefault(), O.cycleAspectRatio();
 			}
 		}), o.register({
 			key: "KeyM",
 			description: "Toggle mute",
 			handler: (e) => {
-				e.preventDefault(), k.toggleMute();
+				e.preventDefault(), O.toggleMute();
 			}
 		}), o.register({
 			key: "ArrowLeft",
 			description: "Seek backward 5s",
 			handler: (e) => {
-				e.preventDefault(), k.skip(-5);
+				e.preventDefault(), O.skip(-5);
 			}
 		}), o.register({
 			key: "ArrowRight",
 			description: "Seek forward 5s",
 			handler: (e) => {
-				e.preventDefault(), k.skip(5);
+				e.preventDefault(), O.skip(5);
 			}
 		}), o.register({
 			key: "ArrowUp",
@@ -1582,7 +1581,7 @@ function bt(e) {
 			handler: (e) => {
 				e.preventDefault();
 				let n = Math.min(1, t.state.volume + .1);
-				k.setVolume(n);
+				O.setVolume(n);
 			}
 		}), o.register({
 			key: "ArrowDown",
@@ -1590,7 +1589,7 @@ function bt(e) {
 			handler: (e) => {
 				e.preventDefault();
 				let n = Math.max(0, t.state.volume - .1);
-				k.setVolume(n);
+				O.setVolume(n);
 			}
 		});
 	}
@@ -1604,7 +1603,7 @@ function bt(e) {
 			capabilities: De(u?.element ?? void 0, l)
 		}));
 	}
-	let k = {
+	let O = {
 		play: () => {
 			u?.play();
 		},
@@ -1625,7 +1624,7 @@ function bt(e) {
 			t.setState((e) => ({
 				...e,
 				resumeState: { status: "idle" }
-			})), u?.seek(0), ne(e);
+			})), u?.seek(0), re(e);
 		},
 		dismissSavedProgress: () => {
 			t.setState((e) => ({
@@ -1686,20 +1685,20 @@ function bt(e) {
 				}));
 				return;
 			}
-			se(e);
+			ce(e);
 		},
 		addSubtitleTrack: (e) => {
 			let t = yt(e);
-			oe([t]), se(t);
+			se([t]), ce(t);
 		},
 		removeSubtitleTrack: (e) => {
-			t.state.activeSubtitle?.id === e && k.setActiveSubtitle(null), t.setState((t) => ({
+			t.state.activeSubtitle?.id === e && O.setActiveSubtitle(null), t.setState((t) => ({
 				...t,
 				subtitleTracks: t.subtitleTracks.filter((t) => t.id !== e)
 			}));
 		},
-		searchSubtitles: le,
-		selectSubtitleResult: ue,
+		searchSubtitles: ue,
+		selectSubtitleResult: de,
 		clearSubtitleSearch: () => {
 			v?.abort(), v = null, t.setState((e) => ({
 				...e,
@@ -1766,7 +1765,7 @@ function bt(e) {
 		},
 		cycleAspectRatio: () => {
 			let e = t.state.aspectRatio, n = ut[(ut.indexOf(e) + 1) % ut.length] ?? "default";
-			k.setAspectRatio(n);
+			O.setAspectRatio(n);
 		},
 		toggleLoop: () => {
 			let e = u;
@@ -1782,10 +1781,10 @@ function bt(e) {
 			}));
 		}
 	};
-	function me(e) {
+	function k(e) {
 		return [
 			e.on("play", () => {
-				y.syncMetadata(n.title, de()), y.setPlaybackState("playing"), t.setState((e) => ({
+				y.syncMetadata(n.title, n.mediaSession, n.poster), y.setPlaybackState("playing"), t.setState((e) => ({
 					...e,
 					status: "playing",
 					isPlaying: !0,
@@ -1803,7 +1802,7 @@ function bt(e) {
 					isPaused: !e.isEnded,
 					isBuffering: !1,
 					controlsVisible: !0
-				})), y.setPlaybackState("paused"), y.syncPosition(e.duration, e.currentTime, e.playbackRate, !0), e.ended || re(E, e);
+				})), y.setPlaybackState("paused"), y.syncPosition(e.duration, e.currentTime, e.playbackRate, !0), e.ended || ie(E, e);
 			}),
 			e.on("ended", () => {
 				f = 0, p = NaN;
@@ -1811,7 +1810,7 @@ function bt(e) {
 					let t = w[e];
 					t?.kind === "save" && t.target.generation === E.generation && w.splice(e, 1);
 				}
-				ne(E), y.setPlaybackState("paused"), y.syncPosition(e.duration, e.currentTime, e.playbackRate, !0), t.setState((e) => ({
+				re(E), y.setPlaybackState("paused"), y.syncPosition(e.duration, e.currentTime, e.playbackRate, !0), t.setState((e) => ({
 					...e,
 					status: "ended",
 					isPlaying: !1,
@@ -1826,7 +1825,7 @@ function bt(e) {
 				t.setState((t) => ({
 					...t,
 					currentTime: e.currentTime
-				})), n.onTimeUpdate?.(e.currentTime), y.syncPosition(e.duration, e.currentTime, e.playbackRate), O(e);
+				})), n.onTimeUpdate?.(e.currentTime), y.syncPosition(e.duration, e.currentTime, e.playbackRate), D(e);
 			}),
 			e.on("loadedmetadata", () => {
 				m !== null && (clearTimeout(m), m = null), h = 0, t.setState((t) => ({
@@ -1838,7 +1837,7 @@ function bt(e) {
 					isMuted: e.muted,
 					playbackRate: e.playbackRate,
 					error: null
-				})), ae(e);
+				})), oe(e);
 			}),
 			e.on("progress", () => {
 				let n = e.buffered;
@@ -1869,7 +1868,7 @@ function bt(e) {
 					...t,
 					duration: Oe(e.duration) ? e.duration : 0,
 					isLive: !Oe(e.duration)
-				})), ae(e);
+				})), oe(e);
 			}),
 			e.on("seeking", () => {
 				t.setState((e) => ({
@@ -1881,7 +1880,7 @@ function bt(e) {
 				t.setState((e) => ({
 					...e,
 					status: e.isPlaying ? "playing" : "ready"
-				})), y.syncPosition(e.duration, e.currentTime, e.playbackRate, !0), re(E, e);
+				})), y.syncPosition(e.duration, e.currentTime, e.playbackRate, !0), ie(E, e);
 			}),
 			e.on("playing", () => {
 				t.setState((e) => ({
@@ -1940,8 +1939,8 @@ function bt(e) {
 			})
 		];
 	}
-	let he = null;
-	function A() {
+	let me = null;
+	function he() {
 		let e = i.get(M.CAPTION_SETTINGS);
 		e && t.setState((t) => ({
 			...t,
@@ -1952,7 +1951,7 @@ function bt(e) {
 			}
 		}));
 	}
-	function ge() {
+	function A() {
 		if (!n.persistPreferences) return;
 		let e = i.get(M.VOLUME), r = i.get(M.MUTED), a = i.get(M.PLAYBACK_RATE), o = i.get(M.LOOP), s = i.get(M.FLIP), c = i.get(M.ASPECT_RATIO);
 		t.setState((t) => ({
@@ -1963,18 +1962,18 @@ function bt(e) {
 			isLooping: o ?? t.isLooping,
 			flip: s ?? t.flip,
 			aspectRatio: _t(c)
-		})), A(), he = t.subscribe(() => {
+		})), he(), me = t.subscribe(() => {
 			let e = t.state;
 			e.volume !== 1 && i.set(M.VOLUME, e.volume), e.isMuted && i.set(M.MUTED, !0), e.playbackRate !== 1 && i.set(M.PLAYBACK_RATE, e.playbackRate), e.isLooping ? i.set(M.LOOP, !0) : i.remove(M.LOOP), e.flip === "normal" ? i.remove(M.FLIP) : i.set(M.FLIP, e.flip), e.aspectRatio === "default" ? i.remove(M.ASPECT_RATIO) : i.set(M.ASPECT_RATIO, e.aspectRatio), i.set(M.CAPTION_SETTINGS, e.captionSettings);
 		});
 	}
-	function _e() {
-		if (he) {
-			let e = he;
-			typeof e == "function" ? e() : e.unsubscribe(), he = null;
+	function ge() {
+		if (me) {
+			let e = me;
+			typeof e == "function" ? e() : e.unsubscribe(), me = null;
 		}
 	}
-	function j(e) {
+	function _e(e) {
 		if (g?.abort(), g = null, !e) {
 			t.setState((e) => ({
 				...e,
@@ -1995,11 +1994,11 @@ function bt(e) {
 			})));
 		});
 	}
-	function be(e) {
+	function j(e) {
 		return {
 			name: e,
 			store: t,
-			remote: k,
+			remote: O,
 			events: r,
 			storage: i,
 			hotkeys: o,
@@ -2078,15 +2077,15 @@ function bt(e) {
 			}
 		};
 	}
-	let Se = [];
-	function Ce(e = !0) {
+	let be = [];
+	function Se(e = !0) {
 		m !== null && (clearTimeout(m), m = null), h = 0;
-		for (let e of Se) e();
-		Se = [], u && (e && re(E, u), u.pause(), u.destroy(), u = null, Ee.engine = null);
+		for (let e of be) e();
+		be = [], u && (e && ie(E, u), u.pause(), u.destroy(), u = null, Te.engine = null);
 	}
-	function we(e) {
+	function Ce(e) {
 		let r = We(n), i = Ge(e, n);
-		u = i, Ee.engine = i, Se = me(i), e.playsInline = !0, e.autoplay = !!n.autoPlay, e.preload = e.preload || "metadata", y.setPlaybackState("paused"), t.setState((t) => ({
+		u = i, Te.engine = i, be = k(i), e.playsInline = !0, e.autoplay = !!n.autoPlay, e.preload = e.preload || "metadata", y.setPlaybackState("paused"), t.setState((t) => ({
 			...t,
 			status: "loading",
 			source: r,
@@ -2101,16 +2100,16 @@ function bt(e) {
 			error: null
 		})), n.autoPlay && i.play();
 	}
-	function Te(e = !0) {
+	function we(e = !0) {
 		let t = u?.element;
 		if (t) {
-			for (Ce(e), t.pause(), t.removeAttribute("src"); t.firstChild;) t.removeChild(t.firstChild);
-			t.load(), we(t);
+			for (Se(e), t.pause(), t.removeAttribute("src"); t.firstChild;) t.removeChild(t.firstChild);
+			t.load(), Ce(t);
 		}
 	}
-	let Ee = {
+	let Te = {
 		store: t,
-		remote: k,
+		remote: O,
 		events: r,
 		storage: i,
 		i18n: a,
@@ -2121,29 +2120,29 @@ function bt(e) {
 				...n,
 				...e
 			}, l = ee(c), d = l.id !== E.id || l.store !== E.store;
-			if ((r || d) && re(E, u), n = c, (r || d) && ie(), (t.state.isPlaying || y.hasMetadata) && y.syncMetadata(n.title, de()), t.setState((t) => {
+			if ((r || d) && ie(E, u), n = c, (r || d) && ae(), (t.state.isPlaying || y.hasMetadata) && y.syncMetadata(n.title, n.mediaSession, n.poster), t.setState((t) => {
 				let n = e.qualities ?? t.qualities;
 				return {
 					...t,
 					qualities: n,
 					activeQuality: e.qualities ? e.qualities.includes(t.activeQuality) ? t.activeQuality : e.qualities[0] ?? "Auto" : t.activeQuality
 				};
-			}), e.subtitles && (oe(e.subtitles), !t.state.activeSubtitle)) {
+			}), e.subtitles && (se(e.subtitles), !t.state.activeSubtitle)) {
 				let t = e.subtitles.find((e) => e.default) ?? null;
-				t && k.setActiveSubtitle(yt(t));
+				t && O.setActiveSubtitle(yt(t));
 			}
-			s && (v?.abort(), v = null, ce()), (a || o) && j(n.thumbnails), r || i ? Te(!(r || d)) : d && u && Oe(u.duration) && ae(u);
+			s && (v?.abort(), v = null, le()), (a || o) && _e(n.thumbnails), r || i ? we(!(r || d)) : d && u && Oe(u.duration) && oe(u);
 		},
 		setThumbnails(e) {
 			n = {
 				...n,
 				thumbnails: e
-			}, j(e);
+			}, _e(e);
 		},
 		initPlugins(e) {
 			let t = [];
 			for (let n of e) {
-				let e = be(n.name);
+				let e = j(n.name);
 				try {
 					let r = n.setup?.(e);
 					typeof r == "function" && t.push(r);
@@ -2160,12 +2159,12 @@ function bt(e) {
 			};
 		},
 		mount(e, r) {
-			u && this.unmount(), l = r, we(e), d = pe, document.addEventListener("fullscreenchange", d), document.addEventListener("webkitfullscreenchange", d), C = () => re(), window.addEventListener("pagehide", C), y.setup(k), j(n.thumbnails);
+			u && this.unmount(), l = r, Ce(e), d = pe, document.addEventListener("fullscreenchange", d), document.addEventListener("webkitfullscreenchange", d), C = () => ie(), window.addEventListener("pagehide", C), y.setup(O), _e(n.thumbnails);
 			let i = t.state.subtitleTracks.find((e) => e.default);
-			i && k.setActiveSubtitle(i), A(), ge(), k.setAspectRatio(t.state.aspectRatio);
+			i && O.setActiveSubtitle(i), he(), A(), O.setAspectRatio(t.state.aspectRatio);
 		},
 		unmount() {
-			Ce(), ie(), y.teardown(), l = null, g?.abort(), g = null, _?.abort(), _ = null, v?.abort(), v = null, _e(), m !== null && (clearTimeout(m), m = null), d &&= (document.removeEventListener("fullscreenchange", d), document.removeEventListener("webkitfullscreenchange", d), null), C &&= (window.removeEventListener("pagehide", C), null), t.setState((e) => ({
+			Se(), ae(), y.teardown(), l = null, g?.abort(), g = null, _?.abort(), _ = null, v?.abort(), v = null, ge(), m !== null && (clearTimeout(m), m = null), d &&= (document.removeEventListener("fullscreenchange", d), document.removeEventListener("webkitfullscreenchange", d), null), C &&= (window.removeEventListener("pagehide", C), null), t.setState((e) => ({
 				...e,
 				activeSubtitle: null,
 				subtitleTracks: e.subtitleTracks.filter((e) => !e.local),
@@ -2183,7 +2182,7 @@ function bt(e) {
 			this.unmount(), r.clear();
 		}
 	};
-	return Ee;
+	return Te;
 }
 function xt(e, t) {
 	let n = null, r = null, i = null, a = typeof window < "u" && "ontouchstart" in window;
@@ -2564,7 +2563,7 @@ var Nt = () => {
 	});
 }, It = {
 	name: "@vplayer/react",
-	version: "0.3.0",
+	version: "0.4.0",
 	private: !1,
 	repository: {
 		type: "git",
@@ -2600,7 +2599,7 @@ var Nt = () => {
 		"@ark-ui/react": "5.39.1",
 		"@tanstack/react-store": "^0.11.1",
 		"@tanstack/store": "^0.11.1",
-		"@vplayer/core": "workspace:^0.3.0",
+		"@vplayer/core": "workspace:^0.4.0",
 		clsx: "^2.1.1"
 	},
 	devDependencies: {
@@ -4538,15 +4537,15 @@ var mo = 50, ho = async (e, t, n) => {
 			y: r
 		}, p = Za(i), m = Ya(p), h = await o.getDimensions(l), g = p === "y", _ = g ? "top" : "left", v = g ? "bottom" : "right", y = g ? "clientHeight" : "clientWidth", b = a.reference[m] + a.reference[p] - f[p] - a.floating[m], x = f[p] - a.reference[p], S = await (o.getOffsetParent == null ? void 0 : o.getOffsetParent(l)), C = S ? S[y] : 0;
 		(!C || !await (o.isElement == null ? void 0 : o.isElement(S))) && (C = s.floating[y] || a.floating[m]);
-		let w = b / 2 - x / 2, T = C / 2 - h[m] / 2 - 1, ee = Ra(d[_], T), E = Ra(d[v], T), te = C - h[m] - E, D = C / 2 - h[m] / 2 + w, ne = Wa(ee, D, te), re = !c.arrow && qa(i) != null && D !== ne && a.reference[m] / 2 - (D < ee ? ee : E) - h[m] / 2 < 0, O = re ? D < ee ? D - ee : D - te : 0;
+		let w = b / 2 - x / 2, T = C / 2 - h[m] / 2 - 1, ee = Ra(d[_], T), E = Ra(d[v], T), te = C - h[m] - E, ne = C / 2 - h[m] / 2 + w, re = Wa(ee, ne, te), ie = !c.arrow && qa(i) != null && ne !== re && a.reference[m] / 2 - (ne < ee ? ee : E) - h[m] / 2 < 0, D = ie ? ne < ee ? ne - ee : ne - te : 0;
 		return {
-			[p]: f[p] + O,
+			[p]: f[p] + D,
 			data: {
-				[p]: ne,
-				centerOffset: D - ne - O,
-				...re && { alignmentOffset: O }
+				[p]: re,
+				centerOffset: ne - re - D,
+				...ie && { alignmentOffset: D }
 			},
-			reset: re
+			reset: ie
 		};
 	}
 }), _o = function(e) {
@@ -6678,7 +6677,7 @@ function Vu(e, t = {}) {
 		queueMicrotask(() => {
 			if (E.current !== vu.Started) return;
 			u.current = d.current, d.current = t;
-			let n = D(), { transitions: i, source: a } = du(e, n, t.type), o = w(i);
+			let n = ne(), { transitions: i, source: a } = du(e, n, t.type), o = w(i);
 			if (!o) return;
 			l.current = o;
 			let s = uu(e, o.target ?? n, a);
@@ -6772,13 +6771,13 @@ function Vu(e, t = {}) {
 		});
 		let t = c.current;
 		return () => {
-			let n = D();
+			let n = ne();
 			r("unmounting..."), ee.current = n, E.current = vu.Stopped, t.forEach((e) => e?.()), c.current = /* @__PURE__ */ new Map(), l.current = null, queueMicrotask(() => {
 				x(e.exit), E.current = vu.Stopped;
 			});
 		};
 	}, []);
-	let D = () => "ref" in T ? T.ref.current : T.get();
+	let ne = () => "ref" in T ? T.ref.current : T.get();
 	return e.watch?.(b()), {
 		state: h(),
 		send: _,
@@ -16475,7 +16474,7 @@ function Ox(e) {
 	};
 }
 function kx({ className: e = "", children: t, ...n }) {
-	let r = m(null), i = m(null), a = m(null), o = n.src, s = n.title, l = n.poster, d = n.mediaSessionArtwork, f = n.type, g = n.autoPlay, y = n.subtitles, b = n.subtitleProviders, x = n.subtitleSearchDefaultQuery ?? "", S = n.qualities, C = n.thumbnails, w = n.transformThumbnailVTT, T = w !== void 0, ee = m(w), E = n.playbackProgress?.id, te = n.playbackProgress?.store, D = n.playbackProgress?.normalizeUrl, ne = n.playbackProgress?.resumePromptTimeout, re = n.plugins, O = n.labels, ie = n.icons, ae = n.slots ?? {}, oe = n.miniPlayer, se = n.thumbnailPreview, ce = l ? `${o}\0${l}` : null, [le, ue] = h(null), [de, fe] = h(null), pe = ce !== null && le === ce, { instance: k, attach: me, detach: he } = Jt(n);
+	let r = m(null), i = m(null), a = m(null), o = n.src, s = n.title, l = n.poster, d = n.mediaSession, f = n.type, g = n.autoPlay, y = n.subtitles, b = n.subtitleProviders, x = n.subtitleSearchDefaultQuery ?? "", S = n.qualities, C = n.thumbnails, w = n.transformThumbnailVTT, T = w !== void 0, ee = m(w), E = n.playbackProgress?.id, te = n.playbackProgress?.store, ne = n.playbackProgress?.normalizeUrl, re = n.playbackProgress?.resumePromptTimeout, ie = n.plugins, D = n.labels, ae = n.icons, oe = n.slots ?? {}, se = n.miniPlayer, ce = n.thumbnailPreview, le = l ? `${o}\0${l}` : null, [ue, de] = h(null), [fe, pe] = h(null), O = le !== null && ue === le, { instance: k, attach: me, detach: he } = Jt(n);
 	u(() => {
 		let e = a.current, t = i.current;
 		return e && t && me(t, e), () => he();
@@ -16487,7 +16486,7 @@ function kx({ className: e = "", children: t, ...n }) {
 			type: f,
 			title: s,
 			poster: l,
-			mediaSessionArtwork: d,
+			mediaSession: d,
 			subtitles: y,
 			subtitleProviders: b,
 			qualities: S,
@@ -16497,8 +16496,8 @@ function kx({ className: e = "", children: t, ...n }) {
 			playbackProgress: {
 				id: E,
 				store: te,
-				normalizeUrl: D,
-				resumePromptTimeout: ne
+				normalizeUrl: ne,
+				resumePromptTimeout: re
 			}
 		});
 	}, [
@@ -16515,13 +16514,13 @@ function kx({ className: e = "", children: t, ...n }) {
 		g,
 		E,
 		te,
-		D,
 		ne,
+		re,
 		k
-	]), u(() => k.initPlugins(re ?? []), [re, k]);
+	]), u(() => k.initPlugins(ie ?? []), [ie, k]);
 	let A = Ut(k.store), ge = _e(k.store, (e) => e.controlsVisible), ve = _e(k.store, (e) => e.isPlaying);
-	ve && de !== o && fe(o);
-	let ye = de === o, j = Gt(r, oe), be = p(() => Ox(se), [se]);
+	ve && fe !== o && pe(o);
+	let ye = fe === o, j = Gt(r, se), be = p(() => Ox(ce), [ce]);
 	u(() => {
 		j.active && (A.showControls(), A.scheduleHide(1400));
 	}, [A, j.active]), u(() => {
@@ -16538,7 +16537,7 @@ function kx({ className: e = "", children: t, ...n }) {
 	]);
 	let xe = c((e) => {
 		e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement || e.target.isContentEditable || (A.showControls(), k.hotkeys.handleKeyDown(e));
-	}, [k.hotkeys, A]), Se = p(() => Ex(Ct, O), [O]), Ce = p(() => Dx(hn, ie), [ie]), we = p(() => ({
+	}, [k.hotkeys, A]), Se = p(() => Ex(Ct, D), [D]), Ce = p(() => Dx(hn, ae), [ae]), we = p(() => ({
 		ref: a,
 		className: "vplayer__video",
 		autoPlay: g,
@@ -16553,7 +16552,7 @@ function kx({ className: e = "", children: t, ...n }) {
 		labels: Se,
 		subtitleSearchDefaultQuery: x,
 		icons: Ce,
-		slots: ae,
+		slots: oe,
 		mediaStore: k.store,
 		mediaRemote: k.remote,
 		events: k.events,
@@ -16570,7 +16569,7 @@ function kx({ className: e = "", children: t, ...n }) {
 		k,
 		Se,
 		Ce,
-		ae,
+		oe,
 		A,
 		j,
 		x,
@@ -16620,8 +16619,8 @@ function kx({ className: e = "", children: t, ...n }) {
 							alt: "",
 							"aria-hidden": "true",
 							"data-testid": "vplayer-poster",
-							onLoad: () => ue(ce),
-							className: Tt("vplayer__poster", pe && "vplayer__poster--loaded", ye && "vplayer__poster--hidden")
+							onLoad: () => de(le),
+							className: Tt("vplayer__poster", O && "vplayer__poster--loaded", ye && "vplayer__poster--hidden")
 						})]
 					}),
 					t ?? /* @__PURE__ */ _(Sx, {}),
@@ -16629,7 +16628,7 @@ function kx({ className: e = "", children: t, ...n }) {
 					j.active && /* @__PURE__ */ _(Bt, {}),
 					/* @__PURE__ */ _(Nt, {}),
 					/* @__PURE__ */ _(Ft, {}),
-					/* @__PURE__ */ _(At, { timeout: ne }),
+					/* @__PURE__ */ _(At, { timeout: re }),
 					/* @__PURE__ */ _(Pt, {}),
 					/* @__PURE__ */ _(zt, {}),
 					/* @__PURE__ */ _("div", {
@@ -16644,7 +16643,7 @@ function kx({ className: e = "", children: t, ...n }) {
 //#endregion
 //#region src/components/player/layout/compact-video-layout.tsx
 var Ax = () => /* @__PURE__ */ _(Sx, {}), jx = () => /* @__PURE__ */ _(Sx, {}), Mx = ({ options: e, labels: t, icons: n, slots: r = {}, children: i }) => {
-	let { instance: a, attach: o, detach: s } = Jt(e), c = m(null), l = m(null), d = e.src, f = e.type, h = e.title, g = e.poster, v = e.mediaSessionArtwork, y = e.autoPlay, b = e.subtitles, x = e.subtitleProviders, S = e.subtitleSearchDefaultQuery ?? "", C = e.qualities, w = e.thumbnails, T = e.transformThumbnailVTT, ee = T !== void 0, E = m(T), te = e.playbackProgress?.id, D = e.playbackProgress?.store, ne = e.playbackProgress?.normalizeUrl, re = e.playbackProgress?.resumePromptTimeout, O = e.plugins;
+	let { instance: a, attach: o, detach: s } = Jt(e), c = m(null), l = m(null), d = e.src, f = e.type, h = e.title, g = e.poster, v = e.mediaSession, y = e.autoPlay, b = e.subtitles, x = e.subtitleProviders, S = e.subtitleSearchDefaultQuery ?? "", C = e.qualities, w = e.thumbnails, T = e.transformThumbnailVTT, ee = T !== void 0, E = m(T), te = e.playbackProgress?.id, ne = e.playbackProgress?.store, re = e.playbackProgress?.normalizeUrl, ie = e.playbackProgress?.resumePromptTimeout, D = e.plugins;
 	u(() => {
 		let e = c.current, t = l.current;
 		return e && t && o(e, t), () => s();
@@ -16656,7 +16655,7 @@ var Ax = () => /* @__PURE__ */ _(Sx, {}), jx = () => /* @__PURE__ */ _(Sx, {}),
 			type: f,
 			title: h,
 			poster: g,
-			mediaSessionArtwork: v,
+			mediaSession: v,
 			autoPlay: y,
 			subtitles: b,
 			subtitleProviders: x,
@@ -16665,9 +16664,9 @@ var Ax = () => /* @__PURE__ */ _(Sx, {}), jx = () => /* @__PURE__ */ _(Sx, {}),
 			transformThumbnailVTT: ee ? E.current : void 0,
 			playbackProgress: {
 				id: te,
-				store: D,
-				normalizeUrl: ne,
-				resumePromptTimeout: re
+				store: ne,
+				normalizeUrl: re,
+				resumePromptTimeout: ie
 			}
 		});
 	}, [
@@ -16683,24 +16682,24 @@ var Ax = () => /* @__PURE__ */ _(Sx, {}), jx = () => /* @__PURE__ */ _(Sx, {}),
 		w,
 		ee,
 		te,
-		D,
 		ne,
 		re,
+		ie,
 		a
-	]), u(() => a.initPlugins(O ?? []), [O, a]);
-	let ie = Ex(Ct, t), ae = Dx(hn, n), oe = p(() => Kt(), []), se = p(() => ({
+	]), u(() => a.initPlugins(D ?? []), [D, a]);
+	let ae = Ex(Ct, t), oe = Dx(hn, n), se = p(() => Kt(), []), ce = p(() => ({
 		enabled: !0,
 		width: 180,
 		height: 101,
 		gap: 10,
 		showTime: !0,
 		fit: "cover"
-	}), []), ce = {
+	}), []), le = {
 		containerRef: c,
 		videoRef: l,
-		labels: ie,
+		labels: ae,
 		subtitleSearchDefaultQuery: S,
-		icons: ae,
+		icons: oe,
 		slots: r,
 		mediaStore: a.store,
 		mediaRemote: a.remote,
@@ -16712,11 +16711,11 @@ var Ax = () => /* @__PURE__ */ _(Sx, {}), jx = () => /* @__PURE__ */ _(Sx, {}),
 		instance: a,
 		createPluginAPI: Tx,
 		controlsVisibility: { pinControls: () => () => {} },
-		miniPlayer: oe,
-		thumbnailPreview: se
+		miniPlayer: se,
+		thumbnailPreview: ce
 	};
 	return /* @__PURE__ */ _(Et.Provider, {
-		value: ce,
+		value: le,
 		children: i
 	});
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vplayer/react",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "private": false,
   "repository": {
     "type": "git",
@@ -38,7 +38,7 @@
     "@ark-ui/react": "5.39.1",
     "@tanstack/react-store": "^0.11.1",
     "@tanstack/store": "^0.11.1",
-    "@vplayer/core": "^0.3.0",
+    "@vplayer/core": "^0.4.0",
     "clsx": "^2.1.1"
   },
   "devDependencies": {