@zinejs/core 0.1.0

package/dist/index.js

@@ -0,0 +1,828 @@
+//#region src/engine/spread.ts
+function e(e, t = {}) {
+	let { direction: n = "ltr", cover: r = !1, singlePage: i = !1 } = t;
+	if (e <= 0) return [];
+	let a = (t) => t >= 0 && t < e ? t : null, o = [];
+	if (i) for (let t = 0; t < e; t++) o.push({
+		left: null,
+		right: t
+	});
+	else if (r) {
+		o.push({
+			left: null,
+			right: 0
+		});
+		for (let t = 1; t < e; t += 2) o.push({
+			left: a(t),
+			right: a(t + 1)
+		});
+	} else for (let t = 0; t < e; t += 2) o.push({
+		left: a(t),
+		right: a(t + 1)
+	});
+	return n === "rtl" ? o.map((e) => ({
+		left: e.right,
+		right: e.left
+	})) : o;
+}
+function t(e, t) {
+	return e < t;
+}
+//#endregion
+//#region src/engine/virtualizer.ts
+function n(e, t, n) {
+	let r = [], i = Math.max(0, e - n), a = Math.min(t - 1, e + n);
+	for (let e = i; e <= a; e++) r.push(e);
+	return r;
+}
+var r = class {
+	#e;
+	#t = /* @__PURE__ */ new Set();
+	constructor(e = 2) {
+		this.#e = e;
+	}
+	get mounted() {
+		return [...this.#t].sort((e, t) => e - t);
+	}
+	update(e, t) {
+		let r = new Set(n(e, t, this.#e)), i = [...r].filter((e) => !this.#t.has(e)).sort((e, t) => e - t), a = [...this.#t].filter((e) => !r.has(e)).sort((e, t) => e - t);
+		for (let e of a) this.#t.delete(e);
+		for (let e of i) this.#t.add(e);
+		return {
+			toMount: i,
+			toEvict: a
+		};
+	}
+}, i = class {
+	#e = /* @__PURE__ */ new Map();
+	on(e, t) {
+		let n = this.#e.get(e);
+		return n || (n = /* @__PURE__ */ new Set(), this.#e.set(e, n)), n.add(t), () => this.off(e, t);
+	}
+	off(e, t) {
+		this.#e.get(e)?.delete(t);
+	}
+	emit(e, ...t) {
+		let n = t[0], r = this.#e.get(e);
+		if (r) for (let e of [...r]) e(n);
+	}
+	clear() {
+		this.#e.clear();
+	}
+}, a = {
+	idle: {
+		grab: "dragging",
+		panStart: "zoomed-panning",
+		flip: "animating"
+	},
+	dragging: { release: "animating" },
+	animating: { settle: "idle" },
+	"zoomed-panning": { panEnd: "idle" }
+};
+function o(e, t) {
+	return a[e][t] ?? null;
+}
+var s = class {
+	#e;
+	constructor(e = "idle") {
+		this.#e = e;
+	}
+	get state() {
+		return this.#e;
+	}
+	send(e) {
+		let t = o(this.#e, e);
+		return t !== null && (this.#e = t), t;
+	}
+}, c = .3, l = class {
+	#e;
+	#t = null;
+	#n = null;
+	#r = null;
+	#i = null;
+	constructor(e = {}) {
+		this.#e = e;
+	}
+	get active() {
+		return this.#t !== null;
+	}
+	down(e, t, n, r) {
+		if (this.#t !== null) return;
+		this.#t = e;
+		let i = {
+			x: t,
+			y: n,
+			t: r
+		};
+		this.#n = i, this.#r = i, this.#i = i, this.#e.onStart?.({
+			x: t,
+			y: n,
+			t: r
+		});
+	}
+	move(e, t, n, r) {
+		e !== this.#t || this.#n === null || (this.#r = this.#i, this.#i = {
+			x: t,
+			y: n,
+			t: r
+		}, this.#e.onMove?.({
+			x: t,
+			y: n,
+			dx: t - this.#n.x,
+			dy: n - this.#n.y
+		}));
+	}
+	up(e, t, n, r) {
+		this.#a(e, t, n, r, !1);
+	}
+	cancel(e, t, n, r) {
+		this.#a(e, t, n, r, !0);
+	}
+	#a(e, t, n, r, i) {
+		if (e !== this.#t || this.#n === null) return;
+		let a = this.#n, o = this.#i ?? a, s = this.#r ?? a, l = o.t - s.t, u = l > 0 ? (o.x - s.x) / l : 0, d = l > 0 ? (o.y - s.y) / l : 0, f = Math.hypot(u, d);
+		this.#o(), this.#e.onEnd?.({
+			x: t,
+			y: n,
+			dx: t - a.x,
+			dy: n - a.y,
+			dt: r - a.t,
+			vx: u,
+			vy: d,
+			swipe: !i && f > c,
+			canceled: i
+		});
+	}
+	#o() {
+		this.#t = null, this.#n = null, this.#r = null, this.#i = null;
+	}
+};
+function u(e, t) {
+	let { pointer: n, pinch: r } = t, i = (e) => {
+		let t = e;
+		n?.down(t.pointerId, t.clientX, t.clientY, t.timeStamp), r?.down(t.pointerId, t.clientX, t.clientY);
+	}, a = (e) => {
+		let t = e;
+		n?.move(t.pointerId, t.clientX, t.clientY, t.timeStamp), r?.move(t.pointerId, t.clientX, t.clientY);
+	}, o = (e) => {
+		let t = e;
+		n?.up(t.pointerId, t.clientX, t.clientY, t.timeStamp), r?.up(t.pointerId);
+	}, s = (e) => {
+		let t = e;
+		n?.cancel(t.pointerId, t.clientX, t.clientY, t.timeStamp), r?.cancel(t.pointerId);
+	};
+	return e.addEventListener("pointerdown", i), e.addEventListener("pointermove", a), e.addEventListener("pointerup", o), e.addEventListener("pointercancel", s), () => {
+		e.removeEventListener("pointerdown", i), e.removeEventListener("pointermove", a), e.removeEventListener("pointerup", o), e.removeEventListener("pointercancel", s);
+	};
+}
+function d(e, t) {
+	return Math.hypot(e.x - t.x, e.y - t.y);
+}
+var f = class {
+	#e;
+	#t = /* @__PURE__ */ new Map();
+	#n = 0;
+	#r = !1;
+	constructor(e = {}) {
+		this.#e = e;
+	}
+	get pinching() {
+		return this.#r;
+	}
+	down(e, t, n) {
+		if (!(this.#t.has(e) || this.#t.size >= 2) && (this.#t.set(e, {
+			x: t,
+			y: n
+		}), this.#t.size === 2)) {
+			let { a: e, b: t } = this.#a();
+			this.#n = d(e, t), this.#r = !0, this.#e.onPinchStart?.({
+				centerX: (e.x + t.x) / 2,
+				centerY: (e.y + t.y) / 2,
+				distance: this.#n
+			});
+		}
+	}
+	move(e, t, n) {
+		let r = this.#t.get(e);
+		if (!r || (r.x = t, r.y = n, !this.#r)) return;
+		let { a: i, b: a } = this.#a();
+		this.#e.onPinchMove?.({
+			centerX: (i.x + a.x) / 2,
+			centerY: (i.y + a.y) / 2,
+			scale: this.#n > 0 ? d(i, a) / this.#n : 1
+		});
+	}
+	up(e) {
+		this.#i(e);
+	}
+	cancel(e) {
+		this.#i(e);
+	}
+	#i(e) {
+		this.#t.delete(e) && this.#r && this.#t.size < 2 && (this.#r = !1, this.#n = 0, this.#e.onPinchEnd?.());
+	}
+	#a() {
+		let e = [...this.#t.values()], t = e[0], n = e[1];
+		if (!t || !n) throw Error("pinch requires two active pointers");
+		return {
+			a: t,
+			b: n
+		};
+	}
+};
+//#endregion
+//#region src/geometry/hitTest.ts
+function p(e, t, n) {
+	let { width: r, height: i } = t;
+	if (e.x < 0 || e.x > r || e.y < 0 || e.y > i) return "outside";
+	let a = e.x <= n || e.x >= r - n, o = e.y <= n || e.y >= i - n;
+	return a && o ? "corner" : "page";
+}
+//#endregion
+//#region src/renderer/select.ts
+var m = {
+	css: async () => new (await (import("./cssRenderer-BACNXO8M.js"))).CssRenderer(),
+	webgl2: async () => new (await (import("./webglRenderer-D-1UyC-B.js"))).WebglRenderer()
+}, h = !0;
+function g(e) {
+	return typeof e == "object" && !!e && !Array.isArray(e) && typeof e.mount == "function";
+}
+function _(e) {
+	return e.gpu && h ? ["webgl2", "css"] : ["css"];
+}
+function v() {
+	return { gpu: y() };
+}
+function y() {
+	try {
+		return !!document.createElement("canvas").getContext("webgl2");
+	} catch {
+		return !1;
+	}
+}
+async function b(e = "auto", t = v()) {
+	if (g(e)) return e;
+	let n = Array.isArray(e) ? e : e === "auto" ? _(t) : [e];
+	for (let e of n) {
+		if (e === "webgl2" && !t.gpu) continue;
+		let n = m[e];
+		if (n) return n();
+	}
+	throw n.length === 1 && n[0] === "webgl2" && !t.gpu ? Error("renderer: 'webgl2' was forced but this device has no WebGL2. Use 'css' or 'auto'.") : Error(`renderer: none of [${n.join(", ")}] could be loaded — use 'css' or 'auto'.`);
+}
+//#endregion
+//#region src/zine.ts
+var x = .25, S = .0015, C = 6, w = 250, T = class {
+	#e;
+	#t;
+	#n = new i();
+	#r = new r(2);
+	#i = new s();
+	#a;
+	#o;
+	#s;
+	#c;
+	#l;
+	#u;
+	#d;
+	#f = !1;
+	#p;
+	#m = [];
+	#h = 0;
+	#g = 0;
+	#_ = {
+		left: null,
+		right: null
+	};
+	#v;
+	#y;
+	#b;
+	#x;
+	#S;
+	#C = null;
+	#w = !1;
+	#T = 1;
+	#E = 0;
+	#D = 0;
+	#O = null;
+	#k = !1;
+	#A = !1;
+	#j = null;
+	#M = null;
+	#N = null;
+	#P = null;
+	#F = null;
+	#I = null;
+	#L = !1;
+	#R = 1;
+	#z = !1;
+	#B = null;
+	#V = null;
+	#H = null;
+	#U = null;
+	#W = null;
+	#G;
+	debug = { setFlipProgress: (e, t) => {
+		this.#O?.setFlipProgress(e, t);
+	} };
+	constructor(e, t) {
+		k(e, t), this.#e = e, t.width !== void 0 && (e.style.width = `${t.width}px`), t.height !== void 0 && (e.style.height = `${t.height}px`), this.#t = t.source;
+		let n = t.direction ?? "ltr", r = t.cover ?? !1;
+		this.#a = n, this.#o = r, this.#s = t.clickToFlip ?? "edge", this.#c = t.clickZoneSize ?? 64, this.#d = t.singlePageThreshold ?? 640, this.#p = t.startPage, typeof this.#t.open != "function" && this.#ke(), this.#v = t.flipDuration ?? 800, this.#y = t.zoom?.enabled ?? !0, this.#b = t.zoom?.wheel ?? !0;
+		let i = t.zoom?.doubleClick, a = i === !1 ? [] : [...i ?? [
+			1,
+			2,
+			4
+		]].sort((e, t) => e - t);
+		this.#x = a.length > 0 ? a : null, this.#S = t.zoom?.max ?? 4;
+		let o = this.#y && this.#x !== null, s = t.zoom?.doubleClickInFlipZone ?? this.#s === "half";
+		this.#l = this.#s !== "off" && o && s && t.clickFlipDelay !== 0, this.#u = this.#l ? t.clickFlipDelay ?? w : 0, this.#G = this.#fe(t.renderer ?? "auto");
+	}
+	get ready() {
+		return this.#G;
+	}
+	getPageCount() {
+		return this.#t.pageCount;
+	}
+	getPage() {
+		return this.#g;
+	}
+	flipNext() {
+		this.#q(this.#h + 1);
+	}
+	flipPrev() {
+		this.#q(this.#h - 1);
+	}
+	flipTo(e) {
+		let t = E(e, 0, Math.max(0, this.#t.pageCount - 1));
+		this.#q(this.#Oe(t));
+	}
+	getZoom() {
+		return this.#T;
+	}
+	setZoom(e, t) {
+		if (!this.#O || !this.#y) return;
+		let n = E(e, 1, this.#S), r = this.#O.measure(), i = t ?? {
+			x: r.containerWidth / 2,
+			y: r.containerHeight / 2
+		}, a = this.#T, o = n === 1 ? 0 : i.x - n / a * (i.x - this.#E), s = n === 1 ? 0 : i.y - n / a * (i.y - this.#D);
+		[o, s] = this.#K(o, s, n, r.containerWidth, r.containerHeight), this.#T = n, this.#E = o, this.#D = s, this.#O.setViewTransform(n, o, s), this.#n.emit("zoomChanged", { scale: n });
+	}
+	resetZoom() {
+		this.setZoom(1);
+	}
+	#K(e, t, n, r, i) {
+		return [E(e, r * (1 - n), 0), E(t, i * (1 - n), 0)];
+	}
+	on(e, t) {
+		return this.#n.on(e, t);
+	}
+	destroy() {
+		this.#A = !0, this.#j !== null && cancelAnimationFrame(this.#j), this.#ae(), this.#C?.disconnect(), this.#W?.(), this.#H?.(), this.#U?.(), this.#V?.(), this.#O?.destroy(), this.#O = null, this.#t.destroy(), this.#n.clear();
+	}
+	#q(e) {
+		if (e < 0 || e >= this.#m.length || e === this.#h || this.#i.send("flip") === null) return;
+		let t = e > this.#h ? "forward" : "backward", n = this.#Z(e);
+		this.#n.emit("flipStart", {
+			from: this.#g,
+			to: n
+		}), this.#J(e, t, n);
+	}
+	async #J(e, t, n) {
+		let r = this.#m[e], i = r ? await this.#Te(r) : {
+			left: null,
+			right: null
+		};
+		this.#O?.beginFlip(this.#_, i, t, { fill: this.#f }), this.#Y(0, 1, t, () => this.#X(e, n, i));
+	}
+	#Y(e, t, n, r) {
+		let i = this.#ye() * Math.abs(t - e);
+		if (i <= 0) {
+			this.#O?.setFlipProgress(t, n), r();
+			return;
+		}
+		let a = performance.now(), o = (s) => {
+			let c = Math.min(1, (s - a) / i);
+			this.#O?.setFlipProgress(e + (t - e) * D(c), n), c < 1 ? this.#j = requestAnimationFrame(o) : (this.#j = null, r());
+		};
+		this.#j = requestAnimationFrame(o);
+	}
+	#X(e, t, n) {
+		let r = this.#m[e];
+		this.#h = e, this.#g = t, this.#_ = n, r && this.#Se(r, n), this.#De(), this.#i.send("settle"), this.#ve(), this.#n.emit("pageChanged", { page: t }), this.#n.emit("flipEnd", { page: t });
+	}
+	#Z(e) {
+		let t = this.#m[e];
+		if (!t) return this.#g;
+		let n = [t.left, t.right].filter((e) => e !== null);
+		return n.length > 0 ? Math.min(...n) : this.#g;
+	}
+	#Q(e, t) {
+		if (this.#L || !this.#O || this.#i.state !== "idle") return;
+		if (this.#ae(), this.#T > 1) {
+			if (this.#i.send("panStart") === null) return;
+			this.#I = {
+				baseTx: this.#E,
+				baseTy: this.#D
+			};
+			return;
+		}
+		let n = this.#e.getBoundingClientRect(), r = {
+			x: e - n.left,
+			y: t - n.top
+		};
+		this.#P = r;
+		let { containerWidth: i, containerHeight: a } = this.#O.measure(), o = Math.min(i, a) * x;
+		if (p(r, {
+			width: i,
+			height: a
+		}, o) !== "corner") return;
+		let s = r.x > i / 2, c = this.#a === "rtl" ? !s : s, l = this.#h + (c ? 1 : -1);
+		l < 0 || l >= this.#m.length || (this.#N = {
+			direction: c ? "forward" : "backward",
+			targetIndex: l,
+			toPage: this.#Z(l),
+			width: i
+		});
+	}
+	#$() {
+		let e = this.#N;
+		e && (this.#N = null, this.#i.send("grab") !== null && (this.#M = {
+			direction: e.direction,
+			targetIndex: e.targetIndex,
+			toPage: e.toPage,
+			toContent: {
+				left: null,
+				right: null
+			},
+			width: e.width,
+			t: 0
+		}, this.#n.emit("flipStart", {
+			from: this.#g,
+			to: e.toPage
+		}), this.#ee(e.targetIndex, e.direction)));
+	}
+	async #ee(e, t) {
+		let n = this.#m[e], r = n ? await this.#Te(n) : {
+			left: null,
+			right: null
+		};
+		this.#M?.targetIndex === e && (this.#M.toContent = r, this.#O?.beginFlip(this.#_, r, t, { fill: this.#f }), this.#O?.setFlipProgress(this.#M.t, t));
+	}
+	#te(e, t) {
+		if (this.#L) return;
+		if (this.#I) {
+			if (!this.#O) return;
+			let n = this.#O.measure(), [r, i] = this.#K(this.#I.baseTx + e, this.#I.baseTy + t, this.#T, n.containerWidth, n.containerHeight);
+			this.#E = r, this.#D = i, this.#O.setViewTransform(this.#T, r, i);
+			return;
+		}
+		this.#N && Math.hypot(e, t) > C && this.#$();
+		let n = this.#M;
+		n && (n.t = E((n.direction === "forward" ? -e : e) / n.width, 0, 1), this.#O?.setFlipProgress(n.t, n.direction));
+	}
+	#ne(e) {
+		if (this.#L) return;
+		if (this.#I) {
+			this.#I = null, this.#i.send("panEnd");
+			return;
+		}
+		let t = this.#M;
+		if (!t) {
+			this.#N = null, this.#re(e);
+			return;
+		}
+		this.#M = null, this.#i.send("release");
+		let n = e.swipe && (t.direction === "forward" ? e.dx < 0 : e.dx > 0);
+		t.t >= .5 || n ? this.#Y(t.t, 1, t.direction, () => this.#X(t.targetIndex, t.toPage, t.toContent)) : this.#Y(t.t, 0, t.direction, () => this.#oe());
+	}
+	#re(e) {
+		if (this.#s === "off" || this.#T > 1 || !this.#P || Math.abs(e.dx) > C || Math.abs(e.dy) > C) return;
+		let t = this.#ie(this.#P);
+		if (!t) return;
+		let n = this.#h + (t === "forward" ? 1 : -1);
+		if (!(n < 0 || n >= this.#m.length)) {
+			if (this.#ae(), this.#u <= 0) {
+				this.#q(n);
+				return;
+			}
+			this.#F = setTimeout(() => {
+				this.#F = null, this.#q(n);
+			}, this.#u);
+		}
+	}
+	#ie(e) {
+		if (!this.#O) return null;
+		let { containerWidth: t } = this.#O.measure(), n;
+		if (n = this.#s === "half" ? e.x > t / 2 ? "right" : "left" : e.x <= this.#c ? "left" : e.x >= t - this.#c ? "right" : null, !n) return null;
+		let r = this.#a === "rtl" ? "left" : "right";
+		return n === r ? "forward" : "backward";
+	}
+	#ae() {
+		this.#F !== null && (clearTimeout(this.#F), this.#F = null);
+	}
+	#oe() {
+		let e = this.#m[this.#h];
+		e && this.#Se(e, this.#_), this.#i.send("settle"), this.#n.emit("flipEnd", { page: this.#g });
+	}
+	#se() {
+		if (this.#N = null, this.#ae(), this.#M) {
+			this.#M = null, this.#i.send("release"), this.#i.send("settle");
+			let e = this.#m[this.#h];
+			e && this.#Se(e, this.#_);
+		} else this.#I && (this.#I = null, this.#i.send("panEnd"));
+		this.#L = !0, this.#R = this.#T;
+	}
+	#ce(e, t, n) {
+		if (!this.#L) return;
+		let r = this.#e.getBoundingClientRect();
+		this.setZoom(this.#R * n, {
+			x: e - r.left,
+			y: t - r.top
+		});
+	}
+	#le() {
+		this.#L = !1;
+	}
+	#ue() {
+		let e = (e) => {
+			if (!this.#b || !this.#y || !(e.ctrlKey || e.metaKey)) return;
+			e.preventDefault();
+			let t = this.#e.getBoundingClientRect(), n = Math.exp(-e.deltaY * S);
+			this.setZoom(this.#T * n, {
+				x: e.clientX - t.left,
+				y: e.clientY - t.top
+			});
+		};
+		this.#e.addEventListener("wheel", e, { passive: !1 }), this.#H = () => this.#e.removeEventListener("wheel", e);
+	}
+	#de() {
+		let e = (e) => {
+			let t = this.#x;
+			if (!this.#y || t === null) return;
+			if (this.#T <= 1 && this.#s !== "off" && !this.#l) {
+				let t = this.#e.getBoundingClientRect(), n = {
+					x: e.clientX - t.left,
+					y: e.clientY - t.top
+				};
+				if (this.#ie(n) !== null) return;
+			}
+			this.#ae(), e.preventDefault();
+			let n = t.find((e) => e > this.#T + 1e-6) ?? t[0] ?? this.#T, r = this.#e.getBoundingClientRect();
+			this.setZoom(n, {
+				x: e.clientX - r.left,
+				y: e.clientY - r.top
+			});
+		};
+		this.#e.addEventListener("dblclick", e), this.#U = () => this.#e.removeEventListener("dblclick", e);
+	}
+	async #fe(e) {
+		let t = b(e);
+		typeof this.#t.open == "function" && (await this.#t.open(), this.#ke()), this.#t.prefetch([this.#g]);
+		let n = await t, r = await this.#pe(n);
+		this.#O = r, this.#be(r.measure().containerWidth);
+		let i = new l({
+			onStart: (e) => this.#Q(e.x, e.y),
+			onMove: (e) => this.#te(e.dx, e.dy),
+			onEnd: (e) => this.#ne(e)
+		}), a = new f({
+			onPinchStart: () => this.#se(),
+			onPinchMove: (e) => this.#ce(e.centerX, e.centerY, e.scale),
+			onPinchEnd: () => this.#le()
+		});
+		this.#V = u(this.#e, {
+			pointer: i,
+			pinch: a
+		}), this.#ue(), this.#de(), this.#he(), this.#W = this.#ge(), await this.#xe(), this.#Ce(), this.#De(), this.#ve(), this.#n.emit("ready");
+	}
+	async #pe(e) {
+		try {
+			return await e.mount(this.#e), e.onFatal?.(() => {
+				this.#me();
+			}), e;
+		} catch {
+			e.destroy();
+			let t = await b("css");
+			return await t.mount(this.#e), this.#k = !0, this.#n.emit("rendererFallback", {
+				from: "webgl2",
+				to: "css"
+			}), t;
+		}
+	}
+	async #me() {
+		if (this.#k || this.#A) return;
+		this.#k = !0, this.#O?.destroy(), this.#O = null;
+		let e = await b("css");
+		if (this.#A) {
+			e.destroy();
+			return;
+		}
+		await e.mount(this.#e), this.#O = e, this.#be(e.measure().containerWidth), await this.#xe(), this.#n.emit("rendererFallback", {
+			from: "webgl2",
+			to: "css"
+		});
+	}
+	#he() {
+		if (typeof matchMedia != "function") return;
+		let e = matchMedia("(prefers-reduced-motion: reduce)");
+		this.#z = e.matches, e.addEventListener?.("change", (e) => {
+			this.#z = e.matches;
+		});
+	}
+	#ge() {
+		let e = this.#e, t = e.ownerDocument;
+		if (!t || typeof e.setAttribute != "function") return null;
+		e.hasAttribute("tabindex") || (e.tabIndex = 0), e.setAttribute("aria-roledescription", "flipbook");
+		let n = (e) => this.#_e(e);
+		e.addEventListener("keydown", n);
+		let r = t.createElement("div");
+		return r.setAttribute("aria-live", "polite"), r.setAttribute("aria-atomic", "true"), r.style.cssText = "position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;", e.appendChild(r), this.#B = r, () => {
+			e.removeEventListener("keydown", n), r.remove(), this.#B = null;
+		};
+	}
+	#_e(e) {
+		let t = this.#a === "rtl" ? "ArrowLeft" : "ArrowRight";
+		switch (e.key) {
+			case "ArrowRight":
+			case "ArrowLeft":
+				e.key === t ? this.flipNext() : this.flipPrev(), e.preventDefault();
+				break;
+			case "Home":
+				this.flipTo(0), e.preventDefault();
+				break;
+			case "End":
+				this.flipTo(this.#t.pageCount - 1), e.preventDefault();
+				break;
+			default: break;
+		}
+	}
+	#ve() {
+		this.#B && (this.#B.textContent = `Page ${this.#g + 1} of ${this.#t.pageCount}`);
+	}
+	#ye() {
+		return this.#z ? 0 : this.#v;
+	}
+	update() {
+		!this.#O || this.#i.state !== "idle" || (this.#be(this.#O.measure().containerWidth), this.#xe());
+	}
+	#be(n) {
+		let r = t(n, this.#d);
+		r !== this.#f && (this.#f = r, this.#m = e(this.#t.pageCount, {
+			direction: this.#a,
+			cover: this.#o,
+			singlePage: r
+		}), this.#h = this.#Oe(this.#g));
+	}
+	async #xe() {
+		let e = this.#m[this.#h];
+		!e || !this.#O || (this.#_ = await this.#Te(e), this.#Se(e, this.#_));
+	}
+	#Se(e, t) {
+		this.#O?.renderSpread(e, t, { fill: this.#f });
+	}
+	#Ce() {
+		typeof ResizeObserver > "u" || (this.#C = new ResizeObserver(() => this.#we()), this.#C.observe(this.#e));
+	}
+	#we() {
+		this.#w || (this.#w = !0, requestAnimationFrame(() => {
+			this.#w = !1, this.update();
+		}));
+	}
+	async #Te(e) {
+		let [t, n] = await Promise.all([this.#Ee(e.left), this.#Ee(e.right)]);
+		return {
+			left: t,
+			right: n
+		};
+	}
+	async #Ee(e) {
+		if (e === null) return null;
+		try {
+			return await this.#t.get(e);
+		} catch (t) {
+			return this.#n.emit("sourceError", {
+				index: e,
+				error: t
+			}), null;
+		}
+	}
+	#De() {
+		let { toMount: e } = this.#r.update(this.#h, this.#m.length), t = [];
+		for (let n of e) {
+			let e = this.#m[n];
+			e?.left != null && t.push(e.left), e?.right != null && t.push(e.right);
+		}
+		this.#t.prefetch(t);
+	}
+	#Oe(e) {
+		let t = this.#m.findIndex((t) => t.left === e || t.right === e);
+		return t === -1 ? 0 : t;
+	}
+	#ke() {
+		let t = this.#t.pageCount;
+		if (!Number.isInteger(t) || t < 1) throw Error(`Zine: source has ${t} pages; a Source must have at least 1 page.`);
+		let n = this.#p;
+		if (n !== void 0 && (!Number.isInteger(n) || n < 0 || n >= t)) throw Error(`Zine: startPage ${JSON.stringify(n)} is out of range for a ${t}-page book (valid 0..${t - 1}).`);
+		this.#m = e(t, {
+			direction: this.#a,
+			cover: this.#o
+		}), this.#g = E(n ?? 0, 0, t - 1), this.#h = this.#Oe(this.#g);
+	}
+};
+function E(e, t, n) {
+	return e < t ? t : e > n ? n : e;
+}
+function D(e) {
+	return e < .5 ? 4 * e * e * e : 1 - (-2 * e + 2) ** 3 / 2;
+}
+function O(e) {
+	return e === null ? "null" : Array.isArray(e) ? "array" : typeof e;
+}
+function k(e, t) {
+	if (typeof e != "object" || !e || typeof e.appendChild != "function" || typeof e.addEventListener != "function") throw Error(`Zine: container must be a DOM element; received ${O(e)}.`);
+	if (typeof t != "object" || !t) throw Error("Zine: an options object with a `source` is required.");
+	let n = t, r = n.source;
+	if (typeof r != "object" || !r || typeof r.get != "function" || typeof r.pageCount != "number") throw Error("Zine: `source` is required and must be a Source, e.g. new ImageSource(urls).");
+	let i = n.startPage;
+	if (i !== void 0 && (typeof i != "number" || !Number.isInteger(i) || i < 0)) throw Error(`Zine: startPage must be a non-negative integer; got ${JSON.stringify(i)}.`);
+	let a = n.direction;
+	if (a !== void 0 && a !== "ltr" && a !== "rtl") throw Error(`Zine: direction must be 'ltr' or 'rtl'; got ${JSON.stringify(a)}.`);
+	let o = n.clickToFlip;
+	if (o !== void 0 && ![
+		"edge",
+		"half",
+		"off"
+	].includes(o)) throw Error(`Zine: clickToFlip must be 'edge', 'half', or 'off'; got ${JSON.stringify(o)}.`);
+	A(n.width, "width", 1), A(n.height, "height", 1), A(n.flipDuration, "flipDuration", 0), A(n.clickZoneSize, "clickZoneSize", 0), A(n.clickFlipDelay, "clickFlipDelay", 0), A(n.singlePageThreshold, "singlePageThreshold", 0), j(n.zoom), M(n.renderer);
+}
+function A(e, t, n) {
+	if (e !== void 0 && (typeof e != "number" || !Number.isFinite(e) || e < n)) throw Error(`Zine: ${t} must be a number >= ${n}; got ${JSON.stringify(e)}.`);
+}
+function j(e) {
+	if (e === void 0) return;
+	if (typeof e != "object" || !e || Array.isArray(e)) throw Error("Zine: zoom must be an object, e.g. { max: 4 }.");
+	let t = e;
+	if (t.enabled !== void 0 && typeof t.enabled != "boolean") throw Error(`Zine: zoom.enabled must be a boolean; got ${JSON.stringify(t.enabled)}.`);
+	if (t.wheel !== void 0 && typeof t.wheel != "boolean") throw Error(`Zine: zoom.wheel must be a boolean; got ${JSON.stringify(t.wheel)}.`);
+	if (t.doubleClickInFlipZone !== void 0 && typeof t.doubleClickInFlipZone != "boolean") throw Error(`Zine: zoom.doubleClickInFlipZone must be a boolean; got ${JSON.stringify(t.doubleClickInFlipZone)}.`);
+	if (t.doubleClick !== void 0 && t.doubleClick !== !1) {
+		let e = t.doubleClick;
+		if (!Array.isArray(e) || e.some((e) => typeof e != "number" || !Number.isFinite(e) || e < 1)) throw Error("Zine: zoom.doubleClick must be false or an array of zoom levels >= 1, e.g. [1, 2, 4].");
+	}
+	A(t.max, "zoom.max", 1);
+}
+function M(e) {
+	if (e !== void 0) {
+		if (typeof e == "string") {
+			if (e !== "auto" && e !== "css" && e !== "webgl2") throw Error(`Zine: renderer '${e}' is not recognized; use 'auto', 'css', 'webgl2', an array of those, or a custom Renderer.`);
+			return;
+		}
+		if (Array.isArray(e)) {
+			for (let t of e) if (t !== "css" && t !== "webgl2") throw Error(`Zine: renderer order array may only contain 'css' or 'webgl2'; got ${JSON.stringify(t)}.`);
+			return;
+		}
+		if (!(typeof e == "object" && e && typeof e.mount == "function")) throw Error("Zine: renderer must be 'auto', 'css', 'webgl2', an array of those, or a custom Renderer instance.");
+	}
+}
+//#endregion
+//#region src/source/imageSource.ts
+var N = class {
+	pageCount;
+	fit;
+	#e;
+	#t;
+	#n = /* @__PURE__ */ new Map();
+	constructor(e, t = {}) {
+		this.#e = e, this.pageCount = e.length, this.#t = t.preload ?? 1, this.fit = t.fit ?? "contain";
+	}
+	get(e) {
+		let t = this.#r(e);
+		for (let t = 1; t <= this.#t; t++) this.prefetch([e - t, e + t]);
+		return t;
+	}
+	prefetch(e) {
+		for (let t of e) t >= 0 && t < this.pageCount && this.#r(t).catch(() => {});
+	}
+	destroy() {
+		for (let e of this.#n.values()) e.then((e) => e.close()).catch(() => {});
+		this.#n.clear();
+	}
+	#r(e) {
+		let t = this.#n.get(e);
+		if (t) return t;
+		let n = this.#e[e];
+		if (n === void 0) return Promise.reject(/* @__PURE__ */ RangeError(`ImageSource: page ${e} is out of range (0..${this.pageCount - 1}).`));
+		let r = (async () => {
+			let t = await fetch(n);
+			if (!t.ok) throw Error(`ImageSource: failed to fetch page ${e} (${n}) — HTTP ${t.status}.`);
+			return createImageBitmap(await t.blob());
+		})().catch((t) => {
+			throw this.#n.delete(e), t;
+		});
+		return this.#n.set(e, r), r;
+	}
+};
+//#endregion
+export { N as ImageSource, T as Zine };
+
+//# sourceMappingURL=index.js.map