@ojiepermana/angular 22.1.14 → 22.2.1

package/fesm2022/ojiepermana-angular-chart-core.mjs

@@ -1,706 +1,588 @@
-import * as i0 from '@angular/core';
-import { signal, computed, Service, inject, effect, ElementRef, Renderer2, Component, NgZone, PLATFORM_ID, DestroyRef, viewChild, input, afterNextRender, Directive } from '@angular/core';
-import { isPlatformBrowser, DOCUMENT } from '@angular/common';
-import { scalePoint, scaleLinear, scaleBand } from 'd3-scale';
-import { min, max } from 'd3-array';
-import { curveLinear, curveStep, curveMonotoneX, line, area, stack, stackOffsetExpand } from 'd3-shape';
-
-/** CSS selector under which a chart instance is scoped. */
-const CHART_DATA_ATTRIBUTE = 'data-chart';
-/** Default color schemes supported by the generated `<style>` block. */
-const CHART_THEMES = [
-    { key: 'light', selector: '' },
-    { key: 'dark', selector: '[data-mode="dark"]' },
-];
-/**
- * Characters and sequences that could close the current declaration or rule and
- * start a new one. A series color is interpolated into a `<style>` block, so any
- * of these turns a color into arbitrary CSS.
- *
- * Control characters (newlines included) need no entry here: they are absent from
- * {@link CSS_COLOR_CHARACTERS}, so the allow-list rejects them on its own.
- */
+import * as i0 from "@angular/core";
+import { Component, DestroyRef, Directive, ElementRef, NgZone, PLATFORM_ID, Renderer2, Service, afterNextRender, computed, effect, inject, input, signal, viewChild } from "@angular/core";
+import { DOCUMENT, isPlatformBrowser } from "@angular/common";
+import { scaleBand, scaleLinear, scalePoint } from "d3-scale";
+import { max, min } from "d3-array";
+import { area, curveLinear, curveMonotoneX, curveStep, line, stack, stackOffsetExpand } from "d3-shape";
+const CHART_DATA_ATTRIBUTE = "data-chart";
+const CHART_THEMES = [{
+	key: "light",
+	selector: ""
+}, {
+	key: "dark",
+	selector: "[data-mode=\"dark\"]"
+}];
 const CSS_CONTEXT_BREAKERS = /[;{}<>@\\"']|\/\*|\*\//;
-/** Characters a CSS color value may legitimately contain. */
 const CSS_COLOR_CHARACTERS = /^[a-zA-Z0-9#%.,+\-_()/ ]+$/;
-/**
- * Color functions a series value may call. Anything else (`url`, `attr`,
- * `image-set`, an unknown function) is rejected: none of them belong in a color
- * and `url()` in particular would let a config make a network request.
- */
-const ALLOWED_COLOR_FUNCTIONS = new Set([
-    'rgb',
-    'rgba',
-    'hsl',
-    'hsla',
-    'hwb',
-    'lab',
-    'lch',
-    'oklab',
-    'oklch',
-    'color',
-    'color-mix',
-    'light-dark',
-    'var',
+const ALLOWED_COLOR_FUNCTIONS = /* @__PURE__ */ new Set([
+	"rgb",
+	"rgba",
+	"hsl",
+	"hsla",
+	"hwb",
+	"lab",
+	"lch",
+	"oklab",
+	"oklch",
+	"color",
+	"color-mix",
+	"light-dark",
+	"var"
 ]);
-/**
- * Whether a value is safe to interpolate into the generated `<style>` block.
- *
- * The check is deliberately layered rather than one clever regular expression:
- *
- *  1. reject anything containing a character that can end a declaration or a
- *     rule, which is what actually stops an injection;
- *  2. restrict the remaining characters to those a color can be built from;
- *  3. require balanced parentheses, so a truncated function cannot swallow the
- *     rest of the block;
- *  4. require every function called to be a color function.
- *
- * Real values keep working: `#2563eb`, `red`, `var(--chart-2)`,
- * `hsl(var(--chart-1))`, `rgb(0 0 0 / 50%)`, `color-mix(in srgb, red, blue)`.
- */
 function isSafeCssColorValue(value) {
-    const trimmed = value.trim();
-    if (!trimmed || trimmed.length > 200)
-        return false;
-    if (CSS_CONTEXT_BREAKERS.test(trimmed))
-        return false;
-    if (!CSS_COLOR_CHARACTERS.test(trimmed))
-        return false;
-    let depth = 0;
-    for (const character of trimmed) {
-        if (character === '(')
-            depth += 1;
-        else if (character === ')') {
-            depth -= 1;
-            if (depth < 0)
-                return false;
-        }
-    }
-    if (depth !== 0)
-        return false;
-    for (const match of trimmed.matchAll(/([a-zA-Z][a-zA-Z0-9-]*)\s*\(/g)) {
-        if (!ALLOWED_COLOR_FUNCTIONS.has(match[1].toLowerCase()))
-            return false;
-    }
-    return true;
+	const trimmed = value.trim();
+	if (!trimmed || trimmed.length > 200) return false;
+	if (CSS_CONTEXT_BREAKERS.test(trimmed)) return false;
+	if (!CSS_COLOR_CHARACTERS.test(trimmed)) return false;
+	let depth = 0;
+	for (const character of trimmed) if (character === "(") depth += 1;
+	else if (character === ")") {
+		depth -= 1;
+		if (depth < 0) return false;
+	}
+	if (depth !== 0) return false;
+	for (const match of trimmed.matchAll(/([a-zA-Z][a-zA-Z0-9-]*)\s*\(/g)) if (!ALLOWED_COLOR_FUNCTIONS.has(match[1].toLowerCase())) return false;
+	return true;
 }
-/**
- * Generate the CSS rule-set for a chart instance: one `--color-<key>` per
- * series, scoped to the owning `[data-chart]` element, with optional dark
- * variant via `[data-mode="dark"] [data-chart="…"]`.
- *
- * Series without any color are skipped (consumer can fall back to a default), and
- * so is any series whose color fails {@link isSafeCssColorValue}: the value never
- * reaches the stylesheet, and the series falls back to its default exactly as an
- * unset color would. `chartId` is escaped, so it cannot break out of the
- * attribute selector either.
- *
- * @param chartId  Unique chart id (used as attribute value).
- * @param config   Series configuration map.
- */
 function buildChartCss(chartId, config) {
-    const entries = Object.entries(config).filter(([, cfg]) => cfg.color || cfg.theme);
-    if (entries.length === 0) {
-        return '';
-    }
-    const scopeId = escapeCssIdent(chartId);
-    return CHART_THEMES.map(({ key, selector }) => {
-        const vars = entries
-            .map(([seriesKey, cfg]) => {
-            const value = cfg.theme?.[key] ?? cfg.color;
-            if (!value || !isSafeCssColorValue(value)) {
-                return '';
-            }
-            return `  --color-${escapeCssIdent(seriesKey)}: ${value.trim()};`;
-        })
-            .filter(Boolean)
-            .join('\n');
-        if (!vars) {
-            return '';
-        }
-        const scope = selector
-            ? `${selector} [${CHART_DATA_ATTRIBUTE}="${scopeId}"]`
-            : `[${CHART_DATA_ATTRIBUTE}="${scopeId}"]`;
-        return `${scope} {\n${vars}\n}`;
-    })
-        .filter(Boolean)
-        .join('\n');
+	const entries = Object.entries(config).filter(([, cfg]) => cfg.color || cfg.theme);
+	if (entries.length === 0) return "";
+	const scopeId = escapeCssIdent(chartId);
+	return CHART_THEMES.map(({ key, selector }) => {
+		const vars = entries.map(([seriesKey, cfg]) => {
+			const value = cfg.theme?.[key] ?? cfg.color;
+			if (!value || !isSafeCssColorValue(value)) return "";
+			return `  --color-${escapeCssIdent(seriesKey)}: ${value.trim()};`;
+		}).filter(Boolean).join("\n");
+		if (!vars) return "";
+		return `${selector ? `${selector} [${CHART_DATA_ATTRIBUTE}="${scopeId}"]` : `[${CHART_DATA_ATTRIBUTE}="${scopeId}"]`} {\n${vars}\n}`;
+	}).filter(Boolean).join("\n");
 }
-/** What a CSS custom-property identifier and an attribute selector value may hold. */
 const CSS_IDENT_CHARACTERS = /^[a-zA-Z0-9_-]*$/;
-/**
- * The suffix {@link escapeCssIdent} appends. A key that already ends this way is
- * fingerprinted too, so a key that passes through untouched can never land on
- * the identifier some other key was escaped into.
- */
 const CSS_IDENT_FINGERPRINTED = /_h[0-9a-f]{8}$/;
-/**
- * Escape a string so it is safe to use as a CSS custom-property identifier or as
- * an attribute selector value. The result only ever holds `[A-Za-z0-9_-]`.
- *
- * A string that is ALREADY an identifier passes through untouched, which is
- * every real series key: `sales` stays `--color-sales`.
- *
- * Anything else has its unsafe characters replaced with `_` AND gains a short
- * fingerprint of the ORIGINAL string, because the replacement alone is not
- * injective. `'a b'` and `'a_b'` both collapse to `a_b`, and two series sharing
- * one custom property is silent data loss: {@link buildChartCss} emits both
- * declarations into the same rule so the last one wins, and
- * {@link seriesColorVar} then resolves both series to that one token.
- */
 function escapeCssIdent(input) {
-    if (CSS_IDENT_CHARACTERS.test(input) && !CSS_IDENT_FINGERPRINTED.test(input)) {
-        return input;
-    }
-    return `${input.replace(/[^a-zA-Z0-9_-]/g, '_')}_h${fingerprint(input)}`;
+	if (CSS_IDENT_CHARACTERS.test(input) && !CSS_IDENT_FINGERPRINTED.test(input)) return input;
+	return `${input.replace(/[^a-zA-Z0-9_-]/g, "_")}_h${fingerprint(input)}`;
 }
-/**
- * FNV-1a, 32 bits, hex. A short stable fingerprint used only to keep two escaped
- * keys apart — not a security hash, and never parsed back.
- */
 function fingerprint(input) {
-    let hash = 0x811c9dc5;
-    for (let index = 0; index < input.length; index += 1) {
-        hash ^= input.charCodeAt(index);
-        hash = Math.imul(hash, 0x01000193);
-    }
-    return (hash >>> 0).toString(16).padStart(8, '0');
+	let hash = 2166136261;
+	for (let index = 0; index < input.length; index += 1) {
+		hash ^= input.charCodeAt(index);
+		hash = Math.imul(hash, 16777619);
+	}
+	return (hash >>> 0).toString(16).padStart(8, "0");
 }
-/** Resolve the `var(--color-<key>)` reference for a given series. */
 function seriesColorVar(seriesKey) {
-    return `var(--color-${escapeCssIdent(seriesKey)})`;
+	return `var(--color-${escapeCssIdent(seriesKey)})`;
 }
-/**
- * Resolve a raw per-datum colour to a paint value for an SVG attribute
- * (`[attr.fill]`, `[attr.stroke]`).
- *
- * `raw` is `unknown` so a caller can hand over `datum[colorKey]` directly
- * without its own `typeof` guard.
- *
- * The rule, which is the union of the two copies this replaces:
- *  1. not a string, or empty            -> `fallback`
- *  2. looks like a CSS colour or calls a
- *     function (`var(`, `#`, `rgb`,
- *     `hsl`, or a `(` anywhere)         -> used verbatim
- *  3. anything else is a series key     -> `var(--color-<key>)`
- *
- * Deliberately NOT added: no `.trim()`, and no named-colour detector. Either
- * would move an input that today lands on branch 3, so `'red'` stays a series
- * key rather than becoming the colour red. That is the existing behaviour and
- * changing it is a separate decision.
- */
 function resolveSeriesColor(raw, fallback) {
-    if (typeof raw !== 'string' || raw.length === 0) {
-        return fallback;
-    }
-    if (raw.startsWith('var(') ||
-        raw.startsWith('#') ||
-        raw.startsWith('rgb') ||
-        raw.startsWith('hsl') ||
-        raw.includes('(')) {
-        return raw;
-    }
-    return seriesColorVar(raw);
-}
-
-/**
- * Shared chart state provided by `ChartContainer` to all nested chart
- * components (axes, grid, tooltip, legend, chart types).
- *
- * All state is exposed as signals so consumers can derive computed state
- * (scales, visible series, tooltip position) without manual subscriptions.
- */
-class ChartContext {
-    /** Stable instance id — used in the `data-chart` attribute and CSS scope. */
-    id = signal('', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
-    /** User-provided series config. */
-    config = signal({}, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []));
-    /** Measured render-area dimensions (ResizeObserver-driven). */
-    dimensions = signal({ width: 0, height: 0 }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "dimensions" }] : /* istanbul ignore next */ []));
-    /** Currently highlighted data point (tooltip / crosshair). */
-    activePoint = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "activePoint" }] : /* istanbul ignore next */ []));
-    /** Series keys the user has toggled off via legend. */
-    hiddenSeries = signal(new Set(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hiddenSeries" }] : /* istanbul ignore next */ []));
-    /** Ordered list of series keys (from `config`). */
-    seriesKeys = computed(() => Object.keys(this.config()), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "seriesKeys" }] : /* istanbul ignore next */ []));
-    /** Series keys currently visible (config order minus `hiddenSeries`). */
-    visibleSeriesKeys = computed(() => {
-        const hidden = this.hiddenSeries();
-        return this.seriesKeys().filter((k) => !hidden.has(k));
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "visibleSeriesKeys" }] : /* istanbul ignore next */ []));
-    /** Toggle visibility of a series. */
-    toggleSeries(key) {
-        this.hiddenSeries.update((set) => {
-            const next = new Set(set);
-            if (next.has(key)) {
-                next.delete(key);
-            }
-            else {
-                next.add(key);
-            }
-            return next;
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartContext, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: ChartContext, autoProvided: false });
+	if (typeof raw !== "string" || raw.length === 0) return fallback;
+	if (raw.startsWith("var(") || raw.startsWith("#") || raw.startsWith("rgb") || raw.startsWith("hsl") || raw.includes("(")) return raw;
+	return seriesColorVar(raw);
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartContext, decorators: [{
-            type: Service,
-            args: [{ autoProvided: false }]
-        }] });
-
-/**
- * Given a pointer event's local (x, y) relative to the chart's inner group,
- * resolve the nearest category index along the categorical axis.
- *
- * @returns index into `ctx.categories()` (or −1 if no scale / no data).
- */
+var ChartContext = class ChartContext {
+	id = signal("", ...ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []);
+	config = signal({}, ...ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []);
+	dimensions = signal({
+		width: 0,
+		height: 0
+	}, ...ngDevMode ? [{ debugName: "dimensions" }] : /* istanbul ignore next */ []);
+	activePoint = signal(null, ...ngDevMode ? [{ debugName: "activePoint" }] : /* istanbul ignore next */ []);
+	hiddenSeries = signal(/* @__PURE__ */ new Set(), ...ngDevMode ? [{ debugName: "hiddenSeries" }] : /* istanbul ignore next */ []);
+	seriesKeys = computed(() => Object.keys(this.config()), ...ngDevMode ? [{ debugName: "seriesKeys" }] : /* istanbul ignore next */ []);
+	visibleSeriesKeys = computed(() => {
+		const hidden = this.hiddenSeries();
+		return this.seriesKeys().filter((k) => !hidden.has(k));
+	}, ...ngDevMode ? [{ debugName: "visibleSeriesKeys" }] : /* istanbul ignore next */ []);
+	toggleSeries(key) {
+		this.hiddenSeries.update((set) => {
+			const next = new Set(set);
+			if (next.has(key)) next.delete(key);
+			else next.add(key);
+			return next;
+		});
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartContext,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Service
+	});
+	static ɵprov = i0.ɵɵngDeclareService({
+		minVersion: "22.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartContext,
+		autoProvided: false
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ChartContext,
+	decorators: [{
+		type: Service,
+		args: [{ autoProvided: false }]
+	}]
+});
 function nearestCategoryIndex(ctx, localX, localY) {
-    const scale = ctx.categoryScale();
-    const categories = ctx.categories();
-    if (!scale || categories.length === 0)
-        return -1;
-    const isVertical = ctx.orientation() === 'vertical';
-    const pointerAlong = isVertical ? localX : localY;
-    const bandwidth = scale.bandwidth();
-    // scale.step() is only defined for band scales; fall back to bandwidth.
-    const step = scale.step?.() ?? bandwidth;
-    let bestIndex = -1;
-    let bestDelta = Infinity;
-    for (let i = 0; i < categories.length; i++) {
-        const base = scale(categories[i]) ?? 0;
-        const center = base + bandwidth / 2;
-        const delta = Math.abs(pointerAlong - center);
-        if (delta < bestDelta) {
-            bestDelta = delta;
-            bestIndex = i;
-        }
-    }
-    // Ignore clicks far outside any band (> 1 step away).
-    if (bestDelta > step) {
-        return -1;
-    }
-    return bestIndex;
+	const scale = ctx.categoryScale();
+	const categories = ctx.categories();
+	if (!scale || categories.length === 0) return -1;
+	const pointerAlong = ctx.orientation() === "vertical" ? localX : localY;
+	const bandwidth = scale.bandwidth();
+	const step = scale.step?.() ?? bandwidth;
+	let bestIndex = -1;
+	let bestDelta = Infinity;
+	for (let i = 0; i < categories.length; i++) {
+		const center = (scale(categories[i]) ?? 0) + bandwidth / 2;
+		const delta = Math.abs(pointerAlong - center);
+		if (delta < bestDelta) {
+			bestDelta = delta;
+			bestIndex = i;
+		}
+	}
+	if (bestDelta > step) return -1;
+	return bestIndex;
 }
