@magmonium/one 0.4.79 → 0.4.81

package/fesm2022/magmonium-one.mjs

@@ -18005,15 +18005,14 @@ const toChartTime = (value) => {
 	const parsed = Date.parse(value);
 	return Number.isFinite(parsed) ? parsed : null;
 };
-const readChartPoints = (rows, x, y) => {
+const readChartPoints = (rows, x, y, per) => {
 	const pairs = [];
 	for (const row of rows ?? []) {
 		if (row == null || typeof row !== "object") continue;
 		const record = row;
 		const t = toChartTime(record[x]);
-		const raw = record[y];
-		const v = typeof raw === "string" && raw.trim() ? Number(raw) : raw;
-		if (t === null || typeof v !== "number" || !Number.isFinite(v)) continue;
+		const v = readChartValue(record, y, per);
+		if (t === null || v === null) continue;
 		pairs.push([t, v]);
 	}
 	for (let i = 1; i < pairs.length; i++) if (pairs[i][0] < pairs[i - 1][0]) {
@@ -18025,6 +18024,46 @@ const readChartPoints = (rows, x, y) => {
 		y: pairs.map((p) => p[1])
 	};
 };
+const toChartNumber = (raw) => {
+	const v = typeof raw === "string" && raw.trim() ? Number(raw) : raw;
+	return typeof v === "number" && Number.isFinite(v) ? v : null;
+};
+const readChartValue = (record, y, per) => {
+	const v = toChartNumber(record[y]);
+	if (v === null || !per) return v;
+	const base = toChartNumber(record[per]);
+	return base ? v / base * 100 : null;
+};
+const readChartCategories = (rows, x, y, per) => {
+	const out = {
+		x: [],
+		y: []
+	};
+	for (const row of rows ?? []) {
+		if (row == null || typeof row !== "object") continue;
+		const record = row;
+		const raw = record[x];
+		const label = typeof raw === "string" || typeof raw === "number" ? String(raw).trim() : "";
+		const v = readChartValue(record, y, per);
+		if (!label || v === null) continue;
+		out.x.push(label);
+		out.y.push(v);
+	}
+	return out;
+};
+const mergeCategories = (series) => {
+	const seen = /* @__PURE__ */ new Set();
+	for (const { x } of series) for (const label of x) seen.add(label);
+	return [...seen];
+};
+const columnPath = (x, width, y0, y1, radius = 4) => {
+	const h = Math.abs(y0 - y1);
+	const r = Math.max(0, Math.min(radius, h / 2, width / 2));
+	const f = (v) => v.toFixed(1);
+	const dir = y1 <= y0 ? 1 : -1;
+	const right = x + width;
+	return `M${f(x)} ${f(y0)}V${f(y1 + dir * r)}Q${f(x)} ${f(y1)} ${f(x + r)} ${f(y1)}H${f(right - r)}Q${f(right)} ${f(y1)} ${f(right)} ${f(y1 + dir * r)}V${f(y0)}Z`;
+};
 const lowerBound = (times, x) => {
 	let lo = 0;
 	let hi = times.length;
@@ -18265,6 +18304,22 @@ const sampleChartPoints = (index, end = Date.UTC(2026, 0, 2)) => {
 		y
 	};
 };
+const sampleChartCategories = (index) => ({
+	x: [
+		"2022",
+		"2023",
+		"2024",
+		"2025",
+		"2026"
+	],
+	y: [
+		59,
+		68,
+		94,
+		107,
+		108
+	].map((v) => v * .25 ** index)
+});
 const MARGIN = {
 	top: 12,
 	right: 16,
@@ -18288,6 +18343,12 @@ const NAV_TOP = 4;
 const GRIP_SLOP = 8;
 const MIN_WINDOW_SHARE = .02;
 const KEY_PAN_SHARE = .1;
+const STRIP_GAP = 40;
+const STRIP_HEIGHT = 72;
+const COLUMN_MAX = 40;
+const COLUMN_MIN = 4;
+const COLUMN_GAP = 2;
+const COLUMN_FILL = .6;
 const optionalNumber = (value) => value == null || value === "" ? void 0 : numberAttribute(value, void 0);
 const optionalBoolean = (value) => value == null ? void 0 : booleanAttribute(value);
 let nextId$2 = 0;
@@ -18345,7 +18406,7 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 	minimal = computed(() => (this.variant() ?? this.config()?.variant) === "minimal", ...ngDevMode ? [{ debugName: "minimal" }] : /* istanbul ignore next */ []);
 	margin = computed(() => this.minimal() ? MINIMAL_MARGIN : MARGIN, ...ngDevMode ? [{ debugName: "margin" }] : /* istanbul ignore next */ []);
 	showNavigator = computed(() => !this.minimal() && (this.navigator() ?? this.config()?.navigator ?? false), ...ngDevMode ? [{ debugName: "showNavigator" }] : /* istanbul ignore next */ []);
-	canMeasure = computed(() => !this.minimal() && (this.measure() ?? this.config()?.measure ?? false), ...ngDevMode ? [{ debugName: "canMeasure" }] : /* istanbul ignore next */ []);
+	canMeasure = computed(() => !this.minimal() && !this.categorical() && (this.measure() ?? this.config()?.measure ?? false), ...ngDevMode ? [{ debugName: "canMeasure" }] : /* istanbul ignore next */ []);
 	presets = computed(() => {
 		const authored = this.config()?.ranges;
 		const ids = (authored?.length ? authored : DEFAULT_SECTION_CHART_RANGES).filter(isPresetId).map((id) => id.trim().toLowerCase());
@@ -18370,7 +18431,158 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 			};
 		});
 	}, ...ngDevMode ? [{ debugName: "painted" }] : /* istanbul ignore next */ []);
