@mstone6969/graph 0.0.0-stage → 0.2.0

package/dist/charts/financial/EquityBase.js

@@ -0,0 +1,124 @@
+import { CartesianChart } from "../../core/CartesianChart.js";
+import { FinanceInk } from "./FinanceInk.js";
+import { Quotes } from "./Quotes.js";
+import { group, max, pointer, scaleUtc } from "d3";
+// src/charts/financial/EquityBase.ts
+var GAP = 18;
+var END_LABELS = 4;
+/** Value-through-time charts for whole portfolios: long-form rows, one line per series, optional companion pane. */
+var EquityBase = class extends CartesianChart {
+	mainHeight = 300;
+	defaults() {
+		return {
+			date: "date",
+			series: "series",
+			value: "value"
+		};
+	}
+	subShare() {
+		return 0;
+	}
+	subOnTop() {
+		return false;
+	}
+	rawLines() {
+		const { data, date, series, value } = this.options;
+		const rows = (data ?? []).flatMap((row) => {
+			const when = Quotes.date(row[date]), amount = Quotes.number(row[value]);
+			return when && Number.isFinite(amount) ? [{
+				name: String(row[series] ?? "Value"),
+				when,
+				amount
+			}] : [];
+		});
+		return [...group(rows, (row) => row.name)].map(([name, items]) => {
+			return {
+				name,
+				points: [...new Map(items.map((item) => [item.when.getTime(), item.amount]))].sort((a, b) => a[0] - b[0]).map(([time, amount]) => ({
+					date: new Date(time),
+					value: amount
+				}))
+			};
+		});
+	}
+	plotMargin() {
+		const count = this.rawLines().length;
+		return {
+			...super.plotMargin(),
+			right: count >= 2 && count <= END_LABELS ? 62 : 22
+		};
+	}
+	yTicks() {
+		return Math.max(2, Math.min(6, Math.floor(this.mainHeight / 34)));
+	}
+	scales(ctx) {
+		const { width, height } = ctx.plot;
+		const lines = this.rawLines();
+		const share = this.subShare();
+		const subHeight = share ? Math.max(0, height - GAP) * share : 0;
+		const sub = !share ? null : this.subOnTop() ? {
+			top: 0,
+			bottom: subHeight
+		} : {
+			top: height - subHeight,
+			bottom: height
+		};
+		const main = !share ? {
+			top: 0,
+			bottom: height
+		} : this.subOnTop() ? {
+			top: subHeight + GAP,
+			bottom: height
+		} : {
+			top: 0,
+			bottom: height - subHeight - GAP
+		};
+		this.mainHeight = main.bottom - main.top;
+		const dates = lines.flatMap((item) => item.points.map((point) => point.date));
+		const first = dates.reduce((a, b) => b < a ? b : a, dates[0] ?? /* @__PURE__ */ new Date(0));
+		const last = dates.reduce((a, b) => b > a ? b : a, dates[0] ?? /* @__PURE__ */ new Date(864e5));
+		return {
+			x: scaleUtc().domain(+first === +last ? [/* @__PURE__ */ new Date(+first - 864e5), /* @__PURE__ */ new Date(+last + 864e5)] : [first, last]).range([0, width]),
+			y: this.axisScale(lines, main),
+			lines,
+			main,
+			sub
+		};
+	}
+	/** Dated hover columns with a guide line; every series is read out at once. */
+	columns(ctx, { x, lines }) {
+		const times = [...new Set(lines.flatMap((item) => item.points.map((point) => point.date.getTime())))].sort((a, b) => a - b);
+		const { width, height } = ctx.plot;
+		const edge = (i) => i <= 0 ? 0 : i >= times.length ? width : (x(new Date(times[i - 1])) + x(new Date(times[i]))) / 2;
+		const guide = ctx.marks("guide", "line", [0]).attr("stroke", ctx.theme.inkMuted).attr("stroke-dasharray", "2 3").attr("opacity", 0).attr("pointer-events", "none");
+		const hit = ctx.marks("hits", "rect", times).attr("fill", "transparent").attr("pointer-events", "all").attr("x", (_, i) => edge(i)).attr("width", (_, i) => edge(i + 1) - edge(i)).attr("y", 0).attr("height", height);
+		ctx.hover(hit, (time) => ({
+			title: new Date(time).toISOString().slice(0, 10),
+			rows: this.tipRows(new Date(time), lines)
+		}));
+		const root = ctx.root.node();
+		hit.on("pointermove.guide", (event) => {
+			const [px] = pointer(event, root);
+			guide.attr("opacity", 1).attr("x1", px).attr("x2", px).attr("y1", 0).attr("y2", height);
+		}).on("pointerleave.guide", () => guide.attr("opacity", 0));
+	}
+	/** Direct labels past the line ends, pushed apart so they never collide. */
+	endLabels(ctx, ends) {
+		const shown = ends.length >= 2 && ends.length <= END_LABELS ? [...ends].sort((a, b) => a.y - b.y) : [];
+		let floor = -Infinity;
+		const placed = shown.map((end) => {
+			floor = Math.max(end.y, floor + 13);
+			return {
+				name: end.name.length > 9 ? `${end.name.slice(0, 8)}…` : end.name,
+				y: Math.min(floor, ctx.plot.height - 2)
+			};
+		});
+		const widest = max(placed, (label) => label.name.length) ?? 0;
+		FinanceInk.note(ctx, "end-labels", widest ? placed : [], (label) => ({
+			x: ctx.plot.width + 6,
+			y: label.y + 4,
+			text: label.name
+		}), 11, "secondary");
+	}
+};
+export { EquityBase };