-/** Resolve the client-space center point of a focused or clicked SVG/HTML element. */
 function elementClientCenter(target) {
-    const el = target;
-    if (!el || typeof el.getBoundingClientRect !== 'function') {
-        return null;
-    }
-    const rect = el.getBoundingClientRect();
-    return {
-        clientX: rect.left + rect.width / 2,
-        clientY: rect.top + rect.height / 2,
-    };
+	const el = target;
+	if (!el || typeof el.getBoundingClientRect !== "function") return null;
+	const rect = el.getBoundingClientRect();
+	return {
+		clientX: rect.left + rect.width / 2,
+		clientY: rect.top + rect.height / 2
+	};
 }
-/**
- * Where the tooltip should sit for whichever gesture activated a mark.
- *
- * A pointer carries a real cursor position, so the tooltip follows it. Keyboard
- * focus carries none, and falls back to the centre of the mark that took focus.
- */
 function activationClientPoint(event) {
-    return event instanceof PointerEvent
-        ? { clientX: event.clientX, clientY: event.clientY }
-        : elementClientCenter(event.currentTarget ?? event.target);
+	return event instanceof PointerEvent ? {
+		clientX: event.clientX,
+		clientY: event.clientY
+	} : elementClientCenter(event.currentTarget ?? event.target);
 }
-
 function clamp(value, min, max) {
-    return Math.min(max, Math.max(min, value));
+	return Math.min(max, Math.max(min, value));
 }
 function normalizeIndexRange(start, end, maxCount) {
-    if (maxCount <= 0) {
-        return null;
-    }
-    const lo = clamp(Math.floor(Math.min(start, end)), 0, maxCount - 1);
-    const hi = clamp(Math.floor(Math.max(start, end)), 0, maxCount - 1);
-    return { startIndex: lo, endIndex: hi };
+	if (maxCount <= 0) return null;
+	return {
+		startIndex: clamp(Math.floor(Math.min(start, end)), 0, maxCount - 1),
+		endIndex: clamp(Math.floor(Math.max(start, end)), 0, maxCount - 1)
+	};
 }
 function effectiveIndexRange(range, maxCount) {
-    if (maxCount <= 0) {
-        return null;
-    }
-    return range
-        ? normalizeIndexRange(range.startIndex, range.endIndex, maxCount)
-        : { startIndex: 0, endIndex: maxCount - 1 };
+	if (maxCount <= 0) return null;
+	return range ? normalizeIndexRange(range.startIndex, range.endIndex, maxCount) : {
+		startIndex: 0,
+		endIndex: maxCount - 1
+	};
 }
 function indexRangeSize(range, maxCount) {
-    const effective = effectiveIndexRange(range, maxCount);
-    return effective ? effective.endIndex - effective.startIndex + 1 : 0;
+	const effective = effectiveIndexRange(range, maxCount);
+	return effective ? effective.endIndex - effective.startIndex + 1 : 0;
 }
 function sliceByIndexRange(data, range) {
-    if (!range) {
-        return data;
-    }
-    return data.slice(range.startIndex, range.endIndex + 1);
+	if (!range) return data;
+	return data.slice(range.startIndex, range.endIndex + 1);
 }
 function zoomIndexRange(current, maxCount, anchorIndex, factor) {
-    const base = effectiveIndexRange(current, maxCount);
-    if (!base) {
-        return null;
-    }
-    const currentSize = base.endIndex - base.startIndex + 1;
-    const nextSize = clamp(Math.round(currentSize * factor), 2, maxCount);
-    if (nextSize >= maxCount) {
-        return null;
-    }
-    const boundedAnchor = clamp(anchorIndex, base.startIndex, base.endIndex);
-    const ratio = currentSize <= 1 ? 0.5 : (boundedAnchor - base.startIndex) / (currentSize - 1);
-    let start = Math.round(boundedAnchor - ratio * (nextSize - 1));
-    start = clamp(start, 0, maxCount - nextSize);
-    return { startIndex: start, endIndex: start + nextSize - 1 };
+	const base = effectiveIndexRange(current, maxCount);
+	if (!base) return null;
+	const currentSize = base.endIndex - base.startIndex + 1;
+	const nextSize = clamp(Math.round(currentSize * factor), 2, maxCount);
+	if (nextSize >= maxCount) return null;
+	const boundedAnchor = clamp(anchorIndex, base.startIndex, base.endIndex);
+	const ratio = currentSize <= 1 ? .5 : (boundedAnchor - base.startIndex) / (currentSize - 1);
+	let start = Math.round(boundedAnchor - ratio * (nextSize - 1));
+	start = clamp(start, 0, maxCount - nextSize);
+	return {
+		startIndex: start,
+		endIndex: start + nextSize - 1
+	};
 }
 function panIndexRange(current, maxCount, deltaSteps) {
-    const base = effectiveIndexRange(current, maxCount);
-    if (!base) {
-        return null;
-    }
-    const size = base.endIndex - base.startIndex + 1;
-    if (size >= maxCount) {
-        return null;
-    }
-    const start = clamp(base.startIndex + deltaSteps, 0, maxCount - size);
-    return { startIndex: start, endIndex: start + size - 1 };
+	const base = effectiveIndexRange(current, maxCount);
+	if (!base) return null;
+	const size = base.endIndex - base.startIndex + 1;
+	if (size >= maxCount) return null;
+	const start = clamp(base.startIndex + deltaSteps, 0, maxCount - size);
+	return {
+		startIndex: start,
+		endIndex: start + size - 1
+	};
 }
