@masmarino/gabarit 1.4.0 → 2.1.0

package/fesm2022/masmarino-gabarit-chart.mjs

@@ -0,0 +1,1289 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Injectable, InjectionToken, booleanAttribute, computed, effect, inject, input, output, signal, viewChild } from "@angular/core";
+import { formatCompact } from "@masmarino/gabarit/format";
+function linearScale(domain, range) {
+	const [d0, d1] = domain;
+	const [r0, r1] = range;
+	const span = d1 - d0;
+	const ratio = span === 0 ? 0 : (r1 - r0) / span;
+	return {
+		domain,
+		range,
+		map: (value) => r0 + (value - d0) * ratio,
+		invert: (pixel) => ratio === 0 ? d0 : d0 + (pixel - r0) / ratio
+	};
+}
+function timeScale(domain, range) {
+	const numeric = linearScale([domain[0].getTime(), domain[1].getTime()], range);
+	return {
+		domain,
+		range,
+		map: (value) => numeric.map(value.getTime()),
+		invert: (pixel) => new Date(numeric.invert(pixel))
+	};
+}
+function bandScale(domain, range, padding = 0) {
+	const [r0, r1] = range;
+	const step = domain.length === 0 ? 0 : (r1 - r0) / domain.length;
+	return {
+		domain,
+		range,
+		bandwidth: step * (1 - Math.min(Math.max(padding, 0), 1)),
+		map: (value) => {
+			const index = domain.indexOf(value);
+			return index === -1 ? NaN : r0 + index * step;
+		},
+		invert: (pixel) => {
+			if (step === 0) return null;
+			const index = Math.floor((pixel - r0) / step);
+			return index >= 0 && index < domain.length ? domain[index] : null;
+		}
+	};
+}
+const EMPTY_BOX = {
+	width: 0,
+	height: 0,
+	margin: {
+		top: 0,
+		right: 0,
+		bottom: 0,
+		left: 0
+	},
+	innerWidth: 0,
+	innerHeight: 0
+};
+const CHART_CONTEXT = new InjectionToken("gbt-chart-context");
+var ChartContext = class ChartContext {
+	_box = signal(EMPTY_BOX, ...ngDevMode ? [{ debugName: "_box" }] : /* istanbul ignore next */ []);
+	_xSpec = signal({
+		kind: "linear",
+		domain: [0, 1]
+	}, ...ngDevMode ? [{ debugName: "_xSpec" }] : /* istanbul ignore next */ []);
+	_ySpec = signal({
+		kind: "linear",
+		domain: [0, 1]
+	}, ...ngDevMode ? [{ debugName: "_ySpec" }] : /* istanbul ignore next */ []);
+	_activeIndex = signal(null, ...ngDevMode ? [{ debugName: "_activeIndex" }] : /* istanbul ignore next */ []);
+	_pointValues = signal([], ...ngDevMode ? [{ debugName: "_pointValues" }] : /* istanbul ignore next */ []);
+	box = this._box.asReadonly();
+	xSpec = this._xSpec.asReadonly();
+	ySpec = this._ySpec.asReadonly();
+	activeIndex = this._activeIndex.asReadonly();
+	pointValues = this._pointValues.asReadonly();
+	xScale = computed(() => {
+		const spec = this._xSpec();
+		const range = [0, this._box().innerWidth];
+		if (spec.kind === "time") return timeScale(spec.domain, range);
+		if (spec.kind === "band") return bandScale(spec.domain, range, spec.padding ?? 0);
+		return linearScale(spec.domain, range);
+	}, ...ngDevMode ? [{ debugName: "xScale" }] : /* istanbul ignore next */ []);
+	yScale = computed(() => linearScale(this._ySpec().domain, [this._box().innerHeight, 0]), ...ngDevMode ? [{ debugName: "yScale" }] : /* istanbul ignore next */ []);
+	pointPositions = computed(() => {
+		const kind = this._xSpec().kind;
+		const scale = this.xScale();
+		return this._pointValues().map((value) => kind === "band" ? scale.map(value) + scale.bandwidth / 2 : scale.map(value));
+	}, ...ngDevMode ? [{ debugName: "pointPositions" }] : /* istanbul ignore next */ []);
+	activePosition = computed(() => {
+		const index = this._activeIndex();
+		if (index === null) return null;
+		return this.pointPositions()[index] ?? null;
+	}, ...ngDevMode ? [{ debugName: "activePosition" }] : /* istanbul ignore next */ []);
+	setPointValues(values) {
+		this._pointValues.set(values);
+	}
+	setGeometry(box) {
+		this._box.set(box);
+	}
+	setSpecs(x, y) {
+		this._xSpec.set(x);
+		this._ySpec.set(y);
+	}
+	setActiveIndex(index) {
+		this._activeIndex.set(index);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ChartContext,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ChartContext
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ChartContext,
+	decorators: [{ type: Injectable }]
+});
+const ESTIMATED_CHAR_WIDTH = 6.5;
+function estimateLabelWidth(label) {
+	return label.length * ESTIMATED_CHAR_WIDTH;
+}
+function niceTicks(min, max, count) {
+	if (!Number.isFinite(min) || !Number.isFinite(max)) return [];
+	if (min === max) return [min];
+	if (max < min) return niceTicks(max, min, count);
+	const rawStep = (max - min) / Math.max(1, count);
+	const magnitude = 10 ** Math.floor(Math.log10(rawStep));
+	const normalized = rawStep / magnitude;
+	const step = magnitude * (normalized <= 1 ? 1 : normalized <= 2 ? 2 : normalized <= 5 ? 5 : 10);
+	const first = Math.floor(min / step) * step;
+	const last = Math.ceil(max / step) * step;
+	const decimals = Math.max(0, -Math.floor(Math.log10(step)));
+	const ticks = [];
+	for (let value = first; value <= last + step / 1e9; value += step) ticks.push(Number(value.toFixed(decimals)));
+	return ticks;
+}
+const SECOND = 1e3;
+const MINUTE = 60 * SECOND;
+const HOUR = 60 * MINUTE;
+const DAY$1 = 24 * HOUR;
+const STEPS = [
+	{
+		ms: SECOND,
+		unit: "second"
+	},
+	{
+		ms: 5 * SECOND,
+		unit: "second"
+	},
+	{
+		ms: 15 * SECOND,
+		unit: "second"
+	},
+	{
+		ms: 30 * SECOND,
+		unit: "second"
+	},
+	{
+		ms: MINUTE,
+		unit: "minute"
+	},
+	{
+		ms: 5 * MINUTE,
+		unit: "minute"
+	},
+	{
+		ms: 15 * MINUTE,
+		unit: "minute"
+	},
+	{
+		ms: 30 * MINUTE,
+		unit: "minute"
+	},
+	{
+		ms: HOUR,
+		unit: "hour"
+	},
+	{
+		ms: 3 * HOUR,
+		unit: "hour"
+	},
+	{
+		ms: 6 * HOUR,
+		unit: "hour"
+	},
+	{
+		ms: 12 * HOUR,
+		unit: "hour"
+	},
+	{
+		ms: DAY$1,
+		unit: "day"
+	},
+	{
+		ms: 2 * DAY$1,
+		unit: "day"
+	},
+	{
+		ms: 7 * DAY$1,
+		unit: "day"
+	},
+	{
+		ms: 30 * DAY$1,
+		unit: "month",
+		months: 1
+	},
+	{
+		ms: 90 * DAY$1,
+		unit: "month",
+		months: 3
+	},
+	{
+		ms: 365 * DAY$1,
+		unit: "year",
+		months: 12
+	}
+];
+const FORMATS = {
+	second: {
+		hour: "2-digit",
+		minute: "2-digit",
+		second: "2-digit"
+	},
+	minute: {
+		hour: "2-digit",
+		minute: "2-digit"
+	},
+	hour: {
+		hour: "2-digit",
+		minute: "2-digit"
+	},
+	day: {
+		day: "2-digit",
+		month: "2-digit"
+	},
+	month: {
+		month: "short",
+		year: "numeric"
+	},
+	year: { year: "numeric" }
+};
+const MIN_PIXELS_PER_TICK = 60;
+function timeTicks(start, end, pixelWidth) {
+	const span = end.getTime() - start.getTime();
+	const makeFormatter = (unit) => (date, locale) => new Intl.DateTimeFormat(locale, {
+		...FORMATS[unit],
+		timeZone: "UTC"
+	}).format(date);
+	if (span <= 0) return {
+		values: [start],
+		unit: "day",
+		format: makeFormatter("day")
+	};
+	const maxTicks = Math.max(2, Math.floor(pixelWidth / MIN_PIXELS_PER_TICK));
+	const coarsest = STEPS[STEPS.length - 1];
+	const chosen = STEPS.find((step) => span / step.ms + 1 <= maxTicks) ?? {
+		...coarsest,
+		months: coarsest.months * Math.max(1, Math.ceil((span / coarsest.ms + 1) / maxTicks))
+	};
+	const values = [];
+	if (chosen.months) {
+		const step = chosen.months;
+		const cursor = step >= 12 ? new Date(Date.UTC(Math.floor(start.getUTCFullYear() / (step / 12)) * (step / 12), 0, 1)) : new Date(Date.UTC(start.getUTCFullYear(), Math.floor(start.getUTCMonth() / step) * step, 1));
+		while (cursor.getTime() < start.getTime()) cursor.setUTCMonth(cursor.getUTCMonth() + step);
+		while (cursor.getTime() <= end.getTime()) {
+			values.push(new Date(cursor));
+			cursor.setUTCMonth(cursor.getUTCMonth() + step);
+		}
+	} else {
+		const first = Math.ceil(start.getTime() / chosen.ms) * chosen.ms;
+		for (let t = first; t <= end.getTime(); t += chosen.ms) values.push(new Date(t));
+	}
+	if (values.length === 0) values.push(start);
+	return {
+		values,
+		unit: chosen.unit,
+		format: makeFormatter(chosen.unit)
+	};
+}
+var ChartAxis = class ChartAxis {
+	context = inject(CHART_CONTEXT);
+	axis = input.required(...ngDevMode ? [{ debugName: "axis" }] : /* istanbul ignore next */ []);
+	locale = input.required(...ngDevMode ? [{ debugName: "locale" }] : /* istanbul ignore next */ []);
+	tickCount = input(5, ...ngDevMode ? [{ debugName: "tickCount" }] : /* istanbul ignore next */ []);
+	format = input(null, ...ngDevMode ? [{ debugName: "format" }] : /* istanbul ignore next */ []);
+	grid = input(false, {
+		...ngDevMode ? { debugName: "grid" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	groupTransform = computed(() => {
+		const box = this.context.box();
+		return this.axis() === "x" ? `translate(0,${box.innerHeight})` : "translate(0,0)";
+	}, ...ngDevMode ? [{ debugName: "groupTransform" }] : /* istanbul ignore next */ []);
+	ticks = computed(() => {
+		if (this.axis() === "y") return this.yTicks();
+		const ticks = this.xTicks();
+		if (this.context.xSpec().kind === "band") return ticks;
+		const last = ticks.length - 1;
+		return ticks.map((tick, index) => ({
+			...tick,
+			anchor: index === 0 ? "start" : index === last ? "end" : "middle"
+		}));
+	}, ...ngDevMode ? [{ debugName: "ticks" }] : /* istanbul ignore next */ []);
+	gridLines = computed(() => {
+		if (!this.grid() || this.axis() !== "y") return [];
+		return this.yTicks().map((tick) => tick.y - 4);
+	}, ...ngDevMode ? [{ debugName: "gridLines" }] : /* istanbul ignore next */ []);
+	innerWidth = computed(() => this.context.box().innerWidth, ...ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []);
+	yTicks() {
+		const spec = this.context.ySpec();
+		const scale = this.context.yScale();
+		const custom = this.format();
+		return niceTicks(spec.domain[0], spec.domain[1], this.tickCount()).map((value) => ({
+			key: `y-${value}`,
+			x: -8,
+			y: scale.map(value) + 4,
+			label: custom ? custom(value) : formatCompact(value, this.locale()),
+			date: null,
+			anchor: "end"
+		}));
+	}
+	xTicks() {
+		const spec = this.context.xSpec();
+		const box = this.context.box();
+		const custom = this.format();
+		if (spec.kind === "band") {
+			const scale = this.context.xScale();
+			const labels = spec.domain.map((category) => custom ? custom(category) : category);
+			const step = spec.domain.length === 0 ? 0 : box.innerWidth / spec.domain.length;
+			const widest = labels.reduce((large, label) => Math.max(large, estimateLabelWidth(label)), 0);
+			const keepEvery = Math.max(1, Math.ceil((widest + 8) / Math.max(step, 1)));
+			return spec.domain.map((category, index) => ({
+				key: `x-${category}`,
+				x: scale.map(category) + scale.bandwidth / 2,
+				y: 20,
+				label: labels[index],
+				date: null,
+				anchor: "middle"
+			})).filter((_, index) => index % keepEvery === 0);
+		}
+		if (spec.kind === "time") {
+			const scale = this.context.xScale();
+			const result = timeTicks(spec.domain[0], spec.domain[1], box.innerWidth);
+			const fine = result.unit === "hour" || result.unit === "minute" || result.unit === "second";
+			const multiDay = new Set(result.values.map((v) => v.toISOString().slice(0, 10))).size > 1;
+			const seen = /* @__PURE__ */ new Set();
+			return result.values.map((value) => {
+				const day = value.toISOString().slice(0, 10);
+				const first = fine && multiDay && !seen.has(day);
+				seen.add(day);
+				return {
+					key: `x-${value.getTime()}`,
+					x: scale.map(value),
+					y: first ? 14 : 20,
+					label: custom ? custom(value) : result.format(value, this.locale()),
+					date: first ? new Intl.DateTimeFormat(this.locale(), {
+						day: "2-digit",
+						month: "2-digit",
+						timeZone: "UTC"
+					}).format(value) : null,
+					anchor: "middle"
+				};
+			});
+		}
+		const scale = this.context.xScale();
+		return niceTicks(spec.domain[0], spec.domain[1], this.tickCount()).map((value) => ({
+			key: `x-${value}`,
+			x: scale.map(value),
+			y: 20,
+			label: custom ? custom(value) : formatCompact(value, this.locale()),
+			date: null,
+			anchor: "middle"
+		}));
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ChartAxis,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: ChartAxis,
+		isStandalone: true,
+		selector: "g[gbtChartAxis]",
+		inputs: {
+			axis: {
+				classPropertyName: "axis",
+				publicName: "axis",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			locale: {
+				classPropertyName: "locale",
+				publicName: "locale",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			tickCount: {
+				classPropertyName: "tickCount",
+				publicName: "tickCount",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			format: {
+				classPropertyName: "format",
+				publicName: "format",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			grid: {
+				classPropertyName: "grid",
+				publicName: "grid",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: { "aria-hidden": "true" },
+			properties: {
+				"attr.transform": "groupTransform()",
+				"attr.axis": "axis()"
+			}
+		},
+		ngImport: i0,
+		template: "@for (y of gridLines(); track $index) {\n  <svg:line\n    class=\"gbt-chart-axis__grid\"\n    x1=\"0\"\n    [attr.x2]=\"innerWidth()\"\n    [attr.y1]=\"y\"\n    [attr.y2]=\"y\"\n  />\n}\n@for (tick of ticks(); track tick.key) {\n  <svg:text\n    class=\"gbt-chart-axis__label\"\n    [attr.x]=\"tick.x\"\n    [attr.y]=\"tick.y\"\n    [attr.text-anchor]=\"tick.anchor\"\n  >\n    @if (tick.date) {\n      <svg:tspan [attr.x]=\"tick.x\" dy=\"0\">{{ tick.label }}</svg:tspan>\n      <svg:tspan [attr.x]=\"tick.x\" dy=\"1.1em\">{{ tick.date }}</svg:tspan>\n    } @else {\n      {{ tick.label }}\n    }\n  </svg:text>\n}\n",
+		styles: [".gbt-chart-axis__label{fill:var(--text-discret);font-size:.75rem;font-family:var(--font-family)}.gbt-chart-axis__grid{stroke:var(--border-color);stroke-width:1;opacity:.5}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ChartAxis,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "g[gbtChartAxis]",
+			standalone: true,
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				"[attr.transform]": "groupTransform()",
+				"[attr.axis]": "axis()",
+				"aria-hidden": "true"
+			},
+			template: "@for (y of gridLines(); track $index) {\n  <svg:line\n    class=\"gbt-chart-axis__grid\"\n    x1=\"0\"\n    [attr.x2]=\"innerWidth()\"\n    [attr.y1]=\"y\"\n    [attr.y2]=\"y\"\n  />\n}\n@for (tick of ticks(); track tick.key) {\n  <svg:text\n    class=\"gbt-chart-axis__label\"\n    [attr.x]=\"tick.x\"\n    [attr.y]=\"tick.y\"\n    [attr.text-anchor]=\"tick.anchor\"\n  >\n    @if (tick.date) {\n      <svg:tspan [attr.x]=\"tick.x\" dy=\"0\">{{ tick.label }}</svg:tspan>\n      <svg:tspan [attr.x]=\"tick.x\" dy=\"1.1em\">{{ tick.date }}</svg:tspan>\n    } @else {\n      {{ tick.label }}\n    }\n  </svg:text>\n}\n",
+			styles: [".gbt-chart-axis__label{fill:var(--text-discret);font-size:.75rem;font-family:var(--font-family)}.gbt-chart-axis__grid{stroke:var(--border-color);stroke-width:1;opacity:.5}\n"]
+		}]
+	}],
+	propDecorators: {
+		axis: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "axis",
+				required: true
+			}]
+		}],
+		locale: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "locale",
+				required: true
+			}]
+		}],
+		tickCount: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tickCount",
+				required: false
+			}]
+		}],
+		format: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "format",
+				required: false
+			}]
+		}],
+		grid: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "grid",
+				required: false
+			}]
+		}]
+	}
+});
+const DAY = 864e5;
+function yDomain(series, includeZero) {
+	const values = series.flatMap((s) => s.points.map((p) => p.y));
+	if (values.length === 0) return [0, 1];
+	let min = Math.min(...values);
+	let max = Math.max(...values);
+	if (includeZero) {
+		min = Math.min(min, 0);
+		max = Math.max(max, 0);
+	}
+	if (min === max) return [min, min + 1];
+	return [min, max];
+}
+function numericXDomain(series) {
+	const values = series.flatMap((s) => s.points.map((p) => p.x));
+	if (values.length === 0) return [0, 1];
+	const min = Math.min(...values);
+	const max = Math.max(...values);
+	return min === max ? [min, min + 1] : [min, max];
+}
+function timeXDomain(series) {
+	const values = series.flatMap((s) => s.points.map((p) => p.x.getTime()));
+	if (values.length === 0) return [/* @__PURE__ */ new Date(-864e5), /* @__PURE__ */ new Date(0)];
+	const min = Math.min(...values);
+	const max = Math.max(...values);
+	return min === max ? [new Date(min), new Date(min + DAY)] : [new Date(min), new Date(max)];
+}
+function niceYDomain(series, includeZero, tickCount) {
+	const [min, max] = yDomain(series, includeZero);
+	const ticks = niceTicks(min, max, tickCount);
+	if (ticks.length === 0) return [min, max];
+	return [ticks[0], ticks[ticks.length - 1]];
+}
+function niceXDomain(series, tickCount) {
+	const [min, max] = numericXDomain(series);
+	const ticks = niceTicks(min, max, tickCount);
+	if (ticks.length === 0) return [min, max];
+	return [ticks[0], ticks[ticks.length - 1]];
+}
+var ChartEmpty = class ChartEmpty {
+	message = input.required(...ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []);
+	actionLabel = input("", ...ngDevMode ? [{ debugName: "actionLabel" }] : /* istanbul ignore next */ []);
+	action = output();
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ChartEmpty,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: ChartEmpty,
+		isStandalone: true,
+		selector: "gbt-chart-empty",
+		inputs: {
+			message: {
+				classPropertyName: "message",
+				publicName: "message",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			actionLabel: {
+				classPropertyName: "actionLabel",
+				publicName: "actionLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { action: "action" },
+		ngImport: i0,
+		template: "<div class=\"gbt-chart-empty\" role=\"status\">\n  <div class=\"gbt-chart-empty__icon\" aria-hidden=\"true\">\n    <ng-content select=\"[gbtChartEmptyIcon]\" />\n  </div>\n  <p class=\"gbt-chart-empty__message\">{{ message() }}</p>\n  @if (actionLabel()) {\n    <button type=\"button\" class=\"gbt-chart-empty__action\" (click)=\"action.emit()\">\n      {{ actionLabel() }}\n    </button>\n  }\n</div>\n",
+		styles: [".gbt-chart-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;min-height:8rem;padding:1.5rem;color:var(--text-secondary);text-align:center}.gbt-chart-empty__icon{width:64px;height:64px;color:var(--text-discret)}.gbt-chart-empty__icon:empty{display:none}.gbt-chart-empty__icon svg{width:100%;height:100%}.gbt-chart-empty__message{margin:0;font-size:.875rem}.gbt-chart-empty__action{min-width:24px;min-height:24px;padding:.375rem .75rem;border:1px solid var(--border-color);border-radius:var(--site-border-radius);background:transparent;color:var(--primary);font:inherit;cursor:pointer}.gbt-chart-empty__action:hover{background:var(--bg-hover)}.gbt-chart-empty__action:focus-visible{outline:2px solid var(--gbt-focus-ring, var(--focus-ring));outline-offset:2px}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ChartEmpty,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "gbt-chart-empty",
+			standalone: true,
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<div class=\"gbt-chart-empty\" role=\"status\">\n  <div class=\"gbt-chart-empty__icon\" aria-hidden=\"true\">\n    <ng-content select=\"[gbtChartEmptyIcon]\" />\n  </div>\n  <p class=\"gbt-chart-empty__message\">{{ message() }}</p>\n  @if (actionLabel()) {\n    <button type=\"button\" class=\"gbt-chart-empty__action\" (click)=\"action.emit()\">\n      {{ actionLabel() }}\n    </button>\n  }\n</div>\n",
+			styles: [".gbt-chart-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;min-height:8rem;padding:1.5rem;color:var(--text-secondary);text-align:center}.gbt-chart-empty__icon{width:64px;height:64px;color:var(--text-discret)}.gbt-chart-empty__icon:empty{display:none}.gbt-chart-empty__icon svg{width:100%;height:100%}.gbt-chart-empty__message{margin:0;font-size:.875rem}.gbt-chart-empty__action{min-width:24px;min-height:24px;padding:.375rem .75rem;border:1px solid var(--border-color);border-radius:var(--site-border-radius);background:transparent;color:var(--primary);font:inherit;cursor:pointer}.gbt-chart-empty__action:hover{background:var(--bg-hover)}.gbt-chart-empty__action:focus-visible{outline:2px solid var(--gbt-focus-ring, var(--focus-ring));outline-offset:2px}\n"]
+		}]
+	}],
+	propDecorators: {
+		message: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "message",
+				required: true
+			}]
+		}],
+		actionLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "actionLabel",
+				required: false
+			}]
+		}],
+		action: [{
+			type: i0.Output,
+			args: ["action"]
+		}]
+	}
+});
+function nearestIndex(sorted, target) {
+	if (sorted.length === 0) return -1;
+	let low = 0;
+	let high = sorted.length - 1;
+	while (low < high) {
+		const mid = low + high >> 1;
+		if (sorted[mid] < target) low = mid + 1;
+		else high = mid;
+	}
+	const previous = low - 1;
+	if (previous < 0) return low;
+	return target - sorted[previous] <= sorted[low] - target ? previous : low;
+}
+const DEFAULT_MARGIN = {
+	top: 16,
+	right: 8,
+	bottom: 32,
+	left: 48
+};
+var ChartFrame = class ChartFrame {
+	context = inject(ChartContext);
+	label = input.required(...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	heading = input("", ...ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []);
+	headingLevel = input(2, ...ngDevMode ? [{ debugName: "headingLevel" }] : /* istanbul ignore next */ []);
+	headline = input("", ...ngDevMode ? [{ debugName: "headline" }] : /* istanbul ignore next */ []);
+	trend = input("", ...ngDevMode ? [{ debugName: "trend" }] : /* istanbul ignore next */ []);
+	x = input.required(...ngDevMode ? [{ debugName: "x" }] : /* istanbul ignore next */ []);
+	y = input.required(...ngDevMode ? [{ debugName: "y" }] : /* istanbul ignore next */ []);
+	margin = input({}, ...ngDevMode ? [{ debugName: "margin" }] : /* istanbul ignore next */ []);
+	size = input(null, ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	pointValues = input([], ...ngDevMode ? [{ debugName: "pointValues" }] : /* istanbul ignore next */ []);
+	activeIndexChange = output();
+	surface = viewChild.required("surface", ...ngDevMode ? [{ debugName: "surface" }] : /* istanbul ignore next */ []);
+	measured = signal(null, ...ngDevMode ? [{ debugName: "measured" }] : /* istanbul ignore next */ []);
+	ready = computed(() => this.context.box().innerWidth > 0, ...ngDevMode ? [{ debugName: "ready" }] : /* istanbul ignore next */ []);
+	viewBox = computed(() => {
+		const b = this.context.box();
+		return `0 0 ${b.width} ${b.height}`;
+	}, ...ngDevMode ? [{ debugName: "viewBox" }] : /* istanbul ignore next */ []);
+	innerTransform = computed(() => {
+		const m = this.context.box().margin;
+		return `translate(${m.left},${m.top})`;
+	}, ...ngDevMode ? [{ debugName: "innerTransform" }] : /* istanbul ignore next */ []);
+	activePosition = computed(() => this.context.activePosition(), ...ngDevMode ? [{ debugName: "activePosition" }] : /* istanbul ignore next */ []);
+	innerHeight = computed(() => this.context.box().innerHeight, ...ngDevMode ? [{ debugName: "innerHeight" }] : /* istanbul ignore next */ []);
+	constructor() {
+		effect(() => this.activeIndexChange.emit(this.context.activeIndex()));
+		effect(() => {
+			const margin = {
+				...DEFAULT_MARGIN,
+				...this.margin()
+			};
+			const size = this.size() ?? this.measured();
+			const width = size?.width ?? 0;
+			const height = size?.height ?? 0;
+			this.context.setSpecs(this.x(), this.y());
+			this.context.setPointValues(this.pointValues());
+			this.context.setGeometry({
+				width,
+				height,
+				margin,
+				innerWidth: Math.max(0, width - margin.left - margin.right),
+				innerHeight: Math.max(0, height - margin.top - margin.bottom)
+			});
+		});
+		effect((onCleanup) => {
+			if (this.size() || typeof ResizeObserver === "undefined") return;
+			const element = this.surface().nativeElement;
+			const observer = new ResizeObserver((entries) => {
+				const rect = entries[0]?.contentRect;
+				if (rect) this.measured.set({
+					width: rect.width,
+					height: rect.height
+				});
+			});
+			observer.observe(element);
+			onCleanup(() => observer.disconnect());
+		});
+	}
+	onKeydown(event) {
+		const count = this.pointValues().length;
+		if (count === 0) return;
+		const current = this.context.activeIndex();
+		const last = count - 1;
+		switch (event.key) {
+			case "ArrowRight":
+				this.context.setActiveIndex(current === null ? 0 : Math.min(last, current + 1));
+				break;
+			case "ArrowLeft":
+				this.context.setActiveIndex(current === null ? last : Math.max(0, current - 1));
+				break;
+			case "Home":
+				this.context.setActiveIndex(0);
+				break;
+			case "End":
+				this.context.setActiveIndex(last);
+				break;
+			case "Escape":
+				this.context.setActiveIndex(null);
+				break;
+			default: return;
+		}
+		event.preventDefault();
+	}
+	onBlur() {
+		this.context.setActiveIndex(null);
+	}
+	onPointerMove(event) {
+		const positions = this.context.pointPositions();
+		if (positions.length === 0) return;
+		const rect = event.currentTarget.getBoundingClientRect();
+		const local = event.clientX - rect.left - this.context.box().margin.left;
+		this.context.setActiveIndex(nearestIndex(positions, local));
+	}
+	onPointerLeave(event) {
+		const surface = event.currentTarget;
+		if (surface.ownerDocument.activeElement === surface) return;
+		this.context.setActiveIndex(null);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ChartFrame,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: ChartFrame,
+		isStandalone: true,
+		selector: "gbt-chart-frame",
+		inputs: {
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			heading: {
+				classPropertyName: "heading",
+				publicName: "heading",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			headingLevel: {
+				classPropertyName: "headingLevel",
+				publicName: "headingLevel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			headline: {
+				classPropertyName: "headline",
+				publicName: "headline",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			trend: {
+				classPropertyName: "trend",
+				publicName: "trend",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			x: {
+				classPropertyName: "x",
+				publicName: "x",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			y: {
+				classPropertyName: "y",
+				publicName: "y",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			margin: {
+				classPropertyName: "margin",
+				publicName: "margin",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			pointValues: {
+				classPropertyName: "pointValues",
+				publicName: "pointValues",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { activeIndexChange: "activeIndexChange" },
+		providers: [ChartContext, {
+			provide: CHART_CONTEXT,
+			useExisting: ChartContext
+		}],
+		viewQueries: [{
+			propertyName: "surface",
+			first: true,
+			predicate: ["surface"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "<div class=\"gbt-chart-frame\">\n  @if (heading()) {\n    <div class=\"gbt-chart-frame__header\">\n      @switch (headingLevel()) {\n        @case (1) {\n          <h1 class=\"gbt-chart-frame__title\">{{ heading() }}</h1>\n        }\n        @case (3) {\n          <h3 class=\"gbt-chart-frame__title\">{{ heading() }}</h3>\n        }\n        @case (4) {\n          <h4 class=\"gbt-chart-frame__title\">{{ heading() }}</h4>\n        }\n        @case (5) {\n          <h5 class=\"gbt-chart-frame__title\">{{ heading() }}</h5>\n        }\n        @case (6) {\n          <h6 class=\"gbt-chart-frame__title\">{{ heading() }}</h6>\n        }\n        @default {\n          <h2 class=\"gbt-chart-frame__title\">{{ heading() }}</h2>\n        }\n      }\n      @if (headline()) {\n        <p class=\"gbt-chart-frame__headline\">{{ headline() }}</p>\n      }\n      @if (trend()) {\n        <p class=\"gbt-chart-frame__trend\">{{ trend() }}</p>\n      }\n    </div>\n  }\n\n  <div\n    #surface\n    class=\"gbt-chart-frame__surface\"\n    [attr.tabindex]=\"ready() && pointValues().length > 0 ? 0 : null\"\n    [attr.role]=\"ready() ? 'group' : null\"\n    [attr.aria-label]=\"ready() ? label() : null\"\n    (keydown)=\"onKeydown($event)\"\n    (blur)=\"onBlur()\"\n    (pointermove)=\"onPointerMove($event)\"\n    (pointerleave)=\"onPointerLeave($event)\"\n  >\n    @if (ready()) {\n      <svg\n        class=\"gbt-chart-frame__svg\"\n        [attr.viewBox]=\"viewBox()\"\n        role=\"presentation\"\n        focusable=\"false\"\n      >\n        <g [attr.transform]=\"innerTransform()\">\n          <ng-content select=\"[gbtChartLayer]\" />\n          @if (activePosition() !== null) {\n            <line\n              class=\"gbt-chart-frame__guide\"\n              [attr.x1]=\"activePosition()\"\n              [attr.x2]=\"activePosition()\"\n              y1=\"0\"\n              [attr.y2]=\"innerHeight()\"\n              aria-hidden=\"true\"\n            />\n          }\n        </g>\n      </svg>\n      <ng-content select=\"gbt-chart-tooltip\" />\n    }\n  </div>\n  <ng-content select=\"gbt-chart-empty\" />\n  <ng-content select=\"gbt-chart-table\" />\n</div>\n",
+		styles: [":host{display:block}.gbt-chart-frame{position:relative;width:100%;height:100%;display:flex;flex-direction:column}.gbt-chart-frame__surface{flex:1;min-height:0;position:relative}.gbt-chart-frame__surface:focus-visible{outline:2px solid var(--gbt-focus-ring, var(--focus-ring));outline-offset:2px}.gbt-chart-frame__svg{display:block;width:100%;height:100%}.gbt-chart-frame__guide{stroke:var(--border-color);stroke-width:1;pointer-events:none}.gbt-chart-frame__header{display:grid;grid-template-columns:1fr auto;align-items:baseline;column-gap:.75rem;margin-bottom:.5rem}.gbt-chart-frame__title{font-family:var(--gbt-font-display, var(--font-display));margin:0;font-size:.875rem;font-weight:600;color:var(--text-primary)}.gbt-chart-frame__headline{margin:0;grid-row:1;grid-column:2;font-size:1.375rem;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text-primary)}.gbt-chart-frame__trend{margin:0;grid-column:2;justify-self:end;font-size:.6875rem;font-weight:600;color:var(--text-secondary)}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ChartFrame,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "gbt-chart-frame",
+			standalone: true,
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			providers: [ChartContext, {
+				provide: CHART_CONTEXT,
+				useExisting: ChartContext
+			}],
+			template: "<div class=\"gbt-chart-frame\">\n  @if (heading()) {\n    <div class=\"gbt-chart-frame__header\">\n      @switch (headingLevel()) {\n        @case (1) {\n          <h1 class=\"gbt-chart-frame__title\">{{ heading() }}</h1>\n        }\n        @case (3) {\n          <h3 class=\"gbt-chart-frame__title\">{{ heading() }}</h3>\n        }\n        @case (4) {\n          <h4 class=\"gbt-chart-frame__title\">{{ heading() }}</h4>\n        }\n        @case (5) {\n          <h5 class=\"gbt-chart-frame__title\">{{ heading() }}</h5>\n        }\n        @case (6) {\n          <h6 class=\"gbt-chart-frame__title\">{{ heading() }}</h6>\n        }\n        @default {\n          <h2 class=\"gbt-chart-frame__title\">{{ heading() }}</h2>\n        }\n      }\n      @if (headline()) {\n        <p class=\"gbt-chart-frame__headline\">{{ headline() }}</p>\n      }\n      @if (trend()) {\n        <p class=\"gbt-chart-frame__trend\">{{ trend() }}</p>\n      }\n    </div>\n  }\n\n  <div\n    #surface\n    class=\"gbt-chart-frame__surface\"\n    [attr.tabindex]=\"ready() && pointValues().length > 0 ? 0 : null\"\n    [attr.role]=\"ready() ? 'group' : null\"\n    [attr.aria-label]=\"ready() ? label() : null\"\n    (keydown)=\"onKeydown($event)\"\n    (blur)=\"onBlur()\"\n    (pointermove)=\"onPointerMove($event)\"\n    (pointerleave)=\"onPointerLeave($event)\"\n  >\n    @if (ready()) {\n      <svg\n        class=\"gbt-chart-frame__svg\"\n        [attr.viewBox]=\"viewBox()\"\n        role=\"presentation\"\n        focusable=\"false\"\n      >\n        <g [attr.transform]=\"innerTransform()\">\n          <ng-content select=\"[gbtChartLayer]\" />\n          @if (activePosition() !== null) {\n            <line\n              class=\"gbt-chart-frame__guide\"\n              [attr.x1]=\"activePosition()\"\n              [attr.x2]=\"activePosition()\"\n              y1=\"0\"\n              [attr.y2]=\"innerHeight()\"\n              aria-hidden=\"true\"\n            />\n          }\n        </g>\n      </svg>\n      <ng-content select=\"gbt-chart-tooltip\" />\n    }\n  </div>\n  <ng-content select=\"gbt-chart-empty\" />\n  <ng-content select=\"gbt-chart-table\" />\n</div>\n",
+			styles: [":host{display:block}.gbt-chart-frame{position:relative;width:100%;height:100%;display:flex;flex-direction:column}.gbt-chart-frame__surface{flex:1;min-height:0;position:relative}.gbt-chart-frame__surface:focus-visible{outline:2px solid var(--gbt-focus-ring, var(--focus-ring));outline-offset:2px}.gbt-chart-frame__svg{display:block;width:100%;height:100%}.gbt-chart-frame__guide{stroke:var(--border-color);stroke-width:1;pointer-events:none}.gbt-chart-frame__header{display:grid;grid-template-columns:1fr auto;align-items:baseline;column-gap:.75rem;margin-bottom:.5rem}.gbt-chart-frame__title{font-family:var(--gbt-font-display, var(--font-display));margin:0;font-size:.875rem;font-weight:600;color:var(--text-primary)}.gbt-chart-frame__headline{margin:0;grid-row:1;grid-column:2;font-size:1.375rem;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text-primary)}.gbt-chart-frame__trend{margin:0;grid-column:2;justify-self:end;font-size:.6875rem;font-weight:600;color:var(--text-secondary)}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: true
+			}]
+		}],
+		heading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "heading",
+				required: false
+			}]
+		}],
+		headingLevel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "headingLevel",
+				required: false
+			}]
+		}],
+		headline: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "headline",
+				required: false
+			}]
+		}],
+		trend: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "trend",
+				required: false
+			}]
+		}],
+		x: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "x",
+				required: true
+			}]
+		}],
+		y: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "y",
+				required: true
+			}]
+		}],
+		margin: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "margin",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		pointValues: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "pointValues",
+				required: false
+			}]
+		}],
+		activeIndexChange: [{
+			type: i0.Output,
+			args: ["activeIndexChange"]
+		}],
+		surface: [{
+			type: i0.ViewChild,
+			args: ["surface", { isSignal: true }]
+		}]
+	}
+});
+const DASH_ARRAYS = {
+	solid: "none",
+	dashed: "6 3",
+	dotted: "1 3"
+};
+var ChartLegend = class ChartLegend {
+	entries = input.required(...ngDevMode ? [{ debugName: "entries" }] : /* istanbul ignore next */ []);
+	interactive = input(false, {
+		...ngDevMode ? { debugName: "interactive" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	activeIndex = input(null, ...ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []);
+	activeIndexChange = output();
+	dashArray(pattern) {
+		return DASH_ARRAYS[pattern ?? "solid"];
+	}
+	onMouseLeave(event) {
+		const target = event.currentTarget;
+		if (target.ownerDocument.activeElement === target) return;
+		this.activeIndexChange.emit(null);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ChartLegend,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: ChartLegend,
+		isStandalone: true,
+		selector: "gbt-chart-legend",
+		inputs: {
+			entries: {
+				classPropertyName: "entries",
+				publicName: "entries",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			interactive: {
+				classPropertyName: "interactive",
+				publicName: "interactive",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			activeIndex: {
+				classPropertyName: "activeIndex",
+				publicName: "activeIndex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { activeIndexChange: "activeIndexChange" },
+		ngImport: i0,
+		template: "<ul class=\"gbt-chart-legend\">\n  @for (entry of entries(); track $index) {\n    <li\n      class=\"gbt-chart-legend__item\"\n      [class.gbt-chart-legend__item--active]=\"interactive() && activeIndex() === $index\"\n      [attr.data-pattern]=\"entry.pattern ?? 'solid'\"\n      [attr.tabindex]=\"interactive() ? 0 : null\"\n      (mouseenter)=\"interactive() && activeIndexChange.emit($index)\"\n      (mouseleave)=\"interactive() && onMouseLeave($event)\"\n      (focus)=\"interactive() && activeIndexChange.emit($index)\"\n      (blur)=\"interactive() && activeIndexChange.emit(null)\"\n    >\n      <svg class=\"gbt-chart-legend__swatch\" viewBox=\"0 0 24 8\" aria-hidden=\"true\" focusable=\"false\">\n        @if (entry.color; as color) {\n          <rect\n            class=\"gbt-chart-legend__fill\"\n            x=\"4\"\n            y=\"0\"\n            width=\"8\"\n            height=\"8\"\n            rx=\"2\"\n            [attr.fill]=\"color\"\n          />\n        } @else {\n          <line\n            class=\"gbt-chart-legend__line\"\n            x1=\"0\"\n            y1=\"4\"\n            x2=\"24\"\n            y2=\"4\"\n            [attr.stroke-dasharray]=\"dashArray(entry.pattern)\"\n            stroke-width=\"2\"\n          />\n        }\n      </svg>\n      {{ entry.label }}\n      @if (entry.value; as value) {\n        <span class=\"gbt-chart-legend__value\">{{ value }}</span>\n      }\n    </li>\n  }\n</ul>\n",
+		styles: [".gbt-chart-legend{display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;margin:0;padding:0;list-style:none;font-size:.8125rem;color:var(--text-secondary)}.gbt-chart-legend__item{display:inline-flex;align-items:center;gap:.375rem;border-radius:var(--site-border-radius-sm)}.gbt-chart-legend__item:nth-child(3n+1) .gbt-chart-legend__line{stroke:var(--chart-series-1-base)}.gbt-chart-legend__item:nth-child(3n+2) .gbt-chart-legend__line{stroke:var(--chart-series-2-base)}.gbt-chart-legend__item:nth-child(3n+3) .gbt-chart-legend__line{stroke:var(--chart-series-3-base)}.gbt-chart-legend__item[tabindex]{cursor:default;padding:.125rem .25rem;margin:-.125rem -.25rem}.gbt-chart-legend__item[tabindex]:focus-visible{outline:2px solid var(--gbt-focus-ring, var(--focus-ring));outline-offset:1px}.gbt-chart-legend__item--active{background:var(--bg-hover)}.gbt-chart-legend__swatch{width:1.5rem;height:.5rem;flex:none}.gbt-chart-legend__value{margin-left:.375rem;font-variant-numeric:tabular-nums;font-weight:600;color:var(--text-primary)}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ChartLegend,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "gbt-chart-legend",
+			standalone: true,
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<ul class=\"gbt-chart-legend\">\n  @for (entry of entries(); track $index) {\n    <li\n      class=\"gbt-chart-legend__item\"\n      [class.gbt-chart-legend__item--active]=\"interactive() && activeIndex() === $index\"\n      [attr.data-pattern]=\"entry.pattern ?? 'solid'\"\n      [attr.tabindex]=\"interactive() ? 0 : null\"\n      (mouseenter)=\"interactive() && activeIndexChange.emit($index)\"\n      (mouseleave)=\"interactive() && onMouseLeave($event)\"\n      (focus)=\"interactive() && activeIndexChange.emit($index)\"\n      (blur)=\"interactive() && activeIndexChange.emit(null)\"\n    >\n      <svg class=\"gbt-chart-legend__swatch\" viewBox=\"0 0 24 8\" aria-hidden=\"true\" focusable=\"false\">\n        @if (entry.color; as color) {\n          <rect\n            class=\"gbt-chart-legend__fill\"\n            x=\"4\"\n            y=\"0\"\n            width=\"8\"\n            height=\"8\"\n            rx=\"2\"\n            [attr.fill]=\"color\"\n          />\n        } @else {\n          <line\n            class=\"gbt-chart-legend__line\"\n            x1=\"0\"\n            y1=\"4\"\n            x2=\"24\"\n            y2=\"4\"\n            [attr.stroke-dasharray]=\"dashArray(entry.pattern)\"\n            stroke-width=\"2\"\n          />\n        }\n      </svg>\n      {{ entry.label }}\n      @if (entry.value; as value) {\n        <span class=\"gbt-chart-legend__value\">{{ value }}</span>\n      }\n    </li>\n  }\n</ul>\n",
+			styles: [".gbt-chart-legend{display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;margin:0;padding:0;list-style:none;font-size:.8125rem;color:var(--text-secondary)}.gbt-chart-legend__item{display:inline-flex;align-items:center;gap:.375rem;border-radius:var(--site-border-radius-sm)}.gbt-chart-legend__item:nth-child(3n+1) .gbt-chart-legend__line{stroke:var(--chart-series-1-base)}.gbt-chart-legend__item:nth-child(3n+2) .gbt-chart-legend__line{stroke:var(--chart-series-2-base)}.gbt-chart-legend__item:nth-child(3n+3) .gbt-chart-legend__line{stroke:var(--chart-series-3-base)}.gbt-chart-legend__item[tabindex]{cursor:default;padding:.125rem .25rem;margin:-.125rem -.25rem}.gbt-chart-legend__item[tabindex]:focus-visible{outline:2px solid var(--gbt-focus-ring, var(--focus-ring));outline-offset:1px}.gbt-chart-legend__item--active{background:var(--bg-hover)}.gbt-chart-legend__swatch{width:1.5rem;height:.5rem;flex:none}.gbt-chart-legend__value{margin-left:.375rem;font-variant-numeric:tabular-nums;font-weight:600;color:var(--text-primary)}\n"]
+		}]
+	}],
+	propDecorators: {
+		entries: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "entries",
+				required: true
+			}]
+		}],
+		interactive: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "interactive",
+				required: false
+			}]
+		}],
+		activeIndex: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "activeIndex",
+				required: false
+			}]
+		}],
+		activeIndexChange: [{
+			type: i0.Output,
+			args: ["activeIndexChange"]
+		}]
+	}
+});
+var ChartTable = class ChartTable {
+	caption = input.required(...ngDevMode ? [{ debugName: "caption" }] : /* istanbul ignore next */ []);
+	columns = input.required(...ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []);
+	rows = input.required(...ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ChartTable,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: ChartTable,
+		isStandalone: true,
+		selector: "gbt-chart-table",
+		inputs: {
+			caption: {
+				classPropertyName: "caption",
+				publicName: "caption",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			columns: {
+				classPropertyName: "columns",
+				publicName: "columns",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			rows: {
+				classPropertyName: "rows",
+				publicName: "rows",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<div class=\"gbt-sr-only\">\n  <table>\n    <caption>\n      {{\n        caption()\n      }}\n    </caption>\n    <thead>\n      <tr>\n        @for (column of columns(); track column) {\n          <th scope=\"col\">{{ column }}</th>\n        }\n      </tr>\n    </thead>\n    <tbody>\n      @for (row of rows(); track $index) {\n        <tr>\n          @for (cell of row; track $index) {\n            <td>{{ cell }}</td>\n          }\n        </tr>\n      }\n    </tbody>\n  </table>\n</div>\n",
+		styles: [".gbt-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ChartTable,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "gbt-chart-table",
+			standalone: true,
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<div class=\"gbt-sr-only\">\n  <table>\n    <caption>\n      {{\n        caption()\n      }}\n    </caption>\n    <thead>\n      <tr>\n        @for (column of columns(); track column) {\n          <th scope=\"col\">{{ column }}</th>\n        }\n      </tr>\n    </thead>\n    <tbody>\n      @for (row of rows(); track $index) {\n        <tr>\n          @for (cell of row; track $index) {\n            <td>{{ cell }}</td>\n          }\n        </tr>\n      }\n    </tbody>\n  </table>\n</div>\n",
+			styles: [".gbt-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}\n"]
+		}]
+	}],
+	propDecorators: {
+		caption: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "caption",
+				required: true
+			}]
+		}],
+		columns: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "columns",
+				required: true
+			}]
+		}],
+		rows: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "rows",
+				required: true
+			}]
+		}]
+	}
+});
+var ChartTooltip = class ChartTooltip {
+	context = inject(CHART_CONTEXT);
+	points = input.required(...ngDevMode ? [{ debugName: "points" }] : /* istanbul ignore next */ []);
+	active = computed(() => {
+		const index = this.context.activeIndex();
+		if (index === null) return null;
+		return this.points()[index] ?? null;
+	}, ...ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []);
+	left = computed(() => {
+		const position = this.context.activePosition();
+		if (position === null) return 0;
+		return position + this.context.box().margin.left;
+	}, ...ngDevMode ? [{ debugName: "left" }] : /* istanbul ignore next */ []);
+	anchor = computed(() => {
+		const index = this.context.activeIndex();
+		if (index === null) return "middle";
+		const last = this.context.pointValues().length - 1;
+		return index === 0 ? "start" : index === last ? "end" : "middle";
+	}, ...ngDevMode ? [{ debugName: "anchor" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ChartTooltip,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: ChartTooltip,
+		isStandalone: true,
+		selector: "gbt-chart-tooltip",
+		inputs: { points: {
+			classPropertyName: "points",
+			publicName: "points",
+			isSignal: true,
+			isRequired: true,
+			transformFunction: null
+		} },
+		ngImport: i0,
+		template: "<div class=\"gbt-chart-tooltip\" role=\"status\" aria-live=\"polite\">\n  @if (active(); as point) {\n    <div class=\"gbt-chart-tooltip__panel\" [style.left.px]=\"left()\" [attr.data-anchor]=\"anchor()\">\n      <p class=\"gbt-chart-tooltip__header\">{{ point.header }}</p>\n      <ul class=\"gbt-chart-tooltip__rows\">\n        @for (row of point.rows; track $index) {\n          <li>\n            <span\n              class=\"gbt-chart-tooltip__swatch\"\n              [attr.data-series]=\"row.series ?? null\"\n              [attr.data-pattern]=\"row.pattern ?? 'solid'\"\n              aria-hidden=\"true\"\n            ></span>\n            <span class=\"gbt-chart-tooltip__label\">{{ row.label }}</span>\n            <span class=\"gbt-chart-tooltip__value\">{{ row.value }}</span>\n          </li>\n        }\n      </ul>\n    </div>\n  }\n</div>\n",
+		styles: [".gbt-chart-tooltip__panel{position:absolute;top:0;padding:.375rem .625rem;border:1px solid var(--border-color);border-radius:var(--site-border-radius);background:var(--bg-principal);color:var(--text-primary);font-size:.8125rem;pointer-events:none;white-space:nowrap}.gbt-chart-tooltip__panel[data-anchor=start]{transform:translate(0)}.gbt-chart-tooltip__panel[data-anchor=middle]{transform:translate(-50%)}.gbt-chart-tooltip__panel[data-anchor=end]{transform:translate(-100%)}.gbt-chart-tooltip__header{margin:0 0 .25rem;font-weight:600}.gbt-chart-tooltip__rows{margin:0;padding:0;list-style:none}.gbt-chart-tooltip__rows li{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem}.gbt-chart-tooltip__label{color:var(--text-secondary)}.gbt-chart-tooltip__value{font-variant-numeric:tabular-nums;font-weight:600}.gbt-chart-tooltip__swatch{width:10px;height:10px;border-radius:50%}.gbt-chart-tooltip__swatch[data-series=\"1\"]{background:var(--chart-series-1-base)}.gbt-chart-tooltip__swatch[data-series=\"2\"]{background:var(--chart-series-2-base)}.gbt-chart-tooltip__swatch[data-series=\"3\"]{background:var(--chart-series-3-base)}.gbt-chart-tooltip__swatch[data-pattern=dashed]{border-radius:2px}.gbt-chart-tooltip__swatch[data-pattern=dotted]{border-radius:50%;transform:scale(.7)}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ChartTooltip,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "gbt-chart-tooltip",
+			standalone: true,
+			imports: [],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<div class=\"gbt-chart-tooltip\" role=\"status\" aria-live=\"polite\">\n  @if (active(); as point) {\n    <div class=\"gbt-chart-tooltip__panel\" [style.left.px]=\"left()\" [attr.data-anchor]=\"anchor()\">\n      <p class=\"gbt-chart-tooltip__header\">{{ point.header }}</p>\n      <ul class=\"gbt-chart-tooltip__rows\">\n        @for (row of point.rows; track $index) {\n          <li>\n            <span\n              class=\"gbt-chart-tooltip__swatch\"\n              [attr.data-series]=\"row.series ?? null\"\n              [attr.data-pattern]=\"row.pattern ?? 'solid'\"\n              aria-hidden=\"true\"\n            ></span>\n            <span class=\"gbt-chart-tooltip__label\">{{ row.label }}</span>\n            <span class=\"gbt-chart-tooltip__value\">{{ row.value }}</span>\n          </li>\n        }\n      </ul>\n    </div>\n  }\n</div>\n",
+			styles: [".gbt-chart-tooltip__panel{position:absolute;top:0;padding:.375rem .625rem;border:1px solid var(--border-color);border-radius:var(--site-border-radius);background:var(--bg-principal);color:var(--text-primary);font-size:.8125rem;pointer-events:none;white-space:nowrap}.gbt-chart-tooltip__panel[data-anchor=start]{transform:translate(0)}.gbt-chart-tooltip__panel[data-anchor=middle]{transform:translate(-50%)}.gbt-chart-tooltip__panel[data-anchor=end]{transform:translate(-100%)}.gbt-chart-tooltip__header{margin:0 0 .25rem;font-weight:600}.gbt-chart-tooltip__rows{margin:0;padding:0;list-style:none}.gbt-chart-tooltip__rows li{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem}.gbt-chart-tooltip__label{color:var(--text-secondary)}.gbt-chart-tooltip__value{font-variant-numeric:tabular-nums;font-weight:600}.gbt-chart-tooltip__swatch{width:10px;height:10px;border-radius:50%}.gbt-chart-tooltip__swatch[data-series=\"1\"]{background:var(--chart-series-1-base)}.gbt-chart-tooltip__swatch[data-series=\"2\"]{background:var(--chart-series-2-base)}.gbt-chart-tooltip__swatch[data-series=\"3\"]{background:var(--chart-series-3-base)}.gbt-chart-tooltip__swatch[data-pattern=dashed]{border-radius:2px}.gbt-chart-tooltip__swatch[data-pattern=dotted]{border-radius:50%;transform:scale(.7)}\n"]
+		}]
+	}],
+	propDecorators: { points: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "points",
+			required: true
+		}]
+	}] }
+});
+const round = (n) => Number(n.toFixed(2));
+function linePath(points) {
+	if (points.length === 0) return "";
+	return points.map((point, index) => `${index === 0 ? "M" : "L"}${round(point.x)},${round(point.y)}`).join("");
+}
+function areaPath(points, baseline) {
+	if (points.length === 0) return "";
+	const last = points[points.length - 1];
+	const first = points[0];
+	return `${linePath(points)}L${round(last.x)},${round(baseline)}L${round(first.x)},${round(baseline)}Z`;
+}
+function arcPoint(radius, angle) {
+	return {
+		x: radius * Math.sin(angle),
+		y: -radius * Math.cos(angle)
+	};
+}
+function point(p) {
+	return `${round(p.x)},${round(p.y)}`;
+}
+const FULL_CIRCLE = Math.PI * 2;
+function arcPath(arc) {
+	const { startAngle, endAngle, innerRadius, outerRadius } = arc;
+	const span = endAngle - startAngle;
+	if (span <= 0) return "";
+	if (span >= FULL_CIRCLE - 1e-9) {
+		const mid = startAngle + Math.PI;
+		return arcPath({
+			startAngle,
+			endAngle: mid,
+			innerRadius,
+			outerRadius
+		}) + arcPath({
+			startAngle: mid,
+			endAngle: startAngle + FULL_CIRCLE,
+			innerRadius,
+			outerRadius
+		});
+	}
+	const largeArc = span > Math.PI ? 1 : 0;
+	const outerStart = arcPoint(outerRadius, startAngle);
+	const outerEnd = arcPoint(outerRadius, endAngle);
+	const outerArc = `A${round(outerRadius)},${round(outerRadius)} 0 ${largeArc},1 ${point(outerEnd)}`;
+	if (innerRadius <= 0) return `M0,0L${point(outerStart)}${outerArc}Z`;
+	const innerStart = arcPoint(innerRadius, startAngle);
+	const innerEnd = arcPoint(innerRadius, endAngle);
+	const innerArc = `A${round(innerRadius)},${round(innerRadius)} 0 ${largeArc},0 ${point(innerStart)}`;
+	return `M${point(outerStart)}${outerArc}L${point(innerEnd)}${innerArc}Z`;
+}
+export { CHART_CONTEXT, ChartAxis, ChartEmpty, ChartFrame, ChartLegend, ChartTable, ChartTooltip, arcPath, areaPath, bandScale, estimateLabelWidth, linePath, linearScale, nearestIndex, niceTicks, niceXDomain, niceYDomain, timeScale, timeTicks, timeXDomain };
+
+//# sourceMappingURL=masmarino-gabarit-chart.mjs.map