minerva-design 1.4.0 → 1.6.0

package/dist/charts/engine/orderbook/heatmap.js

@@ -1,31 +1,36 @@
-import { luminance as e, packColor as t, rampColor as n, toCss as r } from "../color.js";
-import { GAP as i } from "../renderers/types.js";
-import { localeLabels as a } from "../locale.js";
-import { linearTicks as o } from "../scale.js";
-import { createRenderer as s } from "../renderers/detect.js";
-import { timeTicks as c } from "../time.js";
-import { createOrderBookStore as l, decimalsOf as u, inferPriceDecimals as d, inferSizeDecimals as f, inferTickSize as ee, roundToStep as te } from "./book.js";
-import { clamp as p, createFormatters as m, ease as ne, fontOf as re, formatClock as ie, roundRect as ae, sideColors as h } from "./format.js";
-import { createEmitter as g, createHost as _, localPoint as v, tooltipHtml as oe } from "./host.js";
+import { luminance as e, mixOklab as t, oklabRamp as n, toCss as r } from "../color.js";
+import { localeLabels as i } from "../locale.js";
+import { linearTicks as a } from "../scale.js";
+import { followDefaultRenderer as o } from "../renderers/follow.js";
+import { timeTicks as s } from "../time.js";
+import { createOrderBookStore as c, decimalsOf as l, inferPriceDecimals as u, inferSizeDecimals as d, inferTickSize as f, roundToStep as p } from "./book.js";
+import { clamp as m, createFormatters as h, ease as g, fontOf as ee, formatClock as te, roundRect as _, sideColors as ne } from "./format.js";
+import { createEmitter as v, createHost as re, localPoint as ie, tooltipHtml as ae } from "./host.js";
+import { HEAT_TABLE_SIZE as y, buildHeatGrid as oe, createHeatFieldRenderer as b, heatTable as x, paintHeatGrid as S, percentile as se } from "./field.js";
+import { fineCeil as ce, fitPriceRange as le, fitTimeRange as ue, layoutAxisLabels as de } from "./layout.js";
 //#region src/engine/orderbook/heatmap.ts