-/**
- * The value domain for a chart drawn against a zero baseline.
- *
- * A bar, a line, or an area is read against the origin, so the domain has to
- * reach it in both directions: negative data below, positive above. Clamping
- * one end at zero is what pushed negative marks outside the plot.
- *
- * A dataset that is entirely zero would collapse the domain onto a point, which
- * d3 maps to the middle of the range for every value, so it is opened by one
- * unit instead.
- */
 function zeroBaselineDomain(minValue, maxValue) {
-    const min = Math.min(0, minValue);
-    const max = Math.max(0, maxValue);
-    return min === max ? [min, max + 1] : [min, max];
+	const min = Math.min(0, minValue);
+	const max = Math.max(0, maxValue);
+	return min === max ? [min, max + 1] : [min, max];
 }
 function normalizeNumericDomain(a, b) {
-    if (a === b) {
-        return [a - 1, b + 1];
-    }
-    return a < b ? [a, b] : [b, a];
+	if (a === b) return [a - 1, b + 1];
+	return a < b ? [a, b] : [b, a];
 }
 function zoomNumericDomain(current, full, anchor, factor) {
-    const currentWidth = current[1] - current[0];
-    const fullWidth = full[1] - full[0];
-    const nextWidth = clamp(currentWidth * factor, fullWidth / 50, fullWidth);
-    if (nextWidth >= fullWidth) {
-        return full;
-    }
-    const ratio = currentWidth === 0 ? 0.5 : (anchor - current[0]) / currentWidth;
-    let start = anchor - ratio * nextWidth;
-    start = clamp(start, full[0], full[1] - nextWidth);
-    return [start, start + nextWidth];
+	const currentWidth = current[1] - current[0];
+	const fullWidth = full[1] - full[0];
+	const nextWidth = clamp(currentWidth * factor, fullWidth / 50, fullWidth);
+	if (nextWidth >= fullWidth) return full;
+	let start = anchor - (currentWidth === 0 ? .5 : (anchor - current[0]) / currentWidth) * nextWidth;
+	start = clamp(start, full[0], full[1] - nextWidth);
+	return [start, start + nextWidth];
 }
 function panNumericDomain(current, full, delta) {
-    const width = current[1] - current[0];
-    const start = clamp(current[0] + delta, full[0], full[1] - width);
-    return [start, start + width];
+	const width = current[1] - current[0];
+	const start = clamp(current[0] + delta, full[0], full[1] - width);
+	return [start, start + width];
 }
-
-/**
- * Build the shared cartesian scaffolding.
- *
- * MUST be called in an injection context, so a field initializer or the
- * constructor: it injects `ChartContext` and creates one `effect`.
- */
 function setupCartesianChart(options) {
-    const root = inject(ChartContext);
-    const innerWidth = computed(() => Math.max(0, root.dimensions().width - options.margin().left - options.margin().right), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []));
-    const innerHeight = computed(() => Math.max(0, root.dimensions().height - options.margin().top - options.margin().bottom), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerHeight" }] : /* istanbul ignore next */ []));
-    const viewBox = computed(() => {
-        const { width, height } = root.dimensions();
-        return `0 0 ${Math.max(0, width)} ${Math.max(0, height)}`;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "viewBox" }] : /* istanbul ignore next */ []));
-    const innerTransform = computed(() => `translate(${options.margin().left},${options.margin().top})`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerTransform" }] : /* istanbul ignore next */ []));
-    // The saved zoom range outlives the data it was drawn on. Renormalizing it
-    // against the current row count is what keeps a shrunken dataset from
-    // slicing to nothing and reporting a window that no longer exists.
-    const windowRange = computed(() => options.viewport
-        ? effectiveIndexRange(options.viewport.zoomRange(), options.data().length)
-        : null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "windowRange" }] : /* istanbul ignore next */ []));
-    const visibleStartIndex = computed(() => windowRange()?.startIndex ?? 0, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "visibleStartIndex" }] : /* istanbul ignore next */ []));
-    const visibleData = computed(() => options.viewport ? sliceByIndexRange(options.data(), windowRange()) : options.data(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "visibleData" }] : /* istanbul ignore next */ []));
-    const resolveDatumIndex = (mark) => visibleStartIndex() + mark.datumIndex;
-    const seriesLabel = (seriesKey) => root.config()[seriesKey]?.label ?? seriesKey;
-    // One effect for all of it. Reading every signal here keeps them tracked
-    // together, so a geometry change publishes the layout exactly once.
-    effect(() => {
-        options.viewport?.dataCount.set(options.data().length);
-        const cartesian = options.cartesian;
-        if (cartesian) {
-            cartesian.context.orientation.set(cartesian.orientation());
-            cartesian.context.margin.set(options.margin());
-            cartesian.context.innerWidth.set(innerWidth());
-            cartesian.context.innerHeight.set(innerHeight());
-        }
-        options.publishLayout?.({ width: innerWidth(), height: innerHeight() });
-    });
-    return {
-        innerWidth,
-        innerHeight,
-        viewBox,
-        innerTransform,
-        visibleStartIndex,
-        visibleData,
-        resolveDatumIndex,
-        seriesLabel,
-        pointAriaLabel: (mark) => options.ariaLabel(mark, seriesLabel(mark.seriesKey)),
-        emitClick: (mark) => {
-            const datumIndex = resolveDatumIndex(mark);
-            options.click.emit(options.click.payload(mark, datumIndex, options.data()[datumIndex]));
-        },
-        setActivePoint: (event, mark) => {
-            const center = activationClientPoint(event);
-            root.activePoint.set({
-                // `index` stays visible-local (it addresses the rendered mark) while
-                // `datumIndex` is absolute (it addresses the data row). Both are needed.
-                index: mark.datumIndex,
-                datumIndex: resolveDatumIndex(mark),
-                seriesKey: mark.seriesKey,
-                clientX: center?.clientX,
-                clientY: center?.clientY,
-            });
-        },
-        clearActivePoint: () => root.activePoint.set(null),
-    };
+	const root = inject(ChartContext);
+	const innerWidth = computed(() => Math.max(0, root.dimensions().width - options.margin().left - options.margin().right), ...ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []);
+	const innerHeight = computed(() => Math.max(0, root.dimensions().height - options.margin().top - options.margin().bottom), ...ngDevMode ? [{ debugName: "innerHeight" }] : /* istanbul ignore next */ []);
+	const viewBox = computed(() => {
+		const { width, height } = root.dimensions();
+		return `0 0 ${Math.max(0, width)} ${Math.max(0, height)}`;
+	}, ...ngDevMode ? [{ debugName: "viewBox" }] : /* istanbul ignore next */ []);
+	const innerTransform = computed(() => `translate(${options.margin().left},${options.margin().top})`, ...ngDevMode ? [{ debugName: "innerTransform" }] : /* istanbul ignore next */ []);
+	const windowRange = computed(() => options.viewport ? effectiveIndexRange(options.viewport.zoomRange(), options.data().length) : null, ...ngDevMode ? [{ debugName: "windowRange" }] : /* istanbul ignore next */ []);
+	const visibleStartIndex = computed(() => windowRange()?.startIndex ?? 0, ...ngDevMode ? [{ debugName: "visibleStartIndex" }] : /* istanbul ignore next */ []);
+	const visibleData = computed(() => options.viewport ? sliceByIndexRange(options.data(), windowRange()) : options.data(), ...ngDevMode ? [{ debugName: "visibleData" }] : /* istanbul ignore next */ []);
+	const resolveDatumIndex = (mark) => visibleStartIndex() + mark.datumIndex;
+	const seriesLabel = (seriesKey) => root.config()[seriesKey]?.label ?? seriesKey;
+	effect(() => {
+		options.viewport?.dataCount.set(options.data().length);
+		const cartesian = options.cartesian;
+		if (cartesian) {
+			cartesian.context.orientation.set(cartesian.orientation());
+			cartesian.context.margin.set(options.margin());
+			cartesian.context.innerWidth.set(innerWidth());
+			cartesian.context.innerHeight.set(innerHeight());
+		}
+		options.publishLayout?.({
+			width: innerWidth(),
+			height: innerHeight()
+		});
+	});
+	return {
+		innerWidth,
+		innerHeight,
+		viewBox,
+		innerTransform,
+		visibleStartIndex,
+		visibleData,
+		resolveDatumIndex,
+		seriesLabel,
+		pointAriaLabel: (mark) => options.ariaLabel(mark, seriesLabel(mark.seriesKey)),
+		emitClick: (mark) => {
+			const datumIndex = resolveDatumIndex(mark);
+			options.click.emit(options.click.payload(mark, datumIndex, options.data()[datumIndex]));
+		},
+		setActivePoint: (event, mark) => {
+			const center = activationClientPoint(event);
+			root.activePoint.set({
+				index: mark.datumIndex,
+				datumIndex: resolveDatumIndex(mark),
+				seriesKey: mark.seriesKey,
+				clientX: center?.clientX,
+				clientY: center?.clientY
+			});
+		},
+		clearActivePoint: () => root.activePoint.set(null)
+	};
 }
-
-/**
- * Build the shared polar scaffolding.
- *
- * MUST be called in an injection context, so a field initializer or the
- * constructor: it injects `ChartContext`.
- */
 function setupPolarChart(options) {
-    const root = inject(ChartContext);
-    const innerWidth = computed(() => Math.max(0, root.dimensions().width - options.margin().left - options.margin().right), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []));
-    const innerHeight = computed(() => Math.max(0, root.dimensions().height - options.margin().top - options.margin().bottom), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerHeight" }] : /* istanbul ignore next */ []));
-    const viewBox = computed(() => {
-        const { width, height } = root.dimensions();
-        return `0 0 ${Math.max(0, width)} ${Math.max(0, height)}`;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "viewBox" }] : /* istanbul ignore next */ []));
-    const innerTransform = computed(() => `translate(${options.margin().left},${options.margin().top})`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerTransform" }] : /* istanbul ignore next */ []));
-    return {
-        innerWidth,
-        innerHeight,
-        viewBox,
-        innerTransform,
-        seriesLabel: (seriesKey) => root.config()[seriesKey]?.label ?? seriesKey,
-        setActivePoint: (event, mark) => {
-            const location = activationClientPoint(event);
-            root.activePoint.set({
-                // A polar mark addresses one row, so the rendered index and the data
-                // index are the same number. Both are set because the tooltip and the
-                // crosshair read different ones.
-                index: mark.datumIndex,
-                datumIndex: mark.datumIndex,
-                seriesKey: mark.seriesKey,
-                clientX: location?.clientX,
-                clientY: location?.clientY,
-            });
-        },
-        clearActivePoint: () => root.activePoint.set(null),
-    };
-}
-
-/**
- * Emits a scoped `<style>` block mapping every series key in the current
- * `ChartConfig` to a `--color-<key>` CSS custom property, scoped to
- * `[data-chart="<id>"]`. Dark-mode values are scoped under `[data-mode="dark"]`.
- *
- * Implemented as an empty component that injects a real `<style>` element
- * into its host via `Renderer2`. We avoid rendering `<style>` directly in a
- * template — Angular hoists those into component CSS and strips
- * interpolations from them.
- *
- * Consumers never instantiate this directly — `ChartContainer` renders it.
- */
-class ChartStyle {
-    ctx = inject(ChartContext);
-    host = inject((ElementRef));
-    renderer = inject(Renderer2);
-    styleEl = null;
-    css = computed(() => buildChartCss(this.ctx.id(), this.ctx.config()), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "css" }] : /* istanbul ignore next */ []));
-    constructor() {
-        effect(() => {
-            const css = this.css();
-            if (!this.styleEl) {
-                this.styleEl = this.renderer.createElement('style');
-                this.renderer.appendChild(this.host.nativeElement, this.styleEl);
-            }
-            this.styleEl.textContent = css;
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartStyle, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.6", type: ChartStyle, isStandalone: true, selector: "ChartStyle", ngImport: i0, template: '', isInline: true });
+	const root = inject(ChartContext);
+	return {
+		innerWidth: computed(() => Math.max(0, root.dimensions().width - options.margin().left - options.margin().right), ...ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []),
+		innerHeight: computed(() => Math.max(0, root.dimensions().height - options.margin().top - options.margin().bottom), ...ngDevMode ? [{ debugName: "innerHeight" }] : /* istanbul ignore next */ []),
+		viewBox: computed(() => {
+			const { width, height } = root.dimensions();
+			return `0 0 ${Math.max(0, width)} ${Math.max(0, height)}`;
+		}, ...ngDevMode ? [{ debugName: "viewBox" }] : /* istanbul ignore next */ []),
+		innerTransform: computed(() => `translate(${options.margin().left},${options.margin().top})`, ...ngDevMode ? [{ debugName: "innerTransform" }] : /* istanbul ignore next */ []),
+		seriesLabel: (seriesKey) => root.config()[seriesKey]?.label ?? seriesKey,
+		setActivePoint: (event, mark) => {
+			const location = activationClientPoint(event);
+			root.activePoint.set({
+				index: mark.datumIndex,
+				datumIndex: mark.datumIndex,
+				seriesKey: mark.seriesKey,
+				clientX: location?.clientX,
+				clientY: location?.clientY
+			});
+		},
+		clearActivePoint: () => root.activePoint.set(null)
+	};
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartStyle, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ChartStyle',
-                    template: '',
-                }]
-        }], ctorParameters: () => [] });
-
-/**
- * Resolve the effective chart style from the canonical `styleVariant` input and
- * the deprecated `styles` input.
- *
- * `styleVariant` wins whenever it is bound, which is the only direction that is
- * implementable: `styles` keeps its `'base'` default, so there is no way to tell
- * an explicit `styles="base"` from an unset one. Giving `styleVariant` the
- * `undefined` default leaves the deprecated input's emitted type untouched.
- *
- * The precedence rule lives here alone, so the seven chart families cannot drift
- * from each other. The two `input()` calls themselves have to stay literal in
- * each class body: the compiler discovers signal inputs by looking at the field
- * initializer, and an `input()` hidden behind a helper is never registered.
- */
+var ChartStyle = class ChartStyle {
+	ctx = inject(ChartContext);
+	host = inject(ElementRef);
+	renderer = inject(Renderer2);
+	styleEl = null;
+	css = computed(() => buildChartCss(this.ctx.id(), this.ctx.config()), ...ngDevMode ? [{ debugName: "css" }] : /* istanbul ignore next */ []);
+	constructor() {
+		effect(() => {
+			const css = this.css();
+			if (!this.styleEl) {
+				this.styleEl = this.renderer.createElement("style");
+				this.renderer.appendChild(this.host.nativeElement, this.styleEl);
+			}
+			this.styleEl.textContent = css;
+		});
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartStyle,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "14.0.0",
+		version: "22.2.2",
+		type: ChartStyle,
+		isStandalone: true,
+		selector: "ChartStyle",
+		ngImport: i0,
+		template: "",
+		isInline: true
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ChartStyle,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ChartStyle",
+			template: ""
+		}]
+	}],
+	ctorParameters: () => []
+});
 function resolveChartStyle(styleVariant, styles) {
-    return computed(() => styleVariant() ?? styles());
+	return computed(() => styleVariant() ?? styles());
 }
