@wyxos/vibe 3.1.23 → 3.1.24

package/lib/index.js

@@ -3391,25 +3391,37 @@ function ri(e, t, n) {
 //#region src/components/viewer-core/useEdgeBoundary.ts
 var ii = 250, ai = 1e3;
 function oi(e) {
-	let t = D(!1), n = D(!1), r = D(0), i = D(0), a = D(!1), o = D(!1), s = 0, c = null;
+	let t = D(!1), n = D(!1), r = D(0), i = D(0), a = D(!1), o = D(!1), s = D(!1), c = 0, l = null;
 	x(() => {
-		y();
+		S();
 	});
-	function l() {
-		let r = t.value;
+	function u(r = "layout") {
+		let i = t.value;
 		if (t.value = e.isAtBoundary(), !t.value) {
-			!a.value && !o.value && (n.value = !0);
+			(!a.value && !o.value || r === "scroll") && (n.value = !0);
 			return;
 		}
-		!r && n.value && m();
+		if (!i && n.value) {
+			if (r === "scroll" && a.value) {
+				s.value = !0;
+				return;
+			}
+			h();
+		}
 	}
-	function u(t) {
-		if (!b(t) || !e.isAtBoundary()) return;
+	function d(t) {
+		if (!C(t) || !e.isAtBoundary()) return;
 		let n = Date.now();
-		n < s || (s = n + ii, m());
+		if (!(n < c)) {
+			if (c = n + ii, a.value) {
+				s.value = !0;
+				return;
+			}
+			h();
+		}
 	}
-	function d() {
-		if (!g()) return;
+	function f() {
+		if (!_()) return;
 		let t = e.requestPage.value;
 		if (typeof t != "function") return;
 		i.value = r.value, n.value = !1, a.value = !0, o.value = !0;
@@ -3417,48 +3429,57 @@ function oi(e) {
 		try {
 			s = t();
 		} catch {
-			_();
+			v();
 			return;
 		}
 		Promise.resolve(s).catch(() => {}).finally(() => {
-			!e.loading.value && o.value && _();
+			!e.loading.value && o.value && v();
 		});
 	}
-	function f(e) {
-		!e && o.value && _();
-	}
-	function p(t) {
-		!o.value || t <= 0 || (o.value = !1, v(e.getAnimationLockMs(t)));
+	function p(e) {
+		!e && o.value && v();
 	}
-	function m() {
-		h() && (r.value += 1);
+	function m(t) {
+		!o.value || t <= 0 || (o.value = !1, y(e.getAnimationLockMs(t)));
 	}
 	function h() {
-		return e.hasPage.value && !e.interactionLocked?.value && !e.loading.value && !a.value && typeof e.requestPage.value == "function";
+		g() && (r.value += 1);
 	}
 	function g() {
-		return e.hasPage.value && t.value && r.value > i.value && !e.interactionLocked?.value && !e.loading.value && !a.value && typeof e.requestPage.value == "function";
+		return e.hasPage.value && !e.interactionLocked?.value && !e.loading.value && !a.value && typeof e.requestPage.value == "function";
 	}
 	function _() {
-		o.value = !1, v(ai);
+		return e.hasPage.value && t.value && r.value > i.value && !e.interactionLocked?.value && !e.loading.value && !a.value && typeof e.requestPage.value == "function";
 	}
-	function v(e) {
-		y(), a.value = !0, c = setTimeout(() => {
-			c = null, a.value = !1;
+	function v() {
+		o.value = !1, y(ai);
+	}
+	function y(e) {
+		S(), a.value = !0, l = setTimeout(() => {
+			l = null, a.value = !1, b();
 		}, Math.max(0, e));
 	}
-	function y() {
-		c &&= (clearTimeout(c), null);
+	function b() {
+		if (s.value) {
+			if (s.value = !1, !e.isAtBoundary()) {
+				o.value || (n.value = !0);
+				return;
+			}
+			t.value = !0, h(), f();
+		}
 	}
-	function b(t) {
+	function S() {
+		l &&= (clearTimeout(l), null);
+	}
+	function C(t) {
 		return e.direction === "top" ? t.deltaY < 0 : t.deltaY > 0;
 	}
 	return {
-		maybeRequestPage: d,
-		onItemsMutated: p,
-		onLoadingChange: f,
-		onWheel: u,
-		syncBoundary: l
+		maybeRequestPage: f,
+		onItemsMutated: m,
+		onLoadingChange: p,
+		onWheel: d,
+		syncBoundary: u
 	};
 }
 //#endregion
@@ -3567,9 +3588,9 @@ function fi(e) {
 }
 //#endregion
 //#region src/components/viewer-core/useMasonryList.ts
-var pi = 600, mi = 24, hi = 16, gi = 300, _i = 200, vi = 0, yi = mi + hi, bi = 200, xi = 500, Si = 1e3;
-function Ci(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 || gi), o = D([]), s = D([]), c = D(/* @__PURE__ */ new Map()), l = D(0), u = D(/* @__PURE__ */ new Map()), d = D(null), f = si(), p = i(() => Math.max(gi, a.value - mi * 2)), m = i(() => Er(p.value, gi)), h = i(() => Dr(p.value, m.value, gi, hi)), g = i(() => ti(e.bottomLoadBufferPx.value)), v = i(() => wi(e.activeIndex.value, 0, Math.max(0, e.items.value.length - 1))), y = i(() => Ar({
+var pi = 600, mi = 24, hi = 16, gi = 300, _i = 200, vi = 0, yi = 1, bi = mi + hi, xi = 200, Si = 500, Ci = 1e3;
+function wi(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 || gi), o = D([]), s = D([]), c = D(/* @__PURE__ */ new Map()), l = D(0), u = D(/* @__PURE__ */ new Map()), d = D(null), f = si(), p = i(() => Math.max(gi, a.value - mi * 2)), m = i(() => Er(p.value, gi)), h = i(() => Dr(p.value, m.value, gi, hi)), g = i(() => ti(e.bottomLoadBufferPx.value)), v = i(() => Ti(e.activeIndex.value, 0, Math.max(0, e.items.value.length - 1))), y = i(() => Ar({
 		itemCount: e.items.value.length,
 		viewportHeight: r.value,
 		scrollTop: n.value,
@@ -3581,7 +3602,7 @@ function Ci(e) {
 		index: t
 	}))), C = i(() => {
 		let e = l.value + mi * 2, t = P.reservedContentHeight.value ?? 0;
-		return Math.max(e, t, r.value) + bi + g.value;
+		return Math.max(e, t, r.value) + xi + g.value;
 	}), w = i(() => e.hasNextPage.value || e.allowExhaustedNextPageRefresh.value), T = i(() => $r({
 		active: e.active.value,
 		maxScrollTop: Y(),
@@ -3592,7 +3613,7 @@ function Ci(e) {
 		active: e.active.value,
 		maxScrollTop: Y(),
 		progressDistancePx: n.value,
-		thresholdPx: yi,
+		thresholdPx: bi,
 		triggerEnabled: e.hasPreviousPage.value
 	})), k = ei({
 		containerHeight: C,
@@ -3610,24 +3631,24 @@ function Ci(e) {
 	}), j = oi({
 		direction: "top",
 		getAnimationLockMs(e) {
-			return Math.max(xi, zr(e)) + Si;
+			return Math.max(Si, zr(e)) + Ci;
 		},
 		hasPage: e.hasPreviousPage,
 		interactionLocked: f.isBoundaryInteractionLocked,
 		isAtBoundary() {
-			return n.value <= yi;
+			return n.value <= bi;
 		},
 		loading: e.loading,
 		requestPage: e.requestPreviousPage
 	}), M = oi({
 		direction: "bottom",
 		getAnimationLockMs(e) {
-			return zr(e) + Si;
+			return zr(e) + Ci;
 		},
 		hasPage: w,
 		interactionLocked: f.isBoundaryInteractionLocked,
 		isAtBoundary() {
-			return J() <= vi;
+			return J() <= yi;
 		},
 		loading: e.loading,
 		requestPage: e.requestNextPage
@@ -3662,7 +3683,7 @@ function Ci(e) {
 			previousItems: r ?? [],
 			scrollTop: n.value
 		});
-		i.shouldLockBoundaryInteractionForRemoval && f.lockBoundaryInteraction(Br() + Si), i.shouldResetScrollForEmptyRemoval && H(), R(), i.removedItems.length > 0 && A.markLeave(i.removedItems), i.addedItems.length > 0 && (A.markEnter(i.addedItems, i.isPrepend ? "top" : "bottom"), i.isPrepend ? j.onItemsMutated(i.addedItems.length) : M.onItemsMutated(i.addedItems.length)), A.playFlipMoveAnimation(i.oldPositionsById, new Set(i.addedItems.map((e) => Q(e))), i.isPrepend ? xi : void 0), i.anchorId ? (await _(), V(i.anchorId, i.oldPositionsById)) : e.active.value && i.previousIds.length > 0 && W();
+		i.shouldLockBoundaryInteractionForRemoval && f.lockBoundaryInteraction(Br() + Ci), i.shouldResetScrollForEmptyRemoval && H(), R(), i.removedItems.length > 0 && A.markLeave(i.removedItems), i.addedItems.length > 0 && (A.markEnter(i.addedItems, i.isPrepend ? "top" : "bottom"), i.isPrepend ? j.onItemsMutated(i.addedItems.length) : M.onItemsMutated(i.addedItems.length)), A.playFlipMoveAnimation(i.oldPositionsById, new Set(i.addedItems.map((e) => Q(e))), i.isPrepend ? Si : void 0), i.anchorId ? (await _(), V(i.anchorId, i.oldPositionsById)) : e.active.value && i.previousIds.length > 0 && W();
 	}, { immediate: !0 }), L([
 		() => e.pendingAppendItems.value.map((e) => Q(e)),
 		m,
@@ -3676,7 +3697,7 @@ function Ci(e) {
 		}
 		if (N.start(), !a || i !== !1 || d.value == null) return;
 		await _();
-		let o = Math.max(0, C.value - r.value), s = wi(d.value, 0, o);
+		let o = Math.max(0, C.value - r.value), s = Ti(d.value, 0, o);
 		a.scrollTop = s, n.value = s, j.syncBoundary(), M.syncBoundary();
 	}), L(() => e.loading.value, async (e) => {
 		P.clearReservedHeightWhenIdle(e), j.onLoadingChange(e), M.onLoadingChange(e), await _();
@@ -3701,7 +3722,7 @@ function Ci(e) {
 		})), s.value = t.heights, c.value = t.buckets, l.value = t.contentHeight, u.value = t.indexById;
 	}
 	function z() {
-		e.active.value && (n.value = t.value?.scrollTop ?? 0, r.value = K(), j.syncBoundary(), M.syncBoundary(), ne(), !W() && (I ||= requestAnimationFrame(() => {
+		e.active.value && (n.value = t.value?.scrollTop ?? 0, r.value = K(), j.syncBoundary("scroll"), M.syncBoundary("scroll"), ne(), !W() && (I ||= requestAnimationFrame(() => {
 			I = 0, U();
 		})));
 	}
@@ -3722,7 +3743,7 @@ function Ci(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 - mi : c.y + l > a.scrollTop + r.value && (u = c.y + l - r.value + mi), a.scrollTop = wi(u, 0, d), n.value = a.scrollTop, U();
+		i === "center" ? u = c.y - (r.value - l) / 2 : c.y < a.scrollTop ? u = c.y - mi : c.y + l > a.scrollTop + r.value && (u = c.y + l - r.value + mi), a.scrollTop = Ti(u, 0, d), n.value = a.scrollTop, U();
 	}
 	function V(e, r) {
 		let i = t.value, a = r.get(e), s = u.value.get(e), c = s == null ? null : o.value[s];
@@ -3750,7 +3771,7 @@ function Ci(e) {
 		e.setActiveIndex(i);
 	}
 	function W() {
-		let t = n.value <= yi, r = J() <= vi;
+		let t = n.value <= bi, r = J() <= yi;
 		return t ? (e.setActiveIndex(0), !0) : r ? (e.setActiveIndex(Math.max(0, e.items.value.length - 1)), !0) : !1;
 	}
 	function ne() {
@@ -3792,17 +3813,17 @@ function Ci(e) {
 		scrollViewportRef: t
 	};
 }
-function wi(e, t, n) {
+function Ti(e, t, n) {
 	return Math.min(Math.max(e, t), n);
 }
 //#endregion
 //#region src/components/viewer-core/listCardAsset.ts
-function Ti(e) {
+function Ei(e) {
 	if (e) try {
 		e.removeAttribute("src"), e.src = "";
 	} catch {}
 }
-function Ei(e) {
+function Di(e) {
 	if (e) {
 		try {
 			e.currentTime = 0;
@@ -3813,12 +3834,12 @@ function Ei(e) {
 		} catch {}
 	}
 }
-function Di(e, t) {
+function Oi(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 Oi(e) {
+function ki(e) {
 	if (!e) return null;
 	try {
 		return new URL(e, window.location.href).href;
@@ -3828,9 +3849,9 @@ function Oi(e) {
 }
 //#endregion
 //#region src/components/viewer-core/listPreview.ts
-var ki = /\.(avif|gif|jpe?g|png|svg|webp)(\?|#|$)/i, Ai = /\.(m4v|mov|mp4|mpeg|ogg|ogv|webm)(\?|#|$)/i, ji = /^(?:(?:https?:)?\/\/[^/]+)?\/api\/files\/[^/?#]+\/(?:preview|downloaded)(?:\?|#|$)/i;
-function Mi(e) {
-	let t = Ni(e), n = t?.url, r = Tr(e), i = e.title?.trim() || Ht(e.type);
+var Ai = /\.(avif|gif|jpe?g|png|svg|webp)(\?|#|$)/i, ji = /\.(m4v|mov|mp4|mpeg|ogg|ogv|webm)(\?|#|$)/i, Mi = /^(?:(?:https?:)?\/\/[^/]+)?\/api\/files\/[^/?#]+\/(?:preview|downloaded)(?:\?|#|$)/i;
+function Ni(e) {
+	let t = Pi(e), n = t?.url, r = Tr(e), i = e.title?.trim() || Ht(e.type);
 	return t?.mediaType === "video" && typeof n == "string" ? {
 		kind: "video",
 		url: n,
@@ -3849,13 +3870,13 @@ function Mi(e) {
 		width: r.width,
 		height: r.height,
 		label: i
-	} : typeof n == "string" && Fi(e, n) ? {
+	} : typeof n == "string" && Ii(e, n) ? {
 		kind: "video",
 		url: n,
 		width: r.width,
 		height: r.height,
 		label: i
-	} : typeof n == "string" && Pi(e, n) ? {
+	} : typeof n == "string" && Fi(e, n) ? {
 		kind: "image",
 		url: n,
 		width: r.width,
@@ -3869,26 +3890,26 @@ function Mi(e) {
 		label: i
 	};
 }
-function Ni(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 : ki.test(t) || Ii(t);
-}
 function Fi(e, t) {
-	return e.type !== "video" || typeof t != "string" ? !1 : Ai.test(t) || Li(t);
+	return e.type !== "image" || typeof t != "string" ? !1 : Ai.test(t) || Li(t);
 }
-function Ii(e) {
-	return /^(https?:\/\/|\/\/|\/(?!\/)|\.{1,2}\/|blob:|data:)/i.test(e);
+function Ii(e, t) {
+	return e.type !== "video" || typeof t != "string" ? !1 : ji.test(t) || Ri(t);
 }
 function Li(e) {
-	return ji.test(e) || /^blob:/i.test(e) || /^data:video\//i.test(e);
+	return /^(https?:\/\/|\/\/|\/(?!\/)|\.{1,2}\/|blob:|data:)/i.test(e);
+}
+function Ri(e) {
+	return Mi.test(e) || /^blob:/i.test(e) || /^data:video\//i.test(e);
 }
 //#endregion
 //#region src/components/viewer-core/useListCardHealthCheck.ts
-function Ri(e) {
+function zi(e) {
 	let t = D(null), n = i(() => {
-		let t = typeof e.item.value.healthCheck?.url == "string" ? Oi(e.item.value.healthCheck.url) : null;
+		let t = typeof e.item.value.healthCheck?.url == "string" ? ki(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) => {
@@ -3966,14 +3987,14 @@ function Ri(e) {
 }
 //#endregion
 //#region src/components/ListCard.vue?vue&type=script&setup=true&lang.ts
-var zi = ["aria-label"], Bi = {
+var Bi = ["aria-label"], Vi = {
 	key: 0,
 	"data-testid": "vibe-list-card-spinner",
 	class: "pointer-events-none absolute inset-0 z-[4] grid place-items-center bg-black/18"
-}, Vi = { 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]" }, Hi = ["src", "alt"], Ui = ["src"], Wi = ["data-kind"], Gi = { class: "grid justify-items-center gap-3 px-4 text-center" }, Ki = { class: "text-[0.68rem] font-bold uppercase tracking-[0.22em] text-[#f7f1ea]/72" }, qi = {
+}, Hi = { 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]" }, Ui = ["src", "alt"], Wi = ["src"], Gi = ["data-kind"], Ki = { class: "grid justify-items-center gap-3 px-4 text-center" }, qi = { class: "text-[0.68rem] font-bold uppercase tracking-[0.22em] text-[#f7f1ea]/72" }, Ji = {
 	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))]"
-}, Ji = { class: "inline-flex h-14 w-14 items-center justify-center border border-white/16 bg-black/20" }, Yi = { class: "pointer-events-none absolute inset-0 z-[3]" }, Xi = /* @__PURE__ */ d({
+}, Yi = { class: "inline-flex h-14 w-14 items-center justify-center border border-white/16 bg-black/20" }, Xi = { class: "pointer-events-none absolute inset-0 z-[3]" }, Zi = /* @__PURE__ */ d({
 	__name: "ListCard",
 	props: {
 		active: {
@@ -3997,7 +4018,7 @@ var zi = ["aria-label"], Bi = {
 	},
 	emits: ["open"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, l = i(() => Mi(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 = Ri({
+		let n = e, r = t, l = i(() => Ni(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 = zi({
 			attachedAssetUrl: E,
 			getPriority: ue,
 			isInView: d,
@@ -4117,7 +4138,7 @@ var zi = ["aria-label"], Bi = {
 				d.value = !0;
 				return;
 			}
-			d.value = Di(e?.boundingClientRect ?? t.getBoundingClientRect(), e?.rootBounds ?? b.value?.getBoundingClientRect() ?? null);
+			d.value = Oi(e?.boundingClientRect ?? t.getBoundingClientRect(), e?.rootBounds ?? b.value?.getBoundingClientRect() ?? null);
 		}
 		function ie(e) {
 			if (!e) return;
@@ -4137,10 +4158,10 @@ var zi = ["aria-label"], Bi = {
 			}), g.value = null, m.value = !1, T.value = !1, Y(), K();
 		}
 		function se() {
-			Ti(_.value);
+			Ei(_.value);
 		}
 		function ce() {
-			Ei(C.value);
+			Di(C.value);
 		}
 		function ue() {
 			let e = y.value;
@@ -4154,8 +4175,8 @@ var zi = ["aria-label"], Bi = {
 			return Math.abs((t.top + t.bottom) / 2 - n);
 		}
 		function X(e) {
-			let t = Oi(E.value);
-			return !e || !t ? !1 : Oi("currentSrc" in e && e.currentSrc || e.getAttribute("src")) === t;
+			let t = ki(E.value);
+			return !e || !t ? !1 : ki("currentSrc" in e && e.currentSrc || e.getAttribute("src")) === t;
 		}
 		function de() {
 			r("open");
@@ -4183,8 +4204,8 @@ var zi = ["aria-label"], Bi = {
 				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, zi),
-			ee.value ? (w(), s("div", Bi, [c("span", Vi, [u(N(oe), {
+			}, null, 8, Bi),
+			ee.value ? (w(), s("div", Vi, [c("span", Hi, [u(N(oe), {
 				class: "h-5 w-5 animate-spin stroke-[1.9] text-[#f7f1ea]/78",
 				"aria-hidden": "true"
 			})])])) : o("", !0),
@@ -4198,7 +4219,7 @@ var zi = ["aria-label"], Bi = {
 				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, Hi)) : P.value && E.value && !R.value ? (w(), s("video", {
+			}, null, 42, Ui)) : P.value && E.value && !R.value ? (w(), s("video", {
 				key: 2,
 				ref_key: "videoRef",
 				ref: C,
@@ -4214,31 +4235,31 @@ var zi = ["aria-label"], Bi = {
 				onPlaying: ne,
 				onStalled: G,
 				onWaiting: G
-			}, null, 42, Ui)) : R.value ? (w(), s("div", {
+			}, null, 42, Wi)) : 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", Gi, [
+			}, [c("div", Ki, [
 				u(N(le), {
 					class: "h-6 w-6 stroke-[1.8] text-[#f7f1ea]/78",
 					"aria-hidden": "true"
 				}),
-				c("span", Ki, j(N(hn)(I.value)), 1),
+				c("span", qi, j(N(hn)(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: te(ae, ["stop"])
 				}, " Retry ")) : o("", !0)
-			])], 8, Wi)) : (w(), s("div", qi, [c("div", Ji, [k(e.$slots, "item-icon", {
+			])], 8, Gi)) : (w(), s("div", Ji, [c("div", Yi, [k(e.$slots, "item-icon", {
 				icon: N(Vt)(n.item.type),
 				item: n.item
 			}, () => [(w(), a(A(N(Vt)(n.item.type)), {
 				class: "h-6 w-6 stroke-[1.8] text-[#f7f1ea]/78",
 				"aria-hidden": "true"
 			}))])])])),
-			c("div", Yi, [k(e.$slots, "grid-item-overlay", {
+			c("div", Xi, [k(e.$slots, "grid-item-overlay", {
 				active: n.active,
 				focused: f.value,
 				hovered: p.value,
@@ -4248,24 +4269,24 @@ var zi = ["aria-label"], Bi = {
 			})])
 		], 34));
 	}
-}), Zi = { 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)]" }, Qi = { class: "pointer-events-none absolute inset-x-0 top-0 z-[2] flex justify-end p-6" }, $i = {
+}), Qi = { 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)]" }, $i = { class: "pointer-events-none absolute inset-x-0 top-0 z-[2] flex justify-end p-6" }, ea = {
 	"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]"
-}, ea = { class: "whitespace-nowrap" }, ta = {
+}, ta = { class: "whitespace-nowrap" }, na = {
 	key: 0,
 	class: "whitespace-nowrap border-l border-white/12 pl-2 text-[#f7f1ea]/56 min-[721px]:pl-3"
-}, na = [
+}, ra = [
 	"data-active",
 	"data-index",
 	"data-item-id",
 	"data-occurrence-key"
-], ra = ["data-item-id"], ia = {
+], ia = ["data-item-id"], aa = {
 	key: 0,
 	class: "pointer-events-none absolute inset-y-0 right-0 z-[3] hidden w-8 min-[1024px]:block"
-}, aa = {
+}, oa = {
 	key: 1,
 	class: "pointer-events-none absolute inset-x-0 bottom-0 z-[2] px-5 pb-5 sm:px-6"
-}, oa = { class: "mx-auto flex w-full justify-center" }, sa = /* @__PURE__ */ d({
+}, sa = { class: "mx-auto flex w-full justify-center" }, ca = /* @__PURE__ */ d({
 	__name: "ListSurface",
 	props: {
 		active: {
@@ -4327,7 +4348,7 @@ var zi = ["aria-label"], Bi = {
 		"update:activeIndex"
 	],
 	setup(e, { expose: n, emit: r }) {
-		let d = e, f = F(), p = r, m = Ci({
+		let d = e, f = F(), p = r, m = wi({
 			active: M(d, "active"),
 			allowExhaustedNextPageRefresh: M(d, "allowExhaustedNextPageRefresh"),
 			bottomLoadBufferPx: M(d, "bottomLoadBufferPx"),
@@ -4375,8 +4396,8 @@ var zi = ["aria-label"], Bi = {
 				nextBoundaryLoadProgress: e,
 				previousBoundaryLoadProgress: t
 			});
-		}, { immediate: !0 }), (e, n) => (w(), s("div", Zi, [
-			c("div", Qi, [c("span", $i, [c("span", ea, j(N(m).paginationLabel.value), 1), d.paginationDetail ? (w(), s("span", ta, j(d.paginationDetail), 1)) : o("", !0)])]),
+		}, { immediate: !0 }), (e, n) => (w(), s("div", Qi, [
+			c("div", $i, [c("span", ea, [c("span", ta, j(N(m).paginationLabel.value), 1), d.paginationDetail ? (w(), s("span", na, j(d.paginationDetail), 1)) : o("", !0)])]),
 			c("div", {
 				ref: N(m).scrollViewportRef,
 				"data-testid": "vibe-list-scroll",
@@ -4397,7 +4418,7 @@ var zi = ["aria-label"], Bi = {
 					"data-occurrence-key": N(Q)(t),
 					class: "absolute will-change-transform",
 					style: b(N(m).getCardStyle(n))
-				}, [u(Xi, {
+				}, [u(Zi, {
 					active: n === N(m).resolvedActiveIndex.value,
 					index: n,
 					item: t,
@@ -4421,14 +4442,14 @@ var zi = ["aria-label"], Bi = {
 					"report-asset-load",
 					"surface-active",
 					"onOpen"
-				])], 12, na))), 128)),
+				])], 12, ra))), 128)),
 				(w(!0), s(t, null, O(N(m).leavingItems.value, (t) => (w(), s("article", {
 					key: `leaving-${N(Q)(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(m).getLeavingCardStyle(t.item))
-				}, [u(Xi, {
+				}, [u(Zi, {
 					active: !1,
 					index: -1,
 					item: t.item,
@@ -4443,7 +4464,7 @@ var zi = ["aria-label"], Bi = {
 					"item",
 					"report-asset-error",
 					"report-asset-load"
-				])], 12, ra))), 128)),
+				])], 12, ia))), 128)),
 				N(P) && N(E) ? (w(), a(Bn, {
 					key: 0,
 					message: N(E).message,
@@ -4458,12 +4479,12 @@ var zi = ["aria-label"], Bi = {
 					"surface"
 				])) : o("", !0)
 			], 4)], 544),
-			N(m).showScrollbar.value ? (w(), s("div", ia, [n[2] ||= c("div", { class: "absolute bottom-6 right-3 top-6 w-px bg-white/8" }, null, -1), c("div", {
+			N(m).showScrollbar.value ? (w(), s("div", aa, [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", d.loading ? "bg-white/52" : "bg-white/34"]),
 				style: b(N(m).getScrollbarThumbStyle())
 			}, null, 6)])) : o("", !0),
-			f["grid-footer"] ? (w(), s("div", aa, [c("div", oa, [k(e.$slots, "grid-footer")])])) : o("", !0),
+			f["grid-footer"] ? (w(), s("div", oa, [c("div", sa, [k(e.$slots, "grid-footer")])])) : o("", !0),
 			x.value ? (w(), s("div", {
 				key: 2,
 				class: v(["pointer-events-none absolute inset-x-0 bottom-0 z-[3] flex justify-center px-6", f["grid-footer"] ? "pb-24" : "pb-6"])
@@ -4489,13 +4510,13 @@ var zi = ["aria-label"], Bi = {
 			])) : o("", !0)
 		]));
 	}
-}), ca = ["data-surface-mode"], la = {
+}), la = ["data-surface-mode"], ua = {
 	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"
-}, ua = ["data-visible", "inert"], da = ["data-visible", "inert"], fa = {
+}, da = ["data-visible", "inert"], fa = ["data-visible", "inert"], pa = {
 	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"
-}, pa = /* @__PURE__ */ d({
+}, ma = /* @__PURE__ */ d({
 	name: "VibeLayout",
 	__name: "Layout",
 	props: {
@@ -4563,7 +4584,7 @@ var zi = ["aria-label"], Bi = {
 			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", la, 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", ua, 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",
@@ -4577,7 +4598,7 @@ var zi = ["aria-label"], Bi = {
 				"data-visible": N(h).surfaceMode.value === "list" ? "true" : "false",
 				inert: N(h).surfaceMode.value !== "list",
 				class: "absolute inset-0 z-[2]"
-			}, [u(sa, {
+			}, [u(ca, {
 				ref_key: "listSurfaceRef",
 				ref: g,
 				active: N(h).surfaceMode.value === "list",
@@ -4651,7 +4672,7 @@ var zi = ["aria-label"], Bi = {
 				"onBoundaryLoadProgress",
 				"onOpenFullscreen",
 				"onUpdate:activeIndex"
-			])], 8, ua), [[I, N(h).surfaceMode.value === "list"]])]),
+			])], 8, da), [[I, N(h).surfaceMode.value === "list"]])]),
 			_: 3
 		}), u(r, {
 			appear: "",
@@ -4736,9 +4757,9 @@ var zi = ["aria-label"], Bi = {
 				"show-back-to-list",
 				"onBackToList",
 				"onUpdate:activeIndex"
-			])], 8, da), [[I, N(h).surfaceMode.value === "fullscreen"]])]),
+			])], 8, fa), [[I, N(h).surfaceMode.value === "fullscreen"]])]),
 			_: 3
-		})], 64)) : N(h).items.value.length === 0 && N(h).loading.value ? (w(), s("div", fa, [u(N(oe), {
+		})], 64)) : N(h).items.value.length === 0 && N(h).loading.value ? (w(), s("div", pa, [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(Sr, {
@@ -4809,10 +4830,10 @@ var zi = ["aria-label"], Bi = {
 			"show-status-badges",
 			"onBackToList",
 			"onUpdate:activeIndex"
-		]))], 8, ca));
+		]))], 8, la));
 	}
-}), ma = { install(e) {
-	e.component("VibeLayout", pa);
+}), ha = { install(e) {
+	e.component("VibeLayout", ma);
 } };
 //#endregion
-export { pa as VibeLayout, ma as VibePlugin, ma as default };
+export { ma as VibeLayout, ha as VibePlugin, ha as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wyxos/vibe",
-  "version": "3.1.23",
+  "version": "3.1.24",
   "description": "A Vue 3 media viewer for large feeds of image, video, audio, and mixed-content items.",
   "keywords": [
     "vue",