@wyxos/vibe 5.5.0 → 5.5.2

package/lib/index.js

@@ -3031,37 +3031,42 @@ var Mn = class {
 		let t = jn(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.");
+	async start(e, t = {}) {
+		let n = this.options.fill;
+		if (!n) throw Error("Vibe fill is not configured.");
 		if (this.isActive()) throw Error("Vibe fill is already active.");
-		let n = bn(e), r = `vibe-fill-${Date.now().toString(36)}-${++this.cycle}`;
+		let r = bn(e), i = bn(t.target ?? r), a = t.progressOffset ?? {
+			completedPages: 0,
+			received: 0
+		}, o = t.cycleId ?? `vibe-fill-${Date.now().toString(36)}-${++this.cycle}`;
 		if (this.options.state.fill = {
-			...Sn(t, void 0, !1),
-			cycleId: r,
+			...Sn(n, void 0, !1),
+			completedPages: a.completedPages,
+			cycleId: o,
+			received: a.received,
 			status: "filling",
-			target: n
-		}, this.options.state.next === null) {
-			this.options.state.fill.status = "pages" in n ? "exhausted" : "complete";
+			target: i
+		}, n.strategy === "backend" && this.options.state.next === null) {
+			this.options.state.fill.status = "pages" in r ? "exhausted" : "complete";
 			return;
 		}
-		let i = ++this.requestVersion, a = new AbortController();
-		this.abortController = a;
+		let s = ++this.requestVersion, c = new AbortController();
+		this.abortController = c;
 		try {
-			t.strategy === "frontend" ? await this.startFrontend(t, n, a, i) : (await Tn(t, this.options.state, {
-				cycleId: r,
-				feedKey: t.feedKey,
+			n.strategy === "frontend" ? await this.startFrontend(n, r, c, s, t.prepareFrontend !== !1, a) : (await Tn(n, this.options.state, {
+				cycleId: o,
+				feedKey: n.feedKey,
 				items: [...this.options.state.items],
 				next: this.options.state.next,
-				signal: a.signal,
-				target: n,
+				signal: c.signal,
+				target: r,
 				total: this.options.state.total
-			}, () => this.isCurrent(i)), this.syncBackendCountdown());
+			}, () => this.isCurrent(s)), this.syncBackendCountdown());
 		} catch (e) {
-			if (a.signal.aborted || !this.isCurrent(i)) return;
+			if (c.signal.aborted || !this.isCurrent(s)) return;
 			throw this.options.state.fill.error = e, this.options.state.fill.status = "error", e;
 		} finally {
-			this.isCurrent(i) && (this.abortController = null, this.options.state.isLoadingMore = !1);
+			this.isCurrent(s) && (this.abortController = null, this.options.state.isLoadingMore = !1);
 		}
 	}
 	async cancel() {
@@ -3079,6 +3084,22 @@ var Mn = class {
 			throw t.fill.error = e, t.fill.status = "error", e;
 		}
 	}
+	resume(e) {
+		let { fill: t } = this.options.state;
+		if (t.status !== "paused" || !t.target) return Promise.resolve();
+		let n = t.target, r = "pages" in n ? n.pages - t.completedPages : null;
+		if (r !== null && r <= 0) return t.status = "complete", Promise.resolve();
+		let i = r === null ? { until: "end" } : { pages: r };
+		return t.strategy === "backend" ? this.start(i) : this.start(i, {
+			cycleId: t.cycleId ?? void 0,
+			prepareFrontend: e,
+			progressOffset: {
+				completedPages: t.completedPages,
+				received: t.received
+			},
+			target: n
+		});
+	}
 	reset() {
 		this.abortLocalRequest(), this.delayCountdown.clear(), this.options.state.fill = Sn(this.options.fill, void 0, !1), this.collection = null;
 	}
@@ -3091,33 +3112,60 @@ var Mn = class {
 	isCurrent(e) {
 		return e === this.requestVersion && !["cancelled", "cancelling"].includes(this.options.state.fill.status);
 	}
-	async startFrontend(e, t, n, r) {
-		let i = this.options.loadPage;
-		if (!i) throw Error("Vibe frontend fill requires loadPage.");
-		let a = this.options.state;
-		a.isLoadingMore = !0;
-		let o = await wn({
-			existingItems: a.items,
-			initialCursor: a.next,
-			loadPage: i,
+	async startFrontend(e, t, n, r, i, a) {
+		let o = this.options.loadPage;
+		if (!o) throw Error("Vibe frontend fill requires loadPage.");
+		let s = this.options.state;
+		if (s.isLoadingMore = !0, i && this.options.prepareFrontend && (this.options.needsFrontendPreparation?.() ?? !0)) {
+			s.fill.status = "restoring";
+			let e = await this.options.prepareFrontend({
+				isCurrent: () => this.isCurrent(r),
+				onDelayChange: (e) => {
+					this.isCurrent(r) && Object.assign(s.fill, e);
+				},
+				signal: n.signal
+			});
+			if (!this.isCurrent(r)) return;
+			if (e === "paused" || s.loadMoreLocked) {
+				s.fill.status = "paused";
+				return;
+			}
+			s.fill.status = "filling";
+		}
+		if (s.next === null) {
+			s.fill.status = "pages" in t ? "exhausted" : "complete";
+			return;
+		}
+		let c = await wn({
+			existingItems: s.items,
+			initialCursor: s.next,
+			loadPage: o,
 			onCollection: (e) => {
-				this.isCurrent(r) && (this.collection = e);
+				this.isCurrent(r) && (this.collection = {
+					...e,
+					completedPages: a.completedPages + e.completedPages,
+					received: a.received + e.received
+				});
 			},
 			onDelayChange: (e) => {
-				this.isCurrent(r) && Object.assign(a.fill, e);
+				this.isCurrent(r) && Object.assign(s.fill, e);
 			},
 			onProgress: (e) => {
-				this.isCurrent(r) && Object.assign(a.fill, e);
+				this.isCurrent(r) && Object.assign(s.fill, {
+					...e,
+					completedPages: a.completedPages + e.completedPages,
+					received: a.received + e.received
+				});
 			},
 			options: e,
-			shouldPause: () => a.loadMoreLocked,
+			shouldPause: () => s.loadMoreLocked,
 			signal: n.signal,
 			target: t
 		});
-		this.isCurrent(r) && (a.items = Z(a.items, o.items), a.next = o.next, o.total !== void 0 && (a.total = o.total), this.options.onLastCursor(o.lastCursor), this.options.onPages(o.pages), Object.assign(a.fill, {
-			completedPages: o.completedPages,
-			received: o.received,
-			status: o.status
+		this.isCurrent(r) && (s.items = Z(s.items, c.items), s.next = c.next, c.total !== void 0 && (s.total = c.total), this.options.onLastCursor(c.lastCursor), this.options.onPages(c.pages), Object.assign(s.fill, {
+			completedPages: a.completedPages + c.completedPages,
+			received: a.received + c.received,
+			status: c.status
 		}), this.collection = null);
 	}
 	commitCollection() {
@@ -3135,8 +3183,21 @@ var Mn = class {
 	}
 };
 //#endregion
+//#region src/core/fillReconciliation.ts
+async function Nn({ controller: e, isCurrent: t, loadPage: n, onDelayChange: r, setLastCursor: i, signal: a, state: o }) {
+	if (!e.needsReconciliation(o.items)) return "skipped";
+	let s = await e.reconcile({
+		existingItems: o.items,
+		loadPage: n,
+		onDelayChange: r,
+		shouldPause: () => o.loadMoreLocked,
+		signal: a
+	});
+	return t() ? (o.items = Z(o.items, s.items), o.next = s.next, i(s.lastCursor), s.total !== void 0 && (o.total = s.total), e.completeReconciliation(s), s.status) : s.status;
+}
+//#endregion
 //#region src/core/feedFooter.ts
-function Nn(e) {
+function Pn(e) {
 	return {
 		cancelAutofill: () => e.cancelAutofill(),
 		loadMore: () => e.loadNext(),
@@ -3144,38 +3205,38 @@ function Nn(e) {
 		retryEnd: () => e.retryEnd()
 	};
 }
-function Pn(e) {
-	if (!Number.isFinite(e) || e <= 0) throw TypeError("Vibe reelAutoAdvance.intervalMs must be a positive number.");
-}
 function Fn(e) {
-	e?.intervalMs !== void 0 && Pn(e.intervalMs);
+	if (!Number.isFinite(e) || e <= 0) throw TypeError("Vibe reelAutoAdvance.intervalMs must be a positive number.");
 }
 function In(e) {
+	e?.intervalMs !== void 0 && Fn(e.intervalMs);
+}
+function Ln(e) {
 	return {
 		enabled: e?.enabled ?? !1,
 		includePostItems: e?.includePostItems ?? !1,
 		intervalMs: e?.intervalMs ?? 5e3
 	};
 }
-function Ln(e, t) {
+function Rn(e, t) {
 	if (typeof t == "boolean") {
 		e.enabled = t;
 		return;
 	}
-	Fn(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);
+	In(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 Rn(e) {
+function zn(e) {
 	return { enabled: e?.enabled ?? !1 };
 }
-function zn(e, t, n) {
+function Bn(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 Bn(e, t) {
+function Vn(e, t) {
 	let n = e.initialPage;
 	return {
 		activeReelPostId: null,
@@ -3193,14 +3254,14 @@ function Bn(e, t) {
 		next: n?.next ?? null,
 		nextPageError: null,
 		phoneMode: !1,
-		reelAutoAdvance: In(e.reelAutoAdvance),
+		reelAutoAdvance: Ln(e.reelAutoAdvance),
 		reelForward: {
 			error: null,
 			status: "idle"
 		},
 		reelForwardIndex: null,
 		reelForwardItem: null,
-		reelInfoSheet: Rn(e.reelInfoSheet),
+		reelInfoSheet: zn(e.reelInfoSheet),
 		reelInfoSheetOverlay: !1,
 		reelMediaSource: "original",
 		reelOrigin: null,
@@ -3209,20 +3270,20 @@ function Bn(e, t) {
 }
 //#endregion
 //#region src/core/options.ts
-function Vn(e, t) {
+function Hn(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 Hn(e, t) {
+function Un(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 Un(e) {
-	if (un(e.autoScroll), Vn("cardHeader", e.cardHeader), Vn("cardFooter", e.cardFooter), Hn("header", e.mediaCard?.header), Hn("footer", e.mediaCard?.footer), $t(e.autofill), xn(e.fill), J(e.masonry), Fn(e.reelAutoAdvance), e.removalReconciliation) {
+function Wn(e) {
+	if (un(e.autoScroll), Hn("cardHeader", e.cardHeader), Hn("cardFooter", e.cardFooter), Un("header", e.mediaCard?.header), Un("footer", e.mediaCard?.footer), $t(e.autofill), xn(e.fill), J(e.masonry), In(e.reelAutoAdvance), e.removalReconciliation) {
 		if (!Number.isInteger(e.removalReconciliation.pageSize) || e.removalReconciliation.pageSize <= 0) throw TypeError("Vibe removalReconciliation pageSize must be a positive integer.");
 		let t = e.removalReconciliation.maxReplayPages ?? 5;
 		if (!Number.isInteger(t) || t <= 0) throw TypeError("Vibe removalReconciliation maxReplayPages must be a positive integer.");
@@ -3236,7 +3297,7 @@ function Un(e) {
 	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 Wn(e) {
+function Gn(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);
@@ -3245,7 +3306,7 @@ function Wn(e) {
 }
 //#endregion
 //#region src/core/pageRequest.ts
-async function Gn({ append: e, autofillController: t, cursor: n, isCurrent: r, loadPage: i, onLastCursor: a, onPages: o, options: s, signal: c, state: l }) {
+async function Kn({ append: e, autofillController: t, cursor: n, isCurrent: r, loadPage: i, onLastCursor: a, onPages: o, options: s, signal: c, state: l }) {
 	let u = s.autofill, d = e && u?.strategy === "frontend" && l.autofill.status === "paused", f = d ? {
 		received: l.autofill.received,
 		requests: l.autofill.requests
@@ -3328,13 +3389,13 @@ async function Gn({ append: e, autofillController: t, cursor: n, isCurrent: r, l
 function $(e) {
 	return `${typeof e}:${String(e)}`;
 }
-function Kn(e) {
+function qn(e) {
 	return `${typeof e}:${String(e)}`;
 }
-function qn(e) {
+function Jn(e) {
 	return e.map(({ postId: e }) => e);
 }
-var Jn = class {
+var Yn = class {
 	delay;
 	enabled;
 	maxReplayPages;
@@ -3373,33 +3434,33 @@ var Jn = class {
 	restore(e) {
 		this.enabled && e.forEach((e) => this.tombstones.delete($(e)));
 	}
-	async reconcile({ existingItems: e, loadPage: t, shouldPause: n = () => !1, signal: r }) {
-		let i = this.pending ?? this.createSession(e);
-		for (this.pending = i; i.remainingRequests > 0;) {
-			let e = Kn(i.cursor);
-			if (i.seenCursors.has(e)) throw Error("Vibe removal reconciliation received a repeated cursor.");
+	async reconcile({ existingItems: e, loadPage: t, onDelayChange: n = () => void 0, shouldPause: r = () => !1, signal: i }) {
+		let a = this.pending ?? this.createSession(e);
+		for (this.pending = a; a.remainingRequests > 0;) {
+			let e = qn(a.cursor);
+			if (a.seenCursors.has(e)) throw Error("Vibe removal reconciliation received a repeated cursor.");
 			if (await Jt({
-				delayMs: qt(i.pages.length, this.delay),
-				onChange: () => void 0,
-				signal: r
-			}), i.pages.length > 0 && n()) return this.result(i, "paused");
-			let a = Bt(await t({
-				cursor: i.cursor,
-				signal: r
+				delayMs: qt(a.pages.length, this.delay),
+				onChange: n,
+				signal: i
+			}), a.pages.length > 0 && r()) return this.result(a, "paused");
+			let o = Bt(await t({
+				cursor: a.cursor,
+				signal: i
 			}));
-			i.seenCursors.add(e);
-			let o = this.filterItems(a.items), s = [];
-			if (o.forEach((e) => {
+			a.seenCursors.add(e);
+			let s = this.filterItems(o.items), c = [];
+			if (s.forEach((e) => {
 				let t = $(e.postId);
-				i.attributed.has(t) || (i.attributed.add(t), s.push(e.postId)), i.appended.has(t) || (i.appended.add(t), i.items.push(e));
-			}), i.pages.push({
-				contributionIds: s,
-				cursor: i.cursor,
-				next: a.next,
-				returnedIds: qn(o)
-			}), i.lastCursor = i.cursor, i.next = a.next, --i.remainingRequests, a.total !== void 0 && (i.total = a.total), i.next === null ? i.remainingRequests = 0 : i.cursor = i.next, i.remainingRequests > 0 && n()) return this.result(i, "paused");
+				a.attributed.has(t) || (a.attributed.add(t), c.push(e.postId)), a.appended.has(t) || (a.appended.add(t), a.items.push(e));
+			}), a.pages.push({
+				contributionIds: c,
+				cursor: a.cursor,
+				next: o.next,
+				returnedIds: Jn(s)
+			}), a.lastCursor = a.cursor, a.next = o.next, --a.remainingRequests, o.total !== void 0 && (a.total = o.total), a.next === null ? a.remainingRequests = 0 : a.cursor = a.next, a.remainingRequests > 0 && r()) return this.result(a, "paused");
 		}
-		return this.result(i, "complete");
+		return this.result(a, "complete");
 	}
 	createSession(e) {
 		let t = this.findUnderfilledPage(e), n = t < 0 ? [] : this.pages.slice(t), r = n[0];
@@ -3435,7 +3496,7 @@ var Jn = class {
 		return this.pages.findIndex(({ contributionIds: e }) => e.filter((e) => t.has($(e))).length < this.pageSize);
 	}
 	recordPage(e) {
-		let t = Kn(e.cursor), n = this.pages.findIndex(({ cursor: e }) => Kn(e) === t);
+		let t = qn(e.cursor), n = this.pages.findIndex(({ cursor: e }) => qn(e) === t);
 		n >= 0 && (this.pages = this.pages.slice(0, n)), this.pages.push({
 			...e,
 			contributionIds: [...e.contributionIds],
@@ -3445,7 +3506,7 @@ var Jn = class {
 };
 //#endregion
 //#region src/core/activeItemRemoval.ts
-function Yn(e, t, n, r, i) {
+function Xn(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)];
@@ -3458,7 +3519,7 @@ function Yn(e, t, n, r, i) {
 }
 //#endregion
 //#region src/core/exactMediaRemovalController.ts
-function Xn(e, t) {
+function Zn(e, t) {
 	let [n, ...r] = t;
 	if (!n) throw Error("Vibe items must contain at least one media asset.");
 	return {
@@ -3467,10 +3528,10 @@ function Xn(e, t) {
 		items: r
 	};
 }
-function Zn(e) {
+function Qn(e) {
 	if (!Number.isInteger(e.mediaIndex) || e.mediaIndex < 0) throw TypeError("Vibe mediaIndex must be a non-negative integer.");
 }
-var Qn = class {
+var $n = class {
 	generation = 0;
 	metadata = /* @__PURE__ */ new WeakMap();
 	state;
@@ -3478,7 +3539,7 @@ var Qn = class {
 		this.options = e, this.state = e.state;
 	}
 	remove(e) {
-		Zn(e);
+		Qn(e);
 		let t = this.state.items.findIndex(({ postId: t }) => t === e.postId), n = this.state.items[t];
 		if (!n) return null;
 		let r = [...M(n)], i = r[e.mediaIndex];
@@ -3495,7 +3556,7 @@ var Qn = 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] = Xn(n, r), this.updateMediaIndexAfterRemoval(n.postId, e.mediaIndex, c), a) : (this.state.items.splice(t, 1), this.options.onPostRemoved(n.postId), 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] = Zn(n, r), this.updateMediaIndexAfterRemoval(n.postId, e.mediaIndex, c), a) : (this.state.items.splice(t, 1), this.options.onPostRemoved(n.postId), this.state.mediaIndices.delete(n.postId), s && this.advanceFromRemovedPost(a, n), a);
 	}
 	reset() {
 		this.generation += 1;
@@ -3521,7 +3582,7 @@ var Qn = class {
 	}
 	restoreIntoPost(e, t) {
 		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] = Xn(n, r), this.state.activeReelPostId !== t.postId) return;
+		if (r.splice(i, 0, t.media), this.state.items[e] = Zn(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);
 	}
@@ -3534,18 +3595,18 @@ var Qn = class {
 };
 //#endregion
 //#region src/core/itemPlacement.ts
-function $n(e, t) {
+function er(e, t) {
 	let n = new Set(t);
 	return e.flatMap((e, t) => n.has(e.postId) ? [{
 		index: t,
 		item: e
 	}] : []);
 }
-function er(e, t) {
+function tr(e, t) {
 	let n = new Set(t.map(({ item: e }) => e.postId));
 	return e.filter((e) => !n.has(e.postId));
 }
-function tr(e, t) {
+function nr(e, t) {
 	t.forEach(({ index: e }) => {
 		if (!Number.isInteger(e) || e < 0) throw Error("Vibe item restore indexes must be non-negative integers.");
 	});
@@ -3556,7 +3617,7 @@ function tr(e, t) {
 }
 //#endregion
 //#region src/core/itemRemovalController.ts
-var nr = 20, rr = class {
+var rr = 20, ir = class {
 	generation = 0;
 	historyLimit;
 	metadata = /* @__PURE__ */ new WeakMap();
@@ -3565,7 +3626,7 @@ var nr = 20, rr = class {
 	itemOrder;
 	stopItemsWatcher;
 	constructor(e) {
-		this.options = e, this.historyLimit = e.historyLimit ?? nr, 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" });
+		this.options = e, this.historyLimit = e.historyLimit ?? rr, 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();
@@ -3579,7 +3640,7 @@ var nr = 20, rr = class {
 		let a = this.options.startRemoval(i, t);
 		if (a > 0 && await new Promise((e) => setTimeout(e, a)), this.metadata.get(r)?.generation !== this.generation) return r;
 		let o = this.state.items.findIndex((e) => e.postId === this.state.activeReelPostId), s = new Set(n.map(({ item: e }) => e.postId)), c = o < 0 ? 0 : this.state.items.slice(0, o).filter(({ postId: e }) => s.has(e)).length, l = Math.max(o - c, 0);
-		return this.state.items = er(this.state.items, n), this.options.onItemsRemoved(r, n, l), this.record(r), r;
+		return this.state.items = tr(this.state.items, n), this.options.onItemsRemoved(r, n, l), this.record(r), r;
 	}
 	reset() {
 		this.generation += 1, this.history = [], this.itemOrder = [];
@@ -3590,8 +3651,8 @@ var nr = 20, rr = class {
 			this.restoreRemoval(t);
 			return;
 		}
-		let n = tr(this.state.items, e);
-		this.registerExternalPlacements(e), this.state.items = n;
+		let n = new Set(this.state.items.map(({ postId: e }) => e)), r = e.filter(({ item: e }) => n.has(e.postId) ? !1 : (n.add(e.postId), !0)), i = nr(this.state.items, r);
+		this.registerExternalPlacements(r), this.state.items = i, r.length > 0 && this.options.onRemovalRestored(r);
 	}
 	restoreRemoval(e) {
 		let t = this.metadata.get(e);
@@ -3616,7 +3677,7 @@ var nr = 20, rr = class {
 	}
 	collectOrderedPlacements(e) {
 		let t = new Map(this.itemOrder.map((e, t) => [e, t]));
-		return $n(this.state.items, e).map((e) => ({
+		return er(this.state.items, e).map((e) => ({
 			index: t.get(e.item.postId) ?? e.index,
 			item: e.item
 		}));
@@ -3647,7 +3708,7 @@ var nr = 20, rr = 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;
 	}
-}, ir = class {
+}, ar = class {
 	forward = null;
 	forwardPromise = null;
 	forwardVersion = 0;
@@ -3725,7 +3786,7 @@ var nr = 20, rr = class {
 			}
 		}
 	}
-}, ar = class {
+}, or = class {
 	generation = 0;
 	pending = Promise.resolve();
 	constructor(e) {
@@ -3775,24 +3836,24 @@ var nr = 20, rr = class {
 };
 //#endregion
 //#region src/core/removalControllers.ts
-function or(e) {
-	let t = new ir(e), n = new ar({
+function sr(e) {
+	let t = new ar(e), n = new or({
 		state: e.state,
 		transitionMedia: (t) => e.surface()?.transitionActiveReelMedia(t) ?? Promise.resolve(!1),
 		transitionPost: (t) => e.surface()?.transitionActiveReelPost(t) ?? Promise.resolve(!1)
 	});
 	return {
-		exactMediaRemoval: new Qn({
+		exactMediaRemoval: new $n({
 			onActivate: e.onActivate,
 			onPostRemoved: (t) => e.onItemsRemoved([t]),
 			onPostRestored: (t) => e.onItemsRestored([t]),
 			reelForward: t,
 			state: e.state
 		}),
-		itemRemoval: new rr({
+		itemRemoval: new ir({
 			historyLimit: e.historyLimit,
 			onItemsRemoved: (n, r, i) => {
-				e.onItemsRemoved(r.map(({ item: e }) => e.postId)), Yn(e.state, r, i, e.onActivate, (e, r) => t.start(n, e, r));
+				e.onItemsRemoved(r.map(({ item: e }) => e.postId)), Xn(e.state, r, i, e.onActivate, (e, r) => t.start(n, e, r));
 			},
 			onRemovalRestored: (n) => {
 				e.onItemsRestored(n.map(({ item: e }) => e.postId));
@@ -3807,17 +3868,17 @@ function or(e) {
 		reelRemoval: n
 	};
 }
-var sr = 1.5;
-function cr(e) {
+var cr = 1.5;
+function lr(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 * sr;
+	let n = Math.min(e.viewportWidth, e.viewportHeight), r = t >= n * cr;
 	return !e.hasHover && n > 0 && n < 600 && r;
 }
-function lr(e) {
-	return cr(e) ? "reel" : "masonry";
-}
 function ur(e) {
+	return lr(e) ? "reel" : "masonry";
+}
+function dr(e) {
 	let t = e.ownerDocument.defaultView, n = e.ownerDocument.documentElement;
 	return {
 		hasHover: typeof t?.matchMedia == "function" && t.matchMedia("(hover: hover)").matches,
@@ -3827,15 +3888,15 @@ function ur(e) {
 		viewportWidth: n.clientWidth
 	};
 }
-function dr(e) {
-	return cr(ur(e));
-}
 function fr(e) {
-	return lr(ur(e));
+	return lr(dr(e));
+}
+function pr(e) {
+	return ur(dr(e));
 }
 //#endregion
 //#region src/core/responsiveLayoutController.ts
-var pr = class {
+var mr = class {
 	layoutMode;
 	resizeObserver = null;
 	target = null;
@@ -3860,10 +3921,10 @@ var pr = class {
 	}
 	handleResponsiveLayout = () => {
 		if (!this.target) return;
-		let e = fr(this.target);
-		this.state.phoneMode = dr(this.target), this.state.reelInfoSheetOverlay = this.state.phoneMode, this.state.reelMediaSource = e === "reel" ? "preview" : "original", this.layoutMode === "responsive" && this.applyLayout(e);
+		let e = pr(this.target);
+		this.state.phoneMode = fr(this.target), this.state.reelInfoSheetOverlay = this.state.phoneMode, this.state.reelMediaSource = e === "reel" ? "preview" : "original", this.layoutMode === "responsive" && this.applyLayout(e);
 	};
-}, mr = class {
+}, hr = class {
 	routedReelPostId = null;
 	reelRouteIsActive = !1;
 	constructor(e, t) {
@@ -3890,7 +3951,7 @@ var pr = class {
 		let i = this.reelRouteIsActive ? "replace" : "push";
 		this.reelRouteIsActive = !0, this.routedReelPostId = e, this.options.router[i](r);
 	}
-}, hr = class {
+}, gr = class {
 	app = null;
 	autoScroll;
 	autofillController;
@@ -3911,9 +3972,9 @@ var pr = class {
 	notificationItems;
 	state;
 	constructor(e) {
-		this.options = e, Un(e);
+		this.options = e, Wn(e);
 		let t = e.layout ?? "masonry";
-		this.state = x(Bn(e, t)), this.notificationItems = I(this.state), this.autoScroll = new fn({
+		this.state = x(Vn(e, t)), this.notificationItems = I(this.state), this.autoScroll = new fn({
 			getScrollElement: () => this.surface?.getAutoScrollElement() ?? null,
 			state: this.state.autoScroll
 		}), this.autofillController = new on({
@@ -3924,16 +3985,28 @@ var pr = class {
 			onPages: (e) => this.removalReconciliation.recordPages(e),
 			options: e.autofill,
 			state: this.state
-		}), this.removalReconciliation = new Jn(e), this.fillController = new Mn({
+		}), this.removalReconciliation = new Yn(e), this.fillController = new Mn({
 			fill: e.fill,
 			loadPage: e.loadPage ? (e) => this.loadFilteredPage(e) : void 0,
+			needsFrontendPreparation: () => this.removalReconciliation.needsReconciliation(this.state.items),
 			onLastCursor: (e) => {
 				this.lastLoadedCursor = e;
 			},
 			onPages: (e) => this.removalReconciliation.recordPages(e),
+			prepareFrontend: ({ isCurrent: t, onDelayChange: n, signal: r }) => Nn({
+				controller: this.removalReconciliation,
+				isCurrent: t,
+				loadPage: e.loadPage,
+				onDelayChange: n,
+				setLastCursor: (e) => {
+					this.lastLoadedCursor = e;
+				},
+				signal: r,
+				state: this.state
+			}),
 			state: this.state
-		}), this.routing = new mr(e.routing, this.state);
-		let n = or({
+		}), this.routing = new hr(e.routing, this.state);
+		let n = sr({
 			historyLimit: e.removalHistoryLimit,
 			loadNext: () => this.loadNext(),
 			onActivate: (e) => this.setActiveReelPost(e),
@@ -3943,20 +4016,20 @@ var pr = 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 pr(t, this.state, () => {
+		this.exactMediaRemoval = n.exactMediaRemoval, this.itemRemoval = n.itemRemoval, this.reelForward = n.reelForward, this.reelRemoval = n.reelRemoval, this.responsiveLayout = new mr(t, this.state, () => {
 			this.routing.syncFeed();
 		}), this.startStateNotifications();
 	}
 	async mount() {
 		if (this.app) throw Error("Vibe is already mounted.");
 		this.startStateNotifications();
-		let e = Wn(this.options.target);
+		let e = Gn(this.options.target);
 		this.responsiveLayout.mount(e), this.app = i(zt, {
 			canRetryEnd: !!this.options.loadPage,
 			cardFooter: this.options.cardFooter,
 			cardHeader: this.options.cardHeader,
 			feedFooter: this.options.feedFooter,
-			feedFooterActions: Nn(this),
+			feedFooterActions: Pn(this),
 			mediaCard: this.options.mediaCard,
 			masonry: this.options.masonry,
 			onMediaReady: this.options.onMediaReady,
@@ -4112,13 +4185,18 @@ var pr = class {
 		let t = ++this.requestVersion, n = new AbortController();
 		this.abortController = n;
 		try {
-			let r = await this.removalReconciliation.reconcile({
-				existingItems: this.state.items,
+			let r = await Nn({
+				controller: this.removalReconciliation,
+				isCurrent: () => t === this.requestVersion,
 				loadPage: e,
-				shouldPause: () => this.state.loadMoreLocked,
-				signal: n.signal
+				onDelayChange: () => void 0,
+				setLastCursor: (e) => {
+					this.lastLoadedCursor = e;
+				},
+				signal: n.signal,
+				state: this.state
 			});
-			return t === this.requestVersion ? (this.state.items = Z(this.state.items, r.items), this.state.next = r.next, this.lastLoadedCursor = r.lastCursor, r.total !== void 0 && (this.state.total = r.total), this.removalReconciliation.completeReconciliation(r), r.status === "complete") : !1;
+			return t === this.requestVersion && r === "complete";
 		} catch (e) {
 			return !n.signal.aborted && t === this.requestVersion && (this.state.nextPageError = e), !1;
 		} finally {
@@ -4134,13 +4212,9 @@ var pr = class {
 	}
 	setLoadMoreLocked(e) {
 		if (this.state.loadMoreLocked !== e && (this.state.loadMoreLocked = e, !e)) {
-			let e = this.state.fill.status === "paused" ? this.state.fill.target : null;
-			if (e) {
-				let t = "pages" in e ? e.pages - this.state.fill.completedPages : null;
-				if (t === null || t > 0) {
-					this.fillController.start(t === null ? { until: "end" } : { pages: t });
-					return;
-				}
+			if (this.state.fill.status === "paused" && this.state.fill.target) {
+				this.fillController.resume(this.removalReconciliation.hasPendingSession());
+				return;
 			}
 			if (this.state.autofill.status === "paused" || this.removalReconciliation.hasPendingSession()) {
 				let e = this.pendingRequest;
@@ -4155,10 +4229,10 @@ var pr = class {
 		this.state.total = e;
 	}
 	setReelAutoAdvance(e) {
-		Ln(this.state.reelAutoAdvance, e);
+		Rn(this.state.reelAutoAdvance, e);
 	}
 	setReelInfoSheet(e) {
-		zn(this.state.reelInfoSheet, this.options.reelInfoSheet, e);
+		Bn(this.state.reelInfoSheet, this.options.reelInfoSheet, e);
 	}
 	setLayout(e) {
 		this.responsiveLayout.setLayout(e);
@@ -4178,7 +4252,7 @@ var pr = class {
 	async fetchPage(e, t) {
 		if (!this.options.loadPage) return;
 		let n = ++this.requestVersion, r = new AbortController();
-		this.abortController = r, await Gn({
+		this.abortController = r, await Kn({
 			append: t,
 			autofillController: this.autofillController,
 			cursor: e,
@@ -4228,8 +4302,8 @@ var pr = class {
 		}));
 	}
 };
-function gr(e) {
-	return new hr(e);
+function _r(e) {
+	return new gr(e);
 }
 //#endregion
-export { gr as createVibe };
+export { _r as createVibe };