package/dist/charts/financial/EquityCurve.js

@@ -0,0 +1,170 @@
+import { ChartFamily, CurveKind, DataShape, Dimension } from "../../core/enums.js";
+import { SampleData } from "../../data/SampleData.js";
+import { DrawdownMath } from "./DrawdownMath.js";
+import { EquityBase } from "./EquityBase.js";
+import { EquityBasis, EquityFill } from "./financeEnums.js";
+import { FinanceInk } from "./FinanceInk.js";
+import { area, curveLinear, curveMonotoneX, curveStepAfter, line, max, min, scaleLinear, scaleLog } from "d3";
+// src/charts/financial/EquityCurve.ts
+var CURVES = {
+	[CurveKind.Linear]: curveLinear,
+	[CurveKind.Monotone]: curveMonotoneX,
+	[CurveKind.StepAfter]: curveStepAfter
+};
+/** Growth of an account or strategy: use it to compare portfolios and a benchmark from a shared start. */
+var EquityCurve = class extends EquityBase {
+	static meta = {
+		id: "equity-curve",
+		name: "Equity curve",
+		family: ChartFamily.Financial,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Tracks account value through time against a benchmark, with high-water marks and an underwater pane.",
+		tags: [
+			"portfolio",
+			"performance",
+			"backtest",
+			"cumulative return",
+			"benchmark"
+		],
+		sample: (seed) => SampleData.timeSeries(seed, 150, 3),
+		variants: {
+			basis: [
+				EquityBasis.Rebased,
+				EquityBasis.Absolute,
+				EquityBasis.Percent,
+				EquityBasis.Log
+			],
+			curve: [
+				CurveKind.Linear,
+				CurveKind.StepAfter,
+				CurveKind.Monotone
+			],
+			fill: [
+				EquityFill.None,
+				EquityFill.Area,
+				EquityFill.Relative
+			],
+			highWater: [false, true],
+			drawdownPane: [false, true]
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			basis: EquityBasis.Rebased,
+			curve: CurveKind.Linear,
+			fill: EquityFill.None,
+			highWater: false,
+			drawdownPane: false
+		};
+	}
+	subShare() {
+		return this.options.drawdownPane ? .28 : 0;
+	}
+	drawn(item) {
+		const base = item.points[0]?.value;
+		const { basis } = this.options;
+		if (!base || basis === EquityBasis.Absolute || basis === EquityBasis.Log) return item.points;
+		const rescale = basis === EquityBasis.Percent ? (value) => (value - base) / Math.abs(base) * 100 : (value) => value / base * 100;
+		return item.points.map((point) => ({
+			date: point.date,
+			value: rescale(point.value)
+		}));
+	}
+	axisValues(lines) {
+		return lines.flatMap((item) => this.drawn(item).map((point) => point.value));
+	}
+	axisScale(lines, main) {
+		const values = this.axisValues(lines);
+		const low = min(values) ?? 0, high = max(values) ?? 1;
+		const pad = (high - low || 1) * .05;
+		if (this.options.basis === EquityBasis.Log && low > 0) {
+			const log = scaleLog([low * .97, high * 1.03], [main.bottom, main.top]);
+			const all = log.ticks.bind(log);
+			log.ticks = (count) => {
+				const kept = [];
+				for (const tick of all(count)) if (kept.length === 0 || Math.abs(log(tick) - log(kept.at(-1))) >= 22) kept.push(tick);
+				return kept;
+			};
+			return log;
+		}
+		return scaleLinear([low - pad, high + pad], [main.bottom, main.top]).nice(this.yTicks());
+	}
+	tickFormat(scale) {
+		const base = super.tickFormat(scale);
+		if (!base || this.options.basis !== EquityBasis.Percent || typeof scale.domain()[0] !== "number") return base;
+		return (value) => `${base(value)}%`;
+	}
+	tipRows(date, lines) {
+		return lines.flatMap((item) => this.drawn(item).filter((point) => +point.date === +date).map((point) => [item.name, point.value.toFixed(2)]));
+	}
+	plotMarks(ctx, axes) {
+		const { x, y, lines, main } = axes;
+		const { fill, highWater, basis } = this.options;
+		const curve = CURVES[this.options.curve] ?? curveLinear;
+		const trace = line().curve(curve).x((point) => x(point.date)).y((point) => y(point.value));
+		const floor = basis === EquityBasis.Percent ? y(0) : main.bottom;
+		const shade = area().curve(curve).x((point) => x(point.date)).y0(Math.min(main.bottom, floor)).y1((point) => y(point.value));
+		this.drawRelative(ctx, axes, fill === EquityFill.Relative ? lines : []);
+		FinanceInk.rules(ctx, "base", lines.length && basis === EquityBasis.Percent ? [y(0)] : basis === EquityBasis.Rebased && lines.length ? [y(100)] : [], ctx.plot.width, ctx.theme.axis, null);
+		const ends = [];
+		lines.slice(0, 8).forEach((item, slot) => {
+			const color = ctx.palette.color(item.name), points = this.drawn(item);
+			FinanceInk.fill(ctx, `equity-fill-${slot}`, fill === EquityFill.Area ? shade(points) : null, color, lines.length > 1 ? .1 : .18);
+			const peaks = DrawdownMath.peaks(points);
+			FinanceInk.stroke(ctx, `equity-peak-${slot}`, highWater ? trace(points.map((point, i) => ({
+				date: point.date,
+				value: peaks[i]
+			}))) : null, color, 1, "3 3");
+			FinanceInk.stroke(ctx, `equity-line-${slot}`, trace(points), color, slot ? 1.5 : 2);
+			const last = points.at(-1);
+			if (last) ends.push({
+				name: item.name,
+				y: y(last.value)
+			});
+		});
+		this.endLabels(ctx, ends);
+		this.drawUnderwater(ctx, axes);
+		this.columns(ctx, axes);
+	}
+	drawRelative(ctx, { x, y }, lines) {
+		const [a, b] = lines;
+		const other = b ? new Map(this.drawn(b).map((point) => [+point.date, point.value])) : /* @__PURE__ */ new Map();
+		const points = a ? this.drawn(a).flatMap((point) => other.has(+point.date) ? [[
+			x(point.date),
+			y(point.value),
+			y(other.get(+point.date))
+		]] : []) : [];
+		const band = FinanceInk.splitBand(points);
+		FinanceInk.fill(ctx, "ahead", band.above || null, ctx.palette.diverging(-1), .2);
+		FinanceInk.fill(ctx, "behind", band.below || null, ctx.palette.diverging(1), .2);
+	}
+	drawUnderwater(ctx, { x, lines, sub }) {
+		const shown = sub ? lines.slice(0, 8) : [];
+		const series = shown.map((item) => DrawdownMath.series(item.points, true));
+		const deepest = min(series.flat(), (point) => point.value) ?? 0;
+		const scale = scaleLinear([Math.min(-1, deepest), 0], sub ? [sub.bottom, sub.top] : [0, 0]).nice(2);
+		FinanceInk.paneAxis(ctx, "underwater-axis", series.length ? scale.ticks(2) : [], scale, (value) => `${value}%`, ctx.plot.width);
+		const trace = line().x((point) => x(point.date)).y((point) => scale(point.value));
+		for (const slot of [
+			0,
+			1,
+			2,
+			3,
+			4,
+			5,
+			6,
+			7
+		]) {
+			const points = series[slot];
+			FinanceInk.stroke(ctx, `underwater-${slot}`, points ? trace(points) : null, shown[slot] ? ctx.palette.color(shown[slot].name) : ctx.theme.axis, 1.5);
+		}
+		FinanceInk.note(ctx, "underwater-title", sub ? ["Drawdown"] : [], (text) => ({
+			x: 4,
+			y: sub.bottom - 4,
+			text
+		}), 10, "muted");
+	}
+};
+export { EquityCurve };