-
 let chartIdCounter = 0;
-/**
- * Root of every chart. Provides `ChartContext` to descendants, reflects the
- * chart id via `data-chart`, injects the per-instance CSS-variable
- * `<style>` block, and tracks its render-area dimensions via
- * `ResizeObserver`.
- *
- * Usage:
- * ```html
- * <Chart [config]="cfg">
- *   <ChartBar [data]="data" />
- *   <ChartLegend />
- * </Chart>
- * ```
- *
- * The chart render area is laid out on top; any projected `<ChartLegend>` is
- * rendered as a centered row beneath it. Render-area dimensions are measured on
- * the chart area only, so the legend never shrinks the chart.
- */
-class ChartContainer {
-    ctx = inject(ChartContext);
-    zone = inject(NgZone);
-    platformId = inject(PLATFORM_ID);
-    destroyRef = inject(DestroyRef);
-    areaRef = viewChild.required('area', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "areaRef" }] : /* istanbul ignore next */ []));
-    /** Series configuration. Required for color / label resolution. */
-    config = input.required(/* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []));
-    /**
-     * Tailwind aspect-ratio utility for the chart render area. Defaults to
-     * `aspect-video` for cartesian charts; override with `aspect-square` for
-     * radial / pie layouts, or e.g. `aspect-auto h-80` for a fixed height.
-     */
-    aspect = input('aspect-video', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "aspect" }] : /* istanbul ignore next */ []));
-    areaClass = computed(() => `relative flex ${this.aspect()} w-full justify-center`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "areaClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Optional explicit id override. When omitted, a stable auto-id is
-     * generated (`chart-<n>`), unique across the document.
-     */
-    chartId = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "chartId" }] : /* istanbul ignore next */ []));
-    constructor() {
-        const autoId = `chart-${++chartIdCounter}`;
-        // Sync id + config into the shared context.
-        effect(() => {
-            this.ctx.id.set(this.chartId() ?? autoId);
-        });
-        effect(() => {
-            this.ctx.config.set(this.config());
-        });
-        // Observe host size (browser only; client-only is a confirmed constraint).
-        if (isPlatformBrowser(this.platformId)) {
-            afterNextRender(() => this.observeSize());
-        }
-    }
-    observeSize() {
-        const el = this.areaRef().nativeElement;
-        if (typeof ResizeObserver === 'undefined') {
-            const rect = el.getBoundingClientRect();
-            this.ctx.dimensions.set({ width: rect.width, height: rect.height });
-            return;
-        }
-        const observer = new ResizeObserver((entries) => {
-            for (const entry of entries) {
-                const { width, height } = entry.contentRect;
-                // Avoid NgZone churn — dimensions signal drives CD on its own.
-                this.zone.run(() => this.ctx.dimensions.set({ width, height }));
-            }
-        });
-        observer.observe(el);
-        this.destroyRef.onDestroy(() => observer.disconnect());
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartContainer, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.6", type: ChartContainer, isStandalone: true, selector: "Chart", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, aspect: { classPropertyName: "aspect", publicName: "aspect", isSignal: true, isRequired: false, transformFunction: null }, chartId: { classPropertyName: "chartId", publicName: "chartId", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-chart": "ctx.id()" }, classAttribute: "relative flex flex-col text-xs" }, providers: [ChartContext], viewQueries: [{ propertyName: "areaRef", first: true, predicate: ["area"], descendants: true, isSignal: true }], ngImport: i0, template: `
+var ChartContainer = class ChartContainer {
+	ctx = inject(ChartContext);
+	zone = inject(NgZone);
+	platformId = inject(PLATFORM_ID);
+	destroyRef = inject(DestroyRef);
+	areaRef = viewChild.required("area", ...ngDevMode ? [{ debugName: "areaRef" }] : /* istanbul ignore next */ []);
+	config = input.required(...ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []);
+	aspect = input("aspect-video", ...ngDevMode ? [{ debugName: "aspect" }] : /* istanbul ignore next */ []);
+	areaClass = computed(() => `relative flex ${this.aspect()} w-full justify-center`, ...ngDevMode ? [{ debugName: "areaClass" }] : /* istanbul ignore next */ []);
+	chartId = input(null, ...ngDevMode ? [{ debugName: "chartId" }] : /* istanbul ignore next */ []);
+	constructor() {
+		const autoId = `chart-${++chartIdCounter}`;
+		effect(() => {
+			this.ctx.id.set(this.chartId() ?? autoId);
+		});
+		effect(() => {
+			this.ctx.config.set(this.config());
+		});
+		if (isPlatformBrowser(this.platformId)) afterNextRender(() => this.observeSize());
+	}
+	observeSize() {
+		const el = this.areaRef().nativeElement;
+		if (typeof ResizeObserver === "undefined") {
+			const rect = el.getBoundingClientRect();
+			this.ctx.dimensions.set({
+				width: rect.width,
+				height: rect.height
+			});
+			return;
+		}
+		const observer = new ResizeObserver((entries) => {
+			for (const entry of entries) {
+				const { width, height } = entry.contentRect;
+				this.zone.run(() => this.ctx.dimensions.set({
+					width,
+					height
+				}));
+			}
+		});
+		observer.observe(el);
+		this.destroyRef.onDestroy(() => observer.disconnect());
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartContainer,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.2.0",
+		version: "22.2.2",
+		type: ChartContainer,
+		isStandalone: true,
+		selector: "Chart",
+		inputs: {
+			config: {
+				classPropertyName: "config",
+				publicName: "config",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			aspect: {
+				classPropertyName: "aspect",
+				publicName: "aspect",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			chartId: {
+				classPropertyName: "chartId",
+				publicName: "chartId",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			properties: { "attr.data-chart": "ctx.id()" },
+			classAttribute: "relative flex flex-col text-xs"
+		},
+		providers: [ChartContext],
+		viewQueries: [{
+			propertyName: "areaRef",
+			first: true,
+			predicate: ["area"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: `
     <ChartStyle />
     <div #area data-chart-area [class]="areaClass()">
       <ng-content />
     </div>
     <ng-content select="ChartLegend" />
-  `, isInline: true, dependencies: [{ kind: "component", type: ChartStyle, selector: "ChartStyle" }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartContainer, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'Chart',
-                    providers: [ChartContext],
-                    imports: [ChartStyle],
-                    host: {
-                        '[attr.data-chart]': 'ctx.id()',
-                        class: 'relative flex flex-col text-xs',
-                    },
-                    template: `
+  `,
+		isInline: true,
+		dependencies: [{
+			kind: "component",
+			type: ChartStyle,
+			selector: "ChartStyle"
+		}]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ChartContainer,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "Chart",
+			providers: [ChartContext],
+			imports: [ChartStyle],
+			host: {
+				"[attr.data-chart]": "ctx.id()",
+				class: "relative flex flex-col text-xs"
+			},
+			template: `
     <ChartStyle />
     <div #area data-chart-area [class]="areaClass()">
       <ng-content />
     </div>
     <ng-content select="ChartLegend" />
