@wyxos/vibe 3.1.14 → 3.1.16

package/lib/index.js

@@ -140,13 +140,13 @@ var te = (e) => {
 		d: "M12 17h.01",
 		key: "p32p05"
 	}]
-]), X = q("volume-1", [["path", {
+]), ue = q("volume-1", [["path", {
 	d: "M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z",
 	key: "uqj9uw"
 }], ["path", {
 	d: "M16 9a5 5 0 0 1 0 6",
 	key: "1q6k2b"
-}]]), ue = q("volume-2", [
+}]]), X = q("volume-2", [
 	["path", {
 		d: "M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z",
 		key: "uqj9uw"
@@ -222,28 +222,56 @@ function he(e) {
 function ge(e) {
 	return e === "filling" || e === "initializing" || e === "loading" || e === "refreshing";
 }
-function _e(e) {
+function Q(e) {
 	return !e || !Number.isFinite(e) || e < 1 ? 25 : Math.floor(e);
 }
-function ve(e) {
+function _e(e) {
 	return e ?? "__vibe_initial_cursor__";
 }
-function Q(e, t, n) {
+function ve(e, t, n) {
 	return Math.min(Math.max(e, t), n);
 }
 //#endregion
+//#region src/components/viewer-core/itemIdentity.ts
+var ye = "__vibeOccurrenceKey";
+function $(e) {
+	let t = e[ye];
+	return typeof t == "string" && t.length > 0 ? t : e.id;
+}
+function be(e, t, n) {
+	let r = /* @__PURE__ */ new Map(), i = [], a = n;
+	for (let e of t) {
+		let t = r.get(e.id), n = $(e);
+		t ? t.push(n) : r.set(e.id, [n]);
+	}
+	for (let t of e) {
+		let e = r.get(t.id)?.shift() ?? `vibe-occurrence-${a += 1}`;
+		i.push(xe(t, e));
+	}
+	return {
+		items: i,
+		nextSequence: a
+	};
+}
+function xe(e, t) {
+	return $(e) === t ? e : {
+		...e,
+		[ye]: t
+	};
+}
+//#endregion
 //#region src/components/viewer-core/removalState.ts
-function ye() {
+function Se() {
 	let e = D(/* @__PURE__ */ new Set()), t = D([]);
 	function n(n) {
-		let r = be(n).filter((t) => !e.value.has(t));
+		let r = Ce(n).filter((t) => !e.value.has(t));
 		if (!r.length) return { ids: [] };
 		let i = new Set(e.value);
 		for (let e of r) i.add(e);
 		return e.value = i, t.value = [...t.value, r], { ids: r };
 	}
 	function r(t) {
-		let n = be(t).filter((t) => e.value.has(t));
+		let n = Ce(t).filter((t) => e.value.has(t));
 		if (!n.length) return { ids: [] };
 		let r = new Set(e.value);
 		for (let e of n) r.delete(e);
@@ -274,39 +302,11 @@ function ye() {
 		undo: i
 	};
 }
-function be(e) {
+function Ce(e) {
 	let t = Array.isArray(e) ? e : [e];
 	return Array.from(new Set(t.filter((e) => typeof e == "string" && e.length > 0)));
 }
 //#endregion
-//#region src/components/viewer-core/itemIdentity.ts
-var xe = "__vibeOccurrenceKey";
-function $(e) {
-	let t = e[xe];
-	return typeof t == "string" && t.length > 0 ? t : e.id;
-}
-function Se(e, t, n) {
-	let r = /* @__PURE__ */ new Map(), i = [], a = n;
-	for (let e of t) {
-		let t = r.get(e.id), n = $(e);
-		t ? t.push(n) : r.set(e.id, [n]);
-	}
-	for (let t of e) {
-		let e = r.get(t.id)?.shift() ?? `vibe-occurrence-${a += 1}`;
-		i.push(Ce(t, e));
-	}
-	return {
-		items: i,
-		nextSequence: a
-	};
-}
-function Ce(e, t) {
-	return $(e) === t ? e : {
-		...e,
-		[xe]: t
-	};
-}
-//#endregion
 //#region src/components/viewer-core/autoBuckets.ts
 function we(e) {
 	return e.flatMap((e) => e.items);
@@ -335,7 +335,7 @@ function ke(e, t, n) {
 	return i >= 0 && r.splice(i, 1, n), r;
 }
 function Ae(e, t, n) {
-	let r = Se(e, t, n);
+	let r = be(e, t, n);
 	return {
 		items: r.items,
 		nextSequence: r.nextSequence
@@ -438,19 +438,19 @@ function Le(e) {
 		sequence: e.sequence
 	}), n = Te(t.bucket.items, e.removedIds);
 	return {
-		activeIndex: Q(e.initialState.activeIndex ?? 0, 0, Math.max(0, n.length - 1)),
+		activeIndex: ve(e.initialState.activeIndex ?? 0, 0, Math.max(0, n.length - 1)),
 		buckets: [t.bucket],
 		nextSequence: t.nextSequence
 	};
 }
 function Re(e, t) {
-	let n = e[Q(t, 0, Math.max(0, e.length - 1))];
+	let n = e[ve(t, 0, Math.max(0, e.length - 1))];
 	return n ? $(n) : null;
 }
 function ze(e, t, n = null) {
 	if (!e.length) return 0;
 	let r = n ? e.findIndex((e) => $(e) === n) : -1;
-	return r >= 0 ? r : Q(t, 0, e.length - 1);
+	return r >= 0 ? r : ve(t, 0, e.length - 1);
 }
 function Be(e, t, n) {
 	return e ? De(e, t) < n : !1;
@@ -494,7 +494,7 @@ function Ke() {
 //#endregion
 //#region src/components/viewer-core/useAutoResolveSource.ts
 function qe(e) {
-	let t = !!e.initialState?.items.length, n = D([]), r = D(0), a = D([]), o = D(!1), s = D(null), c = D(!t && typeof e.resolve == "function" ? "initializing" : "idle"), l = D(null), u = D(null), d = Ke(), f = d.remainingMs, p = D(null), m = D(!1), h = D(!0), g = D(!1), _ = /* @__PURE__ */ new Set(), v = null, y = null, b = 0, C = 0, w = i(() => Ge(e.fillDelayMs, Ve)), T = i(() => Ge(e.fillDelayStepMs, He)), E = i(() => typeof e.resolve == "function"), O = i(() => _e(e.pageSize)), k = i(() => we(n.value)), A = i(() => Te(k.value, e.removedIds.value)), j = i(() => r.value), M = i(() => ge(c.value) || m.value), N = i(() => Je(n.value, e.removedIds.value)), P = i(() => Ye(n.value, e.removedIds.value)), F = i(() => P.value?.nextCursor ?? null), I = i(() => o.value ? null : N.value?.previousCursor ?? null), R = i(() => !!F.value), z = i(() => !!I.value), B = i(() => E.value && n.value.length > 0), ee = i(() => Te(we(a.value), e.removedIds.value)), te = i(() => Oe(n.value, e.removedIds.value, j.value)), V = i(() => !A.value.length && !M.value && !!s.value);
+	let t = !!e.initialState?.items.length, n = D([]), r = D(0), a = D([]), o = D(!1), s = D(null), c = D(!t && typeof e.resolve == "function" ? "initializing" : "idle"), l = D(null), u = D(null), d = Ke(), f = d.remainingMs, p = D(null), m = D(!1), h = D(!0), g = D(!1), _ = /* @__PURE__ */ new Set(), v = null, y = null, b = 0, C = 0, w = i(() => Ge(e.fillDelayMs, Ve)), T = i(() => Ge(e.fillDelayStepMs, He)), E = i(() => typeof e.resolve == "function"), O = i(() => Q(e.pageSize)), k = i(() => we(n.value)), A = i(() => Te(k.value, e.removedIds.value)), j = i(() => r.value), M = i(() => ge(c.value) || m.value), N = i(() => Je(n.value, e.removedIds.value)), P = i(() => Ye(n.value, e.removedIds.value)), F = i(() => P.value?.nextCursor ?? null), I = i(() => o.value ? null : N.value?.previousCursor ?? null), R = i(() => !!F.value), z = i(() => !!I.value), B = i(() => E.value && n.value.length > 0), ee = i(() => Te(we(a.value), e.removedIds.value)), te = i(() => Oe(n.value, e.removedIds.value, j.value)), V = i(() => !A.value.length && !M.value && !!s.value);
 	L(() => A.value.length, (e) => {
 		if (e === 0) {
 			r.value = 0;
@@ -503,6 +503,8 @@ function qe(e) {
 		o.value &&= (ye(), !1), r.value > e - 1 && (r.value = e - 1);
 	}), L(() => r.value, () => {
 		h.value && ce();
+	}), L(() => F.value, (e) => {
+		e && !A.value.length && c.value === "idle" && ce();
 	}), S(() => {
 		pe() || e.resolve && H();
 	}), x(() => {
@@ -519,24 +521,24 @@ function qe(e) {
 		t && (n.value = t.buckets, r.value = 0, Z());
 	}
 	async function U() {
-		if (!(g.value || M.value)) {
-			if (he("trailing") || !R.value) {
-				if (!B.value) return;
-				let e = await ue("trailing");
-				e?.followCursor && he("trailing") && await le(e.followCursor);
-				return;
-			}
-			await le(F.value);
+		if (g.value || M.value) return;
+		let e = !A.value.length;
+		if (he("trailing") || !R.value) {
+			if (!B.value) return;
+			let t = await X("trailing");
+			t?.followCursor && he("trailing") && await le(t.followCursor, { commitImmediately: e });
+			return;
 		}
+		await le(F.value, { commitImmediately: e });
 	}
 	async function W() {
 		if (!(g.value || !z.value || M.value)) {
 			if (he("leading")) {
-				let e = await ue("leading");
-				e?.itemsLoaded === 0 && e.followCursor && await X(e.followCursor);
+				let e = await X("leading");
+				e?.itemsLoaded === 0 && e.followCursor && await ue(e.followCursor);
 				return;
 			}
-			await X(I.value);
+			await ue(I.value);
 		}
 	}
 	async function ne() {
@@ -559,7 +561,7 @@ function qe(e) {
 	function q(t) {
 		let n = A.value;
 		if (!n.length) return;
-		let i = Q(t, 0, n.length - 1);
+		let i = ve(t, 0, n.length - 1);
 		i !== r.value && (r.value = i, e.emit("update:activeIndex", i));
 	}
 	function re(e) {
@@ -596,36 +598,36 @@ function qe(e) {
 		r.value = ze(A.value, j.value, e);
 	}
 	function se() {
-		a.value.length > 0 && !ee.value.length && K();
+		a.value.length > 0 && (!ee.value.length || !A.value.length) && K();
 	}
 	async function ce() {
 		if (!(!h.value || me())) {
 			if (!A.value.length) {
-				R.value && await U();
+				(R.value || B.value) && await U();
 				return;
 			}
 			z.value && r.value < 3 && await W(), R.value && r.value >= A.value.length - 3 && await U();
 		}
 	}
-	async function le(e) {
+	async function le(e, t = {}) {
 		y = async () => {
-			await le(e);
+			await le(e, t);
 		};
-		let t = await de({
+		let r = await de({
 			continueUntilFilled: !0,
 			cursor: e,
 			direction: "forward",
 			phase: "loading"
 		});
-		if (t) {
-			if (t.canceled) return n.value = [...n.value, ...t.buckets], a.value = [], m.value = !1, Z();
-			if (a.value = t.buckets, !ee.value.length) return n.value = [...n.value, ...a.value], a.value = [], m.value = !1, Z();
+		if (r) {
+			if (r.canceled) return n.value = [...n.value, ...r.buckets], a.value = [], m.value = !1, Z();
+			if (a.value = r.buckets, t.commitImmediately || !ee.value.length) return n.value = [...n.value, ...a.value], a.value = [], m.value = !1, Z();
 			m.value = !0;
 		}
 	}
-	async function X(e) {
+	async function ue(e) {
 		y = async () => {
-			await X(e);
+			await ue(e);
 		};
 		let t = await de({
 			continueUntilFilled: !0,
@@ -637,13 +639,13 @@ function qe(e) {
 		let r = ae();
 		n.value = [...t.buckets, ...n.value], oe(r), Z();
 	}
-	async function ue(t) {
+	async function X(t) {
 		if (y = async () => {
-			await ue(t);
+			await X(t);
 		}, !e.resolve) return null;
 		let r = t === "leading" ? N.value : P.value;
 		if (!r) return null;
-		let i = ve(r.cursor);
+		let i = _e(r.cursor);
 		if (_.has(i)) return null;
 		_.add(i), s.value = null, c.value = "refreshing", l.value = null, u.value = null, p.value = null;
 		let a = ++b, o = typeof AbortController > "u" ? null : new AbortController();
@@ -682,7 +684,7 @@ function qe(e) {
 		for (s.value = null, c.value = t.phase, l.value = null, u.value = null, p.value = null;;) {
 			if (n !== b) return Ie(i, t.direction, e.removedIds.value, !0);
 			if (i.length > 0 && g.value) return Ie(i, t.direction, e.removedIds.value, !1);
-			let f = ve(a);
+			let f = _e(a);
 			if (r.has(f) || _.has(f)) break;
 			r.add(f), _.add(f);
 			let m = typeof AbortController > "u" ? null : new AbortController();
@@ -809,7 +811,7 @@ function Ye(e, t) {
 //#endregion
 //#region src/components/viewer-core/useDataSource.ts
 function Xe(e, t) {
-	let { clearRemoved: n, getRemovedIds: r, remove: a, removedIds: o, restore: s, undo: c } = ye(), l = qe({
+	let { clearRemoved: n, getRemovedIds: r, remove: a, removedIds: o, restore: s, undo: c } = Se(), l = qe({
 		emit: t,
 		fillDelayMs: e.fillDelayMs,
 		fillDelayStepMs: e.fillDelayStepMs,
@@ -821,11 +823,11 @@ function Xe(e, t) {
 	}), u = l.items, d = l.activeIndex, f = l.loading, p = l.hasNextPage, m = l.hasPreviousPage, h = i(() => o.value.size), g = i(() => e.paginationDetail ?? null), _ = i(() => !l.hasNextPage.value && l.canRefreshTrailingBoundary.value);
 	function v(e) {
 		let t = u.value;
-		t.length && l.setActiveIndex(C(e, 0, t.length - 1));
+		t.length && l.setActiveIndex(T(e, 0, t.length - 1));
 	}
 	function y(e) {
 		let t = l.getActiveOccurrenceKey(), n = u.value[d.value] ?? null, r = Array.isArray(e) ? e : [e], i = !!(n && r.includes(n.id) && l.isAutoPrefetchEnabled.value && d.value >= u.value.length - 3), o = !!(n && r.includes(n.id) && l.hasNextPage.value && d.value === u.value.length - 1), s = a(e);
-		return s.ids.length ? (l.maybeCommitPendingAppendWhenFilteredOut(), l.syncActiveIndexAfterVisibilityChange(t, { preserveTrailingPlaceholder: o }), i && l.maybePrefetchAround(), s) : s;
+		return s.ids.length ? (l.maybeCommitPendingAppendWhenFilteredOut(), l.syncActiveIndexAfterVisibilityChange(t, { preserveTrailingPlaceholder: o }), (i || !u.value.length) && l.maybePrefetchAround(), s) : s;
 	}
 	function b(e) {
 		let t = l.getActiveOccurrenceKey(), n = s(e);
@@ -839,26 +841,32 @@ function Xe(e, t) {
 		let e = l.getActiveOccurrenceKey();
 		n(), l.syncActiveIndexAfterVisibilityChange(e);
 	}
-	function C(e, t, n) {
+	function C() {
+		return [...u.value];
+	}
+	function w(e) {
+		return u.value.find((t) => $(t) === e) ?? null;
+	}
+	function T(e, t, n) {
 		return Math.min(Math.max(e, t), n);
 	}
-	function w() {
+	function E() {
 		l.cancel();
 	}
-	async function T() {
+	async function D() {
 		await l.prefetchNextPage();
 	}
-	async function E() {
+	async function O() {
 		await l.prefetchPreviousPage();
 	}
-	async function D() {
+	async function k() {
 		await l.retry();
 	}
 	return {
 		activeIndex: d,
 		canRefreshExhaustedNextPage: _,
 		canRetryInitialLoad: l.canRetryInitialLoad,
-		cancel: w,
+		cancel: E,
 		clearRemoved: S,
 		commitPendingAppend: l.commitPendingAppend,
 		currentCursor: l.currentCursor,
@@ -867,6 +875,8 @@ function Xe(e, t) {
 		fillCursor: l.fillCursor,
 		fillDelayRemainingMs: l.fillDelayRemainingMs,
 		fillTargetCount: l.fillTargetCount,
+		getItemByOccurrenceKey: w,
+		getItems: C,
 		getRemovedIds: r,
 		hasNextPage: p,
 		hasPreviousPage: m,
@@ -874,8 +884,8 @@ function Xe(e, t) {
 		items: u,
 		lockPageLoading: l.lockPageLoading,
 		loading: f,
-		loadNext: T,
-		loadPrevious: E,
+		loadNext: D,
+		loadPrevious: O,
 		nextCursor: l.nextCursor,
 		paginationDetail: g,
 		pendingAppendItems: l.pendingAppendItems,
@@ -886,7 +896,7 @@ function Xe(e, t) {
 		removedCount: h,
 		remove: y,
 		restore: b,
-		retry: D,
+		retry: k,
 		retryInitialLoad: l.retryInitialLoad,
 		setActiveIndex: v,
 		setAutoPrefetchEnabled: l.setAutoPrefetchEnabled,
@@ -1017,7 +1027,7 @@ var et = {
 		"volume-toggle"
 	],
 	setup(e, { emit: t }) {
-		let n = e, r = t, l = D(null), u = D(!1), d = i(() => n.volumeControlLayout === "vertical"), f = i(() => C(n.volume, 0, 1)), p = i(() => Math.round(f.value * 100)), m = i(() => n.muted || f.value <= 0 ? de : f.value < .5 ? X : ue), h = i(() => n.muted || f.value <= 0 ? "Unmute active media" : "Mute active media"), g = i(() => d.value && !u.value ? "Show volume controls" : h.value), _ = i(() => n.volumeControlLayout === "vertical" ? { height: `${p.value}%` } : { width: `${p.value}%` });
+		let n = e, r = t, l = D(null), u = D(!1), d = i(() => n.volumeControlLayout === "vertical"), f = i(() => C(n.volume, 0, 1)), p = i(() => Math.round(f.value * 100)), m = i(() => n.muted || f.value <= 0 ? de : f.value < .5 ? ue : X), h = i(() => n.muted || f.value <= 0 ? "Unmute active media" : "Mute active media"), g = i(() => d.value && !u.value ? "Show volume controls" : h.value), _ = i(() => n.volumeControlLayout === "vertical" ? { height: `${p.value}%` } : { width: `${p.value}%` });
 		L(d, (e) => {
 			e || (u.value = !1);
 		}), S(() => {
@@ -1427,7 +1437,7 @@ function Ht(e) {
 	let t = Lt({
 		active: e.active,
 		getItemKey: r,
-		isAssetReady: p,
+		isAssetReady: m,
 		items: e.items,
 		onResetAssetState: e.viewer.resetAssetState,
 		resolvedActiveIndex: e.resolvedActiveIndex
@@ -1442,48 +1452,56 @@ function Ht(e) {
 	function i(e) {
 		return t.shouldAttachSlideAsset(e);
 	}
-	function a(e) {
+	function a(e, t) {
+		return h(e, t) && i(e);
+	}
+	function o(e) {
 		return t.getSlidePreloadState(e);
 	}
-	function o(t, n) {
-		let i = r(n), o = a(t);
-		return o === "idle" || t !== e.resolvedActiveIndex.value || e.viewer.getAssetErrorKind(i) ? !1 : o !== "ready";
+	function s(t, n) {
+		let i = r(n), a = o(t);
+		return a === "idle" || t !== e.resolvedActiveIndex.value || e.viewer.getAssetErrorKind(i) ? !1 : a !== "ready";
 	}
-	function s(t) {
+	function c(t) {
 		return e.viewer.getAssetErrorKind(r(t));
 	}
-	function c(t) {
+	function l(t) {
 		return e.viewer.getAssetErrorLabel(r(t)) ?? "Load error";
 	}
-	function l(t, n) {
-		return a(t) !== "idle" && t === e.resolvedActiveIndex.value && !!s(n);
-	}
 	function u(t, n) {
+		return o(t) !== "idle" && t === e.resolvedActiveIndex.value && !!c(n);
+	}
+	function d(t, n) {
 		return i(t) ? e.viewer.getImageSource(n) : void 0;
 	}
-	function d(e) {
+	function f(e) {
 		return i(e) ? "metadata" : "none";
 	}
-	function f(e, t) {
+	function p(e, t) {
 		return i(e) ? t.url : void 0;
 	}
-	function p(t, n) {
+	function m(t, n) {
 		return n.type === "image" ? e.viewer.isImageReady(t) : n.type === "video" || n.type === "audio" ? e.viewer.isMediaReady(t) : !1;
 	}
+	function h(t, n) {
+		let i = e.items.value[t];
+		return !!i && r(i) === r(n);
+	}
 	return {
-		getAssetErrorKind: s,
-		getAssetErrorLabel: c,
-		getFullscreenImageSource: u,
-		getFullscreenMediaPreload: d,
-		getFullscreenMediaSource: f,
+		getAssetErrorKind: c,
+		getAssetErrorLabel: l,
+		getFullscreenImageSource: d,
+		getFullscreenMediaPreload: f,
+		getFullscreenMediaSource: p,
 		getItemKey: r,
 		getMediaActionLabel: n,
-		getSlidePreloadState: a,
-		isAssetErrored: l,
-		isAssetLoading: o,
+		getSlidePreloadState: o,
+		isAssetErrored: u,
+		isAssetLoading: s,
 		registerImageElement: t.registerImageElement,
 		registerMediaElement: t.registerMediaElement,
 		settleAssetPreload: t.settleAssetPreload,
+		shouldHandleSlideAssetEvent: a,
 		shouldPreloadSlideAsset: i
 	};
 }
@@ -2097,8 +2115,41 @@ function Sn(e) {
 	return bn[e], yn;
 }
 //#endregion
-//#region src/components/viewer-core/dominantImageTone.ts
+//#region src/components/viewer-core/useFullscreenAssetEvents.ts
 function Cn(e) {
+	function t(t, n) {
+		return e.fullscreenMedia.shouldHandleSlideAssetEvent(t, n) ? e.fullscreenMedia.getItemKey(n) : null;
+	}
+	function n(n, r, i) {
+		let a = t(r, i);
+		if (!a) return;
+		e.fullscreenMedia.settleAssetPreload(a), e.viewer.onImageLoad(a, i.url);
+		let o = n.currentTarget;
+		o instanceof HTMLImageElement && e.updateDominantToneFromImageElement(a, o);
+	}
+	async function r(n, r) {
+		let i = t(n, r);
+		i && (e.fullscreenMedia.settleAssetPreload(i), await e.viewer.onImageError(i, r.url));
+	}
+	function i(n, r, i) {
+		let a = t(n, r);
+		return a ? (e.viewer.onMediaEvent(a, i), a) : null;
+	}
+	async function a(n, r) {
+		let i = t(n, r);
+		i && (e.fullscreenMedia.settleAssetPreload(i), await e.viewer.onMediaError(i, r.url));
+	}
+	return {
+		getHandledItemKey: t,
+		onFullscreenImageError: r,
+		onFullscreenImageLoad: n,
+		onFullscreenMediaError: a,
+		onFullscreenMediaEvent: i
+	};
+}
+//#endregion
+//#region src/components/viewer-core/dominantImageTone.ts
+function wn(e) {
 	if (e.naturalWidth <= 0 || e.naturalHeight <= 0) return null;
 	let t = document.createElement("canvas"), n = t.getContext("2d", { willReadFrequently: !0 });
 	if (!n) return null;
@@ -2113,20 +2164,20 @@ function Cn(e) {
 			r += d, i += s * d, a += c * d, o += l * d;
 		}
 		return r <= 0 ? null : {
-			r: wn(Math.round(i / r)),
-			g: wn(Math.round(a / r)),
-			b: wn(Math.round(o / r))
+			r: Tn(Math.round(i / r)),
+			g: Tn(Math.round(a / r)),
+			b: Tn(Math.round(o / r))
 		};
 	} catch {
 		return null;
 	}
 }
-function wn(e) {
+function Tn(e) {
 	return Math.min(235, Math.max(26, e));
 }
 //#endregion
 //#region src/components/viewer-core/useFullscreenDominantTone.ts
-function Tn(e) {
+function En(e) {
 	let t = D({}), n = i(() => e.activeItem.value ? e.getItemKey(e.activeItem.value) : null), r = i(() => !e.showDominantImageTone.value || e.activeItem.value?.type !== "image" || !n.value || !e.isImageReady(n.value) ? null : t.value[n.value] ?? null), a = i(() => {
 		if (!r.value) return;
 		let { r: e, g: t, b: n } = r.value;
@@ -2141,7 +2192,7 @@ function Tn(e) {
 	});
 	function s(n, r) {
 		if (!e.showDominantImageTone.value) return;
-		let i = Cn(r);
+		let i = wn(r);
 		i && (t.value[n] = i);
 	}
 	return {
@@ -2152,7 +2203,7 @@ function Tn(e) {
 }
 //#endregion
 //#region src/components/SurfaceEmptyState.vue?vue&type=script&setup=true&lang.ts
-var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
+var Dn = ["data-surface"], On = ["data-surface"], kn = /* @__PURE__ */ d({
 	inheritAttrs: !1,
 	__name: "SurfaceEmptyState",
 	props: {
@@ -2166,31 +2217,31 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 			"data-testid": "vibe-empty-state-inline",
 			"data-surface": e.surface,
 			class: ["pointer-events-none absolute z-[4] text-center", e.surface === "grid" ? "inset-x-0 top-[clamp(6rem,22vh,11rem)] flex justify-center px-6" : "inset-0 grid place-items-center px-[clamp(2rem,4vw,3rem)] py-[clamp(2rem,4vw,3rem)]"]
-		}), [k(n.$slots, "default", {}, () => [c("p", { class: v(["m-0 text-[0.82rem] font-medium tracking-[0.08em]", e.surface === "grid" ? "text-[#f7f1ea]/58" : "text-[#f7f1ea]/64"]) }, j(e.message), 3)])], 16, En)) : (w(), s("div", g({ key: 1 }, N(t), { class: ["pointer-events-none absolute z-[4]", e.surface === "grid" ? "inset-x-0 bottom-0 flex justify-center px-6" : "bottom-[1.8rem] left-1/2 -translate-x-1/2 max-[720px]:bottom-[1.3rem]"] }), [k(n.$slots, "default", {}, () => [c("span", {
+		}), [k(n.$slots, "default", {}, () => [c("p", { class: v(["m-0 text-[0.82rem] font-medium tracking-[0.08em]", e.surface === "grid" ? "text-[#f7f1ea]/58" : "text-[#f7f1ea]/64"]) }, j(e.message), 3)])], 16, Dn)) : (w(), s("div", g({ key: 1 }, N(t), { class: ["pointer-events-none absolute z-[4]", e.surface === "grid" ? "inset-x-0 bottom-0 flex justify-center px-6" : "bottom-[1.8rem] left-1/2 -translate-x-1/2 max-[720px]:bottom-[1.3rem]"] }), [k(n.$slots, "default", {}, () => [c("span", {
 			"data-testid": "vibe-empty-state-badge",
 			"data-surface": e.surface,
 			class: v(["inline-flex items-center border border-white/14 backdrop-blur-[18px]", e.surface === "grid" ? "bg-black/55 px-4 py-3 text-[0.82rem] font-medium tracking-[0.08em] text-[#f7f1ea]/72" : "w-auto bg-black/40 px-5 py-3 text-[0.82rem] font-medium tracking-[0.08em] text-[#f7f1ea]/74 max-[720px]:w-[calc(100%-2.5rem)] max-[720px]:justify-center"])
-		}, j(e.message), 11, Dn)])], 16));
+		}, j(e.message), 11, On)])], 16));
 	}
-}), kn = { class: "relative h-full min-h-0 overflow-hidden bg-[#05060a] text-[#f7f1ea]" }, An = {
+}), An = { class: "relative h-full min-h-0 overflow-hidden bg-[#05060a] text-[#f7f1ea]" }, jn = {
 	key: 0,
 	class: "relative h-full min-h-0"
-}, jn = [
+}, Mn = [
 	"data-item-id",
 	"data-occurrence-key",
 	"data-index",
 	"data-active",
 	"aria-hidden"
-], Mn = {
+], Nn = {
 	key: 0,
 	"data-testid": "vibe-asset-spinner",
 	class: "pointer-events-none absolute inset-0 z-[2] grid place-items-center"
-}, Nn = { class: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-black/45 shadow-[0_18px_40px_-18px_rgba(0,0,0,0.85)] backdrop-blur-[18px]" }, Pn = ["data-kind"], Fn = { class: "grid justify-items-center gap-4 border border-white/14 bg-black/45 px-8 py-7 text-center backdrop-blur-[18px]" }, In = { class: "m-0 text-[0.82rem] font-bold uppercase tracking-[0.28em] text-[#f7f1ea]/70" }, Ln = ["onClick"], Rn = [
+}, Pn = { class: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-black/45 shadow-[0_18px_40px_-18px_rgba(0,0,0,0.85)] backdrop-blur-[18px]" }, Fn = ["data-kind"], In = { class: "grid justify-items-center gap-4 border border-white/14 bg-black/45 px-8 py-7 text-center backdrop-blur-[18px]" }, Ln = { class: "m-0 text-[0.82rem] font-bold uppercase tracking-[0.28em] text-[#f7f1ea]/70" }, Rn = ["onClick"], zn = [
 	"src",
 	"alt",
 	"onLoad",
 	"onError"
-], zn = [
+], Bn = [
 	"loop",
 	"src",
 	"preload",
@@ -2209,15 +2260,15 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 	"onStalled",
 	"onTimeupdate",
 	"onWaiting"
-], Bn = { class: "relative grid aspect-square w-[clamp(320px,46vw,560px)] max-w-[calc(100vw-2.5rem)] place-items-center" }, Vn = [
+], Vn = { class: "relative grid aspect-square w-[clamp(320px,46vw,560px)] max-w-[calc(100vw-2.5rem)] place-items-center" }, Hn = [
 	"aria-label",
 	"disabled",
 	"onClick"
-], Hn = { class: "relative z-[1] inline-flex min-h-[4.25rem] min-w-[4.25rem] items-center justify-center border border-white/18 bg-emerald-500/12 p-4 backdrop-blur-[20px]" }, Un = { class: "pointer-events-none absolute bottom-4 right-4 inline-flex h-10 w-10 items-center justify-center border border-white/14 bg-black/50 backdrop-blur-[18px]" }, Wn = {
+], Un = { class: "relative z-[1] inline-flex min-h-[4.25rem] min-w-[4.25rem] items-center justify-center border border-white/18 bg-emerald-500/12 p-4 backdrop-blur-[20px]" }, Wn = { class: "pointer-events-none absolute bottom-4 right-4 inline-flex h-10 w-10 items-center justify-center border border-white/14 bg-black/50 backdrop-blur-[18px]" }, Gn = {
 	key: 0,
 	"data-testid": "vibe-asset-spinner",
 	class: "pointer-events-none absolute inset-0 z-[3] grid place-items-center"
-}, Gn = { class: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-black/45 shadow-[0_18px_40px_-18px_rgba(0,0,0,0.85)] backdrop-blur-[18px]" }, Kn = ["data-kind"], qn = { class: "m-0 text-[0.82rem] font-bold uppercase tracking-[0.28em] text-[#f7f1ea]/70" }, Jn = ["onClick"], Yn = [
+}, Kn = { class: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-black/45 shadow-[0_18px_40px_-18px_rgba(0,0,0,0.85)] backdrop-blur-[18px]" }, qn = ["data-kind"], Jn = { class: "m-0 text-[0.82rem] font-bold uppercase tracking-[0.28em] text-[#f7f1ea]/70" }, Yn = ["onClick"], Xn = [
 	"src",
 	"preload",
 	"onCanplay",
@@ -2233,26 +2284,26 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 	"onStalled",
 	"onTimeupdate",
 	"onWaiting"
-], Xn = {
+], Zn = {
 	key: 2,
 	class: "relative z-[1] grid w-full max-w-[1100px] justify-items-center gap-6 px-[clamp(2rem,4vw,3rem)] py-[clamp(2rem,4vw,3rem)] text-center"
-}, Zn = { class: "inline-flex min-h-[4.25rem] min-w-[4.25rem] items-center justify-center border border-white/18 bg-white/8 p-4 backdrop-blur-[20px]" }, Qn = {
+}, Qn = { class: "inline-flex min-h-[4.25rem] min-w-[4.25rem] items-center justify-center border border-white/18 bg-white/8 p-4 backdrop-blur-[20px]" }, $n = {
 	key: 0,
 	"data-testid": "vibe-fullscreen-overlay",
 	class: "pointer-events-none absolute inset-0 z-[6]"
-}, $n = { class: "h-full w-full" }, er = {
+}, er = { class: "h-full w-full" }, tr = {
 	key: 1,
 	"data-testid": "vibe-forward-fill-placeholder",
 	class: "grid h-full min-h-0 place-items-center px-6 text-center"
-}, tr = { class: "grid justify-items-center gap-4 border border-white/14 bg-black/40 px-8 py-7 backdrop-blur-[18px]" }, nr = { class: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-black/45 shadow-[0_18px_40px_-18px_rgba(0,0,0,0.85)]" }, rr = { class: "m-0 text-[0.78rem] font-bold uppercase tracking-[0.24em] text-[#f7f1ea]/72" }, ir = {
+}, nr = { class: "grid justify-items-center gap-4 border border-white/14 bg-black/40 px-8 py-7 backdrop-blur-[18px]" }, rr = { class: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-black/45 shadow-[0_18px_40px_-18px_rgba(0,0,0,0.85)]" }, ir = { class: "m-0 text-[0.78rem] font-bold uppercase tracking-[0.24em] text-[#f7f1ea]/72" }, ar = {
 	key: 0,
 	"data-testid": "vibe-fullscreen-aside",
 	class: "h-full min-h-0 overflow-hidden border-l border-white/10 bg-black/45 backdrop-blur-[18px]"
-}, ar = { class: "h-full min-h-0 overflow-y-auto overscroll-y-contain" }, or = {
+}, or = { class: "h-full min-h-0 overflow-y-auto overscroll-y-contain" }, sr = {
 	key: 0,
 	"data-testid": "vibe-fullscreen-aside",
 	class: "absolute inset-y-0 right-0 z-[6] w-full max-w-[22rem] overflow-hidden border-l border-white/10 bg-black/82 backdrop-blur-[18px]"
-}, sr = { class: "h-full min-h-0 overflow-y-auto overscroll-y-contain" }, cr = 1280, lr = 768, ur = /* @__PURE__ */ d({
+}, cr = { class: "h-full min-h-0 overflow-y-auto overscroll-y-contain" }, lr = 1280, ur = 768, dr = /* @__PURE__ */ d({
 	__name: "FullscreenSurface",
 	props: {
 		active: {
@@ -2310,17 +2361,21 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 			enabled: M(d, "active"),
 			onAssetError: d.reportAssetError ?? void 0,
 			onAssetLoad: d.reportAssetLoad ?? void 0
-		}), _ = D(typeof window > "u" ? cr : window.innerWidth || cr), C = Ht({
+		}), _ = D(typeof window > "u" ? lr : window.innerWidth || lr), C = Ht({
 			active: M(d, "active"),
 			items: h.items,
 			resolvedActiveIndex: h.resolvedActiveIndex,
 			viewer: h
-		}), T = i(() => xn(h.activeItem.value?.type ?? "image")), { activeSlideToneStyle: E, activeStageToneStyle: P, updateFromImageElement: I } = Tn({
+		}), T = i(() => xn(h.activeItem.value?.type ?? "image")), { activeSlideToneStyle: E, activeStageToneStyle: P, updateFromImageElement: I } = En({
 			activeItem: h.activeItem,
 			getItemKey: C.getItemKey,
 			isImageReady: h.isImageReady,
 			showDominantImageTone: M(d, "showDominantImageTone")
-		}), L = i(() => h.activeMediaItem.value && !h.activeAssetErrorKind.value ? "bottom-[5.8rem] max-[720px]:bottom-[7.4rem]" : "bottom-[1.8rem] max-[720px]:bottom-[1.3rem]"), R = i(() => !!h.activeMediaItem.value && !h.activeAssetErrorKind.value), B = i(() => _.value < lr ? "vertical" : "horizontal"), te = i(() => R.value ? "pb-[5.75rem] max-[720px]:pb-[7rem]" : ""), V = i(() => d.activeIndex >= d.items.length && (d.loading || d.hasNextPage)), H = i(() => d.hasNextPage ? "Loading more items" : h.statusMessage.value ?? "Loading more items"), U = i(() => {
+		}), L = Cn({
+			fullscreenMedia: C,
+			updateDominantToneFromImageElement: _e,
+			viewer: h
+		}), R = i(() => h.activeMediaItem.value && !h.activeAssetErrorKind.value ? "bottom-[5.8rem] max-[720px]:bottom-[7.4rem]" : "bottom-[1.8rem] max-[720px]:bottom-[1.3rem]"), B = i(() => !!h.activeMediaItem.value && !h.activeAssetErrorKind.value), te = i(() => _.value < ur ? "vertical" : "horizontal"), V = i(() => B.value ? "pb-[5.75rem] max-[720px]:pb-[7rem]" : ""), H = i(() => d.activeIndex >= d.items.length && (d.loading || d.hasNextPage)), U = i(() => d.hasNextPage ? "Loading more items" : h.statusMessage.value ?? "Loading more items"), W = i(() => {
 			let e = h.activeItem.value;
 			return e ? {
 				hasNextPage: d.hasNextPage,
@@ -2330,14 +2385,14 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 				paginationDetail: d.paginationDetail,
 				total: d.items.length
 			} : null;
-		}), W = i(() => !U.value || !f["fullscreen-header-actions"] ? [] : f["fullscreen-header-actions"](U.value)), ne = i(() => !U.value || !f["fullscreen-aside"] ? [] : f["fullscreen-aside"](U.value)), G = i(() => !d.showStatusBadges || !U.value || !h.statusKind.value || !h.statusMessage.value ? null : {
-			...U.value,
+		}), ne = i(() => !W.value || !f["fullscreen-header-actions"] ? [] : f["fullscreen-header-actions"](W.value)), G = i(() => !W.value || !f["fullscreen-aside"] ? [] : f["fullscreen-aside"](W.value)), K = i(() => !d.showStatusBadges || !W.value || !h.statusKind.value || !h.statusMessage.value ? null : {
+			...W.value,
 			kind: h.statusKind.value,
 			message: h.statusMessage.value
-		}), K = i(() => !G.value || !f["fullscreen-status"] ? [] : f["fullscreen-status"](G.value)), q = i(() => ({
-			gridTemplateColumns: Y.value ? "minmax(0, 1fr) 22rem" : "minmax(0, 1fr) 0rem",
+		}), q = i(() => !K.value || !f["fullscreen-status"] ? [] : f["fullscreen-status"](K.value)), re = i(() => ({
+			gridTemplateColumns: ie.value ? "minmax(0, 1fr) 22rem" : "minmax(0, 1fr) 0rem",
 			transition: "grid-template-columns 320ms cubic-bezier(0.22, 1, 0.36, 1)"
-		})), re = i(() => Ut(W.value)), J = i(() => Ut(ne.value)), Y = i(() => J.value && _.value >= cr), ie = i(() => J.value && !Y.value), ae = i(() => Ut(K.value)), { emptyStateProps: X, showBadgeEmptyState: ue, showCustomEmptyState: de, showInlineEmptyState: fe } = Kt({
+		})), J = i(() => Ut(ne.value)), Y = i(() => Ut(G.value)), ie = i(() => Y.value && _.value >= lr), ae = i(() => Y.value && !ie.value), ue = i(() => Ut(q.value)), { emptyStateProps: X, showBadgeEmptyState: de, showCustomEmptyState: fe, showInlineEmptyState: Z } = Kt({
 			emptyStateMode: M(d, "emptyStateMode"),
 			itemCount: i(() => d.items.length),
 			loading: M(d, "loading"),
@@ -2345,59 +2400,48 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 			surface: "fullscreen"
 		});
 		S(() => {
-			window.addEventListener("resize", Z);
+			window.addEventListener("resize", pe);
 		}), x(() => {
-			window.removeEventListener("resize", Z);
+			window.removeEventListener("resize", pe);
 		});
-		function Z() {
-			_.value = window.innerWidth || cr;
-		}
-		function pe(e, t, n) {
-			C.settleAssetPreload(t), h.onImageLoad(t, n);
-			let r = e.currentTarget;
-			r instanceof HTMLImageElement && ye(t, r);
+		function pe() {
+			_.value = window.innerWidth || lr;
 		}
-		async function me(e, t) {
-			C.settleAssetPreload(e), await h.onImageError(e, t);
+		function me(e, t) {
+			C.registerImageElement(e, t), h.registerImageElement(e, t), t instanceof HTMLImageElement && _e(e, t);
 		}
 		function he(e, t) {
-			C.registerImageElement(e, t), h.registerImageElement(e, t), t instanceof HTMLImageElement && ye(e, t);
-		}
-		function ge(e, t) {
 			C.registerMediaElement(e, t), h.registerVideoElement(e, t);
 		}
-		function _e(e, t) {
+		function ge(e, t) {
 			C.registerMediaElement(e, t), h.registerAudioElement(e, t);
 		}
-		async function ve(e, t) {
-			C.settleAssetPreload(e), await h.onMediaError(e, t);
+		function Q(e, t, n) {
+			let r = L.onFullscreenMediaEvent(e, t, n), i = n.currentTarget, a = typeof HTMLMediaElement > "u" ? 1 : HTMLMediaElement.HAVE_METADATA;
+			r && i instanceof HTMLMediaElement && i.readyState >= a && C.settleAssetPreload(r);
 		}
-		function Q(e, t) {
-			h.onMediaEvent(e, t);
-			let n = t.currentTarget, r = typeof HTMLMediaElement > "u" ? 1 : HTMLMediaElement.HAVE_METADATA;
-			n instanceof HTMLMediaElement && n.readyState >= r && C.settleAssetPreload(e);
-		}
-		function ye(e, t) {
+		function _e(e, t) {
 			I(e, t);
 		}
-		function be(e, t) {
-			if (Q(t, e), !d.loopFullscreenVideo) return;
-			let n = e.currentTarget;
-			if (!(n instanceof HTMLVideoElement)) return;
+		function ve(e, t, n) {
+			let r = L.getHandledItemKey(t, n);
+			if (!r || (h.onMediaEvent(r, e), !d.loopFullscreenVideo)) return;
+			let i = e.currentTarget;
+			if (!(i instanceof HTMLVideoElement)) return;
 			try {
-				n.currentTime = 0;
+				i.currentTime = 0;
 			} catch {}
-			let r = n.play();
-			r && typeof r.catch == "function" && r.catch(() => {});
+			let a = i.play();
+			a && typeof a.catch == "function" && a.catch(() => {});
 		}
-		return (e, n) => (w(), s("div", kn, [
+		return (e, n) => (w(), s("div", An, [
 			c("div", {
 				class: v(["absolute inset-0 transition-[background] duration-200", T.value]),
 				style: b(N(P))
 			}, null, 6),
 			c("div", {
 				class: "relative z-[1] grid h-full min-h-0",
-				style: b(q.value)
+				style: b(re.value)
 			}, [c("div", {
 				ref: "viewer.stageRef",
 				"data-testid": "vibe-stage",
@@ -2407,7 +2451,7 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 				onPointerup: n[3] ||= (...e) => N(h).onPointerUp && N(h).onPointerUp(...e),
 				onPointercancel: n[4] ||= (...e) => N(h).onPointerCancel && N(h).onPointerCancel(...e),
 				onWheel: n[5] ||= (...e) => N(h).onWheel && N(h).onWheel(...e)
-			}, [N(h).activeItem.value ? (w(), s("div", An, [
+			}, [N(h).activeItem.value ? (w(), s("div", jn, [
 				(w(!0), s(t, null, O(N(h).renderedItems.value, ({ item: r, index: i }) => (w(), s("article", {
 					key: N(C).getItemKey(r),
 					"data-testid": "vibe-slide",
@@ -2423,8 +2467,8 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 					style: b(i === N(h).resolvedActiveIndex.value && r.type === "image" ? N(E) : void 0)
 				}, null, 6), N(h).isVisual(r) ? (w(), s("div", {
 					key: 0,
-					class: v(["relative z-[1] flex h-full w-full items-center justify-center overflow-hidden", i === N(h).resolvedActiveIndex.value ? te.value : ""])
-				}, [N(C).isAssetLoading(i, r) ? (w(), s("div", Mn, [c("span", Nn, [u(N(oe), {
+					class: v(["relative z-[1] flex h-full w-full items-center justify-center overflow-hidden", i === N(h).resolvedActiveIndex.value ? V.value : ""])
+				}, [N(C).isAssetLoading(i, r) ? (w(), s("div", Nn, [c("span", Pn, [u(N(oe), {
 					class: "h-5 w-5 animate-spin stroke-[1.9] text-[#f7f1ea]/78",
 					"aria-hidden": "true"
 				})])])) : o("", !0), N(C).isAssetErrored(i, r) ? (w(), s("div", {
@@ -2432,19 +2476,19 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 					"data-testid": "vibe-asset-error",
 					"data-kind": N(C).getAssetErrorKind(r),
 					class: "grid h-full w-full place-items-center"
-				}, [c("div", Fn, [
+				}, [c("div", In, [
 					u(N(le), {
 						class: "h-7 w-7 stroke-[1.9] text-[#f7f1ea]/72",
 						"aria-hidden": "true"
 					}),
-					c("p", In, j(N(C).getAssetErrorLabel(r)), 1),
+					c("p", Ln, j(N(C).getAssetErrorLabel(r)), 1),
 					N(h).canRetryAsset(N(C).getItemKey(r)) ? (w(), s("button", {
 						key: 0,
 						type: "button",
 						class: "inline-flex items-center justify-center border border-white/14 bg-black/35 px-4 py-2 text-[0.64rem] font-bold uppercase tracking-[0.22em] text-[#f7f1ea]/82 backdrop-blur-[18px] transition hover:border-white/28 hover:bg-black/50",
 						onClick: ee((e) => N(h).retryAsset(N(C).getItemKey(r)), ["stop"])
-					}, " Retry ", 8, Ln)) : o("", !0)
-				])], 8, Pn)) : r.type === "image" ? (w(), s("img", {
+					}, " Retry ", 8, Rn)) : o("", !0)
+				])], 8, Fn)) : r.type === "image" ? (w(), s("img", {
 					key: N(h).getAssetRenderKey(N(C).getItemKey(r)),
 					src: N(C).getFullscreenImageSource(i, r),
 					alt: r.title ?? "",
@@ -2452,10 +2496,10 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 					draggable: "false",
 					class: v(["block h-auto max-h-full w-auto max-w-full object-contain shadow-[0_40px_120px_-60px_rgba(0,0,0,0.9)] transition-opacity duration-300", N(h).isImageReady(N(C).getItemKey(r)) ? "opacity-100" : "opacity-0"]),
 					ref_for: !0,
-					ref: (e) => he(N(C).getItemKey(r), e),
-					onLoad: (e) => pe(e, N(C).getItemKey(r), r.url),
-					onError: (e) => me(N(C).getItemKey(r), r.url)
-				}, null, 42, Rn)) : (w(), s("video", {
+					ref: (e) => me(N(C).getItemKey(r), e),
+					onLoad: (e) => N(L).onFullscreenImageLoad(e, i, r),
+					onError: (e) => N(L).onFullscreenImageError(i, r)
+				}, null, 42, zn)) : (w(), s("video", {
 					key: N(h).getAssetRenderKey(N(C).getItemKey(r)),
 					class: v(["block h-auto max-h-full w-auto max-w-full cursor-pointer object-contain shadow-[0_40px_120px_-60px_rgba(0,0,0,0.9)] transition-opacity duration-300", N(h).isMediaReady(N(C).getItemKey(r)) ? "opacity-100" : "opacity-0"]),
 					playsinline: "",
@@ -2463,26 +2507,26 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 					src: N(C).getFullscreenMediaSource(i, r),
 					preload: N(C).getFullscreenMediaPreload(i),
 					ref_for: !0,
-					ref: (e) => ge(N(C).getItemKey(r), e),
+					ref: (e) => he(N(C).getItemKey(r), e),
 					onClick: ee((e) => N(h).onVideoClick(e, N(C).getItemKey(r)), ["stop"]),
-					onCanplay: (e) => Q(N(C).getItemKey(r), e),
-					onDurationchange: (e) => Q(N(C).getItemKey(r), e),
-					onEnded: (e) => be(e, N(C).getItemKey(r)),
-					onError: (e) => ve(N(C).getItemKey(r), r.url),
-					onLoadstart: (e) => Q(N(C).getItemKey(r), e),
-					onLoadedmetadata: (e) => Q(N(C).getItemKey(r), e),
-					onPause: (e) => Q(N(C).getItemKey(r), e),
-					onPlay: (e) => Q(N(C).getItemKey(r), e),
-					onPlaying: (e) => Q(N(C).getItemKey(r), e),
-					onSeeking: (e) => Q(N(C).getItemKey(r), e),
-					onSeeked: (e) => Q(N(C).getItemKey(r), e),
-					onStalled: (e) => Q(N(C).getItemKey(r), e),
-					onTimeupdate: (e) => Q(N(C).getItemKey(r), e),
-					onWaiting: (e) => Q(N(C).getItemKey(r), e)
-				}, null, 42, zn))], 2)) : N(h).isAudio(r) ? (w(), s("div", {
+					onCanplay: (e) => Q(i, r, e),
+					onDurationchange: (e) => Q(i, r, e),
+					onEnded: (e) => ve(e, i, r),
+					onError: (e) => N(L).onFullscreenMediaError(i, r),
+					onLoadstart: (e) => Q(i, r, e),
+					onLoadedmetadata: (e) => Q(i, r, e),
+					onPause: (e) => Q(i, r, e),
+					onPlay: (e) => Q(i, r, e),
+					onPlaying: (e) => Q(i, r, e),
+					onSeeking: (e) => Q(i, r, e),
+					onSeeked: (e) => Q(i, r, e),
+					onStalled: (e) => Q(i, r, e),
+					onTimeupdate: (e) => Q(i, r, e),
+					onWaiting: (e) => Q(i, r, e)
+				}, null, 42, Bn))], 2)) : N(h).isAudio(r) ? (w(), s("div", {
 					key: 1,
-					class: v(["relative z-[1] grid w-full max-w-[1100px] justify-items-center gap-6 px-[clamp(2rem,4vw,3rem)] py-[clamp(2rem,4vw,3rem)] text-center", i === N(h).resolvedActiveIndex.value ? te.value : ""])
-				}, [c("div", Bn, [
+					class: v(["relative z-[1] grid w-full max-w-[1100px] justify-items-center gap-6 px-[clamp(2rem,4vw,3rem)] py-[clamp(2rem,4vw,3rem)] text-center", i === N(h).resolvedActiveIndex.value ? V.value : ""])
+				}, [c("div", Vn, [
 					c("button", {
 						type: "button",
 						class: "relative grid h-full w-full place-items-center border border-white/12 bg-[linear-gradient(180deg,rgba(255,255,255,0.04),rgba(255,255,255,0.02)),radial-gradient(circle_at_center,rgba(16,185,129,0.14),transparent_58%)] text-[#f7f1ea] transition-[border-color,background] duration-200 hover:border-white/30 hover:bg-[linear-gradient(180deg,rgba(255,255,255,0.07),rgba(255,255,255,0.03)),radial-gradient(circle_at_center,rgba(16,185,129,0.18),transparent_58%)] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-4 focus-visible:outline-[#f7f1ea]",
@@ -2492,19 +2536,19 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 					}, [
 						n[6] ||= c("span", { class: "pointer-events-none absolute inset-0 border border-white/8 bg-[radial-gradient(circle,rgba(16,185,129,0.16),transparent_66%)]" }, null, -1),
 						n[7] ||= c("span", { class: "pointer-events-none absolute h-[clamp(220px,30vw,360px)] w-[clamp(220px,30vw,360px)] border border-white/8 bg-[radial-gradient(circle,rgba(255,255,255,0.08),transparent_62%)]" }, null, -1),
-						c("span", Hn, [k(e.$slots, "item-icon", {
+						c("span", Un, [k(e.$slots, "item-icon", {
 							icon: N(Ot)(r.type),
 							item: r
 						}, () => [(w(), a(A(N(Ot)(r.type)), {
 							class: "h-6 w-6 stroke-[1.9]",
 							"aria-hidden": "true"
 						}))])]),
-						c("span", Un, [(w(), a(A(N(h).mediaStates.value[N(C).getItemKey(r)]?.paused ?? !0 ? N(ce) : N(se)), {
+						c("span", Wn, [(w(), a(A(N(h).mediaStates.value[N(C).getItemKey(r)]?.paused ?? !0 ? N(ce) : N(se)), {
 							class: "h-4 w-4 stroke-2",
 							"aria-hidden": "true"
 						}))])
-					], 8, Vn),
-					N(C).isAssetLoading(i, r) ? (w(), s("div", Wn, [c("span", Gn, [u(N(oe), {
+					], 8, Hn),
+					N(C).isAssetLoading(i, r) ? (w(), s("div", Gn, [c("span", Kn, [u(N(oe), {
 						class: "h-5 w-5 animate-spin stroke-[1.9] text-[#f7f1ea]/78",
 						"aria-hidden": "true"
 					})])])) : o("", !0),
@@ -2517,42 +2561,42 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 							class: "h-7 w-7 stroke-[1.9] text-[#f7f1ea]/72",
 							"aria-hidden": "true"
 						}),
-						c("p", qn, j(N(C).getAssetErrorLabel(r)), 1),
+						c("p", Jn, j(N(C).getAssetErrorLabel(r)), 1),
 						N(h).canRetryAsset(N(C).getItemKey(r)) ? (w(), s("button", {
 							key: 0,
 							type: "button",
 							class: "pointer-events-auto inline-flex items-center justify-center border border-white/14 bg-black/35 px-4 py-2 text-[0.64rem] font-bold uppercase tracking-[0.22em] text-[#f7f1ea]/82 backdrop-blur-[18px] transition hover:border-white/28 hover:bg-black/50",
 							onClick: ee((e) => N(h).retryAsset(N(C).getItemKey(r)), ["stop"])
-						}, " Retry ", 8, Jn)) : o("", !0)
-					], 8, Kn)], 64)) : o("", !0)
+						}, " Retry ", 8, Yn)) : o("", !0)
+					], 8, qn)], 64)) : o("", !0)
 				]), (w(), s("audio", {
 					key: N(h).getAssetRenderKey(N(C).getItemKey(r)),
 					src: N(C).getFullscreenMediaSource(i, r),
 					preload: N(C).getFullscreenMediaPreload(i),
 					class: "pointer-events-none absolute h-px w-px opacity-0",
 					ref_for: !0,
-					ref: (e) => _e(N(C).getItemKey(r), e),
-					onCanplay: (e) => Q(N(C).getItemKey(r), e),
-					onDurationchange: (e) => Q(N(C).getItemKey(r), e),
-					onError: (e) => ve(N(C).getItemKey(r), r.url),
-					onLoadstart: (e) => Q(N(C).getItemKey(r), e),
-					onLoadedmetadata: (e) => Q(N(C).getItemKey(r), e),
-					onPause: (e) => Q(N(C).getItemKey(r), e),
-					onPlay: (e) => Q(N(C).getItemKey(r), e),
-					onPlaying: (e) => Q(N(C).getItemKey(r), e),
-					onSeeking: (e) => Q(N(C).getItemKey(r), e),
-					onSeeked: (e) => Q(N(C).getItemKey(r), e),
-					onStalled: (e) => Q(N(C).getItemKey(r), e),
-					onTimeupdate: (e) => Q(N(C).getItemKey(r), e),
-					onWaiting: (e) => Q(N(C).getItemKey(r), e)
-				}, null, 40, Yn))], 2)) : (w(), s("div", Xn, [c("div", Zn, [k(e.$slots, "item-icon", {
+					ref: (e) => ge(N(C).getItemKey(r), e),
+					onCanplay: (e) => Q(i, r, e),
+					onDurationchange: (e) => Q(i, r, e),
+					onError: (e) => N(L).onFullscreenMediaError(i, r),
+					onLoadstart: (e) => Q(i, r, e),
+					onLoadedmetadata: (e) => Q(i, r, e),
+					onPause: (e) => Q(i, r, e),
+					onPlay: (e) => Q(i, r, e),
+					onPlaying: (e) => Q(i, r, e),
+					onSeeking: (e) => Q(i, r, e),
+					onSeeked: (e) => Q(i, r, e),
+					onStalled: (e) => Q(i, r, e),
+					onTimeupdate: (e) => Q(i, r, e),
+					onWaiting: (e) => Q(i, r, e)
+				}, null, 40, Xn))], 2)) : (w(), s("div", Zn, [c("div", Qn, [k(e.$slots, "item-icon", {
 					icon: N(Ot)(r.type),
 					item: r
 				}, () => [(w(), a(A(N(Ot)(r.type)), {
 					class: "h-6 w-6 stroke-[1.9]",
 					"aria-hidden": "true"
-				}))])])]))], 14, jn))), 128)),
-				U.value && f["fullscreen-overlay"] ? (w(), s("div", Qn, [c("div", $n, [k(e.$slots, "fullscreen-overlay", y(p(U.value)))])])) : o("", !0),
+				}))])])]))], 14, Mn))), 128)),
+				W.value && f["fullscreen-overlay"] ? (w(), s("div", $n, [c("div", er, [k(e.$slots, "fullscreen-overlay", y(p(W.value)))])])) : o("", !0),
 				N(h).activeItem.value ? (w(), a(Tt, {
 					key: 1,
 					"current-index": N(h).resolvedActiveIndex.value,
@@ -2563,9 +2607,9 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 					title: N(h).activeItem.value.title ?? null,
 					total: N(h).items.value.length,
 					onBackToList: n[0] ||= (e) => m("back-to-list")
-				}, l({ _: 2 }, [re.value && U.value ? {
+				}, l({ _: 2 }, [J.value && W.value ? {
 					name: "actions",
-					fn: z(() => [k(e.$slots, "fullscreen-header-actions", y(p(U.value)))]),
+					fn: z(() => [k(e.$slots, "fullscreen-header-actions", y(p(W.value)))]),
 					key: "0"
 				} : void 0]), 1032, [
 					"current-index",
@@ -2576,7 +2620,7 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 					"title",
 					"total"
 				])) : o("", !0),
-				R.value ? (w(), a(mt, {
+				B.value ? (w(), a(mt, {
 					key: 2,
 					"current-time": N(h).activeMediaState.value.currentTime,
 					"current-time-label": N(h).formatPlaybackTime(N(h).activeMediaState.value.currentTime),
@@ -2585,7 +2629,7 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 					muted: N(h).activeMediaState.value.muted,
 					progress: N(h).activeMediaProgress.value,
 					volume: N(h).activeMediaState.value.volume,
-					"volume-control-layout": B.value,
+					"volume-control-layout": te.value,
 					onSeekInput: N(h).onMediaSeekInput,
 					onVolumeInput: N(h).onMediaVolumeInput,
 					onVolumeToggle: N(h).onMediaVolumeToggle
@@ -2602,36 +2646,36 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 					"onVolumeInput",
 					"onVolumeToggle"
 				])) : o("", !0),
-				G.value ? (w(), s("div", {
+				K.value ? (w(), s("div", {
 					key: 3,
-					class: v(["absolute left-1/2 z-[4] -translate-x-1/2", L.value])
-				}, [ae.value ? k(e.$slots, "fullscreen-status", y(g({ key: 0 }, G.value))) : (w(), s("div", {
+					class: v(["absolute left-1/2 z-[4] -translate-x-1/2", R.value])
+				}, [ue.value ? k(e.$slots, "fullscreen-status", y(g({ key: 0 }, K.value))) : (w(), s("div", {
 					key: 1,
 					"data-testid": "vibe-fullscreen-status-badge",
-					class: v(["inline-flex w-auto items-center border border-white/14 bg-black/40 px-5 py-3 text-[0.75rem] font-bold uppercase tracking-[0.18em] text-[#f7f1ea]/74 backdrop-blur-[18px] max-[720px]:w-[calc(100%-2.5rem)] max-[720px]:justify-center", G.value.kind === "end" ? "border-amber-300/35 text-amber-200" : G.value.kind === "failed" ? "border-rose-400/45 text-rose-100" : ""])
-				}, j(G.value.message), 3))], 2)) : o("", !0)
-			])) : V.value ? (w(), s("div", er, [c("div", tr, [c("span", nr, [u(N(oe), {
+					class: v(["inline-flex w-auto items-center border border-white/14 bg-black/40 px-5 py-3 text-[0.75rem] font-bold uppercase tracking-[0.18em] text-[#f7f1ea]/74 backdrop-blur-[18px] max-[720px]:w-[calc(100%-2.5rem)] max-[720px]:justify-center", K.value.kind === "end" ? "border-amber-300/35 text-amber-200" : K.value.kind === "failed" ? "border-rose-400/45 text-rose-100" : ""])
+				}, j(K.value.message), 3))], 2)) : o("", !0)
+			])) : H.value ? (w(), s("div", tr, [c("div", nr, [c("span", rr, [u(N(oe), {
 				class: "h-5 w-5 animate-spin stroke-[1.9] text-[#f7f1ea]/78",
 				"aria-hidden": "true"
-			})]), c("p", rr, j(H.value), 1)])])) : N(fe) && N(X) ? (w(), a(On, {
+			})]), c("p", ir, j(U.value), 1)])])) : N(Z) && N(X) ? (w(), a(kn, {
 				key: 2,
 				message: N(X).message,
 				mode: N(X).mode,
 				surface: N(X).surface
 			}, {
-				default: z(() => [N(de) ? k(e.$slots, "empty-state", y(g({ key: 0 }, N(X)))) : o("", !0)]),
+				default: z(() => [N(fe) ? k(e.$slots, "empty-state", y(g({ key: 0 }, N(X)))) : o("", !0)]),
 				_: 3
 			}, 8, [
 				"message",
 				"mode",
 				"surface"
-			])) : o("", !0), N(ue) && N(X) ? (w(), a(On, {
+			])) : o("", !0), N(de) && N(X) ? (w(), a(kn, {
 				key: 3,
 				message: N(X).message,
 				mode: N(X).mode,
 				surface: N(X).surface
 			}, {
-				default: z(() => [N(de) ? k(e.$slots, "empty-state", y(g({ key: 0 }, N(X)))) : o("", !0)]),
+				default: z(() => [N(fe) ? k(e.$slots, "empty-state", y(g({ key: 0 }, N(X)))) : o("", !0)]),
 				_: 3
 			}, 8, [
 				"message",
@@ -2645,7 +2689,7 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 				"leave-from-class": "translate-x-0 opacity-100",
 				"leave-to-class": "translate-x-full opacity-0"
 			}, {
-				default: z(() => [Y.value && U.value ? (w(), s("aside", ir, [c("div", ar, [k(e.$slots, "fullscreen-aside", y(p(U.value)))])])) : o("", !0)]),
+				default: z(() => [ie.value && W.value ? (w(), s("aside", ar, [c("div", or, [k(e.$slots, "fullscreen-aside", y(p(W.value)))])])) : o("", !0)]),
 				_: 3
 			})], 4),
 			u(r, {
@@ -2656,29 +2700,29 @@ var En = ["data-surface"], Dn = ["data-surface"], On = /* @__PURE__ */ d({
 				"leave-from-class": "translate-x-0 opacity-100",
 				"leave-to-class": "translate-x-full opacity-0"
 			}, {
-				default: z(() => [ie.value && U.value ? (w(), s("aside", or, [c("div", sr, [k(e.$slots, "fullscreen-aside", y(p(U.value)))])])) : o("", !0)]),
+				default: z(() => [ae.value && W.value ? (w(), s("aside", sr, [c("div", cr, [k(e.$slots, "fullscreen-aside", y(p(W.value)))])])) : o("", !0)]),
 				_: 3
 			})
 		]));
 	}
-}), dr = 1, fr = .5;
-function pr(e) {
+}), fr = 1, pr = .5;
+function mr(e) {
 	if (e.type !== "image" && e.type !== "video") return {
-		width: dr,
-		height: dr,
+		width: fr,
+		height: fr,
 		source: "fallback"
 	};
 	let t = e.preview?.width, n = e.preview?.height;
-	if (br(t) && br(n)) {
-		let r = xr(e, t, n);
+	if (xr(t) && xr(n)) {
+		let r = Sr(e, t, n);
 		return {
 			width: r.width,
 			height: r.height,
 			source: "preview"
 		};
 	}
-	if (br(e.width) && br(e.height)) {
-		let t = xr(e, e.width, e.height);
+	if (xr(e.width) && xr(e.height)) {
+		let t = Sr(e, e.width, e.height);
 		return {
 			width: t.width,
 			height: t.height,
@@ -2686,31 +2730,31 @@ function pr(e) {
 		};
 	}
 	return {
-		width: dr,
-		height: dr,
+		width: fr,
+		height: fr,
 		source: "fallback"
 	};
 }
-function mr(e, t) {
+function hr(e, t) {
 	return !e || e <= 0 || !t || t <= 0 ? 1 : Math.max(1, Math.floor(e / t));
 }
-function hr(e, t, n, r = 0) {
+function gr(e, t, n, r = 0) {
 	if (!e || e <= 0 || !t || t <= 0) return n;
 	let i = typeof r == "number" && r > 0 ? r : 0, a = e - Math.max(0, t - 1) * i;
 	return !a || a <= 0 ? n : a / t;
 }
-function gr(e, t) {
-	let n = pr(e);
+function _r(e, t) {
+	let n = mr(e);
 	return n.height / n.width * t;
 }
-function _r(e, t) {
+function vr(e, t) {
 	let n = Array.from({ length: t.columnCount }, () => 0), r = Array(e.length), i = Array(e.length), a = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map(), s = 0;
 	for (let c = 0; c < e.length; c += 1) {
 		let l = e[c];
 		o.set($(l), c);
 		let u = 0;
 		for (let e = 1; e < n.length; e += 1) n[e] < n[u] && (u = e);
-		let d = u * (t.columnWidth + t.gapX), f = n[u], p = gr(l, t.columnWidth);
+		let d = u * (t.columnWidth + t.gapX), f = n[u], p = _r(l, t.columnWidth);
 		r[c] = {
 			x: d,
 			y: f
@@ -2729,7 +2773,7 @@ function _r(e, t) {
 		indexById: o
 	};
 }
-function vr(e) {
+function yr(e) {
 	if (e.itemCount <= 0) return [];
 	if (e.viewportHeight <= 0) return Array.from({ length: e.itemCount }, (e, t) => t);
 	let t = Math.max(0, e.scrollTop - e.overscanPx), n = e.scrollTop + e.viewportHeight + e.overscanPx, r = Math.floor(t / e.bucketPx), i = Math.floor(n / e.bucketPx), a = /* @__PURE__ */ new Set();
@@ -2739,7 +2783,7 @@ function vr(e) {
 	}
 	return Array.from(a).sort((e, t) => e - t);
 }
-function yr(e, t, n) {
+function br(e, t, n) {
 	let r = /* @__PURE__ */ new Map();
 	for (let i of e) {
 		let e = t.get($(i));
@@ -2749,11 +2793,11 @@ function yr(e, t, n) {
 	}
 	return r;
 }
-function br(e) {
+function xr(e) {
 	return typeof e == "number" && Number.isFinite(e) && e > 0;
 }
-function xr(e, t, n) {
-	return e.type !== "image" || n / t >= fr ? {
+function Sr(e, t, n) {
+	return e.type !== "image" || n / t >= pr ? {
 		width: t,
 		height: n
 	} : {
@@ -2763,21 +2807,21 @@ function xr(e, t, n) {
 }
 //#endregion
 //#region src/components/viewer-core/useMasonryMotion.ts
-var Sr = 300, Cr = 600, wr = 40, Tr = 300, Er = 400;
-function Dr(e, t) {
+var Cr = 300, wr = 600, Tr = 40, Er = 300, Dr = 400;
+function Or(e, t) {
 	return t === "top" ? [...e].reverse() : e;
 }
-function Or(e) {
-	return e <= 0 ? Cr : Cr + Math.min((e - 1) * wr, Er);
+function kr(e) {
+	return e <= 0 ? wr : wr + Math.min((e - 1) * Tr, Dr);
 }
-function kr() {
-	return Tr;
+function Ar() {
+	return Er;
 }
-function Ar(e) {
+function jr(e) {
 	let t = e.itemHeight > 0 ? e.itemHeight : e.columnWidth;
 	return e.direction === "top" ? e.scrollTop - t : e.scrollTop + e.viewportHeight + t;
 }
-function jr(e) {
+function Mr(e) {
 	let t = D(/* @__PURE__ */ new Set()), n = D(/* @__PURE__ */ new Set()), r = D(/* @__PURE__ */ new Map()), a = D(/* @__PURE__ */ new Map()), o = D(/* @__PURE__ */ new Map()), s = D(/* @__PURE__ */ new Set()), c = D(/* @__PURE__ */ new Map()), l = D(/* @__PURE__ */ new Map()), u = D(/* @__PURE__ */ new Set()), d = /* @__PURE__ */ new Set(), f = /* @__PURE__ */ new Set(), p = i(() => Array.from(o.value.values()));
 	L(e.visibleIndices, (i) => {
 		if (!i.length) return;
@@ -2787,20 +2831,20 @@ function jr(e) {
 			!r || !t.value.has(r) || d.has(r) || (d.add(r), o.push(r));
 		}
 		if (!o.length) return;
-		let s = Dr(o, a.value.get(o[0]) ?? "bottom"), c = new Map(r.value);
-		for (let e = 0; e < s.length; e += 1) c.set(s[e], Math.min(e * wr, Er));
-		r.value = c, Mr(() => {
+		let s = Or(o, a.value.get(o[0]) ?? "bottom"), c = new Map(r.value);
+		for (let e = 0; e < s.length; e += 1) c.set(s[e], Math.min(e * Tr, Dr));
+		r.value = c, Nr(() => {
 			let e = new Set(n.value);
 			for (let t of o) e.add(t);
 			n.value = e;
-		}), Nr(() => {
+		}), Pr(() => {
 			let e = new Set(t.value);
 			for (let t of o) e.delete(t);
 			t.value = e, S(() => {
 				let e = new Set(n.value), t = new Map(r.value), i = new Map(a.value);
 				for (let n of o) e.delete(n), t.delete(n), i.delete(n), d.delete(n);
 				n.value = e, r.value = t, a.value = i;
-			}, Or(o.length));
+			}, kr(o.length));
 		});
 	}, { flush: "post" }), L(() => e.items.value.map((e) => $(e)), (e) => {
 		if (!e.length || !o.value.size) return;
@@ -2827,7 +2871,7 @@ function jr(e) {
 			let e = $(t.item);
 			p.push(e), i.set(e, t), c.delete(e), l.delete(e), u.delete(e), f.delete(e), d.delete(e);
 		}
-		o.value = i, t.value = c, n.value = l, r.value = u, a.value = f, Mr(() => {
+		o.value = i, t.value = c, n.value = l, r.value = u, a.value = f, Nr(() => {
 			let e = new Set(s.value);
 			for (let t of p) e.add(t);
 			s.value = e;
@@ -2835,9 +2879,9 @@ function jr(e) {
 			let e = new Map(o.value), t = new Set(s.value);
 			for (let n of p) e.delete(n), t.delete(n);
 			o.value = e, s.value = t;
-		}, Tr);
+		}, Er);
 	}
-	function g(t, n, r = Sr) {
+	function g(t, n, r = Cr) {
 		if (!t.size) return;
 		let i = /* @__PURE__ */ new Map(), a = [];
 		for (let [r, o] of t.entries()) {
@@ -2856,8 +2900,8 @@ function jr(e) {
 		c.value = i, u.value = /* @__PURE__ */ new Set();
 		let o = new Map(l.value);
 		for (let e of a) o.set(e, r);
-		l.value = o, Mr(() => {
-			u.value = new Set(a), Mr(() => {
+		l.value = o, Nr(() => {
+			u.value = new Set(a), Nr(() => {
 				c.value = /* @__PURE__ */ new Map();
 			});
 		}), S(() => {
@@ -2868,8 +2912,8 @@ function jr(e) {
 		}, r);
 	}
 	function _(e) {
-		if (n.value.has(e)) return `transform ${Cr}ms ease-out`;
-		if (u.value.has(e)) return `transform ${l.value.get(e) ?? Sr}ms ease-out`;
+		if (n.value.has(e)) return `transform ${wr}ms ease-out`;
+		if (u.value.has(e)) return `transform ${l.value.get(e) ?? Cr}ms ease-out`;
 	}
 	function v(e) {
 		if (!n.value.has(e)) return;
@@ -2886,7 +2930,7 @@ function jr(e) {
 		} : {
 			dx: 0,
 			dy: 0
-		}, u = s ? a.value.get(s) ?? "bottom" : "bottom", d = s && t.value.has(s) ? Ar({
+		}, u = s ? a.value.get(s) ?? "bottom" : "bottom", d = s && t.value.has(s) ? jr({
 			columnWidth: e.columnWidth.value,
 			direction: u,
 			itemHeight: o,
@@ -2900,14 +2944,14 @@ function jr(e) {
 		if (!r) return {
 			opacity: "0",
 			transform: "translate3d(0, 0, 0) scale(0.96)",
-			transition: `opacity ${Tr}ms ease-out, transform ${Tr}ms ease-out`
+			transition: `opacity ${Er}ms ease-out, transform ${Er}ms ease-out`
 		};
 		let i = s.value.has(n);
 		return {
 			height: `${r.height}px`,
 			opacity: i ? "0" : "1",
 			transform: `translate3d(${r.position.x}px, ${r.position.y}px, 0) scale(${i ? "0.96" : "1"})`,
-			transition: `opacity ${Tr}ms ease-out, transform ${Tr}ms ease-out`,
+			transition: `opacity ${Er}ms ease-out, transform ${Er}ms ease-out`,
 			width: `${e.columnWidth.value}px`
 		};
 	}
@@ -2928,28 +2972,28 @@ function jr(e) {
 		playFlipMoveAnimation: g
 	};
 }
-function Mr(e) {
+function Nr(e) {
 	if (typeof requestAnimationFrame == "function") {
 		requestAnimationFrame(() => e());
 		return;
 	}
 	setTimeout(e, 0);
 }
-function Nr(e) {
-	Mr(() => Mr(e));
+function Pr(e) {
+	Nr(() => Nr(e));
 }
 //#endregion
 //#region src/components/viewer-core/masonryViewport.ts
-function Pr(e, t) {
+function Fr(e, t) {
 	return e?.clientHeight || Math.round(e?.getBoundingClientRect().height ?? 0) || t || window.innerHeight || 1;
 }
-function Fr(e, t, n) {
+function Ir(e, t, n) {
 	return e?.clientWidth || Math.round(e?.getBoundingClientRect().width ?? 0) || t || window.innerWidth || n;
 }
-function Ir(e, t, n, r) {
+function Lr(e, t, n, r) {
 	return (e?.scrollHeight ?? r) - (t + n);
 }
-function Lr(e, t) {
+function Rr(e, t) {
 	return {
 		height: `${e}px`,
 		transform: `translate3d(0, ${t}px, 0)`
@@ -2957,8 +3001,8 @@ function Lr(e, t) {
 }
 //#endregion
 //#region src/components/viewer-core/useEdgeBoundary.ts
-var Rr = 250, zr = 1e3;
-function Br(e) {
+var zr = 250, Br = 1e3;
+function Vr(e) {
 	let t = D(!1), n = D(!1), r = D(0), i = D(0), a = D(!1), o = D(!1), s = 0, c = null;
 	x(() => {
 		y();
@@ -2974,7 +3018,7 @@ function Br(e) {
 	function u(t) {
 		if (!b(t) || !e.isAtBoundary()) return;
 		let n = Date.now();
-		n < s || (s = n + Rr, m());
+		n < s || (s = n + zr, m());
 	}
 	function d() {
 		if (!g()) return;
@@ -3008,7 +3052,7 @@ function Br(e) {
 		return e.hasPage.value && t.value && r.value > i.value && !e.interactionLocked?.value && !e.loading.value && !a.value && typeof e.requestPage.value == "function";
 	}
 	function _() {
-		o.value = !1, v(zr);
+		o.value = !1, v(Br);
 	}
 	function v(e) {
 		y(), a.value = !0, c = setTimeout(() => {
@@ -3031,42 +3075,42 @@ function Br(e) {
 }
 //#endregion
 //#region src/components/viewer-core/useMasonryList.ts
-var Vr = 600, Hr = 24, Ur = 16, Wr = 300, Gr = 200, Kr = 200, qr = Hr + Ur, Jr = 200, Yr = 300, Xr = 24, Zr = 48, Qr = 500, $r = 1e3;
-function ei(e) {
-	let t = D(null), n = D(0), r = D(typeof window > "u" ? 0 : window.innerHeight || 0), a = D(typeof window > "u" ? 0 : window.innerWidth || Wr), o = D([]), s = D([]), c = D(/* @__PURE__ */ new Map()), l = D(0), u = D(/* @__PURE__ */ new Map()), d = D(null), f = D(null), p = D(!1), m = i(() => Math.max(Wr, a.value - Hr * 2)), h = i(() => mr(m.value, Wr)), g = i(() => hr(m.value, h.value, Wr, Ur)), v = i(() => ti(e.activeIndex.value, 0, Math.max(0, e.items.value.length - 1))), y = i(() => vr({
+var Hr = 600, Ur = 24, Wr = 16, Gr = 300, Kr = 200, qr = 200, Jr = Ur + Wr, Yr = 200, Xr = 300, Zr = 24, Qr = 48, $r = 500, ei = 1e3;
+function ti(e) {
+	let t = D(null), n = D(0), r = D(typeof window > "u" ? 0 : window.innerHeight || 0), a = D(typeof window > "u" ? 0 : window.innerWidth || Gr), o = D([]), s = D([]), c = D(/* @__PURE__ */ new Map()), l = D(0), u = D(/* @__PURE__ */ new Map()), d = D(null), f = D(null), p = D(!1), m = i(() => Math.max(Gr, a.value - Ur * 2)), h = i(() => hr(m.value, Gr)), g = i(() => gr(m.value, h.value, Gr, Wr)), v = i(() => ni(e.activeIndex.value, 0, Math.max(0, e.items.value.length - 1))), y = i(() => yr({
 		itemCount: e.items.value.length,
 		viewportHeight: r.value,
 		scrollTop: n.value,
-		overscanPx: Gr,
-		bucketPx: Vr,
+		overscanPx: Kr,
+		bucketPx: Hr,
 		buckets: c.value
 	})), b = i(() => y.value.map((t) => ({
 		item: e.items.value[t],
 		index: t
 	}))), C = i(() => {
-		let e = l.value + Hr * 2, t = d.value ?? 0;
-		return Math.max(e, t, r.value) + Jr;
-	}), w = i(() => e.hasNextPage.value || e.allowExhaustedNextPageRefresh.value), T = i(() => ri({
+		let e = l.value + Ur * 2, t = d.value ?? 0;
+		return Math.max(e, t, r.value) + Yr;
+	}), w = i(() => e.hasNextPage.value || e.allowExhaustedNextPageRefresh.value), T = i(() => ii({
 		active: e.active.value,
 		maxScrollTop: se(),
 		progressDistancePx: n.value,
-		thresholdPx: Kr,
+		thresholdPx: qr,
 		triggerEnabled: w.value
-	})), E = i(() => e.items.value.length > 0 ? `${v.value + 1} / ${e.items.value.length}` : "0 / 0"), O = i(() => ni({
+	})), E = i(() => e.items.value.length > 0 ? `${v.value + 1} / ${e.items.value.length}` : "0 / 0"), O = i(() => ri({
 		active: e.active.value,
 		maxScrollTop: se(),
 		progressDistancePx: n.value,
-		thresholdPx: qr,
+		thresholdPx: Jr,
 		triggerEnabled: e.hasPreviousPage.value
-	})), k = i(() => Math.max(0, r.value - Xr * 2)), A = i(() => C.value > r.value + 1 && k.value > 0), j = i(() => {
+	})), k = i(() => Math.max(0, r.value - Zr * 2)), A = i(() => C.value > r.value + 1 && k.value > 0), j = i(() => {
 		if (!A.value) return 0;
 		let e = r.value / C.value * k.value;
-		return Math.min(k.value, Math.max(Zr, e));
+		return Math.min(k.value, Math.max(Qr, e));
 	}), M = i(() => {
-		if (!A.value) return Xr;
+		if (!A.value) return Zr;
 		let e = Math.max(0, C.value - r.value);
-		return Xr + Math.max(0, k.value - j.value) * (e > 0 ? ti(n.value / e, 0, 1) : 0);
-	}), N = jr({
+		return Zr + Math.max(0, k.value - j.value) * (e > 0 ? ni(n.value / e, 0, 1) : 0);
+	}), N = Mr({
 		items: e.items,
 		visibleIndices: y,
 		positions: o,
@@ -3075,27 +3119,27 @@ function ei(e) {
 		columnWidth: g,
 		scrollTop: n,
 		viewportHeight: r
-	}), P = Br({
+	}), P = Vr({
 		direction: "top",
 		getAnimationLockMs(e) {
-			return Math.max(Qr, Or(e)) + $r;
+			return Math.max($r, kr(e)) + ei;
 		},
 		hasPage: e.hasPreviousPage,
 		interactionLocked: p,
 		isAtBoundary() {
-			return n.value <= qr;
+			return n.value <= Jr;
 		},
 		loading: e.loading,
 		requestPage: e.requestPreviousPage
-	}), F = Br({
+	}), F = Vr({
 		direction: "bottom",
 		getAnimationLockMs(e) {
-			return Or(e) + $r;
+			return kr(e) + ei;
 		},
 		hasPage: w,
 		interactionLocked: p,
 		isAtBoundary() {
-			return oe() <= Kr;
+			return oe() <= qr;
 		},
 		loading: e.loading,
 		requestPage: e.requestNextPage
@@ -3105,7 +3149,7 @@ function ei(e) {
 		h,
 		g
 	], async ([t], [r = []]) => {
-		let i = t.map((e) => $(e)), a = r ?? [], s = a.map((e) => $(e)), c = yr(a, u.value, o.value), l = X(a), d = new Set(s), f = new Set(i), p = t.filter((e) => !d.has($(e))), m = a.flatMap((e) => {
+		let i = t.map((e) => $(e)), a = r ?? [], s = a.map((e) => $(e)), c = br(a, u.value, o.value), l = ue(a), d = new Set(s), f = new Set(i), p = t.filter((e) => !d.has($(e))), m = a.flatMap((e) => {
 			let t = $(e);
 			if (f.has(t)) return [];
 			let n = c.get(t), r = l.get(t);
@@ -3114,15 +3158,15 @@ function ei(e) {
 				item: e,
 				position: n
 			}];
-		}), h = i.length > s.length && s.length > 0 && i[0] !== s[0], g = t.length === 0 && a.length > 0 && m.length > 0 && n.value > 0, y = m.length > 0 && n.value > Hr + Ur, b = h && n.value > Hr + Ur ? t[v.value] : null, x = b ? $(b) : null;
-		y && K(kr() + $r), g && G(), te(), m.length > 0 && N.markLeave(m), p.length > 0 && (N.markEnter(p, h ? "top" : "bottom"), h ? P.onItemsMutated(p.length) : F.onItemsMutated(p.length)), N.playFlipMoveAnimation(c, new Set(p.map((e) => $(e))), h ? Qr : void 0), x ? (await _(), ne(x, c)) : e.active.value && s.length > 0 && re();
+		}), h = i.length > s.length && s.length > 0 && i[0] !== s[0], g = t.length === 0 && a.length > 0 && m.length > 0 && n.value > 0, y = m.length > 0 && n.value > Ur + Wr, b = h && n.value > Ur + Wr ? t[v.value] : null, x = b ? $(b) : null;
+		y && K(Ar() + ei), g && G(), te(), m.length > 0 && N.markLeave(m), p.length > 0 && (N.markEnter(p, h ? "top" : "bottom"), h ? P.onItemsMutated(p.length) : F.onItemsMutated(p.length)), N.playFlipMoveAnimation(c, new Set(p.map((e) => $(e))), h ? $r : void 0), x ? (await _(), ne(x, c)) : e.active.value && s.length > 0 && re();
 	}, { immediate: !0 }), L([
 		() => e.pendingAppendItems.value.map((e) => $(e)),
 		h,
 		g,
 		r
 	], ([t]) => {
-		de(), t.length && (d.value = le([...e.items.value, ...e.pendingAppendItems.value]), ue());
+		de(), t.length && (d.value = le([...e.items.value, ...e.pendingAppendItems.value]), X());
 	}, { immediate: !0 }), L(() => e.active.value, async (e, i) => {
 		let a = t.value;
 		if (!a) return;
@@ -3132,7 +3176,7 @@ function ei(e) {
 		}
 		if (i !== !1 || f.value == null) return;
 		await _();
-		let o = Math.max(0, C.value - r.value), s = ti(f.value, 0, o);
+		let o = Math.max(0, C.value - r.value), s = ni(f.value, 0, o);
 		a.scrollTop = s, n.value = s, P.syncBoundary(), F.syncBoundary();
 	}), L(() => e.loading.value, async (t) => {
 		!t && !e.pendingAppendItems.value.length && !z && !ee && (d.value = null), P.onLoadingChange(t), F.onLoadingChange(t), await _();
@@ -3144,16 +3188,16 @@ function ei(e) {
 		I?.disconnect(), I = null, window.removeEventListener("resize", Y), de(), fe(), R &&= (cancelAnimationFrame(R), 0);
 	});
 	function te() {
-		let t = _r(e.items.value, {
+		let t = vr(e.items.value, {
 			columnCount: h.value,
 			columnWidth: g.value,
-			gapX: Ur,
-			gapY: Ur,
-			bucketPx: Vr
+			gapX: Wr,
+			gapY: Wr,
+			bucketPx: Hr
 		});
 		o.value = t.positions.map((e) => ({
-			x: e.x + Hr,
-			y: e.y + Hr
+			x: e.x + Ur,
+			y: e.y + Ur
 		})), s.value = t.heights, c.value = t.buckets, l.value = t.contentHeight, u.value = t.indexById;
 	}
 	function V() {
@@ -3178,7 +3222,7 @@ function ei(e) {
 		let a = t.value, c = o.value[e], l = s.value[e];
 		if (!a || !c || !l) return;
 		let u = a.scrollTop, d = Math.max(0, C.value - r.value);
-		i === "center" ? u = c.y - (r.value - l) / 2 : c.y < a.scrollTop ? u = c.y - Hr : c.y + l > a.scrollTop + r.value && (u = c.y + l - r.value + Hr), a.scrollTop = ti(u, 0, d), n.value = a.scrollTop, q();
+		i === "center" ? u = c.y - (r.value - l) / 2 : c.y < a.scrollTop ? u = c.y - Ur : c.y + l > a.scrollTop + r.value && (u = c.y + l - r.value + Ur), a.scrollTop = ni(u, 0, d), n.value = a.scrollTop, q();
 	}
 	function ne(e, r) {
 		let i = t.value, a = r.get(e), s = u.value.get(e), c = s == null ? null : o.value[s];
@@ -3211,7 +3255,7 @@ function ei(e) {
 		e.setActiveIndex(i);
 	}
 	function re() {
-		let t = n.value <= qr, r = oe() <= Kr;
+		let t = n.value <= Jr, r = oe() <= qr;
 		return t ? (e.setActiveIndex(0), !0) : r ? (e.setActiveIndex(Math.max(0, e.items.value.length - 1)), !0) : !1;
 	}
 	function J() {
@@ -3221,31 +3265,31 @@ function ei(e) {
 		r.value = ie(), a.value = ae();
 	}
 	function ie() {
-		return Pr(t.value, r.value);
+		return Fr(t.value, r.value);
 	}
 	function ae() {
-		return Fr(t.value, a.value, Wr);
+		return Ir(t.value, a.value, Gr);
 	}
 	function oe() {
-		return Ir(t.value, n.value, r.value, C.value);
+		return Lr(t.value, n.value, r.value, C.value);
 	}
 	function se() {
 		let e = Math.max(t.value?.scrollHeight ?? 0, C.value);
 		return Math.max(0, e - r.value);
 	}
 	function ce() {
-		return Lr(j.value, M.value);
+		return Rr(j.value, M.value);
 	}
 	function le(e) {
-		return e.length ? _r(e, {
+		return e.length ? vr(e, {
 			columnCount: h.value,
 			columnWidth: g.value,
-			gapX: Ur,
-			gapY: Ur,
-			bucketPx: Vr
-		}).contentHeight + Hr * 2 : 0;
+			gapX: Wr,
+			gapY: Wr,
+			bucketPx: Hr
+		}).contentHeight + Ur * 2 : 0;
 	}
-	function X(e) {
+	function ue(e) {
 		let t = /* @__PURE__ */ new Map();
 		for (let n of e) {
 			let e = $(n), r = u.value.get(e);
@@ -3255,7 +3299,7 @@ function ei(e) {
 		}
 		return t;
 	}
-	function ue() {
+	function X() {
 		let t = e.commitPendingAppend.value;
 		typeof t == "function" && (z = setTimeout(async () => {
 			z = null, ee = !0;
@@ -3265,7 +3309,7 @@ function ei(e) {
 			} finally {
 				d.value = null, ee = !1;
 			}
-		}, Yr));
+		}, Xr));
 	}
 	function de() {
 		z &&= (clearTimeout(z), null);
@@ -3292,27 +3336,27 @@ function ei(e) {
 		scrollViewportRef: t
 	};
 }
-function ti(e, t, n) {
+function ni(e, t, n) {
 	return Math.min(Math.max(e, t), n);
 }
-function ni(e) {
+function ri(e) {
 	if (!e.active || !e.triggerEnabled) return 0;
 	let t = Math.max(0, e.maxScrollTop - e.thresholdPx);
-	return t <= 0 ? 1 : ti(1 - (e.progressDistancePx - e.thresholdPx) / t, 0, 1);
+	return t <= 0 ? 1 : ni(1 - (e.progressDistancePx - e.thresholdPx) / t, 0, 1);
 }
-function ri(e) {
+function ii(e) {
 	if (!e.active || !e.triggerEnabled) return 0;
 	let t = Math.max(0, e.maxScrollTop - e.thresholdPx);
-	return t <= 0 ? 1 : ti(e.progressDistancePx / t, 0, 1);
+	return t <= 0 ? 1 : ni(e.progressDistancePx / t, 0, 1);
 }
 //#endregion
 //#region src/components/viewer-core/listCardAsset.ts
-function ii(e) {
+function ai(e) {
 	if (e) try {
 		e.removeAttribute("src"), e.src = "";
 	} catch {}
 }
-function ai(e) {
+function oi(e) {
 	if (e) {
 		try {
 			e.currentTime = 0;
@@ -3323,12 +3367,12 @@ function ai(e) {
 		} catch {}
 	}
 }
-function oi(e, t) {
+function si(e, t) {
 	if (t) return e.bottom > t.top && e.top < t.bottom;
 	let n = window.innerHeight || document.documentElement.clientHeight || 0;
 	return e.bottom > 0 && e.top < n;
 }
-function si(e) {
+function ci(e) {
 	if (!e) return null;
 	try {
 		return new URL(e, window.location.href).href;
@@ -3338,9 +3382,9 @@ function si(e) {
 }
 //#endregion
 //#region src/components/viewer-core/listPreview.ts
-var ci = /\.(avif|gif|jpe?g|png|svg|webp)(\?|#|$)/i, li = /\.(m4v|mov|mp4|mpeg|ogg|ogv|webm)(\?|#|$)/i, ui = /^(?:(?:https?:)?\/\/[^/]+)?\/api\/files\/[^/?#]+\/(?:preview|downloaded)(?:\?|#|$)/i;
-function di(e) {
-	let t = fi(e), n = t?.url, r = pr(e), i = e.title?.trim() || kt(e.type);
+var li = /\.(avif|gif|jpe?g|png|svg|webp)(\?|#|$)/i, ui = /\.(m4v|mov|mp4|mpeg|ogg|ogv|webm)(\?|#|$)/i, di = /^(?:(?:https?:)?\/\/[^/]+)?\/api\/files\/[^/?#]+\/(?:preview|downloaded)(?:\?|#|$)/i;
+function fi(e) {
+	let t = pi(e), n = t?.url, r = mr(e), i = e.title?.trim() || kt(e.type);
 	return t?.mediaType === "video" && typeof n == "string" ? {
 		kind: "video",
 		url: n,
@@ -3359,13 +3403,13 @@ function di(e) {
 		width: r.width,
 		height: r.height,
 		label: i
-	} : typeof n == "string" && mi(e, n) ? {
+	} : typeof n == "string" && hi(e, n) ? {
 		kind: "video",
 		url: n,
 		width: r.width,
 		height: r.height,
 		label: i
-	} : typeof n == "string" && pi(e, n) ? {
+	} : typeof n == "string" && mi(e, n) ? {
 		kind: "image",
 		url: n,
 		width: r.width,
@@ -3379,26 +3423,26 @@ function di(e) {
 		label: i
 	};
 }
-function fi(e) {
+function pi(e) {
 	return e.preview?.url ? e.preview : typeof e.url != "string" || e.url.trim() === "" ? null : { url: e.url };
 }
-function pi(e, t) {
-	return e.type !== "image" || typeof t != "string" ? !1 : ci.test(t) || hi(t);
-}
 function mi(e, t) {
-	return e.type !== "video" || typeof t != "string" ? !1 : li.test(t) || gi(t);
+	return e.type !== "image" || typeof t != "string" ? !1 : li.test(t) || gi(t);
 }
-function hi(e) {
-	return /^(https?:\/\/|\/\/|\/(?!\/)|\.{1,2}\/|blob:|data:)/i.test(e);
+function hi(e, t) {
+	return e.type !== "video" || typeof t != "string" ? !1 : ui.test(t) || _i(t);
 }
 function gi(e) {
-	return ui.test(e) || /^blob:/i.test(e) || /^data:video\//i.test(e);
+	return /^(https?:\/\/|\/\/|\/(?!\/)|\.{1,2}\/|blob:|data:)/i.test(e);
+}
+function _i(e) {
+	return di.test(e) || /^blob:/i.test(e) || /^data:video\//i.test(e);
 }
 //#endregion
 //#region src/components/viewer-core/useListCardHealthCheck.ts
-function _i(e) {
+function vi(e) {
 	let t = D(null), n = i(() => {
-		let t = typeof e.item.value.healthCheck?.url == "string" ? si(e.item.value.healthCheck.url) : null;
+		let t = typeof e.item.value.healthCheck?.url == "string" ? ci(e.item.value.healthCheck.url) : null;
 		return !t || t === e.attachedAssetUrl.value ? null : t;
 	}), r = null, a = 0, o = /* @__PURE__ */ new Map();
 	L(n, (e, n) => {
@@ -3476,14 +3520,14 @@ function _i(e) {
 }
 //#endregion
 //#region src/components/ListCard.vue?vue&type=script&setup=true&lang.ts
-var vi = ["aria-label"], yi = {
+var yi = ["aria-label"], bi = {
 	key: 0,
 	"data-testid": "vibe-list-card-spinner",
 	class: "pointer-events-none absolute inset-0 z-[4] grid place-items-center bg-black/18"
-}, bi = { class: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-black/45 shadow-[0_18px_40px_-18px_rgba(0,0,0,0.85)] backdrop-blur-[18px]" }, xi = ["src", "alt"], Si = ["src"], Ci = ["data-kind"], wi = { class: "grid justify-items-center gap-3 px-4 text-center" }, Ti = { class: "text-[0.68rem] font-bold uppercase tracking-[0.22em] text-[#f7f1ea]/72" }, Ei = {
+}, xi = { class: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-black/45 shadow-[0_18px_40px_-18px_rgba(0,0,0,0.85)] backdrop-blur-[18px]" }, Si = ["src", "alt"], Ci = ["src"], wi = ["data-kind"], Ti = { class: "grid justify-items-center gap-3 px-4 text-center" }, Ei = { class: "text-[0.68rem] font-bold uppercase tracking-[0.22em] text-[#f7f1ea]/72" }, Di = {
 	key: 4,
 	class: "grid h-full w-full place-items-center bg-[radial-gradient(circle_at_center,rgba(255,255,255,0.08),transparent_65%),linear-gradient(180deg,rgba(255,255,255,0.04),rgba(255,255,255,0.02))]"
-}, Di = { class: "inline-flex h-14 w-14 items-center justify-center border border-white/16 bg-black/20" }, Oi = { class: "pointer-events-none absolute inset-0 z-[3]" }, ki = /* @__PURE__ */ d({
+}, Oi = { class: "inline-flex h-14 w-14 items-center justify-center border border-white/16 bg-black/20" }, ki = { class: "pointer-events-none absolute inset-0 z-[3]" }, Ai = /* @__PURE__ */ d({
 	__name: "ListCard",
 	props: {
 		active: {
@@ -3507,9 +3551,9 @@ var vi = ["aria-label"], yi = {
 	},
 	emits: ["open"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, l = i(() => di(n.item)), d = D(!1), f = D(!1), p = D(!1), m = D(l.value.kind === "fallback"), h = D(!1), g = D(null), _ = D(null), y = D(null), b = D(null), C = D(null), T = D(l.value.kind === "fallback"), E = i(() => T.value ? n.surfaceActive ? d.value ? l.value.url : null : l.value.url : null), O = i(() => n.surfaceActive && d.value && (l.value.kind === "image" || l.value.kind === "video") && !!l.value.url), M = i(() => l.value.kind === "image" && !!E.value), P = i(() => l.value.kind === "video" && !!E.value), F = _i({
+		let n = e, r = t, l = i(() => fi(n.item)), d = D(!1), f = D(!1), p = D(!1), m = D(l.value.kind === "fallback"), h = D(!1), g = D(null), _ = D(null), y = D(null), b = D(null), C = D(null), T = D(l.value.kind === "fallback"), E = i(() => T.value ? n.surfaceActive ? d.value ? l.value.url : null : l.value.url : null), O = i(() => n.surfaceActive && d.value && (l.value.kind === "image" || l.value.kind === "video") && !!l.value.url), M = i(() => l.value.kind === "image" && !!E.value), P = i(() => l.value.kind === "video" && !!E.value), F = vi({
 			attachedAssetUrl: E,
-			getPriority: X,
+			getPriority: ue,
 			isInView: d,
 			isReady: m,
 			item: i(() => n.item),
@@ -3551,10 +3595,10 @@ var vi = ["aria-label"], yi = {
 			re(), F.release(), te?.disconnect(), te = null;
 		});
 		function U() {
-			ue(_.value) && (m.value = !0, g.value = null, ie(E.value ?? n.item.url), J());
+			X(_.value) && (m.value = !0, g.value = null, ie(E.value ?? n.item.url), J());
 		}
 		async function W() {
-			if (!ue(_.value)) return;
+			if (!X(_.value)) return;
 			let e = E.value ?? n.item.url;
 			m.value = !1, g.value = "generic";
 			let t = await on(e);
@@ -3567,10 +3611,10 @@ var vi = ["aria-label"], yi = {
 			}), J();
 		}
 		function ne() {
-			ue(C.value) && (h.value = !0, m.value = !0, g.value = null, ie(E.value ?? n.item.url), J(), q());
+			X(C.value) && (h.value = !0, m.value = !0, g.value = null, ie(E.value ?? n.item.url), J(), q());
 		}
 		function G() {
-			ue(C.value) && (h.value || (m.value = !1));
+			X(C.value) && (h.value || (m.value = !1));
 		}
 		function K() {
 			if (l.value.kind === "fallback") {
@@ -3591,7 +3635,7 @@ var vi = ["aria-label"], yi = {
 			}
 			V = Mt.request({
 				assetType: l.value.kind,
-				getPriority: X,
+				getPriority: ue,
 				onGrant() {
 					T.value = !0, m.value = !1, g.value = null;
 				},
@@ -3627,7 +3671,7 @@ var vi = ["aria-label"], yi = {
 				d.value = !0;
 				return;
 			}
-			d.value = oi(e?.boundingClientRect ?? t.getBoundingClientRect(), e?.rootBounds ?? b.value?.getBoundingClientRect() ?? null);
+			d.value = si(e?.boundingClientRect ?? t.getBoundingClientRect(), e?.rootBounds ?? b.value?.getBoundingClientRect() ?? null);
 		}
 		function ie(e) {
 			if (!e) return;
@@ -3647,12 +3691,12 @@ var vi = ["aria-label"], yi = {
 			}), g.value = null, m.value = !1, T.value = !1, J(), K();
 		}
 		function se() {
-			ii(_.value);
+			ai(_.value);
 		}
 		function ce() {
-			ai(C.value);
+			oi(C.value);
 		}
-		function X() {
+		function ue() {
 			let e = y.value;
 			if (!e) return Infinity;
 			let t = e.getBoundingClientRect();
@@ -3663,9 +3707,9 @@ var vi = ["aria-label"], yi = {
 			let n = window.innerHeight / 2;
 			return Math.abs((t.top + t.bottom) / 2 - n);
 		}
-		function ue(e) {
-			let t = si(E.value);
-			return !e || !t ? !1 : si("currentSrc" in e && e.currentSrc || e.getAttribute("src")) === t;
+		function X(e) {
+			let t = ci(E.value);
+			return !e || !t ? !1 : ci("currentSrc" in e && e.currentSrc || e.getAttribute("src")) === t;
 		}
 		function de() {
 			r("open");
@@ -3693,8 +3737,8 @@ var vi = ["aria-label"], yi = {
 				class: "absolute inset-0 z-[1] block h-full w-full cursor-pointer text-left focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-4 focus-visible:outline-[#f7f1ea]",
 				"aria-label": n.item.title || `Open item ${n.index + 1}`,
 				onClick: de
-			}, null, 8, vi),
-			B.value ? (w(), s("div", yi, [c("span", bi, [u(N(oe), {
+			}, null, 8, yi),
+			B.value ? (w(), s("div", bi, [c("span", xi, [u(N(oe), {
 				class: "h-5 w-5 animate-spin stroke-[1.9] text-[#f7f1ea]/78",
 				"aria-hidden": "true"
 			})])])) : o("", !0),
@@ -3708,7 +3752,7 @@ var vi = ["aria-label"], yi = {
 				class: v(["block h-full w-full object-cover transition-opacity duration-300", m.value ? "pointer-events-none opacity-100" : "pointer-events-none opacity-0"]),
 				onLoad: U,
 				onError: W
-			}, null, 42, xi)) : P.value && E.value && !R.value ? (w(), s("video", {
+			}, null, 42, Si)) : P.value && E.value && !R.value ? (w(), s("video", {
 				key: 2,
 				ref_key: "videoRef",
 				ref: C,
@@ -3724,31 +3768,31 @@ var vi = ["aria-label"], yi = {
 				onPlaying: ne,
 				onStalled: G,
 				onWaiting: G
-			}, null, 42, Si)) : R.value ? (w(), s("div", {
+			}, null, 42, Ci)) : R.value ? (w(), s("div", {
 				key: 3,
 				"data-testid": "vibe-list-card-error",
 				"data-kind": I.value,
 				class: "pointer-events-none relative z-[2] grid h-full w-full place-items-center bg-[radial-gradient(circle_at_center,rgba(239,68,68,0.12),transparent_65%),linear-gradient(180deg,rgba(255,255,255,0.04),rgba(255,255,255,0.02))]"
-			}, [c("div", wi, [
+			}, [c("div", Ti, [
 				u(N(le), {
 					class: "h-6 w-6 stroke-[1.8] text-[#f7f1ea]/78",
 					"aria-hidden": "true"
 				}),
-				c("span", Ti, j(N(rn)(I.value)), 1),
+				c("span", Ei, j(N(rn)(I.value)), 1),
 				z.value ? (w(), s("button", {
 					key: 0,
 					type: "button",
 					class: "pointer-events-auto inline-flex items-center justify-center border border-white/14 bg-black/35 px-3 py-2 text-[0.62rem] font-bold uppercase tracking-[0.22em] text-[#f7f1ea]/82 backdrop-blur-[18px] transition hover:border-white/28 hover:bg-black/50",
 					onClick: ee(ae, ["stop"])
 				}, " Retry ")) : o("", !0)
-			])], 8, Ci)) : (w(), s("div", Ei, [c("div", Di, [k(e.$slots, "item-icon", {
+			])], 8, wi)) : (w(), s("div", Di, [c("div", Oi, [k(e.$slots, "item-icon", {
 				icon: N(Ot)(n.item.type),
 				item: n.item
 			}, () => [(w(), a(A(N(Ot)(n.item.type)), {
 				class: "h-6 w-6 stroke-[1.8] text-[#f7f1ea]/78",
 				"aria-hidden": "true"
 			}))])])])),
-			c("div", Oi, [k(e.$slots, "grid-item-overlay", {
+			c("div", ki, [k(e.$slots, "grid-item-overlay", {
 				active: n.active,
 				focused: f.value,
 				hovered: p.value,
@@ -3758,24 +3802,24 @@ var vi = ["aria-label"], yi = {
 			})])
 		], 34));
 	}
-}), Ai = { class: "relative h-full min-h-0 bg-[radial-gradient(circle_at_top_center,rgba(255,255,255,0.04),transparent_28%),linear-gradient(180deg,#06070b,#05060a)]" }, ji = { class: "pointer-events-none absolute inset-x-0 top-0 z-[2] flex justify-end p-6" }, Mi = {
+}), ji = { class: "relative h-full min-h-0 bg-[radial-gradient(circle_at_top_center,rgba(255,255,255,0.04),transparent_28%),linear-gradient(180deg,#06070b,#05060a)]" }, Mi = { class: "pointer-events-none absolute inset-x-0 top-0 z-[2] flex justify-end p-6" }, Ni = {
 	"data-testid": "vibe-pagination",
 	class: "inline-flex shrink-0 items-center gap-2 whitespace-nowrap border border-white/14 bg-black/40 px-3 py-2 text-[0.63rem] font-bold uppercase tracking-[0.12em] text-[#f7f1ea]/72 backdrop-blur-[18px] min-[721px]:gap-3 min-[721px]:px-4 min-[721px]:py-3 min-[721px]:text-[0.74rem] min-[721px]:tracking-[0.2em]"
-}, Ni = { class: "whitespace-nowrap" }, Pi = {
+}, Pi = { class: "whitespace-nowrap" }, Fi = {
 	key: 0,
 	class: "whitespace-nowrap border-l border-white/12 pl-2 text-[#f7f1ea]/56 min-[721px]:pl-3"
-}, Fi = [
+}, Ii = [
 	"data-active",
 	"data-index",
 	"data-item-id",
 	"data-occurrence-key"
-], Ii = ["data-item-id"], Li = {
+], Li = ["data-item-id"], Ri = {
 	key: 0,
 	class: "pointer-events-none absolute inset-y-0 right-0 z-[3] hidden w-8 min-[1024px]:block"
-}, Ri = {
+}, zi = {
 	key: 1,
 	class: "pointer-events-none absolute inset-x-0 bottom-0 z-[2] px-5 pb-5 sm:px-6"
-}, zi = { class: "mx-auto flex w-full justify-center" }, Bi = /* @__PURE__ */ d({
+}, Bi = { class: "mx-auto flex w-full justify-center" }, Vi = /* @__PURE__ */ d({
 	__name: "ListSurface",
 	props: {
 		active: {
@@ -3836,7 +3880,7 @@ var vi = ["aria-label"], yi = {
 		"update:activeIndex"
 	],
 	setup(e, { emit: n }) {
-		let r = e, d = F(), f = n, p = ei({
+		let r = e, d = F(), f = n, p = ti({
 			active: M(r, "active"),
 			allowExhaustedNextPageRefresh: M(r, "allowExhaustedNextPageRefresh"),
 			items: M(r, "items"),
@@ -3881,8 +3925,8 @@ var vi = ["aria-label"], yi = {
 				nextBoundaryLoadProgress: e,
 				previousBoundaryLoadProgress: t
 			});
-		}, { immediate: !0 }), (e, n) => (w(), s("div", Ai, [
-			c("div", ji, [c("span", Mi, [c("span", Ni, j(N(p).paginationLabel.value), 1), r.paginationDetail ? (w(), s("span", Pi, j(r.paginationDetail), 1)) : o("", !0)])]),
+		}, { immediate: !0 }), (e, n) => (w(), s("div", ji, [
+			c("div", Mi, [c("span", Ni, [c("span", Pi, j(N(p).paginationLabel.value), 1), r.paginationDetail ? (w(), s("span", Fi, j(r.paginationDetail), 1)) : o("", !0)])]),
 			c("div", {
 				ref: N(p).scrollViewportRef,
 				"data-testid": "vibe-list-scroll",
@@ -3903,7 +3947,7 @@ var vi = ["aria-label"], yi = {
 					"data-occurrence-key": N($)(t),
 					class: "absolute will-change-transform",
 					style: b(N(p).getCardStyle(n))
-				}, [u(ki, {
+				}, [u(Ai, {
 					active: n === N(p).resolvedActiveIndex.value,
 					index: n,
 					item: t,
@@ -3927,14 +3971,14 @@ var vi = ["aria-label"], yi = {
 					"report-asset-load",
 					"surface-active",
 					"onOpen"
-				])], 12, Fi))), 128)),
+				])], 12, Ii))), 128)),
 				(w(!0), s(t, null, O(N(p).leavingItems.value, (t) => (w(), s("article", {
 					key: `leaving-${N($)(t.item)}`,
 					"data-testid": "vibe-list-card-leaving",
 					"data-item-id": t.item.id,
 					class: "pointer-events-none absolute z-[2] will-change-[opacity,transform]",
 					style: b(N(p).getLeavingCardStyle(t.item))
-				}, [u(ki, {
+				}, [u(Ai, {
 					active: !1,
 					index: -1,
 					item: t.item,
@@ -3949,8 +3993,8 @@ var vi = ["aria-label"], yi = {
 					"item",
 					"report-asset-error",
 					"report-asset-load"
-				])], 12, Ii))), 128)),
-				N(A) && N(T) ? (w(), a(On, {
+				])], 12, Li))), 128)),
+				N(A) && N(T) ? (w(), a(kn, {
 					key: 0,
 					message: N(T).message,
 					mode: N(T).mode,
@@ -3964,12 +4008,12 @@ var vi = ["aria-label"], yi = {
 					"surface"
 				])) : o("", !0)
 			], 4)], 544),
-			N(p).showScrollbar.value ? (w(), s("div", Li, [n[2] ||= c("div", { class: "absolute bottom-6 right-3 top-6 w-px bg-white/8" }, null, -1), c("div", {
+			N(p).showScrollbar.value ? (w(), s("div", Ri, [n[2] ||= c("div", { class: "absolute bottom-6 right-3 top-6 w-px bg-white/8" }, null, -1), c("div", {
 				"data-testid": "vibe-list-scrollbar-thumb",
 				class: v(["absolute right-[0.625rem] w-1 bg-white/34 transition-[height,transform,background-color,opacity] duration-300 ease-out", r.loading ? "bg-white/52" : "bg-white/34"]),
 				style: b(N(p).getScrollbarThumbStyle())
 			}, null, 6)])) : o("", !0),
-			d["grid-footer"] ? (w(), s("div", Ri, [c("div", zi, [k(e.$slots, "grid-footer")])])) : o("", !0),
+			d["grid-footer"] ? (w(), s("div", zi, [c("div", Bi, [k(e.$slots, "grid-footer")])])) : o("", !0),
 			_.value ? (w(), s("div", {
 				key: 2,
 				class: v(["pointer-events-none absolute inset-x-0 bottom-0 z-[3] flex justify-center px-6", d["grid-footer"] ? "pb-24" : "pb-6"])
@@ -3978,7 +4022,7 @@ var vi = ["aria-label"], yi = {
 				"data-testid": "vibe-grid-status-badge",
 				class: v(["inline-flex items-center border border-white/14 bg-black/55 px-4 py-3 text-[0.7rem] font-bold uppercase tracking-[0.18em] text-[#f7f1ea]/72 backdrop-blur-[18px]", _.value.kind === "end" ? "border-amber-300/35 text-amber-200" : _.value.kind === "failed" ? "border-rose-400/45 text-rose-100" : ""])
 			}, j(_.value.message), 3))], 2)) : o("", !0),
-			N(E) && N(T) ? (w(), a(On, {
+			N(E) && N(T) ? (w(), a(kn, {
 				key: 3,
 				class: v(["z-[3]", d["grid-footer"] ? "pb-24" : "pb-6"]),
 				message: N(T).message,
@@ -3995,13 +4039,13 @@ var vi = ["aria-label"], yi = {
 			])) : o("", !0)
 		]));
 	}
-}), Vi = ["data-surface-mode"], Hi = {
+}), Hi = ["data-surface-mode"], Ui = {
 	key: 1,
 	class: "absolute left-5 top-5 z-30 border border-amber-400/45 bg-black/35 px-4 py-2 text-xs font-medium uppercase tracking-[0.24em] text-amber-100 backdrop-blur"
-}, Ui = ["data-visible", "inert"], Wi = ["data-visible", "inert"], Gi = {
+}, Wi = ["data-visible", "inert"], Gi = ["data-visible", "inert"], Ki = {
 	key: 3,
 	class: "relative z-[1] grid h-full w-full content-center justify-items-center gap-6 px-[clamp(2rem,4vw,3rem)] py-[clamp(2rem,4vw,3rem)] text-center"
-}, Ki = /* @__PURE__ */ d({
+}, qi = /* @__PURE__ */ d({
 	name: "VibeLayout",
 	__name: "Layout",
 	props: {
@@ -4036,6 +4080,8 @@ var vi = ["aria-label"], yi = {
 		}), n({
 			cancel: h.cancel,
 			clearRemoved: h.clearRemoved,
+			getItemByOccurrenceKey: h.getItemByOccurrenceKey,
+			getItems: h.getItems,
 			getRemovedIds: h.getRemovedIds,
 			lockPageLoading: h.lockPageLoading,
 			loadNext: h.loadNext,
@@ -4055,7 +4101,7 @@ var vi = ["aria-label"], yi = {
 			type: "button",
 			class: "absolute left-5 top-5 z-30 inline-flex items-center border border-rose-400/55 bg-rose-500/18 px-4 py-2 text-xs font-medium uppercase tracking-[0.24em] text-white backdrop-blur transition hover:bg-rose-500/28",
 			onClick: n[0] ||= (...e) => N(h).retryInitialLoad && N(h).retryInitialLoad(...e)
-		}, " Retry ")) : N(h).errorMessage.value && N(h).items.value.length > 0 ? (w(), s("div", Hi, j(N(h).errorMessage.value), 1)) : o("", !0), N(h).isDesktop.value ? (w(), s(t, { key: 2 }, [u(r, {
+		}, " Retry ")) : N(h).errorMessage.value && N(h).items.value.length > 0 ? (w(), s("div", Ui, j(N(h).errorMessage.value), 1)) : o("", !0), N(h).isDesktop.value ? (w(), s(t, { key: 2 }, [u(r, {
 			appear: "",
 			"enter-active-class": "transition-[opacity,transform] duration-300 ease-out",
 			"enter-from-class": "translate-y-3 opacity-0",
@@ -4069,7 +4115,7 @@ var vi = ["aria-label"], yi = {
 				"data-visible": N(h).surfaceMode.value === "list" ? "true" : "false",
 				inert: N(h).surfaceMode.value !== "list",
 				class: "absolute inset-0 z-[2]"
-			}, [u(Bi, {
+			}, [u(Vi, {
 				active: N(h).surfaceMode.value === "list",
 				"allow-exhausted-next-page-refresh": N(h).canRefreshExhaustedNextPage.value,
 				items: N(h).items.value,
@@ -4139,7 +4185,7 @@ var vi = ["aria-label"], yi = {
 				"onBoundaryLoadProgress",
 				"onOpenFullscreen",
 				"onUpdate:activeIndex"
-			])], 8, Ui), [[I, N(h).surfaceMode.value === "list"]])]),
+			])], 8, Wi), [[I, N(h).surfaceMode.value === "list"]])]),
 			_: 3
 		}), u(r, {
 			appear: "",
@@ -4155,7 +4201,7 @@ var vi = ["aria-label"], yi = {
 				"data-visible": N(h).surfaceMode.value === "fullscreen" ? "true" : "false",
 				inert: N(h).surfaceMode.value !== "fullscreen",
 				class: "absolute inset-0 z-[3]"
-			}, [u(ur, {
+			}, [u(dr, {
 				items: N(h).items.value,
 				active: N(h).surfaceMode.value === "fullscreen",
 				"active-index": N(h).activeIndex.value,
@@ -4224,12 +4270,12 @@ var vi = ["aria-label"], yi = {
 				"show-back-to-list",
 				"onBackToList",
 				"onUpdate:activeIndex"
-			])], 8, Wi), [[I, N(h).surfaceMode.value === "fullscreen"]])]),
+			])], 8, Gi), [[I, N(h).surfaceMode.value === "fullscreen"]])]),
 			_: 3
-		})], 64)) : N(h).items.value.length === 0 && N(h).loading.value ? (w(), s("div", Gi, [u(N(oe), {
+		})], 64)) : N(h).items.value.length === 0 && N(h).loading.value ? (w(), s("div", Ki, [u(N(oe), {
 			class: "size-10 animate-spin text-[#f7f1ea]/82",
 			"aria-hidden": "true"
-		}), n[1] ||= c("p", { class: "m-0 text-[0.9rem] font-semibold uppercase tracking-[0.22em] text-[#f7f1ea]/72" }, " Loading... ", -1)])) : (w(), a(ur, {
+		}), n[1] ||= c("p", { class: "m-0 text-[0.9rem] font-semibold uppercase tracking-[0.22em] text-[#f7f1ea]/72" }, " Loading... ", -1)])) : (w(), a(dr, {
 			key: 4,
 			items: N(h).items.value,
 			active: !0,
@@ -4297,10 +4343,10 @@ var vi = ["aria-label"], yi = {
 			"show-status-badges",
 			"onBackToList",
 			"onUpdate:activeIndex"
-		]))], 8, Vi));
+		]))], 8, Hi));
 	}
-}), qi = { install(e) {
-	e.component("VibeLayout", Ki);
+}), Ji = { install(e) {
+	e.component("VibeLayout", qi);
 } };
 //#endregion
-export { Ki as VibeLayout, qi as VibePlugin, qi as default };
+export { qi as VibeLayout, Ji as VibePlugin, Ji as default };