@wyxos/vibe 4.5.4 → 4.5.5

package/lib/index.js

@@ -1,20 +1,20 @@
-import { Fragment as e, Teleport as t, Transition as n, computed as r, createApp as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, guardReactiveProps as f, h as p, nextTick as m, normalizeClass as h, normalizeProps as g, normalizeStyle as _, onBeforeUnmount as ee, onMounted as v, openBlock as y, reactive as b, renderList as x, resolveDynamicComponent as S, shallowRef as C, toDisplayString as w, unref as T, useId as E, watch as D, withCtx as O, withKeys as k, withModifiers as A } from "vue";
+import { Fragment as e, Teleport as t, Transition as n, computed as r, createApp as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, guardReactiveProps as f, h as p, nextTick as m, normalizeClass as h, normalizeProps as g, normalizeStyle as _, onBeforeUnmount as v, onMounted as y, openBlock as b, reactive as x, renderList as S, resolveDynamicComponent as C, shallowRef as w, toDisplayString as T, unref as E, useId as D, watch as O, withCtx as k, withKeys as A, withModifiers as j } from "vue";
 //#region src/core/mediaAsset.ts
-function j(e) {
+function M(e) {
 	return [e, ...e.items];
 }
-function M(e, t) {
-	return Math.min(e.items.length, Math.max(0, t));
-}
 function N(e, t) {
-	return j(e)[M(e, t)] ?? e;
+	return Math.min(e.items.length, Math.max(0, t));
 }
 function P(e, t) {
+	return M(e)[N(e, t)] ?? e;
+}
+function F(e, t) {
 	return `${String(e)}:${t}`;
 }
 //#endregion
 //#region src/core/runtime.ts
-function F(e) {
+function I(e) {
 	return {
 		activeReelPostId: e.activeReelPostId,
 		autoScroll: { ...e.autoScroll },
@@ -42,17 +42,17 @@ function F(e) {
 }
 //#endregion
 //#region src/components/GalleryFooter.vue?vue&type=script&setup=true&lang.ts
-var I = {
+var L = {
 	key: 0,
 	class: "gallery-footer"
-}, L = {
+}, R = {
 	key: 0,
 	class: "load-more-status",
 	role: "status"
-}, R = ["disabled"], z = {
+}, z = ["disabled"], B = {
 	key: 2,
 	class: "end-feed"
-}, B = ["disabled"], V = /* @__PURE__ */ d({
+}, V = ["disabled"], H = /* @__PURE__ */ d({
 	__name: "GalleryFooter",
 	props: {
 		canRetryEnd: { type: Boolean },
@@ -67,14 +67,14 @@ var I = {
 		function i() {
 			n.loadMoreLocked || (n.hasNext ? r("loadMore") : r("retryEnd"));
 		}
-		return (t, n) => e.hasNext || e.isLoading || e.hasError || e.canRetryEnd ? (y(), s("footer", I, [e.isLoading ? (y(), s("p", L, " Loading more… ")) : e.hasError || e.hasNext ? (y(), s("button", {
+		return (t, n) => e.hasNext || e.isLoading || e.hasError || e.canRetryEnd ? (b(), s("footer", L, [e.isLoading ? (b(), s("p", R, " Loading more… ")) : e.hasError || e.hasNext ? (b(), s("button", {
 			key: 1,
 			"data-test": "load-more",
 			class: "load-more-button",
 			type: "button",
 			disabled: e.loadMoreLocked,
 			onClick: i
-		}, w(e.hasError ? "Try again" : e.loadMoreLocked ? "Loading paused" : "Load more"), 9, R)) : (y(), s("div", z, [n[1] ||= c("p", {
+		}, T(e.hasError ? "Try again" : e.loadMoreLocked ? "Loading paused" : "Load more"), 9, z)) : (b(), s("div", B, [n[1] ||= c("p", {
 			class: "end-feed-message",
 			role: "status"
 		}, " You've reached the end. ", -1), c("button", {
@@ -83,9 +83,9 @@ var I = {
 			type: "button",
 			disabled: e.loadMoreLocked,
 			onClick: n[0] ||= (e) => t.$emit("retryEnd")
-		}, " Check for more ", 8, B)]))])) : o("", !0);
+		}, " Check for more ", 8, V)]))])) : o("", !0);
 	}
-}), H = /* @__PURE__ */ d({
+}), U = /* @__PURE__ */ d({
 	__name: "FeedFooter",
 	props: {
 		actions: {},
@@ -106,7 +106,7 @@ var I = {
 		function o() {
 			n.actions?.retry();
 		}
-		return (t, n) => e.feedFooter && e.actions && e.state ? (y(), a(S(e.feedFooter.component), {
+		return (t, n) => e.feedFooter && e.actions && e.state ? (b(), a(C(e.feedFooter.component), {
 			key: 0,
 			actions: e.actions,
 			"can-retry-end": e.canRetryEnd,
@@ -119,7 +119,7 @@ var I = {
 			"actions",
 			"can-retry-end",
 			"state"
-		])) : (y(), a(V, {
+		])) : (b(), a(H, {
 			key: 1,
 			"can-retry-end": e.canRetryEnd,
 			"has-error": e.hasError,
@@ -136,7 +136,7 @@ var I = {
 			"load-more-locked"
 		]));
 	}
-}), U = ["role"], W = { class: "gallery-status" }, te = /* @__PURE__ */ d({
+}), W = ["role"], G = { class: "gallery-status" }, ee = /* @__PURE__ */ d({
 	__name: "FeedStatus",
 	props: {
 		actions: {},
@@ -147,10 +147,10 @@ var I = {
 	emits: ["loadMore", "retryEnd"],
 	setup(t, { emit: n }) {
 		let r = t, i = n;
-		return (n, u) => (y(), s("main", {
+		return (n, u) => (b(), s("main", {
 			class: "gallery-shell",
 			role: r.state.error ? "alert" : r.state.isLoading ? "status" : void 0
-		}, [c("p", W, [r.state.error ? (y(), s(e, { key: 0 }, [l(" Unable to load media. ")], 64)) : r.state.isLoading ? (y(), s(e, { key: 1 }, [l(" Loading media… ")], 64)) : (y(), s(e, { key: 2 }, [l(" No media found. ")], 64))]), t.feedFooter ? (y(), a(H, {
+		}, [c("p", G, [r.state.error ? (b(), s(e, { key: 0 }, [l(" Unable to load media. ")], 64)) : r.state.isLoading ? (b(), s(e, { key: 1 }, [l(" Loading media… ")], 64)) : (b(), s(e, { key: 2 }, [l(" No media found. ")], 64))]), t.feedFooter ? (b(), a(U, {
 			key: 0,
 			actions: t.actions,
 			"can-retry-end": t.canRetryEnd,
@@ -171,36 +171,36 @@ var I = {
 			"is-loading",
 			"load-more-locked",
 			"state"
-		])) : o("", !0)], 8, U));
+		])) : o("", !0)], 8, W));
 	}
 });
-function G(e) {
+function K(e) {
 	return e.scrollHeight - e.scrollTop - e.clientHeight <= 240;
 }
 //#endregion
 //#region src/core/masonry.ts
-function ne(e) {
+function te(e) {
 	let t = e.preview.width ?? e.width, n = e.preview.height ?? e.height;
 	return !t || !n || t <= 0 || n <= 0 ? 1 : n / t;
 }
-function re(e) {
+function ne(e) {
 	return e.reduce((t, n, r) => n < e[t] ? r : t, 0);
 }
-function ie(e) {
+function re(e) {
 	return Math.max(0, e.containerHeight) + Math.max(0, e.gap);
 }
-function K(e, t) {
+function q(e, t) {
 	let n = Math.max(0, t.overscan), r = t.scrollTop - n, i = t.scrollTop + Math.max(0, t.viewportHeight) + n;
 	return e.reduce((e, t, n) => (t.y + t.height >= r && t.y <= i && e.push(n), e), []);
 }
-function q(e, t, n) {
+function J(e, t, n) {
 	if (t <= 0 || e.length === 0) return {
 		columns: 0,
 		height: 0,
 		items: []
 	};
 	let r = Math.max(0, n.gap), i = Number.isFinite(n.additionalHeight) ? Math.max(0, n.additionalHeight ?? 0) : 0, a = Math.max(1, n.minColumnWidth), o = Math.max(1, Math.floor((t + r) / (a + r))), s = (t - r * (o - 1)) / o, c = Array.from({ length: o }, () => 0), l = e.map((e) => {
-		let t = re(c), n = s * ne(e) + i, a = {
+		let t = ne(c), n = s * te(e) + i, a = {
 			x: t * (s + r),
 			y: c[t],
 			width: s,
@@ -216,10 +216,10 @@ function q(e, t, n) {
 }
 //#endregion
 //#region src/core/scrollbar.ts
-function ae(e, t, n) {
+function ie(e, t, n) {
 	return Math.min(n, Math.max(t, e));
 }
-function J({ contentSize: e, minimumThumbSize: t, scrollPosition: n, trackSize: r, viewportSize: i }) {
+function Y({ contentSize: e, minimumThumbSize: t, scrollPosition: n, trackSize: r, viewportSize: i }) {
 	let a = Math.max(0, e), o = Math.max(0, r), s = Math.max(0, i), c = Math.max(0, a - s);
 	if (!(c > 0 && o > 0)) return {
 		maximumScrollPosition: c,
@@ -228,23 +228,23 @@ function J({ contentSize: e, minimumThumbSize: t, scrollPosition: n, trackSize:
 		thumbSize: o,
 		thumbTravel: 0
 	};
-	let l = ae(s / a * o, Math.min(Math.max(0, t), o), o), u = Math.max(0, o - l);
+	let l = ie(s / a * o, Math.min(Math.max(0, t), o), o), u = Math.max(0, o - l);
 	return {
 		maximumScrollPosition: c,
 		scrollable: !0,
-		thumbOffset: u * (ae(n, 0, c) / c),
+		thumbOffset: u * (ie(n, 0, c) / c),
 		thumbSize: l,
 		thumbTravel: u
 	};
 }
 //#endregion
 //#region src/components/GalleryScrollbar.vue?vue&type=script&setup=true&lang.ts
-var Y = ["aria-hidden"], oe = [
+var X = ["aria-hidden"], ae = [
 	"aria-controls",
 	"aria-valuemax",
 	"aria-valuenow",
 	"tabindex"
-], se = 32, X = 40, ce = 120, le = /* @__PURE__ */ d({
+], oe = 32, se = 40, ce = 120, le = /* @__PURE__ */ d({
 	__name: "GalleryScrollbar",
 	props: {
 		contentSize: {},
@@ -259,31 +259,31 @@ var Y = ["aria-hidden"], oe = [
 			thumbOffset: 0,
 			thumbSize: 0,
 			thumbTravel: 0
-		}, i = C(null), a = C(n), o = C(!1), l = C(!1), u = C(!1), d = null, f = 0, p = 0, g = null, v = null, b = null, x = null, S = !1, w = null, T = r(() => a.value.scrollable && !t.suspended), E = r(() => ({
+		}, i = w(null), a = w(n), o = w(!1), l = w(!1), u = w(!1), d = null, f = 0, p = 0, g = null, y = null, x = null, S = null, C = !1, T = null, E = r(() => a.value.scrollable && !t.suspended), D = r(() => ({
 			height: `${a.value.thumbSize}px`,
 			transform: `translate3d(0, ${a.value.thumbOffset}px, 0)`
 		}));
-		function O() {
+		function k() {
 			g !== null && clearTimeout(g), g = setTimeout(() => {
 				g = null, o.value || (l.value = !1);
 			}, ce);
 		}
-		function k() {
-			l.value = !0, O();
-		}
 		function A() {
+			l.value = !0, k();
+		}
+		function j() {
 			let e = t.scrollElement, r = i.value;
-			return !e || !r ? n : J({
+			return !e || !r ? n : Y({
 				contentSize: e.scrollHeight,
-				minimumThumbSize: se,
+				minimumThumbSize: oe,
 				scrollPosition: e.scrollTop,
 				trackSize: r.clientHeight,
 				viewportSize: e.clientHeight
 			});
 		}
-		function j(e) {
+		function M(e) {
 			if (o.value && e !== "scroll") {
-				S = !0;
+				C = !0;
 				return;
 			}
 			if (o.value) {
@@ -296,68 +296,68 @@ var Y = ["aria-hidden"], oe = [
 				};
 				return;
 			}
-			a.value = A(), !(u.value || v !== null) && (v = requestAnimationFrame(() => {
-				v = null, u.value = !0;
+			a.value = j(), !(u.value || y !== null) && (y = requestAnimationFrame(() => {
+				y = null, u.value = !0;
 			}));
 		}
-		function M() {
-			k(), j("scroll");
+		function N() {
+			A(), M("scroll");
 		}
-		function N(e) {
+		function P(e) {
 			let n = t.scrollElement;
-			n && (n.scrollTop = Math.min(a.value.maximumScrollPosition, Math.max(0, e)), j("scroll"));
+			n && (n.scrollTop = Math.min(a.value.maximumScrollPosition, Math.max(0, e)), M("scroll"));
 		}
-		function P(e) {
-			if (!T.value || e.target !== e.currentTarget) return;
+		function F(e) {
+			if (!E.value || e.target !== e.currentTarget) return;
 			let t = i.value;
 			if (!t || a.value.thumbTravel <= 0) return;
-			e.preventDefault(), k();
+			e.preventDefault(), A();
 			let n = e.clientY - t.getBoundingClientRect().top - a.value.thumbSize / 2;
-			N(Math.min(1, Math.max(0, n / a.value.thumbTravel)) * a.value.maximumScrollPosition);
-		}
-		function F(e) {
-			T.value && (e.preventDefault(), e.stopPropagation(), e.currentTarget.setPointerCapture?.(e.pointerId), d = e.pointerId, f = e.clientY, p = t.scrollElement?.scrollTop ?? 0, o.value = !0, l.value = !0, g !== null && clearTimeout(g), g = null);
+			P(Math.min(1, Math.max(0, n / a.value.thumbTravel)) * a.value.maximumScrollPosition);
 		}
 		function I(e) {
-			if (!o.value || e.pointerId !== d || (e.preventDefault(), a.value.thumbTravel <= 0)) return;
-			let t = (e.clientY - f) / a.value.thumbTravel * a.value.maximumScrollPosition;
-			N(p + t);
+			E.value && (e.preventDefault(), e.stopPropagation(), e.currentTarget.setPointerCapture?.(e.pointerId), d = e.pointerId, f = e.clientY, p = t.scrollElement?.scrollTop ?? 0, o.value = !0, l.value = !0, g !== null && clearTimeout(g), g = null);
 		}
 		function L(e) {
-			!o.value || e.pointerId !== d || (e.currentTarget.releasePointerCapture?.(e.pointerId), d = null, o.value = !1, S && (S = !1, j("content")), O());
+			if (!o.value || e.pointerId !== d || (e.preventDefault(), a.value.thumbTravel <= 0)) return;
+			let t = (e.clientY - f) / a.value.thumbTravel * a.value.maximumScrollPosition;
+			P(p + t);
 		}
 		function R(e) {
-			if (!T.value) return;
-			let n = t.scrollElement?.clientHeight ?? 0, r = t.scrollElement?.scrollTop ?? 0, i = e.key === "ArrowUp" ? r - X : e.key === "ArrowDown" ? r + X : e.key === "PageUp" ? r - n : e.key === "PageDown" ? r + n : e.key === "Home" ? 0 : e.key === "End" ? a.value.maximumScrollPosition : null;
-			i !== null && (e.preventDefault(), k(), N(i));
+			!o.value || e.pointerId !== d || (e.currentTarget.releasePointerCapture?.(e.pointerId), d = null, o.value = !1, C && (C = !1, M("content")), k());
 		}
 		function z(e) {
-			if (x?.disconnect(), !(typeof ResizeObserver > "u")) {
-				x = new ResizeObserver(() => j("content"));
-				for (let t of e.children) x.observe(t);
+			if (!E.value) return;
+			let n = t.scrollElement?.clientHeight ?? 0, r = t.scrollElement?.scrollTop ?? 0, i = e.key === "ArrowUp" ? r - se : e.key === "ArrowDown" ? r + se : e.key === "PageUp" ? r - n : e.key === "PageDown" ? r + n : e.key === "Home" ? 0 : e.key === "End" ? a.value.maximumScrollPosition : null;
+			i !== null && (e.preventDefault(), A(), P(i));
+		}
+		function B(e) {
+			if (S?.disconnect(), !(typeof ResizeObserver > "u")) {
+				S = new ResizeObserver(() => M("content"));
+				for (let t of e.children) S.observe(t);
 			}
 		}
-		return D(() => t.scrollElement, (e, t) => {
-			t?.removeEventListener("scroll", M), b?.disconnect(), b = null, x?.disconnect(), x = null, w?.disconnect(), w = null, e?.addEventListener("scroll", M, { passive: !0 }), e && typeof ResizeObserver < "u" && (w = new ResizeObserver(() => {
-				k(), j("resize");
-			}), w.observe(e), z(e)), e && typeof MutationObserver < "u" && (b = new MutationObserver(() => {
-				z(e), j("content");
-			}), b.observe(e, { childList: !0 })), m(() => j("resize"));
-		}, { immediate: !0 }), D(() => t.contentSize, () => {
-			m(() => j("content"));
-		}), ee(() => {
-			t.scrollElement?.removeEventListener("scroll", M), b?.disconnect(), x?.disconnect(), w?.disconnect(), g !== null && clearTimeout(g), v !== null && cancelAnimationFrame(v);
-		}), (t, n) => (y(), s("div", {
+		return O(() => t.scrollElement, (e, t) => {
+			t?.removeEventListener("scroll", N), x?.disconnect(), x = null, S?.disconnect(), S = null, T?.disconnect(), T = null, e?.addEventListener("scroll", N, { passive: !0 }), e && typeof ResizeObserver < "u" && (T = new ResizeObserver(() => {
+				A(), M("resize");
+			}), T.observe(e), B(e)), e && typeof MutationObserver < "u" && (x = new MutationObserver(() => {
+				B(e), M("content");
+			}), x.observe(e, { childList: !0 })), m(() => M("resize"));
+		}, { immediate: !0 }), O(() => t.contentSize, () => {
+			m(() => M("content"));
+		}), v(() => {
+			t.scrollElement?.removeEventListener("scroll", N), x?.disconnect(), S?.disconnect(), T?.disconnect(), g !== null && clearTimeout(g), y !== null && cancelAnimationFrame(y);
+		}), (t, n) => (b(), s("div", {
 			ref_key: "trackElement",
 			ref: i,
 			class: h(["gallery-scrollbar", {
 				"gallery-scrollbar--dragging": o.value,
 				"gallery-scrollbar--interacting": l.value,
 				"gallery-scrollbar--ready": u.value,
-				"gallery-scrollbar--visible": T.value
+				"gallery-scrollbar--visible": E.value
 			}]),
-			"aria-hidden": !T.value || void 0,
-			onPointerdown: P
+			"aria-hidden": !E.value || void 0,
+			onPointerdown: F
 		}, [c("div", {
 			class: "gallery-scrollbar-thumb",
 			"aria-controls": e.controlsId,
@@ -367,14 +367,14 @@ var Y = ["aria-hidden"], oe = [
 			"aria-valuemin": "0",
 			"aria-valuenow": Math.round(e.scrollElement?.scrollTop ?? 0),
 			role: "scrollbar",
-			style: _(E.value),
-			tabindex: T.value ? 0 : -1,
-			onKeydown: R,
-			onPointercancel: L,
-			onPointerdown: F,
-			onPointermove: I,
-			onPointerup: L
-		}, null, 44, oe)], 42, Y));
+			style: _(D.value),
+			tabindex: E.value ? 0 : -1,
+			onKeydown: z,
+			onPointercancel: R,
+			onPointerdown: I,
+			onPointermove: L,
+			onPointerup: R
+		}, null, 44, ae)], 42, X));
 	}
 }), Z = (e) => {
 	for (let t in e) if (t.startsWith("aria-") || t === "role" || t === "title") return !0;
@@ -501,17 +501,17 @@ var ke = /* @__PURE__ */ d({
 		total: {}
 	},
 	setup(e) {
-		let t = e, n = r(() => M(t.item, t.mediaIndex)), i = r(() => j(t.item)), o = r(() => N(t.item, n.value)), c = r(() => ({
+		let t = e, n = r(() => N(t.item, t.mediaIndex)), i = r(() => M(t.item)), o = r(() => P(t.item, n.value)), c = r(() => ({
 			height: `${t.region.height}px`,
 			paddingBlock: t.style?.paddingY === void 0 ? void 0 : `${t.style.paddingY}px`,
 			paddingInline: t.style?.paddingX === void 0 ? void 0 : `${t.style.paddingX}px`
 		})), l = r(() => t.style?.background ?? t.region.background);
-		return (t, r) => (y(), s("div", {
+		return (t, r) => (b(), s("div", {
 			class: h(["media-card-region", [`media-card-${e.placement}`, { "media-card-region--transparent": l.value === "transparent" }]]),
 			style: _(c.value),
-			onClick: r[0] ||= A(() => {}, ["stop"]),
-			onKeydown: r[1] ||= A(() => {}, ["stop"])
-		}, [(y(), a(S(e.region.component), {
+			onClick: r[0] ||= j(() => {}, ["stop"]),
+			onKeydown: r[1] ||= j(() => {}, ["stop"])
+		}, [(b(), a(C(e.region.component), {
 			index: e.index,
 			item: e.item,
 			layout: e.layout,
@@ -573,13 +573,13 @@ var ke = /* @__PURE__ */ d({
 			return Number(e.target.value);
 		}
 		let f = r(() => Math.max(0, n.duration)), p = r(() => l(n.currentTime, f.value)), m = r(() => ({ "--media-range-progress": `${f.value > 0 ? p.value / f.value * 100 : 0}%` })), g = r(() => ({ "--media-range-progress": `${l(n.volume) * 100}%` }));
-		return (t, n) => (y(), s("div", {
+		return (t, n) => (b(), s("div", {
 			class: h(["media-controls", `media-controls--${e.layout}`]),
 			"aria-label": "Video controls",
-			onClick: n[4] ||= A(() => {}, ["stop"]),
-			onDblclick: n[5] ||= A(() => {}, ["stop"]),
-			onKeydown: n[6] ||= A(() => {}, ["stop"]),
-			onWheel: n[7] ||= A(() => {}, ["stop"])
+			onClick: n[4] ||= j(() => {}, ["stop"]),
+			onDblclick: n[5] ||= j(() => {}, ["stop"]),
+			onKeydown: n[6] ||= j(() => {}, ["stop"]),
+			onWheel: n[7] ||= j(() => {}, ["stop"])
 		}, [c("input", {
 			class: "media-control-range media-control-seek",
 			type: "range",
@@ -592,18 +592,18 @@ var ke = /* @__PURE__ */ d({
 			"aria-valuetext": `${u(p.value)} of ${u(f.value)}`,
 			disabled: f.value <= 0,
 			onInput: n[0] ||= (e) => i("seek", d(e))
-		}, null, 44, Ae), e.layout === "reel" ? (y(), s("div", je, [
+		}, null, 44, Ae), e.layout === "reel" ? (b(), s("div", je, [
 			c("button", {
 				type: "button",
 				class: "media-control-button media-control-playback",
 				"aria-label": e.playing ? "Pause video" : "Play video",
 				title: e.playing ? "Pause" : "Play",
 				onClick: n[1] ||= (e) => i("togglePlayback")
-			}, [e.playing ? (y(), a(T(be), {
+			}, [e.playing ? (b(), a(E(be), {
 				key: 0,
 				size: 18,
 				fill: "currentColor"
-			})) : (y(), a(T(xe), {
+			})) : (b(), a(E(xe), {
 				key: 1,
 				size: 18,
 				fill: "currentColor"
@@ -614,10 +614,10 @@ var ke = /* @__PURE__ */ d({
 				"aria-label": e.muted ? "Unmute video" : "Mute video",
 				title: e.muted ? "Unmute" : "Mute",
 				onClick: n[2] ||= (e) => i("toggleMute")
-			}, [e.muted || e.volume === 0 ? (y(), a(T(Ce), {
+			}, [e.muted || e.volume === 0 ? (b(), a(E(Ce), {
 				key: 0,
 				size: 18
-			})) : (y(), a(T(Se), {
+			})) : (b(), a(E(Se), {
 				key: 1,
 				size: 18
 			}))], 8, Pe), c("input", {
@@ -632,7 +632,7 @@ var ke = /* @__PURE__ */ d({
 				"aria-valuetext": `${Math.round(e.volume * 100)} percent`,
 				onInput: n[3] ||= (e) => i("volumeChange", d(e))
 			}, null, 44, Fe)]),
-			c("output", Ie, w(u(p.value)) + " / " + w(u(f.value)), 1)
+			c("output", Ie, T(u(p.value)) + " / " + T(u(f.value)), 1)
 		])) : o("", !0)], 34));
 	}
 }), Re = [
@@ -692,58 +692,58 @@ var ke = /* @__PURE__ */ d({
 		"ready"
 	],
 	setup(e, { emit: i }) {
-		let l = e, d = null, f = 0, p = !1, m = null, g = null, v = C("next"), b = i;
-		function x(e = !1, t = "pointer") {
-			e && b("activate", t);
+		let l = e, d = null, f = 0, p = !1, m = null, g = null, y = w("next"), x = i;
+		function S(e = !1, t = "pointer") {
+			e && x("activate", t);
 		}
-		let S = r(() => j(l.item)), E = r(() => M(l.item, l.mediaIndex)), D = r(() => N(l.item, E.value)), P = r(() => l.mediaSource === "original" ? D.value.src : D.value.preview.src), F = r(() => l.mediaSource === "original" ? D.value.width : D.value.preview.width), I = r(() => l.mediaSource === "original" ? D.value.height : D.value.preview.height), L = C(null), R = C(0), z = C(0), B = C(!0), V = C(!1), H = C(1), U = 1, W = r(() => l.interactive && !!(l.cardHeader || l.cardFooter));
-		function te(e) {
+		let C = r(() => M(l.item)), D = r(() => N(l.item, l.mediaIndex)), O = r(() => P(l.item, D.value)), F = r(() => l.mediaSource === "original" ? O.value.src : O.value.preview.src), I = r(() => l.mediaSource === "original" ? O.value.width : O.value.preview.width), L = r(() => l.mediaSource === "original" ? O.value.height : O.value.preview.height), R = w(null), z = w(0), B = w(0), V = w(!0), H = w(!1), U = w(1), W = 1, G = r(() => l.interactive && !!(l.cardHeader || l.cardFooter));
+		function ee(e) {
 			return e.detail === 0 ? "keyboard" : "pointer";
 		}
-		function G(e, t) {
-			let n = S.value.length, r = (e + n) % n;
-			r !== E.value && (v.value = e < E.value ? "previous" : "next", b("mediaChange", r), t && t.detail > 0 && t.currentTarget?.blur());
+		function K(e, t) {
+			let n = C.value.length, r = (e + n) % n;
+			r !== D.value && (y.value = e < D.value ? "previous" : "next", x("mediaChange", r), t && t.detail > 0 && t.currentTarget?.blur());
 		}
-		function ne(e, t, n) {
+		function te(e, t, n) {
 			return t === 1 ? e * 16 : t === 2 ? e * n : e;
 		}
-		function re() {
+		function ne() {
 			f = 0, p = !1, d !== null && clearTimeout(d), d = null;
 		}
-		function ie() {
-			d !== null && clearTimeout(d), d = setTimeout(re, Ze);
+		function re() {
+			d !== null && clearTimeout(d), d = setTimeout(ne, Ze);
 		}
-		function K(e) {
-			if (S.value.length <= 1) return;
-			let t = e.currentTarget?.clientWidth || 1, n = ne(e.deltaX, e.deltaMode, t);
-			if (n === 0 || (e.preventDefault(), ie(), p) || (f += n, Math.abs(f) < Qe)) return;
+		function q(e) {
+			if (C.value.length <= 1) return;
+			let t = e.currentTarget?.clientWidth || 1, n = te(e.deltaX, e.deltaMode, t);
+			if (n === 0 || (e.preventDefault(), re(), p) || (f += n, Math.abs(f) < Qe)) return;
 			let r = Math.sign(f);
-			f = 0, p = !0, G(E.value + r);
+			f = 0, p = !0, K(D.value + r);
 		}
-		function q(e) {
+		function J(e) {
 			let t = e.touches[0];
 			l.layout !== "reel" || !t || (m = t.clientX, g = t.clientY);
 		}
-		function ae(e) {
+		function ie(e) {
 			let t = e.changedTouches[0];
 			if (m === null || g === null || !t) return;
 			let n = m - t.clientX, r = g - t.clientY;
-			m = null, g = null, !(Math.abs(n) <= Math.abs(r)) && (Math.abs(n) < Xe || G(E.value + Math.sign(n)));
+			m = null, g = null, !(Math.abs(n) <= Math.abs(r)) && (Math.abs(n) < Xe || K(D.value + Math.sign(n)));
 		}
-		let J = r(() => Oe(P.value)), Y = r(() => l.layout === "reel" && l.stationaryReelControls === !0), oe = r(() => J.value && l.previewState === "ready" && (!Y.value || !!(l.active && l.reelControlsTarget))), se = r(() => `${l.item.postId}:${E.value}:${P.value}`);
-		function X(e) {
+		let Y = r(() => Oe(F.value)), X = r(() => l.layout === "reel" && l.stationaryReelControls === !0), ae = r(() => Y.value && l.previewState === "ready" && (!X.value || !!(l.active && l.reelControlsTarget))), oe = r(() => `${l.item.postId}:${D.value}:${F.value}`);
+		function se(e) {
 			l.layout === "reel" && (e.stopPropagation(), ce());
 		}
 		async function ce() {
-			if (L.value) {
-				if (V.value) {
-					L.value.pause();
+			if (R.value) {
+				if (H.value) {
+					R.value.pause();
 					return;
 				}
 				try {
-					await L.value.play();
+					await R.value.play();
 				} catch {
-					V.value = !1;
+					H.value = !1;
 				}
 			}
 		}
@@ -751,34 +751,34 @@ var ke = /* @__PURE__ */ d({
 			return Number.isFinite(e) ? Math.max(0, e) : 0;
 		}
 		function Z(e) {
-			let t = e?.currentTarget ?? L.value;
-			t && (R.value = le(t.currentTime), z.value = le(t.duration), B.value = t.muted, H.value = t.volume, t.volume > 0 && (U = t.volume));
+			let t = e?.currentTarget ?? R.value;
+			t && (z.value = le(t.currentTime), B.value = le(t.duration), V.value = t.muted, U.value = t.volume, t.volume > 0 && (W = t.volume));
 		}
 		function ue(e) {
-			Z(e), b("ready", E.value);
+			Z(e), x("ready", D.value);
 		}
 		function de() {
-			V.value = !1, b("ended", E.value);
+			H.value = !1, x("ended", D.value);
 		}
 		function fe(e) {
-			let t = L.value;
-			!t || !Number.isFinite(e) || (t.currentTime = Math.min(le(t.duration), Math.max(0, e)), R.value = t.currentTime);
+			let t = R.value;
+			!t || !Number.isFinite(e) || (t.currentTime = Math.min(le(t.duration), Math.max(0, e)), z.value = t.currentTime);
 		}
 		function pe(e) {
-			let t = L.value;
+			let t = R.value;
 			if (!t || !Number.isFinite(e)) return;
 			let n = Math.min(1, Math.max(0, e));
-			t.volume = n, t.muted = n === 0, n > 0 && (U = n), Z();
+			t.volume = n, t.muted = n === 0, n > 0 && (W = n), Z();
 		}
 		function me() {
-			let e = L.value;
-			e && (e.muted && e.volume === 0 && (e.volume = U), e.muted = !e.muted, Z());
+			let e = R.value;
+			e && (e.muted && e.volume === 0 && (e.volume = W), e.muted = !e.muted, Z());
 		}
-		return ee(() => {
-			re();
-		}), (r, i) => (y(), s("article", {
+		return v(() => {
+			ne();
+		}), (r, i) => (b(), s("article", {
 			"data-post-id": e.item.postId,
-			"data-media-index": E.value,
+			"data-media-index": D.value,
 			class: h(["media-card", {
 				"media-card--entering": e.entering,
 				"media-card--leaving": e.leaving,
@@ -789,18 +789,18 @@ var ke = /* @__PURE__ */ d({
 			"aria-hidden": e.leaving || void 0,
 			"aria-busy": e.previewState === "loading",
 			inert: e.leaving || void 0,
-			role: e.interactive && !e.leaving && !W.value ? "button" : void 0,
-			tabindex: e.interactive && !e.leaving && !W.value ? 0 : void 0,
-			onClick: i[11] ||= (t) => x(e.interactive && !W.value, te(t)),
-			onKeydown: [i[12] ||= k((t) => x(e.interactive && !W.value, "keyboard"), ["enter"]), i[13] ||= k(A((t) => x(e.interactive && !W.value, "keyboard"), ["prevent"]), ["space"])]
+			role: e.interactive && !e.leaving && !G.value ? "button" : void 0,
+			tabindex: e.interactive && !e.leaving && !G.value ? 0 : void 0,
+			onClick: i[11] ||= (t) => S(e.interactive && !G.value, ee(t)),
+			onKeydown: [i[12] ||= A((t) => S(e.interactive && !G.value, "keyboard"), ["enter"]), i[13] ||= A(j((t) => S(e.interactive && !G.value, "keyboard"), ["prevent"]), ["space"])]
 		}, [c("div", ze, [
-			e.cardHeader ? (y(), a(ke, {
+			e.cardHeader ? (b(), a(ke, {
 				key: 0,
 				index: e.index,
 				item: e.item,
 				layout: e.layout,
 				"loaded-count": e.loadedCount,
-				"media-index": E.value,
+				"media-index": D.value,
 				"media-source": e.mediaSource,
 				placement: "header",
 				region: e.cardHeader,
@@ -818,79 +818,79 @@ var ke = /* @__PURE__ */ d({
 				"total"
 			])) : o("", !0),
 			c("div", {
-				class: h(["media-card-media", { "media-card-media--carousel": e.layout === "reel" && S.value.length > 1 }]),
-				"data-media-direction": v.value,
-				onWheel: K,
-				onTouchstartPassive: q,
-				onTouchendPassive: ae
+				class: h(["media-card-media", { "media-card-media--carousel": e.layout === "reel" && C.value.length > 1 }]),
+				"data-media-direction": y.value,
+				onWheel: q,
+				onTouchstartPassive: J,
+				onTouchendPassive: ie
 			}, [
-				u(n, { name: `media-slide-${v.value}` }, {
-					default: O(() => [(y(), s("div", {
-						key: `${e.item.postId}:${D.value.src}:${e.mediaSource ?? "preview"}`,
+				u(n, { name: `media-slide-${y.value}` }, {
+					default: k(() => [(b(), s("div", {
+						key: `${e.item.postId}:${O.value.src}:${e.mediaSource ?? "preview"}`,
 						class: "media-card-frame",
-						"data-media-index": E.value
-					}, [e.previewState === "loading" ? (y(), s("div", He, [...i[14] ||= [c("span", { class: "media-loading-shimmer" }, null, -1)]])) : e.previewState === "error" ? (y(), s("div", {
+						"data-media-index": D.value
+					}, [e.previewState === "loading" ? (b(), s("div", He, [...i[14] ||= [c("span", { class: "media-loading-shimmer" }, null, -1)]])) : e.previewState === "error" ? (b(), s("div", {
 						key: 1,
 						"data-test": "media-error",
 						class: "media-error",
 						role: "img",
-						"aria-label": `${T(Te)(P.value)} ${T(Ee)(P.value)}`
-					}, [c("strong", We, w(T(Te)(P.value)), 1), c("span", null, w(T(Ee)(P.value)), 1)], 8, Ue)) : o("", !0), J.value ? (y(), s("video", {
+						"aria-label": `${E(Te)(F.value)} ${E(Ee)(F.value)}`
+					}, [c("strong", We, T(E(Te)(F.value)), 1), c("span", null, T(E(Ee)(F.value)), 1)], 8, Ue)) : o("", !0), Y.value ? (b(), s("video", {
 						key: 2,
 						ref_key: "videoElement",
-						ref: L,
+						ref: R,
 						class: h(["media-preview", {
 							"media-preview--ready": e.previewState === "ready",
 							"media-preview--reel-video": e.layout === "reel"
 						}]),
-						src: P.value,
-						width: F.value ?? void 0,
-						height: I.value ?? void 0,
+						src: F.value,
+						width: I.value ?? void 0,
+						height: L.value ?? void 0,
 						autoplay: "",
 						loop: !e.advanceOnMediaEnd,
-						muted: B.value,
+						muted: V.value,
 						playsinline: "",
 						preload: e.fetchPriority === "high" ? "auto" : "metadata",
 						onLoadedmetadata: ue,
 						onDurationchange: Z,
 						onTimeupdate: Z,
 						onVolumechange: Z,
-						onPlaying: i[0] ||= (e) => V.value = !0,
-						onPause: i[1] ||= (e) => V.value = !1,
+						onPlaying: i[0] ||= (e) => H.value = !0,
+						onPause: i[1] ||= (e) => H.value = !1,
 						onEnded: de,
-						onClick: X,
-						onError: i[2] ||= (e) => r.$emit("error", E.value)
-					}, null, 42, Ge)) : (y(), s("img", {
+						onClick: se,
+						onError: i[2] ||= (e) => r.$emit("error", D.value)
+					}, null, 42, Ge)) : (b(), s("img", {
 						key: 3,
 						class: h(["media-preview", { "media-preview--ready": e.previewState === "ready" }]),
-						src: P.value,
-						width: F.value ?? void 0,
-						height: I.value ?? void 0,
+						src: F.value,
+						width: I.value ?? void 0,
+						height: L.value ?? void 0,
 						fetchpriority: e.fetchPriority,
 						alt: "",
 						decoding: "async",
 						loading: "eager",
-						onLoad: i[3] ||= (e) => r.$emit("ready", E.value),
-						onError: i[4] ||= (e) => r.$emit("error", E.value)
+						onLoad: i[3] ||= (e) => r.$emit("ready", D.value),
+						onError: i[4] ||= (e) => r.$emit("error", D.value)
 					}, null, 42, Ke))], 8, Ve))]),
 					_: 1
 				}, 8, ["name"]),
-				(y(), a(t, {
-					disabled: !Y.value || !e.reelControlsTarget,
+				(b(), a(t, {
+					disabled: !X.value || !e.reelControlsTarget,
 					to: e.reelControlsTarget ?? "body"
 				}, [u(n, {
 					name: "vibe-reel-media-controls",
-					css: Y.value
+					css: X.value
 				}, {
-					default: O(() => [oe.value ? (y(), a(Le, {
-						key: se.value,
-						"current-time": R.value,
-						"data-control-post-id": Y.value ? e.item.postId : void 0,
-						duration: z.value,
+					default: k(() => [ae.value ? (b(), a(Le, {
+						key: oe.value,
+						"current-time": z.value,
+						"data-control-post-id": X.value ? e.item.postId : void 0,
+						duration: B.value,
 						layout: e.layout,
-						muted: B.value,
-						playing: V.value,
-						volume: H.value,
+						muted: V.value,
+						playing: H.value,
+						volume: U.value,
 						onSeek: fe,
 						onToggleMute: me,
 						onTogglePlayback: ce,
@@ -906,7 +906,7 @@ var ke = /* @__PURE__ */ d({
 					])) : o("", !0)]),
 					_: 1
 				}, 8, ["css"])], 8, ["disabled", "to"])),
-				S.value.length > 1 ? (y(), s("div", {
+				C.value.length > 1 ? (b(), s("div", {
 					key: 0,
 					class: h(["media-carousel-controls", { "media-carousel-controls--persistent": e.layout === "reel" }]),
 					"aria-label": "Media navigation"
@@ -914,31 +914,31 @@ var ke = /* @__PURE__ */ d({
 					type: "button",
 					class: "media-carousel-control media-carousel-control--previous",
 					"aria-label": `Previous media for post ${e.item.postId}`,
-					onClick: i[5] ||= A((e) => G(E.value - 1, e), ["stop"]),
-					onKeydown: i[6] ||= A(() => {}, ["stop"])
-				}, [u(T(ve), { size: 20 })], 40, qe), c("button", {
+					onClick: i[5] ||= j((e) => K(D.value - 1, e), ["stop"]),
+					onKeydown: i[6] ||= j(() => {}, ["stop"])
+				}, [u(E(ve), { size: 20 })], 40, qe), c("button", {
 					type: "button",
 					class: "media-carousel-control media-carousel-control--next",
 					"aria-label": `Next media for post ${e.item.postId}`,
-					onClick: i[7] ||= A((e) => G(E.value + 1, e), ["stop"]),
-					onKeydown: i[8] ||= A(() => {}, ["stop"])
-				}, [u(T(ye), { size: 20 })], 40, Je)], 2)) : o("", !0),
-				W.value ? (y(), s("button", {
+					onClick: i[7] ||= j((e) => K(D.value + 1, e), ["stop"]),
+					onKeydown: i[8] ||= j(() => {}, ["stop"])
+				}, [u(E(ye), { size: 20 })], 40, Je)], 2)) : o("", !0),
+				G.value ? (b(), s("button", {
 					key: 1,
 					class: "media-card-activator",
 					type: "button",
 					"aria-label": `Open post ${e.item.postId}`,
-					onClick: i[9] ||= A((e) => r.$emit("activate", te(e)), ["stop"]),
-					onKeydown: i[10] ||= A(() => {}, ["stop"])
+					onClick: i[9] ||= j((e) => r.$emit("activate", ee(e)), ["stop"]),
+					onKeydown: i[10] ||= j(() => {}, ["stop"])
 				}, null, 40, Ye)) : o("", !0)
 			], 42, Be),
-			e.cardFooter ? (y(), a(ke, {
+			e.cardFooter ? (b(), a(ke, {
 				key: 1,
 				index: e.index,
 				item: e.item,
 				layout: e.layout,
 				"loaded-count": e.loadedCount,
-				"media-index": E.value,
+				"media-index": D.value,
 				"media-source": e.mediaSource,
 				placement: "footer",
 				region: e.cardFooter,
@@ -991,14 +991,14 @@ var ke = /* @__PURE__ */ d({
 		"retryEnd"
 	],
 	setup(t, { expose: n, emit: i }) {
-		let o = t, l = i, d = C(null), f = `vibe-masonry-${E()}`, p = C(null), m = C(0), g = C(rt), v = C(0), b = C(0), S = C(0), w = null, O = null, k = null, A = r(() => q(o.items, m.value, {
+		let o = t, l = i, d = w(null), f = `vibe-masonry-${D()}`, p = w(null), m = w(0), g = w(rt), y = w(0), x = w(0), C = w(0), T = null, k = null, A = null, j = r(() => J(o.items, m.value, {
 			additionalHeight: (o.cardHeader?.height ?? 0) + (o.cardFooter?.height ?? 0),
 			gap: g.value,
 			minColumnWidth: nt
-		})), j = r(() => {
-			let e = A.value;
+		})), M = r(() => {
+			let e = j.value;
 			if (o.leavingPostIds.size === 0) return e;
-			let t = o.items.filter((e) => !o.leavingPostIds.has(e.postId)), n = q(t, m.value, {
+			let t = o.items.filter((e) => !o.leavingPostIds.has(e.postId)), n = J(t, m.value, {
 				additionalHeight: (o.cardHeader?.height ?? 0) + (o.cardFooter?.height ?? 0),
 				gap: g.value,
 				minColumnWidth: nt
@@ -1007,20 +1007,20 @@ var ke = /* @__PURE__ */ d({
 				...n,
 				items: o.items.map((t, n) => o.leavingPostIds.has(t.postId) ? e.items[n] : r.get(t.postId) ?? e.items[n])
 			};
-		}), M = r(() => ({ height: `${o.leavingPostIds.size === 0 ? j.value.height : A.value.height}px` })), N = r(() => {
-			let e = Math.max(at, b.value * ot), t = {
-				scrollTop: v.value - S.value,
-				viewportHeight: b.value
-			}, n = K(j.value.items, {
+		}), N = r(() => ({ height: `${o.leavingPostIds.size === 0 ? M.value.height : j.value.height}px` })), P = r(() => {
+			let e = Math.max(at, x.value * ot), t = {
+				scrollTop: y.value - C.value,
+				viewportHeight: x.value
+			}, n = q(M.value.items, {
 				...t,
 				overscan: e
-			}), r = o.leavingPostIds.size === 0 ? [] : K(A.value.items, {
+			}), r = o.leavingPostIds.size === 0 ? [] : q(j.value.items, {
 				...t,
 				overscan: e
-			}), i = [...new Set([...n, ...r])].sort((e, t) => e - t), a = K(j.value.items, {
+			}), i = [...new Set([...n, ...r])].sort((e, t) => e - t), a = q(M.value.items, {
 				...t,
 				overscan: 0
-			}), s = o.leavingPostIds.size === 0 ? [] : K(A.value.items, {
+			}), s = o.leavingPostIds.size === 0 ? [] : q(j.value.items, {
 				...t,
 				overscan: 0
 			}), c = new Set([...a, ...s]);
@@ -1033,11 +1033,11 @@ var ke = /* @__PURE__ */ d({
 				}] : [];
 			});
 		});
-		function F(e) {
-			let t = j.value.items[e], n = o.items[e]?.postId;
+		function I(e) {
+			let t = M.value.items[e], n = o.items[e]?.postId;
 			if (!t) return {};
-			let r = n !== void 0 && o.enteringPostIds.has(n), i = n !== void 0 && o.leavingPostIds.has(n), a = r || i ? ie({
-				containerHeight: A.value.height,
+			let r = n !== void 0 && o.enteringPostIds.has(n), i = n !== void 0 && o.leavingPostIds.has(n), a = r || i ? re({
+				containerHeight: j.value.height,
 				gap: g.value
 			}) : 0, s = n === void 0 ? 0 : i ? o.removalDelays.get(n) ?? 0 : r ? o.entryDelays.get(n) ?? 0 : 0;
 			return {
@@ -1047,43 +1047,43 @@ var ke = /* @__PURE__ */ d({
 				transform: `translate3d(${t.x}px, ${t.y + a}px, 0)`
 			};
 		}
-		function I() {
+		function L() {
 			let e = d.value;
 			if (!e) return;
-			v.value = e.scrollTop, b.value = e.clientHeight;
+			y.value = e.scrollTop, x.value = e.clientHeight;
 			let t = p.value;
-			t && (S.value = t.getBoundingClientRect().top - e.getBoundingClientRect().top + e.scrollTop);
+			t && (C.value = t.getBoundingClientRect().top - e.getBoundingClientRect().top + e.scrollTop);
 		}
-		function L(e) {
+		function R(e) {
 			let t = e.ownerDocument.documentElement.clientWidth;
-			m.value = e.clientWidth, g.value = Math.min(it, Math.max(rt, t * .0075)), I();
+			m.value = e.clientWidth, g.value = Math.min(it, Math.max(rt, t * .0075)), L();
 		}
-		function R(e) {
+		function z(e) {
 			let t = e.currentTarget;
-			t && (v.value = t.scrollTop, !o.loadMoreLocked && o.infiniteScroll && G(t) && l("loadMore"));
+			t && (y.value = t.scrollTop, !o.loadMoreLocked && o.infiniteScroll && K(t) && l("loadMore"));
 		}
-		function z() {
+		function B() {
 			let e = d.value;
-			!o.loadMoreLocked && e && G(e) && l("loadMore");
+			!o.loadMoreLocked && e && K(e) && l("loadMore");
 		}
-		function B() {
+		function V() {
 			return d.value;
 		}
-		return D(p, (e) => {
-			w?.disconnect(), w = null, k !== null && cancelAnimationFrame(k), e && (L(e), !(typeof ResizeObserver > "u") && (w = new ResizeObserver(([t]) => {
+		return O(p, (e) => {
+			T?.disconnect(), T = null, A !== null && cancelAnimationFrame(A), e && (R(e), !(typeof ResizeObserver > "u") && (T = new ResizeObserver(([t]) => {
 				let n = t?.contentRect.width ?? e.clientWidth;
-				Math.abs(n - m.value) < .5 || (k = requestAnimationFrame(() => {
-					k = null, L(e);
+				Math.abs(n - m.value) < .5 || (A = requestAnimationFrame(() => {
+					A = null, R(e);
 				}));
-			}), w.observe(e)));
-		}), D(d, (e) => {
-			O?.disconnect(), O = null, e && (I(), !(typeof ResizeObserver > "u") && (O = new ResizeObserver(I), O.observe(e)));
-		}), ee(() => {
-			w?.disconnect(), O?.disconnect(), k !== null && cancelAnimationFrame(k);
+			}), T.observe(e)));
+		}), O(d, (e) => {
+			k?.disconnect(), k = null, e && (L(), !(typeof ResizeObserver > "u") && (k = new ResizeObserver(L), k.observe(e)));
+		}), v(() => {
+			T?.disconnect(), k?.disconnect(), A !== null && cancelAnimationFrame(A);
 		}), n({
-			getScrollElement: B,
-			loadIfNearBottom: z
-		}), (n, r) => (y(), s("div", et, [c("main", {
+			getScrollElement: V,
+			loadIfNearBottom: B
+		}), (n, r) => (b(), s("div", et, [c("main", {
 			id: f,
 			ref_key: "galleryElement",
 			ref: d,
@@ -1091,14 +1091,14 @@ var ke = /* @__PURE__ */ d({
 			"data-layout-mode": "masonry",
 			"aria-hidden": t.suspended || void 0,
 			inert: t.suspended || void 0,
-			onScrollPassive: R
+			onScrollPassive: z
 		}, [c("section", {
 			ref_key: "masonryElement",
 			ref: p,
 			class: h(["masonry", { "masonry--ready": m.value > 0 }]),
-			style: _(M.value),
+			style: _(N.value),
 			"aria-label": "Media gallery"
-		}, [(y(!0), s(e, null, x(N.value, ({ fetchPriority: e, item: n, index: r }) => (y(), a($e, {
+		}, [(b(!0), s(e, null, S(P.value, ({ fetchPriority: e, item: n, index: r }) => (b(), a($e, {
 			key: n.postId,
 			class: "masonry-item",
 			entering: t.enteringPostIds.has(n.postId),
@@ -1109,12 +1109,12 @@ var ke = /* @__PURE__ */ d({
 			"media-card": t.mediaCard,
 			index: r,
 			item: n,
-			"item-style": F(r),
+			"item-style": I(r),
 			interactive: "",
 			layout: "masonry",
 			"loaded-count": t.items.length,
 			"media-index": t.mediaIndices.get(n.postId) ?? 0,
-			"preview-state": t.previewStates.get(T(P)(n.postId, t.mediaIndices.get(n.postId) ?? 0)) ?? "loading",
+			"preview-state": t.previewStates.get(E(F)(n.postId, t.mediaIndices.get(n.postId) ?? 0)) ?? "loading",
 			total: t.total,
 			onActivate: (e) => l("activate", n.postId, e),
 			onMediaChange: (e) => l("mediaChange", n.postId, e),
@@ -1138,7 +1138,7 @@ var ke = /* @__PURE__ */ d({
 			"onMediaChange",
 			"onReady",
 			"onError"
-		]))), 128))], 6), u(H, {
+		]))), 128))], 6), u(U, {
 			actions: t.feedFooterActions,
 			"can-retry-end": t.canRetryEnd,
 			"feed-footer": t.feedFooter,
@@ -1159,7 +1159,7 @@ var ke = /* @__PURE__ */ d({
 			"load-more-locked",
 			"state"
 		])], 42, tt), u(le, {
-			"content-size": j.value.height,
+			"content-size": M.value.height,
 			"controls-id": f,
 			"scroll-element": d.value,
 			suspended: t.suspended
@@ -1199,7 +1199,7 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 	emits: ["complete"],
 	setup(e, { emit: t }) {
 		let n = e, i = t, a = r(() => ({ "--vibe-reel-auto-advance-duration": `${n.durationMs}ms` }));
-		return (t, n) => (y(), s("div", {
+		return (t, n) => (b(), s("div", {
 			class: "reel-auto-advance",
 			"data-test": "reel-auto-advance",
 			role: "timer",
@@ -1247,83 +1247,83 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 		"retryForward"
 	],
 	setup(t, { expose: n, emit: i }) {
-		let l = t, u = i, d = C(null), f = C(null), p = l.initialPostId === null || l.initialPostId === void 0 ? -1 : l.items.findIndex((e) => e.postId === l.initialPostId), g = C(Math.max(0, p)), b = C(!1), S = C(!1), E = 0, O = null, k = null, A = null, M = r(() => ({ gridTemplateRows: `repeat(${l.items.length}, 100cqh)` })), F = r(() => {
+		let l = t, u = i, d = w(null), f = w(null), p = l.initialPostId === null || l.initialPostId === void 0 ? -1 : l.items.findIndex((e) => e.postId === l.initialPostId), g = w(Math.max(0, p)), x = w(!1), C = w(!1), D = 0, k = null, A = null, j = null, N = r(() => ({ gridTemplateRows: `repeat(${l.items.length}, 100cqh)` })), I = r(() => {
 			let e = Math.max(0, g.value - ht), t = Math.min(l.items.length - 1, g.value + ht);
 			return l.items.slice(e, t + 1).map((t, n) => ({
 				fetchPriority: e + n === g.value ? "high" : "low",
 				index: e + n,
 				item: t
 			}));
-		}), I = r(() => l.items[g.value]?.postId), L = r(() => l.items[g.value]), R = r(() => {
-			let e = I.value;
+		}), L = r(() => l.items[g.value]?.postId), R = r(() => l.items[g.value]), z = r(() => {
+			let e = L.value;
 			return e === void 0 ? 0 : l.mediaIndices.get(e) ?? 0;
-		}), z = r(() => {
-			let e = I.value;
-			return e === void 0 ? "loading" : l.previewStates.get(P(e, R.value)) ?? "loading";
 		}), B = r(() => {
 			let e = L.value;
+			return e === void 0 ? "loading" : l.previewStates.get(F(e, z.value)) ?? "loading";
+		}), V = r(() => {
+			let e = R.value;
 			if (!e) return "";
-			let t = N(e, R.value);
+			let t = P(e, z.value);
 			return l.mediaSource === "original" ? t.src : t.preview.src;
-		}), V = r(() => z.value === "ready" && Oe(B.value)), U = r(() => [
-			I.value,
-			R.value,
+		}), H = r(() => B.value === "ready" && Oe(V.value)), W = r(() => [
+			L.value,
+			z.value,
 			l.items.length,
 			l.loadMoreLocked,
 			l.reelAutoAdvance.enabled,
 			l.reelAutoAdvance.includePostItems,
 			l.reelAutoAdvance.intervalMs
-		].join(":")), W = r(() => {
-			let e = L.value, t = !!(e && l.reelAutoAdvance.includePostItems && R.value < j(e).length - 1), n = l.reelAutoAdvance.intervalMs / 1e3;
+		].join(":")), G = r(() => {
+			let e = R.value, t = !!(e && l.reelAutoAdvance.includePostItems && z.value < M(e).length - 1), n = l.reelAutoAdvance.intervalMs / 1e3;
 			return `Auto advance to the next ${t ? "post item" : "post"} in ${n}s`;
-		}), te = r(() => l.reelAutoAdvance.enabled && l.reelForward.status === "idle" && L.value !== void 0 && z.value !== "loading" && !V.value), ne = r(() => l.reelForward.status === "loading" ? "Loading the next media…" : l.reelForward.status === "error" ? "Unable to load the next media." : "You reached the end of this feed.");
-		function re(e) {
+		}), ee = r(() => l.reelAutoAdvance.enabled && l.reelForward.status === "idle" && R.value !== void 0 && B.value !== "loading" && !H.value), te = r(() => l.reelForward.status === "loading" ? "Loading the next media…" : l.reelForward.status === "error" ? "Unable to load the next media." : "You reached the end of this feed.");
+		function ne(e) {
 			return { gridRow: `${e + 1}` };
 		}
-		function ie(e) {
-			let t = E || e.clientHeight;
+		function re(e) {
+			let t = D || e.clientHeight;
 			return t <= 0 || l.items.length === 0 ? 0 : Math.min(l.items.length - 1, Math.max(0, Math.round(e.scrollTop / t)));
 		}
-		function K(e) {
+		function q(e) {
 			let t = e.currentTarget;
 			if (!t) return;
-			let n = E || t.clientHeight, r = Math.max(0, l.items.length - 1) * n;
-			b.value = l.items.length > 0 && t.scrollTop > r + 1, S.value || (g.value = ie(t)), !l.loadMoreLocked && l.infiniteScroll && G(t) && u("loadMore");
+			let n = D || t.clientHeight, r = Math.max(0, l.items.length - 1) * n;
+			x.value = l.items.length > 0 && t.scrollTop > r + 1, C.value || (g.value = re(t)), !l.loadMoreLocked && l.infiniteScroll && K(t) && u("loadMore");
 		}
-		function q() {
+		function J() {
 			let e = d.value;
-			e && (b.value = !1, Y(!0), E = e.clientHeight, e.scrollTop = g.value * E, k !== null && cancelAnimationFrame(k), k = requestAnimationFrame(() => {
-				e.scrollTop = g.value * e.clientHeight, E = e.clientHeight, k = null;
-			}), ae());
+			e && (x.value = !1, X(!0), D = e.clientHeight, e.scrollTop = g.value * D, A !== null && cancelAnimationFrame(A), A = requestAnimationFrame(() => {
+				e.scrollTop = g.value * e.clientHeight, D = e.clientHeight, A = null;
+			}), ie());
 		}
-		function ae() {
-			A !== null && clearTimeout(A), A = setTimeout(() => {
-				A = null;
+		function ie() {
+			j !== null && clearTimeout(j), j = setTimeout(() => {
+				j = null;
 				let e = d.value;
-				e && (E = e.clientHeight, e.scrollTop = g.value * E), Y(!1);
+				e && (D = e.clientHeight, e.scrollTop = g.value * D), X(!1);
 			}, 120);
 		}
-		function J() {
-			Y(!0);
+		function Y() {
+			X(!0);
 			let e = d.value;
-			e && (E = e.clientHeight, e.scrollTop = g.value * E), ae();
+			e && (D = e.clientHeight, e.scrollTop = g.value * D), ie();
 		}
-		function Y(e) {
-			S.value = e, d.value?.toggleAttribute("data-resizing", e);
+		function X(e) {
+			C.value = e, d.value?.toggleAttribute("data-resizing", e);
 		}
-		function oe() {
+		function ae() {
 			let e = d.value;
-			!l.loadMoreLocked && e && G(e) && u("loadMore");
+			!l.loadMoreLocked && e && K(e) && u("loadMore");
 		}
-		function se(e) {
-			let t = L.value;
+		function oe(e) {
+			let t = R.value;
 			if (!t) return !1;
-			let n = j(t).length;
+			let n = M(t).length;
 			if (n <= 1) return !1;
-			let r = (R.value + e + n) % n;
+			let r = (z.value + e + n) % n;
 			return u("mediaChange", t.postId, r), !0;
 		}
-		function X(e) {
+		function se(e) {
 			let t = g.value + e;
 			return !d.value || t < 0 || t >= l.items.length ? !1 : (Z(t), !0);
 		}
@@ -1333,7 +1333,7 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 		function le(e) {
 			let t = d.value;
 			if (!t) return Promise.resolve();
-			let n = e * (E || t.clientHeight);
+			let n = e * (D || t.clientHeight);
 			return g.value = e, lt(t, n, ce());
 		}
 		function Z(e) {
@@ -1344,14 +1344,14 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			return t < 0 || t === g.value ? !1 : (await le(t), !0);
 		}
 		async function de(e) {
-			return se(e) ? (ce() || await new Promise((e) => setTimeout(e, gt)), !0) : !1;
+			return oe(e) ? (ce() || await new Promise((e) => setTimeout(e, gt)), !0) : !1;
 		}
 		function fe() {
 			if (!l.reelAutoAdvance.enabled) return;
-			let e = L.value;
+			let e = R.value;
 			if (!e) return;
-			if (l.reelAutoAdvance.includePostItems && R.value < j(e).length - 1) {
-				u("mediaChange", e.postId, R.value + 1);
+			if (l.reelAutoAdvance.includePostItems && z.value < M(e).length - 1) {
+				u("mediaChange", e.postId, z.value + 1);
 				return;
 			}
 			let t = g.value + 1, n = l.items[t];
@@ -1362,41 +1362,41 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			l.reelAutoAdvance.includePostItems && (l.mediaIndices.get(n.postId) ?? 0) !== 0 && u("mediaChange", n.postId, 0), Z(t);
 		}
 		function pe(e, t) {
-			!l.reelAutoAdvance.enabled || e !== I.value || t !== R.value || !V.value || fe();
+			!l.reelAutoAdvance.enabled || e !== L.value || t !== z.value || !H.value || fe();
 		}
-		return D(d, (e) => {
-			O?.disconnect(), O = null, e && (E = e.clientHeight, !(typeof ResizeObserver > "u") && (O = new ResizeObserver(q), O.observe(e)));
-		}), D(() => l.items.length, async (e) => {
+		return O(d, (e) => {
+			k?.disconnect(), k = null, e && (D = e.clientHeight, !(typeof ResizeObserver > "u") && (k = new ResizeObserver(J), k.observe(e)));
+		}), O(() => l.items.length, async (e) => {
 			let t = l.initialPostId, n = t == null ? -1 : l.items.findIndex(({ postId: e }) => e === t);
-			g.value = n >= 0 ? n : Math.min(g.value, Math.max(0, e - 1)), await m(), q();
-		}), D(I, (e) => {
+			g.value = n >= 0 ? n : Math.min(g.value, Math.max(0, e - 1)), await m(), J();
+		}), O(L, (e) => {
 			e !== void 0 && u("activeChange", e);
-		}, { immediate: !0 }), v(() => {
-			window.addEventListener("resize", J), window.addEventListener("orientationchange", J), p >= 0 && m(q);
-		}), ee(() => {
-			window.removeEventListener("resize", J), window.removeEventListener("orientationchange", J), O?.disconnect(), k !== null && cancelAnimationFrame(k), A !== null && clearTimeout(A);
+		}, { immediate: !0 }), y(() => {
+			window.addEventListener("resize", Y), window.addEventListener("orientationchange", Y), p >= 0 && m(J);
+		}), v(() => {
+			window.removeEventListener("resize", Y), window.removeEventListener("orientationchange", Y), k?.disconnect(), A !== null && cancelAnimationFrame(A), j !== null && clearTimeout(j);
 		}), n({
 			activeIndex: g,
-			activePostId: I,
-			changeActiveMedia: se,
-			loadIfNearBottom: oe,
-			moveActivePost: X,
+			activePostId: L,
+			changeActiveMedia: oe,
+			loadIfNearBottom: ae,
+			moveActivePost: se,
 			transitionActiveMedia: de,
 			transitionActivePost: ue
-		}), (n, r) => (y(), s("main", {
+		}), (n, r) => (b(), s("main", {
 			class: h(["reel-shell", {
 				"reel-shell--has-footer": !!t.cardFooter,
 				"reel-shell--has-header": !!t.cardHeader
 			}]),
 			"data-layout-mode": "reel"
 		}, [
-			t.cardHeader && L.value && t.reelForward.status === "idle" ? (y(), a(ke, {
+			t.cardHeader && R.value && t.reelForward.status === "idle" ? (b(), a(ke, {
 				key: 0,
 				index: g.value,
-				item: L.value,
+				item: R.value,
 				layout: "reel",
 				"loaded-count": t.items.length,
-				"media-index": R.value,
+				"media-index": z.value,
 				"media-source": t.mediaSource,
 				placement: "header",
 				region: t.cardHeader,
@@ -1416,30 +1416,30 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 				ref_key: "galleryElement",
 				ref: d,
 				class: "gallery-shell reel-feed",
-				"data-active-post-id": I.value,
-				"data-active-media-index": R.value,
-				onScrollPassive: K
-			}, [t.reelForward.status === "idle" ? (y(), s("section", {
+				"data-active-post-id": L.value,
+				"data-active-media-index": z.value,
+				onScrollPassive: q
+			}, [t.reelForward.status === "idle" ? (b(), s("section", {
 				key: 1,
 				class: "reel-track",
-				style: _(M.value),
+				style: _(N.value),
 				"aria-label": "Media gallery"
-			}, [(y(!0), s(e, null, x(F.value, ({ fetchPriority: e, item: n, index: r }) => (y(), a($e, {
+			}, [(b(!0), s(e, null, S(I.value, ({ fetchPriority: e, item: n, index: r }) => (b(), a($e, {
 				key: n.postId,
-				active: r === g.value && !b.value,
+				active: r === g.value && !x.value,
 				"advance-on-media-end": l.reelAutoAdvance.enabled && r === g.value,
 				class: "reel-item",
 				entering: !1,
 				"fetch-priority": e,
 				index: r,
 				item: n,
-				"item-style": re(r),
+				"item-style": ne(r),
 				"media-card": t.mediaCard,
 				layout: "reel",
 				"loaded-count": t.items.length,
 				"media-index": t.mediaIndices.get(n.postId) ?? 0,
 				"media-source": t.mediaSource,
-				"preview-state": t.previewStates.get(T(P)(n.postId, t.mediaIndices.get(n.postId) ?? 0)) ?? "loading",
+				"preview-state": t.previewStates.get(E(F)(n.postId, t.mediaIndices.get(n.postId) ?? 0)) ?? "loading",
 				"reel-controls-target": f.value,
 				"stationary-reel-controls": "",
 				total: t.total,
@@ -1465,17 +1465,17 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 				"onEnded",
 				"onReady",
 				"onError"
-			]))), 128))], 4)) : (y(), s("div", {
+			]))), 128))], 4)) : (b(), s("div", {
 				key: 0,
 				class: "reel-forward-status",
 				role: t.reelForward.status === "error" ? "alert" : "status",
 				"data-status": t.reelForward.status
-			}, [c("p", null, w(ne.value), 1), t.reelForward.status === "error" || t.reelForward.status === "end" ? (y(), s("button", {
+			}, [c("p", null, T(te.value), 1), t.reelForward.status === "error" || t.reelForward.status === "end" ? (b(), s("button", {
 				key: 0,
 				class: "reel-forward-retry",
 				type: "button",
 				onClick: r[0] ||= (e) => u("retryForward")
-			}, " Retry ")) : o("", !0)], 8, mt)), t.reelForward.status === "idle" ? (y(), a(H, {
+			}, " Retry ")) : o("", !0)], 8, mt)), t.reelForward.status === "idle" ? (b(), a(U, {
 				key: 2,
 				actions: t.feedFooterActions,
 				"can-retry-end": t.canRetryEnd,
@@ -1502,13 +1502,13 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 				class: "reel-media-controls-host",
 				"data-test": "reel-media-controls-host"
 			}, null, 512)]),
-			t.cardFooter && L.value && t.reelForward.status === "idle" ? (y(), a(ke, {
+			t.cardFooter && R.value && t.reelForward.status === "idle" ? (b(), a(ke, {
 				key: 1,
 				index: g.value,
-				item: L.value,
+				item: R.value,
 				layout: "reel",
 				"loaded-count": t.items.length,
-				"media-index": R.value,
+				"media-index": z.value,
 				"media-source": t.mediaSource,
 				placement: "footer",
 				region: t.cardFooter,
@@ -1524,10 +1524,10 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 				"style",
 				"total"
 			])) : o("", !0),
-			te.value ? (y(), a(dt, {
-				key: U.value,
+			ee.value ? (b(), a(dt, {
+				key: W.value,
 				"duration-ms": t.reelAutoAdvance.intervalMs,
-				label: W.value,
+				label: G.value,
 				onComplete: fe
 			}, null, 8, ["duration-ms", "label"])) : o("", !0)
 		], 2));
@@ -1585,83 +1585,83 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 		"retryForward"
 	],
 	setup(e, { expose: t, emit: i }) {
-		let l = e, d = i, p = C(null), _ = C(null), v = null, b = r(() => {
+		let l = e, d = i, p = w(null), _ = w(null), y = null, x = r(() => {
 			let e = l.initialPostId === null || l.initialPostId === void 0 ? -1 : l.items.findIndex((e) => e.postId === l.initialPostId);
 			return Math.max(0, e);
-		}), x = r(() => l.items[b.value]), w = r(() => x.value ?? (l.reelForward.status === "idle" ? void 0 : l.forwardItem ?? void 0)), T = r(() => x.value ? b.value : l.forwardIndex ?? 0), E = r(() => {
-			let e = w.value?.postId;
+		}), S = r(() => l.items[x.value]), T = r(() => S.value ?? (l.reelForward.status === "idle" ? void 0 : l.forwardItem ?? void 0)), E = r(() => S.value ? x.value : l.forwardIndex ?? 0), D = r(() => {
+			let e = T.value?.postId;
 			return e === void 0 ? 0 : l.mediaIndices.get(e) ?? 0;
-		}), k = r(() => !!(l.infoSheet && l.infoSheetEnabled && w.value)), A = r(() => {
-			let e = w.value;
+		}), A = r(() => !!(l.infoSheet && l.infoSheetEnabled && T.value)), j = r(() => {
+			let e = T.value;
 			return e ? {
-				close: M,
-				index: T.value,
+				close: N,
+				index: E.value,
 				item: e,
 				layout: "reel",
 				loadedCount: l.items.length,
-				mediaCount: j(e).length,
-				mediaIndex: E.value,
-				mediaItem: N(e, E.value),
+				mediaCount: M(e).length,
+				mediaIndex: D.value,
+				mediaItem: P(e, D.value),
 				mediaSource: l.mediaSource ?? "preview",
 				origin: l.origin,
 				total: l.total
 			} : null;
 		});
-		function M() {
+		function N() {
 			d("closeInfoSheet");
 		}
-		function P(e) {
+		function F(e) {
 			return p.value?.changeActiveMedia(e) ?? !1;
 		}
-		function F() {
+		function I() {
 			p.value?.loadIfNearBottom();
 		}
-		function I(e) {
+		function L(e) {
 			return p.value?.moveActivePost(e) ?? !1;
 		}
-		function L(e) {
+		function R(e) {
 			return p.value?.transitionActiveMedia(e) ?? Promise.resolve(!1);
 		}
-		function R(e) {
+		function z(e) {
 			return p.value?.transitionActivePost(e) ?? Promise.resolve(!1);
 		}
-		function z(e, t) {
+		function B(e, t) {
 			d("error", e, t);
 		}
-		function B(e, t) {
+		function V(e, t) {
 			d("mediaChange", e, t);
 		}
-		function V(e, t) {
+		function H(e, t) {
 			d("ready", e, t);
 		}
-		return D(() => ({
+		return O(() => ({
 			overlay: l.infoSheetOverlay,
-			visible: k.value
+			visible: A.value
 		}), async (e, t) => {
 			if (e.visible && !t?.visible) {
-				v = document.activeElement instanceof HTMLElement ? document.activeElement : null, e.overlay && (await m(), _.value?.focus({ preventScroll: !0 }));
+				y = document.activeElement instanceof HTMLElement ? document.activeElement : null, e.overlay && (await m(), _.value?.focus({ preventScroll: !0 }));
 				return;
 			}
-			if (!e.visible && t?.visible && v?.isConnected) {
-				let e = v;
-				v = null, await m(), e.focus({ preventScroll: !0 });
+			if (!e.visible && t?.visible && y?.isConnected) {
+				let e = y;
+				y = null, await m(), e.focus({ preventScroll: !0 });
 			}
-		}), ee(() => {
-			v = null;
+		}), v(() => {
+			y = null;
 		}), t({
-			changeActiveMedia: P,
-			loadIfNearBottom: F,
-			moveActivePost: I,
-			transitionActiveMedia: L,
-			transitionActivePost: R
-		}), (t, r) => (y(), s("section", {
+			changeActiveMedia: F,
+			loadIfNearBottom: I,
+			moveActivePost: L,
+			transitionActiveMedia: R,
+			transitionActivePost: z
+		}), (t, r) => (b(), s("section", {
 			class: h(["reel-layout", `reel-layout--${e.infoSheetOverlay ? "overlay" : "layout"}`]),
-			"data-info-sheet-open": k.value || void 0,
+			"data-info-sheet-open": A.value || void 0,
 			"data-info-sheet-mode": e.infoSheetOverlay ? "overlay" : "layout"
 		}, [c("div", {
 			class: "reel-layout-main",
-			"aria-hidden": e.infoSheetOverlay && k.value || void 0,
-			inert: e.infoSheetOverlay && k.value || void 0
+			"aria-hidden": e.infoSheetOverlay && A.value || void 0,
+			inert: e.infoSheetOverlay && A.value || void 0
 		}, [u(_t, {
 			ref_key: "reelFeed",
 			ref: p,
@@ -1686,10 +1686,10 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			state: e.state,
 			total: e.total,
 			onActiveChange: r[0] ||= (e) => d("activeChange", e),
-			onError: z,
+			onError: B,
 			onLoadMore: r[1] ||= (e) => d("loadMore"),
-			onMediaChange: B,
-			onReady: V,
+			onMediaChange: V,
+			onReady: H,
 			onRetryEnd: r[2] ||= (e) => d("retryEnd"),
 			onRetryForward: r[3] ||= (e) => d("retryForward")
 		}, null, 8, [
@@ -1714,7 +1714,7 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			"state",
 			"total"
 		])], 8, yt), u(n, { name: "vibe-info-sheet" }, {
-			default: O(() => [k.value && e.infoSheet && A.value ? (y(), s("div", bt, [c("aside", {
+			default: k(() => [A.value && e.infoSheet && j.value ? (b(), s("div", bt, [c("aside", {
 				ref_key: "sheetElement",
 				ref: _,
 				class: "reel-info-sheet",
@@ -1722,8 +1722,8 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 				"aria-label": "Reel information",
 				"aria-modal": e.infoSheetOverlay ? "true" : void 0,
 				tabindex: e.infoSheetOverlay ? -1 : void 0,
-				"data-active-post-id": w.value?.postId
-			}, [(y(), a(S(e.infoSheet.component), g(f(A.value)), null, 16))], 8, xt)])) : o("", !0)]),
+				"data-active-post-id": T.value?.postId
+			}, [(b(), a(C(e.infoSheet.component), g(f(j.value)), null, 16))], 8, xt)])) : o("", !0)]),
 			_: 1
 		})], 10, vt));
 	}
@@ -1749,93 +1749,93 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 		"retryForward"
 	],
 	setup(t, { expose: i, emit: c }) {
-		let l = t, d = c, f = C(null), p = C(null), h = C(null), g = C(null), b = C({}), x = C(!1), S = C(/* @__PURE__ */ new Set()), w = C(/* @__PURE__ */ new Map()), T = C(/* @__PURE__ */ new Set()), E = C(/* @__PURE__ */ new Map()), k = C(/* @__PURE__ */ new Map()), A = C(/* @__PURE__ */ new Map()), j = r(() => F(l.state)), N = r(() => l.state.reelMediaSource === "original" ? A.value : k.value), I = new Set(l.state.items.map((e) => e.postId)), L = null, R = null, z = !1;
-		function B() {
+		let l = t, d = c, f = w(null), p = w(null), h = w(null), g = w(null), x = w({}), S = w(!1), C = w(/* @__PURE__ */ new Set()), T = w(/* @__PURE__ */ new Map()), E = w(/* @__PURE__ */ new Set()), D = w(/* @__PURE__ */ new Map()), A = w(/* @__PURE__ */ new Map()), j = w(/* @__PURE__ */ new Map()), M = r(() => I(l.state)), P = r(() => l.state.reelMediaSource === "original" ? j.value : A.value), L = new Set(l.state.items.map((e) => e.postId)), R = null, z = null, B = !1;
+		function V() {
 			return typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
 		}
-		function V() {
-			L !== null && cancelAnimationFrame(L), L = requestAnimationFrame(() => {
-				L = requestAnimationFrame(() => {
-					L = null, S.value = /* @__PURE__ */ new Set();
+		function H() {
+			R !== null && cancelAnimationFrame(R), R = requestAnimationFrame(() => {
+				R = requestAnimationFrame(() => {
+					R = null, C.value = /* @__PURE__ */ new Set();
 				});
 			});
 		}
-		function H(e, t, n) {
-			let r = P(e, t);
-			k.value.get(r) !== n && (k.value = new Map(k.value).set(r, n));
-		}
 		function U(e, t, n) {
-			let r = P(e, t);
+			let r = F(e, t);
 			A.value.get(r) !== n && (A.value = new Map(A.value).set(r, n));
 		}
-		function W(e, t) {
-			H(e, t, "error");
+		function W(e, t, n) {
+			let r = F(e, t);
+			j.value.get(r) !== n && (j.value = new Map(j.value).set(r, n));
 		}
 		function G(e, t) {
-			H(e, t, "ready");
-		}
-		function ne(e, t) {
 			U(e, t, "error");
 		}
-		function re(e, t) {
+		function K(e, t) {
 			U(e, t, "ready");
 		}
-		function ie(e, t) {
+		function te(e, t) {
+			W(e, t, "error");
+		}
+		function ne(e, t) {
+			W(e, t, "ready");
+		}
+		function re(e, t) {
 			if (l.state.reelMediaSource === "original") {
-				ne(e, t);
+				te(e, t);
 				return;
 			}
-			W(e, t);
+			G(e, t);
 		}
-		function K(e, t) {
+		function q(e, t) {
 			if (l.state.reelMediaSource === "original") {
-				re(e, t);
+				ne(e, t);
 				return;
 			}
-			G(e, t);
+			K(e, t);
 		}
-		function q(e, t) {
+		function J(e, t) {
 			let n = l.state.items.find((t) => t.postId === e);
 			if (!n) return;
-			let r = M(n, t);
+			let r = N(n, t);
 			(l.state.mediaIndices.get(e) ?? 0) !== r && (l.state.mediaIndices = new Map(l.state.mediaIndices).set(e, r));
 		}
-		async function ae() {
+		async function ie() {
 			await m(), (l.state.layout === "reel" || l.state.reelOrigin === "masonry" ? p.value : f.value)?.loadIfNearBottom();
 		}
-		function J(e) {
+		function Y(e) {
 			return l.state.isLoading || l.state.items.length === 0 || l.state.layout !== "reel" && l.state.reelOrigin !== "masonry" ? !1 : p.value?.changeActiveMedia?.(e) ?? !1;
 		}
-		function Y(e) {
+		function X(e) {
 			return l.state.isLoading || l.state.items.length === 0 || l.state.layout !== "reel" && l.state.reelOrigin !== "masonry" ? !1 : p.value?.moveActivePost?.(e) ?? !1;
 		}
-		function oe() {
+		function ae() {
 			return l.state.layout !== "masonry" || l.state.reelOrigin === "masonry" ? null : f.value?.getScrollElement?.() ?? null;
 		}
-		function se(e, t) {
-			R = e, z = t === "keyboard", b.value = Z(e), d("openReel", e), m(() => h.value?.focus());
+		function oe(e, t) {
+			z = e, B = t === "keyboard", x.value = Z(e), d("openReel", e), m(() => h.value?.focus());
 		}
-		function X(e) {
+		function se(e) {
 			let t = g.value?.querySelectorAll(".masonry-feed [data-post-id]") ?? [];
 			return Array.from(t).find((t) => t.dataset.postId === String(e)) ?? null;
 		}
 		function ce(e) {
-			if (l.state.layout !== "masonry" || l.state.reelOrigin !== null || B()) return 0;
-			let t = [...new Set(e)], n = t.filter(X);
+			if (l.state.layout !== "masonry" || l.state.reelOrigin !== null || V()) return 0;
+			let t = [...new Set(e)], n = t.filter(se);
 			if (n.length === 0) return 0;
-			let r = new Map(E.value);
+			let r = new Map(D.value);
 			return n.forEach((e, t) => {
 				r.set(e, t * Ct);
-			}), S.value = new Set([...S.value].filter((e) => !n.includes(e))), T.value = new Set([...T.value, ...t]), E.value = r, wt + (n.length - 1) * Ct;
+			}), C.value = new Set([...C.value].filter((e) => !n.includes(e))), E.value = new Set([...E.value, ...t]), D.value = r, wt + (n.length - 1) * Ct;
 		}
 		function le(e, t) {
-			let n = X(e), r = n?.querySelector(".media-card-activator") ?? n;
+			let n = se(e), r = n?.querySelector(".media-card-activator") ?? n;
 			r && (r.classList.toggle("media-card-focus-silent", !t), t || r.addEventListener("blur", () => {
 				r.classList.remove("media-card-focus-silent");
 			}, { once: !0 }), r?.focus({ preventScroll: !0 }));
 		}
 		function Z(e) {
-			let t = g.value, n = X(e);
+			let t = g.value, n = se(e);
 			if (t === null || n === null) return {};
 			let r = t.getBoundingClientRect(), i = n.getBoundingClientRect();
 			return {
@@ -1846,11 +1846,11 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			};
 		}
 		function ue() {
-			l.state.reelOrigin === "masonry" && (R ??= l.state.activeReelPostId, x.value = !0, d("closeReel"));
+			l.state.reelOrigin === "masonry" && (z ??= l.state.activeReelPostId, S.value = !0, d("closeReel"));
 		}
 		function de() {
-			let e = R, t = z;
-			x.value = !1, R = null, z = !1, b.value = {}, m(() => {
+			let e = z, t = B;
+			S.value = !1, z = null, B = !1, x.value = {}, m(() => {
 				e !== null && le(e, t);
 			});
 		}
@@ -1864,7 +1864,7 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 				e.preventDefault(), d("reelInfoSheetChange", !1);
 				return;
 			}
-			if (e.defaultPrevented || e.altKey || e.ctrlKey || e.metaKey || e.shiftKey || x.value || l.state.layout !== "reel" && l.state.reelOrigin !== "masonry") return;
+			if (e.defaultPrevented || e.altKey || e.ctrlKey || e.metaKey || e.shiftKey || S.value || l.state.layout !== "reel" && l.state.reelOrigin !== "masonry") return;
 			let n = e.target;
 			if (n instanceof HTMLElement && (n.isContentEditable || [
 				"INPUT",
@@ -1874,31 +1874,31 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			let r = e.key === "ArrowLeft" ? -1 : e.key === "ArrowRight" ? 1 : 0;
 			r !== 0 && p.value?.changeActiveMedia?.(r) && e.preventDefault();
 		}
-		return D(() => l.state.items.map((e) => e.postId), (e) => {
-			let t = e.filter((e) => !I.has(e)), n = new Set(e);
-			if (I = new Set(e), T.value = new Set([...T.value].filter((e) => n.has(e))), E.value = new Map([...E.value].filter(([e]) => n.has(e))), t.length === 0 || B()) return;
+		return O(() => l.state.items.map((e) => e.postId), (e) => {
+			let t = e.filter((e) => !L.has(e)), n = new Set(e);
+			if (L = new Set(e), E.value = new Set([...E.value].filter((e) => n.has(e))), D.value = new Map([...D.value].filter(([e]) => n.has(e))), t.length === 0 || V()) return;
 			let r = /* @__PURE__ */ new Map();
 			e.forEach((e) => {
-				let t = w.value.get(e);
+				let t = T.value.get(e);
 				t !== void 0 && r.set(e, t);
 			}), t.forEach((e, t) => {
 				r.set(e, t * Ct);
-			}), w.value = r, S.value = new Set([...S.value, ...t]), V();
-		}, { flush: "sync" }), v(() => window.addEventListener("keydown", fe)), ee(() => {
-			window.removeEventListener("keydown", fe), L !== null && cancelAnimationFrame(L);
+			}), T.value = r, C.value = new Set([...C.value, ...t]), H();
+		}, { flush: "sync" }), y(() => window.addEventListener("keydown", fe)), v(() => {
+			window.removeEventListener("keydown", fe), R !== null && cancelAnimationFrame(R);
 		}), i({
-			changeActiveReelMedia: J,
-			getAutoScrollElement: oe,
-			loadIfNearBottom: ae,
-			moveActiveReelPost: Y,
+			changeActiveReelMedia: Y,
+			getAutoScrollElement: ae,
+			loadIfNearBottom: ie,
+			moveActiveReelPost: X,
 			startItemRemoval: ce,
 			transitionActiveReelMedia: (e) => p.value?.transitionActiveMedia?.(e) ?? Promise.resolve(!1),
 			transitionActiveReelPost: (e) => p.value?.transitionActivePost?.(e) ?? Promise.resolve(!1)
-		}), (r, i) => (y(), s("div", {
+		}), (r, i) => (b(), s("div", {
 			ref_key: "surfaceElement",
 			ref: g,
 			class: "vibe-surface"
-		}, [t.state.layout === "reel" && (t.state.items.length > 0 || t.state.reelForward.status !== "idle") ? (y(), a(St, {
+		}, [t.state.layout === "reel" && (t.state.items.length > 0 || t.state.reelForward.status !== "idle") ? (b(), a(St, {
 			key: 0,
 			ref_key: "reelRenderer",
 			ref: p,
@@ -1923,17 +1923,17 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			"info-sheet-overlay": t.state.reelInfoSheetOverlay,
 			"next-page-error": !!t.state.nextPageError,
 			origin: "reel",
-			"preview-states": N.value,
+			"preview-states": P.value,
 			"reel-auto-advance": t.state.reelAutoAdvance,
 			"reel-forward": t.state.reelForward,
-			state: j.value,
+			state: M.value,
 			total: t.state.total,
 			onActiveChange: i[0] ||= (e) => d("activeReelChange", e),
 			onCloseInfoSheet: i[1] ||= (e) => d("reelInfoSheetChange", !1),
-			onError: ie,
+			onError: re,
 			onLoadMore: i[2] ||= (e) => d("loadMore"),
-			onMediaChange: q,
-			onReady: K,
+			onMediaChange: J,
+			onReady: q,
 			onRetryEnd: i[3] ||= (e) => d("retryEnd"),
 			onRetryForward: i[4] ||= (e) => d("retryForward")
 		}, null, 8, [
@@ -1962,12 +1962,12 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			"reel-forward",
 			"state",
 			"total"
-		])) : t.state.error || t.state.isLoading || t.state.items.length === 0 && t.state.reelForward.status === "idle" ? (y(), a(te, {
+		])) : t.state.error || t.state.isLoading || t.state.items.length === 0 && t.state.reelForward.status === "idle" ? (b(), a(ee, {
 			key: 1,
 			actions: t.feedFooterActions,
 			"can-retry-end": t.canRetryEnd,
 			"feed-footer": t.feedFooter,
-			state: j.value,
+			state: M.value,
 			onLoadMore: i[5] ||= (e) => d("loadMore"),
 			onRetryEnd: i[6] ||= (e) => d("retryEnd")
 		}, null, 8, [
@@ -1975,14 +1975,14 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			"can-retry-end",
 			"feed-footer",
 			"state"
-		])) : (y(), s(e, { key: 2 }, [u(st, {
+		])) : (b(), s(e, { key: 2 }, [u(st, {
 			ref_key: "masonryRenderer",
 			ref: f,
 			"can-retry-end": t.canRetryEnd,
-			"entering-post-ids": S.value,
-			"entry-delays": w.value,
-			"leaving-post-ids": T.value,
-			"removal-delays": E.value,
+			"entering-post-ids": C.value,
+			"entry-delays": T.value,
+			"leaving-post-ids": E.value,
+			"removal-delays": D.value,
 			"card-footer": t.cardFooter,
 			"card-header": t.cardHeader,
 			"feed-footer": t.feedFooter,
@@ -1995,15 +1995,15 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			"load-more-locked": t.state.loadMoreLocked,
 			"media-indices": t.state.mediaIndices,
 			"next-page-error": !!t.state.nextPageError,
-			"preview-states": k.value,
-			suspended: t.state.reelOrigin === "masonry" || x.value,
-			state: j.value,
+			"preview-states": A.value,
+			suspended: t.state.reelOrigin === "masonry" || S.value,
+			state: M.value,
 			total: t.state.total,
-			onActivate: se,
-			onError: W,
+			onActivate: oe,
+			onError: G,
 			onLoadMore: i[7] ||= (e) => d("loadMore"),
-			onMediaChange: q,
-			onReady: G,
+			onMediaChange: J,
+			onReady: K,
 			onRetryEnd: i[8] ||= (e) => d("retryEnd")
 		}, null, 8, [
 			"can-retry-end",
@@ -2031,7 +2031,7 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 			name: "vibe-reel-viewer",
 			onAfterLeave: de
 		}, {
-			default: O(() => [t.state.reelOrigin === "masonry" ? (y(), s("section", {
+			default: k(() => [t.state.reelOrigin === "masonry" ? (b(), s("section", {
 				key: 0,
 				ref_key: "reelOverlay",
 				ref: h,
@@ -2040,7 +2040,7 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 				"aria-label": "Media viewer",
 				"aria-modal": "true",
 				tabindex: "-1",
-				style: _(b.value)
+				style: _(x.value)
 			}, [u(St, {
 				ref_key: "reelRenderer",
 				ref: p,
@@ -2065,17 +2065,17 @@ var ut = ["aria-label"], dt = /* @__PURE__ */ d({
 				"media-source": "original",
 				"next-page-error": !!t.state.nextPageError,
 				origin: "masonry",
-				"preview-states": A.value,
+				"preview-states": j.value,
 				"reel-auto-advance": t.state.reelAutoAdvance,
 				"reel-forward": t.state.reelForward,
-				state: j.value,
+				state: M.value,
 				total: t.state.total,
 				onActiveChange: i[9] ||= (e) => d("activeReelChange", e),
 				onCloseInfoSheet: i[10] ||= (e) => d("reelInfoSheetChange", !1),
-				onError: ne,
+				onError: te,
 				onLoadMore: i[11] ||= (e) => d("loadMore"),
-				onMediaChange: q,
-				onReady: re,
+				onMediaChange: J,
+				onReady: ne,
 				onRetryEnd: i[12] ||= (e) => d("retryEnd"),
 				onRetryForward: i[13] ||= (e) => d("retryForward")
 			}, null, 8, [
@@ -2273,80 +2273,131 @@ async function Ht(e, t, n) {
 function Ut(e, t, n) {
 	return e?.strategy === "backend" && t.feedKey === e.feedKey && t.sessionId === n.sessionId;
 }
-async function Wt({ existingItems: e, initialCursor: t, loadPage: n, maximumRequests: r, onDelayChange: i, onProgress: a, options: o, receivedOffset: s = 0, requestOffset: c = 0, signal: l }) {
-	let u = [], d = [...e], f = /* @__PURE__ */ new Set(), p = r ?? It(o), m = t, h = t, g = 0, _;
-	for (; g < p;) {
-		let e = Lt(m);
-		if (f.has(e)) throw Error("Vibe autofill received a repeated cursor.");
-		f.add(e), await Pt({
-			delayMs: Nt(c + g, o),
-			onChange: i,
-			signal: l
+async function Wt({ existingItems: e, initialCursor: t, loadPage: n, maximumRequests: r, onCollection: i, onDelayChange: a, onProgress: o, options: s, receivedOffset: c = 0, requestOffset: l = 0, signal: u }) {
+	let d = [], f = [...e], p = /* @__PURE__ */ new Set(), m = r ?? It(s), h = t, g = t, _ = 0, v;
+	for (; _ < m;) {
+		let e = Lt(h);
+		if (p.has(e)) throw Error("Vibe autofill received a repeated cursor.");
+		p.add(e), await Pt({
+			delayMs: Nt(l + _, s),
+			onChange: a,
+			signal: u
 		});
 		let t = Et(await n({
-			cursor: m,
-			signal: l
+			cursor: h,
+			signal: u
 		}));
-		g += 1;
-		let r = Q(d, t.items).slice(d.length);
-		d.push(...r), u.push(...r), h = t.next, t.total !== void 0 && (_ = t.total);
-		let p = {
-			missing: Math.max(0, o.pageSize - s - u.length),
-			next: h,
-			received: s + u.length,
-			requests: c + g
+		_ += 1;
+		let r = Q(f, t.items).slice(f.length);
+		f.push(...r), d.push(...r), g = t.next, t.total !== void 0 && (v = t.total);
+		let m = {
+			missing: Math.max(0, s.pageSize - c - d.length),
+			next: g,
+			received: c + d.length,
+			requests: l + _
 		};
-		if (a(p), p.missing === 0) return {
-			...p,
-			items: u,
-			lastCursor: m,
-			status: "complete",
-			total: _
+		o(m);
+		let y = {
+			...m,
+			items: [...d],
+			lastCursor: h,
+			total: v
+		};
+		if (i(y), m.missing === 0) return {
+			...y,
+			status: "complete"
 		};
-		if (h === null) return {
-			...p,
-			items: u,
-			lastCursor: m,
-			status: "exhausted",
-			total: _
+		if (g === null) return {
+			...y,
+			status: "exhausted"
 		};
-		m = h;
+		h = g;
 	}
 	return {
-		items: u,
-		lastCursor: m,
-		missing: Math.max(0, o.pageSize - s - u.length),
-		next: h,
-		received: s + u.length,
-		requests: c + g,
+		items: d,
+		lastCursor: h,
+		missing: Math.max(0, s.pageSize - c - d.length),
+		next: g,
+		received: c + d.length,
+		requests: l + _,
 		status: "exhausted",
-		total: _
+		total: v
 	};
 }
-var Gt = 100;
-function Kt(e, t) {
+//#endregion
+//#region src/core/autofillController.ts
+var Gt = class {
+	collection = null;
+	cycle = 0;
+	delayCountdown;
+	constructor(e) {
+		this.context = e, this.delayCountdown = new Ft((t) => Object.assign(e.state.autofill, t)), this.syncCountdown();
+	}
+	beginCycle() {
+		let { options: e, state: t } = this.context;
+		if (!e) return "";
+		this.clear();
+		let n = `vibe-autofill-${Date.now().toString(36)}-${++this.cycle}`;
+		return t.autofill = {
+			...Bt(e, void 0, !1),
+			cycleId: n,
+			status: "filling"
+		}, n;
+	}
+	async cancel() {
+		let { cancelRequest: e, options: t, state: n } = this.context;
+		await Ht(t, n, e), this.commitCollection();
+	}
+	captureCollection(e, t) {
+		t && (this.collection = e);
+	}
+	clear() {
+		this.delayCountdown.clear(), this.collection = null;
+	}
+	clearCountdown() {
+		this.delayCountdown.clear();
+	}
+	clearCollection() {
+		this.collection = null;
+	}
+	syncCountdown() {
+		let { autofill: e } = this.context.state;
+		this.delayCountdown.sync(e.strategy === "backend" && e.status === "waiting" ? e.nextRequestAt : null);
+	}
+	commitCollection() {
+		let { onLastCursor: e, options: t, state: n } = this.context;
+		if (t?.strategy !== "frontend") return;
+		let r = this.collection;
+		this.collection = null, r && (n.items = Q(n.items, r.items), e(r.lastCursor), n.next = r.next, r.total !== void 0 && (n.total = r.total), Object.assign(n.autofill, {
+			missing: r.missing,
+			received: r.received,
+			requests: r.requests
+		}));
+	}
+}, Kt = 100;
+function qt(e, t) {
 	if (!Number.isFinite(t) || t <= 0) throw TypeError(`Vibe ${e} must be a positive number.`);
 }
-function qt(e, t, n) {
+function Jt(e, t, n) {
 	return Math.min(n, Math.max(t, e));
 }
-function Jt(e) {
+function Yt(e) {
 	if (!e) return;
 	let t = e.minSpeedPxPerSecond ?? 20, n = e.maxSpeedPxPerSecond ?? 240;
-	if (Kt("autoScroll.minSpeedPxPerSecond", t), Kt("autoScroll.maxSpeedPxPerSecond", n), t > n) throw TypeError("Vibe autoScroll.minSpeedPxPerSecond cannot exceed maxSpeedPxPerSecond.");
-	e.speedPxPerSecond !== void 0 && Kt("autoScroll.speedPxPerSecond", e.speedPxPerSecond);
+	if (qt("autoScroll.minSpeedPxPerSecond", t), qt("autoScroll.maxSpeedPxPerSecond", n), t > n) throw TypeError("Vibe autoScroll.minSpeedPxPerSecond cannot exceed maxSpeedPxPerSecond.");
+	e.speedPxPerSecond !== void 0 && qt("autoScroll.speedPxPerSecond", e.speedPxPerSecond);
 }
-function Yt(e) {
+function Xt(e) {
 	let t = e?.minSpeedPxPerSecond ?? 20, n = e?.maxSpeedPxPerSecond ?? 240;
 	return {
 		enabled: e?.enabled ?? !1,
 		maxSpeedPxPerSecond: n,
 		minSpeedPxPerSecond: t,
 		paused: !1,
-		speedPxPerSecond: qt(e?.speedPxPerSecond ?? 80, t, n)
+		speedPxPerSecond: Jt(e?.speedPxPerSecond ?? 80, t, n)
 	};
 }
-var Xt = class {
+var Zt = class {
 	frame = null;
 	lastTimestamp = null;
 	mounted = !1;
@@ -2366,9 +2417,9 @@ var Xt = class {
 		this.options.state.enabled && (this.options.state.paused = e, this.lastTimestamp = null, e ? this.cancelFrame() : this.schedule());
 	}
 	setSpeed(e) {
-		Kt("auto-scroll speed", e);
+		qt("auto-scroll speed", e);
 		let t = this.options.state;
-		t.speedPxPerSecond = qt(e, t.minSpeedPxPerSecond, t.maxSpeedPxPerSecond);
+		t.speedPxPerSecond = Jt(e, t.minSpeedPxPerSecond, t.maxSpeedPxPerSecond);
 	}
 	tick = (e) => {
 		this.frame = null;
@@ -2380,7 +2431,7 @@ var Xt = class {
 			return;
 		}
 		if (this.lastTimestamp !== null) {
-			let r = Math.min(Gt, Math.max(0, e - this.lastTimestamp)), i = Math.max(0, n.scrollHeight - n.clientHeight);
+			let r = Math.min(Kt, Math.max(0, e - this.lastTimestamp)), i = Math.max(0, n.scrollHeight - n.clientHeight);
 			n.scrollTop = Math.min(i, n.scrollTop + t.speedPxPerSecond * r / 1e3);
 		}
 		this.lastTimestamp = e, this.schedule();
@@ -2394,7 +2445,7 @@ var Xt = class {
 };
 //#endregion
 //#region src/core/backendAutofill.ts
-async function Zt(e, t, n, r) {
+async function Qt(e, t, n, r) {
 	let i = await e.onUnderfilled(n);
 	if (!r()) return;
 	if (!i.sessionId.trim()) throw TypeError("Vibe backend autofill requires a sessionId.");
@@ -2408,80 +2459,81 @@ async function Zt(e, t, n, r) {
 		status: "waiting"
 	});
 }
-function Qt(e, t) {
+function $t(e, t) {
 	["complete", "exhausted"].includes(t.status) && t.items && (e.items = Q(e.items, t.items)), t.next !== void 0 && (e.next = t.next), t.total !== void 0 && (e.total = t.total);
 }
-function $t(e, t, n) {
+function en(e, t, n) {
 	let r = t.autofill;
-	return !Ut(e, n, r) || n.sequence <= r.sequence || ["cancelled", "cancelling"].includes(r.status) || ["complete", "exhausted"].includes(n.status) && n.next === void 0 ? !1 : (Qt(t, n), Object.assign(r, $(n.status === "waiting" ? n.nextRequestAt : null)), r.error = n.error ?? null, r.missing = Math.max(0, (r.pageSize ?? 0) - n.received), r.received = n.received, n.requests !== void 0 && (r.requests = n.requests), r.sequence = n.sequence, r.status = n.status, !0);
+	return !Ut(e, n, r) || n.sequence <= r.sequence || ["cancelled", "cancelling"].includes(r.status) || ["complete", "exhausted"].includes(n.status) && n.next === void 0 ? !1 : ($t(t, n), Object.assign(r, $(n.status === "waiting" ? n.nextRequestAt : null)), r.error = n.error ?? null, r.missing = Math.max(0, (r.pageSize ?? 0) - n.received), r.received = n.received, n.requests !== void 0 && (r.requests = n.requests), r.sequence = n.sequence, r.status = n.status, !0);
 }
-function en(e, t, n) {
-	return e?.strategy !== "backend" || n.feedKey !== e.feedKey || n.pageSize !== e.pageSize ? !1 : (t.autofill = Bt(e, n), Qt(t, n), !0);
+function tn(e, t, n) {
+	return e?.strategy !== "backend" || n.feedKey !== e.feedKey || n.pageSize !== e.pageSize ? !1 : (t.autofill = Bt(e, n), $t(t, n), !0);
 }
 //#endregion
 //#region src/core/initialAutofill.ts
-async function tn({ cycleId: e, isCurrent: t, onLastCursor: n, options: r, signal: i, state: a }) {
-	let o = r.autofill;
-	if (!o) return;
-	let s = a.items.length;
-	if (Object.assign(a.autofill, {
-		missing: Math.max(0, o.pageSize - s),
-		received: s,
+async function nn({ cycleId: e, isCurrent: t, onCollection: n, onLastCursor: r, options: i, signal: a, state: o }) {
+	let s = i.autofill;
+	if (!s) return;
+	let c = o.items.length;
+	if (Object.assign(o.autofill, {
+		missing: Math.max(0, s.pageSize - c),
+		received: c,
 		requests: 1
-	}), s >= o.pageSize) {
-		a.autofill.status = "complete";
+	}), c >= s.pageSize) {
+		o.autofill.status = "complete";
 		return;
 	}
-	if (o.strategy === "backend") {
-		await Zt(o, a, {
+	if (s.strategy === "backend") {
+		await Qt(s, o, {
 			cycleId: e,
-			feedKey: o.feedKey,
-			items: [...a.items],
-			missing: o.pageSize - s,
-			next: a.next,
-			pageSize: o.pageSize,
-			received: s,
-			signal: i,
-			total: a.total
+			feedKey: s.feedKey,
+			items: [...o.items],
+			missing: s.pageSize - c,
+			next: o.next,
+			pageSize: s.pageSize,
+			received: c,
+			signal: a,
+			total: o.total
 		}, t);
 		return;
 	}
-	if (!r.loadPage || a.next === null) {
-		a.autofill.status = "exhausted";
+	if (!i.loadPage || o.next === null) {
+		o.autofill.status = "exhausted";
 		return;
 	}
-	let c = await Wt({
-		existingItems: a.items,
-		initialCursor: a.next,
-		loadPage: r.loadPage,
-		maximumRequests: It(o, !1),
+	let l = await Wt({
+		existingItems: o.items,
+		initialCursor: o.next,
+		loadPage: i.loadPage,
+		maximumRequests: It(s, !1),
+		onCollection: n,
 		onDelayChange: (e) => {
-			t() && Object.assign(a.autofill, e);
+			t() && Object.assign(o.autofill, e);
 		},
 		onProgress: (e) => {
-			t() && Object.assign(a.autofill, e, { status: "filling" });
+			t() && Object.assign(o.autofill, e, { status: "filling" });
 		},
-		options: o,
-		receivedOffset: s,
+		options: s,
+		receivedOffset: c,
 		requestOffset: 1,
-		signal: i
+		signal: a
 	});
-	t() && (a.items = Q(a.items, c.items), a.next = c.next, c.total !== void 0 && (a.total = c.total), n(c.lastCursor), Object.assign(a.autofill, {
-		missing: c.missing,
-		received: c.received,
-		requests: c.requests,
-		status: c.status
+	t() && (o.items = Q(o.items, l.items), o.next = l.next, l.total !== void 0 && (o.total = l.total), r(l.lastCursor), Object.assign(o.autofill, {
+		missing: l.missing,
+		received: l.received,
+		requests: l.requests,
+		status: l.status
 	}));
 }
 //#endregion
 //#region src/core/fill.ts
-function nn(e) {
+function rn(e) {
 	return "pages" in e ? { pages: e.pages } : { until: "end" };
 }
-function rn(e) {
+function an(e) {
 	return `${typeof e}:${String(e)}`;
 }
-function an(e) {
+function on(e) {
 	if (!e || typeof e != "object") throw TypeError("Vibe fill target must be an object.");
 	if ("pages" in e) {
 		if (!Number.isInteger(e.pages) || e.pages <= 0) throw TypeError("Vibe fill pages must be a positive integer.");
@@ -2490,7 +2542,7 @@ function an(e) {
 	if ("until" in e && e.until === "end") return { until: "end" };
 	throw TypeError("Vibe fill target must be { pages } or { until: 'end' }.");
 }
-function on(e) {
+function sn(e) {
 	if (!e) return;
 	if (e.strategy === "frontend") {
 		Mt(e, "frontend fill");
@@ -2500,10 +2552,10 @@ function on(e) {
 	let t = e.initialSession;
 	if (t) {
 		if (t.feedKey !== e.feedKey) throw TypeError("Vibe backend fill initialSession feedKey must match fill feedKey.");
-		an(t.target);
+		on(t.target);
 	}
 }
-function sn(e, t, n = !0) {
+function cn(e, t, n = !0) {
 	let r = e?.strategy === "backend" && n ? e.initialSession : void 0, i = t ?? r, a = $(i?.nextRequestAt);
 	return {
 		completedPages: i?.completedPages ?? 0,
@@ -2517,10 +2569,10 @@ function sn(e, t, n = !0) {
 		sessionId: i?.sessionId ?? null,
 		status: i?.status ?? "idle",
 		strategy: e?.strategy ?? null,
-		target: i ? nn(i.target) : null
+		target: i ? rn(i.target) : null
 	};
 }
-function cn(e) {
+function ln(e) {
 	return [
 		"cancelling",
 		"filling",
@@ -2528,10 +2580,10 @@ function cn(e) {
 		"waiting"
 	].includes(e.status);
 }
-async function ln({ existingItems: e, initialCursor: t, loadPage: n, onDelayChange: r, onProgress: i, options: a, signal: o, target: s }) {
+async function un({ existingItems: e, initialCursor: t, loadPage: n, onDelayChange: r, onProgress: i, options: a, signal: o, target: s }) {
 	let c = [], l = [...e], u = /* @__PURE__ */ new Set(), d = 0, f = t, p = t, m = 0, h;
 	for (; p !== null;) {
-		let e = rn(f);
+		let e = an(f);
 		if (u.has(e)) throw Error("Vibe fill received a repeated cursor.");
 		u.add(e), await Pt({
 			delayMs: Nt(d, a),
@@ -2580,7 +2632,7 @@ async function ln({ existingItems: e, initialCursor: t, loadPage: n, onDelayChan
 }
 //#endregion
 //#region src/core/backendFill.ts
-async function un(e, t, n, r) {
+async function dn(e, t, n, r) {
 	let i = await e.onStart(n);
 	if (r()) {
 		if (!i.sessionId.trim()) throw TypeError("Vibe backend fill requires a sessionId.");
@@ -2594,22 +2646,22 @@ async function un(e, t, n, r) {
 		});
 	}
 }
-function dn(e, t, n) {
+function fn(e, t, n) {
 	return e?.strategy === "backend" && n.feedKey === e.feedKey && n.sessionId === t.fill.sessionId;
 }
-function fn(e) {
+function pn(e) {
 	return Number.isInteger(e.completedPages) && e.completedPages >= 0 && Number.isInteger(e.received) && e.received >= 0 && Number.isInteger(e.sequence) && e.sequence >= 0;
 }
-function pn(e, t) {
+function mn(e, t) {
 	if (!["complete", "exhausted"].includes(t.status)) return !0;
 	let n = e.fill.target;
 	return !n || !Array.isArray(t.items) || t.next === void 0 || t.lastCursor === void 0 ? !1 : t.status === "exhausted" ? "pages" in n && t.completedPages < n.pages && t.next === null : "pages" in n ? t.completedPages === n.pages : t.next === null;
 }
-function mn(e, t, n) {
+function hn(e, t, n) {
 	t.total !== void 0 && (e.total = t.total), ["complete", "exhausted"].includes(t.status) && (e.items = Q(e.items, t.items ?? []), e.next = t.next ?? null, n(t.lastCursor ?? null));
 }
-function hn(e, t, n, r) {
-	return !dn(e, t, n) || !fn(n) || n.sequence <= t.fill.sequence || ["cancelled", "cancelling"].includes(t.fill.status) || !pn(t, n) ? !1 : (mn(t, n, r), Object.assign(t.fill, {
+function gn(e, t, n, r) {
+	return !fn(e, t, n) || !pn(n) || n.sequence <= t.fill.sequence || ["cancelled", "cancelling"].includes(t.fill.status) || !mn(t, n) ? !1 : (hn(t, n, r), Object.assign(t.fill, {
 		...$(n.status === "waiting" ? n.nextRequestAt : null),
 		completedPages: n.completedPages,
 		error: n.error ?? null,
@@ -2618,14 +2670,14 @@ function hn(e, t, n, r) {
 		status: n.status
 	}), !0);
 }
-function gn(e, t, n, r) {
+function _n(e, t, n, r) {
 	if (e?.strategy !== "backend" || n.feedKey !== e.feedKey) return !1;
 	let i = t.fill;
-	return t.fill = sn(e, n), !fn(n) || !pn(t, n) ? (t.fill = i, !1) : (mn(t, n, r), !0);
+	return t.fill = cn(e, n), !pn(n) || !mn(t, n) ? (t.fill = i, !1) : (hn(t, n, r), !0);
 }
 //#endregion
 //#region src/core/fillController.ts
-var _n = class {
+var vn = class {
 	abortController = null;
 	cycle = 0;
 	delayCountdown;
@@ -2636,23 +2688,23 @@ var _n = class {
 		}), this.syncBackendCountdown();
 	}
 	isActive() {
-		return cn(this.options.state.fill);
+		return ln(this.options.state.fill);
 	}
 	applyUpdate(e) {
-		let t = hn(this.options.fill, this.options.state, e, this.options.onLastCursor);
+		let t = gn(this.options.fill, this.options.state, e, this.options.onLastCursor);
 		return t && this.syncBackendCountdown(), t;
 	}
 	restoreSession(e) {
-		let t = gn(this.options.fill, this.options.state, e, this.options.onLastCursor);
+		let t = _n(this.options.fill, this.options.state, e, this.options.onLastCursor);
 		return t && this.syncBackendCountdown(), t;
 	}
 	async start(e) {
 		let t = this.options.fill;
 		if (!t) throw Error("Vibe fill is not configured.");
 		if (this.isActive()) throw Error("Vibe fill is already active.");
-		let n = an(e), r = `vibe-fill-${Date.now().toString(36)}-${++this.cycle}`;
+		let n = on(e), r = `vibe-fill-${Date.now().toString(36)}-${++this.cycle}`;
 		if (this.options.state.fill = {
-			...sn(t, void 0, !1),
+			...cn(t, void 0, !1),
 			cycleId: r,
 			status: "filling",
 			target: n
@@ -2663,7 +2715,7 @@ var _n = class {
 		let i = ++this.requestVersion, a = new AbortController();
 		this.abortController = a;
 		try {
-			t.strategy === "frontend" ? await this.startFrontend(t, n, a, i) : (await un(t, this.options.state, {
+			t.strategy === "frontend" ? await this.startFrontend(t, n, a, i) : (await dn(t, this.options.state, {
 				cycleId: r,
 				feedKey: t.feedKey,
 				items: [...this.options.state.items],
@@ -2681,7 +2733,7 @@ var _n = class {
 	}
 	async cancel() {
 		let { fill: e, state: t } = this.options;
-		if (!cn(t.fill) || !t.fill.cycleId) return;
+		if (!ln(t.fill) || !t.fill.cycleId) return;
 		let n = {
 			cycleId: t.fill.cycleId,
 			feedKey: t.fill.feedKey ?? "",
@@ -2695,7 +2747,7 @@ var _n = class {
 		}
 	}
 	reset() {
-		this.abortLocalRequest(), this.delayCountdown.clear(), this.options.state.fill = sn(this.options.fill, void 0, !1);
+		this.abortLocalRequest(), this.delayCountdown.clear(), this.options.state.fill = cn(this.options.fill, void 0, !1);
 	}
 	destroy() {
 		this.abortLocalRequest(), this.delayCountdown.clear();
@@ -2711,7 +2763,7 @@ var _n = class {
 		if (!i) throw Error("Vibe frontend fill requires loadPage.");
 		let a = this.options.state;
 		a.isLoadingMore = !0;
-		let o = await ln({
+		let o = await un({
 			existingItems: a.items,
 			initialCursor: a.next,
 			loadPage: i,
@@ -2738,7 +2790,7 @@ var _n = class {
 };
 //#endregion
 //#region src/core/feedFooter.ts
-function vn(e) {
+function yn(e) {
 	return {
 		cancelAutofill: () => e.cancelAutofill(),
 		loadMore: () => e.loadNext(),
@@ -2746,45 +2798,45 @@ function vn(e) {
 		retryEnd: () => e.retryEnd()
 	};
 }
-function yn(e) {
-	if (!Number.isFinite(e) || e <= 0) throw TypeError("Vibe reelAutoAdvance.intervalMs must be a positive number.");
-}
 function bn(e) {
-	e?.intervalMs !== void 0 && yn(e.intervalMs);
+	if (!Number.isFinite(e) || e <= 0) throw TypeError("Vibe reelAutoAdvance.intervalMs must be a positive number.");
 }
 function xn(e) {
+	e?.intervalMs !== void 0 && bn(e.intervalMs);
+}
+function Sn(e) {
 	return {
 		enabled: e?.enabled ?? !1,
 		includePostItems: e?.includePostItems ?? !1,
 		intervalMs: e?.intervalMs ?? 5e3
 	};
 }
-function Sn(e, t) {
+function Cn(e, t) {
 	if (typeof t == "boolean") {
 		e.enabled = t;
 		return;
 	}
-	bn(t), t.enabled !== void 0 && (e.enabled = t.enabled), t.includePostItems !== void 0 && (e.includePostItems = t.includePostItems), t.intervalMs !== void 0 && (e.intervalMs = t.intervalMs);
+	xn(t), t.enabled !== void 0 && (e.enabled = t.enabled), t.includePostItems !== void 0 && (e.includePostItems = t.includePostItems), t.intervalMs !== void 0 && (e.intervalMs = t.intervalMs);
 }
 //#endregion
 //#region src/core/reelInfoSheet.ts
-function Cn(e) {
+function wn(e) {
 	return { enabled: e?.enabled ?? !1 };
 }
-function wn(e, t, n) {
+function Tn(e, t, n) {
 	if (n && !t) throw Error("Vibe cannot enable reelInfoSheet without a configured component.");
 	e.enabled = n;
 }
 //#endregion
 //#region src/core/initialRuntimeState.ts
-function Tn(e, t) {
+function En(e, t) {
 	let n = e.initialPage;
 	return {
 		activeReelPostId: null,
-		autoScroll: Yt(e.autoScroll),
+		autoScroll: Xt(e.autoScroll),
 		autofill: Bt(e.autofill),
 		error: null,
-		fill: sn(e.fill),
+		fill: cn(e.fill),
 		infiniteScroll: e.infiniteScroll ?? !0,
 		isLoading: !n,
 		isLoadingMore: !1,
@@ -2794,14 +2846,14 @@ function Tn(e, t) {
 		mediaIndices: /* @__PURE__ */ new Map(),
 		next: n?.next ?? null,
 		nextPageError: null,
-		reelAutoAdvance: xn(e.reelAutoAdvance),
+		reelAutoAdvance: Sn(e.reelAutoAdvance),
 		reelForward: {
 			error: null,
 			status: "idle"
 		},
 		reelForwardIndex: null,
 		reelForwardItem: null,
-		reelInfoSheet: Cn(e.reelInfoSheet),
+		reelInfoSheet: wn(e.reelInfoSheet),
 		reelInfoSheetOverlay: !1,
 		reelMediaSource: "original",
 		reelOrigin: null,
@@ -2810,26 +2862,26 @@ function Tn(e, t) {
 }
 //#endregion
 //#region src/core/options.ts
-function En(e, t) {
+function Dn(e, t) {
 	if (t) {
 		if (!Number.isFinite(t.height) || t.height <= 0) throw TypeError(`Vibe ${e} height must be a positive number.`);
 		if (t.background !== void 0 && t.background !== "default" && t.background !== "transparent") throw TypeError(`Vibe ${e} background must be "default" or "transparent".`);
 	}
 }
-function Dn(e, t) {
+function On(e, t) {
 	if (t) {
 		if (t.background !== void 0 && t.background !== "default" && t.background !== "transparent") throw TypeError(`Vibe mediaCard ${e} background must be "default" or "transparent".`);
 		for (let [n, r] of [["paddingX", t.paddingX], ["paddingY", t.paddingY]]) if (r !== void 0 && (!Number.isFinite(r) || r < 0)) throw TypeError(`Vibe mediaCard ${e} ${n} must be a non-negative number.`);
 	}
 }
-function On(e) {
-	if (Jt(e.autoScroll), En("cardHeader", e.cardHeader), En("cardFooter", e.cardFooter), Dn("header", e.mediaCard?.header), Dn("footer", e.mediaCard?.footer), zt(e.autofill), on(e.fill), bn(e.reelAutoAdvance), e.removalHistoryLimit !== void 0 && (!Number.isInteger(e.removalHistoryLimit) || e.removalHistoryLimit < 0)) throw TypeError("Vibe removalHistoryLimit must be a non-negative integer.");
+function kn(e) {
+	if (Yt(e.autoScroll), Dn("cardHeader", e.cardHeader), Dn("cardFooter", e.cardFooter), On("header", e.mediaCard?.header), On("footer", e.mediaCard?.footer), zt(e.autofill), sn(e.fill), xn(e.reelAutoAdvance), e.removalHistoryLimit !== void 0 && (!Number.isInteger(e.removalHistoryLimit) || e.removalHistoryLimit < 0)) throw TypeError("Vibe removalHistoryLimit must be a non-negative integer.");
 	if (!e.initialPage && !e.loadPage) throw TypeError("Vibe requires either initialPage or loadPage.");
 	if (e.initialPage?.next !== null && !e.loadPage) throw TypeError("Vibe requires loadPage when initialPage has a next cursor.");
 	if (e.fill?.strategy === "frontend" && !e.loadPage) throw TypeError("Vibe frontend fill requires loadPage.");
 	if (e.fill?.strategy === "backend" && e.fill.initialSession && !e.initialPage) throw TypeError("Vibe backend fill restoration requires initialPage.");
 }
-function kn(e) {
+function An(e) {
 	if (typeof e != "string") return e;
 	if (typeof document > "u") throw Error("Vibe cannot resolve a selector without a document.");
 	let t = document.querySelector(e);
@@ -2838,7 +2890,7 @@ function kn(e) {
 }
 //#endregion
 //#region src/core/activeItemRemoval.ts
-function An(e, t, n, r, i) {
+function jn(e, t, n, r, i) {
 	let a = new Set(t.map(({ item: e }) => e.postId));
 	if (e.activeReelPostId === null || !a.has(e.activeReelPostId)) return;
 	let o = e.items[Math.max(n, 0)];
@@ -2851,7 +2903,7 @@ function An(e, t, n, r, i) {
 }
 //#endregion
 //#region src/core/exactMediaRemovalController.ts
-function jn(e, t) {
+function Mn(e, t) {
 	let [n, ...r] = t;
 	if (!n) throw Error("Vibe items must contain at least one media asset.");
 	return {
@@ -2860,10 +2912,10 @@ function jn(e, t) {
 		items: r
 	};
 }
-function Mn(e) {
+function Nn(e) {
 	if (!Number.isInteger(e.mediaIndex) || e.mediaIndex < 0) throw TypeError("Vibe mediaIndex must be a non-negative integer.");
 }
-var Nn = class {
+var Pn = class {
 	generation = 0;
 	metadata = /* @__PURE__ */ new WeakMap();
 	state;
@@ -2871,10 +2923,10 @@ var Nn = class {
 		this.options = e, this.state = e.state;
 	}
 	remove(e) {
-		Mn(e);
+		Nn(e);
 		let t = this.state.items.findIndex(({ postId: t }) => t === e.postId), n = this.state.items[t];
 		if (!n) return null;
-		let r = [...j(n)], i = r[e.mediaIndex];
+		let r = [...M(n)], i = r[e.mediaIndex];
 		if (!i) return null;
 		let a = Object.freeze({
 			media: i,
@@ -2888,7 +2940,7 @@ var Nn = class {
 			restored: !1
 		});
 		let o = this.state.mediaIndices.get(n.postId) ?? 0, s = this.isReelOpen() && this.state.activeReelPostId === n.postId, c = s && o === e.mediaIndex;
-		return r.splice(e.mediaIndex, 1), r.length > 0 ? (this.state.items[t] = jn(n, r), this.updateMediaIndexAfterRemoval(n.postId, e.mediaIndex, c), a) : (this.state.items.splice(t, 1), this.state.mediaIndices.delete(n.postId), s && this.advanceFromRemovedPost(a, n), a);
+		return r.splice(e.mediaIndex, 1), r.length > 0 ? (this.state.items[t] = Mn(n, r), this.updateMediaIndexAfterRemoval(n.postId, e.mediaIndex, c), a) : (this.state.items.splice(t, 1), this.state.mediaIndices.delete(n.postId), s && this.advanceFromRemovedPost(a, n), a);
 	}
 	reset() {
 		this.generation += 1;
@@ -2913,32 +2965,32 @@ var Nn = class {
 		return this.state.layout === "reel" || this.state.reelOrigin === "masonry";
 	}
 	restoreIntoPost(e, t) {
-		let n = this.state.items[e], r = [...j(n)], i = Math.min(t.mediaIndex, r.length);
-		if (r.splice(i, 0, t.media), this.state.items[e] = jn(n, r), this.state.activeReelPostId !== t.postId) return;
+		let n = this.state.items[e], r = [...M(n)], i = Math.min(t.mediaIndex, r.length);
+		if (r.splice(i, 0, t.media), this.state.items[e] = Mn(n, r), this.state.activeReelPostId !== t.postId) return;
 		let a = this.state.mediaIndices.get(t.postId) ?? 0;
 		a >= i && this.state.mediaIndices.set(t.postId, a + 1);
 	}
 	updateMediaIndexAfterRemoval(e, t, n) {
 		let r = this.state.items.find((t) => t.postId === e);
 		if (!r) return;
-		let i = j(r).length, a = this.state.mediaIndices.get(e) ?? 0, o = a;
+		let i = M(r).length, a = this.state.mediaIndices.get(e) ?? 0, o = a;
 		n ? o = t < i ? t : 0 : t < a && (o = a - 1), this.state.mediaIndices.set(e, Math.min(o, i - 1));
 	}
 };
 //#endregion
 //#region src/core/itemPlacement.ts
-function Pn(e, t) {
+function Fn(e, t) {
 	let n = new Set(t);
 	return e.flatMap((e, t) => n.has(e.postId) ? [{
 		index: t,
 		item: e
 	}] : []);
 }
-function Fn(e, t) {
+function In(e, t) {
 	let n = new Set(t.map(({ item: e }) => e.postId));
 	return e.filter((e) => !n.has(e.postId));
 }
-function In(e, t) {
+function Ln(e, t) {
 	t.forEach(({ index: e }) => {
 		if (!Number.isInteger(e) || e < 0) throw Error("Vibe item restore indexes must be non-negative integers.");
 	});
@@ -2949,7 +3001,7 @@ function In(e, t) {
 }
 //#endregion
 //#region src/core/itemRemovalController.ts
-var Ln = 20, Rn = class {
+var Rn = 20, zn = class {
 	generation = 0;
 	historyLimit;
 	metadata = /* @__PURE__ */ new WeakMap();
@@ -2958,7 +3010,7 @@ var Ln = 20, Rn = class {
 	itemOrder;
 	stopItemsWatcher;
 	constructor(e) {
-		this.options = e, this.historyLimit = e.historyLimit ?? Ln, this.state = e.state, this.itemOrder = this.state.items.map(({ postId: e }) => e), this.stopItemsWatcher = D(() => this.state.items, (e) => this.appendUnknownItems(e), { flush: "sync" });
+		this.options = e, this.historyLimit = e.historyLimit ?? Rn, this.state = e.state, this.itemOrder = this.state.items.map(({ postId: e }) => e), this.stopItemsWatcher = O(() => this.state.items, (e) => this.appendUnknownItems(e), { flush: "sync" });
 	}
 	destroy() {
 		this.reset(), this.stopItemsWatcher();
@@ -2971,7 +3023,7 @@ var Ln = 20, Rn = class {
 		let i = this.options.startRemoval(r);
 		if (i > 0 && await new Promise((e) => setTimeout(e, i)), this.metadata.get(n)?.generation !== this.generation) return n;
 		let a = this.state.items.findIndex((e) => e.postId === this.state.activeReelPostId), o = new Set(t.map(({ item: e }) => e.postId)), s = a < 0 ? 0 : this.state.items.slice(0, a).filter(({ postId: e }) => o.has(e)).length, c = Math.max(a - s, 0);
-		return this.state.items = Fn(this.state.items, t), this.options.onItemsRemoved(n, t, c), this.record(n), n;
+		return this.state.items = In(this.state.items, t), this.options.onItemsRemoved(n, t, c), this.record(n), n;
 	}
 	reset() {
 		this.generation += 1, this.history = [], this.itemOrder = [];
@@ -2982,7 +3034,7 @@ var Ln = 20, Rn = class {
 			this.restoreRemoval(t);
 			return;
 		}
-		let n = In(this.state.items, e);
+		let n = Ln(this.state.items, e);
 		this.registerExternalPlacements(e), this.state.items = n;
 	}
 	restoreRemoval(e) {
@@ -3008,7 +3060,7 @@ var Ln = 20, Rn = class {
 	}
 	collectOrderedPlacements(e) {
 		let t = new Map(this.itemOrder.map((e, t) => [e, t]));
-		return Pn(this.state.items, e).map((e) => ({
+		return Fn(this.state.items, e).map((e) => ({
 			index: t.get(e.item.postId) ?? e.index,
 			item: e.item
 		}));
@@ -3039,7 +3091,7 @@ var Ln = 20, Rn = class {
 		let r = new Map(this.itemOrder.map((e, t) => [e, t]));
 		return this.state.items = [...this.state.items, ...n].sort((e, t) => (r.get(e.postId) ?? 2 ** 53 - 1) - (r.get(t.postId) ?? 2 ** 53 - 1)), !0;
 	}
-}, zn = class {
+}, Bn = class {
 	forward = null;
 	forwardPromise = null;
 	forwardVersion = 0;
@@ -3117,7 +3169,7 @@ var Ln = 20, Rn = class {
 			}
 		}
 	}
-}, Bn = class {
+}, Vn = class {
 	generation = 0;
 	pending = Promise.resolve();
 	constructor(e) {
@@ -3134,7 +3186,7 @@ var Ln = 20, Rn = class {
 			if (!n) return;
 			let r = t.mediaIndices.get(e.postId) ?? 0;
 			if (e.mediaIndex === r) {
-				if (j(n).length > 1) {
+				if (M(n).length > 1) {
 					await this.options.transitionMedia(1);
 					return;
 				}
@@ -3167,22 +3219,22 @@ var Ln = 20, Rn = class {
 };
 //#endregion
 //#region src/core/removalControllers.ts
-function Vn(e) {
-	let t = new zn(e), n = new Bn({
+function Hn(e) {
+	let t = new Bn(e), n = new Vn({
 		state: e.state,
 		transitionMedia: (t) => e.surface()?.transitionActiveReelMedia(t) ?? Promise.resolve(!1),
 		transitionPost: (t) => e.surface()?.transitionActiveReelPost(t) ?? Promise.resolve(!1)
 	});
 	return {
-		exactMediaRemoval: new Nn({
+		exactMediaRemoval: new Pn({
 			onActivate: e.onActivate,
 			reelForward: t,
 			state: e.state
 		}),
-		itemRemoval: new Rn({
+		itemRemoval: new zn({
 			historyLimit: e.historyLimit,
 			onItemsRemoved: (n, r, i) => {
-				An(e.state, r, i, e.onActivate, (e, r) => t.start(n, e, r));
+				jn(e.state, r, i, e.onActivate, (e, r) => t.start(n, e, r));
 			},
 			onRemovalRestored: (n) => {
 				let r = t.cancel(n);
@@ -3196,17 +3248,17 @@ function Vn(e) {
 		reelRemoval: n
 	};
 }
-var Hn = 1.5;
-function Un(e) {
+var Un = 1.5;
+function Wn(e) {
 	let t = Math.min(e.screenWidth, e.screenHeight);
 	if (t > 0 && t < 600) return !0;
-	let n = Math.min(e.viewportWidth, e.viewportHeight), r = t >= n * Hn;
+	let n = Math.min(e.viewportWidth, e.viewportHeight), r = t >= n * Un;
 	return !e.hasHover && n > 0 && n < 600 && r;
 }
-function Wn(e) {
-	return Un(e) ? "reel" : "masonry";
-}
 function Gn(e) {
+	return Wn(e) ? "reel" : "masonry";
+}
+function Kn(e) {
 	let t = e.ownerDocument.defaultView, n = e.ownerDocument.documentElement;
 	return {
 		hasHover: typeof t?.matchMedia == "function" && t.matchMedia("(hover: hover)").matches,
@@ -3216,15 +3268,15 @@ function Gn(e) {
 		viewportWidth: n.clientWidth
 	};
 }
-function Kn(e) {
-	return Un(Gn(e));
-}
 function qn(e) {
-	return Wn(Gn(e));
+	return Wn(Kn(e));
+}
+function Jn(e) {
+	return Gn(Kn(e));
 }
 //#endregion
 //#region src/core/responsiveLayoutController.ts
-var Jn = class {
+var Yn = class {
 	layoutMode;
 	resizeObserver = null;
 	target = null;
@@ -3249,10 +3301,10 @@ var Jn = class {
 	}
 	handleResponsiveLayout = () => {
 		if (!this.target) return;
-		let e = qn(this.target);
-		this.state.reelInfoSheetOverlay = Kn(this.target), this.state.reelMediaSource = e === "reel" ? "preview" : "original", this.layoutMode === "responsive" && this.applyLayout(e);
+		let e = Jn(this.target);
+		this.state.reelInfoSheetOverlay = qn(this.target), this.state.reelMediaSource = e === "reel" ? "preview" : "original", this.layoutMode === "responsive" && this.applyLayout(e);
 	};
-}, Yn = class {
+}, Xn = class {
 	routedReelPostId = null;
 	reelRouteIsActive = !1;
 	constructor(e, t) {
@@ -3279,11 +3331,10 @@ var Jn = class {
 		let i = this.reelRouteIsActive ? "replace" : "push";
 		this.reelRouteIsActive = !0, this.routedReelPostId = e, this.options.router[i](r);
 	}
-}, Xn = class {
+}, Zn = class {
 	app = null;
 	autoScroll;
-	autofillDelayCountdown;
-	autofillCycle = 0;
+	autofillController;
 	abortController = null;
 	pendingRequest = null;
 	requestVersion = 0;
@@ -3299,20 +3350,27 @@ var Jn = class {
 	lastLoadedCursor = null;
 	state;
 	constructor(e) {
-		this.options = e, On(e);
+		this.options = e, kn(e);
 		let t = e.layout ?? "masonry";
-		this.state = b(Tn(e, t)), this.autoScroll = new Xt({
+		this.state = x(En(e, t)), this.autoScroll = new Zt({
 			getScrollElement: () => this.surface?.getAutoScrollElement() ?? null,
 			state: this.state.autoScroll
-		}), this.autofillDelayCountdown = new Ft((e) => Object.assign(this.state.autofill, e)), this.syncAutofillCountdown(), this.fillController = new _n({
+		}), this.autofillController = new Gt({
+			cancelRequest: () => this.cancelRequest(),
+			onLastCursor: (e) => {
+				this.lastLoadedCursor = e;
+			},
+			options: e.autofill,
+			state: this.state
+		}), this.fillController = new vn({
 			fill: e.fill,
 			loadPage: e.loadPage,
 			onLastCursor: (e) => {
 				this.lastLoadedCursor = e;
 			},
 			state: this.state
-		}), this.routing = new Yn(e.routing, this.state);
-		let n = Vn({
+		}), this.routing = new Xn(e.routing, this.state);
+		let n = Hn({
 			historyLimit: e.removalHistoryLimit,
 			loadNext: () => this.loadNext(),
 			onActivate: (e) => this.setActiveReelPost(e),
@@ -3320,20 +3378,20 @@ var Jn = class {
 			state: this.state,
 			surface: () => this.surface
 		});
-		this.exactMediaRemoval = n.exactMediaRemoval, this.itemRemoval = n.itemRemoval, this.reelForward = n.reelForward, this.reelRemoval = n.reelRemoval, this.responsiveLayout = new Jn(t, this.state, () => {
+		this.exactMediaRemoval = n.exactMediaRemoval, this.itemRemoval = n.itemRemoval, this.reelForward = n.reelForward, this.reelRemoval = n.reelRemoval, this.responsiveLayout = new Yn(t, this.state, () => {
 			this.routing.syncFeed();
 		}), this.startStateNotifications();
 	}
 	async mount() {
 		if (this.app) throw Error("Vibe is already mounted.");
 		this.startStateNotifications();
-		let e = kn(this.options.target);
+		let e = An(this.options.target);
 		this.responsiveLayout.mount(e), this.app = i(Tt, {
 			canRetryEnd: !!this.options.loadPage,
 			cardFooter: this.options.cardFooter,
 			cardHeader: this.options.cardHeader,
 			feedFooter: this.options.feedFooter,
-			feedFooterActions: vn(this),
+			feedFooterActions: yn(this),
 			mediaCard: this.options.mediaCard,
 			reelInfoSheet: this.options.reelInfoSheet,
 			state: this.state,
@@ -3358,7 +3416,7 @@ var Jn = class {
 		this.autoScroll.destroy(), this.fillController.destroy(), this.cancelRequest(), this.reelForward.reset(), this.reelRemoval.reset(), this.exactMediaRemoval.reset(), this.itemRemoval.destroy(), this.responsiveLayout.destroy(), this.stopStateWatcher?.(), this.stopStateWatcher = null, this.app?.unmount(), this.app = null, this.surface = null;
 	}
 	getState() {
-		return F(this.state);
+		return I(this.state);
 	}
 	removeMedia(e) {
 		return this.exactMediaRemoval.remove(e);
@@ -3409,11 +3467,11 @@ var Jn = class {
 		this.autoScroll.setSpeed(e);
 	}
 	applyAutofillUpdate(e) {
-		let t = $t(this.options.autofill, this.state, e);
-		return t && this.syncAutofillCountdown(), t;
+		let t = en(this.options.autofill, this.state, e);
+		return t && this.autofillController.syncCountdown(), t;
 	}
-	async cancelAutofill() {
-		await Ht(this.options.autofill, this.state, () => this.cancelRequest());
+	cancelAutofill() {
+		return this.autofillController.cancel();
 	}
 	applyFillUpdate(e) {
 		return this.fillController.applyUpdate(e);
@@ -3426,8 +3484,8 @@ var Jn = class {
 		await this.fillController.start(e);
 	}
 	restoreAutofillSession(e) {
-		let t = en(this.options.autofill, this.state, e);
-		return t && this.syncAutofillCountdown(), t;
+		let t = tn(this.options.autofill, this.state, e);
+		return t && this.autofillController.syncCountdown(), t;
 	}
 	restoreFillSession(e) {
 		return this.fillController.restoreSession(e);
@@ -3457,10 +3515,10 @@ var Jn = class {
 		this.state.loadMoreLocked !== e && (this.state.loadMoreLocked = e, !e && this.state.infiniteScroll && m(() => this.surface?.loadIfNearBottom()));
 	}
 	setReelAutoAdvance(e) {
-		Sn(this.state.reelAutoAdvance, e);
+		Cn(this.state.reelAutoAdvance, e);
 	}
 	setReelInfoSheet(e) {
-		wn(this.state.reelInfoSheet, this.options.reelInfoSheet, e);
+		Tn(this.state.reelInfoSheet, this.options.reelInfoSheet, e);
 	}
 	setLayout(e) {
 		this.responsiveLayout.setLayout(e);
@@ -3475,12 +3533,12 @@ var Jn = class {
 		this.state.layout !== "reel" && this.state.reelOrigin !== "masonry" || (this.state.activeReelPostId = e, this.routing.syncReel(e));
 	}
 	cancelRequest() {
-		this.autofillDelayCountdown.clear(), this.requestVersion += 1, this.abortController?.abort(), this.abortController = null, this.pendingRequest = null, this.state.isLoading = !1, this.state.isLoadingMore = !1;
+		this.autofillController.clearCountdown(), this.requestVersion += 1, this.abortController?.abort(), this.abortController = null, this.pendingRequest = null, this.state.isLoading = !1, this.state.isLoadingMore = !1;
 	}
 	async fetchPage(e, t) {
 		let n = this.options.loadPage;
 		if (!n) return;
-		let r = ++this.requestVersion, i = new AbortController(), a = this.options.autofill, o = a ? this.beginAutofillCycle() : null, s = !1;
+		let r = ++this.requestVersion, i = new AbortController(), a = this.options.autofill, o = a ? this.autofillController.beginCycle() : null, s = !1;
 		this.abortController = i;
 		try {
 			if (a?.strategy === "frontend") {
@@ -3488,6 +3546,7 @@ var Jn = class {
 					existingItems: t ? this.state.items : [],
 					initialCursor: e,
 					loadPage: n,
+					onCollection: (e) => this.autofillController.captureCollection(e, r === this.requestVersion),
 					onDelayChange: (e) => {
 						r === this.requestVersion && Object.assign(this.state.autofill, e);
 					},
@@ -3503,7 +3562,7 @@ var Jn = class {
 					received: o.received,
 					requests: o.requests,
 					status: o.status
-				});
+				}), this.autofillController.clearCollection();
 				return;
 			}
 			let c = Et(await n({
@@ -3521,7 +3580,7 @@ var Jn = class {
 					this.state.autofill.status = "complete";
 					return;
 				}
-				await Zt(a, this.state, {
+				await Qt(a, this.state, {
 					cycleId: o,
 					feedKey: a.feedKey,
 					items: u.slice(l.length),
@@ -3531,30 +3590,15 @@ var Jn = class {
 					received: d,
 					signal: i.signal,
 					total: this.state.total
-				}, () => r === this.requestVersion), this.syncAutofillCountdown();
+				}, () => r === this.requestVersion), this.autofillController.syncCountdown();
 			}
 		} catch (e) {
 			if (i.signal.aborted || r !== this.requestVersion) return;
 			a && (this.state.autofill.error = e, this.state.autofill.status = "error"), s || (t ? this.state.nextPageError = e : this.state.error = e);
 		} finally {
-			r === this.requestVersion && (this.abortController = null, this.state.isLoading = !1, this.state.isLoadingMore = !1);
+			r === this.requestVersion && (this.autofillController.clearCollection(), this.abortController = null, this.state.isLoading = !1, this.state.isLoadingMore = !1);
 		}
 	}
-	beginAutofillCycle() {
-		let e = this.options.autofill;
-		if (!e) return "";
-		this.autofillDelayCountdown.clear();
-		let t = `vibe-autofill-${Date.now().toString(36)}-${++this.autofillCycle}`;
-		return this.state.autofill = {
-			...Bt(e, void 0, !1),
-			cycleId: t,
-			status: "filling"
-		}, t;
-	}
-	syncAutofillCountdown() {
-		let e = this.state.autofill;
-		this.autofillDelayCountdown.sync(e.strategy === "backend" && e.status === "waiting" ? e.nextRequestAt : null);
-	}
 	startRequest(e, t) {
 		let n = this.fetchPage(e, t);
 		return this.pendingRequest = n, n.finally(() => {
@@ -3562,11 +3606,12 @@ var Jn = class {
 		});
 	}
 	startInitialAutofill() {
-		let e = ++this.requestVersion, t = new AbortController(), n = this.beginAutofillCycle();
+		let e = ++this.requestVersion, t = new AbortController(), n = this.autofillController.beginCycle();
 		this.abortController = t, this.state.isLoadingMore = !0;
-		let r = tn({
+		let r = nn({
 			cycleId: n,
 			isCurrent: () => e === this.requestVersion,
+			onCollection: (t) => this.autofillController.captureCollection(t, e === this.requestVersion),
 			onLastCursor: (e) => {
 				this.lastLoadedCursor = e;
 			},
@@ -3576,20 +3621,20 @@ var Jn = class {
 		}).catch((n) => {
 			t.signal.aborted || e !== this.requestVersion || (this.state.autofill.error = n, this.state.autofill.status = "error", this.state.nextPageError = n);
 		}).finally(() => {
-			e === this.requestVersion && (this.syncAutofillCountdown(), this.abortController = null, this.state.isLoadingMore = !1, this.pendingRequest === r && (this.pendingRequest = null));
+			e === this.requestVersion && (this.autofillController.clearCollection(), this.autofillController.syncCountdown(), this.abortController = null, this.state.isLoadingMore = !1, this.pendingRequest === r && (this.pendingRequest = null));
 		});
 		return this.pendingRequest = r, r;
 	}
 	startStateNotifications() {
 		let e = this.options.onStateChange;
-		!e || this.stopStateWatcher || (e(this.getState()), this.stopStateWatcher = D(this.state, () => e(this.getState()), {
+		!e || this.stopStateWatcher || (e(this.getState()), this.stopStateWatcher = O(this.state, () => e(this.getState()), {
 			deep: !0,
 			flush: "post"
 		}));
 	}
 };
-function Zn(e) {
-	return new Xn(e);
+function Qn(e) {
+	return new Zn(e);
 }
 //#endregion
-export { Zn as createVibe };
+export { Qn as createVibe };