package/dist/charts/financial/FinanceInk.js

@@ -0,0 +1,87 @@
+// src/charts/financial/FinanceInk.ts
+/** Shared drawing moves for the financial module, so every chart animates and labels the same way. */
+var FinanceInk = class {
+	/** One animated line: draws on the first time, then morphs. `d = null` removes it. */
+	static stroke(ctx, name, d, color, width = 2, dash = null) {
+		const path = ctx.marks(name, "path", d ? [d] : []).attr("fill", "none").attr("stroke", color).attr("stroke-width", width).attr("stroke-linejoin", "round").attr("stroke-linecap", "round").attr("stroke-dasharray", dash);
+		if (path.empty()) return path;
+		if (path.attr("d") === null) {
+			path.attr("d", d);
+			ctx.drawOn(path);
+		} else ctx.set(path, { d });
+		return path;
+	}
+	/** One animated filled region that fades in. `d = null` removes it. */
+	static fill(ctx, name, d, color, opacity = .16) {
+		const path = ctx.marks(name, "path", d ? [d] : []).attr("fill", color).attr("stroke", "none");
+		return ctx.set(path, {
+			d: d ?? "",
+			"fill-opacity": opacity
+		}, {
+			d: d ?? "",
+			"fill-opacity": 0
+		});
+	}
+	/** Bar with a 4px rounded data end; the baseline end stays square. */
+	static bar(x, width, base, end, radius = 4) {
+		const rise = base - end;
+		const r = Math.max(0, Math.min(radius, width / 2, Math.abs(rise)));
+		const sign = rise >= 0 ? 1 : -1;
+		return `M${x},${base}V${end + sign * r}Q${x},${end} ${x + r},${end}H${x + width - r}Q${x + width},${end} ${x + width},${end + sign * r}V${base}Z`;
+	}
+	/** Region between two aligned lines, split at each crossing into `a` above `b` and `b` above `a`. Points are `[x, a, b]` in pixels, y growing down. */
+	static splitBand(points) {
+		const quads = {
+			above: "",
+			below: ""
+		};
+		const quad = (x0, a0, b0, x1, a1, b1) => {
+			quads[a0 <= b0 && a1 <= b1 ? "above" : "below"] += `M${x0},${a0}L${x1},${a1}L${x1},${b1}L${x0},${b0}Z`;
+		};
+		points.slice(1).forEach(([x1, a1, b1], i) => {
+			const [x0, a0, b0] = points[i];
+			const d0 = a0 - b0, d1 = a1 - b1;
+			if (d0 * d1 >= 0) return quad(x0, a0, b0, x1, a1, b1);
+			const t = d0 / (d0 - d1), xm = x0 + (x1 - x0) * t, ym = a0 + (a1 - a0) * t;
+			quad(x0, a0, b0, xm, ym, ym);
+			quad(xm, ym, ym, x1, a1, b1);
+		});
+		return quads;
+	}
+	/** Straight reference rules across the plot at each y. */
+	static rules(ctx, name, levels, width, color, dash = "3 3") {
+		const rule = ctx.marks(name, "line", levels).attr("stroke", color).attr("stroke-width", 1).attr("stroke-dasharray", dash);
+		ctx.set(rule, {
+			x1: 0,
+			x2: width,
+			y1: (level) => level,
+			y2: (level) => level
+		}, {
+			x1: 0,
+			x2: 0,
+			y1: (level) => level,
+			y2: (level) => level
+		});
+	}
+	/** Short text with a surface halo, so it stays readable over marks. */
+	static note(ctx, name, notes, at, size = 10, tone = "secondary") {
+		const text = ctx.text(ctx.marks(name, "text", notes), size, tone).attr("stroke", ctx.theme.surface).attr("stroke-width", 3).attr("paint-order", "stroke").attr("stroke-linejoin", "round").attr("text-anchor", (note) => at(note).anchor ?? "start").text((note) => at(note).text);
+		ctx.set(text, {
+			x: (note) => at(note).x,
+			y: (note) => at(note).y
+		}, {
+			x: (note) => at(note).x,
+			y: (note) => at(note).y
+		});
+		return text;
+	}
+	/** Grid and tick labels for a secondary pane, matching the main axis. */
+	static paneAxis(ctx, name, ticks, scale, format, width) {
+		const grid = ctx.marks(`${name}-grid`, "line", ticks).attr("stroke", ctx.theme.grid).attr("stroke-width", 1);
+		grid.attr("x1", 0).attr("x2", width).attr("y1", scale).attr("y2", scale);
+		grid.lower();
+		ctx.group(`${name}-grid`).lower();
+		ctx.text(ctx.marks(`${name}-ticks`, "text", ticks)).attr("x", -3).attr("y", scale).attr("dy", "0.32em").attr("text-anchor", "end").text(format);
+	}
+};
+export { FinanceInk };

