minerva-design 1.2.0 → 1.3.0

package/dist/weapp/controls.js

@@ -6364,6 +6364,118 @@ var mix = (a, b, t) => [
 	a[2] + (b[2] - a[2]) * t,
 	a[3] + (b[3] - a[3]) * t
 ];
+/** Inverse of `packColor` */
+var unpackColor = (packed) => [
+	(packed & 255) / 255,
+	(packed >>> 8 & 255) / 255,
+	(packed >>> 16 & 255) / 255,
+	(packed >>> 24 & 255) / 255
+];
+/** Color at `t` (0-1) of a ramp through `stops` */
+var rampColor = (stops, t) => {
+	if (stops.length === 1) return stops[0];
+	const p = clamp01(t) * (stops.length - 1);
+	const i = Math.min(stops.length - 2, Math.floor(p));
+	return mix(stops[i], stops[i + 1], p - i);
+};
+/**
+* Points of the curve through `x[i], y[i]` (`i` in `[start, end)`), as
+* interleaved x, y, plus the index of the source point each output point
+* belongs to. Gaps (non-finite y) are kept.
+*/
+var curvePoints = (x, y, start, end, curve) => {
+	const n = Math.max(0, end - start);
+	if (curve === "step") {
+		const points = new Float64Array(n * 4);
+		const source = new Uint32Array(n * 2);
+		let length = 0;
+		for (let i = start; i < end; i++) {
+			if (i > start && Number.isFinite(y[i - 1]) && Number.isFinite(y[i])) {
+				points[length * 2] = x[i];
+				points[length * 2 + 1] = y[i - 1];
+				source[length++] = i - 1;
+			}
+			points[length * 2] = x[i];
+			points[length * 2 + 1] = y[i];
+			source[length++] = i;
+		}
+		return {
+			points,
+			source,
+			length
+		};
+	}
+	if (curve !== "smooth" || n < 3 || n > 5e4) {
+		const points = new Float64Array(n * 2);
+		const source = new Uint32Array(n);
+		for (let i = start; i < end; i++) {
+			points[(i - start) * 2] = x[i];
+			points[(i - start) * 2 + 1] = y[i];
+			source[i - start] = i;
+		}
+		return {
+			points,
+			source,
+			length: n
+		};
+	}
+	const tangents = new Float64Array(n);
+	const valid = (i) => i >= start && i < end && Number.isFinite(y[i]) && Number.isFinite(x[i]);
+	const slope = (i) => {
+		const dx = x[i + 1] - x[i];
+		return dx !== 0 ? (y[i + 1] - y[i]) / dx : 0;
+	};
+	for (let i = start; i < end; i++) {
+		if (!valid(i)) continue;
+		const hasPrev = valid(i - 1);
+		const hasNext = valid(i + 1);
+		let m;
+		if (hasPrev && hasNext) {
+			const a = slope(i - 1);
+			const b = slope(i);
+			if (a * b <= 0) m = 0;
+			else {
+				const ha = x[i] - x[i - 1];
+				const hb = x[i + 1] - x[i];
+				const w1 = 2 * hb + ha;
+				const w2 = hb + 2 * ha;
+				m = (w1 + w2) / (w1 / a + w2 / b);
+			}
+		} else if (hasNext) m = slope(i);
+		else if (hasPrev) m = slope(i - 1);
+		else m = 0;
+		tangents[i - start] = m;
+	}
+	const points = new Float64Array((n - 1) * 10 * 2 + 2);
+	const source = new Uint32Array((n - 1) * 10 + 1);
+	let length = 0;
+	for (let i = start; i < end; i++) {
+		points[length * 2] = x[i];
+		points[length * 2 + 1] = y[i];
+		source[length++] = i;
+		if (!valid(i) || !valid(i + 1)) continue;
+		const x0 = x[i];
+		const y0 = y[i];
+		const h = x[i + 1] - x0;
+		const m0 = tangents[i - start] * h;
+		const m1 = tangents[i + 1 - start] * h;
+		const y1 = y[i + 1];
+		for (let k = 1; k < 10; k++) {
+			const t = k / 10;
+			const t2 = t * t;
+			const t3 = t2 * t;
+			const v = (2 * t3 - 3 * t2 + 1) * y0 + (t3 - 2 * t2 + t) * m0 + (-2 * t3 + 3 * t2) * y1 + (t3 - t2) * m1;
+			points[length * 2] = x0 + h * t;
+			points[length * 2 + 1] = v;
+			source[length++] = i;
+		}
+	}
+	return {
+		points,
+		source,
+		length
+	};
+};
 //#endregion
 //#region ../charts/src/engine/data.ts
 var isColumns = (data) => typeof data === "object" && data !== null && !("length" in data) && "y" in data;
@@ -6382,6 +6494,27 @@ var xResolver = (type, categoryIndex) => {
 	};
 };
 var toNumber = (v) => typeof v === "number" ? v : v === null || v === void 0 ? NaN : Number(v);