+	categorical = computed(() => this.members().some(({ member }) => member.mark() === "column"), ...ngDevMode ? [{ debugName: "categorical" }] : /* istanbul ignore next */ []);
+	categoryData = computed(() => {
+		if (!this.categorical()) return {
+			categories: [],
+			series: []
+		};
+		const read = this.painted().map(({ member, color }) => ({
+			member,
+			color,
+			label: member.label(),
+			noTranslate: member.noTranslate(),
+			params: member.params(),
+			mark: member.mark(),
+			panel: member.panel(),
+			ratio: member.ratio(),
+			...member.categories()
+		}));
+		const withData = read.filter((s) => s.x.length);
+		const source = withData.length || !this.isDesignMode ? withData : read.map((s, i) => ({
+			...s,
+			...sampleChartCategories(i)
+		}));
+		const categories = mergeCategories(source);
+		return {
+			categories,
+			series: source.map(({ x, y, ...s }) => ({
+				...s,
+				values: categories.map((c) => {
+					const j = x.indexOf(c);
+					return j < 0 ? null : y[j];
+				})
+			}))
+		};
+	}, ...ngDevMode ? [{ debugName: "categoryData" }] : /* istanbul ignore next */ []);
+	hasStrip = computed(() => this.categoryData().series.some((s) => s.panel === "strip"), ...ngDevMode ? [{ debugName: "hasStrip" }] : /* istanbul ignore next */ []);
+	svgHeight = computed(() => this.resolvedHeight() + (this.hasStrip() ? 112 : 0), ...ngDevMode ? [{ debugName: "svgHeight" }] : /* istanbul ignore next */ []);
+	bandCentre = computed(() => {
+		const band = this.plotWidth() / Math.max(1, this.categoryData().categories.length);
+		const left = this.left();
+		return (i) => left + band * (i + .5);
+	}, ...ngDevMode ? [{ debugName: "bandCentre" }] : /* istanbul ignore next */ []);
+	categoryExtent = computed(() => {
+		const main = this.categoryData().series.filter((s) => s.panel === "main");
+		const values = main.flatMap((s) => s.values.filter((v) => v !== null));
+		if (!values.length) return null;
+		return {
+			...niceTicks(Math.min(0, ...values), Math.max(0, ...values)),
+			ratio: main.every((s) => s.ratio)
+		};
+	}, ...ngDevMode ? [{ debugName: "categoryExtent" }] : /* istanbul ignore next */ []);
+	categorySy = computed(() => {
+		const extent = this.categoryExtent();
+		const height = this.plotHeight();
+		const top = this.top();
+		return (v) => extent ? top + (1 - (v - extent.min) / (extent.max - extent.min)) * height : top + height;
+	}, ...ngDevMode ? [{ debugName: "categorySy" }] : /* istanbul ignore next */ []);
+	categoryView = computed(() => {
+		const { categories, series } = this.categoryData();
+		const extent = this.categoryExtent();
+		if (!categories.length) return null;
+		const n = categories.length;
+		const band = this.plotWidth() / n;
+		const centre = this.bandCentre();
+		const sy = this.categorySy();
+		const last = n - 1;
+		const columnSeries = series.filter((s) => s.panel === "main" && s.mark === "column");
+		const k = Math.max(1, columnSeries.length);
+		const colWidth = Math.max(COLUMN_MIN, Math.min(COLUMN_MAX, (band * COLUMN_FILL - (k - 1) * COLUMN_GAP) / k));
+		const group = k * colWidth + (k - 1) * COLUMN_GAP;
+		const base = extent ? sy(0) : this.bottom();
+		const columns = [];
+		const labels = [];
+		columnSeries.forEach((s, c) => {
+			s.values.forEach((v, i) => {
+				if (v === null) return;
+				const x = centre(i) - group / 2 + c * (colWidth + COLUMN_GAP);
+				columns.push({
+					d: columnPath(x, colWidth, base, sy(v)),
+					color: s.color
+				});
+				if (i === last) labels.push({
+					x: x + colWidth / 2,
+					y: Math.min(sy(v), base) - 6,
+					text: this.formatShort(v, s.ratio)
+				});
+			});
+		});
+		const lineOf = (s, y) => {
+			const dots = s.values.flatMap((v, i) => v === null ? [] : [{
+				cx: centre(i),
+				cy: y(v),
+				v
+			}]);
+			return {
+				d: dots.map((p, i) => `${i ? "L" : "M"}${p.cx.toFixed(1)} ${p.cy.toFixed(1)}`).join(""),
+				dots
+			};
+		};
+		return {
+			columns,
+			labels,
+			lines: series.filter((s) => s.panel === "main" && s.mark === "line").map((s) => {
+				const { d, dots } = lineOf(s, sy);
+				const end = dots[dots.length - 1];
+				return {
+					d,
+					color: s.color,
+					endX: end?.cx ?? 0,
+					endY: end?.cy ?? 0
+				};
+			}),
+			strip: this.stripView(series, lineOf)
+		};
+	}, ...ngDevMode ? [{ debugName: "categoryView" }] : /* istanbul ignore next */ []);
+	stripView = (series, lineOf) => {
+		const strip = series.filter((s) => s.panel === "strip");
+		const values = strip.flatMap((s) => s.values.filter((v) => v !== null));
+		if (!values.length) return null;
+		const lo = Math.min(...values);
+		const hi = Math.max(...values);
+		const pad = (hi - lo || Math.abs(hi) || 1) * .2;
+		const ticks = niceTicks(lo - pad, hi + pad, 2);
+		const top = this.bottom() + STRIP_GAP;
+		const sy = (v) => top + (1 - (v - ticks.min) / (ticks.max - ticks.min || 1)) * STRIP_HEIGHT;
+		const ratio = strip.every((s) => s.ratio);
+		return {
+			top,
+			bottom: top + STRIP_HEIGHT,
+			ticks: [ticks.min, ticks.max].map((v) => ({
+				y: sy(v),
+				label: this.formatShort(v, ratio)
+			})),
+			lines: strip.map((s) => {
+				const { d, dots } = lineOf(s, sy);
+				return {
+					d,
+					color: s.color,
+					dots: dots.map((p) => ({
+						...p,
+						text: this.formatShort(p.v, s.ratio)
+					}))
+				};
+			})
+		};
+	};
+	categoryIndex = linkedSignal({
+		...ngDevMode ? { debugName: "categoryIndex" } : /* istanbul ignore next */ {},
+		source: this.categoryData,
+		computation: () => null
+	});
 	lines = computed(() => {
+		if (this.categorical()) return [];
 		const palette = this.palette();
 		const drawn = this.painted().map(({ member, color }) => ({
 			...member.points(),
@@ -18427,7 +18639,7 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 	top = computed(() => this.margin().top, ...ngDevMode ? [{ debugName: "top" }] : /* istanbul ignore next */ []);
 	right = computed(() => this.left() + this.plotWidth(), ...ngDevMode ? [{ debugName: "right" }] : /* istanbul ignore next */ []);
 	bottom = computed(() => this.top() + this.plotHeight(), ...ngDevMode ? [{ debugName: "bottom" }] : /* istanbul ignore next */ []);
-	viewBox = computed(() => `0 0 ${this.width()} ${this.resolvedHeight()}`, ...ngDevMode ? [{ debugName: "viewBox" }] : /* istanbul ignore next */ []);
+	viewBox = computed(() => `0 0 ${this.width()} ${this.svgHeight()}`, ...ngDevMode ? [{ debugName: "viewBox" }] : /* istanbul ignore next */ []);
 	plotted = computed(() => {
 		const pct = this.percent();
 		const maxPoints = Math.max(3, Math.round(this.plotWidth() / 1.5));
@@ -18491,8 +18703,18 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 		});
 	}, ...ngDevMode ? [{ debugName: "paths" }] : /* istanbul ignore next */ []);
 	yTicks = computed(() => {
+		if (this.minimal()) return [];
+		if (this.categorical()) {
+			const extent = this.categoryExtent();
+			const sy = this.categorySy();
+			return (extent?.ticks ?? []).map((v) => ({
+				y: sy(v),
+				label: this.formatShort(v, extent?.ratio ?? false),
+				zero: v === 0
+			}));
+		}
 		const extent = this.extent();
-		if (!extent || this.minimal()) return [];
+		if (!extent) return [];
 		const sy = this.sy();
 		const pct = this.percent();
 		return extent.ticks.map((v) => ({
@@ -18502,8 +18724,16 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 		}));
 	}, ...ngDevMode ? [{ debugName: "yTicks" }] : /* istanbul ignore next */ []);
 	xTicks = computed(() => {
+		if (this.minimal()) return [];
+		if (this.categorical()) {
+			const centre = this.bandCentre();
+			return this.categoryData().categories.map((label, i) => ({
+				x: centre(i),
+				label
+			}));
+		}
 		const extent = this.extent();
-		if (!extent || this.minimal()) return [];
+		if (!extent) return [];
 		const sx = this.sx();
 		return timeTicks(extent.t0, extent.t1, this.plotWidth() / 80).map((tick) => ({
 			x: sx(tick.t),
@@ -18511,11 +18741,18 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 		}));
 	}, ...ngDevMode ? [{ debugName: "xTicks" }] : /* istanbul ignore next */ []);
 	windowLabel = computed(() => {
+		const { categories } = this.categoryData();
+		if (categories.length) {
+			const first = categories[0];
+			const last = categories[categories.length - 1];
+			return first === last ? first : `${first} – ${last}`;
+		}
 		const span = this.drawnSpan();
 		return span ? `${this.dateFormat.format(span[0])} – ${this.dateFormat.format(span[1])}` : "";
 	}, ...ngDevMode ? [{ debugName: "windowLabel" }] : /* istanbul ignore next */ []);
 	periodLabel = computed(() => this.displayPeriod() || this.config()?.displayPeriod || this.windowLabel(), ...ngDevMode ? [{ debugName: "periodLabel" }] : /* istanbul ignore next */ []);
 	legendRows = computed(() => {
+		if (this.categorical()) return this.categoryLegendRows();
 		const changes = /* @__PURE__ */ new Map();
 		for (const line of this.windowed()) if (line.member) changes.set(line.member, chartChange(line.y));
 		return new Map(this.painted().map(({ member, color }) => [member, {
@@ -18575,7 +18812,68 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 			}
 		};
 	}, ...ngDevMode ? [{ debugName: "measureView" }] : /* istanbul ignore next */ []);
+	categoryLegendRows = () => {
+		const series = new Map(this.categoryData().series.map((s) => [s.member, s]));
+		return new Map(this.painted().map(({ member, color }) => {
+			const s = series.get(member);
+			return [member, {
+				color,
+				...s ? this.categoryChange(s.values, s.ratio, s.values.length - 1) : this.signedChange(null)
+			}];
+		}));
+	};
+	categoryChange = (values, ratio, i) => {
+		let last = i;
+		while (last >= 0 && values[last] === null) last--;
+		let prev = last - 1;
+		while (prev >= 0 && values[prev] === null) prev--;
+		const to = values[last];
+		const from = values[prev];
+		if (last < 0 || prev < 0 || to == null || from == null) return this.signedChange(null);
+		if (ratio) return this.signedPoints(to - from);
+		return this.signedChange(from ? (to / from - 1) * 100 : null);
+	};
+	categoryHover = computed(() => {
+		const index = this.categoryIndex();
+		const { categories, series } = this.categoryData();
+		if (index === null || !categories.length || this.minimal()) return null;
+		const i = Math.min(index, categories.length - 1);
+		const centre = this.bandCentre();
+		const band = this.plotWidth() / categories.length;
+		const sy = this.categorySy();
+		const strip = this.categoryView()?.strip;
+		const x = centre(i);
+		const rows = series.flatMap((s) => {
+			const v = s.values[i];
+			if (v === null) return [];
+			const line = s.panel === "main" && s.mark === "line";
+			const change = this.categoryChange(s.values, s.ratio, i);
+			return [{
+				color: s.color,
+				label: s.label,
+				noTranslate: s.noTranslate,
+				params: s.params,
+				v,
+				value: s.ratio ? this.formatShort(v, true) : this.numberFormat.format(v),
+				sub: change.change === "—" ? "" : change.change,
+				cx: line ? x : null,
+				cy: line ? sy(v) : null
+			}];
+		});
+		return {
+			x,
+			title: categories[i],
+			rows,
+			flip: x > this.width() - TOOLTIP_ROOM,
+			band: {
+				x: x - band / 2,
+				width: band,
+				bottom: strip?.bottom ?? this.bottom()
+			}
+		};
+	}, ...ngDevMode ? [{ debugName: "categoryHover" }] : /* istanbul ignore next */ []);
 	hover = computed(() => {
+		if (this.categorical()) return this.categoryHover();
 		const index = this.hoverIndex();
 		const times = this.times();
 		if (index === null || !times.length || this.minimal()) return null;
@@ -18603,7 +18901,8 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 			x,
 			title: this.dateFormat.format(t),
 			rows,
-			flip: x > this.width() - TOOLTIP_ROOM
+			flip: x > this.width() - TOOLTIP_ROOM,
+			band: null
 		};
 	}, ...ngDevMode ? [{ debugName: "hover" }] : /* istanbul ignore next */ []);
 	navScale = computed(() => {
@@ -18651,6 +18950,24 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 	navTop = NAV_TOP;
 	navViewBox = computed(() => `0 0 ${this.width()} ${NAV_HEIGHT}`, ...ngDevMode ? [{ debugName: "navViewBox" }] : /* istanbul ignore next */ []);
 	table = computed(() => {
+		if (this.categorical()) {
+			const { categories, series } = this.categoryData();
+			return {
+				columns: series.map((s) => ({
+					label: s.label,
+					noTranslate: s.noTranslate,
+					params: s.params
+				})),
+				rows: categories.map((date, i) => ({
+					date,
+					cells: series.map((s) => {
+						const v = s.values[i];
+						if (v === null) return "—";
+						return s.ratio ? this.formatShort(v, true) : this.numberFormat.format(v);
+					})
+				})).reverse()
+			};
+		}
 		const plotted = this.plotted();
 		const pct = this.percent();
 		const rows = [...plotted.reduce((best, p) => !best || p.line.t.length > best.line.t.length ? p : best, null)?.ds.t ?? []].reverse().map((t) => ({
@@ -18788,6 +19105,15 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 		return times[nearestIndex(times, t)];
 	};
 	onPointerMove = (event) => {
+		if (this.categorical()) {
+			const count = this.categoryData().categories.length;
+			if (!count) return;
+			const rect = event.currentTarget.getBoundingClientRect();
+			const px = event.clientX - rect.left - this.left();
+			if (px < 0 || px > this.plotWidth()) return;
+			this.categoryIndex.set(Math.min(count - 1, Math.floor(px / this.plotWidth() * count)));
+			return;
+		}
 		const t = this.plotTime(event);
 		if (t === null) return;
 		const measured = this.measured();
@@ -18815,9 +19141,37 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 		if (measured && measured[0] === measured[1]) this.measured.set(null);
 	};
 	clearHover = () => {
+		this.categoryIndex.set(null);
 		if (!this.measuring) this.hoverIndex.set(null);
 	};
+	onCategoryKeydown = (event) => {
+		const count = this.categoryData().categories.length;
+		if (!count) return;
+		const current = this.categoryIndex();
+		let next;
+		switch (event.key) {
+			case "ArrowLeft":
+				next = Math.max(0, (current ?? count) - 1);
+				break;
+			case "ArrowRight":
+				next = Math.min(count - 1, (current ?? -1) + 1);
+				break;
+			case "Home":
+				next = 0;
+				break;
+			case "End":
+				next = count - 1;
+				break;
+			case "Escape":
+				next = null;
+				break;
+			default: return;
+		}
+		event.preventDefault();
+		this.categoryIndex.set(next);
+	};
 	onKeydown = (event) => {
+		if (this.categorical()) return this.onCategoryKeydown(event);
 		const times = this.times();
 		const count = times.length;
 		if (!count) return;
@@ -18874,6 +19228,24 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 			trend
 		};
 	};
+	signedPoints = (diff) => {
+		const trend = diff > 0 ? "up" : diff < 0 ? "down" : "flat";
+		return {
+			change: `${trend === "up" ? "▲" : trend === "down" ? "▼" : "■"} ${this.pointsFormat.format(diff)} pp`,
+			trend
+		};
+	};
+	pointsFormat = new Intl.NumberFormat(this.locale, {
+		signDisplay: "exceptZero",
+		minimumFractionDigits: 1,
+		maximumFractionDigits: 1
+	});
+	levelFormat = new Intl.NumberFormat(this.locale, {
+		style: "percent",
+		minimumFractionDigits: 1,
+		maximumFractionDigits: 1
+	});
+	formatShort = (v, ratio) => ratio ? this.levelFormat.format(v / 100) : this.compactFormat.format(v);
 	percentFormats = /* @__PURE__ */ new Map();
 	formatPercent = (v, digits) => {
 		let format = this.percentFormats.get(digits);
@@ -18984,8 +19356,8 @@ var SectionChartComponent = class SectionChartComponent extends ConfigComponent
 		}],
 		usesInheritance: true,
 		ngImport: i0,
-		template: "<div class=\"m-section-chart__top\">\n  <!-- Each series draws its own legend row: the row is the series' element,\n       which is what the editor's Canvas selects it by. -->\n  <div class=\"m-section-chart__legend\" role=\"list\">\n    <ng-content />\n  </div>\n  @if (periodLabel(); as label) {\n    <span class=\"m-section-chart__window\">{{ label }}</span>\n  }\n</div>\n\n<div class=\"m-section-chart__plot\">\n  <svg\n    class=\"m-section-chart__svg\"\n    role=\"img\"\n    tabindex=\"0\"\n    [class.is-measurable]=\"canMeasure()\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"resolvedHeight()\"\n    [attr.viewBox]=\"viewBox()\"\n    [attr.aria-label]=\"windowLabel()\"\n    [attr.aria-describedby]=\"tableId\"\n    (pointerdown)=\"onPlotDown($event)\"\n    (pointermove)=\"onPointerMove($event)\"\n    (pointerup)=\"onPlotUp()\"\n    (pointercancel)=\"onPlotUp()\"\n    (pointerleave)=\"clearHover()\"\n    (blur)=\"clearHover()\"\n    (keydown)=\"onKeydown($event)\"\n  >\n    @for (tick of yTicks(); track $index) {\n      <svg:line\n        class=\"m-section-chart__grid\"\n        [class.m-section-chart__grid--zero]=\"tick.zero\"\n        [attr.x1]=\"left()\"\n        [attr.x2]=\"right()\"\n        [attr.y1]=\"tick.y\"\n        [attr.y2]=\"tick.y\"\n      />\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"end\"\n        [attr.x]=\"left() - 8\"\n        [attr.y]=\"tick.y + 4\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    @if (!minimal()) {\n      <svg:line\n        class=\"m-section-chart__axis\"\n        [attr.x1]=\"left()\"\n        [attr.x2]=\"right()\"\n        [attr.y1]=\"bottom()\"\n        [attr.y2]=\"bottom()\"\n      />\n    }\n    @for (tick of xTicks(); track $index) {\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"middle\"\n        [attr.x]=\"tick.x\"\n        [attr.y]=\"bottom() + 18\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    @if (measureView(); as band) {\n      <svg:rect\n        class=\"m-section-chart__band\"\n        [attr.x]=\"band.start\"\n        [attr.y]=\"top()\"\n        [attr.width]=\"band.width\"\n        [attr.height]=\"bottom() - top()\"\n      />\n      <svg:line\n        class=\"m-section-chart__band-edge\"\n        [attr.x1]=\"band.start\"\n        [attr.x2]=\"band.start\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n      <svg:line\n        class=\"m-section-chart__band-edge\"\n        [attr.x1]=\"band.start + band.width\"\n        [attr.x2]=\"band.start + band.width\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n    }\n    @for (path of paths(); track $index) {\n      @if (path.area; as area) {\n        <svg:defs>\n          <svg:linearGradient [attr.id]=\"path.fillId\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n            <svg:stop offset=\"0\" stop-opacity=\"0.22\" [attr.stop-color]=\"path.color\" />\n            <svg:stop offset=\"1\" stop-opacity=\"0\" [attr.stop-color]=\"path.color\" />\n          </svg:linearGradient>\n        </svg:defs>\n        <svg:path class=\"m-section-chart__area\" [attr.d]=\"area\" [attr.fill]=\"path.fill\" />\n      }\n    }\n    @for (path of paths(); track $index) {\n      <svg:path\n        class=\"m-section-chart__line\"\n        [attr.d]=\"path.d\"\n        [style.stroke]=\"path.color\"\n      />\n    }\n    @if (!minimal()) {\n      @for (path of paths(); track $index) {\n        <svg:circle\n          class=\"m-section-chart__dot\"\n          r=\"4\"\n          [attr.cx]=\"path.endX\"\n          [attr.cy]=\"path.endY\"\n          [style.fill]=\"path.color\"\n        />\n      }\n    }\n    @if (hover(); as h) {\n      <svg:line\n        class=\"m-section-chart__cross\"\n        [attr.x1]=\"h.x\"\n        [attr.x2]=\"h.x\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n      @for (row of h.rows; track $index) {\n        <svg:circle\n          class=\"m-section-chart__dot\"\n          r=\"4\"\n          [attr.cx]=\"row.cx\"\n          [attr.cy]=\"row.cy\"\n          [style.fill]=\"row.color\"\n        />\n      }\n    }\n  </svg>\n\n  @if (hover(); as h) {\n    <div\n      class=\"m-section-chart__tip\"\n      role=\"status\"\n      [class.m-section-chart__tip--flip]=\"h.flip\"\n      [style.left.px]=\"h.x\"\n    >\n      <span class=\"m-section-chart__tip-title\">{{ h.title }}</span>\n      @for (row of h.rows; track $index) {\n        <span class=\"m-section-chart__tip-row\">\n          <span class=\"m-section-chart__tip-key\" [style.background]=\"row.color\"></span>\n          <span class=\"m-section-chart__tip-value\">{{ row.value }}</span>\n          <span class=\"m-section-chart__tip-label\">{{\n            row.noTranslate ? row.label : (row.label | translate: row.params)\n          }}</span>\n          <span class=\"m-section-chart__tip-sub\">{{ row.sub }}</span>\n        </span>\n      }\n    </div>\n  }\n\n  @if (measureView()?.card; as card) {\n    <div\n      class=\"m-section-chart__measure\"\n      role=\"status\"\n      [class.m-section-chart__measure--flip]=\"card.flip\"\n      [style.left.px]=\"card.x\"\n    >\n      <span class=\"m-section-chart__tip-title\">{{ card.title }}</span>\n      @for (row of card.rows; track $index) {\n        <span class=\"m-section-chart__tip-row\">\n          <span class=\"m-section-chart__tip-key\" [style.background]=\"row.color\"></span>\n          <span class=\"m-section-chart__tip-value\">{{ row.value }}</span>\n          <span class=\"m-section-chart__tip-label\">{{\n            row.noTranslate ? row.label : (row.label | translate: row.params)\n          }}</span>\n          <span class=\"m-section-chart__tip-sub\">{{ row.sub }}</span>\n        </span>\n      }\n    </div>\n  }\n</div>\n\n@if (presets().length > 1 && !minimal()) {\n  <div class=\"m-section-chart__presets\">\n    <m-section-toggle\n      [items]=\"presets()\"\n      [selectedIndex]=\"presetIndex()\"\n      [border]=\"false\"\n      (action)=\"selectPreset($event)\"\n    >\n      <ng-template [mSectionToggleItem]=\"presets()\" let-preset>\n        <span class=\"m-section-chart__preset\">{{ preset.label }}</span>\n      </ng-template>\n    </m-section-toggle>\n  </div>\n}\n\n@if (navigatorView(); as nav) {\n  <svg\n    class=\"m-section-chart__navigator\"\n    role=\"slider\"\n    tabindex=\"0\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-label]=\"'zoom' | translate\"\n    [attr.aria-valuenow]=\"nav.position\"\n    [attr.aria-valuetext]=\"windowLabel()\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"navHeight\"\n    [attr.viewBox]=\"navViewBox()\"\n    (pointerdown)=\"onNavigatorDown($event)\"\n    (pointermove)=\"onNavigatorMove($event)\"\n    (pointerup)=\"onNavigatorUp()\"\n    (pointercancel)=\"onNavigatorUp()\"\n    (keydown)=\"onNavigatorKeydown($event)\"\n  >\n    <svg:path class=\"m-section-chart__nav-area\" [attr.d]=\"nav.area\" />\n    <svg:path class=\"m-section-chart__nav-line\" [attr.d]=\"nav.d\" />\n    <svg:line\n      class=\"m-section-chart__axis\"\n      [attr.x1]=\"left()\"\n      [attr.x2]=\"right()\"\n      [attr.y1]=\"nav.base\"\n      [attr.y2]=\"nav.base\"\n    />\n    @for (tick of nav.ticks; track $index) {\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"middle\"\n        [attr.x]=\"tick.x\"\n        [attr.y]=\"nav.base + 15\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    <svg:rect\n      class=\"m-section-chart__nav-dim\"\n      [attr.x]=\"left()\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"nav.start - left()\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-dim\"\n      [attr.x]=\"nav.end\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"right() - nav.end\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-window\"\n      [attr.x]=\"nav.start\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"nav.end - nav.start\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-handle\"\n      rx=\"2\"\n      width=\"6\"\n      height=\"20\"\n      [attr.x]=\"nav.start - 3\"\n      [attr.y]=\"(nav.base + navTop) / 2 - 10\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-handle\"\n      rx=\"2\"\n      width=\"6\"\n      height=\"20\"\n      [attr.x]=\"nav.end - 3\"\n      [attr.y]=\"(nav.base + navTop) / 2 - 10\"\n    />\n  </svg>\n}\n\n<table class=\"m-section-chart__table\" [id]=\"tableId\">\n  <thead>\n    <tr>\n      <th scope=\"col\">{{ 'date' | translate }}</th>\n      @for (column of table().columns; track $index) {\n        <th scope=\"col\">\n          {{ column.noTranslate ? column.label : (column.label | translate: column.params) }}\n        </th>\n      }\n    </tr>\n  </thead>\n  <tbody>\n    @for (row of table().rows; track $index) {\n      <tr>\n        <td>{{ row.date }}</td>\n        @for (cell of row.cells; track $index) {\n          <td>{{ cell }}</td>\n        }\n      </tr>\n    }\n  </tbody>\n</table>\n",
-		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;position:relative;width:100%;min-width:0}.m-section-chart__top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.5rem 1rem;margin-bottom:.5rem}.m-section-chart__legend{display:grid;gap:.15rem;min-width:0}.m-section-chart__tip-key{display:inline-block;width:.75rem;height:2px;border-radius:1px}.m-section-chart__window{color:var(--m-text-tertiary);font-size:.8rem}:host(.m-section-chart--minimal) .m-section-chart__svg{cursor:default}:host(.m-section-chart--minimal) .m-section-chart__line{stroke-width:2.25}.m-section-chart__area{stroke:none}.m-section-chart__plot{position:relative}.m-section-chart__svg{display:block;overflow:visible}.m-section-chart__svg:focus{outline:none}.m-section-chart__svg:focus-visible{outline:2px solid var(--m-focus);outline-offset:4px;border-radius:4px}.m-section-chart__svg.is-measurable{cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none}.m-section-chart__band{fill:var(--m-text);opacity:.06}.m-section-chart__band-edge{stroke:var(--m-text-secondary);stroke-width:1}.m-section-chart__grid{stroke:var(--m-text-septenary);stroke-width:1}.m-section-chart__grid--zero{stroke:var(--m-text-quinary);stroke-width:1.5}.m-section-chart__axis{stroke:var(--m-text-quinary);stroke-width:1}.m-section-chart__tick{fill:var(--m-text-tertiary);font-size:11px;font-variant-numeric:tabular-nums}.m-section-chart__line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.m-section-chart__dot{stroke:var(--m-background);stroke-width:2}.m-section-chart__cross{stroke:var(--m-text-secondary);stroke-width:1;opacity:.55}.m-section-chart__tip,.m-section-chart__measure{position:absolute;z-index:2;display:grid;gap:.25rem;min-width:10rem;padding:.5rem .625rem;border:1px solid var(--m-backdrop-border);border-radius:.5rem;background:var(--m-background);box-shadow:0 6px 20px var(--m-backdrop-shadow);font-size:.75rem;pointer-events:none}.m-section-chart__tip{top:0;margin-left:.875rem}.m-section-chart__tip--flip{transform:translate(calc(-100% - 1.75rem))}.m-section-chart__measure{bottom:2.25rem}.m-section-chart__measure--flip{transform:translate(-100%)}.m-section-chart__tip-title{color:var(--m-text-secondary);font-weight:600}.m-section-chart__tip-row{display:grid;grid-template-columns:.75rem auto 1fr auto;align-items:center;gap:.5rem}.m-section-chart__tip-value{color:var(--m-text);font-weight:650;font-variant-numeric:tabular-nums}.m-section-chart__tip-label{color:var(--m-text-secondary);white-space:nowrap}.m-section-chart__tip-sub{color:var(--m-text-tertiary);font-variant-numeric:tabular-nums}.m-section-chart__presets{--section-px: 0;margin-top:.5rem}.m-section-chart__preset{font-size:.8rem;font-weight:600;font-variant-numeric:tabular-nums}.m-section-chart__navigator{display:block;margin-top:.25rem;overflow:visible;touch-action:none;-webkit-user-select:none;user-select:none;cursor:pointer}.m-section-chart__navigator:focus{outline:none}.m-section-chart__navigator:focus-visible{outline:2px solid var(--m-focus);outline-offset:4px;border-radius:4px}.m-section-chart__nav-area{fill:var(--m-text-tertiary);opacity:.12}.m-section-chart__nav-line{fill:none;stroke:var(--m-text-tertiary);stroke-width:1.25}.m-section-chart__nav-dim{fill:var(--m-background);opacity:.6}.m-section-chart__nav-window{fill:transparent;stroke:var(--m-text-secondary);stroke-width:1;cursor:grab}.m-section-chart__nav-handle{fill:var(--m-text-secondary);cursor:ew-resize}.m-section-chart__table{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}\n"],
+		template: "<div class=\"m-section-chart__top\">\n  <!-- Each series draws its own legend row: the row is the series' element,\n       which is what the editor's Canvas selects it by. -->\n  <div class=\"m-section-chart__legend\" role=\"list\">\n    <ng-content />\n  </div>\n  @if (periodLabel(); as label) {\n    <span class=\"m-section-chart__window\">{{ label }}</span>\n  }\n</div>\n\n<div class=\"m-section-chart__plot\">\n  <svg\n    class=\"m-section-chart__svg\"\n    role=\"img\"\n    tabindex=\"0\"\n    [class.is-measurable]=\"canMeasure()\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"svgHeight()\"\n    [attr.viewBox]=\"viewBox()\"\n    [attr.aria-label]=\"windowLabel()\"\n    [attr.aria-describedby]=\"tableId\"\n    (pointerdown)=\"onPlotDown($event)\"\n    (pointermove)=\"onPointerMove($event)\"\n    (pointerup)=\"onPlotUp()\"\n    (pointercancel)=\"onPlotUp()\"\n    (pointerleave)=\"clearHover()\"\n    (blur)=\"clearHover()\"\n    (keydown)=\"onKeydown($event)\"\n  >\n    @for (tick of yTicks(); track $index) {\n      <svg:line\n        class=\"m-section-chart__grid\"\n        [class.m-section-chart__grid--zero]=\"tick.zero\"\n        [attr.x1]=\"left()\"\n        [attr.x2]=\"right()\"\n        [attr.y1]=\"tick.y\"\n        [attr.y2]=\"tick.y\"\n      />\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"end\"\n        [attr.x]=\"left() - 8\"\n        [attr.y]=\"tick.y + 4\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    @if (!minimal()) {\n      <svg:line\n        class=\"m-section-chart__axis\"\n        [attr.x1]=\"left()\"\n        [attr.x2]=\"right()\"\n        [attr.y1]=\"bottom()\"\n        [attr.y2]=\"bottom()\"\n      />\n    }\n    @for (tick of xTicks(); track $index) {\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"middle\"\n        [attr.x]=\"tick.x\"\n        [attr.y]=\"bottom() + 18\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    @if (measureView(); as band) {\n      <svg:rect\n        class=\"m-section-chart__band\"\n        [attr.x]=\"band.start\"\n        [attr.y]=\"top()\"\n        [attr.width]=\"band.width\"\n        [attr.height]=\"bottom() - top()\"\n      />\n      <svg:line\n        class=\"m-section-chart__band-edge\"\n        [attr.x1]=\"band.start\"\n        [attr.x2]=\"band.start\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n      <svg:line\n        class=\"m-section-chart__band-edge\"\n        [attr.x1]=\"band.start + band.width\"\n        [attr.x2]=\"band.start + band.width\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n    }\n    @if (hover()?.band; as band) {\n      <svg:rect\n        class=\"m-section-chart__hover-band\"\n        [attr.x]=\"band.x\"\n        [attr.y]=\"top()\"\n        [attr.width]=\"band.width\"\n        [attr.height]=\"band.bottom - top()\"\n      />\n    }\n    @if (categoryView(); as cat) {\n      @for (column of cat.columns; track $index) {\n        <svg:path\n          class=\"m-section-chart__column\"\n          [attr.d]=\"column.d\"\n          [style.fill]=\"column.color\"\n        />\n      }\n      @for (line of cat.lines; track $index) {\n        <svg:path\n          class=\"m-section-chart__line\"\n          [attr.d]=\"line.d\"\n          [style.stroke]=\"line.color\"\n        />\n        <svg:circle\n          class=\"m-section-chart__dot\"\n          r=\"4\"\n          [attr.cx]=\"line.endX\"\n          [attr.cy]=\"line.endY\"\n          [style.fill]=\"line.color\"\n        />\n      }\n      @for (label of cat.labels; track $index) {\n        <svg:text\n          class=\"m-section-chart__value\"\n          text-anchor=\"middle\"\n          [attr.x]=\"label.x\"\n          [attr.y]=\"label.y\"\n        >\n          {{ label.text }}\n        </svg:text>\n      }\n      @if (cat.strip; as strip) {\n        @for (tick of strip.ticks; track $index) {\n          <svg:line\n            class=\"m-section-chart__grid\"\n            [attr.x1]=\"left()\"\n            [attr.x2]=\"right()\"\n            [attr.y1]=\"tick.y\"\n            [attr.y2]=\"tick.y\"\n          />\n          <svg:text\n            class=\"m-section-chart__tick\"\n            text-anchor=\"end\"\n            [attr.x]=\"left() - 8\"\n            [attr.y]=\"tick.y + 4\"\n          >\n            {{ tick.label }}\n          </svg:text>\n        }\n        @for (line of strip.lines; track $index) {\n          <svg:path\n            class=\"m-section-chart__line\"\n            [attr.d]=\"line.d\"\n            [style.stroke]=\"line.color\"\n          />\n          @for (dot of line.dots; track $index) {\n            <svg:circle\n              class=\"m-section-chart__dot\"\n              r=\"4\"\n              [attr.cx]=\"dot.cx\"\n              [attr.cy]=\"dot.cy\"\n              [style.fill]=\"line.color\"\n            />\n            <svg:text\n              class=\"m-section-chart__value\"\n              text-anchor=\"middle\"\n              [attr.x]=\"dot.cx\"\n              [attr.y]=\"dot.cy - 9\"\n            >\n              {{ dot.text }}\n            </svg:text>\n          }\n        }\n      }\n    }\n    @for (path of paths(); track $index) {\n      @if (path.area; as area) {\n        <svg:defs>\n          <svg:linearGradient [attr.id]=\"path.fillId\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n            <svg:stop offset=\"0\" stop-opacity=\"0.22\" [attr.stop-color]=\"path.color\" />\n            <svg:stop offset=\"1\" stop-opacity=\"0\" [attr.stop-color]=\"path.color\" />\n          </svg:linearGradient>\n        </svg:defs>\n        <svg:path class=\"m-section-chart__area\" [attr.d]=\"area\" [attr.fill]=\"path.fill\" />\n      }\n    }\n    @for (path of paths(); track $index) {\n      <svg:path\n        class=\"m-section-chart__line\"\n        [attr.d]=\"path.d\"\n        [style.stroke]=\"path.color\"\n      />\n    }\n    @if (!minimal()) {\n      @for (path of paths(); track $index) {\n        <svg:circle\n          class=\"m-section-chart__dot\"\n          r=\"4\"\n          [attr.cx]=\"path.endX\"\n          [attr.cy]=\"path.endY\"\n          [style.fill]=\"path.color\"\n        />\n      }\n    }\n    @if (hover(); as h) {\n      @if (!h.band) {\n        <svg:line\n          class=\"m-section-chart__cross\"\n          [attr.x1]=\"h.x\"\n          [attr.x2]=\"h.x\"\n          [attr.y1]=\"top()\"\n          [attr.y2]=\"bottom()\"\n        />\n      }\n      @for (row of h.rows; track $index) {\n        @if (row.cx !== null) {\n          <svg:circle\n            class=\"m-section-chart__dot\"\n            r=\"4\"\n            [attr.cx]=\"row.cx\"\n            [attr.cy]=\"row.cy\"\n            [style.fill]=\"row.color\"\n          />\n        }\n      }\n    }\n  </svg>\n\n  @if (hover(); as h) {\n    <div\n      class=\"m-section-chart__tip\"\n      role=\"status\"\n      [class.m-section-chart__tip--flip]=\"h.flip\"\n      [style.left.px]=\"h.x\"\n    >\n      <span class=\"m-section-chart__tip-title\">{{ h.title }}</span>\n      @for (row of h.rows; track $index) {\n        <span class=\"m-section-chart__tip-row\">\n          <span class=\"m-section-chart__tip-key\" [style.background]=\"row.color\"></span>\n          <span class=\"m-section-chart__tip-value\">{{ row.value }}</span>\n          <span class=\"m-section-chart__tip-label\">{{\n            row.noTranslate ? row.label : (row.label | translate: row.params)\n          }}</span>\n          <span class=\"m-section-chart__tip-sub\">{{ row.sub }}</span>\n        </span>\n      }\n    </div>\n  }\n\n  @if (measureView()?.card; as card) {\n    <div\n      class=\"m-section-chart__measure\"\n      role=\"status\"\n      [class.m-section-chart__measure--flip]=\"card.flip\"\n      [style.left.px]=\"card.x\"\n    >\n      <span class=\"m-section-chart__tip-title\">{{ card.title }}</span>\n      @for (row of card.rows; track $index) {\n        <span class=\"m-section-chart__tip-row\">\n          <span class=\"m-section-chart__tip-key\" [style.background]=\"row.color\"></span>\n          <span class=\"m-section-chart__tip-value\">{{ row.value }}</span>\n          <span class=\"m-section-chart__tip-label\">{{\n            row.noTranslate ? row.label : (row.label | translate: row.params)\n          }}</span>\n          <span class=\"m-section-chart__tip-sub\">{{ row.sub }}</span>\n        </span>\n      }\n    </div>\n  }\n</div>\n\n@if (presets().length > 1 && !minimal() && !categorical()) {\n  <div class=\"m-section-chart__presets\">\n    <m-section-toggle\n      [items]=\"presets()\"\n      [selectedIndex]=\"presetIndex()\"\n      [border]=\"false\"\n      (action)=\"selectPreset($event)\"\n    >\n      <ng-template [mSectionToggleItem]=\"presets()\" let-preset>\n        <span class=\"m-section-chart__preset\">{{ preset.label }}</span>\n      </ng-template>\n    </m-section-toggle>\n  </div>\n}\n\n@if (navigatorView(); as nav) {\n  <svg\n    class=\"m-section-chart__navigator\"\n    role=\"slider\"\n    tabindex=\"0\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-label]=\"'zoom' | translate\"\n    [attr.aria-valuenow]=\"nav.position\"\n    [attr.aria-valuetext]=\"windowLabel()\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"navHeight\"\n    [attr.viewBox]=\"navViewBox()\"\n    (pointerdown)=\"onNavigatorDown($event)\"\n    (pointermove)=\"onNavigatorMove($event)\"\n    (pointerup)=\"onNavigatorUp()\"\n    (pointercancel)=\"onNavigatorUp()\"\n    (keydown)=\"onNavigatorKeydown($event)\"\n  >\n    <svg:path class=\"m-section-chart__nav-area\" [attr.d]=\"nav.area\" />\n    <svg:path class=\"m-section-chart__nav-line\" [attr.d]=\"nav.d\" />\n    <svg:line\n      class=\"m-section-chart__axis\"\n      [attr.x1]=\"left()\"\n      [attr.x2]=\"right()\"\n      [attr.y1]=\"nav.base\"\n      [attr.y2]=\"nav.base\"\n    />\n    @for (tick of nav.ticks; track $index) {\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"middle\"\n        [attr.x]=\"tick.x\"\n        [attr.y]=\"nav.base + 15\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    <svg:rect\n      class=\"m-section-chart__nav-dim\"\n      [attr.x]=\"left()\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"nav.start - left()\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-dim\"\n      [attr.x]=\"nav.end\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"right() - nav.end\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-window\"\n      [attr.x]=\"nav.start\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"nav.end - nav.start\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-handle\"\n      rx=\"2\"\n      width=\"6\"\n      height=\"20\"\n      [attr.x]=\"nav.start - 3\"\n      [attr.y]=\"(nav.base + navTop) / 2 - 10\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-handle\"\n      rx=\"2\"\n      width=\"6\"\n      height=\"20\"\n      [attr.x]=\"nav.end - 3\"\n      [attr.y]=\"(nav.base + navTop) / 2 - 10\"\n    />\n  </svg>\n}\n\n<table class=\"m-section-chart__table\" [id]=\"tableId\">\n  <thead>\n    <tr>\n      <th scope=\"col\">{{ 'date' | translate }}</th>\n      @for (column of table().columns; track $index) {\n        <th scope=\"col\">\n          {{ column.noTranslate ? column.label : (column.label | translate: column.params) }}\n        </th>\n      }\n    </tr>\n  </thead>\n  <tbody>\n    @for (row of table().rows; track $index) {\n      <tr>\n        <td>{{ row.date }}</td>\n        @for (cell of row.cells; track $index) {\n          <td>{{ cell }}</td>\n        }\n      </tr>\n    }\n  </tbody>\n</table>\n",
+		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;position:relative;width:100%;min-width:0}.m-section-chart__top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.5rem 1rem;margin-bottom:.5rem}.m-section-chart__legend{display:grid;gap:.15rem;min-width:0}.m-section-chart__tip-key{display:inline-block;width:.75rem;height:2px;border-radius:1px}.m-section-chart__window{color:var(--m-text-tertiary);font-size:.8rem}:host(.m-section-chart--minimal) .m-section-chart__svg{cursor:default}:host(.m-section-chart--minimal) .m-section-chart__line{stroke-width:2.25}.m-section-chart__area{stroke:none}.m-section-chart__plot{position:relative}.m-section-chart__svg{display:block;overflow:visible}.m-section-chart__svg:focus{outline:none}.m-section-chart__svg:focus-visible{outline:2px solid var(--m-focus);outline-offset:4px;border-radius:4px}.m-section-chart__svg.is-measurable{cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none}.m-section-chart__band{fill:var(--m-text);opacity:.06}.m-section-chart__band-edge{stroke:var(--m-text-secondary);stroke-width:1}.m-section-chart__grid{stroke:var(--m-text-septenary);stroke-width:1}.m-section-chart__grid--zero{stroke:var(--m-text-quinary);stroke-width:1.5}.m-section-chart__axis{stroke:var(--m-text-quinary);stroke-width:1}.m-section-chart__tick{fill:var(--m-text-tertiary);font-size:11px;font-variant-numeric:tabular-nums}.m-section-chart__line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.m-section-chart__dot{stroke:var(--m-background);stroke-width:2}.m-section-chart__cross{stroke:var(--m-text-secondary);stroke-width:1;opacity:.55}.m-section-chart__hover-band{fill:var(--m-text);opacity:.05}.m-section-chart__column{stroke:none}.m-section-chart__value{fill:var(--m-text-secondary);font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}.m-section-chart__tip,.m-section-chart__measure{position:absolute;z-index:2;display:grid;gap:.25rem;min-width:10rem;padding:.5rem .625rem;border:1px solid var(--m-backdrop-border);border-radius:.5rem;background:var(--m-background);box-shadow:0 6px 20px var(--m-backdrop-shadow);font-size:.75rem;pointer-events:none}.m-section-chart__tip{top:0;margin-left:.875rem}.m-section-chart__tip--flip{transform:translate(calc(-100% - 1.75rem))}.m-section-chart__measure{bottom:2.25rem}.m-section-chart__measure--flip{transform:translate(-100%)}.m-section-chart__tip-title{color:var(--m-text-secondary);font-weight:600}.m-section-chart__tip-row{display:grid;grid-template-columns:.75rem auto 1fr auto;align-items:center;gap:.5rem}.m-section-chart__tip-value{color:var(--m-text);font-weight:650;font-variant-numeric:tabular-nums}.m-section-chart__tip-label{color:var(--m-text-secondary);white-space:nowrap}.m-section-chart__tip-sub{color:var(--m-text-tertiary);font-variant-numeric:tabular-nums}.m-section-chart__presets{--section-px: 0;margin-top:.5rem}.m-section-chart__preset{font-size:.8rem;font-weight:600;font-variant-numeric:tabular-nums}.m-section-chart__navigator{display:block;margin-top:.25rem;overflow:visible;touch-action:none;-webkit-user-select:none;user-select:none;cursor:pointer}.m-section-chart__navigator:focus{outline:none}.m-section-chart__navigator:focus-visible{outline:2px solid var(--m-focus);outline-offset:4px;border-radius:4px}.m-section-chart__nav-area{fill:var(--m-text-tertiary);opacity:.12}.m-section-chart__nav-line{fill:none;stroke:var(--m-text-tertiary);stroke-width:1.25}.m-section-chart__nav-dim{fill:var(--m-background);opacity:.6}.m-section-chart__nav-window{fill:transparent;stroke:var(--m-text-secondary);stroke-width:1;cursor:grab}.m-section-chart__nav-handle{fill:var(--m-text-secondary);cursor:ew-resize}.m-section-chart__table{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}\n"],
 		dependencies: [
 			{
 				kind: "component",
@@ -19045,8 +19417,8 @@ i0.ɵɵngDeclareClassMetadata({
 					};
 				}
 			}],
-			template: "<div class=\"m-section-chart__top\">\n  <!-- Each series draws its own legend row: the row is the series' element,\n       which is what the editor's Canvas selects it by. -->\n  <div class=\"m-section-chart__legend\" role=\"list\">\n    <ng-content />\n  </div>\n  @if (periodLabel(); as label) {\n    <span class=\"m-section-chart__window\">{{ label }}</span>\n  }\n</div>\n\n<div class=\"m-section-chart__plot\">\n  <svg\n    class=\"m-section-chart__svg\"\n    role=\"img\"\n    tabindex=\"0\"\n    [class.is-measurable]=\"canMeasure()\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"resolvedHeight()\"\n    [attr.viewBox]=\"viewBox()\"\n    [attr.aria-label]=\"windowLabel()\"\n    [attr.aria-describedby]=\"tableId\"\n    (pointerdown)=\"onPlotDown($event)\"\n    (pointermove)=\"onPointerMove($event)\"\n    (pointerup)=\"onPlotUp()\"\n    (pointercancel)=\"onPlotUp()\"\n    (pointerleave)=\"clearHover()\"\n    (blur)=\"clearHover()\"\n    (keydown)=\"onKeydown($event)\"\n  >\n    @for (tick of yTicks(); track $index) {\n      <svg:line\n        class=\"m-section-chart__grid\"\n        [class.m-section-chart__grid--zero]=\"tick.zero\"\n        [attr.x1]=\"left()\"\n        [attr.x2]=\"right()\"\n        [attr.y1]=\"tick.y\"\n        [attr.y2]=\"tick.y\"\n      />\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"end\"\n        [attr.x]=\"left() - 8\"\n        [attr.y]=\"tick.y + 4\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    @if (!minimal()) {\n      <svg:line\n        class=\"m-section-chart__axis\"\n        [attr.x1]=\"left()\"\n        [attr.x2]=\"right()\"\n        [attr.y1]=\"bottom()\"\n        [attr.y2]=\"bottom()\"\n      />\n    }\n    @for (tick of xTicks(); track $index) {\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"middle\"\n        [attr.x]=\"tick.x\"\n        [attr.y]=\"bottom() + 18\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    @if (measureView(); as band) {\n      <svg:rect\n        class=\"m-section-chart__band\"\n        [attr.x]=\"band.start\"\n        [attr.y]=\"top()\"\n        [attr.width]=\"band.width\"\n        [attr.height]=\"bottom() - top()\"\n      />\n      <svg:line\n        class=\"m-section-chart__band-edge\"\n        [attr.x1]=\"band.start\"\n        [attr.x2]=\"band.start\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n      <svg:line\n        class=\"m-section-chart__band-edge\"\n        [attr.x1]=\"band.start + band.width\"\n        [attr.x2]=\"band.start + band.width\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n    }\n    @for (path of paths(); track $index) {\n      @if (path.area; as area) {\n        <svg:defs>\n          <svg:linearGradient [attr.id]=\"path.fillId\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n            <svg:stop offset=\"0\" stop-opacity=\"0.22\" [attr.stop-color]=\"path.color\" />\n            <svg:stop offset=\"1\" stop-opacity=\"0\" [attr.stop-color]=\"path.color\" />\n          </svg:linearGradient>\n        </svg:defs>\n        <svg:path class=\"m-section-chart__area\" [attr.d]=\"area\" [attr.fill]=\"path.fill\" />\n      }\n    }\n    @for (path of paths(); track $index) {\n      <svg:path\n        class=\"m-section-chart__line\"\n        [attr.d]=\"path.d\"\n        [style.stroke]=\"path.color\"\n      />\n    }\n    @if (!minimal()) {\n      @for (path of paths(); track $index) {\n        <svg:circle\n          class=\"m-section-chart__dot\"\n          r=\"4\"\n          [attr.cx]=\"path.endX\"\n          [attr.cy]=\"path.endY\"\n          [style.fill]=\"path.color\"\n        />\n      }\n    }\n    @if (hover(); as h) {\n      <svg:line\n        class=\"m-section-chart__cross\"\n        [attr.x1]=\"h.x\"\n        [attr.x2]=\"h.x\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n      @for (row of h.rows; track $index) {\n        <svg:circle\n          class=\"m-section-chart__dot\"\n          r=\"4\"\n          [attr.cx]=\"row.cx\"\n          [attr.cy]=\"row.cy\"\n          [style.fill]=\"row.color\"\n        />\n      }\n    }\n  </svg>\n\n  @if (hover(); as h) {\n    <div\n      class=\"m-section-chart__tip\"\n      role=\"status\"\n      [class.m-section-chart__tip--flip]=\"h.flip\"\n      [style.left.px]=\"h.x\"\n    >\n      <span class=\"m-section-chart__tip-title\">{{ h.title }}</span>\n      @for (row of h.rows; track $index) {\n        <span class=\"m-section-chart__tip-row\">\n          <span class=\"m-section-chart__tip-key\" [style.background]=\"row.color\"></span>\n          <span class=\"m-section-chart__tip-value\">{{ row.value }}</span>\n          <span class=\"m-section-chart__tip-label\">{{\n            row.noTranslate ? row.label : (row.label | translate: row.params)\n          }}</span>\n          <span class=\"m-section-chart__tip-sub\">{{ row.sub }}</span>\n        </span>\n      }\n    </div>\n  }\n\n  @if (measureView()?.card; as card) {\n    <div\n      class=\"m-section-chart__measure\"\n      role=\"status\"\n      [class.m-section-chart__measure--flip]=\"card.flip\"\n      [style.left.px]=\"card.x\"\n    >\n      <span class=\"m-section-chart__tip-title\">{{ card.title }}</span>\n      @for (row of card.rows; track $index) {\n        <span class=\"m-section-chart__tip-row\">\n          <span class=\"m-section-chart__tip-key\" [style.background]=\"row.color\"></span>\n          <span class=\"m-section-chart__tip-value\">{{ row.value }}</span>\n          <span class=\"m-section-chart__tip-label\">{{\n            row.noTranslate ? row.label : (row.label | translate: row.params)\n          }}</span>\n          <span class=\"m-section-chart__tip-sub\">{{ row.sub }}</span>\n        </span>\n      }\n    </div>\n  }\n</div>\n\n@if (presets().length > 1 && !minimal()) {\n  <div class=\"m-section-chart__presets\">\n    <m-section-toggle\n      [items]=\"presets()\"\n      [selectedIndex]=\"presetIndex()\"\n      [border]=\"false\"\n      (action)=\"selectPreset($event)\"\n    >\n      <ng-template [mSectionToggleItem]=\"presets()\" let-preset>\n        <span class=\"m-section-chart__preset\">{{ preset.label }}</span>\n      </ng-template>\n    </m-section-toggle>\n  </div>\n}\n\n@if (navigatorView(); as nav) {\n  <svg\n    class=\"m-section-chart__navigator\"\n    role=\"slider\"\n    tabindex=\"0\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-label]=\"'zoom' | translate\"\n    [attr.aria-valuenow]=\"nav.position\"\n    [attr.aria-valuetext]=\"windowLabel()\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"navHeight\"\n    [attr.viewBox]=\"navViewBox()\"\n    (pointerdown)=\"onNavigatorDown($event)\"\n    (pointermove)=\"onNavigatorMove($event)\"\n    (pointerup)=\"onNavigatorUp()\"\n    (pointercancel)=\"onNavigatorUp()\"\n    (keydown)=\"onNavigatorKeydown($event)\"\n  >\n    <svg:path class=\"m-section-chart__nav-area\" [attr.d]=\"nav.area\" />\n    <svg:path class=\"m-section-chart__nav-line\" [attr.d]=\"nav.d\" />\n    <svg:line\n      class=\"m-section-chart__axis\"\n      [attr.x1]=\"left()\"\n      [attr.x2]=\"right()\"\n      [attr.y1]=\"nav.base\"\n      [attr.y2]=\"nav.base\"\n    />\n    @for (tick of nav.ticks; track $index) {\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"middle\"\n        [attr.x]=\"tick.x\"\n        [attr.y]=\"nav.base + 15\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    <svg:rect\n      class=\"m-section-chart__nav-dim\"\n      [attr.x]=\"left()\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"nav.start - left()\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-dim\"\n      [attr.x]=\"nav.end\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"right() - nav.end\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-window\"\n      [attr.x]=\"nav.start\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"nav.end - nav.start\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-handle\"\n      rx=\"2\"\n      width=\"6\"\n      height=\"20\"\n      [attr.x]=\"nav.start - 3\"\n      [attr.y]=\"(nav.base + navTop) / 2 - 10\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-handle\"\n      rx=\"2\"\n      width=\"6\"\n      height=\"20\"\n      [attr.x]=\"nav.end - 3\"\n      [attr.y]=\"(nav.base + navTop) / 2 - 10\"\n    />\n  </svg>\n}\n\n<table class=\"m-section-chart__table\" [id]=\"tableId\">\n  <thead>\n    <tr>\n      <th scope=\"col\">{{ 'date' | translate }}</th>\n      @for (column of table().columns; track $index) {\n        <th scope=\"col\">\n          {{ column.noTranslate ? column.label : (column.label | translate: column.params) }}\n        </th>\n      }\n    </tr>\n  </thead>\n  <tbody>\n    @for (row of table().rows; track $index) {\n      <tr>\n        <td>{{ row.date }}</td>\n        @for (cell of row.cells; track $index) {\n          <td>{{ cell }}</td>\n        }\n      </tr>\n    }\n  </tbody>\n</table>\n",
-			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;position:relative;width:100%;min-width:0}.m-section-chart__top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.5rem 1rem;margin-bottom:.5rem}.m-section-chart__legend{display:grid;gap:.15rem;min-width:0}.m-section-chart__tip-key{display:inline-block;width:.75rem;height:2px;border-radius:1px}.m-section-chart__window{color:var(--m-text-tertiary);font-size:.8rem}:host(.m-section-chart--minimal) .m-section-chart__svg{cursor:default}:host(.m-section-chart--minimal) .m-section-chart__line{stroke-width:2.25}.m-section-chart__area{stroke:none}.m-section-chart__plot{position:relative}.m-section-chart__svg{display:block;overflow:visible}.m-section-chart__svg:focus{outline:none}.m-section-chart__svg:focus-visible{outline:2px solid var(--m-focus);outline-offset:4px;border-radius:4px}.m-section-chart__svg.is-measurable{cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none}.m-section-chart__band{fill:var(--m-text);opacity:.06}.m-section-chart__band-edge{stroke:var(--m-text-secondary);stroke-width:1}.m-section-chart__grid{stroke:var(--m-text-septenary);stroke-width:1}.m-section-chart__grid--zero{stroke:var(--m-text-quinary);stroke-width:1.5}.m-section-chart__axis{stroke:var(--m-text-quinary);stroke-width:1}.m-section-chart__tick{fill:var(--m-text-tertiary);font-size:11px;font-variant-numeric:tabular-nums}.m-section-chart__line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.m-section-chart__dot{stroke:var(--m-background);stroke-width:2}.m-section-chart__cross{stroke:var(--m-text-secondary);stroke-width:1;opacity:.55}.m-section-chart__tip,.m-section-chart__measure{position:absolute;z-index:2;display:grid;gap:.25rem;min-width:10rem;padding:.5rem .625rem;border:1px solid var(--m-backdrop-border);border-radius:.5rem;background:var(--m-background);box-shadow:0 6px 20px var(--m-backdrop-shadow);font-size:.75rem;pointer-events:none}.m-section-chart__tip{top:0;margin-left:.875rem}.m-section-chart__tip--flip{transform:translate(calc(-100% - 1.75rem))}.m-section-chart__measure{bottom:2.25rem}.m-section-chart__measure--flip{transform:translate(-100%)}.m-section-chart__tip-title{color:var(--m-text-secondary);font-weight:600}.m-section-chart__tip-row{display:grid;grid-template-columns:.75rem auto 1fr auto;align-items:center;gap:.5rem}.m-section-chart__tip-value{color:var(--m-text);font-weight:650;font-variant-numeric:tabular-nums}.m-section-chart__tip-label{color:var(--m-text-secondary);white-space:nowrap}.m-section-chart__tip-sub{color:var(--m-text-tertiary);font-variant-numeric:tabular-nums}.m-section-chart__presets{--section-px: 0;margin-top:.5rem}.m-section-chart__preset{font-size:.8rem;font-weight:600;font-variant-numeric:tabular-nums}.m-section-chart__navigator{display:block;margin-top:.25rem;overflow:visible;touch-action:none;-webkit-user-select:none;user-select:none;cursor:pointer}.m-section-chart__navigator:focus{outline:none}.m-section-chart__navigator:focus-visible{outline:2px solid var(--m-focus);outline-offset:4px;border-radius:4px}.m-section-chart__nav-area{fill:var(--m-text-tertiary);opacity:.12}.m-section-chart__nav-line{fill:none;stroke:var(--m-text-tertiary);stroke-width:1.25}.m-section-chart__nav-dim{fill:var(--m-background);opacity:.6}.m-section-chart__nav-window{fill:transparent;stroke:var(--m-text-secondary);stroke-width:1;cursor:grab}.m-section-chart__nav-handle{fill:var(--m-text-secondary);cursor:ew-resize}.m-section-chart__table{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}\n"]
+			template: "<div class=\"m-section-chart__top\">\n  <!-- Each series draws its own legend row: the row is the series' element,\n       which is what the editor's Canvas selects it by. -->\n  <div class=\"m-section-chart__legend\" role=\"list\">\n    <ng-content />\n  </div>\n  @if (periodLabel(); as label) {\n    <span class=\"m-section-chart__window\">{{ label }}</span>\n  }\n</div>\n\n<div class=\"m-section-chart__plot\">\n  <svg\n    class=\"m-section-chart__svg\"\n    role=\"img\"\n    tabindex=\"0\"\n    [class.is-measurable]=\"canMeasure()\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"svgHeight()\"\n    [attr.viewBox]=\"viewBox()\"\n    [attr.aria-label]=\"windowLabel()\"\n    [attr.aria-describedby]=\"tableId\"\n    (pointerdown)=\"onPlotDown($event)\"\n    (pointermove)=\"onPointerMove($event)\"\n    (pointerup)=\"onPlotUp()\"\n    (pointercancel)=\"onPlotUp()\"\n    (pointerleave)=\"clearHover()\"\n    (blur)=\"clearHover()\"\n    (keydown)=\"onKeydown($event)\"\n  >\n    @for (tick of yTicks(); track $index) {\n      <svg:line\n        class=\"m-section-chart__grid\"\n        [class.m-section-chart__grid--zero]=\"tick.zero\"\n        [attr.x1]=\"left()\"\n        [attr.x2]=\"right()\"\n        [attr.y1]=\"tick.y\"\n        [attr.y2]=\"tick.y\"\n      />\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"end\"\n        [attr.x]=\"left() - 8\"\n        [attr.y]=\"tick.y + 4\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    @if (!minimal()) {\n      <svg:line\n        class=\"m-section-chart__axis\"\n        [attr.x1]=\"left()\"\n        [attr.x2]=\"right()\"\n        [attr.y1]=\"bottom()\"\n        [attr.y2]=\"bottom()\"\n      />\n    }\n    @for (tick of xTicks(); track $index) {\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"middle\"\n        [attr.x]=\"tick.x\"\n        [attr.y]=\"bottom() + 18\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    @if (measureView(); as band) {\n      <svg:rect\n        class=\"m-section-chart__band\"\n        [attr.x]=\"band.start\"\n        [attr.y]=\"top()\"\n        [attr.width]=\"band.width\"\n        [attr.height]=\"bottom() - top()\"\n      />\n      <svg:line\n        class=\"m-section-chart__band-edge\"\n        [attr.x1]=\"band.start\"\n        [attr.x2]=\"band.start\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n      <svg:line\n        class=\"m-section-chart__band-edge\"\n        [attr.x1]=\"band.start + band.width\"\n        [attr.x2]=\"band.start + band.width\"\n        [attr.y1]=\"top()\"\n        [attr.y2]=\"bottom()\"\n      />\n    }\n    @if (hover()?.band; as band) {\n      <svg:rect\n        class=\"m-section-chart__hover-band\"\n        [attr.x]=\"band.x\"\n        [attr.y]=\"top()\"\n        [attr.width]=\"band.width\"\n        [attr.height]=\"band.bottom - top()\"\n      />\n    }\n    @if (categoryView(); as cat) {\n      @for (column of cat.columns; track $index) {\n        <svg:path\n          class=\"m-section-chart__column\"\n          [attr.d]=\"column.d\"\n          [style.fill]=\"column.color\"\n        />\n      }\n      @for (line of cat.lines; track $index) {\n        <svg:path\n          class=\"m-section-chart__line\"\n          [attr.d]=\"line.d\"\n          [style.stroke]=\"line.color\"\n        />\n        <svg:circle\n          class=\"m-section-chart__dot\"\n          r=\"4\"\n          [attr.cx]=\"line.endX\"\n          [attr.cy]=\"line.endY\"\n          [style.fill]=\"line.color\"\n        />\n      }\n      @for (label of cat.labels; track $index) {\n        <svg:text\n          class=\"m-section-chart__value\"\n          text-anchor=\"middle\"\n          [attr.x]=\"label.x\"\n          [attr.y]=\"label.y\"\n        >\n          {{ label.text }}\n        </svg:text>\n      }\n      @if (cat.strip; as strip) {\n        @for (tick of strip.ticks; track $index) {\n          <svg:line\n            class=\"m-section-chart__grid\"\n            [attr.x1]=\"left()\"\n            [attr.x2]=\"right()\"\n            [attr.y1]=\"tick.y\"\n            [attr.y2]=\"tick.y\"\n          />\n          <svg:text\n            class=\"m-section-chart__tick\"\n            text-anchor=\"end\"\n            [attr.x]=\"left() - 8\"\n            [attr.y]=\"tick.y + 4\"\n          >\n            {{ tick.label }}\n          </svg:text>\n        }\n        @for (line of strip.lines; track $index) {\n          <svg:path\n            class=\"m-section-chart__line\"\n            [attr.d]=\"line.d\"\n            [style.stroke]=\"line.color\"\n          />\n          @for (dot of line.dots; track $index) {\n            <svg:circle\n              class=\"m-section-chart__dot\"\n              r=\"4\"\n              [attr.cx]=\"dot.cx\"\n              [attr.cy]=\"dot.cy\"\n              [style.fill]=\"line.color\"\n            />\n            <svg:text\n              class=\"m-section-chart__value\"\n              text-anchor=\"middle\"\n              [attr.x]=\"dot.cx\"\n              [attr.y]=\"dot.cy - 9\"\n            >\n              {{ dot.text }}\n            </svg:text>\n          }\n        }\n      }\n    }\n    @for (path of paths(); track $index) {\n      @if (path.area; as area) {\n        <svg:defs>\n          <svg:linearGradient [attr.id]=\"path.fillId\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n            <svg:stop offset=\"0\" stop-opacity=\"0.22\" [attr.stop-color]=\"path.color\" />\n            <svg:stop offset=\"1\" stop-opacity=\"0\" [attr.stop-color]=\"path.color\" />\n          </svg:linearGradient>\n        </svg:defs>\n        <svg:path class=\"m-section-chart__area\" [attr.d]=\"area\" [attr.fill]=\"path.fill\" />\n      }\n    }\n    @for (path of paths(); track $index) {\n      <svg:path\n        class=\"m-section-chart__line\"\n        [attr.d]=\"path.d\"\n        [style.stroke]=\"path.color\"\n      />\n    }\n    @if (!minimal()) {\n      @for (path of paths(); track $index) {\n        <svg:circle\n          class=\"m-section-chart__dot\"\n          r=\"4\"\n          [attr.cx]=\"path.endX\"\n          [attr.cy]=\"path.endY\"\n          [style.fill]=\"path.color\"\n        />\n      }\n    }\n    @if (hover(); as h) {\n      @if (!h.band) {\n        <svg:line\n          class=\"m-section-chart__cross\"\n          [attr.x1]=\"h.x\"\n          [attr.x2]=\"h.x\"\n          [attr.y1]=\"top()\"\n          [attr.y2]=\"bottom()\"\n        />\n      }\n      @for (row of h.rows; track $index) {\n        @if (row.cx !== null) {\n          <svg:circle\n            class=\"m-section-chart__dot\"\n            r=\"4\"\n            [attr.cx]=\"row.cx\"\n            [attr.cy]=\"row.cy\"\n            [style.fill]=\"row.color\"\n          />\n        }\n      }\n    }\n  </svg>\n\n  @if (hover(); as h) {\n    <div\n      class=\"m-section-chart__tip\"\n      role=\"status\"\n      [class.m-section-chart__tip--flip]=\"h.flip\"\n      [style.left.px]=\"h.x\"\n    >\n      <span class=\"m-section-chart__tip-title\">{{ h.title }}</span>\n      @for (row of h.rows; track $index) {\n        <span class=\"m-section-chart__tip-row\">\n          <span class=\"m-section-chart__tip-key\" [style.background]=\"row.color\"></span>\n          <span class=\"m-section-chart__tip-value\">{{ row.value }}</span>\n          <span class=\"m-section-chart__tip-label\">{{\n            row.noTranslate ? row.label : (row.label | translate: row.params)\n          }}</span>\n          <span class=\"m-section-chart__tip-sub\">{{ row.sub }}</span>\n        </span>\n      }\n    </div>\n  }\n\n  @if (measureView()?.card; as card) {\n    <div\n      class=\"m-section-chart__measure\"\n      role=\"status\"\n      [class.m-section-chart__measure--flip]=\"card.flip\"\n      [style.left.px]=\"card.x\"\n    >\n      <span class=\"m-section-chart__tip-title\">{{ card.title }}</span>\n      @for (row of card.rows; track $index) {\n        <span class=\"m-section-chart__tip-row\">\n          <span class=\"m-section-chart__tip-key\" [style.background]=\"row.color\"></span>\n          <span class=\"m-section-chart__tip-value\">{{ row.value }}</span>\n          <span class=\"m-section-chart__tip-label\">{{\n            row.noTranslate ? row.label : (row.label | translate: row.params)\n          }}</span>\n          <span class=\"m-section-chart__tip-sub\">{{ row.sub }}</span>\n        </span>\n      }\n    </div>\n  }\n</div>\n\n@if (presets().length > 1 && !minimal() && !categorical()) {\n  <div class=\"m-section-chart__presets\">\n    <m-section-toggle\n      [items]=\"presets()\"\n      [selectedIndex]=\"presetIndex()\"\n      [border]=\"false\"\n      (action)=\"selectPreset($event)\"\n    >\n      <ng-template [mSectionToggleItem]=\"presets()\" let-preset>\n        <span class=\"m-section-chart__preset\">{{ preset.label }}</span>\n      </ng-template>\n    </m-section-toggle>\n  </div>\n}\n\n@if (navigatorView(); as nav) {\n  <svg\n    class=\"m-section-chart__navigator\"\n    role=\"slider\"\n    tabindex=\"0\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-label]=\"'zoom' | translate\"\n    [attr.aria-valuenow]=\"nav.position\"\n    [attr.aria-valuetext]=\"windowLabel()\"\n    [attr.width]=\"width()\"\n    [attr.height]=\"navHeight\"\n    [attr.viewBox]=\"navViewBox()\"\n    (pointerdown)=\"onNavigatorDown($event)\"\n    (pointermove)=\"onNavigatorMove($event)\"\n    (pointerup)=\"onNavigatorUp()\"\n    (pointercancel)=\"onNavigatorUp()\"\n    (keydown)=\"onNavigatorKeydown($event)\"\n  >\n    <svg:path class=\"m-section-chart__nav-area\" [attr.d]=\"nav.area\" />\n    <svg:path class=\"m-section-chart__nav-line\" [attr.d]=\"nav.d\" />\n    <svg:line\n      class=\"m-section-chart__axis\"\n      [attr.x1]=\"left()\"\n      [attr.x2]=\"right()\"\n      [attr.y1]=\"nav.base\"\n      [attr.y2]=\"nav.base\"\n    />\n    @for (tick of nav.ticks; track $index) {\n      <svg:text\n        class=\"m-section-chart__tick\"\n        text-anchor=\"middle\"\n        [attr.x]=\"tick.x\"\n        [attr.y]=\"nav.base + 15\"\n      >\n        {{ tick.label }}\n      </svg:text>\n    }\n    <svg:rect\n      class=\"m-section-chart__nav-dim\"\n      [attr.x]=\"left()\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"nav.start - left()\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-dim\"\n      [attr.x]=\"nav.end\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"right() - nav.end\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-window\"\n      [attr.x]=\"nav.start\"\n      [attr.y]=\"navTop\"\n      [attr.width]=\"nav.end - nav.start\"\n      [attr.height]=\"nav.base - navTop\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-handle\"\n      rx=\"2\"\n      width=\"6\"\n      height=\"20\"\n      [attr.x]=\"nav.start - 3\"\n      [attr.y]=\"(nav.base + navTop) / 2 - 10\"\n    />\n    <svg:rect\n      class=\"m-section-chart__nav-handle\"\n      rx=\"2\"\n      width=\"6\"\n      height=\"20\"\n      [attr.x]=\"nav.end - 3\"\n      [attr.y]=\"(nav.base + navTop) / 2 - 10\"\n    />\n  </svg>\n}\n\n<table class=\"m-section-chart__table\" [id]=\"tableId\">\n  <thead>\n    <tr>\n      <th scope=\"col\">{{ 'date' | translate }}</th>\n      @for (column of table().columns; track $index) {\n        <th scope=\"col\">\n          {{ column.noTranslate ? column.label : (column.label | translate: column.params) }}\n        </th>\n      }\n    </tr>\n  </thead>\n  <tbody>\n    @for (row of table().rows; track $index) {\n      <tr>\n        <td>{{ row.date }}</td>\n        @for (cell of row.cells; track $index) {\n          <td>{{ cell }}</td>\n        }\n      </tr>\n    }\n  </tbody>\n</table>\n",
+			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;position:relative;width:100%;min-width:0}.m-section-chart__top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.5rem 1rem;margin-bottom:.5rem}.m-section-chart__legend{display:grid;gap:.15rem;min-width:0}.m-section-chart__tip-key{display:inline-block;width:.75rem;height:2px;border-radius:1px}.m-section-chart__window{color:var(--m-text-tertiary);font-size:.8rem}:host(.m-section-chart--minimal) .m-section-chart__svg{cursor:default}:host(.m-section-chart--minimal) .m-section-chart__line{stroke-width:2.25}.m-section-chart__area{stroke:none}.m-section-chart__plot{position:relative}.m-section-chart__svg{display:block;overflow:visible}.m-section-chart__svg:focus{outline:none}.m-section-chart__svg:focus-visible{outline:2px solid var(--m-focus);outline-offset:4px;border-radius:4px}.m-section-chart__svg.is-measurable{cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none}.m-section-chart__band{fill:var(--m-text);opacity:.06}.m-section-chart__band-edge{stroke:var(--m-text-secondary);stroke-width:1}.m-section-chart__grid{stroke:var(--m-text-septenary);stroke-width:1}.m-section-chart__grid--zero{stroke:var(--m-text-quinary);stroke-width:1.5}.m-section-chart__axis{stroke:var(--m-text-quinary);stroke-width:1}.m-section-chart__tick{fill:var(--m-text-tertiary);font-size:11px;font-variant-numeric:tabular-nums}.m-section-chart__line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.m-section-chart__dot{stroke:var(--m-background);stroke-width:2}.m-section-chart__cross{stroke:var(--m-text-secondary);stroke-width:1;opacity:.55}.m-section-chart__hover-band{fill:var(--m-text);opacity:.05}.m-section-chart__column{stroke:none}.m-section-chart__value{fill:var(--m-text-secondary);font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}.m-section-chart__tip,.m-section-chart__measure{position:absolute;z-index:2;display:grid;gap:.25rem;min-width:10rem;padding:.5rem .625rem;border:1px solid var(--m-backdrop-border);border-radius:.5rem;background:var(--m-background);box-shadow:0 6px 20px var(--m-backdrop-shadow);font-size:.75rem;pointer-events:none}.m-section-chart__tip{top:0;margin-left:.875rem}.m-section-chart__tip--flip{transform:translate(calc(-100% - 1.75rem))}.m-section-chart__measure{bottom:2.25rem}.m-section-chart__measure--flip{transform:translate(-100%)}.m-section-chart__tip-title{color:var(--m-text-secondary);font-weight:600}.m-section-chart__tip-row{display:grid;grid-template-columns:.75rem auto 1fr auto;align-items:center;gap:.5rem}.m-section-chart__tip-value{color:var(--m-text);font-weight:650;font-variant-numeric:tabular-nums}.m-section-chart__tip-label{color:var(--m-text-secondary);white-space:nowrap}.m-section-chart__tip-sub{color:var(--m-text-tertiary);font-variant-numeric:tabular-nums}.m-section-chart__presets{--section-px: 0;margin-top:.5rem}.m-section-chart__preset{font-size:.8rem;font-weight:600;font-variant-numeric:tabular-nums}.m-section-chart__navigator{display:block;margin-top:.25rem;overflow:visible;touch-action:none;-webkit-user-select:none;user-select:none;cursor:pointer}.m-section-chart__navigator:focus{outline:none}.m-section-chart__navigator:focus-visible{outline:2px solid var(--m-focus);outline-offset:4px;border-radius:4px}.m-section-chart__nav-area{fill:var(--m-text-tertiary);opacity:.12}.m-section-chart__nav-line{fill:none;stroke:var(--m-text-tertiary);stroke-width:1.25}.m-section-chart__nav-dim{fill:var(--m-background);opacity:.6}.m-section-chart__nav-window{fill:transparent;stroke:var(--m-text-secondary);stroke-width:1;cursor:grab}.m-section-chart__nav-handle{fill:var(--m-text-secondary);cursor:ew-resize}.m-section-chart__table{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -19131,7 +19503,12 @@ var SectionChartSeriesComponent = class SectionChartSeriesComponent {
 	noTranslate = input(false, ...ngDevMode ? [{ debugName: "noTranslate" }] : /* istanbul ignore next */ []);
 	params = input(void 0, ...ngDevMode ? [{ debugName: "params" }] : /* istanbul ignore next */ []);
 	color = input(void 0, ...ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []);
-	points = computed(() => readChartPoints(this.data(), this.x(), this.y()), ...ngDevMode ? [{ debugName: "points" }] : /* istanbul ignore next */ []);
+	mark = input("line", ...ngDevMode ? [{ debugName: "mark" }] : /* istanbul ignore next */ []);
+	per = input(void 0, ...ngDevMode ? [{ debugName: "per" }] : /* istanbul ignore next */ []);
+	panel = input("main", ...ngDevMode ? [{ debugName: "panel" }] : /* istanbul ignore next */ []);
+	points = computed(() => readChartPoints(this.data(), this.x(), this.y(), this.per()), ...ngDevMode ? [{ debugName: "points" }] : /* istanbul ignore next */ []);
+	categories = computed(() => readChartCategories(this.data(), this.x(), this.y(), this.per()), ...ngDevMode ? [{ debugName: "categories" }] : /* istanbul ignore next */ []);
+	ratio = computed(() => !!this.per(), ...ngDevMode ? [{ debugName: "ratio" }] : /* istanbul ignore next */ []);
 	row;
 	constructor() {
 		const chart = inject(SECTION_CHART_CONTEXT, { optional: true });
@@ -19141,6 +19518,10 @@ var SectionChartSeriesComponent = class SectionChartSeriesComponent {
 		}
 		const member = {
 			points: this.points,
+			categories: this.categories,
+			mark: this.mark,
+			panel: this.panel,
+			ratio: this.ratio,
 			label: this.label,
 			noTranslate: this.noTranslate,
 			params: this.params,
@@ -19213,6 +19594,27 @@ var SectionChartSeriesComponent = class SectionChartSeriesComponent {
 				isSignal: true,
 				isRequired: false,
 				transformFunction: null
+			},
+			mark: {
+				classPropertyName: "mark",
+				publicName: "mark",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			per: {
+				classPropertyName: "per",
+				publicName: "per",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			panel: {
+				classPropertyName: "panel",
+				publicName: "panel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
 			}
 		},
 		host: {
@@ -19341,6 +19743,30 @@ i0.ɵɵngDeclareClassMetadata({
 				alias: "color",
 				required: false
 			}]
+		}],
+		mark: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "mark",
+				required: false
+			}]
+		}],
+		per: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "per",
+				required: false
+			}]
+		}],
+		panel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "panel",
+				required: false
+			}]
 		}]
 	}
 });