package/dist/charts/financial/FinanceMath.js

@@ -0,0 +1,121 @@
+import { MovingAverageKind } from "./financeEnums.js";
+// src/charts/financial/FinanceMath.ts
+var present = (value) => value !== null;
+/** Pure indicator maths on arrays aligned with the bars: `null` until a window fills. */
+var FinanceMath = class {
+	static aligned(values, compute) {
+		const first = values.findIndex(present);
+		if (first < 0) return values.map(() => null);
+		return [...values.slice(0, first).map(() => null), ...compute(values.slice(first).map((value) => value ?? 0))];
+	}
+	static windowed(values, period, fn) {
+		return this.aligned(values, (clean) => clean.map((_, i) => i + 1 < period ? null : fn(clean.slice(i + 1 - period, i + 1))));
+	}
+	static sma(values, period) {
+		return this.windowed(values, period, (slice) => slice.reduce((a, b) => a + b, 0) / slice.length);
+	}
+	static wma(values, period) {
+		const weight = period * (period + 1) / 2;
+		return this.windowed(values, period, (slice) => slice.reduce((sum, value, i) => sum + value * (i + 1), 0) / weight);
+	}
+	static recursive(values, period, alpha) {
+		return this.aligned(values, (clean) => {
+			let last = null;
+			return clean.map((value, i) => {
+				if (i + 1 < period) return null;
+				last = last === null ? clean.slice(0, period).reduce((a, b) => a + b, 0) / period : last + alpha * (value - last);
+				return last;
+			});
+		});
+	}
+	static ema(values, period) {
+		return this.recursive(values, period, 2 / (period + 1));
+	}
+	static wilder(values, period) {
+		return this.recursive(values, period, 1 / period);
+	}
+	static average(kind, values, period) {
+		switch (kind) {
+			case MovingAverageKind.Exponential: return this.ema(values, period);
+			case MovingAverageKind.Weighted: return this.wma(values, period);
+			case MovingAverageKind.Wilder: return this.wilder(values, period);
+			default: return this.sma(values, period);
+		}
+	}
+	static stdev(values, period) {
+		return this.windowed(values, period, (slice) => {
+			const mean = slice.reduce((a, b) => a + b, 0) / slice.length;
+			return Math.sqrt(slice.reduce((sum, value) => sum + (value - mean) ** 2, 0) / slice.length);
+		});
+	}
+	static highest(values, period) {
+		return this.windowed(values, period, (slice) => Math.max(...slice));
+	}
+	static lowest(values, period) {
+		return this.windowed(values, period, (slice) => Math.min(...slice));
+	}
+	static trueRange(bars) {
+		return bars.map((bar, i) => {
+			const previous = bars[i - 1]?.close ?? bar.close;
+			return Math.max(bar.high - bar.low, Math.abs(bar.high - previous), Math.abs(bar.low - previous));
+		});
+	}
+	static atr(bars, period = 14) {
+		return this.wilder(this.trueRange(bars), period);
+	}
+	/** Last available ATR, or the mean true range when the series is shorter than the window. */
+	static lastAtr(bars, period = 14) {
+		const value = this.atr(bars, period).at(-1);
+		if (value) return value;
+		const ranges = this.trueRange(bars);
+		return ranges.reduce((a, b) => a + b, 0) / Math.max(1, ranges.length);
+	}
+	static vwap(bars) {
+		let dollars = 0, shares = 0;
+		return bars.map((bar) => {
+			dollars += (bar.high + bar.low + bar.close) / 3 * bar.volume;
+			shares += bar.volume;
+			return shares ? dollars / shares : (bar.high + bar.low + bar.close) / 3;
+		});
+	}
+	static rsi(values, period, kind) {
+		const change = values.map((value, i) => i ? value - values[i - 1] : null);
+		const gain = this.average(kind, change.map((c) => c === null ? null : Math.max(0, c)), period);
+		const loss = this.average(kind, change.map((c) => c === null ? null : Math.max(0, -c)), period);
+		return gain.map((up, i) => {
+			const down = loss[i];
+			if (up === null || down === null || down === void 0) return null;
+			return up + down === 0 ? 50 : 100 * up / (up + down);
+		});
+	}
+	/** Position of each value inside its trailing high-low window, 0..100. */
+	static stochastic(values, highs, lows, period) {
+		const top = this.highest(highs, period), bottom = this.lowest(lows, period);
+		return values.map((value, i) => {
+			const high = top[i], low = bottom[i];
+			if (value === null || high == null || low == null) return null;
+			return high === low ? 50 : 100 * (value - low) / (high - low);
+		});
+	}
+	static subtract(a, b) {
+		return a.map((value, i) => value === null || b[i] == null ? null : value - b[i]);
+	}
+	static midpoint(a, b) {
+		return a.map((value, i) => value === null || b[i] == null ? null : (value + b[i]) / 2);
+	}
+	/** Normal CDF via the Abramowitz and Stegun approximation. */
+	static normalCdf(x) {
+		const t = 1 / (1 + .2316419 * Math.abs(x));
+		const tail = Math.exp(-x * x / 2) / Math.sqrt(2 * Math.PI) * t * (.31938153 + t * (-.356563782 + t * (1.781477937 + t * (-1.821255978 + t * 1.330274429))));
+		return x >= 0 ? 1 - tail : tail;
+	}
+	/** Black-Scholes value with zero rate; collapses to intrinsic value at expiry. */
+	static optionValue(call, spot, strike, volatility, years) {
+		if (years <= 0 || volatility <= 0 || spot <= 0 || strike <= 0) return Math.max(0, call ? spot - strike : strike - spot);
+		const root = volatility * Math.sqrt(years);
+		const d1 = (Math.log(spot / strike) + volatility * volatility * years / 2) / root;
+		const d2 = d1 - root;
+		return call ? spot * this.normalCdf(d1) - strike * this.normalCdf(d2) : strike * this.normalCdf(-d2) - spot * this.normalCdf(-d1);
+	}
+};
+export { FinanceMath };