-var y = 32, b = 128, x = [
-	"#0b2a4f",
-	"#12508f",
-	"#1c7fd0",
-	"#25b3d6",
-	"#4fd6a0",
-	"#e9e35a",
-	"#ffa23d",
-	"#ff5533"
-], S = [
-	"#dbeafe",
-	"#93c5fd",
-	"#3b82f6",
-	"#4338ca",
-	"#9333ea",
-	"#db2777",
-	"#f97316"
-], C = {
+var fe = 256, C = 4096, w = .98, pe = 1.4, me = [
+	"#0a1830",
+	"#0f2c57",
+	"#134a8a",
+	"#1670b4",
+	"#1aa0bf",
+	"#2fc3a0",
+	"#8ad65a",
+	"#e8dc3f",
+	"#ffa733",
+	"#ff5a2e"
+], he = [
+	"#eef4fb",
+	"#cfe1f6",
+	"#9fc2ee",
+	"#679ee2",
+	"#3a73cf",
+	"#3f4bb0",
+	"#62309a",
+	"#9c2783",
+	"#d12c52"
+], ge = 16, _e = 6, ve = {
 	en: {
 		time: "Time",
 		price: "Price",
@@ -34,6 +39,8 @@ var y = 32, b = 128, x = [
 		sells: "Sells",
 		bid: "Bid",
 		ask: "Ask",
+		bidSide: "Bid side",
+		askSide: "Ask side",
 		name: "Liquidity heatmap"
 	},
 	zh: {
@@ -44,6 +51,8 @@ var y = 32, b = 128, x = [
 		sells: "主动卖出",
 		bid: "买一",
 		ask: "卖一",
+		bidSide: "买盘",
+		askSide: "卖盘",
 		name: "订单簿热力图"
 	},
 	ja: {
@@ -54,6 +63,8 @@ var y = 32, b = 128, x = [
 		sells: "売り約定",
 		bid: "最良買気配",
 		ask: "最良売気配",
+		bidSide: "買い板",
+		askSide: "売り板",
 		name: "板ヒートマップ"
 	},
 	fr: {
@@ -64,9 +75,11 @@ var y = 32, b = 128, x = [
 		sells: "Ventes",
 		bid: "Meilleur achat",
 		ask: "Meilleure vente",
+		bidSide: "Côté achat",
+		askSide: "Côté vente",
 		name: "Carte de chaleur de la liquidité"
 	}
-}, w = (e, t, n, r) => {
+}, ye = (e, t, n, r) => {
 	if (!(e > 0) || !(t > 0)) return 0;
 	let i = Math.min(1, e * r / t);
 	switch (n) {
@@ -74,8 +87,8 @@ var y = 32, b = 128, x = [
 		case "sqrt": return Math.sqrt(i);
 		default: return Math.log10(1 + 9 * i);
 	}
-}, T = (T, E = {}) => {
-	let D = E, O = l(), k = g(), A = m(D, 2, 4), j = {
+}, T = (T, be = {}) => {
+	let E = be, D = c(), xe = v(), O = h(E, 2, 4), k = {
 		up: [
 			0,
 			0,
@@ -88,65 +101,69 @@ var y = 32, b = 128, x = [
 			0,
 			1
 		]
-	}, M = new Uint32Array(b), N = 0, P = [], se = 0, F = NaN, I = {
+	}, A = new Uint32Array(fe), Se = new Uint32Array(y + 1), j = [
+		0,
+		0,
+		0,
+		1
+	], Ce = !1, M = 0, N = [], we = 0, P = NaN, F = {
 		buyVolume: 0,
 		buyNotional: 0,
 		sellVolume: 0,
 		sellNotional: 0
-	}, L = null, R = NaN, ce = 0, le = 0, ue = 0, z = /* @__PURE__ */ new Map(), B = /* @__PURE__ */ new Set(), de = 0, fe = null, pe = -1, V = {
-		x: NaN,
-		y: NaN
-	}, H = null, me = 0, he = !1, ge = () => {}, _e = new Promise((e) => {
-		ge = e;
-	}), U = !0, W = NaN, G = [0, 1], K = [0, 1], q = NaN, J = NaN, ve = !1, ye = 0, Y = {
+	}, Te = null, I = NaN, Ee = 0, L = 0, R = 0, De = -Infinity, Oe = 0, z = 0, B = null, ke = "", Ae = "", V = null, H = null, je = 0, Me = !1, Ne = () => {}, Pe = new Promise((e) => {
+		Ne = e;
+	}), Fe = !0, U = NaN, W = [0, 1], G = [0, 1], Ie = !1, K = null, q = NaN, J = NaN, Le = 0, Y = {
 		x: 0,
 		y: 0,
 		w: 0,
 		h: 0
-	}, be = null, xe = "", X = null, Z = _(T, {
+	}, Re = null, ze = "", X = null, Z = re(T, {
 		className: "minerva-orderbook-heatmap",
-		draw: Je,
+		draw: pt,
 		onTheme: () => {
-			Ae(), Me();
+			Je(), Z.invalidate();
 		}
-	}), { root: Q, doc: Se } = Z;
+	}), { root: Q, doc: Be } = Z;
 	Q.tabIndex = 0, Q.setAttribute("role", "figure"), Q.style.touchAction = "none";
-	let Ce = a(C, D.locale, D.labels), we = () => Ce, Te = () => {
-		Ce = a(C, D.locale, D.labels), Q.setAttribute("aria-label", D.ariaLabel ?? Ce.name);
-	}, $ = () => Math.max(10, D.interval ?? 100), Ee = () => Math.max($() * 4, D.history ?? 3e5), De = () => Math.max(4, Math.round(D.depth ?? 160)), Oe = () => {
-		if (!Number.isFinite(R)) return Date.now();
-		let e = ke() - ce;
-		return R + Math.min(Math.max(0, e), $() * 3);
-	}, ke = () => typeof performance < "u" ? performance.now() : Date.now();
-	function Ae() {
-		let r = Z.theme;
-		j = h(r, D);
-		let i = (e) => r.resolve ? r.resolve(e, r.primary) : r.primary, a = e(r.background) < .4, o = [r.background, ...(D.colors?.length ? D.colors : a ? x : S).map(i)];
-		M = new Uint32Array(b);
-		for (let e = 0; e < b; e++) {
-			let r = n(o, e / 127);
-			M[e] = t([
-				r[0],
-				r[1],
-				r[2],
+	let Ve = i(ve, E.locale, E.labels), He = () => Ve, Ue = () => {
+		Ve = i(ve, E.locale, E.labels), Q.setAttribute("aria-label", E.ariaLabel ?? Ve.name);
+	}, $ = () => Math.max(10, E.interval ?? 100), We = () => Math.max($() * 4, E.history ?? 3e5), Ge = () => Math.max(4, Math.round(E.depth ?? 160)), Ke = () => {
+		if (!Number.isFinite(I)) return Date.now();
+		let e = qe() - Ee;
+		return I + Math.min(Math.max(0, e), $() * 3);
+	}, qe = () => typeof performance < "u" ? performance.now() : Date.now();
+	function Je() {
+		let t = Z.theme;
+		k = ne(t, E);
+		let r = (e) => {
+			let n = t.resolve ? t.resolve(e, t.primary) : t.primary;
+			return [
+				n[0],
+				n[1],
+				n[2],
 				1
-			]);
-		}
+			];
+		}, i = [
+			t.background[0],
+			t.background[1],
+			t.background[2],
+			1
+		];
+		Ce = t.background[3] > 0 && e(i) < .4;
+		let a = (E.colors?.length ? E.colors : Ce ? me : he).map(r);
+		j = a[0] ?? i, A = n(a.length > 1 ? a : [j, j], fe);
+		let o = E.colorScale ?? "log";
+		Se = x(A, (e) => ye(e, 1, o, 1) ** pe), Ae = "";
 	}
-	let je = () => {
-		A = m(D, N > 0 ? Math.max(u(N), d(O)) : d(O), f(O));
-	}, Me = () => {
-		for (let e of z.keys()) B.add(e);
-		pe = -1, Z.invalidate();
-	}, Ne = () => {
-		P = [], z.clear(), B.clear(), fe = null, pe = -1, F = NaN, V = {
-			x: NaN,
-			y: NaN
-		}, le = 0, ue = 0, I.buyVolume = I.buyNotional = I.sellVolume = I.sellNotional = 0;
-	}, Pe = () => {
-		if (N > 0) return;
-		let e = ee(O), t = O.mid();
-		if (D.tickSize && D.tickSize > 0) N = D.tickSize;
+	let Ye = () => {
+		O = h(E, M > 0 ? Math.max(l(M), u(D)) : u(D), d(D));
+	}, Xe = () => {
+		N = [], B = null, ke = Ae = "", V = null, P = NaN, L = R = 0, De = -Infinity, Oe = 0, z = 0, J = NaN, F.buyVolume = F.buyNotional = F.sellVolume = F.sellNotional = 0;
+	}, Ze = () => {
+		if (M > 0) return;
+		let e = f(D), t = D.mid();
+		if (E.tickSize && E.tickSize > 0) M = E.tickSize;
 		else if (e > 0 && Number.isFinite(t)) {
 			let n = t * 1e-5 / e, r = 1;
 			for (let e = 1; e <= 1e9 && r < n * .75; e *= 10) for (let t of [
@@ -154,20 +171,15 @@ var y = 32, b = 128, x = [
 				2,
 				5
 			]) if (r = t * e, r >= n * .75) break;
-			N = te(e * r, e);
-		} else N = Number.isFinite(t) ? Math.max(1e-8, t * 1e-5) : 0;
-		N > 0 && je();
-	}, Fe = () => {
-		let e = De(), t = new Float64Array(e * 2), n = new Float32Array(e * 2), r = 0, i = [
-			0,
-			0,
-			0,
-			0
-		];
+			M = p(e * r, e);
+		} else M = Number.isFinite(t) ? Math.max(1e-8, t * 1e-5) : 0;
+		M > 0 && Ye();
+	}, Qe = () => {
+		let e = Ge(), t = new Float64Array(e * 2), n = new Float32Array(e * 2), r = 0;
 		for (let i of ["bid", "ask"]) {
-			let a = O.count(i), o = 0;
+			let a = D.count(i), o = 0;
 			for (let s = 0; s < a; s++) {
-				let a = Math.round(O.priceAt(i, s) / N), c = O.sizeAt(i, s);
+				let a = Math.round(D.priceAt(i, s) / M), c = D.sizeAt(i, s);
 				if (r > 0 && t[r - 1] === a && o > 0) {
 					n[r - 1] += c;
 					continue;
@@ -176,381 +188,455 @@ var y = 32, b = 128, x = [
 				t[r] = a, n[r] = c, r++, o++;
 			}
 		}
-		for (let e = 0; e < r; e++) {
-			let t = n[e];
-			t > i[3] && (i[3] = t, i.sort((e, t) => t - e));
-		}
 		return {
-			bins: t.subarray(0, r),
-			sizes: n.subarray(0, r),
-			reference: i[3] || i[0]
+			bins: t.slice(0, r),
+			sizes: n.slice(0, r)
 		};
-	}, Ie = (e) => {
-		if (!(N > 0)) return;
-		let { bins: t, sizes: n, reference: r } = Fe(), i = {
-			seq: se++,
+	}, $e = (e) => {
+		if (!(M > 0)) return;
+		let { bins: t, sizes: n } = Qe(), r = {
+			seq: we++,
 			time: e,
 			bins: t,
 			sizes: n,
-			bestBid: O.bestBid(),
-			bestAsk: O.bestAsk(),
-			buyVolume: I.buyVolume,
-			buyNotional: I.buyNotional,
-			sellVolume: I.sellVolume,
-			sellNotional: I.sellNotional,
-			reference: r
+			bestBid: D.bestBid(),
+			bestAsk: D.bestAsk(),
+			buyVolume: F.buyVolume,
+			buyNotional: F.buyNotional,
+			sellVolume: F.sellVolume,
+			sellNotional: F.sellNotional
 		};
-		if (I.buyVolume = I.buyNotional = I.sellVolume = I.sellNotional = 0, P.push(i), B.add(Math.floor(i.seq / y)), D.maxSize === void 0) {
-			let e = P.slice(-100), t = 0;
-			for (let n of e) t += n.reference;
-			let n = t / e.length * 1.6;
-			if (!(le > 0) || Math.abs(n / le - 1) > .3) {
-				le = n;
-				for (let e of z.keys()) B.add(e);
-				pe = -1;
-			}
-		}
-		let a = e - Ee(), o = 0;
-		for (; o < P.length && P[o].time < a;) o++;
-		if (o) {
-			P = P.slice(o);
-			let e = P[0] ? Math.floor(P[0].seq / y) : Infinity;
-			for (let t of [...z.keys()]) t < e && z.delete(t);
-		}
-	}, Le = (e) => {
+		F.buyVolume = F.buyNotional = F.sellVolume = F.sellNotional = 0, N.push(r);
+		let i = e - We(), a = 0;
+		for (; a < N.length && N[a].time < i;) a++;
+		a && (N = N.slice(a));
+	}, et = (e) => {
 		if (!Number.isFinite(e)) return;
 		let t = $();
-		if (!Number.isFinite(F)) {
-			F = Math.floor(e / t) * t;
+		if (!Number.isFinite(P)) {
+			P = Math.floor(e / t) * t;
 			return;
 		}
-		if (e - F > Ee()) {
-			Ie(F), F = Math.floor(e / t) * t;
+		if (e - P > We()) {
+			$e(P), P = Math.floor(e / t) * t;
 			return;
 		}
-		for (; e >= F + t;) Ie(F), F += t;
-	}, Re = (e) => e === void 0 || !Number.isFinite(e) ? Date.now() : ((!Number.isFinite(R) || e >= R) && (R = e, ce = ke()), e), ze = (e) => {
-		let t = 0, n = P.length - 1, r = $();
-		for (; t <= n;) {
-			let i = t + n >>> 1, a = P[i];
-			if (e < a.time) n = i - 1;
-			else if (e >= a.time + r) t = i + 1;
-			else return a;
+		for (; e >= P + t;) $e(P), P += t;
+	}, tt = (e) => e === void 0 || !Number.isFinite(e) ? Date.now() : ((!Number.isFinite(I) || e >= I) && (I = e, Ee = qe()), e), nt = (e) => {
+		if (Number.isFinite(P) && e >= P) return null;
+		let t = 0, n = N.length;
+		for (; t < n;) {
+			let r = t + n >>> 1;
+			N[r].time <= e ? t = r + 1 : n = r;
 		}
-		return null;
-	}, Be = () => {
-		if (Number.isFinite(V.x)) return;
-		let e = O.mid();
-		V = {
-			x: Number.isFinite(F) ? F : 0,
-			y: Number.isFinite(e) ? e : 0
+		return t > 0 ? N[t - 1] : null;
+	}, rt = () => {
+		if (!Number.isFinite(P) || !(M > 0)) return null;
+		let e = D.version();
+		return (!V || V.version !== e) && (V = {
+			version: e,
+			...Qe()
+		}), {
+			time: P,
+			bins: V.bins,
+			sizes: V.sizes
 		};
-	}, Ve = (e) => {
-		let t = w(e, D.maxSize ?? le, D.colorScale ?? "log", Math.max(.01, D.contrast ?? 1));
-		return Math.round(t * 127);
-	}, He = (e, t) => {
-		let n = $(), r = 0;
-		for (let e of t) for (let t = 0; t < e.sizes.length; t++) Ve(e.sizes[t]) > 0 && r++;
-		let i = /* @__PURE__ */ new ArrayBuffer(Math.max(1, r) * 16), a = new Float32Array(i), o = new Uint32Array(i), s = 0, c = N / 2 * 1.06;
-		for (let e of t) {
-			let t = e.time + n / 2 - V.x;
-			for (let n = 0; n < e.sizes.length; n++) {
-				let r = Ve(e.sizes[n]);
-				if (r <= 0) continue;
-				let i = e.bins[n] * N - V.y;
-				a[s * 4] = t, a[s * 4 + 1] = i - c, a[s * 4 + 2] = i + c, o[s * 4 + 3] = M[r], s++;
-			}
+	}, it = (e, t, n, r, i, a) => {
+		let o = $(), s = rt(), c = Math.min(C, Math.ceil(Y.w)), l = Math.min(C, Math.ceil(Y.h)), u = N.length ? N[N.length - 1].seq : -1, d = [
+			e,
+			t,
+			n,
+			r,
+			Math.floor(i / o),
+			N.length,
+			u,
+			V?.version ?? -1,
+			c,
+			l,
+			M
+		].join("|");
+		if (d !== ke) {
+			let a = s ? [...N, s] : N;
+			B = oe({
+				sources: a,
+				step: o,
+				tick: M,
+				x0: e,
+				x1: t,
+				y0: n,
+				y1: r,
+				end: i,
+				maxWidth: c,
+				maxHeight: l
+			}, B), ke = d, Ae = "";
 		}
-		return {
-			kind: "bar",
-			key: e,
-			version: ++de,
-			color: [
-				1,
-				1,
-				1,
-				1
-			],
-			instances: i,
-			count: r,
-			halfWidth: n / 2 * 1.06,
-			radius: 0,
-			inset: .01,
-			minHalf: 0,
-			sorted: !0
-		};
-	}, Ue = () => {
-		if (B.size) {
-			let e = /* @__PURE__ */ new Map();
-			for (let t of P) {
-				let n = Math.floor(t.seq / y);
-				if (!B.has(n)) continue;
-				let r = e.get(n);
-				r || e.set(n, r = []), r.push(t);
+		if (!B) return null;
+		let f = E.maxSize;
+		if (f !== void 0 && f > 0) L = f;
+		else {
+			let e = qe();
+			if (e - De > 250 || !(R > 0)) {
+				let t = se(B.cells, w);
+				t > 0 && (R = t), De = e;
 			}
-			for (let t of B) {
-				let n = e.get(t);
-				n ? z.set(t, He(`heat:${t}`, n)) : z.delete(t);
-			}
-			B.clear();
+			L > 0 ? R > 0 && Math.abs(R / L - 1) > .001 && (L += (R - L) * g(a, 700)) : L = R;
 		}
-		return [...z.values()];
-	}, We = () => {
-		let e = $(), t = [], n = 0, r = P.length;
+		let p = Math.max(.01, E.contrast ?? 1), m = L > 0 ? y * p / L : 0;
+		return `${B.version}|${m}` !== Ae && (S(B, Se, m), Ae = `${B.version}|${m}`), B;
+	}, at = () => {
+		let e = $(), t = [], n = 0, r = N.length;
 		for (; n < r;) {
 			let t = n + r >>> 1;
-			P[t].time + e < G[0] ? n = t + 1 : r = t;
+			N[t].time + e < W[0] ? n = t + 1 : r = t;
 		}
-		for (let e = n; e < P.length; e++) {
-			let n = P[e];
-			if (n.time > G[1]) break;
+		for (let e = n; e < N.length; e++) {
+			let n = N[e];
+			if (n.time > W[1]) break;
 			t.push(n);
 		}
 		return t;
-	}, Ge = (e) => {
-		if (D.bubbles === !1) return null;
-		let n = $(), r = [], i = (e, t, i, a) => {
-			t > 0 && r.push([
-				e + n / 2,
-				i / t,
-				t,
-				a
-			]);
+	}, ot = (e, t) => {
+		let n = $(), r = Math.max(1, Math.ceil(_e / Math.max(1e-6, t))), i = [], a = NaN, o = 0, s = 0, c = {
+			bv: 0,
+			bn: 0,
+			sv: 0,
+			sn: 0
+		}, l = () => {
+			let e = (o + s) / 2;
+			c.sv > 0 && i.push({
+				time: e,
+				price: c.sn / c.sv,
+				volume: c.sv,
+				buy: !1
+			}), c.bv > 0 && i.push({
+				time: e,
+				price: c.bn / c.bv,
+				volume: c.bv,
+				buy: !0
+			}), c.bv = c.bn = c.sv = c.sn = 0;
+		}, u = (e, t, i) => {
+			let u = Math.floor(e / r);
+			u !== a && (Number.isFinite(a) && l(), a = u, o = t), s = t + n, c.bv += i.buyVolume, c.bn += i.buyNotional, c.sv += i.sellVolume, c.sn += i.sellNotional;
 		};
-		for (let t of e) i(t.time, t.sellVolume, t.sellNotional, !1), i(t.time, t.buyVolume, t.buyNotional, !0);
-		if (Number.isFinite(F) && (i(F, I.sellVolume, I.sellNotional, !1), i(F, I.buyVolume, I.buyNotional, !0)), !r.length) return null;
-		let a = 0;
-		for (let e of r) a = Math.max(a, e[2]);
-		ue = ue > 0 ? Math.max(a, ue * .995) : a;
-		let o = D.bubbleVolume ?? ue, s = Math.max(4, D.bubbleSize ?? 28), c = /* @__PURE__ */ new ArrayBuffer(r.length * 16), l = new Float32Array(c), u = new Uint32Array(c), d = t([
-			j.up[0],
-			j.up[1],
-			j.up[2],
-			.78
-		]), f = t([
-			j.down[0],
-			j.down[1],
-			j.down[2],
-			.78
+		for (let t of e) u(t.seq, t.time, t);
+		return Number.isFinite(P) && P <= W[1] && u(we, P, F), Number.isFinite(a) && l(), i;
+	}, st = (e) => {
+		e.save(), e.beginPath(), e.rect(Y.x, Y.y, Y.w, Y.h), e.clip();
+	}, ct = (e, t, n, i, a) => {
+		if (E.bestLines === !1) return;
+		let o = $(), s = t.map((e) => [
+			e.time,
+			e.time + o,
+			e.bestBid,
+			e.bestAsk
 		]);
-		return r.forEach(([e, t, n, r], i) => {
-			l[i * 4] = e - V.x, l[i * 4 + 1] = t - V.y, l[i * 4 + 2] = p(Math.sqrt(n / o) * s, 3, s), u[i * 4 + 3] = r ? d : f;
-		}), {
-			kind: "scatter",
-			key: "trades",
-			version: ++de,
-			color: j.up,
-			instances: c,
-			count: r.length,
-			opacity: 1,
-			stroke: 1.25
+		if (Number.isFinite(P) && s.push([
+			P,
+			P + o,
+			D.bestBid(),
+			D.bestAsk()
+		]), !s.length) return;
+		for (let e = 0; e + 1 < s.length; e++) s[e][1] = s[e + 1][0];
+		let c = a >= 2, l = (e) => {
+			let t = n(e[0]), r = n(e[1]);
+			return c ? [t, r] : [(t + r) / 2, (t + r) / 2];
 		};
-	}, Ke = (e) => {
-		if (D.bestLines === !1) return [];
-		let t = $(), n = (n, r, a) => {
-			let o = e.length + +!!Number.isFinite(F), s = new Float32Array(o * 4), c = (e, n, r) => {
-				let a = Number.isFinite(r) ? r - V.y : i;
-				s[e * 4] = n - V.x, s[e * 4 + 1] = a, s[e * 4 + 2] = n + t - V.x, s[e * 4 + 3] = a;
-			};
-			if (e.forEach((e, t) => c(t, e.time, r(e))), Number.isFinite(F)) {
-				let t = n === "bid" ? O.bestBid() : O.bestAsk();
-				c(e.length, F, t);
+		st(e), e.beginPath();
+		let u = [], d = () => {
+			if (u.length) {
+				u.forEach((t, n) => {
+					let [r, a] = l(t), o = i(t[3]);
+					n ? e.lineTo(r, o) : e.moveTo(r, o), e.lineTo(a, o);
+				});
+				for (let t = u.length - 1; t >= 0; t--) {
+					let [n, r] = l(u[t]), a = i(u[t][2]);
+					e.lineTo(r, a), e.lineTo(n, a);
+				}
+				e.closePath(), u = [];
+			}
+		};
+		for (let e of s) {
+			let [, , t, n] = e;
+			Number.isFinite(t) && Number.isFinite(n) && n > t ? u.push(e) : d();
+		}
+		d(), e.fillStyle = r(Z.theme.text, Ce ? .08 : .07), e.fill(), e.lineJoin = "round";
+		for (let [t, n] of [[2, k.up], [3, k.down]]) {
+			e.beginPath();
+			let a = !1;
+			for (let n of s) {
+				let r = n[t];
+				if (!Number.isFinite(r)) {
+					a = !1;
+					continue;
+				}
+				let o = i(r), [s, u] = l(n);
+				a ? e.lineTo(s, o) : e.moveTo(s, o), c && e.lineTo(u, o), a = !0;
+			}
+			e.strokeStyle = r(j, .55), e.lineWidth = 3.5, e.stroke(), e.strokeStyle = r(n), e.lineWidth = 1.5, e.stroke();
+		}
+		e.restore();
+	}, lt = (e, n, i, a, o) => {
+		if (!n.length) return;
+		let s = 0;
+		for (let e of n) s = Math.max(s, e.volume);
+		Oe = Oe > 0 ? Math.max(s, Oe * .995) : s;
+		let c = E.bubbleVolume ?? Oe, l = Math.max(4, E.bubbleSize ?? 28), u = n.map((e) => ({
+			...e,
+			d: m(Math.sqrt(e.volume / c) * l, 3, l)
+		})).sort((e, t) => e.d - t.d);
+		st(e), e.lineWidth = 1.25, e.textAlign = "center", e.textBaseline = "middle", e.font = ee(Z.theme, E, 600, Math.max(8, o - 1));
+		for (let n of u) {
+			let o = i(n.time), s = a(n.price), c = n.d / 2;
+			if (o < Y.x - c || o > Y.x + Y.w + c || s < Y.y - c || s > Y.y + Y.h + c) continue;
+			let l = n.buy ? k.up : k.down;
+			if (e.beginPath(), e.arc(o, s, c, 0, Math.PI * 2), e.fillStyle = r(l, .62), e.fill(), e.strokeStyle = r(t(l, [
+				1,
+				1,
+				1,
+				1
+			], .25)), e.stroke(), n.d >= 26) {
+				let t = O.compact(n.volume);
+				e.measureText(t).width <= n.d - 6 && (e.fillStyle = "#fff", e.fillText(t, o, s + .5));
+			}
+		}
+		e.restore();
+	}, ut = (e, t, n, i, a) => {
+		let o = Z.theme, [s, c] = G, l = Math.max(1, M / (c - s) * Y.h), u = 0, d = ["bid", "ask"].map((e) => {
+			let t = D.levels(e, {
+				step: M,
+				limit: Ge()
+			});
+			for (let e = 0; e < t.count; e++) {
+				let n = t.price[e];
+				n >= s && n <= c && (u = Math.max(u, t.size[e]));
 			}
 			return {
-				kind: "line",
-				key: `best:${n}`,
-				version: ++de,
-				color: a,
-				points: s,
-				count: o * 2,
-				width: 1.5,
-				sorted: !0
+				side: e,
+				...t
 			};
+		});
+		if ((u > z || u < z * .6 || !(z > 0)) && (z = ce(u)), !(z > 0)) return;
+		let f = t + 2, p = Math.max(4, n - 6);
+		e.strokeStyle = r(o.text, .07), e.lineWidth = 1, e.setLineDash([2, 3]), e.beginPath();
+		for (let t of [.5, 1]) {
+			let n = Math.round(f + p * t) - .5;
+			e.moveTo(n, Y.y), e.lineTo(n, Y.y + Y.h);
+		}
+		e.stroke(), e.setLineDash([]), e.save(), e.beginPath(), e.rect(t, Y.y, n, Y.h), e.clip();
+		let m = +(l >= 4), h = (t, n) => {
+			let r = Math.round(i(t + M / 2)), a = Math.max(r + 1, Math.round(i(t - M / 2)) - m), o = Math.max(1, Math.min(p, n / z * p));
+			e.rect(f, r, o, a - r);
 		};
-		return [n("bid", (e) => e.bestBid, j.up), n("ask", (e) => e.bestAsk, j.down)];
-	}, qe = () => {
-		if (!Number.isFinite(F) || !(N > 0)) return null;
-		let e = O.version();
-		if (fe && pe === e) return fe;
-		let { bins: t, sizes: n } = Fe();
-		return fe = He("heat:head", [{
-			time: F,
-			bins: t,
-			sizes: n
-		}]), pe = e, fe;
+		for (let { side: t, price: n, size: i, count: a } of d) {
+			let o = t === "bid" ? k.up : k.down;
+			e.beginPath();
+			for (let e = 1; e < a; e++) {
+				let t = n[e];
+				t >= s - M && t <= c + M && h(t, i[e]);
+			}
+			e.fillStyle = r(o, Ce ? .62 : .55), e.fill();
+			let l = n[0];
+			a && l !== void 0 && l >= s && l <= c && (e.beginPath(), h(l, i[0]), e.fillStyle = r(o), e.fill());
+		}
+		e.restore();
+		let g = Math.round(Y.y + Y.h + 4) + .5;
+		e.strokeStyle = r(o.textMuted, .7), e.beginPath(), e.moveTo(f, g), e.lineTo(f + p, g);
+		for (let t of [
+			0,
+			.5,
+			1
+		]) {
+			let n = Math.round(f + p * t) + .5;
+			e.moveTo(n, g), e.lineTo(n, g + 3);
+		}
+		e.stroke(), e.font = ee(o, E, 400, Math.max(8, a - 1)), e.fillStyle = r(o.textMuted), e.textBaseline = "top";
+		let te = O.compact(z), _ = e.measureText(te).width;
+		e.textAlign = "right", e.fillText(te, f + p + 2, g + 4), _ + e.measureText("0").width + 8 < p && (e.textAlign = "left", e.fillText("0", f - 1, g + 4));
+	}, dt = () => {
+		if (!Re || E.tooltip === !1 || !(M > 0) || X || !Ie) return null;
+		let [e, t] = Re;
+		if (e < Y.x || e > Y.x + Y.w || t < Y.y || t > Y.y + Y.h) return null;
+		let [n, r] = W, [i, a] = G, o = n + (e - Y.x) / Y.w * (r - n), s = i + (Y.y + Y.h - t) / Y.h * (a - i), c = Math.round(s / M), u = +(c * M).toFixed(Math.min(12, l(M) + 2)), d = nt(o);
+		return {
+			hx: e,
+			hy: t,
+			time: o,
+			start: d ? d.time : Number.isFinite(P) && o >= P ? P : NaN,
+			column: d,
+			bin: c,
+			rowPrice: u
+		};
+	}, ft = (t, n, i, a, o, s, c, l = "left") => {
+		let u = Math.min(t.measureText(n).width + 10, o), d = l === "center" ? i - u / 2 : i;
+		t.fillStyle = r(c ? s : j), _(t, d, a - ge / 2, u, ge, 3), t.fill(), c || (t.strokeStyle = r(s), t.lineWidth = 1, t.stroke()), t.fillStyle = c ? e(s) > .6 ? "#111" : "#fff" : r(s), t.textAlign = l, t.textBaseline = "middle", t.fillText(n, l === "center" ? i : d + 5, a + .5);
 	};
-	function Je(e) {
+	function pt(e) {
 		let t = Z.ctx;
 		if (!t) return !1;
-		let { width: n, height: i, dpr: a, theme: s } = Z, l = ye ? e - ye : 0;
-		ye = e;
-		let u = we(), d = D.fontSize ?? (n < 420 ? 10 : 11), f = $(), ee = !Number.isFinite(R);
-		ee && O.count("bid") + O.count("ask") > 0 && Le(Date.now());
-		let te = Oe();
-		t.setTransform(a, 0, 0, a, 0, 0), t.clearRect(0, 0, n, i), t.font = re(s, D, 400, d);
-		let m = O.mid(), ie = A.price(Number.isFinite(m) ? m * 1.0001 : 0), h = Math.ceil(t.measureText(ie).width) + 16, g = D.profile === !1 ? 0 : Math.round(p(n * .1, 36, 84)), _ = d + 12;
-		if (Y = {
+		let { width: n, height: i, dpr: o, theme: c } = Z, l = Le ? e - Le : 0;
+		Le = e;
+		let u = He(), d = E.fontSize ?? (n < 420 ? 10 : 11), f = ee(c, E, 400, d), p = ee(c, E, 600, d), h = $(), _ = !Number.isFinite(I);
+		_ && D.count("bid") + D.count("ask") > 0 && et(Date.now());
+		let ne = Ke();
+		J = Number.isFinite(J) && ne > J - h * 4 ? Math.max(J, ne) : ne;
+		let v = J;
+		t.setTransform(o, 0, 0, o, 0, 0), t.clearRect(0, 0, n, i), Ze();
+		let re = D.mid();
+		t.font = p;
+		let ie = O.price(Number.isFinite(re) ? re * 1.0001 : 0), ae = Math.ceil(t.measureText(ie).width) + 18;
+		t.font = f;
+		let y = E.profile === !1 ? 0 : Math.round(m(n * .12, 56, 120)), oe = d + 12;
+		Y = {
 			x: 0,
 			y: 0,
-			w: Math.max(10, n - h - g),
-			h: Math.max(10, i - _)
-		}, Number.isFinite(W) || (W = Math.max(f * 10, D.window ?? 6e4)), (!Number.isFinite(J) || J <= 0) && (Pe(), J = D.priceSpan ?? (N > 0 ? N * 60 : NaN)), U) {
-			let e = te + f * 1.5;
-			G = [e - W, e];
-			let t = O.bestBid(), n = O.bestAsk();
+			w: Math.max(10, n - ae - y),
+			h: Math.max(10, i - oe)
+		};
+		let b = Y.x + Y.w, x = b + y;
+		if (Number.isFinite(U) || (U = Math.max(h * 10, E.window ?? 6e4)), Fe) {
+			let e = N.length ? N[0].time : P;
+			W = ue(e, v, U, Math.min(U, h * 60));
+			let t = D.bestBid(), n = D.bestAsk();
+			for (let e of at()) Number.isFinite(e.bestBid) && !(e.bestBid >= t) && (t = e.bestBid), Number.isFinite(e.bestAsk) && !(e.bestAsk <= n) && (n = e.bestAsk);
 			Number.isFinite(t) || (t = n), Number.isFinite(n) || (n = t);
-			for (let e of We()) e.bestBid < t && (t = e.bestBid), e.bestAsk > n && (n = e.bestAsk);
-			if (Number.isFinite(t) && Number.isFinite(n)) {
-				let e = Number.isFinite(q) ? ne(l, 260) : 1, r = (t + n) / 2;
-				if (q = Number.isFinite(q) ? q + (r - q) * e : r, !ve && D.priceSpan === void 0 && N > 0) {
-					let r = Math.max(N * 60, (n - t) * 1.5);
-					J += (r - J) * e;
+			let r = M > 0 ? M * Math.max(40, Y.h / 6) : 0, i = E.priceSpan ?? (Number.isFinite(q) ? q : void 0);
+			if (r > 0 || i !== void 0) {
+				K = le(K, t, n, r, i);
+				let [e, a] = K;
+				if (Number.isFinite(e) && Number.isFinite(a)) {
+					if (!Ie) G = [e, a], Ie = !0;
+					else {
+						let t = g(l, 280);
+						G = [G[0] + (e - G[0]) * t, G[1] + (a - G[1]) * t];
+					}
 				}
-			} else Number.isFinite(m) && (q = Number.isFinite(q) ? q + (m - q) * ne(l, 220) : m);
-			Number.isFinite(q) && Number.isFinite(J) && (K = [q - J / 2, q + J / 2]);
+			}
 		}
-		let [v, oe] = G, [y, b] = K, x = (e) => Y.x + (e - v) / (oe - v) * Y.w, S = (e) => Y.y + Y.h - (e - y) / (b - y) * Y.h, C = We();
-		if (H && N > 0) {
-			Be();
+		let [S, se] = W, [ce, fe] = G, C = (e) => Y.x + (e - S) / (se - S) * Y.w, w = (e) => Y.y + Y.h - (e - ce) / (fe - ce) * Y.h, pe = Ie && M > 0, me = at(), he = h / (se - S) * Y.w, _e = r(j);
+		if (H) {
 			let e = H.canvas;
 			e.style.left = `${Y.x}px`, e.style.top = `${Y.y}px`, e.style.width = `${Y.w}px`, e.style.height = `${Y.h}px`;
-			let t = Math.max(1, Math.round(Y.w * a)), n = Math.max(1, Math.round(Y.h * a));
+			let t = Math.max(1, Math.round(Y.w * o)), n = Math.max(1, Math.round(Y.h * o));
 			(e.width !== t || e.height !== n) && H.resize(t, n);
-			let r = Ue(), i = qe();
-			i && r.push(i), r.push(...Ke(C));
-			let o = Ge(C);
-			o && r.push(o);
-			let s = 2 / (oe - v), c = 2 / (b - y);
-			H.render(r, {
-				transform: {
-					xScale: s,
-					xOffset: (V.x - v) * s - 1,
-					yScale: c,
-					yOffset: (V.y - y) * c - 1
-				},
-				width: t,
-				height: n,
-				dpr: a
-			});
-		}
-		let w = Y.x + Y.w + g, T = Number.isFinite(y) ? o(y, b, Math.max(2, Math.floor(Y.h / 44))) : [];
-		t.strokeStyle = r(s.text, .07), t.lineWidth = 1, t.beginPath();
-		for (let e of T) {
-			let n = Math.round(S(e)) + .5;
-			t.moveTo(Y.x, n), t.lineTo(w, n);
+			let r = pe && Number.isFinite(P) ? it(S, se, ce, fe, v, l) : null, i = t / Y.w, a = n / Y.h, s = r ? [
+				(C(r.t0) - Y.x) * i,
+				(w(r.p1) - Y.y) * a,
+				(C(r.t1) - Y.x) * i,
+				(w(r.p0) - Y.y) * a
+			] : [
+				0,
+				0,
+				0,
+				0
+			];
+			H.render(r, s, j);
+		} else t.fillStyle = _e, t.fillRect(Y.x, Y.y, Y.w, Y.h);
+		let ve = pe ? a(ce, fe, Math.max(2, Math.floor(Y.h / 44))) : [], ye = s(S, se, Math.max(2, Math.floor(Y.w / 75)), void 0, E.timeZone ?? "local");
+		t.strokeStyle = r(c.text, Ce ? .07 : .09), t.lineWidth = 1, t.beginPath();
+		for (let e of ve) {
+			let n = Math.round(w(e)) + .5;
+			t.moveTo(Y.x, n), t.lineTo(x, n);
 		}
-		t.stroke(), t.fillStyle = r(s.textMuted), t.textAlign = "left", t.textBaseline = "middle";
-		for (let e of T) {
-			let n = S(e);
-			n < 6 || n > Y.h - 6 || t.fillText(A.price(e), w + 6, n);
+		for (let e of ye.values) {
+			let n = Math.round(C(e)) + .5;
+			n <= Y.x + 1 || n >= b - 1 || (t.moveTo(n, Y.y), t.lineTo(n, Y.y + Y.h));
 		}
-		let E = c(v, oe, Math.max(2, Math.floor(Y.w / 90)));
-		t.textAlign = "center", t.textBaseline = "top";
-		for (let e of E.values) {
-			let n = x(e);
-			n < 20 || n > Y.x + Y.w - 20 || t.fillText(E.format(e), n, Y.y + Y.h + 6);
+		t.stroke(), pe && (ct(t, me, C, w, he), E.bubbles !== !1 && lt(t, ot(me, he), C, w, d), y && ut(t, b, y, w, d)), t.strokeStyle = r(c.axis), t.lineWidth = 1, t.beginPath(), t.moveTo(0, Math.round(Y.y + Y.h) + .5), t.lineTo(n, Math.round(Y.y + Y.h) + .5), y && (t.moveTo(Math.round(b) + .5, Y.y), t.lineTo(Math.round(b) + .5, Y.y + Y.h)), t.moveTo(Math.round(x) + .5, Y.y), t.lineTo(Math.round(x) + .5, Y.y + Y.h), t.stroke();
+		let T = pe ? dt() : null;
+		t.font = f;
+		let be = T ? te(Number.isFinite(T.start) ? T.start : T.time, h < 1e3, E.timeZone) : "", xe = T ? t.measureText(be).width / 2 + 8 : 0;
+		t.fillStyle = r(c.textMuted), t.textAlign = "center", t.textBaseline = "top";
+		for (let e of ye.values) {
+			let n = C(e), r = ye.format(e), i = t.measureText(r).width / 2;
+			n - i < Y.x + 2 || n + i > b - 2 || T && Math.abs(n - T.hx) < xe + i || t.fillText(r, n, Y.y + Y.h + 6);
 		}
-		if (t.strokeStyle = r(s.axis), t.beginPath(), t.moveTo(0, Math.round(Y.y + Y.h) + .5), t.lineTo(n, Math.round(Y.y + Y.h) + .5), t.moveTo(Math.round(w) + .5, 0), t.lineTo(Math.round(w) + .5, Y.y + Y.h), t.stroke(), g && N > 0 && Number.isFinite(y)) {
-			let e = Y.x + Y.w;
-			t.fillStyle = r(s.background, .85), t.fillRect(e, Y.y, g, Y.h);
-			let n = Math.max(1, N / (b - y) * Y.h), i = 0, a = ["bid", "ask"].map((e) => {
-				let { price: t, size: n, count: r } = O.levels(e, {
-					step: N,
-					limit: De()
-				});
-				for (let e = 0; e < r; e++) t[e] >= y && t[e] <= b && (i = Math.max(i, n[e]));
-				return {
-					side: e,
-					price: t,
-					size: n,
-					count: r
-				};
-			});
-			for (let { side: o, price: s, size: c, count: l } of a) {
-				t.fillStyle = r(o === "bid" ? j.up : j.down, .6);
-				for (let r = 0; r < l; r++) {
-					let a = s[r];
-					if (a < y || a > b || i <= 0) continue;
-					let o = c[r] / i * (g - 4), l = S(a) - n / 2;
-					t.fillRect(e + 2, l + (n > 3 ? .5 : 0), o, Math.max(1, n - +(n > 3)));
-				}
-			}
-		}
-		let k = (e, i, a) => {
-			if (!Number.isFinite(e) || e < y || e > b) return;
-			let o = p(S(e), 8, Y.h - 8), c = A.price(e);
-			t.font = re(s, D, 600, d);
-			let l = t.measureText(c).width + 10;
-			t.fillStyle = r(a ? i : s.background), ae(t, w + 1, o - 8, Math.min(l, n - w - 2), 16, 3), t.fill(), a || (t.strokeStyle = r(i), t.stroke()), t.fillStyle = a ? "#fff" : r(i), t.textAlign = "left", t.textBaseline = "middle", t.fillText(c, w + 6, o + .5), t.font = re(s, D, 400, d);
-		};
-		k(O.bestBid(), j.up, !0), k(O.bestAsk(), j.down, !0);
-		let M = (e) => !Number.isFinite(e) || Math.abs(S(e) - S(L?.price ?? NaN)) >= 17;
-		L && M(O.bestBid()) && M(O.bestAsk()) && k(L.price, L.side === "buy" ? j.up : j.down, !1), Ye(t, x, S, d, w, u), !H && Z.root.dataset.renderer, Z.describe(`${D.ariaLabel ?? u.name}. ${u.bid} ${A.price(O.bestBid())}, ${u.ask} ${A.price(O.bestAsk())}.`);
-		let P = ee || ke() - ce < 2e3;
-		return U && P && Number.isFinite(F);
+		let A = Te, Se = [{
+			price: D.bestAsk(),
+			color: k.down,
+			filled: !0
+		}, {
+			price: D.bestBid(),
+			color: k.up,
+			filled: !0
+		}];
+		A && A.price !== D.bestBid() && A.price !== D.bestAsk() && Se.push({
+			price: A.price,
+			color: A.side === "buy" ? k.up : k.down,
+			filled: !1
+		});
+		let we = pe ? Se.filter((e) => Number.isFinite(e.price) && e.price >= ce && e.price <= fe) : [], F = T ? Math.round(w(T.rowPrice)) + .5 : NaN, L = de(we.map((e) => ({
+			y: w(e.price),
+			h: ge
+		})), T ? {
+			y: F,
+			h: ge
+		} : null, ve.map(w), d + 2, [Y.y, Y.y + Y.h]);
+		t.fillStyle = r(c.textMuted), t.textAlign = "left", t.textBaseline = "middle", ve.forEach((e, n) => {
+			L.ticks[n] && t.fillText(O.price(e), x + 6, w(e));
+		}), t.font = p, we.forEach((e, i) => {
+			let a = L.pinned[i];
+			if (a == null) return;
+			let o = w(e.price);
+			Math.abs(a - o) > 1 && (t.strokeStyle = r(e.color), t.lineWidth = 1, t.beginPath(), t.moveTo(x - 4, o), t.lineTo(x + 1, a), t.stroke()), ft(t, O.price(e.price), x + 1, a, n - x - 2, e.color, e.filled);
+		}), mt(t, C, w, x, u, T, F, be), t.font = f, Z.describe(`${E.ariaLabel ?? u.name}. ${u.bid} ${O.price(D.bestBid())}, ${u.ask} ${O.price(D.bestAsk())}.`);
+		let R = _ || qe() - Ee < 2e3;
+		return Fe && R && Number.isFinite(P) || Ie && K !== null && Math.abs(G[0] - K[0]) > 1e-9;
 	}
-	function Ye(e, t, n, i, a, o) {
-		let { theme: s } = Z, c = () => {
-			Z.tooltip.style.display = "none", xe && (xe = "", k.emit("hover", null));
-		};
-		if (!be || D.tooltip === !1 || !(N > 0) || X) {
-			c();
-			return;
-		}
-		let [l, d] = be;
-		if (l < Y.x || l > Y.x + Y.w || d < Y.y || d > Y.y + Y.h) {
-			c();
+	function mt(e, t, n, i, a, o, s, c) {
+		let { theme: l } = Z;
+		if (!o) {
+			Z.tooltip.style.display = "none", ze && (ze = "", xe.emit("hover", null));
 			return;
 		}
-		let [f, ee] = G, [te, p] = K, m = f + (l - Y.x) / Y.w * (ee - f), ne = te + (Y.y + Y.h - d) / Y.h * (p - te), h = Math.round(ne / N), g = +(h * N).toFixed(Math.min(12, u(N) + 2)), _ = ze(m), v = $(), y = 0, b = NaN, x = NaN, S = 0, C = 0, w = NaN;
-		if (_) {
-			for (let e = 0; e < _.bins.length; e++) _.bins[e] === h && (y += _.sizes[e]);
-			({bestBid: b, bestAsk: x, buyVolume: S, sellVolume: C} = _), w = _.time;
-		} else if (Number.isFinite(F) && m >= F) {
-			let e = ["bid", "ask"].map((e) => O.levels(e, {
-				step: N,
-				limit: De()
+		let { hx: u, hy: d, time: f, start: p, column: h, bin: g, rowPrice: _ } = o, ne = $(), v = 0, re = NaN, ie = NaN, y = 0, oe = 0;
+		if (h) {
+			for (let e = 0; e < h.bins.length; e++) h.bins[e] === g && (v += h.sizes[e]);
+			({bestBid: re, bestAsk: ie, buyVolume: y, sellVolume: oe} = h);
+		} else if (Number.isFinite(p)) {
+			let e = ["bid", "ask"].map((e) => D.levels(e, {
+				step: M,
+				limit: Ge()
 			}));
-			for (let t of e) for (let e = 0; e < t.count; e++) Math.round(t.price[e] / N) === h && (y += t.size[e]);
-			b = O.bestBid(), x = O.bestAsk(), S = I.buyVolume, C = I.sellVolume, w = F;
+			for (let t of e) for (let e = 0; e < t.count; e++) Math.round(t.price[e] / M) === g && (v += t.size[e]);
+			re = D.bestBid(), ie = D.bestAsk(), y = F.buyVolume, oe = F.sellVolume;
 		}
-		let T = g <= b ? "bid" : g >= x ? "ask" : null;
-		e.strokeStyle = r(s.text, .45), e.setLineDash([3, 3]), e.beginPath(), e.moveTo(Math.round(l) + .5, Y.y), e.lineTo(Math.round(l) + .5, Y.y + Y.h);
-		let E = Math.round(n(g)) + .5;
-		if (e.moveTo(Y.x, E), e.lineTo(a, E), e.stroke(), e.setLineDash([]), Number.isFinite(w)) {
-			let i = t(w), a = t(w + v), o = n(g + N / 2), c = n(g - N / 2);
-			e.strokeStyle = r(s.text, .85), e.strokeRect(i, o, Math.max(2, a - i), Math.max(2, c - o));
+		let b = _ <= re ? "bid" : _ >= ie ? "ask" : null;
+		if (e.strokeStyle = r(l.text, .5), e.lineWidth = 1, e.setLineDash([3, 3]), e.beginPath(), e.moveTo(Math.round(u) + .5, Y.y), e.lineTo(Math.round(u) + .5, Y.y + Y.h), e.moveTo(Y.x, s), e.lineTo(i, s), e.stroke(), e.setLineDash([]), Number.isFinite(p)) {
+			let i = t(p), a = t(p + ne), o = n(_ + M / 2), s = n(_ - M / 2);
+			e.strokeStyle = r(l.text, .85), e.strokeRect(i, o, Math.max(2, a - i), Math.max(2, s - o));
 		}
-		e.font = re(s, D, 600, i);
-		let M = A.price(g), P = Math.min(e.measureText(M).width + 10, Z.width - a - 2);
-		e.fillStyle = r(s.text), ae(e, a + 1, E - 8, P, 16, 3), e.fill(), e.fillStyle = r(s.background), e.textAlign = "left", e.textBaseline = "middle", e.fillText(M, a + 6, E + .5), e.font = re(s, D, 400, i);
-		let se = T === "bid" ? j.up : T === "ask" ? j.down : s.text;
-		oe(Se, Z.tooltip, {
-			text: ie(Number.isFinite(w) ? w : m),
-			color: void 0
+		e.font = ee(l, E, 600, E.fontSize ?? (Z.width < 420 ? 10 : 11)), ft(e, O.price(_), i + 1, s, Z.width - i - 2, l.text, !0), ft(e, c, m(u, Y.x + 40, Y.x + Y.w - 40), Y.y + Y.h + ge / 2 + 2, Y.w, l.text, !0, "center");
+		let x = b === "bid" ? k.up : b === "ask" ? k.down : null;
+		ae(Be, Z.tooltip, {
+			text: te(Number.isFinite(p) ? p : f, !0, E.timeZone),
+			color: void 0,
+			badge: b && x ? {
+				text: b === "bid" ? a.bidSide : a.askSide,
+				color: r(x)
+			} : void 0
 		}, [
-			[o.price, A.price(g)],
-			[o.liquidity, A.size(y)],
-			[o.buys, A.size(S)],
-			[o.sells, A.size(C)]
-		]), Z.tooltip.style.display = "block", Z.tooltip.style.borderLeft = `3px solid ${r(se)}`, Z.placeTooltip(Z.tooltip, l, d, l > Y.w * .6 ? "left" : "right");
-		let L = `${w}|${h}|${y}|${S}|${C}`;
-		if (L !== xe) {
-			xe = L;
+			[a.price, O.price(_)],
+			[a.liquidity, O.size(v)],
+			[a.buys, O.size(y)],
+			[a.sells, O.size(oe)]
+		]), Z.tooltip.style.display = "block", Z.placeTooltip(Z.tooltip, u, d, u > Y.w * .6 ? "left" : "right");
+		let S = `${p}|${g}|${v}|${y}|${oe}`;
+		if (S !== ze) {
+			ze = S;
 			let e = {
-				time: Number.isFinite(w) ? w : m,
-				price: g,
-				size: y,
-				side: T,
-				buyVolume: S,
-				sellVolume: C
+				time: Number.isFinite(p) ? p : f,
+				price: _,
+				size: v,
+				side: b,
+				buyVolume: y,
+				sellVolume: oe
 			};
-			k.emit("hover", e);
+			xe.emit("hover", e);
 		}
 	}
-	let Xe = async (e = /* @__PURE__ */ new Set()) => {
-		let t = ++me, n = await s(D.renderer ?? "auto", () => {
-			let e = Se.createElement("canvas");
+	let ht = async (e = /* @__PURE__ */ new Set()) => {
+		let t = ++je, n = await b(E.renderer ?? "auto", () => {
+			let e = Be.createElement("canvas");
 			return Object.assign(e.style, {
 				position: "absolute",
 				left: "0",
@@ -558,146 +644,151 @@ var y = 32, b = 128, x = [
 				pointerEvents: "none"
 			}), e.setAttribute("aria-hidden", "true"), e;
 		}, (t) => {
-			he || H?.kind !== t || (H.destroy(), H.canvas.remove(), H = null, Xe(/* @__PURE__ */ new Set([...e, t])));
+			Me || H?.kind !== t || (H.destroy(), H.canvas.remove(), H = null, ht(/* @__PURE__ */ new Set([...e, t])));
 		}, e);
-		if (he || t !== me) {
+		if (Me || t !== je) {
 			n?.destroy();
 			return;
 		}
-		H && (H.destroy(), H.canvas.remove()), H = n, n && (Q.dataset.renderer = n.kind, Q.insertBefore(n.canvas, Z.canvas), k.emit("renderer", n.kind)), ge(n?.kind ?? null), Z.invalidate();
-	}, Ze = (e) => {
-		U !== e && (U = e, k.emit("follow", e));
-	}, Qe = (e) => {
-		if (D.interactive === !1) return;
-		let [t, n] = v(Q, e);
+		H && (H.destroy(), H.canvas.remove()), H = n, n ? (Q.dataset.renderer = n.kind, Q.insertBefore(n.canvas, Z.canvas), xe.emit("renderer", n.kind)) : delete Q.dataset.renderer, Ne(n?.kind ?? null), Z.invalidate();
+	}, gt = o(() => E.renderer, () => void ht()), _t = (e) => {
+		Fe !== e && (Fe = e, xe.emit("follow", e));
+	}, vt = (e) => {
+		let t = N.length ? N[0].time : P;
+		if (!Number.isFinite(t)) return e;
+		let n = e[1] - e[0], r = (Number.isFinite(J) ? J : Ke()) + $() + n / 2, i = Math.max(t - n / 2, Math.min(e[0], r - n));
+		return [i, i + n];
+	}, yt = (e) => {
+		if (E.interactive === !1) return;
+		let [t, n] = ie(Q, e);
 		Q.setPointerCapture?.(e.pointerId), X = {
 			x: t,
 			y: n,
-			viewX: [...G],
-			viewY: [...K],
+			viewX: [...W],
+			viewY: [...G],
 			axis: t > Y.x + Y.w,
-			span: K[1] - K[0]
+			span: G[1] - G[0]
 		};
-	}, $e = (e) => {
-		let [t, n] = v(Q, e);
-		if (be = [t, n], X) {
+	}, bt = (e) => {
+		let [t, n] = ie(Q, e);
+		if (Re = [t, n], X) {
 			let e = t - X.x, r = n - X.y;
 			if (X.axis) {
 				let e = X.span * Math.exp(r * .006), t = (X.viewY[0] + X.viewY[1]) / 2;
-				J = e, ve = !0, K = [t - e / 2, t + e / 2], U && (q = t);
+				q = e, G = [t - e / 2, t + e / 2], K = [G[0], G[1]];
 			} else if (Math.abs(e) + Math.abs(r) > 3) {
-				Ze(!1);
+				_t(!1);
 				let t = (X.viewX[1] - X.viewX[0]) / Y.w * e, n = (X.viewY[1] - X.viewY[0]) / Y.h * r;
-				G = [X.viewX[0] - t, X.viewX[1] - t], K = [X.viewY[0] + n, X.viewY[1] + n];
+				W = vt([X.viewX[0] - t, X.viewX[1] - t]), G = [X.viewY[0] + n, X.viewY[1] + n];
 			}
 		}
 		Z.invalidate();
-	}, et = (e) => {
+	}, xt = (e) => {
 		Q.releasePointerCapture?.(e.pointerId), X = null, Z.invalidate();
-	}, tt = () => {
-		X || (be = null, Z.invalidate());
-	}, nt = (e, t) => {
-		let [n, r] = G, i = p((r - n) * e, $() * 10, Ee());
-		if (W = i, !U) {
+	}, St = () => {
+		X || (Re = null, Z.invalidate());
+	}, Ct = (e, t) => {
+		let [n, r] = W, i = m((Fe ? U : r - n) * e, $() * 10, We());
+		if (U = i, !Fe) {
 			let e = n + (t - Y.x) / Y.w * (r - n), a = (e - n) / (r - n);
-			G = [e - i * a, e + i * (1 - a)];
+			W = vt([e - i * a, e + i * (1 - a)]);
 		}
 		Z.invalidate();
-	}, rt = (e) => {
-		let t = p((K[1] - K[0]) * e, N * 6 || 1e-9, Infinity), n = (K[0] + K[1]) / 2;
-		J = t, ve = !0, K = [n - t / 2, n + t / 2], Z.invalidate();
-	}, it = (e) => {
-		if (D.interactive === !1 || !(e.ctrlKey || e.metaKey)) return;
+	}, wt = (e) => {
+		let t = m((G[1] - G[0]) * e, M * 6 || 1e-9, Infinity), n = (G[0] + G[1]) / 2;
+		q = t, G = [n - t / 2, n + t / 2], K = [G[0], G[1]], Z.invalidate();
+	}, Tt = (e) => {
+		if (E.interactive === !1 || !(e.ctrlKey || e.metaKey)) return;
 		e.preventDefault();
-		let [t] = v(Q, e), n = Math.exp(e.deltaY * .002);
-		e.shiftKey || t > Y.x + Y.w ? rt(n) : nt(n, t);
-	}, at = () => {
-		D.interactive !== !1 && ct.resetView();
-	}, ot = (e) => {
-		if (D.interactive !== !1) {
+		let [t] = ie(Q, e), n = Math.exp(e.deltaY * .002);
+		e.shiftKey || t > Y.x + Y.w ? wt(n) : Ct(n, t);
+	}, Et = () => {
+		E.interactive !== !1 && kt.resetView();
+	}, Dt = (e) => {
+		if (E.interactive !== !1) {
 			switch (e.key) {
 				case "+":
 				case "=":
-					nt(.8, Y.x + Y.w);
+					Ct(.8, Y.x + Y.w);
 					break;
 				case "-":
-					nt(1.25, Y.x + Y.w);
+					Ct(1.25, Y.x + Y.w);
 					break;
 				case "ArrowUp":
 				case "ArrowDown": {
 					if (e.shiftKey) {
-						rt(e.key === "ArrowUp" ? .8 : 1.25);
+						wt(e.key === "ArrowUp" ? .8 : 1.25);
 						break;
 					}
-					Ze(!1);
-					let t = (K[1] - K[0]) * .1 * (e.key === "ArrowUp" ? 1 : -1);
-					K = [K[0] + t, K[1] + t], Z.invalidate();
+					_t(!1);
+					let t = (G[1] - G[0]) * .1 * (e.key === "ArrowUp" ? 1 : -1);
+					G = [G[0] + t, G[1] + t], Z.invalidate();
 					break;
 				}
 				case "ArrowLeft":
 				case "ArrowRight": {
-					Ze(!1);
-					let t = (G[1] - G[0]) * .1 * (e.key === "ArrowLeft" ? -1 : 1);
-					G = [G[0] + t, G[1] + t], Z.invalidate();
+					_t(!1);
+					let t = (W[1] - W[0]) * .1 * (e.key === "ArrowLeft" ? -1 : 1);
+					W = vt([W[0] + t, W[1] + t]), Z.invalidate();
 					break;
 				}
 				case "0":
 				case "Home":
-					ct.resetView();
+					kt.resetView();
 					break;
 				default: return;
 			}
 			e.preventDefault();
 		}
 	};
-	Q.addEventListener("pointerdown", Qe), Q.addEventListener("pointermove", $e), Q.addEventListener("pointerup", et), Q.addEventListener("pointercancel", et), Q.addEventListener("pointerleave", tt), Q.addEventListener("wheel", it, { passive: !1 }), Q.addEventListener("dblclick", at), Q.addEventListener("keydown", ot);
-	let st = (e) => {
-		let t = Re(e.time);
-		O.count("bid") + O.count("ask") > 0 && (Pe(), Le(t)), O.applyDelta(e);
-	}, ct = {
+	Q.addEventListener("pointerdown", yt), Q.addEventListener("pointermove", bt), Q.addEventListener("pointerup", xt), Q.addEventListener("pointercancel", xt), Q.addEventListener("pointerleave", St), Q.addEventListener("wheel", Tt, { passive: !1 }), Q.addEventListener("dblclick", Et), Q.addEventListener("keydown", Dt);
+	let Ot = (e) => {
+		let t = tt(e.time);
+		D.count("bid") + D.count("ask") > 0 && (Ze(), et(t)), D.applyDelta(e);
+	}, kt = {
 		setBook(e) {
-			let t = Re(e.time);
-			O.count("bid") + O.count("ask") > 0 && Le(t), O.setSnapshot(e), Pe(), je(), Number.isFinite(F) || Le(t), Z.invalidate();
+			let t = tt(e.time);
+			D.count("bid") + D.count("ask") > 0 && et(t), D.setSnapshot(e), Ze(), Ye(), Number.isFinite(P) || et(t), Z.invalidate();
 		},
 		applyDeltas(e) {
-			if (Array.isArray(e)) for (let t of e) st(t);
-			else st(e);
-			!Number.isFinite(F) && N > 0 && Le(Oe()), Z.invalidate();
+			if (Array.isArray(e)) for (let t of e) Ot(t);
+			else Ot(e);
+			!Number.isFinite(P) && M > 0 && et(Ke()), Z.invalidate();
 		},
 		addTrades(e) {
 			let t = Array.isArray(e) ? e : [e];
 			for (let e of t) {
 				if (!(e.size > 0) || !Number.isFinite(e.price)) continue;
-				Number.isFinite(R) && (Re(e.time), Le(e.time));
-				let t = !Number.isFinite(F) || e.time >= F ? I : ze(e.time);
-				t && (e.side === "buy" ? (t.buyVolume += e.size, t.buyNotional += e.size * e.price) : (t.sellVolume += e.size, t.sellNotional += e.size * e.price)), (!L || e.time >= L.time) && (L = e);
+				Number.isFinite(I) && (tt(e.time), et(e.time));
+				let t = !Number.isFinite(P) || e.time >= P ? F : nt(e.time);
+				t && (e.side === "buy" ? (t.buyVolume += e.size, t.buyNotional += e.size * e.price) : (t.sellVolume += e.size, t.sellNotional += e.size * e.price)), (!Te || e.time >= Te.time) && (Te = e);
 			}
 			Z.invalidate();
 		},
 		clear() {
-			O.clear(), Ne(), L = null, R = NaN, N = 0, q = NaN, J = NaN, ve = !1, Z.invalidate();
+			D.clear(), Xe(), Te = null, I = NaN, M = 0, q = NaN, K = null, Ie = !1, Z.invalidate();
 		},
 		setOptions(e) {
-			let t = D;
-			D = e, Te(), (e.tickSize !== t.tickSize || (e.interval ?? 100) !== (t.interval ?? 100)) && (Ne(), N = 0, J = NaN, Pe()), e.window !== t.window && (W = NaN), e.priceSpan !== t.priceSpan && (J = NaN), (e.renderer ?? "auto") !== (t.renderer ?? "auto") && Xe(), Ae(), je(), Me();
+			let t = E;
+			E = e, Ue(), (e.tickSize !== t.tickSize || (e.interval ?? 100) !== (t.interval ?? 100)) && (Xe(), M = 0, q = NaN, Ze()), e.window !== t.window && (U = NaN), e.priceSpan !== t.priceSpan && (q = NaN), (e.renderer ?? "auto") !== (t.renderer ?? "auto") && ht(), Je(), Ye(), Z.invalidate();
 		},
 		resetView() {
-			W = NaN, J = NaN, ve = !1, q = NaN, Ze(!0), Z.invalidate();
+			U = NaN, q = NaN, K = null, _t(!0), Z.invalidate();
 		},
 		getRenderer: () => H?.kind ?? null,
-		ready: _e,
-		getStore: () => O,
-		on: (e, t) => k.on(e, t),
+		ready: Pe,
+		getStore: () => D,
+		on: (e, t) => xe.on(e, t),
 		resize() {
 			Z.invalidate();
 		},
 		destroy() {
-			he = !0, Q.removeEventListener("pointerdown", Qe), Q.removeEventListener("pointermove", $e), Q.removeEventListener("pointerup", et), Q.removeEventListener("pointercancel", et), Q.removeEventListener("pointerleave", tt), Q.removeEventListener("wheel", it), Q.removeEventListener("dblclick", at), Q.removeEventListener("keydown", ot), H?.destroy(), H = null, k.clear(), Z.destroy(), ge(null);
+			Me = !0, gt(), Q.removeEventListener("pointerdown", yt), Q.removeEventListener("pointermove", bt), Q.removeEventListener("pointerup", xt), Q.removeEventListener("pointercancel", xt), Q.removeEventListener("pointerleave", St), Q.removeEventListener("wheel", Tt), Q.removeEventListener("dblclick", Et), Q.removeEventListener("keydown", Dt), H?.destroy(), H = null, xe.clear(), Z.destroy(), Ne(null);
 		}
 	};
-	return Te(), Ae(), Xe(), ct;
+	return Ue(), Je(), ht(), kt;
 };
 //#endregion
-export { T as createOrderBookHeatmap, w as heatIntensity };
+export { T as createOrderBookHeatmap, ye as heatIntensity };
 
 //# sourceMappingURL=heatmap.js.map