+/** Category names used by string y values (heatmap rows), in order of appearance */
+var collectYCategories = (datas) => {
+	const seen = /* @__PURE__ */ new Set();
+	for (const data of datas) {
+		if (isColumns(data)) {
+			const ys = data.y;
+			if (!ArrayBuffer.isView(ys)) for (let i = 0; i < ys.length; i++) {
+				const v = ys[i];
+				if (typeof v === "string") seen.add(v);
+			}
+			continue;
+		}
+		const list = data;
+		for (let i = 0; i < list.length; i++) {
+			const item = list[i];
+			const v = Array.isArray(item) ? item[1] : item && typeof item === "object" ? item.y : void 0;
+			if (typeof v === "string") seen.add(v);
+		}
+	}
+	return [...seen];
+};
 /** Category names used by string x values, in order of appearance */
 var collectCategories = (datas) => {
 	const seen = /* @__PURE__ */ new Set();
@@ -6410,6 +6543,7 @@ var finalize = (x, y, count, extra) => {
 	let yMax = -Infinity;
 	let sorted = true;
 	let prev = -Infinity;
+	const { high, low, value } = extra;
 	for (let i = 0; i < count; i++) {
 		const xi = x[i];
 		if (!Number.isFinite(xi)) {
@@ -6424,6 +6558,24 @@ var finalize = (x, y, count, extra) => {
 		if (xi > xMax) xMax = xi;
 		if (yi < yMin) yMin = yi;
 		if (yi > yMax) yMax = yi;
+		if (high) {
+			const h = high[i];
+			if (h > yMax) yMax = h;
+			if (h < yMin) yMin = h;
+		}
+		if (low) {
+			const l = low[i];
+			if (l < yMin) yMin = l;
+			if (l > yMax) yMax = l;
+		}
+	}
+	let valueMin = Infinity;
+	let valueMax = -Infinity;
+	if (value) for (let i = 0; i < count; i++) {
+		const v = value[i];
+		if (!Number.isFinite(v)) continue;
+		if (v < valueMin) valueMin = v;
+		if (v > valueMax) valueMax = v;
 	}
 	const empty = xMin > xMax;
 	return {
@@ -6435,24 +6587,44 @@ var finalize = (x, y, count, extra) => {
 		xMax: empty ? NaN : xMax,
 		yMin: empty ? NaN : yMin,
 		yMax: empty ? NaN : yMax,
+		valueMin: valueMin > valueMax ? NaN : valueMin,
+		valueMax: valueMin > valueMax ? NaN : valueMax,
 		...extra
 	};
 };
+var column = (values, count) => {
+	if (!values) return null;
+	if (values instanceof Float64Array && values.length >= count) return values.length === count ? values : values.subarray(0, count);
+	const out = new Float64Array(count);
+	for (let i = 0; i < count; i++) out[i] = toNumber(values[i]);
+	return out;
+};
 /** Turns any supported data form into columns */
-var normalizeData = (data, resolveX) => {
+var normalizeData = (data, resolveX, resolveY = toNumber) => {
 	const none = {
 		size: null,
 		colors: null,
-		labels: null
+		labels: null,
+		open: null,
+		high: null,
+		low: null,
+		value: null
 	};
 	if (isColumns(data)) {
 		const count = data.y.length;
 		const x = new Float64Array(count);
-		const y = new Float64Array(count);
 		const xs = data.x;
-		for (let i = 0; i < count; i++) {
-			y[i] = toNumber(data.y[i]);
-			x[i] = xs ? resolveX(xs[i], i) : i;
+		if (!xs) for (let i = 0; i < count; i++) x[i] = i;
+		else if (ArrayBuffer.isView(xs) && xs.length >= count) x.set(xs.length === count ? xs : xs.subarray(0, count));
+		else for (let i = 0; i < count; i++) x[i] = resolveX(xs[i], i);
+		const ys = data.y;
+		let y;
+		if (ArrayBuffer.isView(ys)) {
+			y = new Float64Array(count);
+			y.set(ys);
+		} else {
+			y = new Float64Array(count);
+			for (let i = 0; i < count; i++) y[i] = resolveY(ys[i]);
 		}
 		let size = null;
 		if (data.size) {
@@ -6461,7 +6633,11 @@ var normalizeData = (data, resolveX) => {
 		}
 		return finalize(x, y, count, {
 			...none,
-			size
+			size,
+			open: column(data.open, count),
+			high: column(data.high, count),
+			low: column(data.low, count),
+			value: column(data.value, count)
 		});
 	}
 	const list = data;
@@ -6471,6 +6647,11 @@ var normalizeData = (data, resolveX) => {
 	let size = null;
 	let colors = null;
 	let labels = null;
+	let open = null;
+	let high = null;
+	let low = null;
+	let value = null;
+	const nanColumn = () => new Float64Array(count).fill(NaN);
 	for (let i = 0; i < count; i++) {
 		const item = list[i];
 		if (item === null || item === void 0 || typeof item === "number") {
@@ -6478,11 +6659,11 @@ var normalizeData = (data, resolveX) => {
 			y[i] = toNumber(item);
 		} else if (Array.isArray(item)) {
 			x[i] = resolveX(item[0], i);
-			y[i] = toNumber(item[1]);
+			y[i] = resolveY(item[1]);
 		} else if (typeof item === "object") {
 			const d = item;
 			x[i] = d.x === void 0 ? i : resolveX(d.x, i);
-			y[i] = toNumber(d.y);
+			y[i] = resolveY(d.y);
 			if (d.size !== void 0) {
 				size ??= new Float32Array(count).fill(NaN);
 				size[i] = d.size;
@@ -6495,6 +6676,10 @@ var normalizeData = (data, resolveX) => {
 				labels ??= new Array(count);
 				labels[i] = d.label;
 			}
+			if (d.open !== void 0) (open ??= nanColumn())[i] = toNumber(d.open);
+			if (d.high !== void 0) (high ??= nanColumn())[i] = toNumber(d.high);
+			if (d.low !== void 0) (low ??= nanColumn())[i] = toNumber(d.low);
+			if (d.value !== void 0) (value ??= nanColumn())[i] = toNumber(d.value);
 		} else {
 			x[i] = i;
 			y[i] = NaN;
@@ -6503,7 +6688,11 @@ var normalizeData = (data, resolveX) => {
 	return finalize(x, y, count, {
 		size,
 		colors,
-		labels
+		labels,
+		open,
+		high,
+		low,
+		value
 	});
 };
 /** First index whose x is >= value (sorted x) */
@@ -6802,18 +6991,94 @@ var extent = (values) => {
 	}
 	return [min, max];
 };
-/** Smallest positive gap between consecutive x values (bar width on numeric axes) */
-var smallestStep = (cols) => {
+/** Smallest positive gap between consecutive values (bar width on numeric axes) */
+var smallestStep = (columns, sorted) => {
 	let step = Infinity;
-	for (const c of cols) {
-		const xs = c.sorted ? c.x : Float64Array.from(c.x).sort();
-		for (let i = 1; i < c.count; i++) {
+	columns.forEach((values, k) => {
+		const xs = sorted[k] ? values : Float64Array.from(values).sort();
+		for (let i = 1; i < xs.length; i++) {
 			const d = xs[i] - xs[i - 1];
 			if (d > 0 && d < step) step = d;
 		}
-	}
+	});
 	return step;
 };
+var bandOf = (list, axis, category) => {
+	if (category) return 1;
+	const step = smallestStep(list.map((s) => axis === "x" ? s.cols.x : s.cols.y), list.map((s) => axis === "x" && s.cols.sorted));
+	return Number.isFinite(step) ? step : 1;
+};
+/**
+* Stacks the y values of series sharing a stack id (positive and negative
+* values separately); `percent` scales every stack to 100 at each x
+*/
+var stackValues = (list, percent) => {
+	const totals = /* @__PURE__ */ new Map();
+	if (percent) for (const { s, stack } of list) {
+		let byX = totals.get(stack);
+		if (!byX) totals.set(stack, byX = /* @__PURE__ */ new Map());
+		const { x, y, count } = s.cols;
+		for (let i = 0; i < count; i++) {
+			const v = y[i];
+			if (!Number.isFinite(v)) continue;
+			const t = byX.get(x[i]) ?? [0, 0];
+			if (v >= 0) t[0] += v;
+			else t[1] -= v;
+			byX.set(x[i], t);
+		}
+	}
+	const running = /* @__PURE__ */ new Map();
+	const members = /* @__PURE__ */ new Map();
+	for (const { stack } of list) members.set(stack, (members.get(stack) ?? 0) + 1);
+	return list.map(({ s, stack }) => {
+		const { x, y, count } = s.cols;
+		if (!percent && members.get(stack) === 1) {
+			const base = new Float64Array(count);
+			const top = new Float64Array(count);
+			for (let i = 0; i < count; i++) {
+				const v = y[i];
+				const valid = Number.isFinite(v);
+				base[i] = valid ? 0 : NaN;
+				top[i] = valid ? v : NaN;
+			}
+			return {
+				base,
+				top
+			};
+		}
+		let byX = running.get(stack);
+		if (!byX) running.set(stack, byX = /* @__PURE__ */ new Map());
+		const sums = totals.get(stack);
+		const base = new Float64Array(count);
+		const top = new Float64Array(count);
+		for (let i = 0; i < count; i++) {
+			let v = y[i];
+			if (!Number.isFinite(v)) {
+				base[i] = NaN;
+				top[i] = NaN;
+				continue;
+			}
+			if (sums) {
+				const t = sums.get(x[i]);
+				const total = t ? v >= 0 ? t[0] : t[1] : 0;
+				v = total > 0 ? v / total * 100 : 0;
+			}
+			const t = byX.get(x[i]) ?? [0, 0];
+			const b = v >= 0 ? t[0] : t[1];
+			base[i] = b;
+			top[i] = b + v;
+			if (v >= 0) t[0] += v;
+			else t[1] += v;
+			byX.set(x[i], t);
+		}
+		return {
+			base,
+			top
+		};
+	});
+};
+var DEFAULT_UP = "var(--success-color, #16a34a)";
+var DEFAULT_DOWN = "var(--danger-color, #dc2626)";
 var buildModel = (options, theme, hidden, cache, resolver = null) => {
 	const resolve = resolver ?? theme.resolve ?? ((value, fallback) => resolveStaticColor(value, {}, fallback));
 	const input = options.series;
@@ -6822,7 +7087,14 @@ var buildModel = (options, theme, hidden, cache, resolver = null) => {
 	const categories = xType === "category" ? [...options.xAxis?.categories ?? collectCategories(datas)] : [];
 	const categoryMap = new Map(categories.map((c, i) => [c, i]));
 	const resolveX = xResolver(xType, (name) => categoryMap.get(name) ?? NaN);
-	const resolverKey = `${xType}|${categories.join("
")}`;
+	const yOpts = options.yAxis;
+	const heatmapData = input.filter((s) => s.type === "heatmap").map((s) => s.data);
+	const yCategories = yOpts?.type === "category" || !yOpts?.type && heatmapData.length ? [...yOpts?.categories ?? collectYCategories(heatmapData)] : [];
+	const yType = yOpts?.type === "category" || yCategories.length ? "category" : yOpts?.type === "time" ? "time" : "linear";
+	const yCategoryMap = new Map(yCategories.map((c, i) => [c, i]));
+	const resolveY = (v) => typeof v === "number" ? v : typeof v === "string" ? yType === "category" ? yCategoryMap.get(v) ?? NaN : Number(v) : NaN;
+	const resolverKey = `${xType}|${categories.join("
")}|${yType}|${yCategories.join("
")}`;
+	const percent = options.stackMode === "percent";
 	const usedKeys = /* @__PURE__ */ new Set();
 	const series = input.map((s, index) => {
 		let key = s.id ?? `#${index}`;
@@ -6833,15 +7105,16 @@ var buildModel = (options, theme, hidden, cache, resolver = null) => {
 			entry = {
 				data: s.data,
 				resolverKey,
-				cols: normalizeData(s.data, resolveX)
+				cols: normalizeData(s.data, resolveX, resolveY)
 			};
 			cache.set(key, entry);
 		}
 		const type = s.type ?? "line";
-		const color = s.color ? resolve(s.color, theme.palette[index % theme.palette.length]) : theme.palette[index % theme.palette.length];
+		const paletteColor = theme.palette[index % theme.palette.length];
+		const color = s.color ? resolve(s.color, paletteColor) : paletteColor;
 		const cols = entry.cols;
 		let pointColors = null;
-		if (type === "scatter" && cols.colors) {
+		if ((type === "scatter" || type === "bar") && cols.colors) {
 			const resolved = /* @__PURE__ */ new Map();
 			pointColors = cols.colors.map((c) => {
 				if (c === void 0) return void 0;
@@ -6850,6 +7123,23 @@ var buildModel = (options, theme, hidden, cache, resolver = null) => {
 				return rgba;
 			});
 		}
+		let colorScale = [];
+		let valueRange = [0, 1];
+		let cellColors = null;
+		if (type === "heatmap") {
+			colorScale = s.colorScale && s.colorScale.length ? s.colorScale.map((c) => resolve(c, color)) : [mix(theme.background, color, .08), color];
+			valueRange = s.valueRange ? [s.valueRange[0], s.valueRange[1]] : [cols.valueMin, cols.valueMax];
+			if (!Number.isFinite(valueRange[0])) valueRange = [0, 1];
+			const values = cols.value ?? cols.y;
+			const [lo, hi] = valueRange;
+			const span = hi - lo || 1;
+			cellColors = new Uint32Array(cols.count);
+			for (let i = 0; i < cols.count; i++) {
+				const v = values[i];
+				if (!Number.isFinite(v) || !Number.isFinite(cols.y[i])) continue;
+				cellColors[i] = packColor(rampColor(colorScale, (v - lo) / span));
+			}
+		}
 		const id = s.id ?? String(index);
 		return {
 			index,
@@ -6859,61 +7149,93 @@ var buildModel = (options, theme, hidden, cache, resolver = null) => {
 			type,
 			color,
 			colorCss: toCss(color),
-			lineWidth: s.lineWidth ?? 2,
+			lineWidth: s.lineWidth ?? (type === "candlestick" ? 1 : 2),
 			pointSize: s.pointSize ?? 8,
 			opacity: s.opacity ?? (type === "area" ? .28 : type === "scatter" ? .78 : 1),
 			hidden: !!s.hidden || hidden.has(id),
 			showLabels: !!s.showLabels,
+			curve: s.curve ?? "linear",
 			cols,
 			barOffset: 0,
 			barHalfWidth: 0,
 			barBase: null,
 			barTop: null,
-			pointColors
+			stackBase: null,
+			stackTop: null,
+			pointColors,
+			upColor: type === "candlestick" ? resolve(s.upColor ?? DEFAULT_UP, [
+				.09,
+				.64,
+				.29,
+				1
+			]) : color,
+			downColor: type === "candlestick" ? resolve(s.downColor ?? DEFAULT_DOWN, [
+				.86,
+				.15,
+				.15,
+				1
+			]) : color,
+			cellColors,
+			cellHalf: {
+				x: .5,
+				y: .5
+			},
+			colorScale,
+			valueRange,
+			radius: s.radius ?? (type === "heatmap" ? 2 : 3),
+			format: s.format
 		};
 	});
 	const visible = series.filter((s) => !s.hidden);
-	const allScatter = series.length > 0 && series.every((s) => s.type === "scatter");
+	const allScatter = series.length > 0 && series.every((s) => s.type === "scatter" || s.type === "heatmap");
 	const bars = visible.filter((s) => s.type === "bar");
-	const band = xType === "category" ? 1 : (() => {
-		const step = smallestStep(bars.map((s) => s.cols));
-		return Number.isFinite(step) ? step : 1;
-	})();
+	const band = bandOf(bars, "x", xType === "category");
 	if (bars.length) {
 		const slots = /* @__PURE__ */ new Map();
-		for (const s of bars) {
-			const stack = input[s.index].stack ?? `\u0000${s.key}`;
-			if (!slots.has(stack)) slots.set(stack, slots.size);
-		}
+		const stackId = (s) => input[s.index].stack ?? `\u0000${s.key}`;
+		for (const s of bars) if (!slots.has(stackId(s))) slots.set(stackId(s), slots.size);
 		const group = band * (slots.size > 1 ? .78 : .62);
 		const slotWidth = group / slots.size;
-		const sums = /* @__PURE__ */ new Map();
-		for (const s of bars) {
-			const stack = input[s.index].stack ?? `\u0000${s.key}`;
-			const slot = slots.get(stack) ?? 0;
+		const stacked = stackValues(bars.map((s) => ({
+			s,
+			stack: stackId(s)
+		})), false);
+		const percentStacked = percent ? stackValues(bars.filter((s) => input[s.index].stack !== void 0).map((s) => ({
+			s,
+			stack: stackId(s)
+		})), true) : [];
+		let p = 0;
+		bars.forEach((s, k) => {
+			const slot = slots.get(stackId(s)) ?? 0;
 			s.barOffset = -group / 2 + slotWidth * (slot + .5);
 			s.barHalfWidth = slotWidth / 2 * (slots.size > 1 ? .86 : 1);
-			let totals = sums.get(stack);
-			if (!totals) sums.set(stack, totals = /* @__PURE__ */ new Map());
-			const { x, y, count } = s.cols;
-			s.barBase = new Float64Array(count);
-			s.barTop = new Float64Array(count);
-			for (let i = 0; i < count; i++) {
-				const v = y[i];
-				if (!Number.isFinite(v)) {
-					s.barBase[i] = NaN;
-					s.barTop[i] = NaN;
-					continue;
-				}
-				const t = totals.get(x[i]) ?? [0, 0];
-				const base = v >= 0 ? t[0] : t[1];
-				s.barBase[i] = base;
-				s.barTop[i] = base + v;
-				if (v >= 0) t[0] += v;
-				else t[1] += v;
-				totals.set(x[i], t);
-			}
-		}
+			const values = percent && input[s.index].stack !== void 0 ? percentStacked[p++] : stacked[k];
+			s.barBase = values.base;
+			s.barTop = values.top;
+		});
+	}
+	const stackedLines = visible.filter((s) => (s.type === "line" || s.type === "area") && input[s.index].stack !== void 0);
+	if (stackedLines.length) {
+		const values = stackValues(stackedLines.map((s) => ({
+			s,
+			stack: input[s.index].stack ?? ""
+		})), percent);
+		stackedLines.forEach((s, k) => {
+			s.stackBase = values[k].base;
+			s.stackTop = values[k].top;
+		});
+	}
+	const candles = visible.filter((s) => s.type === "candlestick");
+	const candleBand = bandOf(candles, "x", xType === "category");
+	for (const s of candles) s.barHalfWidth = candleBand * .3;
+	const heatmaps = visible.filter((s) => s.type === "heatmap");
+	if (heatmaps.length) {
+		const cx = bandOf(heatmaps, "x", xType === "category") / 2;
+		const cy = bandOf(heatmaps, "y", yType === "category") / 2;
+		for (const s of heatmaps) s.cellHalf = {
+			x: cx,
+			y: cy
+		};
 	}
 	const xOpts = options.xAxis;
 	let xRange;
@@ -6922,31 +7244,48 @@ var buildModel = (options, theme, hidden, cache, resolver = null) => {
 		const values = [];
 		for (const s of visible) {
 			values.push(s.cols.xMin, s.cols.xMax);
-			if (s.type === "bar") values.push(s.cols.xMin - band / 2, s.cols.xMax + band / 2);
+			const pad = s.type === "bar" ? band / 2 : s.type === "candlestick" ? candleBand / 2 : s.type === "heatmap" ? s.cellHalf.x : 0;
+			if (pad) values.push(s.cols.xMin - pad, s.cols.xMax + pad);
 		}
 		xRange = ensureSpan(...extent(values), xType === "time" ? [Date.now() - 864e5, Date.now()] : [0, 1]);
-		if (allScatter) {
+		const pointsOnly = series.every((s) => s.type === "scatter");
+		if (pointsOnly) {
 			const pad = (xRange[1] - xRange[0]) * .04;
 			xRange = [xRange[0] - pad, xRange[1] + pad];
 		}
-		if ((xOpts?.nice ?? (allScatter && xType === "linear")) && xType === "linear") xRange = niceDomain(xRange[0], xRange[1], xOpts?.tickCount ?? 6);
+		if ((xOpts?.nice ?? (pointsOnly && xType === "linear")) && xType === "linear") xRange = niceDomain(xRange[0], xRange[1], xOpts?.tickCount ?? 6);
 	}
 	if (xOpts?.min !== void 0) xRange[0] = xOpts.min;
 	if (xOpts?.max !== void 0) xRange[1] = xOpts.max;
 	xRange = ensureSpan(xRange[0], xRange[1]);
-	const yOpts = options.yAxis;
-	const yValues = [];
-	for (const s of visible) if (s.type === "bar" && s.barBase && s.barTop) yValues.push(...extent(s.barBase), ...extent(s.barTop));
-	else yValues.push(s.cols.yMin, s.cols.yMax);
-	if (bars.length || yOpts?.zero) yValues.push(0);
-	let yRange = ensureSpan(...extent(yValues));
-	if (allScatter) {
-		const pad = (yRange[1] - yRange[0]) * .06;
-		yRange = [yRange[0] - pad, yRange[1] + pad];
-	}
-	if ((yOpts?.nice ?? true) && (yOpts?.type ?? "linear") === "linear") yRange = niceDomain(yRange[0], yRange[1], yOpts?.tickCount ?? 5);
-	if (bars.length && !yOpts?.zero) {
-		if (yRange[0] < 0 && extent(yValues)[0] >= 0) yRange[0] = 0;
+	let yRange;
+	if (yType === "category") yRange = [-.5, Math.max(1, yCategories.length) - .5];
+	else {
+		const yValues = [];
+		for (const s of visible) if (s.type === "bar" && s.barBase && s.barTop) yValues.push(...extent(s.barBase), ...extent(s.barTop));
+		else if (s.stackBase && s.stackTop) yValues.push(...extent(s.stackBase), ...extent(s.stackTop));
+		else if (s.type === "heatmap") yValues.push(s.cols.yMin - s.cellHalf.y, s.cols.yMax + s.cellHalf.y);
+		else yValues.push(s.cols.yMin, s.cols.yMax);
+		const filled = bars.length > 0 || visible.some((s) => s.type === "area");
+		if (bars.length || yOpts?.zero) yValues.push(0);
+		if (bars.some((s) => s.showLabels)) {
+			const [lo, hi] = extent(yValues);
+			if (hi > 0) yValues.push(hi + (hi - Math.min(0, lo)) * .1);
+			if (lo < 0) yValues.push(lo - (Math.max(0, hi) - lo) * .1);
+		}
+		yRange = ensureSpan(...extent(yValues));
+		if (series.every((s) => s.type === "scatter")) {
+			const pad = (yRange[1] - yRange[0]) * .06;
+			yRange = [yRange[0] - pad, yRange[1] + pad];
+		} else if (candles.length && !bars.length) {
+			const pad = (yRange[1] - yRange[0]) * .04;
+			yRange = [yRange[0] - pad, yRange[1] + pad];
+		}
+		if ((yOpts?.nice ?? !heatmaps.length) && yType === "linear") yRange = niceDomain(yRange[0], yRange[1], yOpts?.tickCount ?? 5);
+		if (percent && (bars.length || stackedLines.length)) yRange = [extent(yValues)[0] < 0 ? -100 : 0, 100];
+		if (filled && !yOpts?.zero) {
+			if (yRange[0] < 0 && extent(yValues)[0] >= 0) yRange[0] = 0;
+		}
 	}
 	if (yOpts?.min !== void 0) yRange[0] = yOpts.min;
 	if (yOpts?.max !== void 0) yRange[1] = yOpts.max;
@@ -6963,10 +7302,14 @@ var buildModel = (options, theme, hidden, cache, resolver = null) => {
 		y: zoomOption.includes("y")
 	};
 	const tooltip = typeof options.tooltip === "object" ? options.tooltip : void 0;
+	const yFormat = yOpts?.format ?? (percent && (bars.length || stackedLines.length) ? (v) => `${+v.toFixed(1)}%` : void 0);
 	return {
 		series,
 		x: axisModel(xOpts, xType, categories, false),
-		y: axisModel(yOpts, yOpts?.type === "time" ? "time" : "linear", [], true),
+		y: {
+			...axisModel(yOpts, yType, yCategories, yType !== "category"),
+			format: yFormat
+		},
 		base: {
 			x: xRange,
 			y: yRange
@@ -6977,10 +7320,14 @@ var buildModel = (options, theme, hidden, cache, resolver = null) => {
 		baseline: Math.min(Math.max(0, yRange[0]), yRange[1]),
 		minSpan: {
 			x: xType === "category" ? 1 : (xRange[1] - xRange[0]) * 1e-7,
-			y: (yRange[1] - yRange[0]) * 1e-7
-		}
+			y: yType === "category" ? 1 : (yRange[1] - yRange[0]) * 1e-7
+		},
+		percent,
+		stacks: input.map((s) => s.stack !== void 0 && (s.type === "bar" || s.type === "line" || s.type === "area" || !s.type) ? `${s.type === "bar" ? "bar" : "line"}:${s.stack}` : null)
 	};
 };
+/** Y value drawn for a point: its stacked top for stacks, the close for candles */
+var plottedY = (s, i) => s.barTop ? s.barTop[i] : s.stackTop ? s.stackTop[i] : s.cols.y[i];
 var grids = /* @__PURE__ */ new WeakMap();
 /** Spatial index of a scatter series, built on first use and kept with its data */
 var gridOf = (s) => {
@@ -7135,7 +7482,19 @@ var placeLabels = (labels, plot, measure, height, occupied = []) => {
 	for (const label of labels) {
 		const w = measure(label.text);
 		const gap = label.r + 4;
-		const box = [
+		const above = {
+			x: label.x - w / 2,
+			y: label.y - gap - height,
+			width: w,
+			height
+		};
+		const below = {
+			x: label.x - w / 2,
+			y: label.y + gap,
+			width: w,
+			height
+		};
+		const box = (label.placement === "above" ? [above] : label.placement === "below" ? [below] : [
 			{
 				x: label.x + gap,
 				y: label.y - height / 2,
@@ -7148,19 +7507,9 @@ var placeLabels = (labels, plot, measure, height, occupied = []) => {
 				width: w,
 				height
 			},
-			{
-				x: label.x - w / 2,
-				y: label.y - gap - height,
-				width: w,
-				height
-			},
-			{
-				x: label.x - w / 2,
-				y: label.y + gap,
-				width: w,
-				height
-			}
-		].find((c) => inside(c, plot) && !occupied.some((o) => overlaps(o, c)));
+			above,
+			below
+		]).find((c) => inside(c, plot) && !occupied.some((o) => overlaps(o, c)));
 		if (!box) continue;
 		occupied.push(box);
 		placed.push({
@@ -7610,7 +7959,7 @@ var resolveAnnotations = (annotations, theme) => {
 /** Ticks, room for the axes and the plot rectangle */
 var layoutChart = (input) => {
 	const { model, view, theme, width, height, measure } = input;
-	const yCount = model.y.tickCount ?? (height >= 220 ? 5 : Math.max(2, Math.round((height - 48) / 52)));
+	const yCount = model.y.tickCount ?? (model.y.type === "category" ? Math.max(1, Math.floor((height - 40) / (theme.fontSize + 5))) : height >= 220 ? 5 : Math.max(2, Math.round((height - 48) / 52)));
 	const yTicks = axisTicks(model.y, view.y, yCount);
 	let yLabelWidth = 0;
 	if (model.y.visible) for (const label of yTicks.labels) yLabelWidth = Math.max(yLabelWidth, measure(label));
@@ -7634,7 +7983,7 @@ var layoutChart = (input) => {
 		fontSize: theme.fontSize
 	});
 	if (input.top) plot.y += input.top;
-	const xCount = model.x.type === "category" ? Math.max(1, Math.floor(plot.width / (categoryWidth + 14))) : model.x.tickCount ?? Math.max(2, Math.floor(plot.width / 96));
+	const xCount = model.x.type === "category" ? Math.max(1, Math.floor(plot.width / (categoryWidth + 14))) : model.x.tickCount ?? Math.max(3, Math.floor(plot.width / 88));
 	const xTicks = axisTicks(model.x, view.x, xCount);
 	return {
 		plot,
@@ -7643,11 +7992,32 @@ var layoutChart = (input) => {
 		yTicks
 	};
 };
-/** Labels of the visible scatter points (`showLabels`) */
-var collectPointLabels = (model, view, s) => {
+/** Labels of the visible scatter points and bar values (`showLabels`) */
+var collectPointLabels = (model, view, s, yTicks) => {
 	const labels = [];
+	const axisFormat = model.percent ? formatValue : yTicks?.formatValue ?? formatValue;
 	for (const series of model.series) {
-		if (series.hidden || series.type !== "scatter" || !series.showLabels) continue;
+		if (series.hidden || !series.showLabels) continue;
+		if (series.type === "bar" && series.barTop) {
+			const format = series.format ?? axisFormat;
+			const { x, y, count } = series.cols;
+			const top = series.barTop;
+			const [x0, x1] = view.x[0] <= view.x[1] ? view.x : [view.x[1], view.x[0]];
+			for (let i = 0; i < count && labels.length < 300; i++) {
+				const xv = x[i] + series.barOffset;
+				if (!Number.isFinite(y[i]) || xv < x0 || xv > x1) continue;
+				const negative = top[i] < (series.barBase?.[i] ?? 0);
+				labels.push({
+					x: s.xToPx(xv),
+					y: s.yToPx(top[i]),
+					r: 0,
+					text: format(y[i]),
+					placement: negative ? "below" : "above"
+				});
+			}
+			continue;
+		}
+		if (series.type !== "scatter") continue;
 		const { x, y, count, labels: texts, size } = series.cols;
 		if (!texts) continue;
 		for (let i = 0; i < count && labels.length < 300; i++) {
@@ -7667,13 +8037,12 @@ var collectPointLabels = (model, view, s) => {
 	}
 	return labels;
 };
-/** Pixel position of a point (the top of a bar) */
+/** Pixel position of a point (the top of a bar or stack, the close of a candle) */
 var pointOf = (s, i, sc) => {
 	const xv = s.cols.x[i] + (s.type === "bar" ? s.barOffset : 0);
-	const yv = s.type === "bar" && s.barTop ? s.barTop[i] : s.cols.y[i];
 	return {
 		px: sc.xToPx(xv),
-		py: sc.yToPx(yv)
+		py: sc.yToPx(plottedY(s, i))
 	};
 };
 var candidateOf = (s, i, px, py, sc) => {
@@ -7683,6 +8052,12 @@ var candidateOf = (s, i, px, py, sc) => {
 		const half = s.barHalfWidth / sc.xPerPx;
 		const base = sc.yToPx(s.barBase[i]);
 		inside = Math.abs(px - p.px) <= half && py >= Math.min(base, p.py) - 2 && py <= Math.max(base, p.py) + 2;
+	} else if (s.type === "candlestick") {
+		const { high, low, y } = s.cols;
+		const half = Math.max(s.barHalfWidth / sc.xPerPx, 3);
+		const a = sc.yToPx(high ? high[i] : y[i]);
+		const b = sc.yToPx(low ? low[i] : y[i]);
+		inside = Math.abs(px - p.px) <= half && py >= Math.min(a, b) - 2 && py <= Math.max(a, b) + 2;
 	}
 	return {
 		series: s,
@@ -7714,6 +8089,16 @@ var nearestScatter = (s, px, py, sc, slop) => {
 	});
 	return best;
 };
+/** Heatmap cell containing a data position, -1 if none */
+var cellAt = (s, xv, yv) => {
+	const { x: hx, y: hy } = s.cellHalf;
+	const { x, y } = s.cols;
+	let found = -1;
+	gridOf(s).query(xv - hx, xv + hx, yv - hy, yv + hy, (i) => {
+		if (s.cellColors?.[i] && Math.abs(x[i] - xv) <= hx && Math.abs(y[i] - yv) <= hy) found = i;
+	});
+	return found;
+};
 var nearestX = (s, xv) => {
 	const { x, y, count, sorted } = s.cols;
 	if (sorted) return nearestIndex(x, y, count, xv);
@@ -7733,6 +8118,21 @@ var nearestX = (s, xv) => {
 var hoverItemOf = (s, index) => {
 	const pc = s.pointColors?.[index];
 	const label = s.cols.labels?.[index];
+	const { open, high, low, value } = s.cols;
+	let color = pc ? toCss(pc) : s.colorCss;
+	const extra = {};
+	if (s.type === "candlestick") {
+		const o = open ? open[index] : NaN;
+		if (Number.isFinite(o)) extra.open = o;
+		if (high && Number.isFinite(high[index])) extra.high = high[index];
+		if (low && Number.isFinite(low[index])) extra.low = low[index];
+		color = toCss(s.cols.y[index] < o ? s.downColor : s.upColor);
+	} else if (s.type === "heatmap") {
+		const v = value ? value[index] : s.cols.y[index];
+		if (Number.isFinite(v)) extra.value = v;
+		const packed = s.cellColors?.[index];
+		if (packed) color = toCss(unpackColor(packed));
+	}
 	return {
 		seriesIndex: s.index,
 		seriesId: s.id,
@@ -7740,8 +8140,9 @@ var hoverItemOf = (s, index) => {
 		index,
 		x: s.cols.x[index],
 		y: s.cols.y[index],
-		color: pc ? toCss(pc) : s.colorCss,
-		...label !== void 0 ? { label } : {}
+		color,
+		...label !== void 0 ? { label } : {},
+		...extra
 	};
 };
 var eventOf = (candidates, xTicks) => {
@@ -7772,6 +8173,14 @@ var hitTest = (model, sc, xTicks, px, py, slop = 0) => {
 		if (s.type === "scatter") {
 			const i = nearestScatter(s, px, py, sc, slop);
 			if (i >= 0) scatter.push(candidateOf(s, i, px, py, sc));
+		} else if (s.type === "heatmap") {
+			const i = cellAt(s, sc.pxToX(px), sc.pxToY(py));
+			if (i >= 0) {
+				const c = candidateOf(s, i, px, py, sc);
+				c.inside = true;
+				c.dist = 0;
+				scatter.push(c);
+			}
 		} else {
 			const i = nearestX(s, xv);
 			if (i >= 0) others.push(candidateOf(s, i, px, py, sc));
@@ -7806,6 +8215,20 @@ var sameHover = (a, b) => a === b || !!a && !!b && a.items.length === b.items.le
 /** Default tooltip content of a hover payload */
 var tooltipContent = (model, event, yTicks) => {
 	const yFormat = yTicks?.formatValue ?? String;
+	const first = event.items[0];
+	const firstSeries = first ? model.series[first.seriesIndex] : null;
+	if (event.items.length === 1 && firstSeries?.type === "heatmap") {
+		const yName = model.y.type === "category" ? model.y.categories[Math.round(first.y)] ?? yFormat(first.y) : yFormat(first.y);
+		return {
+			title: `${event.xLabel} · ${yName}`,
+			titleColor: null,
+			rows: [{
+				color: first.color,
+				name: first.label ?? firstSeries.name,
+				value: first.value === void 0 ? "–" : (firstSeries.format ?? formatValue)(first.value)
+			}]
+		};
+	}
 	if (event.items.every((it) => model.series[it.seriesIndex].type === "scatter") && event.items.length === 1) {
 		const it = event.items[0];
 		const rows = [{
@@ -7828,52 +8251,125 @@ var tooltipContent = (model, event, yTicks) => {
 			rows
 		};
 	}
+	const rows = [];
+	/** Row of every item */
+	const rowOf = [];
+	for (const it of event.items) {
+		const s = model.series[it.seriesIndex];
+		rowOf.push(rows.length);
+		if (s.type === "candlestick") {
+			const change = it.open !== void 0 && it.open !== 0 ? (it.y - it.open) / Math.abs(it.open) * 100 : NaN;
+			rows.push({
+				color: it.color,
+				name: s.name,
+				value: Number.isFinite(change) ? `${change >= 0 ? "+" : ""}${change.toFixed(2)}%` : ""
+			});
+			const ohlc = [
+				["Open", it.open],
+				["High", it.high],
+				["Low", it.low],
+				["Close", it.y]
+			];
+			for (const [name, v] of ohlc) if (v !== void 0 && Number.isFinite(v)) rows.push({
+				color: null,
+				name,
+				value: (s.format ?? yFormat)(v)
+			});
+			continue;
+		}
+		rows.push({
+			color: it.color,
+			name: it.label ? `${it.seriesName} · ${it.label}` : it.seriesName,
+			value: (s.format ?? yFormat)(it.y)
+		});
+	}
+	if (model.percent) {
+		const totals = /* @__PURE__ */ new Map();
+		for (const it of event.items) {
+			const stack = stackIdOf(model, it.seriesIndex);
+			if (stack !== null && Number.isFinite(it.y)) totals.set(stack, (totals.get(stack) ?? 0) + Math.abs(it.y));
+		}
+		event.items.forEach((it, k) => {
+			const stack = stackIdOf(model, it.seriesIndex);
+			const total = stack !== null ? totals.get(stack) : void 0;
+			const row = rows[rowOf[k]];
+			if (total && row && Number.isFinite(it.y)) row.value = `${(model.series[it.seriesIndex].format ?? formatValue)(it.y)} · ${(Math.abs(it.y) / total * 100).toFixed(1)}%`;
+		});
+	}
 	return {
 		title: event.xLabel,
 		titleColor: null,
-		rows: event.items.map((it) => ({
-			color: it.color,
-			name: it.label ? `${it.seriesName} · ${it.label}` : it.seriesName,
-			value: yFormat(it.y)
-		}))
+		rows
 	};
 };
-/** Markers of the hovered points (pixels of the stage) */
+/** Stack of a series in a 100% chart (`null` when it is not stacked) */
+var stackIdOf = (model, seriesIndex) => model.series[seriesIndex].hidden ? null : model.stacks[seriesIndex];
+/** Markers of the hovered points (pixels of the stage); bands come first */
 var hoverMarks = (model, sc, event) => {
 	const marks = [];
 	const { plot } = sc;
+	let bandLo = Infinity;
+	let bandHi = -Infinity;
 	for (const it of event.items) {
 		const s = model.series[it.seriesIndex];
-		if (s.type === "bar" && s.barBase && s.barTop) {
+		if (s.type === "bar" || s.type === "candlestick") {
 			const cx = sc.xToPx(it.x + s.barOffset);
 			const half = Math.max(s.barHalfWidth / sc.xPerPx, 1);
-			const a = sc.yToPx(s.barBase[it.index]);
-			const b = sc.yToPx(s.barTop[it.index]);
+			bandLo = Math.min(bandLo, cx - half);
+			bandHi = Math.max(bandHi, cx + half);
+			continue;
+		}
+		if (s.type === "heatmap") {
+			const cx = sc.xToPx(it.x);
+			const cy = sc.yToPx(it.y);
+			const hw = Math.abs(s.cellHalf.x / sc.xPerPx);
+			const hh = Math.abs(s.cellHalf.y / sc.yPerPx);
 			marks.push({
-				kind: "bar",
-				x: cx - half,
-				y: Math.min(a, b),
-				width: half * 2,
-				height: Math.max(1, Math.abs(a - b))
+				kind: "cell",
+				x: cx - hw,
+				y: cy - hh,
+				width: hw * 2,
+				height: hh * 2
 			});
 			continue;
 		}
-		const px = sc.xToPx(it.x);
-		const py = sc.yToPx(it.y);
+		const { px, py } = pointOf(s, it.index, sc);
 		if (px < plot.x - 1 || px > plot.x + plot.width + 1 || py < plot.y - 1 || py > plot.y + plot.height + 1) continue;
-		const size = s.type === "scatter" ? dotSize(s, it.index) + 6 : Math.max(10, s.lineWidth * 2 + 6);
+		const size = s.type === "scatter" ? dotSize(s, it.index) + 4 : Math.max(9, s.lineWidth * 2 + 5);
+		const rgba = s.pointColors?.[it.index] ?? s.color;
 		marks.push({
 			kind: "dot",
 			x: px,
 			y: py,
 			size,
-			color: it.color
+			color: it.color,
+			halo: toCss(rgba, .2)
+		});
+	}
+	if (bandHi > bandLo) {
+		const pad = Math.max(4, (bandHi - bandLo) * .14);
+		const x0 = Math.max(plot.x, bandLo - pad);
+		const x1 = Math.min(plot.x + plot.width, bandHi + pad);
+		if (x1 > x0) marks.unshift({
+			kind: "band",
+			x: x0,
+			y: plot.y,
+			width: x1 - x0,
+			height: plot.height
 		});
 	}
 	return marks;
 };
+/** Swatch of a series in the legend */
+var legendShape = (type) => type === "scatter" ? "dot" : type === "line" ? "line" : "square";
 /** Whether the guide line follows the pointer */
-var showsCrosshair = (model, event, crosshair) => crosshair ?? (model.tooltipMode === "axis" && event.items.some((it) => model.series[it.seriesIndex].type !== "scatter"));
+var showsCrosshair = (model, event, crosshair) => crosshair ?? (model.tooltipMode === "axis" && event.items.some((it) => {
+	const type = model.series[it.seriesIndex].type;
+	return type === "line" || type === "area";
+}) && !event.items.some((it) => {
+	const type = model.series[it.seriesIndex].type;
+	return type === "bar" || type === "candlestick";
+}));
 //#endregion
 //#region ../charts/src/engine/theme.ts
 /** Used when no CSS variable is defined (e.g. without the Minerva stylesheet) */
@@ -8065,7 +8561,7 @@ var createChartController = (config) => {
 				id: s.id,
 				name: s.name,
 				color: s.colorCss,
-				shape: s.type === "scatter" ? "dot" : s.type === "line" ? "line" : "square",
+				shape: legendShape(s.type),
 				hidden: s.hidden,
 				box: {
 					x,
@@ -8141,7 +8637,7 @@ var createChartController = (config) => {
 			top: legendTop,
 			measure: (text) => measure(text)
 		});
-		const labels = collectPointLabels(model, view, layout.scales);
+		const labels = collectPointLabels(model, view, layout.scales, layout.yTicks);
 		const occupied = [];
 		const labelHeight = theme.fontSize + 4;
 		for (const a of annotations) {
@@ -8567,19 +9063,49 @@ var GAP = 3e38;
 //#endregion
 //#region ../charts/src/engine/items.ts
 var rel = (value, origin) => Number.isFinite(value) ? value - origin : GAP;
-var points = (x, y, count, o) => {
-	const out = new Float32Array(count * 2);
-	for (let i = 0; i < count; i++) {
-		out[i * 2] = rel(x[i], o.x);
-		out[i * 2 + 1] = Number.isFinite(y[i]) ? y[i] - o.y : GAP;
-	}
-	return out;
-};
 var DRAW_ORDER = {
-	area: 0,
-	bar: 1,
-	line: 2,
-	scatter: 3
+	heatmap: 0,
+	area: 1,
+	bar: 2,
+	candlestick: 3,
+	line: 4,
+	scatter: 5
+};
+/** Line (and area) points of a series: stacked, curved; interleaved x, y */
+var linePoints = (s) => {
+	const { x, count } = s.cols;
+	const top = s.stackTop ?? s.cols.y;
+	const stackBase = s.stackBase;
+	if (s.curve === "linear") return {
+		n: count,
+		xAt: (i) => x[i],
+		yAt: (i) => top[i],
+		baseAt: stackBase ? (i) => stackBase[i] : null
+	};
+	const curved = curvePoints(x, top, 0, count, s.curve);
+	const base = stackBase ? curvePoints(x, stackBase, 0, count, s.curve).points : null;
+	const points = curved.points;
+	return {
+		n: curved.length,
+		xAt: (i) => points[i * 2],
+		yAt: (i) => points[i * 2 + 1],
+		baseAt: base ? (i) => base[i * 2 + 1] : null
+	};
+};
+var barItem = (key, version, s, count, write, extra) => {
+	const instances = /* @__PURE__ */ new ArrayBuffer(count * 16);
+	const f = new Float32Array(instances);
+	const u = new Uint32Array(instances);
+	for (let i = 0; i < count; i++) write(i, f, u);
+	return {
+		kind: "bar",
+		key,
+		version,
+		color: s.color,
+		instances,
+		count,
+		...extra
+	};
 };
 /** Render items of the visible series, back to front */
 var buildItems = (model, origin, version) => {
@@ -8593,25 +9119,48 @@ var buildItems = (model, origin, version) => {
 		switch (s.type) {
 			case "line":
 			case "area": {
-				const pts = points(x, y, count, origin);
-				if (s.type === "area") items.push({
-					kind: "area",
-					key: `${s.key}:area`,
-					version,
-					color: s.color,
-					points: pts,
-					count,
-					baseline: model.baseline - origin.y,
-					opacity: s.opacity,
-					sorted
-				});
+				const { n, xAt, yAt, baseAt } = linePoints(s);
+				const pts = new Float32Array(n * 2);
+				if (s.curve === "linear") {
+					const top = s.stackTop ?? y;
+					const ox = origin.x;
+					const oy = origin.y;
+					for (let i = 0; i < n; i++) {
+						const xv = x[i];
+						const yv = top[i];
+						pts[i * 2] = Number.isFinite(xv) ? xv - ox : GAP;
+						pts[i * 2 + 1] = Number.isFinite(yv) ? yv - oy : GAP;
+					}
+				} else for (let i = 0; i < n; i++) {
+					pts[i * 2] = rel(xAt(i), origin.x);
+					pts[i * 2 + 1] = rel(yAt(i), origin.y);
+				}
+				if (s.type === "area") {
+					const area = new Float32Array(n * 3);
+					const baseline = model.baseline - origin.y;
+					for (let i = 0; i < n; i++) {
+						area[i * 3] = pts[i * 2];
+						area[i * 3 + 1] = pts[i * 2 + 1];
+						area[i * 3 + 2] = baseAt ? rel(baseAt(i), origin.y) : baseline;
+					}
+					items.push({
+						kind: "area",
+						key: `${s.key}:area`,
+						version,
+						color: s.color,
+						points: area,
+						count: n,
+						opacity: s.opacity,
+						sorted
+					});
+				}
 				(s.type === "area" ? outlines : items).push({
 					kind: "line",
 					key: `${s.key}:line`,
 					version,
 					color: s.color,
 					points: pts,
-					count,
+					count: n,
 					width: s.lineWidth,
 					sorted
 				});
@@ -8620,24 +9169,76 @@ var buildItems = (model, origin, version) => {
 			case "bar": {
 				const base = s.barBase ?? new Float64Array(count);
 				const top = s.barTop ?? y;
-				const instances = new Float32Array(count * 3);
-				for (let i = 0; i < count; i++) {
+				const seriesColor = packColor(s.color);
+				const shared = model.series.some((o) => o !== s && !o.hidden && o.type === "bar" && o.barOffset === s.barOffset);
+				items.push(barItem(`${s.key}:bar`, version, s, count, (i, f, u) => {
 					const valid = Number.isFinite(top[i]) && Number.isFinite(base[i]);
-					instances[i * 3] = rel(x[i] + s.barOffset, origin.x);
-					instances[i * 3 + 1] = valid ? base[i] - origin.y : GAP;
-					instances[i * 3 + 2] = valid ? top[i] - origin.y : GAP;
-				}
-				items.push({
-					kind: "bar",
-					key: `${s.key}:bar`,
-					version,
-					color: s.color,
-					instances,
-					count,
+					f[i * 4] = rel(x[i] + s.barOffset, origin.x);
+					f[i * 4 + 1] = valid ? base[i] - origin.y : GAP;
+					f[i * 4 + 2] = valid ? top[i] - origin.y : GAP;
+					const pc = s.pointColors?.[i];
+					u[i * 4 + 3] = pc ? packColor(pc) : seriesColor;
+				}, {
 					halfWidth: s.barHalfWidth,
-					sorted,
-					radius: model.series.some((o) => o !== s && !o.hidden && o.type === "bar" && o.barOffset === s.barOffset) ? 0 : 3
-				});
+					radius: shared ? 0 : s.radius,
+					inset: 0,
+					minHalf: 0,
+					sorted
+				}));
+				break;
+			}
+			case "candlestick": {
+				const { open, high, low } = s.cols;
+				const up = packColor(s.upColor);
+				const down = packColor(s.downColor);
+				const colorAt = (i) => open && Number.isFinite(open[i]) && y[i] < open[i] ? down : up;
+				items.push(barItem(`${s.key}:wick`, version, s, count, (i, f, u) => {
+					const hi = high ? high[i] : y[i];
+					const lo = low ? low[i] : y[i];
+					const valid = Number.isFinite(hi) && Number.isFinite(lo) && Number.isFinite(y[i]);
+					f[i * 4] = rel(x[i], origin.x);
+					f[i * 4 + 1] = valid ? lo - origin.y : GAP;
+					f[i * 4 + 2] = valid ? hi - origin.y : GAP;
+					u[i * 4 + 3] = colorAt(i);
+				}, {
+					halfWidth: 0,
+					radius: 0,
+					inset: 0,
+					minHalf: s.lineWidth / 2,
+					sorted
+				}), barItem(`${s.key}:body`, version, s, count, (i, f, u) => {
+					const o = open ? open[i] : y[i];
+					const valid = Number.isFinite(o) && Number.isFinite(y[i]);
+					f[i * 4] = rel(x[i], origin.x);
+					f[i * 4 + 1] = valid ? o - origin.y : GAP;
+					f[i * 4 + 2] = valid ? y[i] - origin.y : GAP;
+					u[i * 4 + 3] = colorAt(i);
+				}, {
+					halfWidth: s.barHalfWidth,
+					radius: Math.min(s.radius, 1.5),
+					inset: 0,
+					minHalf: .5,
+					sorted
+				}));
+				break;
+			}
+			case "heatmap": {
+				const colors = s.cellColors;
+				const hy = s.cellHalf.y;
+				items.push(barItem(`${s.key}:cells`, version, s, count, (i, f, u) => {
+					const c = colors ? colors[i] : 0;
+					const valid = c !== 0 && Number.isFinite(x[i]);
+					f[i * 4] = rel(x[i], origin.x);
+					f[i * 4 + 1] = valid ? y[i] - hy - origin.y : GAP;
+					f[i * 4 + 2] = valid ? y[i] + hy - origin.y : GAP;
+					u[i * 4 + 3] = c;
+				}, {
+					halfWidth: s.cellHalf.x,
+					radius: s.radius,
+					inset: 1,
+					minHalf: 0,
+					sorted
+				}));
 				break;
 			}
 			default: {
@@ -8673,25 +9274,77 @@ var buildItems = (model, origin, version) => {
 	return items;
 };
 var rgba = (c, alpha) => `rgba(${Math.round(c[0] * 255)},${Math.round(c[1] * 255)},${Math.round(c[2] * 255)},${c[3] * alpha})`;
-var unpack = (packed) => [
-	(packed & 255) / 255,
-	(packed >>> 8 & 255) / 255,
-	(packed >>> 16 & 255) / 255,
-	(packed >>> 24 & 255) / 255
-];
 var isGap = (v) => !Number.isFinite(v) || Math.abs(v) >= 15e37;
 /** First point index whose relative x is >= value (sorted, interleaved) */
-var lowerBoundX = (points, count, value) => {
+var lowerBoundX = (points, count, value, stride = 2) => {
 	let lo = 0;
 	let hi = count;
 	while (lo < hi) {
 		const mid = lo + hi >>> 1;
-		if (points[mid * 2] < value) lo = mid + 1;
+		if (points[mid * stride] < value) lo = mid + 1;
 		else hi = mid;
 	}
 	return lo;
 };
 /**
+* Min-max decimation of area points (x, top, bottom): per pixel column the
+* first, lowest, highest and last tops are kept with their bottoms
+*/
+var decimateArea = (points, start, end, column) => {
+	const out = new Float64Array(Math.max(0, end - start) * 3);
+	let length = 0;
+	const push = (i) => {
+		out[length * 3] = points[i * 3];
+		out[length * 3 + 1] = points[i * 3 + 1];
+		out[length * 3 + 2] = points[i * 3 + 2];
+		length++;
+	};
+	let col = NaN;
+	let first = -1;
+	let min = -1;
+	let max = -1;
+	let last = -1;
+	const flush = () => {
+		if (first < 0) return;
+		const picks = [
+			first,
+			min,
+			max,
+			last
+		].sort((a, b) => a - b);
+		let prev = -1;
+		for (const i of picks) {
+			if (i !== prev) push(i);
+			prev = i;
+		}
+		first = -1;
+	};
+	for (let i = start; i < end; i++) {
+		const y = points[i * 3 + 1];
+		if (isGap(points[i * 3]) || isGap(y) || isGap(points[i * 3 + 2])) {
+			flush();
+			col = NaN;
+			push(i);
+			continue;
+		}
+		const c = Math.floor(column(points[i * 3]));
+		if (c !== col || first < 0) {
+			flush();
+			col = c;
+			first = min = max = last = i;
+		} else {
+			if (y < points[min * 3 + 1]) min = i;
+			if (y > points[max * 3 + 1]) max = i;
+			last = i;
+		}
+	}
+	flush();
+	return {
+		points: out,
+		length
+	};
+};
+/**
 * Data layer drawn with any 2D context (browser canvases, mini-program
 * canvases, OffscreenCanvas). `scratchCanvas` creates the canvas used to
 * rasterize very large scatter sets; without it they are drawn as one
@@ -8754,61 +9407,82 @@ var createCanvas2dPainter = (ctx, scratchCanvas) => {
 	};
 	const drawArea = (item, frame) => {
 		const m = mapper(frame);
-		const { points, length } = visiblePoints(item, frame);
-		const base = m.py(item.baseline);
-		const gradient = ctx.createLinearGradient(0, 0, 0, base);
+		let points = item.points;
+		let length = item.count;
+		if (item.sorted && item.count > frame.width * 2) {
+			const [x0, x1] = m.xRange();
+			const start = Math.max(0, lowerBoundX(item.points, item.count, x0, 3) - 1);
+			const end = Math.min(item.count, lowerBoundX(item.points, item.count, x1, 3) + 1);
+			({points, length} = decimateArea(item.points, start, end, m.px));
+		}
+		const gradient = ctx.createLinearGradient(0, 0, 0, frame.height);
 		gradient.addColorStop(0, rgba(item.color, item.opacity));
-		gradient.addColorStop(1, rgba(item.color, item.opacity * .3));
+		gradient.addColorStop(1, rgba(item.color, item.opacity * .25));
 		ctx.fillStyle = gradient;
 		ctx.beginPath();
 		let runStart = -1;
-		let lastX = 0;
-		const close = () => {
+		const close = (end) => {
 			if (runStart < 0) return;
-			ctx.lineTo(lastX, base);
+			for (let k = end - 1; k >= runStart; k--) ctx.lineTo(m.px(points[k * 3]), m.py(points[k * 3 + 2]));
 			ctx.closePath();
 			runStart = -1;
 		};
 		for (let i = 0; i < length; i++) {
-			const x = points[i * 2];
-			const y = points[i * 2 + 1];
-			if (isGap(x) || isGap(y)) {
-				close();
+			const x = points[i * 3];
+			const y = points[i * 3 + 1];
+			if (isGap(x) || isGap(y) || isGap(points[i * 3 + 2])) {
+				close(i);
 				continue;
 			}
-			const px = m.px(x);
 			if (runStart < 0) {
 				runStart = i;
-				ctx.moveTo(px, base);
-			}
-			ctx.lineTo(px, m.py(y));
-			lastX = px;
+				ctx.moveTo(m.px(x), m.py(y));
+			} else ctx.lineTo(m.px(x), m.py(y));
 		}
-		close();
+		close(length);
 		ctx.fill();
 	};
 	const drawBars = (item, frame) => {
 		const m = mapper(frame);
-		const half = Math.max(Math.abs(item.halfWidth * frame.transform.xScale) * .5 * frame.width, .5);
-		const r = item.radius * frame.dpr;
-		ctx.fillStyle = rgba(item.color, 1);
-		ctx.beginPath();
-		const v = item.instances;
+		const dpr = frame.dpr;
+		const minHalf = item.minHalf * dpr;
+		const rawHalf = Math.abs(item.halfWidth * frame.transform.xScale) * .5 * frame.width;
+		const r = item.radius * dpr;
+		const f = new Float32Array(item.instances, 0, item.count * 4);
+		const u = new Uint32Array(item.instances, 0, item.count * 4);
+		const [x0, x1] = m.xRange();
+		const pad = Math.abs(item.halfWidth);
+		const groups = /* @__PURE__ */ new Map();
 		for (let i = 0; i < item.count; i++) {
-			const x = v[i * 3];
-			const y0 = v[i * 3 + 1];
-			const y1 = v[i * 3 + 2];
-			if (isGap(x) || isGap(y0) || isGap(y1)) continue;
-			const cx = m.px(x);
-			const a = m.py(y0);
-			const b = m.py(y1);
-			const top = Math.min(a, b);
-			const height = Math.abs(a - b);
-			const radius = Math.min(r, half, height / 2);
-			if (radius > .5 && typeof ctx.roundRect === "function") ctx.roundRect(cx - half, top, half * 2, height, radius);
-			else ctx.rect(cx - half, top, half * 2, height);
+			const x = f[i * 4];
+			if (isGap(x) || isGap(f[i * 4 + 1]) || isGap(f[i * 4 + 2])) continue;
+			if (x < x0 - pad || x > x1 + pad) continue;
+			const packed = u[i * 4 + 3];
+			let list = groups.get(packed);
+			if (!list) groups.set(packed, list = []);
+			list.push(i);
+		}
+		const rounded = typeof ctx.roundRect === "function";
+		for (const [packed, list] of groups) {
+			ctx.fillStyle = rgba(unpackColor(packed), 1);
+			ctx.beginPath();
+			for (const i of list) {
+				const cx = m.px(f[i * 4]);
+				const a = m.py(f[i * 4 + 1]);
+				const b = m.py(f[i * 4 + 2]);
+				const rawHh = Math.abs(a - b) / 2;
+				const fade = Math.min(1, Math.max(0, (Math.min(rawHalf, rawHh) - 3 * dpr) / (2 * dpr)));
+				const inset = item.inset * dpr * fade - (item.inset > 0 ? .5 * (1 - fade) : 0);
+				const half = Math.max(rawHalf - inset, .5, minHalf);
+				const hh = Math.max(rawHh - inset, minHalf);
+				if (hh <= 0) continue;
+				const cy = (a + b) / 2;
+				const radius = Math.min(r, half, hh);
+				if (radius > .5 && rounded) ctx.roundRect(cx - half, cy - hh, half * 2, hh * 2, radius);
+				else ctx.rect(cx - half, cy - hh, half * 2, hh * 2);
+			}
+			ctx.fill();
 		}
-		ctx.fill();
 	};
 	/** One square per occupied cell (the last point of a cell wins, like the GPU) */
 	const drawScatterCells = (item, frame) => {
@@ -8842,7 +9516,7 @@ var createCanvas2dPainter = (ctx, scratchCanvas) => {
 			list.push(c);
 		}
 		for (const [packed, cells] of groups) {
-			ctx.fillStyle = rgba(unpack(packed), Math.max(item.opacity, .6));
+			ctx.fillStyle = rgba(unpackColor(packed), Math.max(item.opacity, .6));
 			for (const c of cells) ctx.fillRect(c % cols * cell, Math.floor(c / cols) * cell, cell, cell);
 		}
 	};
@@ -8908,7 +9582,7 @@ var createCanvas2dPainter = (ctx, scratchCanvas) => {
 		}
 		const stroke = item.stroke * frame.dpr;
 		for (const [packed, list] of groups) {
-			const color = unpack(packed);
+			const color = unpackColor(packed);
 			ctx.beginPath();
 			for (const i of list) {
 				const x = f[i * 4];
@@ -8969,6 +9643,33 @@ var createCanvas2dPainter = (ctx, scratchCanvas) => {
 	};
 };
 //#endregion
+//#region ../charts/src/engine/signature.ts
+var ids = /* @__PURE__ */ new WeakMap();
+var counter = 0;
+/** Stable id of an object (data columns compare by identity) */
+var idOf = (value) => {
+	let id = ids.get(value);
+	if (id === void 0) ids.set(value, id = ++counter);
+	return id;
+};
+/**
+* Every input of `buildItems` (and of the origin of its positions): data
+* identity, types, colors, visibility, widths, bar layout, stacks, curves,
+* radii, candlestick and heatmap colors. `themeKey` covers the colors resolved
+* from the theme that the model doesn't spell out (per-point colors);
+* `stackOf` gives the `stack` option of a series.
+*/
+var itemsSignature = (model, themeKey, stackOf) => {
+	const { base } = model;
+	let signature = `${themeKey}|${model.baseline}|${model.percent}|${base.x[0]},${base.x[1]}|${base.y[0]},${base.y[1]}`;
+	for (const s of model.series) {
+		signature += `\n${s.key}|${s.type}|${idOf(s.cols)}|${s.colorCss}|${s.hidden}|${s.lineWidth}|${s.pointSize}|${s.opacity}|${s.barOffset}|${s.barHalfWidth}|${stackOf(s.index) ?? ""}|${s.curve}|${s.radius}`;
+		if (s.type === "candlestick") signature += `|${s.upColor}/${s.downColor}`;
+		else if (s.type === "heatmap") signature += `|${s.colorScale.join(";")}/${s.valueRange[0]},${s.valueRange[1]}/${s.cellHalf.x},${s.cellHalf.y}`;
+	}
+	return signature;
+};
+//#endregion
 //#region ../charts/src/engine/canvas.ts
 var mid = (r) => (r[0] + r[1]) / 2;
 var roundedRect = (ctx, x, y, w, h, r) => {
@@ -9026,6 +9727,12 @@ var drawScene = (ctx, scene, items, origin, pixelRatio, painter = createCanvas2d
 		}
 		ctx.globalAlpha = 1;
 	}
+	for (const mark of scene.hover?.marks ?? []) {
+		if (mark.kind !== "band") continue;
+		roundedRect(ctx, mark.x, mark.y, mark.width, mark.height, 6);
+		ctx.fillStyle = toCss(theme.text, .06);
+		ctx.fill();
+	}
 	const scale = (range, o, reverse) => {
 		const s = 2 / (range[1] - range[0]);
 		const offset = (o - range[0]) * s - 1;
@@ -9084,13 +9791,23 @@ var drawScene = (ctx, scene, items, origin, pixelRatio, painter = createCanvas2d
 			ctx.restore();
 		}
 		for (const mark of hover.marks) {
-			if (mark.kind === "bar") {
-				ctx.fillStyle = toCss(theme.text, .08);
-				ctx.fillRect(mark.x - 2, mark.y - 2, mark.width + 4, mark.height + 2);
+			if (mark.kind === "band") continue;
+			if (mark.kind === "cell") {
+				roundedRect(ctx, mark.x, mark.y, mark.width, mark.height, 3);
+				ctx.lineWidth = 3;
+				ctx.strokeStyle = toCss(theme.background);
+				ctx.stroke();
+				ctx.lineWidth = 1.5;
+				ctx.strokeStyle = toCss(theme.text, .55);
+				ctx.stroke();
 				continue;
 			}
 			ctx.beginPath();
-			ctx.arc(mark.x, mark.y, mark.size / 2, 0, Math.PI * 2);
+			ctx.arc(mark.x, mark.y, mark.size / 2 + 4, 0, Math.PI * 2);
+			ctx.fillStyle = mark.halo;
+			ctx.fill();
+			ctx.beginPath();
+			ctx.arc(mark.x, mark.y, mark.size / 2 - 1, 0, Math.PI * 2);
 			ctx.fillStyle = mark.color;
 			ctx.fill();
 			ctx.lineWidth = 2;
@@ -9122,7 +9839,7 @@ var drawScene = (ctx, scene, items, origin, pixelRatio, painter = createCanvas2d
 		ctx.fill();
 		ctx.restore();
 		roundedRect(ctx, box.x + .5, box.y + .5, box.width - 1, box.height - 1, 8);
-		ctx.strokeStyle = toCss(theme.axis);
+		ctx.strokeStyle = toCss(theme.axis, .6);
 		ctx.lineWidth = 1;
 		ctx.stroke();
 		ctx.textBaseline = "middle";
@@ -9190,6 +9907,16 @@ var createCanvasChart = (config) => {
 	let frameId = null;
 	let items = [];
 	let itemsModel = null;
+	let itemsKey = "";
+	let options = config.options;
+	/** Ids of the themes seen (the controller replaces its theme on changes) */
+	const themeIds = /* @__PURE__ */ new WeakMap();
+	let themeCount = 0;
+	const themeId = (theme) => {
+		let id = themeIds.get(theme);
+		if (id === void 0) themeIds.set(theme, id = ++themeCount);
+		return id;
+	};
 	let origin = {
 		x: 0,
 		y: 0
@@ -9218,11 +9945,15 @@ var createCanvasChart = (config) => {
 		fontSet = "";
 		if (itemsModel !== scene.model) {
 			itemsModel = scene.model;
-			origin = {
-				x: mid(scene.model.base.x),
-				y: mid(scene.model.base.y)
-			};
-			items = buildItems(scene.model, origin, ++version);
+			const key = itemsSignature(scene.model, themeId(scene.theme), (index) => options.series[index]?.stack);
+			if (key !== itemsKey) {
+				itemsKey = key;
+				origin = {
+					x: mid(scene.model.base.x),
+					y: mid(scene.model.base.y)
+				};
+				items = buildItems(scene.model, origin, ++version);
+			}
 		}
 		drawScene(ctx, scene, items, origin, dpr, painter);
 		fontSet = "";
@@ -9245,7 +9976,10 @@ var createCanvasChart = (config) => {
 		touch: true
 	});
 	return {
-		setOptions: (o) => controller.setOptions(o),
+		setOptions: (o) => {
+			options = o;
+			controller.setOptions(o);
+		},
 		setTheme: (t) => controller.setTheme(t),
 		resize(w, h, ratio) {
 			width = w;
@@ -9308,15 +10042,22 @@ var createCanvasChart = (config) => {
 //#endregion
 //#region ../charts/src/engine/presets.ts
 /** Gives the series without a `type` the type of the component */
-var withSeriesType = (series, type, stack) => series.map((s) => ({
-	...s,
-	type: s.type ?? type,
-	...stack !== void 0 && (s.type ?? type) === "bar" ? { stack: s.stack ?? stack } : {}
-}));
+var withSeriesType = (series, type, stack, curve) => series.map((s) => {
+	const t = s.type ?? type;
+	return {
+		...s,
+		type: t,
+		...stack !== void 0 && t === type ? { stack: s.stack ?? stack } : {},
+		...curve !== void 0 && (t === "line" || t === "area") ? { curve: s.curve ?? curve } : {}
+	};
+});
 /** Series of a LineChart (`area` fills them) */
-var lineSeries = (series, area = false) => withSeriesType(series, area ? "area" : "line");
-/** Series of a BarChart (`stacked` stacks them) */
-var barSeries = (series, stacked = false) => withSeriesType(series, "bar", stacked ? "stack" : void 0);
+var lineSeries = (series, area = false, extra = {}) => withSeriesType(series, area ? "area" : "line", extra.stacked ? "stack" : void 0, extra.curve);
+/** Series of a BarChart (`stacked` stacks them, `labels` shows the values) */
+var barSeries = (series, stacked = false, labels = false) => withSeriesType(series, "bar", stacked ? "stack" : void 0).map((s) => labels && s.type === "bar" ? {
+	...s,
+	showLabels: s.showLabels ?? true
+} : s);
 /** Series of a ScatterChart */
 var scatterSeries = (series) => withSeriesType(series, "scatter");
 var DEFAULT_QUADRANT_COLORS = {