package/dist/charts/financial/HeikinAshiChart.js

@@ -0,0 +1,58 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SampleData } from "../../data/SampleData.js";
+import { CandleBody, PriceOverlay, PriceScale, VolumeLayout } from "./financeEnums.js";
+import { PriceChart } from "./PriceChart.js";
+import { PriceMarks } from "./PriceMarks.js";
+import { PriceTransforms } from "./PriceTransforms.js";
+// src/charts/financial/HeikinAshiChart.ts
+/** Averaged candles that hold their colour through a trend: use it to stay with a move and ignore noise. */
+var HeikinAshiChart = class extends PriceChart {
+	static meta = {
+		id: "heikin-ashi",
+		name: "Heikin-Ashi chart",
+		family: ChartFamily.Financial,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Averages each session with the last to filter noise, so runs of one colour mark a sustained trend.",
+		tags: [
+			"candles",
+			"trend",
+			"smoothed"
+		],
+		sample: (seed) => SampleData.ohlc(seed, 72),
+		variants: {
+			smoothed: [false, true],
+			hollow: [false, true],
+			wicks: [true, false],
+			overlay: [
+				PriceOverlay.None,
+				PriceOverlay.EMA,
+				PriceOverlay.Keltner
+			],
+			volumeLayout: [
+				VolumeLayout.None,
+				VolumeLayout.Pane,
+				VolumeLayout.Overlay
+			],
+			scale: [PriceScale.Linear, PriceScale.Log]
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			smoothed: false,
+			hollow: false,
+			wicks: true
+		};
+	}
+	shown(bars) {
+		return this.options.smoothed ? PriceTransforms.smoothed(bars) : PriceTransforms.heikinAshi(bars);
+	}
+	priceMarks(ctx, view, tones) {
+		PriceMarks.candles(ctx, view, tones, view.bars, {
+			body: this.options.hollow ? CandleBody.Hollow : CandleBody.Solid,
+			wicks: this.options.wicks
+		});
+	}
+};
+export { HeikinAshiChart };

