@genome-spy/app 0.88.0 → 0.89.0

package/dist/{canvas2d-D7SZK3xv.js → canvas2d-DgF0kstG.js}

@@ -1,16 +1,16 @@
-import { ct as e, et as t, o as n, s as r, un as i } from "./clipOptions-BWHr3aTa.js";
-import { v as a } from "./vega-scale-CypF85iS.js";
+import { ct as e, et as t, hn as n, o as r, s as i } from "./clipOptions-DBJX_W31.js";
+import { v as a } from "./vega-scale-BJaDSHBJ.js";
 import { t as o } from "./warning-CpIIpk8e.js";
-import { t as s } from "./rectangle-DKnrAmKs.js";
+import { t as s } from "./rectangle-DE98gIxF.js";
 import { n as c, r as l, t as u } from "./performanceProfiler-CPLEjApa.js";
 import { n as d, t as f } from "./layoutResult-D50MSHXR.js";
-import { A as p, C as m, E as h, M as g, N as _, O as v, S as y, _ as b, a as x, b as S, c as C, f as w, h as T, k as E, l as D, m as O, o as ee, p as te, s as ne, u as re, v as ie, y as k } from "./order-C5CzA37O.js";
-import { n as A, t as j } from "./renderCanvas2D-DxturTEW.js";
-import { t as M } from "./canvasSizeHelper-7h_8rOcx.js";
-import { exportCanvas as N, exportRaster as P } from "./rasterExport-DEr8fOLm.js";
-import { createCanvas2DSvgRasterizer as F } from "./svgRasterizer-mWK7HTkx.js";
+import { C as p, E as m, F as h, I as g, M as _, N as v, S as y, T as b, _ as x, b as S, c as C, d as w, f as T, g as E, h as ee, i as D, j as O, k, l as te, n as ne, p as re, u as ie, v as ae, x as A } from "./order-DIxlclRN.js";
+import { n as j, t as M } from "./renderCanvas2D-LdEYFnRo.js";
+import { t as N } from "./canvasSizeHelper-foL2YvGL.js";
+import { exportCanvas as P, exportRaster as F } from "./rasterExport-Bl6w9t3J.js";
+import { createCanvas2DSvgRasterizer as I } from "./svgRasterizer-CksK4QTB.js";
 //#region ../core/src/rendering/canvas2d/picking/softwarePickingRasterizer.js