-  `,
-                }]
-        }], ctorParameters: () => [], propDecorators: { areaRef: [{ type: i0.ViewChild, args: ['area', { isSignal: true }] }], config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], aspect: [{ type: i0.Input, args: [{ isSignal: true, alias: "aspect", required: false }] }], chartId: [{ type: i0.Input, args: [{ isSignal: true, alias: "chartId", required: false }] }] } });
-
-/** Screen-reader fallback for charts whose visual SVG is not tabular content. */
-class ChartDataTable {
-    data = input.required(/* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
-    columns = input.required(/* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
-    label = input('Chart data', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    rowHeaderKey = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "rowHeaderKey" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartDataTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: ChartDataTable, isStandalone: true, selector: "ChartDataTable", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, rowHeaderKey: { classPropertyName: "rowHeaderKey", publicName: "rowHeaderKey", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+  `
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		areaRef: [{
+			type: i0.ViewChild,
+			args: ["area", { isSignal: true }]
+		}],
+		config: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "config",
+				required: true
+			}]
+		}],
+		aspect: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "aspect",
+				required: false
+			}]
+		}],
+		chartId: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "chartId",
+				required: false
+			}]
+		}]
+	}
+});
+var ChartDataTable = class ChartDataTable {
+	data = input.required(...ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []);
+	columns = input.required(...ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []);
+	label = input("Chart data", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	rowHeaderKey = input(null, ...ngDevMode ? [{ debugName: "rowHeaderKey" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartDataTable,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.2",
+		type: ChartDataTable,
+		isStandalone: true,
+		selector: "ChartDataTable",
+		inputs: {
+			data: {
+				classPropertyName: "data",
+				publicName: "data",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			columns: {
+				classPropertyName: "columns",
+				publicName: "columns",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			rowHeaderKey: {
+				classPropertyName: "rowHeaderKey",
+				publicName: "rowHeaderKey",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: `
     <table class="sr-only" [attr.aria-label]="label()">
       <thead>
         <tr>
@@ -723,13 +605,20 @@ class ChartDataTable {
         }
       </tbody>
     </table>
-  `, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartDataTable, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ChartDataTable',
-                    template: `
+  `,
+		isInline: true
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ChartDataTable,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ChartDataTable",
+			template: `
     <table class="sr-only" [attr.aria-label]="label()">
       <thead>
         <tr>
@@ -752,735 +641,642 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
         }
       </tbody>
     </table>
-  `,
-                }]
-        }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], rowHeaderKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowHeaderKey", required: false }] }] } });
-
-/**
- * Keeps dense SVG charts to one tab stop while preserving arrow-key access to
- * every interactive mark. Marks are discovered by their `role="img"` and
- * `tabindex` attributes so chart implementations do not need a shared base
- * class or additional DOM wrappers.
- */
-class ChartRovingFocus {
-    host = inject(ElementRef);
-    destroyRef = inject(DestroyRef);
-    activeMark = null;
-    constructor() {
-        afterNextRender(() => {
-            this.syncTabStops(this.marks());
-            if (typeof MutationObserver === 'undefined') {
-                return;
-            }
-            const observer = new MutationObserver(() => this.syncTabStops(this.marks()));
-            observer.observe(this.host.nativeElement, { childList: true, subtree: true });
-            this.destroyRef.onDestroy(() => observer.disconnect());
-        });
-    }
-    onFocusIn(event) {
-        const target = event.target;
-        if (!(target instanceof Element) || !this.marks().includes(target)) {
-            return;
-        }
-        this.activeMark = target;
-        this.syncTabStops(this.marks());
-    }
-    onKeydown(event) {
-        const marks = this.marks();
-        const target = event.target;
-        const currentIndex = target instanceof Element ? marks.indexOf(target) : -1;
-        if (currentIndex < 0 || marks.length < 2) {
-            return;
-        }
-        let targetIndex = null;
-        if (event.key === 'ArrowRight' || event.key === 'ArrowDown') {
-            targetIndex = (currentIndex + 1) % marks.length;
-        }
-        else if (event.key === 'ArrowLeft' || event.key === 'ArrowUp') {
-            targetIndex = (currentIndex - 1 + marks.length) % marks.length;
-        }
-        else if (event.key === 'Home') {
-            targetIndex = 0;
-        }
-        else if (event.key === 'End') {
-            targetIndex = marks.length - 1;
-        }
-        if (targetIndex === null) {
-            return;
-        }
-        event.preventDefault();
-        const next = marks[targetIndex];
-        this.activeMark = next;
-        this.syncTabStops(marks);
-        next.focus();
-    }
-    marks() {
-        return Array.from(this.host.nativeElement.querySelectorAll('[role="img"][tabindex]'));
-    }
-    syncTabStops(marks) {
-        if (marks.length === 0) {
-            this.activeMark = null;
-            return;
-        }
-        const active = this.activeMark && marks.includes(this.activeMark) ? this.activeMark : marks[0];
-        this.activeMark = active;
-        for (const mark of marks) {
-            mark.setAttribute('tabindex', mark === active ? '0' : '-1');
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartRovingFocus, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.6", type: ChartRovingFocus, isStandalone: true, selector: "svg[ChartRovingFocus]", host: { listeners: { "focusin": "onFocusIn($event)", "keydown": "onKeydown($event)" } }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartRovingFocus, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'svg[ChartRovingFocus]',
-                    host: {
-                        '(focusin)': 'onFocusIn($event)',
-                        '(keydown)': 'onKeydown($event)',
-                    },
-                }]
-        }], ctorParameters: () => [] });
-
-/**
- * The focus treatment shared by every interactive chart mark.
- *
- * SVG shapes cannot carry the `ring-*` box-shadow the HTML controls use, so the
- * indicator is painted as a stroke in the theme's dedicated `--ring` token,
- * which is a near-black in light mode and a near-white in dark mode and so
- * separates the focused mark from its own fill on either ground. The class
- * takes precedence over the `stroke` presentation attribute a mark may already
- * carry, which is why the emphasis strokes bound elsewhere do not have to know
- * about focus at all.
- *
- * `outline-none` lives here rather than in the templates so the suppression and
- * its replacement can never drift apart.
- */
-class ChartMarkFocus {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartMarkFocus, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.6", type: ChartMarkFocus, isStandalone: true, selector: "[ChartMarkFocus]", host: { classAttribute: "outline-none focus-visible:stroke-ring focus-visible:stroke-2" }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartMarkFocus, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[ChartMarkFocus]',
-                    host: {
-                        class: 'outline-none focus-visible:stroke-ring focus-visible:stroke-2',
-                    },
-                }]
-        }] });
-
-/**
- * Default margins, one per chart geometry. THREE constants, not one: the
- * families disagree on purpose, and collapsing them would silently relayout
- * pie, radial, and radar.
- *
- * Cartesian charts need a bottom gutter for the axis and a wide left gutter for
- * y tick labels. Polar charts have no axes to make room for. Radar needs
- * symmetric room for its outer labels.
- */
-const DEFAULT_CARTESIAN_MARGIN = { top: 8, right: 8, bottom: 24, left: 40 };
-/** Polar geometry (pie, radial): no axis gutters. */
-const DEFAULT_POLAR_MARGIN = { top: 8, right: 8, bottom: 8, left: 8 };
-/** Radar geometry: symmetric room for the outer axis labels. */
-const DEFAULT_RADAR_MARGIN = { top: 24, right: 24, bottom: 24, left: 24 };
-/**
- * The same three margins expressed in SPACING UNITS rather than pixels.
- *
- * A chart draws its plot area with numbers, so no token can cascade into it.
- * These are what {@link ChartThemeSpace} multiplies by the live spacing unit, so
- * plot gutters tighten along with everything else when the density axis moves.
- *
- * The px constants above stay exactly as they are, and stay exported. They are
- * the published defaults and the SSR fallback, and at the `normal` preset the
- * unit maths reproduces them precisely: 4px per unit gives back 8/8/24/40,
- * 8 all round, and 24 all round.
- */
+  `
+		}]
+	}],
+	propDecorators: {
+		data: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "data",
+				required: true
+			}]
+		}],
+		columns: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "columns",
+				required: true
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}],
+		rowHeaderKey: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "rowHeaderKey",
+				required: false
+			}]
+		}]
+	}
+});
+var ChartRovingFocus = class ChartRovingFocus {
+	host = inject(ElementRef);
+	destroyRef = inject(DestroyRef);
+	activeMark = null;
+	constructor() {
+		afterNextRender(() => {
+			this.syncTabStops(this.marks());
+			if (typeof MutationObserver === "undefined") return;
+			const observer = new MutationObserver(() => this.syncTabStops(this.marks()));
+			observer.observe(this.host.nativeElement, {
+				childList: true,
+				subtree: true
+			});
+			this.destroyRef.onDestroy(() => observer.disconnect());
+		});
+	}
+	onFocusIn(event) {
+		const target = event.target;
+		if (!(target instanceof Element) || !this.marks().includes(target)) return;
+		this.activeMark = target;
+		this.syncTabStops(this.marks());
+	}
+	onKeydown(event) {
+		const marks = this.marks();
+		const target = event.target;
+		const currentIndex = target instanceof Element ? marks.indexOf(target) : -1;
+		if (currentIndex < 0 || marks.length < 2) return;
+		let targetIndex = null;
+		if (event.key === "ArrowRight" || event.key === "ArrowDown") targetIndex = (currentIndex + 1) % marks.length;
+		else if (event.key === "ArrowLeft" || event.key === "ArrowUp") targetIndex = (currentIndex - 1 + marks.length) % marks.length;
+		else if (event.key === "Home") targetIndex = 0;
+		else if (event.key === "End") targetIndex = marks.length - 1;
+		if (targetIndex === null) return;
+		event.preventDefault();
+		const next = marks[targetIndex];
+		this.activeMark = next;
+		this.syncTabStops(marks);
+		next.focus();
+	}
+	marks() {
+		return Array.from(this.host.nativeElement.querySelectorAll("[role=\"img\"][tabindex]"));
+	}
+	syncTabStops(marks) {
+		if (marks.length === 0) {
+			this.activeMark = null;
+			return;
+		}
+		const active = this.activeMark && marks.includes(this.activeMark) ? this.activeMark : marks[0];
+		this.activeMark = active;
+		for (const mark of marks) mark.setAttribute("tabindex", mark === active ? "0" : "-1");
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartRovingFocus,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "14.0.0",
+		version: "22.2.2",
+		type: ChartRovingFocus,
+		isStandalone: true,
+		selector: "svg[ChartRovingFocus]",
+		host: { listeners: {
+			"focusin": "onFocusIn($event)",
+			"keydown": "onKeydown($event)"
+		} },
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ChartRovingFocus,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "svg[ChartRovingFocus]",
+			host: {
+				"(focusin)": "onFocusIn($event)",
+				"(keydown)": "onKeydown($event)"
+			}
+		}]
+	}],
+	ctorParameters: () => []
+});
+var ChartMarkFocus = class ChartMarkFocus {
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartMarkFocus,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "14.0.0",
+		version: "22.2.2",
+		type: ChartMarkFocus,
+		isStandalone: true,
+		selector: "[ChartMarkFocus]",
+		host: { classAttribute: "outline-none focus-visible:stroke-ring focus-visible:stroke-2" },
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ChartMarkFocus,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "[ChartMarkFocus]",
+			host: { class: "outline-none focus-visible:stroke-ring focus-visible:stroke-2" }
+		}]
+	}]
+});
+const DEFAULT_CARTESIAN_MARGIN = {
+	top: 8,
+	right: 8,
+	bottom: 24,
+	left: 40
+};
+const DEFAULT_POLAR_MARGIN = {
+	top: 8,
+	right: 8,
+	bottom: 8,
+	left: 8
+};
+const DEFAULT_RADAR_MARGIN = {
+	top: 24,
+	right: 24,
+	bottom: 24,
+	left: 24
+};
 const DEFAULT_CARTESIAN_MARGIN_UNITS = {
-    top: 2,
-    right: 2,
-    bottom: 6,
-    left: 10,
+	top: 2,
+	right: 2,
+	bottom: 6,
+	left: 10
+};
+const DEFAULT_POLAR_MARGIN_UNITS = {
+	top: 2,
+	right: 2,
+	bottom: 2,
+	left: 2
 };
-const DEFAULT_POLAR_MARGIN_UNITS = { top: 2, right: 2, bottom: 2, left: 2 };
 const DEFAULT_RADAR_MARGIN_UNITS = {
-    top: 6,
-    right: 6,
-    bottom: 6,
-    left: 6,
+	top: 6,
+	right: 6,
+	bottom: 6,
+	left: 6
 };
-/**
- * Cartesian plotting frame shared between a chart type (Bar, Line, Area…)
- * and its axis / grid primitives.
- *
- * The owning chart component provides an instance and publishes its scales;
- * descendants read them via signals and re-render when dimensions or data
- * change.
- */
-class CartesianContext {
-    /** Inner width (outer width − margin.left − margin.right). */
-    innerWidth = signal(0, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []));
-    /** Inner height (outer height − margin.top − margin.bottom). */
-    innerHeight = signal(0, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerHeight" }] : /* istanbul ignore next */ []));
-    /** Margins around the plotting area. */
-    margin = signal(DEFAULT_CARTESIAN_MARGIN, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "margin" }] : /* istanbul ignore next */ []));
-    /** Layout orientation (drives which axis holds the band scale). */
-    orientation = signal('vertical', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
-    /** Band (categorical) scale. */
-    categoryScale = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "categoryScale" }] : /* istanbul ignore next */ []));
-    /** Linear (numeric) scale. */
-    valueScale = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "valueScale" }] : /* istanbul ignore next */ []));
-    /** Ordered category domain (e.g. x labels for vertical, y labels for horizontal). */
-    categories = signal([], /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "categories" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: CartesianContext, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: CartesianContext, autoProvided: false });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: CartesianContext, decorators: [{
-            type: Service,
-            args: [{ autoProvided: false }]
-        }] });
-/** Resolve the scale that maps to the X axis for a given orientation. */
+var CartesianContext = class CartesianContext {
+	innerWidth = signal(0, ...ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []);
+	innerHeight = signal(0, ...ngDevMode ? [{ debugName: "innerHeight" }] : /* istanbul ignore next */ []);
+	margin = signal(DEFAULT_CARTESIAN_MARGIN, ...ngDevMode ? [{ debugName: "margin" }] : /* istanbul ignore next */ []);
+	orientation = signal("vertical", ...ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []);
+	categoryScale = signal(null, ...ngDevMode ? [{ debugName: "categoryScale" }] : /* istanbul ignore next */ []);
+	valueScale = signal(null, ...ngDevMode ? [{ debugName: "valueScale" }] : /* istanbul ignore next */ []);
+	categories = signal([], ...ngDevMode ? [{ debugName: "categories" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: CartesianContext,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Service
+	});
+	static ɵprov = i0.ɵɵngDeclareService({
+		minVersion: "22.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: CartesianContext,
+		autoProvided: false
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: CartesianContext,
+	decorators: [{
+		type: Service,
+		args: [{ autoProvided: false }]
+	}]
+});
 function xScale(ctx) {
-    return computed(() => ctx.orientation() === 'vertical' ? ctx.categoryScale() : ctx.valueScale());
+	return computed(() => ctx.orientation() === "vertical" ? ctx.categoryScale() : ctx.valueScale());
 }
-/** Resolve the scale that maps to the Y axis for a given orientation. */
 function yScale(ctx) {
-    return computed(() => ctx.orientation() === 'vertical' ? ctx.valueScale() : ctx.categoryScale());
+	return computed(() => ctx.orientation() === "vertical" ? ctx.valueScale() : ctx.categoryScale());
 }
-/**
- * The plot margin actually in effect: the consumer's `margin` input when they
- * set one, otherwise the default scaled by the live spacing unit.
- *
- * An explicit `margin` always wins. A consumer who has already tuned their
- * gutters chose those exact numbers, and quietly rescaling them when the
- * density axis moves would override a decision they made on purpose.
- *
- * This is why the `margin` inputs accept `null` and default to it: a chart has
- * to be able to tell "the caller wants 8px here" apart from "nobody said", and
- * an eagerly-defaulted object cannot express the difference.
- */
 function resolveChartMargin(margin, units, space) {
-    return computed(() => {
-        const explicit = margin();
-        if (explicit) {
-            return explicit;
-        }
-        return {
-            top: space.scale(units.top),
-            right: space.scale(units.right),
-            bottom: space.scale(units.bottom),
-            left: space.scale(units.left),
-        };
-    });
+	return computed(() => {
+		const explicit = margin();
+		if (explicit) return explicit;
+		return {
+			top: space.scale(units.top),
+			right: space.scale(units.right),
+			bottom: space.scale(units.bottom),
+			left: space.scale(units.left)
+		};
+	});
 }
-
-class CategoricalViewportContext {
-    dataCount = signal(0, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "dataCount" }] : /* istanbul ignore next */ []));
-    brushRange = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "brushRange" }] : /* istanbul ignore next */ []));
-    zoomRange = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "zoomRange" }] : /* istanbul ignore next */ []));
-    hasZoom = computed(() => {
-        const range = this.zoomRange();
-        const count = this.dataCount();
-        return !!range && count > 0 && (range.startIndex > 0 || range.endIndex < count - 1);
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hasZoom" }] : /* istanbul ignore next */ []));
-    resetZoom() {
-        this.brushRange.set(null);
-        this.zoomRange.set(null);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: CategoricalViewportContext, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: CategoricalViewportContext, autoProvided: false });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: CategoricalViewportContext, decorators: [{
-            type: Service,
-            args: [{ autoProvided: false }]
-        }] });
-
-class ScatterViewportContext {
-    innerWidth = signal(0, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []));
-    innerHeight = signal(0, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "innerHeight" }] : /* istanbul ignore next */ []));
-    fullXDomain = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "fullXDomain" }] : /* istanbul ignore next */ []));
-    fullYDomain = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "fullYDomain" }] : /* istanbul ignore next */ []));
-    zoomXDomain = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "zoomXDomain" }] : /* istanbul ignore next */ []));
-    zoomYDomain = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "zoomYDomain" }] : /* istanbul ignore next */ []));
-    xScale = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "xScale" }] : /* istanbul ignore next */ []));
-    yScale = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "yScale" }] : /* istanbul ignore next */ []));
-    hasZoom = computed(() => this.zoomXDomain() !== null || this.zoomYDomain() !== null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hasZoom" }] : /* istanbul ignore next */ []));
-    resetZoom() {
-        this.zoomXDomain.set(null);
-        this.zoomYDomain.set(null);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ScatterViewportContext, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: ScatterViewportContext, autoProvided: false });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ScatterViewportContext, decorators: [{
-            type: Service,
-            args: [{ autoProvided: false }]
-        }] });
-
-/** Produce evenly-spaced ticks for a band (categorical) scale. */
+var CategoricalViewportContext = class CategoricalViewportContext {
+	dataCount = signal(0, ...ngDevMode ? [{ debugName: "dataCount" }] : /* istanbul ignore next */ []);
+	brushRange = signal(null, ...ngDevMode ? [{ debugName: "brushRange" }] : /* istanbul ignore next */ []);
+	zoomRange = signal(null, ...ngDevMode ? [{ debugName: "zoomRange" }] : /* istanbul ignore next */ []);
+	hasZoom = computed(() => {
+		const range = this.zoomRange();
+		const count = this.dataCount();
+		return !!range && count > 0 && (range.startIndex > 0 || range.endIndex < count - 1);
+	}, ...ngDevMode ? [{ debugName: "hasZoom" }] : /* istanbul ignore next */ []);
+	resetZoom() {
+		this.brushRange.set(null);
+		this.zoomRange.set(null);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: CategoricalViewportContext,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Service
+	});
+	static ɵprov = i0.ɵɵngDeclareService({
+		minVersion: "22.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: CategoricalViewportContext,
+		autoProvided: false
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: CategoricalViewportContext,
+	decorators: [{
+		type: Service,
+		args: [{ autoProvided: false }]
+	}]
+});
+var ScatterViewportContext = class ScatterViewportContext {
+	innerWidth = signal(0, ...ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []);
+	innerHeight = signal(0, ...ngDevMode ? [{ debugName: "innerHeight" }] : /* istanbul ignore next */ []);
+	fullXDomain = signal(null, ...ngDevMode ? [{ debugName: "fullXDomain" }] : /* istanbul ignore next */ []);
+	fullYDomain = signal(null, ...ngDevMode ? [{ debugName: "fullYDomain" }] : /* istanbul ignore next */ []);
+	zoomXDomain = signal(null, ...ngDevMode ? [{ debugName: "zoomXDomain" }] : /* istanbul ignore next */ []);
+	zoomYDomain = signal(null, ...ngDevMode ? [{ debugName: "zoomYDomain" }] : /* istanbul ignore next */ []);
+	xScale = signal(null, ...ngDevMode ? [{ debugName: "xScale" }] : /* istanbul ignore next */ []);
+	yScale = signal(null, ...ngDevMode ? [{ debugName: "yScale" }] : /* istanbul ignore next */ []);
+	hasZoom = computed(() => this.zoomXDomain() !== null || this.zoomYDomain() !== null, ...ngDevMode ? [{ debugName: "hasZoom" }] : /* istanbul ignore next */ []);
+	resetZoom() {
+		this.zoomXDomain.set(null);
+		this.zoomYDomain.set(null);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ScatterViewportContext,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Service
+	});
+	static ɵprov = i0.ɵɵngDeclareService({
+		minVersion: "22.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ScatterViewportContext,
+		autoProvided: false
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ScatterViewportContext,
+	decorators: [{
+		type: Service,
+		args: [{ autoProvided: false }]
+	}]
+});
 function bandTicks(scale) {
-    const half = scale.bandwidth() / 2;
-    return scale.domain().map((value) => ({
-        value,
-        offset: (scale(value) ?? 0) + half,
-        label: value,
-    }));
+	const half = scale.bandwidth() / 2;
+	return scale.domain().map((value) => ({
+		value,
+		offset: (scale(value) ?? 0) + half,
+		label: value
+	}));
 }
-/**
- * Produce ticks for a linear scale.
- *
- * @param scale      The linear scale.
- * @param count      Approximate number of ticks (hint, d3 may return fewer/more).
- * @param formatter  Label formatter.
- */
 function linearTicks(scale, count = 5, formatter = (v) => String(v)) {
-    return scale.ticks(count).map((value) => ({
-        value,
-        offset: scale(value),
-        label: formatter(value),
-    }));
+	return scale.ticks(count).map((value) => ({
+		value,
+		offset: scale(value),
+		label: formatter(value)
+	}));
 }
-
-/**
- * Read a numeric value from a datum, tolerating strings.
- *
- * Every layout in this library reads its numbers through here. Bar and line
- * each used to carry their own identical copy while the polar and scatter
- * layouts reached for a bare `Number(d[key] ?? 0)`, so the same dataset drew
- * correctly as a bar chart and silently lost marks as a pie: `Number('n/a')`
- * is `NaN`, and a `NaN` flows straight into the path data.
- *
- * Anything that is not a finite number or a parseable numeric string reads as
- * `0`. That is the behaviour bar and line already shipped, so it is the one the
- * rest of the family adopts.
- */
 function readNumber(datum, key) {
-    const raw = datum[key];
-    if (typeof raw === 'number' && Number.isFinite(raw)) {
-        return raw;
-    }
-    if (typeof raw === 'string') {
-        const parsed = Number(raw);
-        return Number.isFinite(parsed) ? parsed : 0;
-    }
-    return 0;
+	const raw = datum[key];
+	if (typeof raw === "number" && Number.isFinite(raw)) return raw;
+	if (typeof raw === "string") {
+		const parsed = Number(raw);
+		return Number.isFinite(parsed) ? parsed : 0;
+	}
+	return 0;
 }
-
 function curveFor(curve) {
-    switch (curve) {
-        case 'monotone':
-            return curveMonotoneX;
-        case 'step':
-            return curveStep;
-        case 'linear':
-        default:
-            return curveLinear;
-    }
+	switch (curve) {
+		case "monotone": return curveMonotoneX;
+		case "step": return curveStep;
+		default: return curveLinear;
+	}
 }
-/** Build category + value scales for point-based charts (line / area). */
 function buildCartesianScales(input) {
-    const { data, xKey, seriesKeys, orientation, innerWidth, innerHeight } = input;
-    const isVertical = orientation === 'vertical';
-    const categories = data.map((d) => String(d[xKey] ?? ''));
-    const categoryScale = scalePoint()
-        .domain(categories)
-        .range(isVertical ? [0, innerWidth] : [0, innerHeight])
-        .padding(0);
-    const minValue = min(data, (d) => min(seriesKeys, (k) => readNumber(d, k)) ?? 0) ?? 0;
-    const maxValue = max(data, (d) => max(seriesKeys, (k) => readNumber(d, k)) ?? 0) ?? 0;
-    const [domainMin, domainMax] = zeroBaselineDomain(minValue, maxValue);
-    const valueScale = scaleLinear()
-        .domain([domainMin, domainMax])
-        .nice()
-        .range(isVertical ? [innerHeight, 0] : [0, innerWidth]);
-    return { categories, categoryScale, valueScale };
+	const { data, xKey, seriesKeys, orientation, innerWidth, innerHeight } = input;
+	const isVertical = orientation === "vertical";
+	const categories = data.map((d) => String(d[xKey] ?? ""));
+	const categoryScale = scalePoint().domain(categories).range(isVertical ? [0, innerWidth] : [0, innerHeight]).padding(0);
+	const [domainMin, domainMax] = zeroBaselineDomain(min(data, (d) => min(seriesKeys, (k) => readNumber(d, k)) ?? 0) ?? 0, max(data, (d) => max(seriesKeys, (k) => readNumber(d, k)) ?? 0) ?? 0);
+	return {
+		categories,
+		categoryScale,
+		valueScale: scaleLinear().domain([domainMin, domainMax]).nice().range(isVertical ? [innerHeight, 0] : [0, innerWidth])
+	};
 }
-/** Compute line-chart geometry. */
 function computeLineLayout(input) {
-    const { data, seriesKeys, orientation, curve } = input;
-    const { categories, categoryScale, valueScale } = buildCartesianScales(input);
-    const isVertical = orientation === 'vertical';
-    const allPoints = [];
-    const series = [];
-    for (const seriesKey of seriesKeys) {
-        const points = data.map((d, datumIndex) => {
-            const value = readNumber(d, seriesKey);
-            const category = categories[datumIndex];
-            const c = categoryScale(category) ?? 0;
-            const v = valueScale(value);
-            return {
-                seriesKey,
-                datumIndex,
-                category,
-                value,
-                x: isVertical ? c : v,
-                y: isVertical ? v : c,
-            };
-        });
-        allPoints.push(...points);
-        const generator = line()
-            .x((p) => p.x)
-            .y((p) => p.y)
-            .curve(curveFor(curve));
-        series.push({
-            seriesKey,
-            color: seriesColorVar(seriesKey),
-            linePath: generator(points) ?? '',
-            points,
-        });
-    }
-    return {
-        series,
-        points: allPoints,
-        categoryScale,
-        valueScale,
-        categories,
-    };
+	const { data, seriesKeys, orientation, curve } = input;
+	const { categories, categoryScale, valueScale } = buildCartesianScales(input);
+	const isVertical = orientation === "vertical";
+	const allPoints = [];
+	const series = [];
+	for (const seriesKey of seriesKeys) {
+		const points = data.map((d, datumIndex) => {
+			const value = readNumber(d, seriesKey);
+			const category = categories[datumIndex];
+			const c = categoryScale(category) ?? 0;
+			const v = valueScale(value);
+			return {
+				seriesKey,
+				datumIndex,
+				category,
+				value,
+				x: isVertical ? c : v,
+				y: isVertical ? v : c
+			};
+		});
+		allPoints.push(...points);
+		const generator = line().x((p) => p.x).y((p) => p.y).curve(curveFor(curve));
+		series.push({
+			seriesKey,
+			color: seriesColorVar(seriesKey),
+			linePath: generator(points) ?? "",
+			points
+		});
+	}
+	return {
+		series,
+		points: allPoints,
+		categoryScale,
+		valueScale,
+		categories
+	};
 }
-/** Compute area-chart geometry (single or stacked). */
 function computeAreaLayout(input) {
-    if (input.stacked && input.seriesKeys.length > 0) {
-        return computeStackedArea(input);
-    }
-    return computeSingleArea(input);
+	if (input.stacked && input.seriesKeys.length > 0) return computeStackedArea(input);
+	return computeSingleArea(input);
 }
 function computeSingleArea(input) {
-    const { data, seriesKeys, orientation, curve } = input;
-    const { categories, categoryScale, valueScale } = buildCartesianScales(input);
-    const isVertical = orientation === 'vertical';
-    const baseline = isVertical ? valueScale(0) : valueScale(0);
-    const allPoints = [];
-    const series = [];
-    for (const seriesKey of seriesKeys) {
-        const points = data.map((d, datumIndex) => {
-            const value = readNumber(d, seriesKey);
-            const category = categories[datumIndex];
-            const c = categoryScale(category) ?? 0;
-            const v = valueScale(value);
-            return {
-                seriesKey,
-                datumIndex,
-                category,
-                value,
-                x: isVertical ? c : v,
-                y: isVertical ? v : c,
-            };
-        });
-        allPoints.push(...points);
-        const lineGen = line()
-            .x((p) => p.x)
-            .y((p) => p.y)
-            .curve(curveFor(curve));
-        const areaGen = isVertical
-            ? area()
-                .x((p) => p.x)
-                .y0(baseline)
-                .y1((p) => p.y)
-                .curve(curveFor(curve))
-            : area()
-                .y((p) => p.y)
-                .x0(baseline)
-                .x1((p) => p.x)
-                .curve(curveFor(curve));
-        series.push({
-            seriesKey,
-            color: seriesColorVar(seriesKey),
-            linePath: lineGen(points) ?? '',
-            areaPath: areaGen(points) ?? '',
-            points,
-        });
-    }
-    return {
-        series,
-        points: allPoints,
-        categoryScale,
-        valueScale,
-        categories,
-        stacked: false,
-    };
+	const { data, seriesKeys, orientation, curve } = input;
+	const { categories, categoryScale, valueScale } = buildCartesianScales(input);
+	const isVertical = orientation === "vertical";
+	const baseline = isVertical ? valueScale(0) : valueScale(0);
+	const allPoints = [];
+	const series = [];
+	for (const seriesKey of seriesKeys) {
+		const points = data.map((d, datumIndex) => {
+			const value = readNumber(d, seriesKey);
+			const category = categories[datumIndex];
+			const c = categoryScale(category) ?? 0;
+			const v = valueScale(value);
+			return {
+				seriesKey,
+				datumIndex,
+				category,
+				value,
+				x: isVertical ? c : v,
+				y: isVertical ? v : c
+			};
+		});
+		allPoints.push(...points);
+		const lineGen = line().x((p) => p.x).y((p) => p.y).curve(curveFor(curve));
+		const areaGen = isVertical ? area().x((p) => p.x).y0(baseline).y1((p) => p.y).curve(curveFor(curve)) : area().y((p) => p.y).x0(baseline).x1((p) => p.x).curve(curveFor(curve));
+		series.push({
+			seriesKey,
+			color: seriesColorVar(seriesKey),
+			linePath: lineGen(points) ?? "",
+			areaPath: areaGen(points) ?? "",
+			points
+		});
+	}
+	return {
+		series,
+		points: allPoints,
+		categoryScale,
+		valueScale,
+		categories,
+		stacked: false
+	};
 }
 function computeStackedArea(input) {
-    const { data, seriesKeys, orientation, innerWidth, innerHeight, xKey, curve, expanded } = input;
-    const isVertical = orientation === 'vertical';
-    const categories = data.map((d) => String(d[xKey] ?? ''));
-    const categoryScale = scalePoint()
-        .domain(categories)
-        .range(isVertical ? [0, innerWidth] : [0, innerHeight])
-        .padding(0);
-    const normalized = data.map((d) => {
-        const out = {};
-        for (const k of seriesKeys)
-            out[k] = readNumber(d, k);
-        return out;
-    });
-    const stackGenerator = stack().keys(seriesKeys);
-    if (expanded) {
-        stackGenerator.offset(stackOffsetExpand);
-    }
-    const stackSeries = stackGenerator(normalized);
-    // Every layer is measured, not just the last one: a stack that runs below the
-    // baseline puts its extreme on whichever layer carries the negative values.
-    const minTotal = expanded
-        ? 0
-        : (min(stackSeries, (layer) => min(layer, (p) => Math.min(p[0], p[1]))) ?? 0);
-    const maxTotal = expanded
-        ? 1
-        : (max(stackSeries, (layer) => max(layer, (p) => Math.max(p[0], p[1]))) ?? 0);
-    const [domainMin, domainMax] = zeroBaselineDomain(minTotal, maxTotal);
-    const valueScale = scaleLinear()
-        .domain([domainMin, domainMax])
-        .range(isVertical ? [innerHeight, 0] : [0, innerWidth]);
-    if (!expanded) {
-        valueScale.nice();
-    }
-    const allPoints = [];
-    const series = stackSeries.map((layer) => {
-        const seriesKey = layer.key;
-        const points = layer.map((p, datumIndex) => {
-            const category = categories[datumIndex];
-            const c = categoryScale(category) ?? 0;
-            const upper = valueScale(p[1]);
-            return {
-                seriesKey,
-                datumIndex,
-                category,
-                value: p[1] - p[0],
-                x: isVertical ? c : upper,
-                y: isVertical ? upper : c,
-            };
-        });
-        allPoints.push(...points);
-        const lineGen = line()
-            .x(([x]) => x)
-            .y(([, y]) => y)
-            .curve(curveFor(curve));
-        const areaGen = isVertical
-            ? area()
-                .x(([x]) => x)
-                .y0(([, , y0]) => y0)
-                .y1(([, y1]) => y1)
-                .curve(curveFor(curve))
-            : area()
-                .y(([x]) => x)
-                .x0(([, , x0]) => x0)
-                .x1(([, x1]) => x1)
-                .curve(curveFor(curve));
-        const tuples = layer.map((p, i) => {
-            const c = categoryScale(categories[i]) ?? 0;
-            return [c, valueScale(p[1]), valueScale(p[0])];
-        });
-        return {
-            seriesKey,
-            color: seriesColorVar(seriesKey),
-            linePath: lineGen(tuples) ?? '',
-            areaPath: areaGen(tuples) ?? '',
-            points,
-        };
-    });
-    return {
-        series,
-        points: allPoints,
-        categoryScale,
-        valueScale,
-        categories,
-        stacked: true,
-    };
+	const { data, seriesKeys, orientation, innerWidth, innerHeight, xKey, curve, expanded } = input;
+	const isVertical = orientation === "vertical";
+	const categories = data.map((d) => String(d[xKey] ?? ""));
+	const categoryScale = scalePoint().domain(categories).range(isVertical ? [0, innerWidth] : [0, innerHeight]).padding(0);
+	const normalized = data.map((d) => {
+		const out = {};
+		for (const k of seriesKeys) out[k] = readNumber(d, k);
+		return out;
+	});
+	const stackGenerator = stack().keys(seriesKeys);
+	if (expanded) stackGenerator.offset(stackOffsetExpand);
+	const stackSeries = stackGenerator(normalized);
+	const [domainMin, domainMax] = zeroBaselineDomain(expanded ? 0 : min(stackSeries, (layer) => min(layer, (p) => Math.min(p[0], p[1]))) ?? 0, expanded ? 1 : max(stackSeries, (layer) => max(layer, (p) => Math.max(p[0], p[1]))) ?? 0);
+	const valueScale = scaleLinear().domain([domainMin, domainMax]).range(isVertical ? [innerHeight, 0] : [0, innerWidth]);
+	if (!expanded) valueScale.nice();
+	const allPoints = [];
+	return {
+		series: stackSeries.map((layer) => {
+			const seriesKey = layer.key;
+			const points = layer.map((p, datumIndex) => {
+				const category = categories[datumIndex];
+				const c = categoryScale(category) ?? 0;
+				const upper = valueScale(p[1]);
+				return {
+					seriesKey,
+					datumIndex,
+					category,
+					value: p[1] - p[0],
+					x: isVertical ? c : upper,
+					y: isVertical ? upper : c
+				};
+			});
+			allPoints.push(...points);
+			const lineGen = line().x(([x]) => x).y(([, y]) => y).curve(curveFor(curve));
+			const areaGen = isVertical ? area().x(([x]) => x).y0(([, , y0]) => y0).y1(([, y1]) => y1).curve(curveFor(curve)) : area().y(([x]) => x).x0(([, , x0]) => x0).x1(([, x1]) => x1).curve(curveFor(curve));
+			const tuples = layer.map((p, i) => {
+				return [
+					categoryScale(categories[i]) ?? 0,
+					valueScale(p[1]),
+					valueScale(p[0])
+				];
+			});
+			return {
+				seriesKey,
+				color: seriesColorVar(seriesKey),
+				linePath: lineGen(tuples) ?? "",
+				areaPath: areaGen(tuples) ?? "",
+				points
+			};
+		}),
+		points: allPoints,
+		categoryScale,
+		valueScale,
+		categories,
+		stacked: true
+	};
 }
-
-/**
- * Publish a `scalePoint` from line/area layouts to the `CartesianContext`,
- * which expects a `scaleBand`. Line/area points sit on the range edges (the
- * point scale has zero padding, so the first point touches the y-axis and the
- * last touches the right edge). We extend the band range by half a step on
- * each side so band centers — used to position axis ticks — line up exactly
- * with those edge-touching points.
- *
- * This keeps axes/grid primitives agnostic to whether the underlying chart
- * uses `scaleBand` (bar) or `scalePoint` (line/area).
- */
 function pointToBandAdapter(pointScale, range) {
-    const half = pointScale.step() / 2;
-    const extended = [range[0] - half, range[1] + half];
-    return scaleBand().domain(pointScale.domain()).range(extended).padding(0);
+	const half = pointScale.step() / 2;
+	const extended = [range[0] - half, range[1] + half];
+	return scaleBand().domain(pointScale.domain()).range(extended).padding(0);
 }
-/** Recreate a linear scale with the same domain/range (handy for effects). */
 function cloneLinear(scale) {
-    return scaleLinear().domain(scale.domain()).range(scale.range());
+	return scaleLinear().domain(scale.domain()).range(scale.range());
 }
 function provideCartesianFromLineLayout(ctx, layout, orientation, innerWidth, innerHeight) {
-    const range = orientation === 'vertical' ? [0, innerWidth] : [0, innerHeight];
-    ctx.orientation.set(orientation);
-    ctx.innerWidth.set(innerWidth);
-    ctx.innerHeight.set(innerHeight);
-    ctx.categoryScale.set(pointToBandAdapter(layout.categoryScale, range));
-    ctx.valueScale.set(cloneLinear(layout.valueScale));
-    ctx.categories.set(layout.categories);
+	const range = orientation === "vertical" ? [0, innerWidth] : [0, innerHeight];
+	ctx.orientation.set(orientation);
+	ctx.innerWidth.set(innerWidth);
+	ctx.innerHeight.set(innerHeight);
+	ctx.categoryScale.set(pointToBandAdapter(layout.categoryScale, range));
+	ctx.valueScale.set(cloneLinear(layout.valueScale));
+	ctx.categories.set(layout.categories);
 }
-
-/** 0.375rem @ 16px root — Tailwind's stock `rounded-md` value. */
 const FALLBACK_RADIUS_PX = 6;
-/**
- * Resolves the live theme corner radius (the `--radius` token) in pixels for SVG
- * chart geometry, and re-emits when the global `theme-radius` axis switches.
- *
- * SVG `rx`/`ry` need px numbers, so this reads the computed `--radius` off
- * `<html>` and converts rem→px. A `MutationObserver` on the `<html theme-radius>`
- * attribute keeps the `px` signal in sync with `ThemeRadiusService` at runtime;
- * charts default their corner radius to this value (still overridable per chart).
- *
- * SSR-safe: with no document it returns the `md` fallback and skips observing.
- */
-class ChartThemeRadius {
-    document = inject(DOCUMENT, { optional: true });
-    basePx = signal(this.readBasePx(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "basePx" }] : /* istanbul ignore next */ []));
-    /** Resolved base radius (`--radius`) in px; reactive to the theme-radius axis. */
-    px = this.basePx.asReadonly();
-    constructor() {
-        const root = this.document?.documentElement;
-        const view = this.document?.defaultView;
-        if (!root || !view || typeof view.MutationObserver !== 'function') {
-            return;
-        }
-        const observer = new view.MutationObserver(() => this.basePx.set(this.readBasePx()));
-        observer.observe(root, { attributes: true, attributeFilter: ['theme-radius'] });
-        inject(DestroyRef).onDestroy(() => observer.disconnect());
-    }
-    readBasePx() {
-        const root = this.document?.documentElement;
-        const view = this.document?.defaultView;
-        if (!root || !view) {
-            return FALLBACK_RADIUS_PX;
-        }
-        const raw = view.getComputedStyle(root).getPropertyValue('--radius').trim();
-        return this.toPx(raw, view, root) ?? FALLBACK_RADIUS_PX;
-    }
-    toPx(value, view, root) {
-        if (!value) {
-            return null;
-        }
-        // Tailwind v4 emits `rounded-full` as `calc(infinity * 1px)`. SVG geometry
-        // still needs a finite number; 9999px preserves the same pill/circle result.
-        if (value.includes('infinity')) {
-            return 9999;
-        }
-        const numeric = Number.parseFloat(value);
-        if (!Number.isFinite(numeric)) {
-            return null;
-        }
-        if (value.endsWith('rem')) {
-            const rootFontSize = Number.parseFloat(view.getComputedStyle(root).fontSize) || 16;
-            return numeric * rootFontSize;
-        }
-        // Concrete px values parse directly.
-        return numeric;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartThemeRadius, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: ChartThemeRadius });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartThemeRadius, decorators: [{
-            type: Service
-        }], ctorParameters: () => [] });
-
-/** 0.25rem @ 16px root — the `--spacing-base` value on the `normal` preset. */
+var ChartThemeRadius = class ChartThemeRadius {
+	document = inject(DOCUMENT, { optional: true });
+	basePx = signal(this.readBasePx(), ...ngDevMode ? [{ debugName: "basePx" }] : /* istanbul ignore next */ []);
+	px = this.basePx.asReadonly();
+	constructor() {
+		const root = this.document?.documentElement;
+		const view = this.document?.defaultView;
+		if (!root || !view || typeof view.MutationObserver !== "function") return;
+		const observer = new view.MutationObserver(() => this.basePx.set(this.readBasePx()));
+		observer.observe(root, {
+			attributes: true,
+			attributeFilter: ["theme-radius"]
+		});
+		inject(DestroyRef).onDestroy(() => observer.disconnect());
+	}
+	readBasePx() {
+		const root = this.document?.documentElement;
+		const view = this.document?.defaultView;
+		if (!root || !view) return FALLBACK_RADIUS_PX;
+		const raw = view.getComputedStyle(root).getPropertyValue("--radius").trim();
+		return this.toPx(raw, view, root) ?? FALLBACK_RADIUS_PX;
+	}
+	toPx(value, view, root) {
+		if (!value) return null;
+		if (value.includes("infinity")) return 9999;
+		const numeric = Number.parseFloat(value);
+		if (!Number.isFinite(numeric)) return null;
+		if (value.endsWith("rem")) return numeric * (Number.parseFloat(view.getComputedStyle(root).fontSize) || 16);
+		return numeric;
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartThemeRadius,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Service
+	});
+	static ɵprov = i0.ɵɵngDeclareService({
+		minVersion: "22.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartThemeRadius
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ChartThemeRadius,
+	decorators: [{ type: Service }],
+	ctorParameters: () => []
+});
 const FALLBACK_SPACING_PX = 4;
-/**
- * Resolves the live spacing unit in pixels for SVG chart geometry, and re-emits
- * when the global `theme-space` axis switches.
- *
- * Charts are the one part of the library CSS cannot reach: plot margins are
- * numbers handed to SVG, not properties a token can cascade into. Without a
- * bridge, choosing `compact` tightens every card and control on a dashboard and
- * leaves the charts sitting in exactly as much white space as before -- one
- * island of the old density in the middle of the new one.
- *
- * This is deliberately the same shape as {@link ChartThemeRadius}: an attribute
- * `MutationObserver`, an SSR-safe read, and a fallback constant. Copying a
- * pattern that already works beats inventing a second one, and it means both
- * bridges can be tested the same way.
- *
- * It reads `--spacing-base`, NOT `--spacing`. They hold the same number, but
- * `--spacing` is declared inside Tailwind's `@theme inline` block, which is
- * inlined into utilities at build time and never lands on `<html>` as something
- * `getComputedStyle` can read back. Reading it would have returned an empty
- * string, and this bridge would have quietly served its fallback forever while
- * looking perfectly correct.
- *
- * SSR-safe: with no document it returns the fallback and skips observing.
- */
-class ChartThemeSpace {
-    document = inject(DOCUMENT, { optional: true });
-    unitPx = signal(this.readUnitPx(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "unitPx" }] : /* istanbul ignore next */ []));
-    /** Resolved spacing unit (`--spacing-base`) in px; reactive to the theme-space axis. */
-    px = this.unitPx.asReadonly();
-    constructor() {
-        const root = this.document?.documentElement;
-        const view = this.document?.defaultView;
-        if (!root || !view || typeof view.MutationObserver !== 'function') {
-            return;
-        }
-        const observer = new view.MutationObserver(() => this.unitPx.set(this.readUnitPx()));
-        observer.observe(root, { attributes: true, attributeFilter: ['theme-space'] });
-        inject(DestroyRef).onDestroy(() => observer.disconnect());
-    }
-    /** Scale one margin constant, expressed in spacing units, into pixels. */
-    scale(units) {
-        return units * this.unitPx();
-    }
-    readUnitPx() {
-        const root = this.document?.documentElement;
-        const view = this.document?.defaultView;
-        if (!root || !view) {
-            return FALLBACK_SPACING_PX;
-        }
-        const raw = view.getComputedStyle(root).getPropertyValue('--spacing-base').trim();
-        return this.toPx(raw, view, root) ?? FALLBACK_SPACING_PX;
-    }
-    toPx(value, view, root) {
-        if (!value) {
-            return null;
-        }
-        const numeric = Number.parseFloat(value);
-        if (!Number.isFinite(numeric)) {
-            return null;
-        }
-        if (value.endsWith('rem')) {
-            const rootFontSize = Number.parseFloat(view.getComputedStyle(root).fontSize) || 16;
-            return numeric * rootFontSize;
-        }
-        // Concrete px values parse directly.
-        return numeric;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartThemeSpace, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: ChartThemeSpace });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChartThemeSpace, decorators: [{
-            type: Service
-        }], ctorParameters: () => [] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { CHART_DATA_ATTRIBUTE, CHART_THEMES, CartesianContext, CategoricalViewportContext, ChartContainer, ChartContext, ChartDataTable, ChartMarkFocus, ChartRovingFocus, ChartStyle, ChartThemeRadius, ChartThemeSpace, DEFAULT_CARTESIAN_MARGIN, DEFAULT_CARTESIAN_MARGIN_UNITS, DEFAULT_POLAR_MARGIN, DEFAULT_POLAR_MARGIN_UNITS, DEFAULT_RADAR_MARGIN, DEFAULT_RADAR_MARGIN_UNITS, ScatterViewportContext, activationClientPoint, bandTicks, buildCartesianScales, buildChartCss, cloneLinear, computeAreaLayout, computeLineLayout, effectiveIndexRange, elementClientCenter, escapeCssIdent, indexRangeSize, isSafeCssColorValue, linearTicks, nearestCategoryIndex, normalizeIndexRange, normalizeNumericDomain, panIndexRange, panNumericDomain, pointToBandAdapter, provideCartesianFromLineLayout, readNumber, resolveChartMargin, resolveChartStyle, resolveSeriesColor, seriesColorVar, setupCartesianChart, setupPolarChart, sliceByIndexRange, xScale, yScale, zeroBaselineDomain, zoomIndexRange, zoomNumericDomain };
+var ChartThemeSpace = class ChartThemeSpace {
+	document = inject(DOCUMENT, { optional: true });
+	unitPx = signal(this.readUnitPx(), ...ngDevMode ? [{ debugName: "unitPx" }] : /* istanbul ignore next */ []);
+	px = this.unitPx.asReadonly();
+	constructor() {
+		const root = this.document?.documentElement;
+		const view = this.document?.defaultView;
+		if (!root || !view || typeof view.MutationObserver !== "function") return;
+		const observer = new view.MutationObserver(() => this.unitPx.set(this.readUnitPx()));
+		observer.observe(root, {
+			attributes: true,
+			attributeFilter: ["theme-space"]
+		});
+		inject(DestroyRef).onDestroy(() => observer.disconnect());
+	}
+	scale(units) {
+		return units * this.unitPx();
+	}
+	readUnitPx() {
+		const root = this.document?.documentElement;
+		const view = this.document?.defaultView;
+		if (!root || !view) return FALLBACK_SPACING_PX;
+		const raw = view.getComputedStyle(root).getPropertyValue("--spacing-base").trim();
+		return this.toPx(raw, view, root) ?? FALLBACK_SPACING_PX;
+	}
+	toPx(value, view, root) {
+		if (!value) return null;
+		const numeric = Number.parseFloat(value);
+		if (!Number.isFinite(numeric)) return null;
+		if (value.endsWith("rem")) return numeric * (Number.parseFloat(view.getComputedStyle(root).fontSize) || 16);
+		return numeric;
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartThemeSpace,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Service
+	});
+	static ɵprov = i0.ɵɵngDeclareService({
+		minVersion: "22.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: ChartThemeSpace
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ChartThemeSpace,
+	decorators: [{ type: Service }],
+	ctorParameters: () => []
+});
+export { CHART_DATA_ATTRIBUTE, CHART_THEMES, CartesianContext, CategoricalViewportContext, ChartContainer, ChartContext, ChartDataTable, ChartMarkFocus, ChartRovingFocus, ChartStyle, ChartThemeRadius, ChartThemeSpace, DEFAULT_CARTESIAN_MARGIN, DEFAULT_CARTESIAN_MARGIN_UNITS, DEFAULT_POLAR_MARGIN, DEFAULT_POLAR_MARGIN_UNITS, DEFAULT_RADAR_MARGIN, DEFAULT_RADAR_MARGIN_UNITS, ScatterViewportContext, activationClientPoint, bandTicks, buildCartesianScales, buildChartCss, cloneLinear, computeAreaLayout, computeLineLayout, effectiveIndexRange, elementClientCenter, escapeCssIdent, indexRangeSize, isSafeCssColorValue, linearTicks, nearestCategoryIndex, normalizeIndexRange, normalizeNumericDomain, panIndexRange, panNumericDomain, pointToBandAdapter, provideCartesianFromLineLayout, readNumber, resolveChartMargin, resolveChartStyle, resolveSeriesColor, seriesColorVar, setupCartesianChart, setupPolarChart, sliceByIndexRange, xScale, yScale, zeroBaselineDomain, zoomIndexRange, zoomNumericDomain };