package/dist/charts/financial/IchimokuCloud.js

@@ -0,0 +1,112 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SampleData } from "../../data/SampleData.js";
+import { IchimokuLines, IchimokuPeriods, PriceMark, PriceScale } from "./financeEnums.js";
+import { FinanceInk } from "./FinanceInk.js";
+import { FinanceMath } from "./FinanceMath.js";
+import { PriceChart } from "./PriceChart.js";
+import { PriceMarks } from "./PriceMarks.js";
+// src/charts/financial/IchimokuCloud.ts
+/** Complete trend system: use the cloud for support and direction, the lines for momentum and timing. */
+var IchimokuCloud = class extends PriceChart {
+	static meta = {
+		id: "ichimoku-cloud",
+		name: "Ichimoku Cloud",
+		family: ChartFamily.Financial,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Projects a cloud of future support ahead of price, with conversion and base lines showing momentum.",
+		tags: [
+			"kumo",
+			"kinko hyo",
+			"trend",
+			"tenkan",
+			"kijun"
+		],
+		sample: (seed) => SampleData.ohlc(seed, 130),
+		variants: {
+			periods: [
+				IchimokuPeriods.Classic,
+				IchimokuPeriods.Fast,
+				IchimokuPeriods.Slow
+			],
+			mark: [
+				PriceMark.Candles,
+				PriceMark.Line,
+				PriceMark.Bars
+			],
+			lines: [
+				IchimokuLines.All,
+				IchimokuLines.NoChikou,
+				IchimokuLines.CloudOnly
+			],
+			scale: [PriceScale.Linear, PriceScale.Log]
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			periods: IchimokuPeriods.Classic,
+			mark: PriceMark.Candles,
+			lines: IchimokuLines.All
+		};
+	}
+	get windows() {
+		return this.options.periods.split("-").map(Number);
+	}
+	futureSessions() {
+		return this.windows[1];
+	}
+	twoTone() {
+		return this.options.mark !== PriceMark.Line;
+	}
+	compute(bars) {
+		const [fast, base, slow] = this.windows;
+		const highs = bars.map((bar) => bar.high), lows = bars.map((bar) => bar.low);
+		const middle = (period) => FinanceMath.midpoint(FinanceMath.highest(highs, period), FinanceMath.lowest(lows, period));
+		const tenkan = middle(fast), kijun = middle(base);
+		return {
+			tenkan,
+			kijun,
+			spanA: FinanceMath.midpoint(tenkan, kijun),
+			spanB: middle(slow),
+			chikou: bars.map((bar, i) => i < base ? null : bar.close),
+			shift: base
+		};
+	}
+	studies(bars) {
+		const { tenkan, kijun, spanA, spanB } = this.compute(bars);
+		return [{
+			name: "Ichimoku",
+			mid: tenkan,
+			upper: spanA,
+			lower: spanB
+		}, {
+			name: "Kijun",
+			mid: kijun
+		}];
+	}
+	drawStudies() {}
+	priceMarks(ctx, view, tones) {
+		const { tenkan, kijun, spanA, spanB, chikou, shift } = this.compute(view.bars);
+		const { x, y } = view;
+		const points = spanA.flatMap((a, i) => a === null || spanB[i] === null ? [] : [[
+			x(i + shift),
+			y(a),
+			y(spanB[i])
+		]]);
+		const cloud = FinanceInk.splitBand(points);
+		FinanceInk.fill(ctx, "kumo-bull", cloud.above || null, tones.up, .18);
+		FinanceInk.fill(ctx, "kumo-bear", cloud.below || null, tones.down, .18);
+		PriceMarks.line(ctx, view, "span-a", spanA, tones.up, 1, null, shift);
+		PriceMarks.line(ctx, view, "span-b", spanB, tones.down, 1, null, shift);
+		this.drawPrice(ctx, view, tones, this.options.mark);
+		const { lines } = this.options;
+		const hidden = lines === IchimokuLines.CloudOnly;
+		const color = (name) => hidden ? ctx.theme.axis : ctx.palette.color(name);
+		PriceMarks.line(ctx, view, "tenkan", hidden ? [] : tenkan, color("Tenkan"), 1.5);
+		PriceMarks.line(ctx, view, "kijun", hidden ? [] : kijun, color("Kijun"), 2);
+		const chikouOn = lines === IchimokuLines.All;
+		PriceMarks.line(ctx, view, "chikou", chikouOn ? chikou : [], chikouOn ? ctx.palette.color("Chikou") : ctx.theme.axis, 1.5, "4 3", -shift);
+	}
+};
+export { IchimokuCloud };