-var I = 12, L = .5, R = class {
+var L = 12, R = .5, z = class {
 	#e = [];
 	#t = [];
 	#n = [
@@ -50,7 +50,7 @@ var I = 12, L = .5, R = class {
 	}
 	setClip(e, t, n, r) {
 		if (!Number.isFinite(e) || !Number.isFinite(t) || !Number.isFinite(n) || !Number.isFinite(r)) throw RangeError("Software picking clip must be finite.");
-		this.#r = H(Math.floor(Math.min(e, n)), 0, this.buffer.width), this.#i = H(Math.floor(Math.min(t, r)), 0, this.buffer.height), this.#a = H(Math.ceil(Math.max(e, n)), this.#r, this.buffer.width), this.#o = H(Math.ceil(Math.max(t, r)), this.#i, this.buffer.height);
+		this.#r = U(Math.floor(Math.min(e, n)), 0, this.buffer.width), this.#i = U(Math.floor(Math.min(t, r)), 0, this.buffer.height), this.#a = U(Math.ceil(Math.max(e, n)), this.#r, this.buffer.width), this.#o = U(Math.ceil(Math.max(t, r)), this.#i, this.buffer.height);
 	}
 	fillRect(e, t, n, r, i) {
 		this.#s++, this.#p(e, t, n, r, i);
@@ -95,7 +95,7 @@ var I = 12, L = .5, R = class {
 		if (!(a > 0) || !Number.isFinite(a)) return;
 		this.#u++;
 		let s = a / 2, c = this.#n;
-		if (!z(t, n, r, i, this.#r - s, this.#i - s, this.#a + s, this.#o + s, c)) return;
+		if (!B(t, n, r, i, this.#r - s, this.#i - s, this.#a + s, this.#o + s, c)) return;
 		let l = c[2] - c[0], u = c[3] - c[1], d = Math.ceil(Math.max(Math.abs(l), Math.abs(u)));
 		if (d == 0) {
 			this.#h(e, c[0], c[1], s, o);
@@ -106,13 +106,13 @@ var I = 12, L = .5, R = class {
 			this.#h(e, c[0] + l * n, c[1] + u * n, s, o);
 		}
 	}
-	strokeCubic(e, t, n, r, i, a, o, s, c, l, u = L, d) {
+	strokeCubic(e, t, n, r, i, a, o, s, c, l, u = R, d) {
 		if (!(l > 0) || !Number.isFinite(l) || !(u > 0) || !Number.isFinite(u) || !Number.isFinite(t) || !Number.isFinite(n) || !Number.isFinite(r) || !Number.isFinite(i) || !Number.isFinite(a) || !Number.isFinite(o) || !Number.isFinite(s) || !Number.isFinite(c)) return;
 		this.#d++;
 		let f = this.#e;
 		for (f.length = 0, f.push(t, n, r, i, a, o, s, c, 0); f.length;) {
 			let t = f.pop(), n = f.pop(), r = f.pop(), i = f.pop(), a = f.pop(), o = f.pop(), s = f.pop(), c = f.pop(), p = f.pop();
-			if (t >= I || B(p, c, s, o, a, i, r, n, u)) {
+			if (t >= L || V(p, c, s, o, a, i, r, n, u)) {
 				this.strokeSegment(e, p, c, r, n, l, d);
 				continue;
 			}
@@ -138,7 +138,7 @@ var I = 12, L = .5, R = class {
 		}
 	}
 };
-function z(e, t, n, r, i, a, o, s, c) {
+function B(e, t, n, r, i, a, o, s, c) {
 	if (!Number.isFinite(e) || !Number.isFinite(t) || !Number.isFinite(n) || !Number.isFinite(r)) return !1;
 	let l = n - e, u = r - t, d = 0, f = 1;
 	if (l == 0) {
@@ -155,67 +155,71 @@ function z(e, t, n, r, i, a, o, s, c) {
 	}
 	return d > f ? !1 : (c[0] = e + d * l, c[1] = t + d * u, c[2] = e + f * l, c[3] = t + f * u, !0);
 }
-function B(e, t, n, r, i, a, o, s, c) {
+function V(e, t, n, r, i, a, o, s, c) {
 	let l = o - e, u = s - t, d = l * l + u * u, f = c * c;
 	if (d == 0) {
-		let o = V(e, t, n, r), s = V(e, t, i, a);
+		let o = H(e, t, n, r), s = H(e, t, i, a);
 		return Math.max(o, s) <= f;
 	}
 	let p = u * (n - e) - l * (r - t), m = u * (i - e) - l * (a - t);
 	return Math.max(p * p, m * m) <= f * d;
 }
-function V(e, t, n, r) {
+function H(e, t, n, r) {
 	let i = n - e, a = r - t;
 	return i * i + a * a;
 }
-function H(e, t, n) {
+function U(e, t, n) {
 	return Math.max(t, Math.min(n, e));
 }
 //#endregion
 //#region ../core/src/rendering/canvas2d/picking/renderers/index.js
-var U = 1;
-function W(e, t) {
+var W = 1;
+function G(e, t) {
 	let n = e.getType();
-	return n == "arrow" ? K(e, t) : n == "rect" ? q(e, t) : n == "point" ? J(e, t) : n == "rule" || n == "tick" ? ae(e, t) : n == "link" ? oe(e, t) : n == "text" ? se(e, t) : 0;
+	return n == "arrow" ? q(e, t) : n == "rect" ? J(e, t) : n == "point" ? oe(e, t) : n == "rule" || n == "tick" ? se(e, t) : n == "link" ? ce(e, t) : n == "text" ? le(e, t) : 0;
 }
-function G(e) {
+function K(e) {
 	let t = e.getType();
 	return t == "rect" || t == "arrow" || t == "point" || t == "rule" || t == "tick" || t == "link" || t == "text";
 }
-function K(e, t) {
-	let n = e, r = k(n), i = Array(8).fill(0);
-	return y(n, r, t, (e) => {
+function q(e, t) {
+	let n = e, r = y(n), i = Array(8).fill(0);
+	return b(n, r, t, (e) => {
 		let a = Y(n, e.datum), o = e.strokeWidth / 2;
-		r.stem && t.rasterizer.strokeSegment(a, e.tail.x, e.tail.y, e.tip.x, e.tip.y, e.stemHalfWidth * 2 + e.strokeWidth), S(e, (n, r) => {
-			let s = e.headHalfWidth + o, c = n + e.tangent.x * o, l = r + e.tangent.y * o, u = e.headRepeatFootprint + o, d = n - e.tangent.x * u, f = r - e.tangent.y * u;
-			ce(i, c, l, d, f, e.normal.x, e.normal.y, s), t.rasterizer.fillConvexPolygon(a, i);
+		r.stem && t.rasterizer.strokeSegment(a, e.tail.x, e.tail.y, e.tip.x, e.tip.y, e.stemHalfWidth * 2 + e.strokeWidth), p(e, (n, r, s, c) => {
+			let l = e.headHalfWidth + o, u = n + s.x * o, d = r + s.y * o, f = e.headRepeatFootprint + o, p = n - s.x * f, m = r - s.y * f;
+			ue(i, u, d, p, m, c.x, c.y, l), t.rasterizer.fillConvexPolygon(a, i);
 		});
 	});
 }
-function q(e, t) {
+function J(e, t) {
 	let n = e;
-	return re(n, D(n), t, (e) => t.rasterizer.fillRect(Y(n, e.datum), e.x, e.y, e.width, e.height));
+	return re(n, T(n), t, (e) => t.rasterizer.fillRect(Y(n, e.datum), e.x, e.y, e.width, e.height));
 }
-function J(e, t) {
-	let n = e, r = h(n, n.properties.minPickingSize);
-	return te(n, w(n), t, (e) => t.rasterizer.fillSquare(Y(n, e.datum), e.x, e.y, Math.max(e.boundsRadius, r / 2)));
+function oe(e, t) {
+	let n = e, r = k(n, n.properties.minPickingSize);
+	return E(n, ee(n), t, (e) => t.rasterizer.fillSquare(Y(n, e.datum), e.x, e.y, Math.max(e.boundsRadius, r / 2)));
 }
-function ae(e, t) {
+function se(e, t) {
 	let n = e;
-	return C(n, ne(n), t, (e) => t.rasterizer.strokeSegment(Y(n, e.datum), e.x1, e.y1, e.x2, e.y2, Math.max(e.strokeWidth, U)));
+	return w(n, ie(n), t, (e) => t.rasterizer.strokeSegment(Y(n, e.datum), e.x1, e.y1, e.x2, e.y2, Math.max(e.strokeWidth, W)));
 }
-function oe(e, t) {
-	let n = e, r = h(n, n.properties.minPickingSize), i = O(n), a = ie(n, i.shape);
-	return T(n, i, t, (e) => {
-		let [i, o, s, c] = e.points, l = a && b(i, c, a);
+function ce(e, t) {
+	let n = e, r = k(n, n.properties.minPickingSize), i = x(n), a = A(n, i.shape);
+	return ae(n, i, t, (e) => {
+		let [i, o, s, c] = e.points, l = a && S(i, c, a);
 		t.rasterizer.strokeCubic(Y(n, e.datum), i[0], i[1], o[0], o[1], s[0], s[1], c[0], c[1], Math.max(e.strokeWidth, r), void 0, l ? (e, t) => Math.abs(l.normalX * e + l.normalY * t - l.offset) < l.end : void 0);
 	});
 }
-function se(e, t) {
-	let n = e;
-	return ee(n, x(n), t, (e) => t.rasterizer.fillConvexPolygon(Y(n, e.datum), e.boundsQuad));
+function le(e, t) {
+	let n = e, r = t.textMetrics ?? n.unitView.context.textMetrics, i = r.requestFont(n.properties), a = D(r, n.properties);
+	return te(n, C(n), {
+		...t,
+		fontMeasurement: i,
+		measureLogoInkBounds: a
+	}, (e) => t.rasterizer.fillConvexPolygon(Y(n, e.datum), e.boundsQuad));
 }
-function ce(e, t, n, r, i, a, o, s) {
+function ue(e, t, n, r, i, a, o, s) {
 	let c = a * s, l = o * s;
 	e[0] = t + c, e[1] = n + l, e[2] = r + c, e[3] = i + l, e[4] = r - c, e[5] = i - l, e[6] = t - c, e[7] = n - l;
 }
@@ -225,15 +229,15 @@ function Y(e, t) {
 }
 //#endregion
 //#region ../core/src/rendering/canvas2d/picking/softwarePickingViewRenderingContext.js
-var le = class extends d {
+var de = class extends d {
 	#e = [];
 	#t = /* @__PURE__ */ new Set();
 	#n;
-	#r = new g();
+	#r = new h();
 	#i;
 	#a = [0, 0];
 	constructor(e) {
-		super({ picking: !0 }), this.width = e.width, this.height = e.height, this.devicePixelRatio = e.devicePixelRatio, this.getRasterizer = e.getRasterizer, this.#n = c(), this.#i = e.xIndexManager;
+		super({ picking: !0 }), this.width = e.width, this.height = e.height, this.devicePixelRatio = e.devicePixelRatio, this.getRasterizer = e.getRasterizer, this.textMetrics = e.textMetrics, this.#n = c(), this.#i = e.xIndexManager;
 	}
 	getDevicePixelRatio() {
 		return this.devicePixelRatio;
@@ -248,23 +252,23 @@ var le = class extends d {
 		if (this.#e.pop()?.view !== e) throw Error("Unbalanced software picking view rendering context stack.");
 	}
 	renderMark(e, t) {
-		if (!e.isPickingParticipant() || !G(e)) return;
-		let i = t.sampleFacetRenderingOptions;
-		if (i && !e.encoders.facetIndex && (this.#n?.addCount("canvasSampleFacetOccurrences"), !A(i))) {
+		if (!e.isPickingParticipant() || !K(e)) return;
+		let n = t.sampleFacetRenderingOptions;
+		if (n && !e.encoders.facetIndex && (this.#n?.addCount("canvasSampleFacetOccurrences"), !j(n))) {
 			this.#n?.addCount("canvasCulledSampleFacetOccurrences");
 			return;
 		}
 		let a = e.unitView.getEffectiveOpacity();
 		if (a <= 0) return;
-		let s = this.currentCoords, c = n(t), l = r(c, e.properties.clip, s), u = E(this.width, this.height, l);
-		if (!p(u)) return;
-		let d = v(s, c, e.properties.cullByVisibleRange), f = this.#i?.prepare(e) ?? !1;
-		_(e, t, s, this.#r, (t, n) => {
+		let s = this.currentCoords, c = r(t), l = i(c, e.properties.clip, s), u = _(this.width, this.height, l);
+		if (!v(u)) return;
+		let d = O(s, c, e.properties.cullByVisibleRange), f = this.#i?.prepare(e) ?? !1;
+		g(e, t, s, this.#r, (t, n) => {
 			if (n.length == 0) return;
 			let r = 0, i = n.length;
 			if (f && this.#i.query(n, this.#a) && (r = this.#a[0], i = this.#a[1], r === i)) return;
 			let o = this.getRasterizer();
-			o.setClip(u.x1, u.y1, u.x2, u.y2), W(e, {
+			o.setClip(u.x1, u.y1, u.x2, u.y2), G(e, {
 				rasterizer: o,
 				coords: t,
 				data: n,
@@ -272,20 +276,21 @@ var le = class extends d {
 				end: i,
 				visibleBounds: u,
 				anchorCullBounds: d,
-				viewOpacity: a
+				viewOpacity: a,
+				textMetrics: this.textMetrics
 			});
 		}, (t) => o(`Canvas2D picking could not resolve sample facet index ${t}. View: ${e.unitView.getPathString()}`));
 	}
 	get currentCoords() {
-		let e = i(this.#e);
+		let e = n(this.#e);
 		if (!e) throw Error("No current view in software picking rendering context.");
 		return e.coords;
 	}
-}, X = 2 ** 31 - 1, ue = -(2 ** 31);
-function de(e, n, r, i = r) {
+}, X = 2 ** 31 - 1, fe = -(2 ** 31);
+function pe(e, n, r, i = r) {
 	let a = Array(e);
 	a.fill(X);
-	let o = ue, s = -Infinity, c = !1, l = Array(e);
+	let o = fe, s = -Infinity, c = !1, l = Array(e);
 	l.fill(0);
 	let u = n[0], d = (n[1] - n[0]) / e, f = (n, r) => {
 		let i = (n - u) / d, a = Math.floor(i);
@@ -343,12 +348,12 @@ function de(e, n, r, i = r) {
 }
 //#endregion
 //#region ../core/src/rendering/xIndex/markXIndex.js
-function fe(e, t, n = 0) {
+function me(e, t, n = 0) {
 	if (!t.length) return;
-	let r = de(Math.min(256, Math.ceil(Math.sqrt(t.length))), e.indexDomain, e.xAccessor, e.x2Accessor);
+	let r = pe(Math.min(256, Math.ceil(Math.sqrt(t.length))), e.indexDomain, e.xAccessor, e.x2Accessor);
 	return t.forEach((e, t) => r(e, n + t, n + t + 1)), r.getIndex();
 }
-function pe(t) {
+function he(t) {
 	let n = t.encoders?.x, r = t.encoders?.x2;
 	if (!n?.channelDef || !("buildIndex" in n.channelDef) || !n.channelDef.buildIndex || !n.scale || !a(n.scale.type) && !["index", "locus"].includes(n.scale.type) || n.branches.length !== 1) return;
 	let i = t.getType();
@@ -366,7 +371,7 @@ function pe(t) {
 		domainStartOffset: ["index", "locus"].includes(n.scale.type) ? -1 : 0
 	};
 }
-function me(e, t) {
+function Z(e, t) {
 	let n = e.scaleResolution.getScale().domain();
 	if (n.length !== 2 || !Number.isFinite(n[0]) || !Number.isFinite(n[1]) || n[1] <= n[0]) return !1;
 	let r = n[1] - n[0];
@@ -374,7 +379,7 @@ function me(e, t) {
 }
 //#endregion
 //#region ../core/src/rendering/canvas2d/canvasXIndexManager.js
-var he = class {
+var ge = class {
 	#e = /* @__PURE__ */ new WeakMap();
 	#t = [0, 0];
 	#n;
@@ -382,7 +387,7 @@ var he = class {
 		if (this.#n = void 0, e.encoders.facetIndex) return this.#r();
 		let t = e.unitView.getCollector(), n = e.unitView.getScaleResolution("x"), r = n?.zoomExtent, i = this.#e.get(e);
 		if (!i || i.collector !== t || i.dataRevision !== t.dataRevision || i.xEncoder !== e.encoders.x || i.x2Encoder !== e.encoders.x2 || i.xScaleResolution !== n || i.xIndexDomainStart !== r?.[0] || i.xIndexDomainEnd !== r?.[1]) {
-			let a = pe(e);
+			let a = he(e);
 			i = {
 				collector: t,
 				dataRevision: t.dataRevision,
@@ -396,21 +401,21 @@ var he = class {
 			}, this.#e.set(e, i);
 		}
 		let a = i.spec;
-		return !a || !me(a, this.#t) ? this.#r() : (this.#n = i, !0);
+		return !a || !Z(a, this.#t) ? this.#r() : (this.#n = i, !0);
 	}
 	query(e, t) {
 		let n = this.#n;
 		if (!n?.spec) throw Error("Canvas x-index query was not prepared.");
 		u("canvasXIndexNativeItems", e.length);
 		let r = n.batches.get(e);
-		return r === void 0 && (r = fe(n.spec, e) ?? null, n.batches.set(e, r), u("canvasXIndexBuilds"), r || u("canvasXIndexRejectedBuilds")), r ? (r(this.#t[0], this.#t[1], t), u("canvasXIndexQueries"), u("canvasXIndexCandidateItems", t[1] - t[0]), t[0] === t[1] && u("canvasXIndexEmptyRanges"), !0) : this.#r();
+		return r === void 0 && (r = me(n.spec, e) ?? null, n.batches.set(e, r), u("canvasXIndexBuilds"), r || u("canvasXIndexRejectedBuilds")), r ? (r(this.#t[0], this.#t[1], t), u("canvasXIndexQueries"), u("canvasXIndexCandidateItems", t[1] - t[0]), t[0] === t[1] && u("canvasXIndexEmptyRanges"), !0) : this.#r();
 	}
 	#r() {
 		return u("canvasXIndexFallbackQueries"), !1;
 	}
-}, Z = class {
+}, _e = class {
 	constructor(e) {
-		this.viewRoot = e.viewRoot, this.context = e.context, this.surface = e.surface, this.getBackground = e.getBackground, this.broadcast = e.broadcast, this.onLayoutComputed = e.onLayoutComputed, this.layoutResult = void 0, this.pickingRasterizer = void 0, this.dirtyPickingBuffer = !0, this.xIndexManager = new he(), this.opacityLayers = [];
+		this.viewRoot = e.viewRoot, this.context = e.context, this.surface = e.surface, this.textMetrics = e.textMetrics, this.getBackground = e.getBackground, this.broadcast = e.broadcast, this.onLayoutComputed = e.onLayoutComputed, this.layoutResult = void 0, this.pickingRasterizer = void 0, this.dirtyPickingBuffer = !0, this.xIndexManager = new ge(), this.opacityLayers = [];
 	}
 	computeLayout() {
 		this.broadcast("layout"), this.surface.invalidateSize();
@@ -433,7 +438,7 @@ var he = class {
 		let n = c();
 		n?.beginFrame("canvas");
 		try {
-			l("render", () => j({
+			l("render", () => M({
 				layoutResult: e,
 				context: this.context,
 				width: t.width,
@@ -441,6 +446,7 @@ var he = class {
 				devicePixelRatio: this.surface.getDevicePixelRatio(),
 				background: this.getBackground(),
 				paint: !0,
+				textMetrics: this.textMetrics,
 				xIndexManager: this.xIndexManager,
 				opacityLayers: this.opacityLayers
 			})), this.dirtyPickingBuffer = !0;
@@ -454,16 +460,17 @@ var he = class {
 		let t = this.surface.getLogicalCanvasSize();
 		if (isNaN(t.width) || isNaN(t.height)) return;
 		this.surface.clearPickingBuffer();
-		let n = this.pickingRasterizer, r = !1, i = new le({
+		let n = this.pickingRasterizer, r = !1, i = new de({
 			width: t.width,
 			height: t.height,
 			devicePixelRatio: this.surface.getDevicePixelRatio(),
-			getRasterizer: () => (n || (n = new R(this.surface.getPickingBuffer()), this.pickingRasterizer = n), r ||= (n.resetClip(), n.resetStatistics(), !0), n),
+			textMetrics: this.textMetrics,
+			getRasterizer: () => (n || (n = new z(this.surface.getPickingBuffer()), this.pickingRasterizer = n), r ||= (n.resetClip(), n.resetStatistics(), !0), n),
 			xIndexManager: this.xIndexManager
 		}), a = c();
 		a?.beginFrame("canvas", "picking");
 		try {
-			l("picking", () => e.collectRenderCommands(i)), this.dirtyPickingBuffer = !1, r && ge(n, a);
+			l("picking", () => e.collectRenderCommands(i)), this.dirtyPickingBuffer = !1, r && ve(n, a);
 		} finally {
 			a?.endFrame();
 		}
@@ -479,14 +486,14 @@ var he = class {
 		});
 	}
 };
-function ge(e, t) {
+function ve(e, t) {
 	if (!t) return;
 	let n = e.getStatistics();
 	t.addCount("pickingRectangles", n.rectangles), t.addCount("pickingSquares", n.squares), t.addCount("pickingPolygons", n.polygons), t.addCount("pickingSegments", n.segments), t.addCount("pickingCubics", n.cubics), t.addCount("pickingSpans", n.spans);
 }
 //#endregion
 //#region ../core/src/rendering/canvas2d/picking/softwarePickingBuffer.js
-var Q = /* @__PURE__ */ new Uint32Array(), _e = class {
+var Q = /* @__PURE__ */ new Uint32Array(), ye = class {
 	#e = Q;
 	width = 0;
 	height = 0;
@@ -521,7 +528,7 @@ function $(e, t) {
 }
 //#endregion
 //#region ../core/src/rendering/canvas2d/canvas2DSurface.js
-var ve = class {
+var be = class {
 	#e;
 	#t;
 	#n;
@@ -531,7 +538,7 @@ var ve = class {
 		if (!n) throw Error("Unable to initialize a Canvas2D rendering context.");
 		this.canvas = t, this.context = n, e.container.appendChild(t);
 		try {
-			this.#e = new M(e.container, t, e.sizeSource, () => {
+			this.#e = new N(e.container, t, e.sizeSource, () => {
 				this.#i() && e.onCanvasResize();
 			}), this.#i();
 		} catch (e) {
@@ -559,7 +566,7 @@ var ve = class {
 	getPickingBuffer() {
 		if (this.#r) throw Error("Canvas2D surface has been finalized.");
 		let e = this.getLogicalCanvasSize();
-		return this.#n ??= new _e(e.width, e.height), this.#n;
+		return this.#n ??= new ye(e.width, e.height), this.#n;
 	}
 	clearPickingBuffer() {
 		this.#n?.clear();
@@ -593,28 +600,32 @@ var ve = class {
 };
 //#endregion
 //#region ../core/src/rendering/canvas2d/index.js
-function ye(e) {
-	let t = new ve(e);
+function xe(e) {
+	let t = new be(e), n = ne(e.container.ownerDocument);
 	return {
 		surface: t,
-		createRenderCoordinator: (e) => new Z({
+		textMetrics: n,
+		createRenderCoordinator: (e) => new _e({
 			...e,
 			surface: t,
-			context: t.context
+			context: t.context,
+			textMetrics: n
 		}),
-		exportCanvas: (e) => N({
+		exportCanvas: (e) => P({
 			...e,
 			liveSize: t.getLogicalCanvasSize(),
-			liveDevicePixelRatio: t.getDevicePixelRatio()
+			liveDevicePixelRatio: t.getDevicePixelRatio(),
+			textMetrics: n
 		}),
-		exportRaster: (e) => P({
+		exportRaster: (e) => F({
 			...e,
 			liveSize: t.getLogicalCanvasSize(),
-			liveDevicePixelRatio: t.getDevicePixelRatio()
+			liveDevicePixelRatio: t.getDevicePixelRatio(),
+			textMetrics: n
 		}),
-		rasterizeSvgRuns: (e) => F()(e),
+		rasterizeSvgRuns: (e) => I()(e),
 		readPickingId: (e, n) => t.readPickingId(e, n)
 	};
 }
 //#endregion
-export { ye as createCanvas2DRenderingBackend };
+export { xe as createCanvas2DRenderingBackend };

package/dist/{canvasSizeHelper-7h_8rOcx.js → canvasSizeHelper-foL2YvGL.js}

@@ -4,15 +4,15 @@ var e = class {
 		this._container = e, this._canvas = t, this._sizeSource = n, this._onPhysicalSizeChange = r ?? (() => {}), this._logicalCanvasSize = void 0, this._devicePixelContentBoxSize = void 0, this._devicePixelContentBoxObserver = void 0, this._observeDevicePixelContentBox();
 	}
 	invalidate() {
-		this._logicalCanvasSize = void 0, this._devicePixelContentBoxSize = void 0;
+		this._logicalCanvasSize = void 0;
 	}
 	finalize() {
 		this._devicePixelContentBoxObserver && this._devicePixelContentBoxObserver.disconnect();
 	}
 	getPhysicalCanvasSize(e) {
-		if (this._devicePixelContentBoxSize) return this._devicePixelContentBoxSize;
-		let t = window.devicePixelRatio ?? 1;
-		return e ||= this.getLogicalCanvasSize(), {
+		e ||= this.getLogicalCanvasSize();
+		let t = window.devicePixelRatio ?? 1, n = this._devicePixelContentBoxSize;
+		return n && n.logical.width == e.width && n.logical.height == e.height && n.dpr == t ? n.physical : {
 			width: Math.round(e.width * t),
 			height: Math.round(e.height * t)
 		};
@@ -40,10 +40,17 @@ var e = class {
 			let r = Array.isArray(n) ? n[0] : n;
 			if (!r) return;
 			let i = {
-				width: r.inlineSize,
-				height: r.blockSize
-			};
-			this._devicePixelContentBoxSize && this._devicePixelContentBoxSize.width == i.width && this._devicePixelContentBoxSize.height == i.height || (this._devicePixelContentBoxSize = i, this._onPhysicalSizeChange());
+				physical: {
+					width: r.inlineSize,
+					height: r.blockSize
+				},
+				logical: {
+					width: t.contentRect.width,
+					height: t.contentRect.height
+				},
+				dpr: window.devicePixelRatio ?? 1
+			}, a = this._devicePixelContentBoxSize;
+			this._devicePixelContentBoxSize = i, !(a && a.physical.width == i.physical.width && a.physical.height == i.physical.height && a.logical.width == i.logical.width && a.logical.height == i.logical.height && a.dpr == i.dpr) && this._onPhysicalSizeChange();
 		});
 		try {
 			e.observe(this._canvas, { box: "device-pixel-content-box" }), this._devicePixelContentBoxObserver = e;