@@ -34286,6 +34712,1025 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
+const gapPct = (level, value) => (level / value - 1) * 100;
+const formatGap = (gap) => `${gap > 0 ? "+" : gap < 0 ? "−" : ""}${Math.abs(gap).toFixed(1)}%`;
+const PAD = .04;
+const ladderScale = ({ value, levels, forward = [], maxSpanPct }) => {
+	const within = (v) => Math.abs(gapPct(v, value)) <= maxSpanPct;
+	const values = [
+		value,
+		...levels,
+		...forward.filter(within)
+	];
+	const min = Math.min(...values);
+	const max = Math.max(...values);
+	const span = max - min || Math.abs(max) * .02 || 1;
+	const lo = max === min ? min - span / 2 : min - span * PAD;
+	const width = max === min ? span : span * 1.08;
+	const pos = (v) => (v - lo) / width * 100;
+	return {
+		pos,
+		within,
+		clamp: (v) => Math.max(0, Math.min(100, pos(v)))
+	};
+};
+const layoutLanes = (items, minGapPx) => {
+	const labels = [];
+	const last = [null, null];
+	for (const item of [...items].sort((a, b) => a.x - b.x)) {
+		const lane = [0, 1].find((l) => !last[l] || item.x - last[l].x >= minGapPx);
+		if (lane !== void 0) {
+			const label = {
+				lane,
+				x: item.x,
+				keys: [item.key]
+			};
+			labels.push(label);
+			last[lane] = label;
+			continue;
+		}
+		const [a, b] = last;
+		(Math.abs(a.x - item.x) <= Math.abs(b.x - item.x) ? a : b).keys.push(item.key);
+	}
+	return labels;
+};
+const PRICE_LADDER_RULES = [
+	"golden-cross",
+	"death-cross",
+	"death-cross-near",
+	"golden-cross-near",
+	"bullish-alignment",
+	"bearish-alignment",
+	"strongly-bullish",
+	"bullish-support",
+	"recovering",
+	"bearish-pressure",
+	"stretched",
+	"far-below-sma-200",
+	"averages-converging",
+	"52w-breakout",
+	"near-52w-high",
+	"new-52w-low",
+	"near-52w-low",
+	"forecast-against-trend",
+	"forecast-above-52w-high"
+];
+const CROSS_NEAR_PCT = 1;
+const STRETCHED_PCT = 20;
+const SQUEEZE_PCT = 3;
+const NEAR_BOUND_PCT = 3;
+const usable = (v) => typeof v === "number" && Number.isFinite(v) && v > 0;
+const ladderSignals = (levels, symbol = "₹") => {
+	const { value: v, sma10: s10, sma50: s50, sma100: s100, sma200: s200, low52w: lo, high52w: hi } = levels;
+	if (!usable(v)) return [];
+	const money = (n) => `${symbol}${n.toLocaleString("en-IN", { maximumFractionDigits: 2 })}`;
+	const out = [];
+	const add = (rule, tone, params = {}) => out.push({
+		rule,
+		tone,
+		params
+	});
+	if (usable(s50) && usable(s200)) {
+		const gap = gapPct(s50, s200);
+		if (gap >= 0) add("golden-cross", "gold", { gap: formatGap(gap) });
+		else add("death-cross", "down", { gap: formatGap(gap) });
+		if (Math.abs(gap) < CROSS_NEAR_PCT) add(gap >= 0 ? "death-cross-near" : "golden-cross-near", "warn", { gap: formatGap(Math.abs(gap)) });
+	}
+	const stack = [
+		v,
+		s10,
+		s50,
+		s100,
+		s200
+	];
+	if (stack.every(usable)) {
+		const nums = stack;
+		if (nums.every((x, i) => i === 0 || nums[i - 1] > x)) add("bullish-alignment", "up");
+		else if (nums.every((x, i) => i === 0 || nums[i - 1] < x)) add("bearish-alignment", "down");
+	}
+	if (usable(s50) && usable(s200)) {
+		const above50 = v > s50;
+		const above200 = v > s200;
+		if (above50 && above200) add("strongly-bullish", "up");
+		else if (above200) add("bullish-support", "up");
+		else if (above50) add("recovering", "neutral");
+		else add("bearish-pressure", "down");
+	}
+	if (usable(s200)) {
+		const gap = gapPct(v, s200);
+		if (gap > STRETCHED_PCT) add("stretched", "warn", { gap: formatGap(gap) });
+		if (gap < -20) add("far-below-sma-200", "down", { gap: formatGap(gap) });
+	}
+	const smas = [
+		s10,
+		s50,
+		s100,
+		s200
+	].filter(usable);
+	if (smas.length >= 3) {
+		const spread = gapPct(Math.max(...smas), Math.min(...smas));
+		if (spread < SQUEEZE_PCT) add("averages-converging", "warn", { spread: `${spread.toFixed(1)}%` });
+	}
+	if (usable(lo) && usable(hi)) {
+		if (v >= hi) add("52w-breakout", "up", { level: money(hi) });
+		else if (gapPct(hi, v) < NEAR_BOUND_PCT) add("near-52w-high", "up", {
+			gap: formatGap(gapPct(hi, v)),
+			level: money(hi)
+		});
+		if (v <= lo) add("new-52w-low", "down", { level: money(lo) });
+		else if (gapPct(v, lo) < NEAR_BOUND_PCT) add("near-52w-low", "down", {
+			gap: formatGap(gapPct(v, lo)),
+			level: money(lo)
+		});
+	}
+	const target = levels.target;
+	if (usable(target)) {
+		const gap = gapPct(target, v);
+		const has = (...rules) => out.some((s) => rules.includes(s.rule));
+		if (gap > 0 && has("death-cross", "bearish-alignment") || gap < 0 && has("golden-cross", "bullish-alignment")) add("forecast-against-trend", "warn", { gap: formatGap(gap) });
+		if (usable(hi) && target > hi) add("forecast-above-52w-high", "neutral", { level: money(hi) });
+	}
+	return out;
+};
+const isLadderRule = (name) => PRICE_LADDER_RULES.includes(name);
+const PRICE_LADDER_LEVELS = [
+	{
+		key: "sma10",
+		label: "sma-10",
+		kind: "level",
+		rank: 1
+	},
+	{
+		key: "sma50",
+		label: "sma-50",
+		kind: "level",
+		rank: 2
+	},
+	{
+		key: "sma100",
+		label: "sma-100",
+		kind: "level",
+		rank: 3
+	},
+	{
+		key: "sma200",
+		label: "sma-200",
+		kind: "level",
+		rank: 4
+	},
+	{
+		key: "ema10",
+		label: "ema-10",
+		kind: "level",
+		rank: 1
+	},
+	{
+		key: "ema50",
+		label: "ema-50",
+		kind: "level",
+		rank: 2
+	},
+	{
+		key: "ema100",
+		label: "ema-100",
+		kind: "level",
+		rank: 3
+	},
+	{
+		key: "ema200",
+		label: "ema-200",
+		kind: "level",
+		rank: 4
+	},
+	{
+		key: "low52w",
+		label: "52w-low",
+		kind: "bound",
+		rank: 1
+	},
+	{
+		key: "high52w",
+		label: "52w-high",
+		kind: "bound",
+		rank: 1
+	},
+	{
+		key: "current",
+		label: "current-price",
+		kind: "current",
+		rank: 1
+	},
+	{
+		key: "forecast",
+		label: "model-forecast",
+		kind: "forecast",
+		rank: 1
+	}
+];
+const ladderLevelOf = (key) => PRICE_LADDER_LEVELS.find((l) => l.key === key);
+var PriceLadderMarkComponent = class PriceLadderMarkComponent {
+	key = input("", ...ngDevMode ? [{ debugName: "key" }] : /* istanbul ignore next */ []);
+	label = input("", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	value = input(null, ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	kind = input(void 0, ...ngDevMode ? [{ debugName: "kind" }] : /* istanbul ignore next */ []);
+	rank = input(void 0, ...ngDevMode ? [{ debugName: "rank" }] : /* istanbul ignore next */ []);
+	note = input(void 0, ...ngDevMode ? [{ debugName: "note" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: PriceLadderMarkComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: PriceLadderMarkComponent,
+		isStandalone: true,
+		selector: "m-price-ladder-mark",
+		inputs: {
+			key: {
+				classPropertyName: "key",
+				publicName: "key",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			kind: {
+				classPropertyName: "kind",
+				publicName: "kind",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			rank: {
+				classPropertyName: "rank",
+				publicName: "rank",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			note: {
+				classPropertyName: "note",
+				publicName: "note",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { styleAttribute: "display: none" },
+		ngImport: i0,
+		template: "",
+		isInline: true,
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: PriceLadderMarkComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "m-price-ladder-mark",
+			template: "",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: { style: "display: none" }
+		}]
+	}],
+	propDecorators: {
+		key: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "key",
+				required: false
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}],
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		kind: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "kind",
+				required: false
+			}]
+		}],
+		rank: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "rank",
+				required: false
+			}]
+		}],
+		note: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "note",
+				required: false
+			}]
+		}]
+	}
+});
+var PriceLadderSignalComponent = class PriceLadderSignalComponent {
+	key = input("", ...ngDevMode ? [{ debugName: "key" }] : /* istanbul ignore next */ []);
+	rule = input(void 0, ...ngDevMode ? [{ debugName: "rule" }] : /* istanbul ignore next */ []);
+	label = input("", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	tone = input("neutral", ...ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []);
+	detail = input("", ...ngDevMode ? [{ debugName: "detail" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: PriceLadderSignalComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: PriceLadderSignalComponent,
+		isStandalone: true,
+		selector: "m-price-ladder-signal",
+		inputs: {
+			key: {
+				classPropertyName: "key",
+				publicName: "key",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			rule: {
+				classPropertyName: "rule",
+				publicName: "rule",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			tone: {
+				classPropertyName: "tone",
+				publicName: "tone",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			detail: {
+				classPropertyName: "detail",
+				publicName: "detail",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { styleAttribute: "display: none" },
+		ngImport: i0,
+		template: "",
+		isInline: true,
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: PriceLadderSignalComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "m-price-ladder-signal",
+			template: "",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: { style: "display: none" }
+		}]
+	}],
+	propDecorators: {
+		key: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "key",
+				required: false
+			}]
+		}],
+		rule: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "rule",
+				required: false
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}],
+		tone: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tone",
+				required: false
+			}]
+		}],
+		detail: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "detail",
+				required: false
+			}]
+		}]
+	}
+});
+const LIST_BELOW_PX = 360;
+const FALLBACK_PX = 640;
+const LABEL_GAP_PX = 64;
+const price = (v) => typeof v === "number" && Number.isFinite(v) && v > 0 ? v : null;
+var PriceLadderComponent = class PriceLadderComponent {
+	value = input(null, ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	valueLabel = input("current-price", ...ngDevMode ? [{ debugName: "valueLabel" }] : /* istanbul ignore next */ []);
+	target = input(null, ...ngDevMode ? [{ debugName: "target" }] : /* istanbul ignore next */ []);
+	targetLow = input(null, ...ngDevMode ? [{ debugName: "targetLow" }] : /* istanbul ignore next */ []);
+	targetHigh = input(null, ...ngDevMode ? [{ debugName: "targetHigh" }] : /* istanbul ignore next */ []);
+	targetLabel = input("model-forecast", ...ngDevMode ? [{ debugName: "targetLabel" }] : /* istanbul ignore next */ []);
+	targetNote = input("", ...ngDevMode ? [{ debugName: "targetNote" }] : /* istanbul ignore next */ []);
+	maxSpanPct = input(60, ...ngDevMode ? [{ debugName: "maxSpanPct" }] : /* istanbul ignore next */ []);
+	variant = input("auto", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
+	symbol = input("₹", ...ngDevMode ? [{ debugName: "symbol" }] : /* istanbul ignore next */ []);
+	signals = input(void 0, ...ngDevMode ? [{ debugName: "signals" }] : /* istanbul ignore next */ []);
+	crossFrom = input(void 0, ...ngDevMode ? [{ debugName: "crossFrom" }] : /* istanbul ignore next */ []);
+	crossTo = input(void 0, ...ngDevMode ? [{ debugName: "crossTo" }] : /* istanbul ignore next */ []);
+	crossTone = input("neutral", ...ngDevMode ? [{ debugName: "crossTone" }] : /* istanbul ignore next */ []);
+	markTags = contentChildren(PriceLadderMarkComponent, ...ngDevMode ? [{ debugName: "markTags" }] : /* istanbul ignore next */ []);
+	signalTags = contentChildren(PriceLadderSignalComponent, ...ngDevMode ? [{ debugName: "signalTags" }] : /* istanbul ignore next */ []);
+	translateService = inject(TranslateService);
+	width = signal(0, ...ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []);
+	constructor() {
+		const host = inject(ElementRef).nativeElement;
+		const destroyRef = inject(DestroyRef);
+		afterNextRender(() => {
+			if (typeof ResizeObserver === "undefined") return;
+			const observer = new ResizeObserver(([entry]) => this.width.set(entry.contentRect.width));
+			observer.observe(host);
+			destroyRef.onDestroy(() => observer.disconnect());
+		});
+	}
+	t = (key) => this.translateService.translate(key);
+	money = (v) => `${this.symbol()}${v.toLocaleString("en-IN", { maximumFractionDigits: 2 })}`;
+	anchor = (kind) => this.everyMark().find((m) => m.kind === kind)?.value ?? null;
+	current = computed(() => this.anchor("current") ?? price(this.value()), ...ngDevMode ? [{ debugName: "current" }] : /* istanbul ignore next */ []);
+	targetPoint = computed(() => this.anchor("forecast") ?? price(this.target()), ...ngDevMode ? [{ debugName: "targetPoint" }] : /* istanbul ignore next */ []);
+	shownAs = computed(() => {
+		const variant = this.variant();
+		if (variant !== "auto") return variant;
+		const w = this.width();
+		return w > 0 && w < LIST_BELOW_PX ? "list" : "line";
+	}, ...ngDevMode ? [{ debugName: "shownAs" }] : /* istanbul ignore next */ []);
+	everyMark = computed(() => this.markTags().flatMap((tag) => {
+		const value = price(tag.value());
+		if (value === null) return [];
+		const level = ladderLevelOf(tag.key());
+		const note = tag.note();
+		const name = this.t(tag.label() || level?.label || "");
+		return [{
+			key: tag.key(),
+			name: note ? `${name} · ${this.t(note)}` : name,
+			value,
+			kind: tag.kind() ?? level?.kind ?? "level",
+			rank: Math.min(4, Math.max(1, tag.rank() ?? level?.rank ?? 1))
+		}];
+	}), ...ngDevMode ? [{ debugName: "everyMark" }] : /* istanbul ignore next */ []);
+	marks = computed(() => this.everyMark().filter((m) => m.kind === "level" || m.kind === "bound"), ...ngDevMode ? [{ debugName: "marks" }] : /* istanbul ignore next */ []);
+	matched = computed(() => {
+		const value = this.current();
+		if (value === null) return /* @__PURE__ */ new Map();
+		const at = (key) => this.marks().find((m) => m.key === key)?.value;
+		const found = ladderSignals({
+			value,
+			target: this.targetPoint(),
+			sma10: at("sma10"),
+			sma50: at("sma50"),
+			sma100: at("sma100"),
+			sma200: at("sma200"),
+			low52w: at("low52w"),
+			high52w: at("high52w")
+		}, this.symbol());
+		return new Map(found.map((s) => [s.rule, s]));
+	}, ...ngDevMode ? [{ debugName: "matched" }] : /* istanbul ignore next */ []);
+	picked = computed(() => {
+		const raw = this.signals();
+		const names = typeof raw === "string" ? raw.split(/[\s,]+/) : raw ?? [];
+		if (names.includes("all")) return PRICE_LADDER_RULES;
+		return PRICE_LADDER_RULES.filter((r) => names.includes(r));
+	}, ...ngDevMode ? [{ debugName: "picked" }] : /* istanbul ignore next */ []);
+	chips = computed(() => {
+		const tagged = this.tagChips();
+		const shown = new Set(tagged.map((c) => c.rule));
+		const picked = this.picked().flatMap((rule) => {
+			const hit = this.matched().get(rule);
+			if (!hit || shown.has(rule)) return [];
+			return [this.ruleChip(rule, rule, hit, "", "")];
+		});
+		return [...tagged, ...picked];
+	}, ...ngDevMode ? [{ debugName: "chips" }] : /* istanbul ignore next */ []);
+	ruleChip = (key, rule, hit, label, detail) => ({
+		key,
+		rule,
+		label: this.t(label || rule),
+		tone: hit.tone,
+		detail: detail || this.translateService.translate(`${rule}-detail`, hit.params)
+	});
+	tagChips = computed(() => this.signalTags().flatMap((tag, i) => {
+		const raw = tag.rule();
+		const rule = isLadderRule(raw) ? raw : void 0;
+		const key = tag.key() || rule || `signal-${i}`;
+		if (!rule) return [{
+			key,
+			rule: void 0,
+			label: this.t(tag.label()),
+			tone: tag.tone(),
+			detail: tag.detail()
+		}];
+		const hit = this.matched().get(rule);
+		if (!hit) return [];
+		return [this.ruleChip(key, rule, hit, tag.label(), tag.detail())];
+	}), ...ngDevMode ? [{ debugName: "tagChips" }] : /* istanbul ignore next */ []);
+	crossPair = computed(() => {
+		const from = this.crossFrom();
+		const to = this.crossTo();
+		if (from && to) return {
+			from,
+			to,
+			tone: this.crossTone()
+		};
+		const cross = this.chips().find((c) => c.rule === "golden-cross" || c.rule === "death-cross");
+		return cross ? {
+			from: "sma50",
+			to: "sma200",
+			tone: cross.tone
+		} : null;
+	}, ...ngDevMode ? [{ debugName: "crossPair" }] : /* istanbul ignore next */ []);
+	forward = computed(() => {
+		const value = this.current();
+		if (value === null) return null;
+		const point = this.targetPoint();
+		const low = price(this.targetLow());
+		const high = price(this.targetHigh());
+		const range = low !== null && high !== null ? {
+			low: Math.min(low, high),
+			high: Math.max(low, high)
+		} : null;
+		if (point === null && range === null) return null;
+		const label = point !== null ? this.t(this.targetLabel()) : this.translateService.translate("forecast-range");
+		const note = this.targetNote();
+		const rangeText = range ? `${this.money(range.low)} – ${this.money(range.high)}` : "";
+		const gap = gapPct(point ?? (range ? (range.low + range.high) / 2 : value), value);
+		return {
+			point,
+			range,
+			label,
+			name: note ? `${label} · ${note}` : label,
+			valueText: point !== null ? `${this.money(point)} ${formatGap(gap)}` : rangeText,
+			rowText: point !== null ? this.money(point) : rangeText,
+			up: gap >= 0,
+			shown: point ?? range?.high ?? value
+		};
+	}, ...ngDevMode ? [{ debugName: "forward" }] : /* istanbul ignore next */ []);
+	line = computed(() => {
+		const value = this.current();
+		if (value === null) return null;
+		const marks = this.marks();
+		const fwd = this.forward();
+		const forwardValues = fwd ? [
+			fwd.point,
+			fwd.range?.low,
+			fwd.range?.high
+		].filter((v) => v != null) : [];
+		const scale = ladderScale({
+			value,
+			levels: marks.map((m) => m.value),
+			forward: forwardValues,
+			maxSpanPct: this.maxSpanPct()
+		});
+		const at = new Map(marks.map((m) => [m.key, m]));
+		const widthPx = this.width() || FALLBACK_PX;
+		const labels = layoutLanes(marks.map((m) => ({
+			key: m.key,
+			x: scale.pos(m.value) / 100 * widthPx
+		})), LABEL_GAP_PX).map((label) => {
+			const group = marks.filter((m) => label.keys.includes(m.key));
+			const level = group.some((m) => m.kind === "level");
+			return {
+				key: label.keys.join("+"),
+				lane: label.lane,
+				pos: label.x / widthPx * 100,
+				bound: !level,
+				name: group.map((m) => m.name).join(" · "),
+				valueText: group.map((m) => this.money(m.value)).join(" · "),
+				gapText: level ? group.map((m) => formatGap(gapPct(m.value, value))).join(" · ") : ""
+			};
+		});
+		const valuePos = scale.pos(value);
+		let target = null;
+		if (fwd?.point != null) {
+			const onScale = scale.within(fwd.point);
+			target = {
+				pos: onScale ? scale.pos(fwd.point) : fwd.point > value ? 100 : 0,
+				offScale: !onScale,
+				point: true
+			};
+		} else if (fwd?.range) target = {
+			pos: (scale.clamp(fwd.range.low) + scale.clamp(fwd.range.high)) / 2,
+			offScale: false,
+			point: false
+		};
+		const pair = this.crossPair();
+		const from = at.get(pair?.from ?? "");
+		const to = at.get(pair?.to ?? "");
+		const cross = pair && from && to ? {
+			...span(scale.pos(from.value), scale.pos(to.value)),
+			tone: pair.tone
+		} : null;
+		const ends = marks.filter((m) => m.kind === "bound");
+		const bounds = ends.length === 2 ? span(scale.pos(ends[0].value), scale.pos(ends[1].value)) : null;
+		return {
+			valuePos,
+			ticks: marks.map((m) => ({
+				key: m.key,
+				kind: m.kind,
+				rank: m.rank,
+				pos: scale.pos(m.value)
+			})),
+			labels,
+			lanes: labels.some((l) => l.lane === 1) ? 2 : 1,
+			target,
+			connector: target && fwd?.point != null ? span(valuePos, target.pos) : null,
+			band: fwd?.range ? span(scale.clamp(fwd.range.low), scale.clamp(fwd.range.high)) : null,
+			cross,
+			bounds
+		};
+	}, ...ngDevMode ? [{ debugName: "line" }] : /* istanbul ignore next */ []);
+	rows = computed(() => {
+		const value = this.current();
+		if (value === null) return [];
+		const fwd = this.forward();
+		const rows = [
+			...this.marks().map((m) => ({
+				key: m.key,
+				kind: m.kind,
+				name: m.name,
+				value: m.value,
+				valueText: this.money(m.value)
+			})),
+			{
+				key: "current",
+				kind: "current",
+				name: this.t(this.valueLabel()),
+				value,
+				valueText: this.money(value)
+			},
+			...fwd ? [{
+				key: "target",
+				kind: "target",
+				name: fwd.name,
+				value: fwd.shown,
+				valueText: fwd.rowText
+			}] : []
+		].sort((a, b) => b.value - a.value);
+		const lo = rows[rows.length - 1].value;
+		const hi = rows[0].value;
+		return rows.map((r) => ({
+			...r,
+			gapText: r.kind === "current" ? "" : formatGap(gapPct(r.value, value)),
+			up: r.value >= value,
+			pos: hi === lo ? 50 : (r.value - lo) / (hi - lo) * 100
+		}));
+	}, ...ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []);
+	summary = computed(() => {
+		const value = this.current();
+		if (value === null) return this.translateService.translate("no-data");
+		const fwd = this.forward();
+		const head = this.translateService.translate("price-ladder-summary", {
+			value: this.money(value),
+			n: String(this.marks().length)
+		});
+		return fwd ? `${head}; ${fwd.label} ${fwd.valueText}` : head;
+	}, ...ngDevMode ? [{ debugName: "summary" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: PriceLadderComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: PriceLadderComponent,
+		isStandalone: true,
+		selector: "m-price-ladder",
+		inputs: {
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			valueLabel: {
+				classPropertyName: "valueLabel",
+				publicName: "valueLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			target: {
+				classPropertyName: "target",
+				publicName: "target",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			targetLow: {
+				classPropertyName: "targetLow",
+				publicName: "targetLow",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			targetHigh: {
+				classPropertyName: "targetHigh",
+				publicName: "targetHigh",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			targetLabel: {
+				classPropertyName: "targetLabel",
+				publicName: "targetLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			targetNote: {
+				classPropertyName: "targetNote",
+				publicName: "targetNote",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			maxSpanPct: {
+				classPropertyName: "maxSpanPct",
+				publicName: "maxSpanPct",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			variant: {
+				classPropertyName: "variant",
+				publicName: "variant",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			symbol: {
+				classPropertyName: "symbol",
+				publicName: "symbol",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			signals: {
+				classPropertyName: "signals",
+				publicName: "signals",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			crossFrom: {
+				classPropertyName: "crossFrom",
+				publicName: "crossFrom",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			crossTo: {
+				classPropertyName: "crossTo",
+				publicName: "crossTo",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			crossTone: {
+				classPropertyName: "crossTone",
+				publicName: "crossTone",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		queries: [{
+			propertyName: "markTags",
+			predicate: PriceLadderMarkComponent,
+			isSignal: true
+		}, {
+			propertyName: "signalTags",
+			predicate: PriceLadderSignalComponent,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "<div class=\"m-price-ladder\" role=\"img\" [attr.aria-label]=\"summary()\">\n  @if (chips().length) {\n    <div class=\"m-price-ladder__signals\">\n      @for (s of chips(); track s.key) {\n        <span\n          [class]=\"'m-price-ladder__signal is-' + s.tone\"\n          [attr.title]=\"s.detail || null\"\n          >{{ s.label }}</span\n        >\n      }\n    </div>\n  }\n\n  @if (current(); as value) {\n    @if (shownAs() === 'line') {\n      @if (line(); as l) {\n        <div class=\"m-price-ladder__line\" [style.--_lanes]=\"l.lanes\">\n          @if (forward(); as f) {\n            @if (l.target; as t) {\n              <div\n                class=\"m-price-ladder__target\"\n                [class.is-off-scale]=\"t.offScale\"\n                [class.is-up]=\"f.up\"\n                [class.is-down]=\"!f.up\"\n                [style.--_x.%]=\"t.pos\"\n              >\n                <span class=\"m-price-ladder__target-name\">{{ f.name }}</span>\n                <span class=\"m-price-ladder__target-value\">{{ f.valueText }}</span>\n              </div>\n            }\n          }\n\n          <div class=\"m-price-ladder__axis\">\n            @if (l.bounds; as b) {\n              <span class=\"m-price-ladder__range\" [style.left.%]=\"b.left\" [style.width.%]=\"b.width\"></span>\n            }\n            @if (l.band; as b) {\n              <span class=\"m-price-ladder__band\" [style.left.%]=\"b.left\" [style.width.%]=\"b.width\"></span>\n            }\n            @if (l.connector; as c) {\n              <span\n                class=\"m-price-ladder__connector\"\n                [class.is-up]=\"forward()?.up\"\n                [class.is-down]=\"!forward()?.up\"\n                [style.left.%]=\"c.left\"\n                [style.width.%]=\"c.width\"\n              ></span>\n            }\n            @if (l.cross; as c) {\n              <span\n                [class]=\"'m-price-ladder__cross is-' + c.tone\"\n                [style.left.%]=\"c.left\"\n                [style.width.%]=\"c.width\"\n              ></span>\n            }\n            @for (tick of l.ticks; track tick.key) {\n              <span\n                class=\"m-price-ladder__tick\"\n                [class.is-bound]=\"tick.kind === 'bound'\"\n                [style.--_rank]=\"tick.rank\"\n                [style.left.%]=\"tick.pos\"\n              ></span>\n            }\n            @if (l.target; as t) {\n              @if (t.point) {\n                <span\n                  class=\"m-price-ladder__target-tick\"\n                  [class.is-off-scale]=\"t.offScale\"\n                  [class.is-left]=\"t.pos === 0\"\n                  [style.left.%]=\"t.pos\"\n                ></span>\n              }\n            }\n            <span class=\"m-price-ladder__current\" [style.--_x.%]=\"l.valuePos\">\n              <span class=\"m-price-ladder__current-value\">{{ money(value) }}</span>\n            </span>\n          </div>\n\n          <div class=\"m-price-ladder__labels\">\n            @for (label of l.labels; track label.key) {\n              <span\n                class=\"m-price-ladder__label\"\n                [class.is-bound]=\"label.bound\"\n                [class.is-lane-2]=\"label.lane === 1\"\n                [style.--_x.%]=\"label.pos\"\n              >\n                <span class=\"m-price-ladder__label-name\">{{ label.name }}</span>\n                <span class=\"m-price-ladder__label-value\">{{ label.valueText }}</span>\n                @if (label.gapText) {\n                  <span class=\"m-price-ladder__label-gap\">{{ label.gapText }}</span>\n                }\n              </span>\n            }\n          </div>\n        </div>\n      }\n    } @else {\n      <div class=\"m-price-ladder__list\">\n        @for (row of rows(); track row.key) {\n          <div [class]=\"'m-price-ladder__row is-' + row.kind\">\n            <span class=\"m-price-ladder__row-name\">{{ row.name }}</span>\n            <span class=\"m-price-ladder__row-value\">{{ row.valueText }}</span>\n            <span class=\"m-price-ladder__row-gap\" [class.is-up]=\"row.up\" [class.is-down]=\"!row.up\">{{\n              row.gapText\n            }}</span>\n            <span class=\"m-price-ladder__row-track\">\n              <span class=\"m-price-ladder__row-dot\" [style.left.%]=\"row.pos\"></span>\n            </span>\n          </div>\n        }\n      </div>\n    }\n  } @else {\n    <div class=\"m-price-ladder__empty\">—</div>\n  }\n</div>\n",
+		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;--m-price-ladder-forward: var(--m-mm);--m-price-ladder-up: var(--m-success);--m-price-ladder-down: var(--m-error);--m-price-ladder-warn: var(--m-warning);--m-price-ladder-gold: var(--m-gold)}.m-price-ladder{display:flex;flex-direction:column;gap:.75em;font-variant-numeric:tabular-nums}.m-price-ladder__signals{display:flex;flex-wrap:wrap;gap:.4em}.m-price-ladder__signal{display:inline-flex;align-items:center;gap:.4em;padding:.15em .65em .15em .5em;border:1px solid var(--m-border);border-radius:999px;font-size:.8em;font-weight:500}.m-price-ladder__signal:before{content:\"\";width:.55em;height:.55em;border-radius:50%;background:var(--_tone, var(--m-text-tertiary))}.m-price-ladder__signal.is-up{--_tone: var(--m-price-ladder-up)}.m-price-ladder__signal.is-down{--_tone: var(--m-price-ladder-down)}.m-price-ladder__signal.is-warn{--_tone: var(--m-price-ladder-warn)}.m-price-ladder__signal.is-gold{--_tone: var(--m-price-ladder-gold);border-color:var(--m-price-ladder-gold)}.m-price-ladder__line{display:grid;--_edge: 3em}.m-price-ladder__target{position:relative;left:clamp(var(--_edge),var(--_x),100% - var(--_edge));display:flex;flex-direction:column;align-items:center;width:max-content;max-width:50%;transform:translate(-50%);font-size:.8em}.m-price-ladder__target.is-up{--_dir: var(--m-price-ladder-up)}.m-price-ladder__target.is-down{--_dir: var(--m-price-ladder-down)}.m-price-ladder__target-name{color:var(--m-price-ladder-forward);font-style:italic}.m-price-ladder__target-value{color:var(--m-text);font-weight:600}.m-price-ladder__axis{position:relative;height:3.6em}.m-price-ladder__axis:before{content:\"\";position:absolute;inset:50% 0 auto;height:2px;background:var(--m-border);transform:translateY(-50%)}.m-price-ladder__range,.m-price-ladder__band,.m-price-ladder__connector,.m-price-ladder__tick,.m-price-ladder__target-tick,.m-price-ladder__cross{position:absolute;top:50%;transform:translateY(-50%)}.m-price-ladder__range{height:.5em;background:color-mix(in srgb,var(--m-text-tertiary) 18%,transparent)}.m-price-ladder__band{height:1.6em;border:1px dashed var(--m-price-ladder-forward);border-radius:.2em;background:repeating-linear-gradient(45deg,color-mix(in srgb,var(--m-price-ladder-forward) 22%,transparent) 0 2px,transparent 2px 6px)}.m-price-ladder__connector{height:4px;border-radius:2px;opacity:.55}.m-price-ladder__connector.is-up{background:var(--m-price-ladder-up)}.m-price-ladder__connector.is-down{background:var(--m-price-ladder-down)}.m-price-ladder__cross{top:calc(50% + 1.2em);height:.45em;border:1.5px solid var(--m-text-tertiary);border-top:0}.m-price-ladder__cross.is-gold{border-color:var(--m-price-ladder-gold)}.m-price-ladder__cross.is-down{border-color:var(--m-price-ladder-down)}.m-price-ladder__cross.is-up{border-color:var(--m-price-ladder-up)}.m-price-ladder__tick{width:calc(1px + var(--_rank, 1) * .5px);height:calc(.5em + var(--_rank, 1) * .35em);margin-left:calc(var(--_rank, 1) * -.25px);background:var(--m-text-secondary);opacity:calc(.35 + var(--_rank, 1) * .16)}.m-price-ladder__tick.is-bound{width:2px;height:1.2em;background:var(--m-text-tertiary);opacity:1}.m-price-ladder__target-tick{height:2.4em;border-left:2px dashed var(--m-price-ladder-forward)}.m-price-ladder__target-tick.is-off-scale{width:.6em;height:.6em;margin-left:-.7em;border:0;border-top:2.5px solid var(--m-price-ladder-forward);border-right:2.5px solid var(--m-price-ladder-forward);transform:translateY(-50%) rotate(45deg)}.m-price-ladder__target-tick.is-off-scale.is-left{margin-left:.1em;transform:translateY(-50%) rotate(-135deg)}.m-price-ladder__current{position:absolute;inset:0 auto 0 var(--_x)}.m-price-ladder__current:after{content:\"\";position:absolute;top:50%;width:.9em;height:.9em;border:2px solid var(--m-background);border-radius:50%;background:var(--m-text);transform:translate(-50%,-50%)}.m-price-ladder__current-value{position:absolute;top:-.1em;font-size:.85em;font-weight:650;white-space:nowrap;transform:translate(-50%)}.m-price-ladder__labels{position:relative;height:calc(var(--_lanes, 1) * 3.4em)}.m-price-ladder__label{position:absolute;top:0;left:clamp(var(--_edge),var(--_x),100% - var(--_edge));display:flex;flex-direction:column;align-items:center;font-size:.75em;line-height:1.3;white-space:nowrap;transform:translate(-50%)}.m-price-ladder__label.is-lane-2{top:4.4em}.m-price-ladder__label.is-bound{color:var(--m-text-tertiary)}.m-price-ladder__label-name{color:var(--m-text-secondary)}.m-price-ladder__label-value{color:var(--m-text)}.m-price-ladder__label-gap{color:var(--m-text-tertiary)}.m-price-ladder__list{display:grid}.m-price-ladder__row{display:grid;grid-template-columns:minmax(0,1.2fr) auto 4.5em minmax(3em,1fr);gap:.6em;align-items:center;padding:.45em .1em;border-bottom:1px solid var(--m-border);font-size:.9em}.m-price-ladder__row:last-child{border-bottom:0}.m-price-ladder__row.is-current{font-weight:650}.m-price-ladder__row.is-target{color:var(--m-price-ladder-forward);font-style:italic}.m-price-ladder__row.is-bound{color:var(--m-text-tertiary)}.m-price-ladder__row-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.m-price-ladder__row-value{text-align:end}.m-price-ladder__row-gap{text-align:end;color:var(--m-text-tertiary)}.m-price-ladder__row-track{position:relative;height:.6em}.m-price-ladder__row-track:before{content:\"\";position:absolute;inset:50% 0 auto;height:1px;background:var(--m-border)}.m-price-ladder__row-dot{position:absolute;top:50%;width:.4em;height:.4em;border-radius:50%;background:currentColor;transform:translate(-50%,-50%)}.m-price-ladder__empty{padding:1em;color:var(--m-text-tertiary);font-size:1.25em;text-align:center}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: PriceLadderComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "m-price-ladder",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<div class=\"m-price-ladder\" role=\"img\" [attr.aria-label]=\"summary()\">\n  @if (chips().length) {\n    <div class=\"m-price-ladder__signals\">\n      @for (s of chips(); track s.key) {\n        <span\n          [class]=\"'m-price-ladder__signal is-' + s.tone\"\n          [attr.title]=\"s.detail || null\"\n          >{{ s.label }}</span\n        >\n      }\n    </div>\n  }\n\n  @if (current(); as value) {\n    @if (shownAs() === 'line') {\n      @if (line(); as l) {\n        <div class=\"m-price-ladder__line\" [style.--_lanes]=\"l.lanes\">\n          @if (forward(); as f) {\n            @if (l.target; as t) {\n              <div\n                class=\"m-price-ladder__target\"\n                [class.is-off-scale]=\"t.offScale\"\n                [class.is-up]=\"f.up\"\n                [class.is-down]=\"!f.up\"\n                [style.--_x.%]=\"t.pos\"\n              >\n                <span class=\"m-price-ladder__target-name\">{{ f.name }}</span>\n                <span class=\"m-price-ladder__target-value\">{{ f.valueText }}</span>\n              </div>\n            }\n          }\n\n          <div class=\"m-price-ladder__axis\">\n            @if (l.bounds; as b) {\n              <span class=\"m-price-ladder__range\" [style.left.%]=\"b.left\" [style.width.%]=\"b.width\"></span>\n            }\n            @if (l.band; as b) {\n              <span class=\"m-price-ladder__band\" [style.left.%]=\"b.left\" [style.width.%]=\"b.width\"></span>\n            }\n            @if (l.connector; as c) {\n              <span\n                class=\"m-price-ladder__connector\"\n                [class.is-up]=\"forward()?.up\"\n                [class.is-down]=\"!forward()?.up\"\n                [style.left.%]=\"c.left\"\n                [style.width.%]=\"c.width\"\n              ></span>\n            }\n            @if (l.cross; as c) {\n              <span\n                [class]=\"'m-price-ladder__cross is-' + c.tone\"\n                [style.left.%]=\"c.left\"\n                [style.width.%]=\"c.width\"\n              ></span>\n            }\n            @for (tick of l.ticks; track tick.key) {\n              <span\n                class=\"m-price-ladder__tick\"\n                [class.is-bound]=\"tick.kind === 'bound'\"\n                [style.--_rank]=\"tick.rank\"\n                [style.left.%]=\"tick.pos\"\n              ></span>\n            }\n            @if (l.target; as t) {\n              @if (t.point) {\n                <span\n                  class=\"m-price-ladder__target-tick\"\n                  [class.is-off-scale]=\"t.offScale\"\n                  [class.is-left]=\"t.pos === 0\"\n                  [style.left.%]=\"t.pos\"\n                ></span>\n              }\n            }\n            <span class=\"m-price-ladder__current\" [style.--_x.%]=\"l.valuePos\">\n              <span class=\"m-price-ladder__current-value\">{{ money(value) }}</span>\n            </span>\n          </div>\n\n          <div class=\"m-price-ladder__labels\">\n            @for (label of l.labels; track label.key) {\n              <span\n                class=\"m-price-ladder__label\"\n                [class.is-bound]=\"label.bound\"\n                [class.is-lane-2]=\"label.lane === 1\"\n                [style.--_x.%]=\"label.pos\"\n              >\n                <span class=\"m-price-ladder__label-name\">{{ label.name }}</span>\n                <span class=\"m-price-ladder__label-value\">{{ label.valueText }}</span>\n                @if (label.gapText) {\n                  <span class=\"m-price-ladder__label-gap\">{{ label.gapText }}</span>\n                }\n              </span>\n            }\n          </div>\n        </div>\n      }\n    } @else {\n      <div class=\"m-price-ladder__list\">\n        @for (row of rows(); track row.key) {\n          <div [class]=\"'m-price-ladder__row is-' + row.kind\">\n            <span class=\"m-price-ladder__row-name\">{{ row.name }}</span>\n            <span class=\"m-price-ladder__row-value\">{{ row.valueText }}</span>\n            <span class=\"m-price-ladder__row-gap\" [class.is-up]=\"row.up\" [class.is-down]=\"!row.up\">{{\n              row.gapText\n            }}</span>\n            <span class=\"m-price-ladder__row-track\">\n              <span class=\"m-price-ladder__row-dot\" [style.left.%]=\"row.pos\"></span>\n            </span>\n          </div>\n        }\n      </div>\n    }\n  } @else {\n    <div class=\"m-price-ladder__empty\">—</div>\n  }\n</div>\n",
+			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;--m-price-ladder-forward: var(--m-mm);--m-price-ladder-up: var(--m-success);--m-price-ladder-down: var(--m-error);--m-price-ladder-warn: var(--m-warning);--m-price-ladder-gold: var(--m-gold)}.m-price-ladder{display:flex;flex-direction:column;gap:.75em;font-variant-numeric:tabular-nums}.m-price-ladder__signals{display:flex;flex-wrap:wrap;gap:.4em}.m-price-ladder__signal{display:inline-flex;align-items:center;gap:.4em;padding:.15em .65em .15em .5em;border:1px solid var(--m-border);border-radius:999px;font-size:.8em;font-weight:500}.m-price-ladder__signal:before{content:\"\";width:.55em;height:.55em;border-radius:50%;background:var(--_tone, var(--m-text-tertiary))}.m-price-ladder__signal.is-up{--_tone: var(--m-price-ladder-up)}.m-price-ladder__signal.is-down{--_tone: var(--m-price-ladder-down)}.m-price-ladder__signal.is-warn{--_tone: var(--m-price-ladder-warn)}.m-price-ladder__signal.is-gold{--_tone: var(--m-price-ladder-gold);border-color:var(--m-price-ladder-gold)}.m-price-ladder__line{display:grid;--_edge: 3em}.m-price-ladder__target{position:relative;left:clamp(var(--_edge),var(--_x),100% - var(--_edge));display:flex;flex-direction:column;align-items:center;width:max-content;max-width:50%;transform:translate(-50%);font-size:.8em}.m-price-ladder__target.is-up{--_dir: var(--m-price-ladder-up)}.m-price-ladder__target.is-down{--_dir: var(--m-price-ladder-down)}.m-price-ladder__target-name{color:var(--m-price-ladder-forward);font-style:italic}.m-price-ladder__target-value{color:var(--m-text);font-weight:600}.m-price-ladder__axis{position:relative;height:3.6em}.m-price-ladder__axis:before{content:\"\";position:absolute;inset:50% 0 auto;height:2px;background:var(--m-border);transform:translateY(-50%)}.m-price-ladder__range,.m-price-ladder__band,.m-price-ladder__connector,.m-price-ladder__tick,.m-price-ladder__target-tick,.m-price-ladder__cross{position:absolute;top:50%;transform:translateY(-50%)}.m-price-ladder__range{height:.5em;background:color-mix(in srgb,var(--m-text-tertiary) 18%,transparent)}.m-price-ladder__band{height:1.6em;border:1px dashed var(--m-price-ladder-forward);border-radius:.2em;background:repeating-linear-gradient(45deg,color-mix(in srgb,var(--m-price-ladder-forward) 22%,transparent) 0 2px,transparent 2px 6px)}.m-price-ladder__connector{height:4px;border-radius:2px;opacity:.55}.m-price-ladder__connector.is-up{background:var(--m-price-ladder-up)}.m-price-ladder__connector.is-down{background:var(--m-price-ladder-down)}.m-price-ladder__cross{top:calc(50% + 1.2em);height:.45em;border:1.5px solid var(--m-text-tertiary);border-top:0}.m-price-ladder__cross.is-gold{border-color:var(--m-price-ladder-gold)}.m-price-ladder__cross.is-down{border-color:var(--m-price-ladder-down)}.m-price-ladder__cross.is-up{border-color:var(--m-price-ladder-up)}.m-price-ladder__tick{width:calc(1px + var(--_rank, 1) * .5px);height:calc(.5em + var(--_rank, 1) * .35em);margin-left:calc(var(--_rank, 1) * -.25px);background:var(--m-text-secondary);opacity:calc(.35 + var(--_rank, 1) * .16)}.m-price-ladder__tick.is-bound{width:2px;height:1.2em;background:var(--m-text-tertiary);opacity:1}.m-price-ladder__target-tick{height:2.4em;border-left:2px dashed var(--m-price-ladder-forward)}.m-price-ladder__target-tick.is-off-scale{width:.6em;height:.6em;margin-left:-.7em;border:0;border-top:2.5px solid var(--m-price-ladder-forward);border-right:2.5px solid var(--m-price-ladder-forward);transform:translateY(-50%) rotate(45deg)}.m-price-ladder__target-tick.is-off-scale.is-left{margin-left:.1em;transform:translateY(-50%) rotate(-135deg)}.m-price-ladder__current{position:absolute;inset:0 auto 0 var(--_x)}.m-price-ladder__current:after{content:\"\";position:absolute;top:50%;width:.9em;height:.9em;border:2px solid var(--m-background);border-radius:50%;background:var(--m-text);transform:translate(-50%,-50%)}.m-price-ladder__current-value{position:absolute;top:-.1em;font-size:.85em;font-weight:650;white-space:nowrap;transform:translate(-50%)}.m-price-ladder__labels{position:relative;height:calc(var(--_lanes, 1) * 3.4em)}.m-price-ladder__label{position:absolute;top:0;left:clamp(var(--_edge),var(--_x),100% - var(--_edge));display:flex;flex-direction:column;align-items:center;font-size:.75em;line-height:1.3;white-space:nowrap;transform:translate(-50%)}.m-price-ladder__label.is-lane-2{top:4.4em}.m-price-ladder__label.is-bound{color:var(--m-text-tertiary)}.m-price-ladder__label-name{color:var(--m-text-secondary)}.m-price-ladder__label-value{color:var(--m-text)}.m-price-ladder__label-gap{color:var(--m-text-tertiary)}.m-price-ladder__list{display:grid}.m-price-ladder__row{display:grid;grid-template-columns:minmax(0,1.2fr) auto 4.5em minmax(3em,1fr);gap:.6em;align-items:center;padding:.45em .1em;border-bottom:1px solid var(--m-border);font-size:.9em}.m-price-ladder__row:last-child{border-bottom:0}.m-price-ladder__row.is-current{font-weight:650}.m-price-ladder__row.is-target{color:var(--m-price-ladder-forward);font-style:italic}.m-price-ladder__row.is-bound{color:var(--m-text-tertiary)}.m-price-ladder__row-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.m-price-ladder__row-value{text-align:end}.m-price-ladder__row-gap{text-align:end;color:var(--m-text-tertiary)}.m-price-ladder__row-track{position:relative;height:.6em}.m-price-ladder__row-track:before{content:\"\";position:absolute;inset:50% 0 auto;height:1px;background:var(--m-border)}.m-price-ladder__row-dot{position:absolute;top:50%;width:.4em;height:.4em;border-radius:50%;background:currentColor;transform:translate(-50%,-50%)}.m-price-ladder__empty{padding:1em;color:var(--m-text-tertiary);font-size:1.25em;text-align:center}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		valueLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "valueLabel",
+				required: false
+			}]
+		}],
+		target: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "target",
+				required: false
+			}]
+		}],
+		targetLow: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "targetLow",
+				required: false
+			}]
+		}],
+		targetHigh: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "targetHigh",
+				required: false
+			}]
+		}],
+		targetLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "targetLabel",
+				required: false
+			}]
+		}],
+		targetNote: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "targetNote",
+				required: false
+			}]
+		}],
+		maxSpanPct: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "maxSpanPct",
+				required: false
+			}]
+		}],
+		variant: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "variant",
+				required: false
+			}]
+		}],
+		symbol: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "symbol",
+				required: false
+			}]
+		}],
+		signals: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "signals",
+				required: false
+			}]
+		}],
+		crossFrom: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "crossFrom",
+				required: false
+			}]
+		}],
+		crossTo: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "crossTo",
+				required: false
+			}]
+		}],
+		crossTone: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "crossTone",
+				required: false
+			}]
+		}],
+		markTags: [{
+			type: i0.ContentChildren,
+			args: [i0.forwardRef(() => PriceLadderMarkComponent), { isSignal: true }]
+		}],
+		signalTags: [{
+			type: i0.ContentChildren,
+			args: [i0.forwardRef(() => PriceLadderSignalComponent), { isSignal: true }]
+		}]
+	}
+});
+const span = (a, b) => ({
+	left: Math.min(a, b),
+	width: Math.abs(b - a)
+});
 const DOCS_FOLDER = "docs";
 const LIBRARY_TIER = "one";
 function docAssetCandidates({ name, lang, defaultLang }) {
@@ -53952,6 +55397,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { ACCESS_DOMAINS, APP_CONTEXT_REF, APP_LINK, APP_LOGO_ICON, APP_LOGO_SOURCE, APP_THEME_COLOR, ASSET_BASE_URL, AUDIENCE_ICONS, AUDIENCE_LEVELS, AccordionBodyDirective, AccordionComponent, AccordionGroupComponent, ActionComponent, AnimatedGraphsComponent, AppAvailability, AppCardComponent, AppIdentityService, AppLogoComponent, AppLogoState, AppRelationType, AppTileComponent, AssetStore, AssetUrlPipe, Assets, AudiencePickerBoxComponent, AudiencePickerComponent, AuthActivityPageComponent, AuthApiService, AuthStore, AutosizeDirective, BadgeComponent, BandingComponent, BaseArrayInputComponent, BaseRootWebComponent, BaseWebComponent, BrowserLocaleService, ButtonComponent, ButtonGroupComponent, CALLING_APP_HEADER, COMPONENT_INPUT_REGISTRY, CardComponent, CardWrapperComponent, CarouselComponent, ChartComponent, ChatBubbleComponent, CheckboxGroupComponent, CheckboxInputComponent, ClearableInputComponent, ClipboardService, ColComponent, ColorPickerInputComponent, CommentItemComponent, CommentsApiService, CommentsComponent, CommentsStore, CompactNumberPipe, ComponentInputComponent, ComponentStepperComponent, ConfigComponent, ConfirmComponent, ContextMenuComponent, CustomIconClass, CustomIconEditComponent, DEFAULT_AUDIENCE, DEFAULT_DENIAL, DEFAULT_DOC_ALIGN, DEFAULT_DOC_DENSITY, DEFAULT_DOC_VARIANT, DEFAULT_FILTER_RANGE_MODE, DEFAULT_FILTER_VARIANT, DEFAULT_NAV_PARAM, DEFAULT_NAV_SEGMENT, DEFAULT_SECTION_CHART_RANGES, DEFAULT_SIZE, DOCK_MIN_PAGE_REMAINDER, DOCS_FOLDER, DOC_ACTION_ICONS, DOC_ALIGNS, DOC_DENSITIES, DOC_EDIT_ACTIONS, DOC_TOOLBAR_GROUPS, DOC_VARIANTS, DashboardCardComponent, DateInputComponent, DatePickerComponent, DeviceService, DocComponent, DocEditorComponent, DomService, Domain, DotGridComponent, DragListDirective, DragListItemDirective, DraggableDirective, DropdownInputComponent, FILTER_GROUP_CONTEXT, FILTER_RANGE_MODES, FILTER_VARIANTS, FLEX_VARIANTS, FOLDER_PICK_LISTENER, FORM_ASSET_FOLDER, FileService, FileUploadDirective, FileUploadInputComponent, FlexComponent, FlexItemComponent, FormGroupComponent, FrameComponent, FreezeService, GRID_BREAKPOINTS, GetNavService, HOST_SESSION, HeaderComponent, HeatSwatchComponent, HighlightDirective, HttpService, HttpSharingClient, ICON_SOURCE, IS_DESIGN_MODE, IS_SIDE_PANEL, IconComponent, ImgComponent, InputType, InstrumentScoreComponent, InterceptorObservables, JumbotronComponent, KeyValueComponent, LAYOUT_ASSET_FOLDER, LOADING_ACTIONS_REF, LOGIN_COMPONENT, LOGIN_STORE, LOGO_GLYPH_MAX_BYTES, LanguageComponent, ListComponent, LogoComponent, LogoGlyphInputComponent, MAG_SOCKET_EVENT, MHeroColorDirective, MHeroComponent, MODAL_REF, MODAL_STORE_REF, MOUNT_STATIC_SEGMENT, MOUNT_TOKEN, MRefDirective, MStepComponent, MURL_PARAM, MURL_SEP, ManifestEnrichmentService, MarginDirective, MenuComponent, ModalDirective, ModalRef, ModalStore, MoneyPipe, MultiRangeInputComponent, MultiselectInputComponent, MurlUrlSerializer, NAV_DEFAULT_MURL, NAV_ID_SEP, NAV_MAIN_BUTTONS, NAV_SEGMENT_RE, NAV_STORE_REF, NAV_WC_COMPONENTS, NAV_WIDGET_MAP, NavComponent, NavDetailsComponent, NavHeaderComponent, NavMenuComponent, NavStore, NavTrailComponent, NothingComponent, NotificationElementComponent, NotificationGroupComponent, NotificationPopupComponent, NotificationService, NotificationStore, NotificationType, NotificationWidgetComponent, ONE_ASSET_BASE_URL, OPTIONS_SOURCE, OVERLAY_WIDGETS, OneApp, OptionsSourceDirective, OverlayBodyComponent, OverlayRef, OverlayService, PLATFORM_BUTTON_NAV_IDS, PLATFORM_EXTENSIBLE_NAV_IDS, PLATFORM_NAV_MAP, PLATFORM_ROOT_CHILDREN, PLUGIN_FALLBACK_LANG, PLUGIN_OUTPUT_EVENT, PLUGIN_SCREENS, PaddingDirective, PaginationComponent, PanelComponent, PercentagePipe, PlaygroundComponent, PluginComponent, PluginInputComponent, PluginOutputComponent, PositionDirective, PwaInstallComponent, RECENT_SEARCH_LIMIT, REMOTE_BOOT_TIMEOUT_MS, REMOTE_PAGE_RELOAD, ROOT_NAV, RadioGroupComponent, RadioInputComponent, RangeInputComponent, RatingInputComponent, ReactiveElementComponent, RemoteComponent, RemoteLoaderService, ResizeElementComponent, RouteContainer, RowComponent, SCORE_TONE_COUNT, SEARCH_ANSWER_KEY, SEARCH_LABEL_KEY, SEARCH_QUERY, SEARCH_RESULTS_EVENT, SECTION_ACCORDION_GROUP, SECTION_CHART_CUSTOM_RANGE, SECTION_CHART_SCALES, SECTION_FORM_CONTEXT, SECTION_TABLE_VARIANTS, SHARED_ICONS, SHARING_CLIENT, SIZE_CONTEXT, SPACING_INWARD, SPLASH_ID, ScoreComponent, ScoreSetComponent, ScoreSetItemComponent, ScrollComponent, ScrollService, SearchPanelComponent, SearchStore, SearchUserPanelComponent, SectionAccordionDirective, SectionAccordionGroupDirective, SectionBackComponent, SectionBadgesComponent, SectionButtonGroupComponent, SectionCardComponent, SectionCarouselComponent, SectionChartComponent, SectionChartSeriesComponent, SectionComponent, SectionFilterComponent, SectionFilterGroupComponent, SectionFilterMenuComponent, SectionFilterPanelComponent, SectionFilterRangePanelComponent, SectionFooterComponent, SectionFormComponent, SectionFormItemComponent, SectionHeaderComponent, SectionHeroComponent, SectionPaginationComponent, SectionSearchComponent, SectionStepperComponent, SectionTableCellComponent, SectionTableComponent, SectionTableRowComponent, SectionTableSortDirection, SectionTableSortPipe, SectionTabsComponent, SectionToggleComponent, SectionToggleItemDirective, SelectableCardInputComponent, SelectorDirective, SettingsSearchBarComponent, SettingsSearchService, ShapeComponent, SharedStoreRegistry, SidePanelDirective, SignColorPipe, Size, SocketStore, SortComponent, StatComponent, StepComponent, StepperComponent, StepsComponent, StorageService, StrokeLinecap, StrokeLinejoin, SummaryComponent, SvgGeneratorComponent, SvgGeneratorService, SvgService, TOTAL_COLUMNS, TRANSLATION_SOURCE, TableComponent, TechnicalMeterComponent, TextInputComponent, TextOutputComponent, TextareaInputComponent, ThemeComponent, ThemeDataService, ThemeService, ThemeStore, TimeAgoPipe, TimelineComponent, ToListPipe, ToggleButtonComponent, ToggleInputComponent, ToggleRadioInputComponent, ToolTipDirective, TooltipComponent, TranslatePipe, TranslateService, TreeGridComponent, URL_SEP, USER_STORE_REF, USER_TAB_MAP, UniverseComponent, UserApiService, UserAvatarComponent, UserComponent, UserNavComponent, UserSettingsComponent, UserStore, WC_BUNDLE, WC_NAVIGATE_EVENT, WC_ROUTE_CHANGED_EVENT, WC_SEARCH_GROUPS, WIN_USER_TAB_HOOK, WIN_USER_TAB_KEY, WatermarkComponent, WcRouterStore, WrapperInputComponent, actionName, activeElementWithin, allowedCodes, anchorNavId, appColorBrand, appLogoShadowColor, appThemeColorFactory, applyColorsToElement, applyDocEdit, assetOptions, baseUnderHost, bootstrapMagApp, bootstrapPwaInstall, browserLocale, buildWcBaseUrl, calculateLuminance, calculateRanks, categoricalTone, cellText, checkDoc, checkFilterCondition, childNavId, claimDenial, classListSignal, coerceSize, cornerEdge, cornerSide, createLoadingState, createMap, createPlatformNavMap, createPluginElement, definePluginScreens, definedWcBundleOf, definedWcTierOf, deriveAvatarGradient, deriveContrastColor, deriveOppositeColor, derivePropertyName, docActionKey, docAssetCandidates, docProblemKey, docRemotePath, emailValidation, enumValue, escapeHtml, evaluate, evaluateBool, existsInMap, exposeScreens, exposedScreensOf, fieldBoolean, fieldNumber, fieldString, filterHoldsList, filterHoldsOneBound, filterHoldsOptions, filterHoldsRange, filterList, filterNumber, filterNumberList, filterOne, filterPanelOf, filterPanelWidth, filterRange, filterTreeGridRows, filterValueList, filterValues, flattenTreeGridRows, formatBadgeCount, fullName, generateClipPath, generateTransform, getClassList, getFromMap, getProperty, getScrollParent, getTierFromPreviewPath, getTreeGridRow, getUniqueId, getValue, hasErrorComputed, heatColor, heatShare, hexToRgb, hslToRgb, initMagmoniumApp, initialNotificationState, initialState, initials, injectAuthenticate, injectDefaultDenial, injectInstallApp, injectParentSize, injectScrollSticky, isBootRedirect, isButtonName, isCancelledComputed, isExtensiblePlatformNavId, isJson, isLightAppColor, isLoadingComputed, isLocalhost, isNavCountConfig, isNavInstanceConfig, isNavMenuConfig, isNavRowsConfig, isNavVisibilityConfig, isPlatformNavId, isPlatformPanelNavId, isReadableOn, isScoreStale, isSize, isTierPreview, isUrlLocalhost, isValidNavId, isValidNavSegment, isWebComponent, linkToId, linkToNav, loadingActions, logoGlyphMaskUrl, mInterceptor, manualValidation, matchFieldValidation, matchMount, maxLengthValidation, maxValidation, mergePlatformNav, mergeUnique, mergeUniqueBy, mergeUniqueWith, minAgeValidation, minLengthValidation, minValidation, miniMarkInlineToHtml, miniMarkToHtml, mountFor, mountPatternProblem, mountPatternText, mountSegmentOf, mountTokenOf, navIdChain, navIdFor, navIdSegment, navIdToRoutePath, navIdToSegments, navParamOf, navTailMatcher, navToId, navVisibilityGuard, nextSectionTableSort, normalizeAppColor, normalizeAssetOptions, notExistsInMap, offsetOfLine, outletPathOf, outletSegmentsOf, paintAppColor, parentNavId, parseAddress, parseColor, parseMountPattern, parsePatternNames, patternValidation, patternsValidation, permissionRefusal, pickCount, pickSupportedLanguage, picksMembers, platformNavWidgets, pluginTag, presetDefaultOption, privateGuard, processImageToSvg, provideAppContext, provideMagAppConfig, provideMagWcConfig, provideMagWcRoutes, provideModalComponents, provideMurlUrlSerializer, provideNavWidgets, provideOverlayWidgets, providePlatformNavWidgets, providePluginRuntime, provideSearch, provideSizeContext, provideUserTabs, publicGuard, readChartPoints, readFieldPatterns, readableAppColor, rebuildLogoGlyph, recordDefinedWcTier, registerSessionRenewal, remoteOutletRoute, renderAddress, renderDocument, requiredValidation, resolveConfigAsset, resolveIconSize, resolvePallet, resolvePatternRules, resolveSize, resolveSpacing, rgbToHex, rgbToHsl, rowHasChildren, samePatterns, scoreBand, scoreStanding, sectionTableColumnId, sectionTableColumnWidths, sectionTableFrozenCount, segmentsToNavId, setProperty, setTreeGridChildren, setWcLocalPort, setWcTier, settingsWidgets, shouldShowBadge, sortSectionTableRows, splashHtml, splitNavId, splitOnMatch, splitPath, stringToColor, tailRouteOf, toAttrBool, toAttrNumber, toCssLength, toHostNavId, toLength, toLocalNavId, toggleGroup, toggleTreeGridRow, toggleUid, unfetchedPlatformNav, ungroupedDocActions, urlValidation, wcLocalBaseOf, wcTierOf, withLevel };
+export { ACCESS_DOMAINS, APP_CONTEXT_REF, APP_LINK, APP_LOGO_ICON, APP_LOGO_SOURCE, APP_THEME_COLOR, ASSET_BASE_URL, AUDIENCE_ICONS, AUDIENCE_LEVELS, AccordionBodyDirective, AccordionComponent, AccordionGroupComponent, ActionComponent, AnimatedGraphsComponent, AppAvailability, AppCardComponent, AppIdentityService, AppLogoComponent, AppLogoState, AppRelationType, AppTileComponent, AssetStore, AssetUrlPipe, Assets, AudiencePickerBoxComponent, AudiencePickerComponent, AuthActivityPageComponent, AuthApiService, AuthStore, AutosizeDirective, BadgeComponent, BandingComponent, BaseArrayInputComponent, BaseRootWebComponent, BaseWebComponent, BrowserLocaleService, ButtonComponent, ButtonGroupComponent, CALLING_APP_HEADER, COMPONENT_INPUT_REGISTRY, CardComponent, CardWrapperComponent, CarouselComponent, ChartComponent, ChatBubbleComponent, CheckboxGroupComponent, CheckboxInputComponent, ClearableInputComponent, ClipboardService, ColComponent, ColorPickerInputComponent, CommentItemComponent, CommentsApiService, CommentsComponent, CommentsStore, CompactNumberPipe, ComponentInputComponent, ComponentStepperComponent, ConfigComponent, ConfirmComponent, ContextMenuComponent, CustomIconClass, CustomIconEditComponent, DEFAULT_AUDIENCE, DEFAULT_DENIAL, DEFAULT_DOC_ALIGN, DEFAULT_DOC_DENSITY, DEFAULT_DOC_VARIANT, DEFAULT_FILTER_RANGE_MODE, DEFAULT_FILTER_VARIANT, DEFAULT_NAV_PARAM, DEFAULT_NAV_SEGMENT, DEFAULT_SECTION_CHART_RANGES, DEFAULT_SIZE, DOCK_MIN_PAGE_REMAINDER, DOCS_FOLDER, DOC_ACTION_ICONS, DOC_ALIGNS, DOC_DENSITIES, DOC_EDIT_ACTIONS, DOC_TOOLBAR_GROUPS, DOC_VARIANTS, DashboardCardComponent, DateInputComponent, DatePickerComponent, DeviceService, DocComponent, DocEditorComponent, DomService, Domain, DotGridComponent, DragListDirective, DragListItemDirective, DraggableDirective, DropdownInputComponent, FILTER_GROUP_CONTEXT, FILTER_RANGE_MODES, FILTER_VARIANTS, FLEX_VARIANTS, FOLDER_PICK_LISTENER, FORM_ASSET_FOLDER, FileService, FileUploadDirective, FileUploadInputComponent, FlexComponent, FlexItemComponent, FormGroupComponent, FrameComponent, FreezeService, GRID_BREAKPOINTS, GetNavService, HOST_SESSION, HeaderComponent, HeatSwatchComponent, HighlightDirective, HttpService, HttpSharingClient, ICON_SOURCE, IS_DESIGN_MODE, IS_SIDE_PANEL, IconComponent, ImgComponent, InputType, InstrumentScoreComponent, InterceptorObservables, JumbotronComponent, KeyValueComponent, LAYOUT_ASSET_FOLDER, LOADING_ACTIONS_REF, LOGIN_COMPONENT, LOGIN_STORE, LOGO_GLYPH_MAX_BYTES, LanguageComponent, ListComponent, LogoComponent, LogoGlyphInputComponent, MAG_SOCKET_EVENT, MHeroColorDirective, MHeroComponent, MODAL_REF, MODAL_STORE_REF, MOUNT_STATIC_SEGMENT, MOUNT_TOKEN, MRefDirective, MStepComponent, MURL_PARAM, MURL_SEP, ManifestEnrichmentService, MarginDirective, MenuComponent, ModalDirective, ModalRef, ModalStore, MoneyPipe, MultiRangeInputComponent, MultiselectInputComponent, MurlUrlSerializer, NAV_DEFAULT_MURL, NAV_ID_SEP, NAV_MAIN_BUTTONS, NAV_SEGMENT_RE, NAV_STORE_REF, NAV_WC_COMPONENTS, NAV_WIDGET_MAP, NavComponent, NavDetailsComponent, NavHeaderComponent, NavMenuComponent, NavStore, NavTrailComponent, NothingComponent, NotificationElementComponent, NotificationGroupComponent, NotificationPopupComponent, NotificationService, NotificationStore, NotificationType, NotificationWidgetComponent, ONE_ASSET_BASE_URL, OPTIONS_SOURCE, OVERLAY_WIDGETS, OneApp, OptionsSourceDirective, OverlayBodyComponent, OverlayRef, OverlayService, PLATFORM_BUTTON_NAV_IDS, PLATFORM_EXTENSIBLE_NAV_IDS, PLATFORM_NAV_MAP, PLATFORM_ROOT_CHILDREN, PLUGIN_FALLBACK_LANG, PLUGIN_OUTPUT_EVENT, PLUGIN_SCREENS, PRICE_LADDER_LEVELS, PRICE_LADDER_RULES, PaddingDirective, PaginationComponent, PanelComponent, PercentagePipe, PlaygroundComponent, PluginComponent, PluginInputComponent, PluginOutputComponent, PositionDirective, PriceLadderComponent, PriceLadderMarkComponent, PriceLadderSignalComponent, PwaInstallComponent, RECENT_SEARCH_LIMIT, REMOTE_BOOT_TIMEOUT_MS, REMOTE_PAGE_RELOAD, ROOT_NAV, RadioGroupComponent, RadioInputComponent, RangeInputComponent, RatingInputComponent, ReactiveElementComponent, RemoteComponent, RemoteLoaderService, ResizeElementComponent, RouteContainer, RowComponent, SCORE_TONE_COUNT, SEARCH_ANSWER_KEY, SEARCH_LABEL_KEY, SEARCH_QUERY, SEARCH_RESULTS_EVENT, SECTION_ACCORDION_GROUP, SECTION_CHART_CUSTOM_RANGE, SECTION_CHART_SCALES, SECTION_FORM_CONTEXT, SECTION_TABLE_VARIANTS, SHARED_ICONS, SHARING_CLIENT, SIZE_CONTEXT, SPACING_INWARD, SPLASH_ID, ScoreComponent, ScoreSetComponent, ScoreSetItemComponent, ScrollComponent, ScrollService, SearchPanelComponent, SearchStore, SearchUserPanelComponent, SectionAccordionDirective, SectionAccordionGroupDirective, SectionBackComponent, SectionBadgesComponent, SectionButtonGroupComponent, SectionCardComponent, SectionCarouselComponent, SectionChartComponent, SectionChartSeriesComponent, SectionComponent, SectionFilterComponent, SectionFilterGroupComponent, SectionFilterMenuComponent, SectionFilterPanelComponent, SectionFilterRangePanelComponent, SectionFooterComponent, SectionFormComponent, SectionFormItemComponent, SectionHeaderComponent, SectionHeroComponent, SectionPaginationComponent, SectionSearchComponent, SectionStepperComponent, SectionTableCellComponent, SectionTableComponent, SectionTableRowComponent, SectionTableSortDirection, SectionTableSortPipe, SectionTabsComponent, SectionToggleComponent, SectionToggleItemDirective, SelectableCardInputComponent, SelectorDirective, SettingsSearchBarComponent, SettingsSearchService, ShapeComponent, SharedStoreRegistry, SidePanelDirective, SignColorPipe, Size, SocketStore, SortComponent, StatComponent, StepComponent, StepperComponent, StepsComponent, StorageService, StrokeLinecap, StrokeLinejoin, SummaryComponent, SvgGeneratorComponent, SvgGeneratorService, SvgService, TOTAL_COLUMNS, TRANSLATION_SOURCE, TableComponent, TechnicalMeterComponent, TextInputComponent, TextOutputComponent, TextareaInputComponent, ThemeComponent, ThemeDataService, ThemeService, ThemeStore, TimeAgoPipe, TimelineComponent, ToListPipe, ToggleButtonComponent, ToggleInputComponent, ToggleRadioInputComponent, ToolTipDirective, TooltipComponent, TranslatePipe, TranslateService, TreeGridComponent, URL_SEP, USER_STORE_REF, USER_TAB_MAP, UniverseComponent, UserApiService, UserAvatarComponent, UserComponent, UserNavComponent, UserSettingsComponent, UserStore, WC_BUNDLE, WC_NAVIGATE_EVENT, WC_ROUTE_CHANGED_EVENT, WC_SEARCH_GROUPS, WIN_USER_TAB_HOOK, WIN_USER_TAB_KEY, WatermarkComponent, WcRouterStore, WrapperInputComponent, actionName, activeElementWithin, allowedCodes, anchorNavId, appColorBrand, appLogoShadowColor, appThemeColorFactory, applyColorsToElement, applyDocEdit, assetOptions, baseUnderHost, bootstrapMagApp, bootstrapPwaInstall, browserLocale, buildWcBaseUrl, calculateLuminance, calculateRanks, categoricalTone, cellText, checkDoc, checkFilterCondition, childNavId, claimDenial, classListSignal, coerceSize, cornerEdge, cornerSide, createLoadingState, createMap, createPlatformNavMap, createPluginElement, definePluginScreens, definedWcBundleOf, definedWcTierOf, deriveAvatarGradient, deriveContrastColor, deriveOppositeColor, derivePropertyName, docActionKey, docAssetCandidates, docProblemKey, docRemotePath, emailValidation, enumValue, escapeHtml, evaluate, evaluateBool, existsInMap, exposeScreens, exposedScreensOf, fieldBoolean, fieldNumber, fieldString, filterHoldsList, filterHoldsOneBound, filterHoldsOptions, filterHoldsRange, filterList, filterNumber, filterNumberList, filterOne, filterPanelOf, filterPanelWidth, filterRange, filterTreeGridRows, filterValueList, filterValues, flattenTreeGridRows, formatBadgeCount, formatGap, fullName, gapPct, generateClipPath, generateTransform, getClassList, getFromMap, getProperty, getScrollParent, getTierFromPreviewPath, getTreeGridRow, getUniqueId, getValue, hasErrorComputed, heatColor, heatShare, hexToRgb, hslToRgb, initMagmoniumApp, initialNotificationState, initialState, initials, injectAuthenticate, injectDefaultDenial, injectInstallApp, injectParentSize, injectScrollSticky, isBootRedirect, isButtonName, isCancelledComputed, isExtensiblePlatformNavId, isJson, isLadderRule, isLightAppColor, isLoadingComputed, isLocalhost, isNavCountConfig, isNavInstanceConfig, isNavMenuConfig, isNavRowsConfig, isNavVisibilityConfig, isPlatformNavId, isPlatformPanelNavId, isReadableOn, isScoreStale, isSize, isTierPreview, isUrlLocalhost, isValidNavId, isValidNavSegment, isWebComponent, ladderLevelOf, ladderScale, ladderSignals, layoutLanes, linkToId, linkToNav, loadingActions, logoGlyphMaskUrl, mInterceptor, manualValidation, matchFieldValidation, matchMount, maxLengthValidation, maxValidation, mergePlatformNav, mergeUnique, mergeUniqueBy, mergeUniqueWith, minAgeValidation, minLengthValidation, minValidation, miniMarkInlineToHtml, miniMarkToHtml, mountFor, mountPatternProblem, mountPatternText, mountSegmentOf, mountTokenOf, navIdChain, navIdFor, navIdSegment, navIdToRoutePath, navIdToSegments, navParamOf, navTailMatcher, navToId, navVisibilityGuard, nextSectionTableSort, normalizeAppColor, normalizeAssetOptions, notExistsInMap, offsetOfLine, outletPathOf, outletSegmentsOf, paintAppColor, parentNavId, parseAddress, parseColor, parseMountPattern, parsePatternNames, patternValidation, patternsValidation, permissionRefusal, pickCount, pickSupportedLanguage, picksMembers, platformNavWidgets, pluginTag, presetDefaultOption, privateGuard, processImageToSvg, provideAppContext, provideMagAppConfig, provideMagWcConfig, provideMagWcRoutes, provideModalComponents, provideMurlUrlSerializer, provideNavWidgets, provideOverlayWidgets, providePlatformNavWidgets, providePluginRuntime, provideSearch, provideSizeContext, provideUserTabs, publicGuard, readChartPoints, readFieldPatterns, readableAppColor, rebuildLogoGlyph, recordDefinedWcTier, registerSessionRenewal, remoteOutletRoute, renderAddress, renderDocument, requiredValidation, resolveConfigAsset, resolveIconSize, resolvePallet, resolvePatternRules, resolveSize, resolveSpacing, rgbToHex, rgbToHsl, rowHasChildren, samePatterns, scoreBand, scoreStanding, sectionTableColumnId, sectionTableColumnWidths, sectionTableFrozenCount, segmentsToNavId, setProperty, setTreeGridChildren, setWcLocalPort, setWcTier, settingsWidgets, shouldShowBadge, sortSectionTableRows, splashHtml, splitNavId, splitOnMatch, splitPath, stringToColor, tailRouteOf, toAttrBool, toAttrNumber, toCssLength, toHostNavId, toLength, toLocalNavId, toggleGroup, toggleTreeGridRow, toggleUid, unfetchedPlatformNav, ungroupedDocActions, urlValidation, wcLocalBaseOf, wcTierOf, withLevel };
 
 //# sourceMappingURL=magmonium-one.mjs.map