@starterlib/ui 0.10.14 → 0.11.1

package/fesm2022/starterlib-ui-graphiques.mjs

@@ -0,0 +1,934 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, InjectionToken, afterNextRender, booleanAttribute, computed, inject, input, isDevMode, signal } from "@angular/core";
+import { AnnonceLocale, FUSEAU_PAR_DEFAUT, ST_LIBELLES, ST_LOCALE, StButton, StIdentifiants, catalogueDuPointDEntree } from "@starterlib/ui";
+import { StDataTable } from "@starterlib/ui/listes";
+import { graduationsAgreables, graduationsSymetriques, graduationsTemporelles } from "@starterlib/util/graduations";
+import { lireInstant } from "@starterlib/util";
+const LIBELLES_GRAPHIQUES_FR = {
+	voirLesDonnees: "Voir les données",
+	voirLeGraphique: "Voir le graphique",
+	tableauAffiche: "Tableau des données affiché",
+	graphiqueAffiche: "Graphique affiché",
+	colonneDate: "Date",
+	legende: "Légende",
+	evenements: "Événements",
+	separateurDEvenement: "\xA0: ",
+	aucuneDonnee: "Aucune donnée à afficher",
+	tendance: (dernier, variation) => variation === null ? `Derni\u00e8re valeur\u00a0: ${dernier}` : `Derni\u00e8re valeur\u00a0: ${dernier}, variation\u00a0: ${variation}`
+};
+const LIBELLES_GRAPHIQUES_EN = {
+	voirLesDonnees: "Show data",
+	voirLeGraphique: "Show chart",
+	tableauAffiche: "Data table shown",
+	graphiqueAffiche: "Chart shown",
+	colonneDate: "Date",
+	legende: "Legend",
+	evenements: "Events",
+	separateurDEvenement: ": ",
+	aucuneDonnee: "No data to show",
+	tendance: (dernier, variation) => variation === null ? `Latest value: ${dernier}` : `Latest value: ${dernier}, change: ${variation}`
+};
+const ST_LIBELLES_GRAPHIQUES = new InjectionToken("ST_LIBELLES_GRAPHIQUES", {
+	providedIn: "root",
+	factory: () => ({
+		fr: LIBELLES_GRAPHIQUES_FR,
+		en: LIBELLES_GRAPHIQUES_EN
+	})
+});
+function fournirLibellesGraphiques(catalogues) {
+	return {
+		provide: ST_LIBELLES_GRAPHIQUES,
+		useValue: {
+			fr: LIBELLES_GRAPHIQUES_FR,
+			en: LIBELLES_GRAPHIQUES_EN,
+			...catalogues
+		}
+	};
+}
+function libellesDesGraphiques() {
+	const catalogue = catalogueDesGraphiques();
+	return computed(() => catalogue().libelles);
+}
+function catalogueDesGraphiques() {
+	return catalogueDuPointDEntree("@starterlib/ui/graphiques", inject(ST_LIBELLES_GRAPHIQUES), LIBELLES_GRAPHIQUES_FR, "fournirLibellesGraphiques");
+}
+const DECIMALE = /^([+-])?(\d+)(?:\.(\d+))?$/;
+const JOUR_SEUL = /^\d{4}-\d{2}-\d{2}$/;
+function estDecimale(texte) {
+	return DECIMALE.test(texte);
+}
+function fuseauLisible(fuseau) {
+	try {
+		return new Intl.DateTimeFormat("en-US", { timeZone: fuseau }).resolvedOptions().timeZone;
+	} catch {
+		if (isDevMode()) console.warn(`@starterlib/ui/graphiques : fuseau inconnu "${fuseau}", UTC a sa place.`);
+		return "UTC";
+	}
+}
+function instantDuPoint(texte, fuseau) {
+	return lireInstant(JOUR_SEUL.test(texte) ? `${texte}T00:00` : texte, fuseau);
+}
+function lirePoints(points, fuseau, nom) {
+	const lus = [];
+	let ecartes = 0;
+	for (const point of points) {
+		const instant = instantDuPoint(point.instant, fuseau);
+		const texte = point.valeur.trim();
+		if (instant === null || !estDecimale(texte)) {
+			ecartes += 1;
+			continue;
+		}
+		lus.push({
+			instant,
+			valeur: Number(texte),
+			texte
+		});
+	}
+	if (ecartes > 0 && isDevMode()) console.warn(`${nom} : ${String(ecartes)} point(s) illisible(s), ecarte(s) du dessin.`);
+	return lus.sort((a, b) => a.instant - b.instant);
+}
+function lireMarqueurs(marqueurs, fuseau) {
+	const lus = [];
+	for (const marqueur of marqueurs) {
+		const instant = instantDuPoint(marqueur.instant, fuseau);
+		if (instant !== null) lus.push({
+			instant,
+			libelle: marqueur.libelle
+		});
+	}
+	return lus.sort((a, b) => a.instant - b.instant);
+}
+function dansLOrdreDuTemps(instants) {
+	return [...instants].sort((a, b) => a - b);
+}
+function differenceDecimale(a, b) {
+	const gauche = decomposer(a);
+	const droite = decomposer(b);
+	const echelle = Math.max(gauche.echelle, droite.echelle);
+	return recomposer(gauche.chiffres * 10n ** BigInt(echelle - gauche.echelle) - droite.chiffres * 10n ** BigInt(echelle - droite.echelle), echelle);
+}
+function decomposer(texte) {
+	const [, signe, entiere = "0", fraction = ""] = DECIMALE.exec(texte) ?? [];
+	const absolu = BigInt(`${entiere}${fraction}`);
+	return {
+		chiffres: signe === "-" ? -absolu : absolu,
+		echelle: fraction.length
+	};
+}
+function recomposer(valeur, echelle) {
+	const negatif = valeur < 0n;
+	const chiffres = (negatif ? -valeur : valeur).toString().padStart(echelle + 1, "0");
+	const coupure = chiffres.length - echelle;
+	const absolu = echelle === 0 ? chiffres : `${chiffres.slice(0, coupure)}.${chiffres.slice(coupure)}`;
+	return `${negatif ? "-" : ""}${absolu}`;
+}
+function optionsDeLaForme(forme) {
+	if (forme.devise !== null) return {
+		style: "currency",
+		currency: forme.devise
+	};
+	if (forme.pourcentage) return {
+		style: "unit",
+		unit: "percent"
+	};
+	return {};
+}
+function creer(locale, options) {
+	try {
+		return new Intl.NumberFormat(locale, options);
+	} catch (erreur) {
+		if (isDevMode()) console.warn("@starterlib/ui/graphiques :", erreur);
+		return new Intl.NumberFormat(void 0, {
+			maximumFractionDigits: 20,
+			signDisplay: options.signDisplay ?? "auto"
+		});
+	}
+}
+function texteDe(format, valeur) {
+	return format.formatToParts(valeur).map((partie) => partie.type === "minusSign" ? "−" : partie.value).join("");
+}
+function formateurDeValeurs(locale, forme) {
+	const formats = /* @__PURE__ */ new Map();
+	return (texte, signe = false) => {
+		const decimales = forme.devise === null ? Math.min(20, texte.split(".")[1]?.length ?? 0) : null;
+		const cle = `${String(decimales)}|${String(signe)}`;
+		let format = formats.get(cle);
+		if (format === void 0) {
+			format = creer(locale, {
+				...optionsDeLaForme(forme),
+				...decimales === null ? {} : {
+					minimumFractionDigits: decimales,
+					maximumFractionDigits: decimales
+				},
+				signDisplay: signe ? "exceptZero" : "auto"
+			});
+			formats.set(cle, format);
+		}
+		return texteDe(format, texte);
+	};
+}
+function decimalesDuPas(pas) {
+	const texte = String(Number(pas.toPrecision(12)));
+	const exposant = /e-(\d+)$/.exec(texte);
+	if (exposant !== null) return Math.min(20, Number(exposant[1]));
+	return Math.min(20, texte.split(".")[1]?.length ?? 0);
+}
+function formateurDeGraduations(locale, forme, pas, plusGrande) {
+	const decimales = decimalesDuPas(pas);
+	const format = creer(locale, plusGrande >= 1e6 ? {
+		...optionsDeLaForme(forme),
+		notation: "compact",
+		maximumSignificantDigits: 3
+	} : {
+		...optionsDeLaForme(forme),
+		minimumFractionDigits: decimales,
+		maximumFractionDigits: decimales
+	});
+	return (valeur) => texteDe(format, valeur === 0 ? 0 : valeur);
+}
+function partiesDHeure(fuseau) {
+	const format = new Intl.DateTimeFormat("en-US", {
+		timeZone: fuseau,
+		hourCycle: "h23",
+		month: "numeric",
+		hour: "numeric",
+		minute: "numeric"
+	});
+	return (instant) => {
+		const parties = format.formatToParts(new Date(instant));
+		const lire = (type) => Number(parties.find((partie) => partie.type === type)?.value ?? "0");
+		return {
+			mois: lire("month"),
+			heure: lire("hour"),
+			minute: lire("minute")
+		};
+	};
+}
+function tousAMinuit(instants, fuseau) {
+	const lire = partiesDHeure(fuseau);
+	return instants.every((instant) => {
+		const { heure, minute } = lire(instant);
+		return heure === 0 && minute === 0;
+	});
+}
+function formateurDeReperes(locale, fuseau) {
+	const formats = /* @__PURE__ */ new Map();
+	const format = (cle, options) => {
+		let lu = formats.get(cle);
+		if (lu === void 0) {
+			lu = new Intl.DateTimeFormat(locale, {
+				...options,
+				timeZone: fuseau
+			});
+			formats.set(cle, lu);
+		}
+		return lu;
+	};
+	const parties = partiesDHeure(fuseau);
+	return (instant, unite, premier) => {
+		const date = new Date(instant);
+		switch (unite) {
+			case "minute":
+			case "heure": return format("heure", {
+				hour: "2-digit",
+				minute: "2-digit"
+			}).format(date);
+			case "jour": return format("jour", {
+				day: "numeric",
+				month: "short"
+			}).format(date);
+			case "mois": return premier || parties(instant).mois === 1 ? format("mois-annee", {
+				month: "short",
+				year: "numeric"
+			}).format(date) : format("mois", { month: "short" }).format(date);
+			case "annee": return format("annee", { year: "numeric" }).format(date);
+		}
+	};
+}
+function formateurDeDates(locale, fuseau, avecHeure) {
+	const format = new Intl.DateTimeFormat(locale, {
+		dateStyle: "medium",
+		...avecHeure ? { timeStyle: "short" } : {},
+		timeZone: fuseau
+	});
+	return (instant) => format.format(new Date(instant));
+}
+const SERIES_MAX = 4;
+const POINTS_RECOMMANDES = 500;
+const TRAITS_PAR_RANG = [
+	"plein",
+	"tirets",
+	"points",
+	"mixte"
+];
+const LARGEUR_SUPPOSEE = 640;
+const CHASSE = 7;
+const ECART_DES_REPERES = 96;
+const ECART_DES_GRADUATIONS = 48;
+const MARGE_BAS = 28;
+const MARGE_HAUT = 12;
+const MARGE_HAUT_AVEC_MARQUEURS = 26;
+const MARGE_DROITE = 12;
+const SANS_VALEUR = "—";
+function arrondir$1(valeur) {
+	return Math.round(valeur * 10) / 10;
+}
+var StLineChart = class StLineChart {
+	locale = inject(ST_LOCALE);
+	fuseauParDefaut = inject(FUSEAU_PAR_DEFAUT);
+	catalogue = catalogueDesGraphiques();
+	annonce = new AnnonceLocale(inject(DestroyRef));
+	series = input.required(...ngDevMode ? [{ debugName: "series" }] : /* istanbul ignore next */ []);
+	zonePerte = input(null, ...ngDevMode ? [{ debugName: "zonePerte" }] : /* istanbul ignore next */ []);
+	marqueurs = input([], ...ngDevMode ? [{ debugName: "marqueurs" }] : /* istanbul ignore next */ []);
+	devise = input(null, ...ngDevMode ? [{ debugName: "devise" }] : /* istanbul ignore next */ []);
+	pourcentage = input(false, {
+		...ngDevMode ? { debugName: "pourcentage" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	fuseau = input(null, ...ngDevMode ? [{ debugName: "fuseau" }] : /* istanbul ignore next */ []);
+	etiquette = input.required(...ngDevMode ? [{ debugName: "etiquette" }] : /* istanbul ignore next */ []);
+	resume = input.required(...ngDevMode ? [{ debugName: "resume" }] : /* istanbul ignore next */ []);
+	pariteEchelle = input(false, {
+		...ngDevMode ? { debugName: "pariteEchelle" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	hauteur = input(240, ...ngDevMode ? [{ debugName: "hauteur" }] : /* istanbul ignore next */ []);
+	vueDonnees = signal(false, ...ngDevMode ? [{ debugName: "vueDonnees" }] : /* istanbul ignore next */ []);
+	largeur = signal(LARGEUR_SUPPOSEE, ...ngDevMode ? [{ debugName: "largeur" }] : /* istanbul ignore next */ []);
+	identifiants = (() => {
+		const base = inject(StIdentifiants).prochain("st-graphique");
+		return {
+			motif: `${base}-motif`,
+			resume: `${base}-resume`
+		};
+	})();
+	fuseauDeRendu = computed(() => fuseauLisible(this.fuseau() ?? this.fuseauParDefaut), ...ngDevMode ? [{ debugName: "fuseauDeRendu" }] : /* istanbul ignore next */ []);
+	forme = computed(() => ({
+		devise: this.devise(),
+		pourcentage: this.pourcentage()
+	}), ...ngDevMode ? [{ debugName: "forme" }] : /* istanbul ignore next */ []);
+	seriesLues = computed(() => {
+		const fuseau = this.fuseauDeRendu();
+		const series = this.series();
+		if (series.length > SERIES_MAX && isDevMode()) console.warn(`st-line-chart : ${String(series.length)} series, quatre au plus ; les suivantes ne sont pas dessinees.`);
+		return series.slice(0, SERIES_MAX).map((serie, indice) => {
+			const points = lirePoints(serie.points, fuseau, "st-line-chart");
+			if (points.length > POINTS_RECOMMANDES && isDevMode()) console.warn(`st-line-chart : "${serie.libelle}" porte ${String(points.length)} points ; ${String(POINTS_RECOMMANDES)} au plus, reduits cote serveur.`);
+			return {
+				rang: indice + 1,
+				trait: serie.trait ?? TRAITS_PAR_RANG[indice] ?? "plein",
+				libelle: serie.libelle,
+				points
+			};
+		});
+	}, ...ngDevMode ? [{ debugName: "seriesLues" }] : /* istanbul ignore next */ []);
+	plafond = computed(() => {
+		const zone = this.zonePerte();
+		if (zone === null) return null;
+		return {
+			libelle: zone.libelle,
+			points: lirePoints(zone.plafond, this.fuseauDeRendu(), "st-line-chart")
+		};
+	}, ...ngDevMode ? [{ debugName: "plafond" }] : /* istanbul ignore next */ []);
+	marqueursLus = computed(() => {
+		const fuseau = this.fuseauDeRendu();
+		const lus = lireMarqueurs(this.marqueurs(), fuseau);
+		const date = formateurDeDates(this.locale(), fuseau, !tousAMinuit(lus.map((marqueur) => marqueur.instant), fuseau));
+		return lus.map((marqueur, indice) => ({
+			numero: indice + 1,
+			instant: marqueur.instant,
+			iso: new Date(marqueur.instant).toISOString(),
+			date: date(marqueur.instant),
+			libelle: marqueur.libelle
+		}));
+	}, ...ngDevMode ? [{ debugName: "marqueursLus" }] : /* istanbul ignore next */ []);
+	vide = computed(() => this.seriesLues().every((serie) => serie.points.length === 0) && (this.plafond()?.points.length ?? 0) === 0, ...ngDevMode ? [{ debugName: "vide" }] : /* istanbul ignore next */ []);
+	dessin = computed(() => {
+		if (this.vide()) return null;
+		const largeur = Math.max(160, this.largeur());
+		const hauteur = Math.max(120, Math.round(this.hauteur()));
+		const series = this.seriesLues();
+		const plafond = this.plafond();
+		let minimum = Infinity;
+		let maximum = -Infinity;
+		let debut = Infinity;
+		let fin = -Infinity;
+		for (const point of [...series.flatMap((serie) => serie.points), ...plafond?.points ?? []]) {
+			minimum = Math.min(minimum, point.valeur);
+			maximum = Math.max(maximum, point.valeur);
+			debut = Math.min(debut, point.instant);
+			fin = Math.max(fin, point.instant);
+		}
+		const nombreDeGraduations = Math.max(3, Math.floor(hauteur / ECART_DES_GRADUATIONS));
+		const echelle = this.pariteEchelle() ? graduationsSymetriques(minimum, maximum, nombreDeGraduations) : graduationsAgreables(minimum, maximum, nombreDeGraduations);
+		const graduer = formateurDeGraduations(this.locale(), this.forme(), echelle.pas, Math.max(Math.abs(echelle.debut), Math.abs(echelle.fin)));
+		const textes = echelle.valeurs.map(graduer);
+		const plusLongue = textes.reduce((longueur, texte) => Math.max(longueur, texte.length), 0);
+		const gauche = Math.min(Math.round(largeur * .4), Math.ceil(plusLongue * CHASSE) + 12);
+		const droite = largeur - MARGE_DROITE;
+		const haut = this.marqueursLus().length > 0 ? MARGE_HAUT_AVEC_MARQUEURS : MARGE_HAUT;
+		const bas = hauteur - MARGE_BAS;
+		const y = (valeur) => arrondir$1(haut + (echelle.fin - valeur) / (echelle.fin - echelle.debut) * (bas - haut));
+		const plat = debut === fin;
+		const x = (instant) => arrondir$1(plat ? (gauche + droite) / 2 : gauche + (instant - debut) / (fin - debut) * (droite - gauche));
+		const fuseau = this.fuseauDeRendu();
+		const temps = plat ? {
+			unite: "jour",
+			valeurs: [debut]
+		} : graduationsTemporelles(debut, fin, fuseau, Math.max(2, Math.floor((droite - gauche) / ECART_DES_REPERES)));
+		const reperer = formateurDeReperes(this.locale(), fuseau);
+		const reperes = temps.valeurs.map((instant, rang) => {
+			const texte = reperer(instant, temps.unite, rang === 0);
+			const position = x(instant);
+			const demi = texte.length * CHASSE / 2;
+			return {
+				x: position,
+				texte,
+				ancre: position - demi < 0 ? "start" : position + demi > largeur ? "end" : "middle"
+			};
+		});
+		const coordonnees = (points) => points.map((point) => `${String(x(point.instant))} ${String(y(point.valeur))}`);
+		const traces = series.map((serie) => {
+			const [seul] = serie.points;
+			return {
+				rang: serie.rang,
+				trait: serie.trait,
+				d: serie.points.length > 1 ? `M${coordonnees(serie.points).join("L")}` : null,
+				point: serie.points.length === 1 && seul !== void 0 ? {
+					x: x(seul.instant),
+					y: y(seul.valeur)
+				} : null
+			};
+		});
+		const premiere = series[0];
+		const perte = plafond !== null && premiere !== void 0 && plafond.points.length > 1 && premiere.points.length > 1 ? `M${[...coordonnees(plafond.points), ...coordonnees([...premiere.points].reverse())].join("L")}Z` : null;
+		const marqueurs = this.marqueursLus().filter((marqueur) => marqueur.instant >= debut && marqueur.instant <= fin).map((marqueur) => ({
+			x: x(marqueur.instant),
+			numero: marqueur.numero
+		}));
+		return {
+			largeur,
+			hauteur,
+			gauche,
+			droite,
+			haut,
+			bas,
+			graduations: echelle.valeurs.map((valeur, rang) => ({
+				y: y(valeur),
+				texte: textes[rang] ?? "",
+				zero: valeur === 0
+			})),
+			reperes,
+			traces,
+			perte,
+			marqueurs
+		};
+	}, ...ngDevMode ? [{ debugName: "dessin" }] : /* istanbul ignore next */ []);
+	colonnes = computed(() => {
+		const plafond = this.plafond();
+		return [
+			{
+				cle: "instant",
+				libelle: this.catalogue().libelles.colonneDate
+			},
+			...this.seriesLues().map((serie) => ({
+				cle: `s${String(serie.rang)}`,
+				libelle: serie.libelle,
+				alignement: "fin"
+			})),
+			...plafond === null ? [] : [{
+				cle: "plafond",
+				libelle: plafond.libelle,
+				alignement: "fin"
+			}]
+		];
+	}, ...ngDevMode ? [{ debugName: "colonnes" }] : /* istanbul ignore next */ []);
+	lignes = computed(() => {
+		const valeur = formateurDeValeurs(this.locale(), this.forme());
+		const parInstant = /* @__PURE__ */ new Map();
+		const cellules = (instant) => {
+			let ligne = parInstant.get(instant);
+			if (ligne === void 0) {
+				ligne = {};
+				parInstant.set(instant, ligne);
+			}
+			return ligne;
+		};
+		for (const serie of this.seriesLues()) for (const point of serie.points) cellules(point.instant)[`s${String(serie.rang)}`] = valeur(point.texte);
+		for (const point of this.plafond()?.points ?? []) cellules(point.instant)["plafond"] = valeur(point.texte);
+		const instants = dansLOrdreDuTemps(parInstant.keys());
+		const fuseau = this.fuseauDeRendu();
+		const date = formateurDeDates(this.locale(), fuseau, !tousAMinuit(instants, fuseau));
+		const cles = this.colonnes().slice(1).map((colonne) => colonne.cle);
+		return instants.map((instant) => {
+			const lues = parInstant.get(instant) ?? {};
+			const ligne = {
+				cle: String(instant),
+				instant: date(instant)
+			};
+			for (const cle of cles) ligne[cle] = lues[cle] ?? SANS_VALEUR;
+			return ligne;
+		});
+	}, ...ngDevMode ? [{ debugName: "lignes" }] : /* istanbul ignore next */ []);
+	constructor() {
+		const element = inject(ElementRef).nativeElement;
+		const destruction = inject(DestroyRef);
+		afterNextRender(() => {
+			const Observateur = element.ownerDocument.defaultView?.ResizeObserver;
+			if (Observateur === void 0) return;
+			const mesurer = () => {
+				const largeur = Math.round(element.clientWidth);
+				if (largeur > 0) this.largeur.set(largeur);
+			};
+			mesurer();
+			const observateur = new Observateur(mesurer);
+			observateur.observe(element);
+			destruction.onDestroy(() => {
+				observateur.disconnect();
+			});
+		});
+	}
+	basculer() {
+		const donnees = !this.vueDonnees();
+		this.vueDonnees.set(donnees);
+		const libelles = this.catalogue().libelles;
+		this.annonce.annoncer(donnees ? libelles.tableauAffiche : libelles.graphiqueAffiche);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: StLineChart,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: StLineChart,
+		isStandalone: true,
+		selector: "st-line-chart",
+		inputs: {
+			series: {
+				classPropertyName: "series",
+				publicName: "series",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			zonePerte: {
+				classPropertyName: "zonePerte",
+				publicName: "zonePerte",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			marqueurs: {
+				classPropertyName: "marqueurs",
+				publicName: "marqueurs",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			devise: {
+				classPropertyName: "devise",
+				publicName: "devise",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			pourcentage: {
+				classPropertyName: "pourcentage",
+				publicName: "pourcentage",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			fuseau: {
+				classPropertyName: "fuseau",
+				publicName: "fuseau",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			etiquette: {
+				classPropertyName: "etiquette",
+				publicName: "etiquette",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			resume: {
+				classPropertyName: "resume",
+				publicName: "resume",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			pariteEchelle: {
+				classPropertyName: "pariteEchelle",
+				publicName: "pariteEchelle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			hauteur: {
+				classPropertyName: "hauteur",
+				publicName: "hauteur",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			properties: { "attr.data-vue": "vueDonnees() ? \"donnees\" : \"graphique\"" },
+			classAttribute: "st-line-chart"
+		},
+		ngImport: i0,
+		template: "<div class=\"st-line-chart__barre\">\n  <button\n    stButton\n    variante=\"discret\"\n    taille=\"sm\"\n    type=\"button\"\n    [attr.lang]=\"catalogue().langueDeRepli\"\n    (click)=\"basculer()\"\n  >\n    {{ vueDonnees() ? catalogue().libelles.voirLeGraphique : catalogue().libelles.voirLesDonnees }}\n  </button>\n</div>\n\n@if (vueDonnees()) {\n  <st-data-table\n    [legende]=\"etiquette()\"\n    [colonnes]=\"colonnes()\"\n    [lignes]=\"lignes()\"\n    cle=\"cle\"\n    hauteurMax=\"24rem\"\n  />\n} @else if (dessin(); as dessin) {\n  <svg\n    class=\"st-line-chart__svg\"\n    role=\"img\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    focusable=\"false\"\n    preserveAspectRatio=\"xMinYMin meet\"\n    [attr.aria-label]=\"etiquette()\"\n    [attr.aria-describedby]=\"identifiants.resume\"\n    [attr.viewBox]=\"'0 0 ' + dessin.largeur + ' ' + dessin.hauteur\"\n    [attr.height]=\"dessin.hauteur\"\n  >\n    <defs>\n      <pattern\n        patternUnits=\"userSpaceOnUse\"\n        width=\"6\"\n        height=\"6\"\n        patternTransform=\"rotate(45)\"\n        [attr.id]=\"identifiants.motif\"\n      >\n        <line class=\"st-line-chart__hachure\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"6\" />\n      </pattern>\n    </defs>\n    @for (graduation of dessin.graduations; track $index) {\n      <line\n        class=\"st-line-chart__grille\"\n        [attr.data-zero]=\"graduation.zero ? '' : null\"\n        [attr.x1]=\"dessin.gauche\"\n        [attr.x2]=\"dessin.droite\"\n        [attr.y1]=\"graduation.y\"\n        [attr.y2]=\"graduation.y\"\n      />\n      <text\n        class=\"st-line-chart__graduation\"\n        text-anchor=\"end\"\n        dominant-baseline=\"middle\"\n        [attr.x]=\"dessin.gauche - 8\"\n        [attr.y]=\"graduation.y\"\n      >\n        {{ graduation.texte }}\n      </text>\n    }\n    @if (dessin.perte; as perte) {\n      <path\n        class=\"st-line-chart__perte\"\n        [attr.d]=\"perte\"\n        [attr.fill]=\"'url(#' + identifiants.motif + ')'\"\n      />\n    }\n    @for (marqueur of dessin.marqueurs; track marqueur.numero) {\n      <line\n        class=\"st-line-chart__marqueur\"\n        [attr.x1]=\"marqueur.x\"\n        [attr.x2]=\"marqueur.x\"\n        [attr.y1]=\"dessin.haut\"\n        [attr.y2]=\"dessin.bas\"\n      />\n      <text\n        class=\"st-line-chart__numero\"\n        text-anchor=\"middle\"\n        [attr.x]=\"marqueur.x\"\n        [attr.y]=\"dessin.haut - 10\"\n      >\n        {{ marqueur.numero }}\n      </text>\n    }\n    @for (trace of dessin.traces; track trace.rang) {\n      @if (trace.d; as d) {\n        <path\n          class=\"st-line-chart__trace\"\n          [attr.data-serie]=\"trace.rang\"\n          [attr.data-trait]=\"trace.trait\"\n          [attr.d]=\"d\"\n        />\n      }\n      @if (trace.point; as point) {\n        <circle\n          class=\"st-line-chart__point\"\n          r=\"4\"\n          [attr.data-serie]=\"trace.rang\"\n          [attr.cx]=\"point.x\"\n          [attr.cy]=\"point.y\"\n        />\n      }\n    }\n    @for (repere of dessin.reperes; track $index) {\n      <text\n        class=\"st-line-chart__graduation\"\n        [attr.text-anchor]=\"repere.ancre\"\n        [attr.x]=\"repere.x\"\n        [attr.y]=\"dessin.hauteur - 8\"\n      >\n        {{ repere.texte }}\n      </text>\n    }\n  </svg>\n\n  <ul class=\"st-line-chart__legende\" [attr.aria-label]=\"catalogue().libelles.legende\">\n    @for (serie of seriesLues(); track serie.rang) {\n      <li class=\"st-line-chart__cle\">\n        <svg\n          class=\"st-line-chart__echantillon\"\n          aria-hidden=\"true\"\n          focusable=\"false\"\n          viewBox=\"0 0 24 12\"\n          width=\"24\"\n          height=\"12\"\n        >\n          <line\n            class=\"st-line-chart__trace\"\n            x1=\"2\"\n            y1=\"6\"\n            x2=\"22\"\n            y2=\"6\"\n            [attr.data-serie]=\"serie.rang\"\n            [attr.data-trait]=\"serie.trait\"\n          />\n        </svg>\n        {{ serie.libelle }}\n      </li>\n    }\n    @if (plafond(); as plafond) {\n      <li class=\"st-line-chart__cle\">\n        <svg\n          class=\"st-line-chart__echantillon\"\n          aria-hidden=\"true\"\n          focusable=\"false\"\n          viewBox=\"0 0 24 12\"\n          width=\"24\"\n          height=\"12\"\n        >\n          <rect\n            class=\"st-line-chart__perte\"\n            x=\"2\"\n            y=\"1\"\n            width=\"20\"\n            height=\"10\"\n            [attr.fill]=\"'url(#' + identifiants.motif + ')'\"\n          />\n        </svg>\n        {{ plafond.libelle }}\n      </li>\n    }\n  </ul>\n} @else {\n  <p class=\"st-line-chart__vide\" [attr.lang]=\"catalogue().langueDeRepli\">\n    {{ catalogue().libelles.aucuneDonnee }}\n  </p>\n}\n\n@if (marqueursLus().length > 0) {\n  <ol class=\"st-line-chart__evenements\" [attr.aria-label]=\"catalogue().libelles.evenements\">\n    @for (marqueur of marqueursLus(); track marqueur.numero) {\n      <li>\n        <time [attr.datetime]=\"marqueur.iso\">{{ marqueur.date }}</time\n        >{{ catalogue().libelles.separateurDEvenement }}{{ marqueur.libelle }}\n      </li>\n    }\n  </ol>\n}\n\n<p class=\"st-line-chart__resume\" [id]=\"identifiants.resume\">{{ resume() }}</p>\n<span\n  class=\"st-line-chart__annonce st-vh\"\n  aria-live=\"polite\"\n  [attr.lang]=\"catalogue().langueDeRepli\"\n  >{{ annonce.texte() }}</span\n>\n",
+		styles: [".st-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host([hidden]){display:none!important}:host{display:block;min-inline-size:0;max-inline-size:100%}.st-line-chart__barre{display:flex;justify-content:flex-end;margin-block-end:var(--st-espacement-2)}.st-line-chart__svg{display:block;inline-size:100%;block-size:auto;overflow:visible;direction:ltr}.st-line-chart__graduation,.st-line-chart__numero{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);fill:var(--st-couleur-texte-discret);font-variant-numeric:var(--st-chiffres-alignes)}.st-line-chart__numero{font-weight:var(--st-graisse-semi);fill:var(--st-couleur-texte)}.st-line-chart__grille{stroke:var(--st-couleur-bordure);stroke-width:1;shape-rendering:crispEdges}.st-line-chart__grille[data-zero]{stroke:var(--st-couleur-bordure-forte)}.st-line-chart__trace{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.st-line-chart__trace[data-trait=tirets]{stroke-dasharray:8 5;stroke-linecap:butt}.st-line-chart__trace[data-trait=points]{stroke-width:3;stroke-dasharray:0 6}.st-line-chart__trace[data-trait=mixte]{stroke-dasharray:10 5 0 5}.st-line-chart__trace[data-serie=\"1\"]{stroke:var(--st-couleur-serie1)}.st-line-chart__point[data-serie=\"1\"]{fill:var(--st-couleur-serie1)}.st-line-chart__trace[data-serie=\"2\"]{stroke:var(--st-couleur-serie2)}.st-line-chart__point[data-serie=\"2\"]{fill:var(--st-couleur-serie2)}.st-line-chart__trace[data-serie=\"3\"]{stroke:var(--st-couleur-serie3)}.st-line-chart__point[data-serie=\"3\"]{fill:var(--st-couleur-serie3)}.st-line-chart__trace[data-serie=\"4\"]{stroke:var(--st-couleur-serie4)}.st-line-chart__point[data-serie=\"4\"]{fill:var(--st-couleur-serie4)}.st-line-chart__perte{stroke:none}.st-line-chart__hachure{stroke:var(--st-couleur-texte-discret);stroke-width:1.5}.st-line-chart__marqueur{stroke:var(--st-couleur-texte-discret);stroke-width:1;stroke-dasharray:2 3}.st-line-chart__legende,.st-line-chart__evenements{font-size:var(--st-taille-sm);line-height:var(--st-interligne-sm);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);margin:var(--st-espacement-3) 0 0;color:var(--st-couleur-texte)}.st-line-chart__legende{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2) var(--st-espacement-4);padding:0;list-style:none}.st-line-chart__cle{display:inline-flex;gap:var(--st-espacement-2);align-items:center;min-inline-size:0;overflow-wrap:anywhere}.st-line-chart__echantillon{flex:none;overflow:visible}.st-line-chart__evenements{padding-inline-start:var(--st-espacement-5)}.st-line-chart__resume{font-size:var(--st-taille-sm);line-height:var(--st-interligne-sm);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);margin:var(--st-espacement-2) 0 0;color:var(--st-couleur-texte-discret)}.st-line-chart__vide{font-size:var(--st-taille-md);line-height:var(--st-interligne-md);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);display:grid;place-items:center;min-block-size:8rem;margin:0;padding:var(--st-espacement-4);color:var(--st-couleur-texte-discret);text-align:center;border:var(--st-epaisseur-fine) dashed var(--st-couleur-bordure);border-radius:var(--st-rayon-md)}@media(forced-colors:active){.st-line-chart__trace[data-serie],.st-line-chart__hachure,.st-line-chart__marqueur{stroke:CanvasText}.st-line-chart__point[data-serie]{fill:CanvasText}.st-line-chart__grille,.st-line-chart__grille[data-zero]{stroke:GrayText}.st-line-chart__graduation,.st-line-chart__numero{fill:CanvasText}}\n"],
+		dependencies: [{
+			kind: "component",
+			type: StButton,
+			selector: "button[stButton]",
+			inputs: [
+				"variante",
+				"taille",
+				"pleineLargeur",
+				"iconeAvant",
+				"iconeApres",
+				"chargement",
+				"indisponible",
+				"raisonIndisponible"
+			]
+		}, {
+			kind: "component",
+			type: StDataTable,
+			selector: "st-data-table",
+			inputs: [
+				"legende",
+				"legendeMasquee",
+				"colonnes",
+				"lignes",
+				"cle",
+				"enTeteDeLigne",
+				"premiereColonneFigee",
+				"hauteurMax",
+				"tonDeLigne",
+				"ligneChoisissable",
+				"densite",
+				"chargement",
+				"annonceDeRechargement",
+				"selectionnable",
+				"selection",
+				"tri",
+				"triTernaire",
+				"texteVide",
+				"raisonDuVide",
+				"lignesAttendues"
+			],
+			outputs: [
+				"selectionChange",
+				"triChange",
+				"effacement"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: StLineChart,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-line-chart",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [StButton, StDataTable],
+			host: {
+				class: "st-line-chart",
+				"[attr.data-vue]": "vueDonnees() ? \"donnees\" : \"graphique\""
+			},
+			template: "<div class=\"st-line-chart__barre\">\n  <button\n    stButton\n    variante=\"discret\"\n    taille=\"sm\"\n    type=\"button\"\n    [attr.lang]=\"catalogue().langueDeRepli\"\n    (click)=\"basculer()\"\n  >\n    {{ vueDonnees() ? catalogue().libelles.voirLeGraphique : catalogue().libelles.voirLesDonnees }}\n  </button>\n</div>\n\n@if (vueDonnees()) {\n  <st-data-table\n    [legende]=\"etiquette()\"\n    [colonnes]=\"colonnes()\"\n    [lignes]=\"lignes()\"\n    cle=\"cle\"\n    hauteurMax=\"24rem\"\n  />\n} @else if (dessin(); as dessin) {\n  <svg\n    class=\"st-line-chart__svg\"\n    role=\"img\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    focusable=\"false\"\n    preserveAspectRatio=\"xMinYMin meet\"\n    [attr.aria-label]=\"etiquette()\"\n    [attr.aria-describedby]=\"identifiants.resume\"\n    [attr.viewBox]=\"'0 0 ' + dessin.largeur + ' ' + dessin.hauteur\"\n    [attr.height]=\"dessin.hauteur\"\n  >\n    <defs>\n      <pattern\n        patternUnits=\"userSpaceOnUse\"\n        width=\"6\"\n        height=\"6\"\n        patternTransform=\"rotate(45)\"\n        [attr.id]=\"identifiants.motif\"\n      >\n        <line class=\"st-line-chart__hachure\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"6\" />\n      </pattern>\n    </defs>\n    @for (graduation of dessin.graduations; track $index) {\n      <line\n        class=\"st-line-chart__grille\"\n        [attr.data-zero]=\"graduation.zero ? '' : null\"\n        [attr.x1]=\"dessin.gauche\"\n        [attr.x2]=\"dessin.droite\"\n        [attr.y1]=\"graduation.y\"\n        [attr.y2]=\"graduation.y\"\n      />\n      <text\n        class=\"st-line-chart__graduation\"\n        text-anchor=\"end\"\n        dominant-baseline=\"middle\"\n        [attr.x]=\"dessin.gauche - 8\"\n        [attr.y]=\"graduation.y\"\n      >\n        {{ graduation.texte }}\n      </text>\n    }\n    @if (dessin.perte; as perte) {\n      <path\n        class=\"st-line-chart__perte\"\n        [attr.d]=\"perte\"\n        [attr.fill]=\"'url(#' + identifiants.motif + ')'\"\n      />\n    }\n    @for (marqueur of dessin.marqueurs; track marqueur.numero) {\n      <line\n        class=\"st-line-chart__marqueur\"\n        [attr.x1]=\"marqueur.x\"\n        [attr.x2]=\"marqueur.x\"\n        [attr.y1]=\"dessin.haut\"\n        [attr.y2]=\"dessin.bas\"\n      />\n      <text\n        class=\"st-line-chart__numero\"\n        text-anchor=\"middle\"\n        [attr.x]=\"marqueur.x\"\n        [attr.y]=\"dessin.haut - 10\"\n      >\n        {{ marqueur.numero }}\n      </text>\n    }\n    @for (trace of dessin.traces; track trace.rang) {\n      @if (trace.d; as d) {\n        <path\n          class=\"st-line-chart__trace\"\n          [attr.data-serie]=\"trace.rang\"\n          [attr.data-trait]=\"trace.trait\"\n          [attr.d]=\"d\"\n        />\n      }\n      @if (trace.point; as point) {\n        <circle\n          class=\"st-line-chart__point\"\n          r=\"4\"\n          [attr.data-serie]=\"trace.rang\"\n          [attr.cx]=\"point.x\"\n          [attr.cy]=\"point.y\"\n        />\n      }\n    }\n    @for (repere of dessin.reperes; track $index) {\n      <text\n        class=\"st-line-chart__graduation\"\n        [attr.text-anchor]=\"repere.ancre\"\n        [attr.x]=\"repere.x\"\n        [attr.y]=\"dessin.hauteur - 8\"\n      >\n        {{ repere.texte }}\n      </text>\n    }\n  </svg>\n\n  <ul class=\"st-line-chart__legende\" [attr.aria-label]=\"catalogue().libelles.legende\">\n    @for (serie of seriesLues(); track serie.rang) {\n      <li class=\"st-line-chart__cle\">\n        <svg\n          class=\"st-line-chart__echantillon\"\n          aria-hidden=\"true\"\n          focusable=\"false\"\n          viewBox=\"0 0 24 12\"\n          width=\"24\"\n          height=\"12\"\n        >\n          <line\n            class=\"st-line-chart__trace\"\n            x1=\"2\"\n            y1=\"6\"\n            x2=\"22\"\n            y2=\"6\"\n            [attr.data-serie]=\"serie.rang\"\n            [attr.data-trait]=\"serie.trait\"\n          />\n        </svg>\n        {{ serie.libelle }}\n      </li>\n    }\n    @if (plafond(); as plafond) {\n      <li class=\"st-line-chart__cle\">\n        <svg\n          class=\"st-line-chart__echantillon\"\n          aria-hidden=\"true\"\n          focusable=\"false\"\n          viewBox=\"0 0 24 12\"\n          width=\"24\"\n          height=\"12\"\n        >\n          <rect\n            class=\"st-line-chart__perte\"\n            x=\"2\"\n            y=\"1\"\n            width=\"20\"\n            height=\"10\"\n            [attr.fill]=\"'url(#' + identifiants.motif + ')'\"\n          />\n        </svg>\n        {{ plafond.libelle }}\n      </li>\n    }\n  </ul>\n} @else {\n  <p class=\"st-line-chart__vide\" [attr.lang]=\"catalogue().langueDeRepli\">\n    {{ catalogue().libelles.aucuneDonnee }}\n  </p>\n}\n\n@if (marqueursLus().length > 0) {\n  <ol class=\"st-line-chart__evenements\" [attr.aria-label]=\"catalogue().libelles.evenements\">\n    @for (marqueur of marqueursLus(); track marqueur.numero) {\n      <li>\n        <time [attr.datetime]=\"marqueur.iso\">{{ marqueur.date }}</time\n        >{{ catalogue().libelles.separateurDEvenement }}{{ marqueur.libelle }}\n      </li>\n    }\n  </ol>\n}\n\n<p class=\"st-line-chart__resume\" [id]=\"identifiants.resume\">{{ resume() }}</p>\n<span\n  class=\"st-line-chart__annonce st-vh\"\n  aria-live=\"polite\"\n  [attr.lang]=\"catalogue().langueDeRepli\"\n  >{{ annonce.texte() }}</span\n>\n",
+			styles: [".st-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host([hidden]){display:none!important}:host{display:block;min-inline-size:0;max-inline-size:100%}.st-line-chart__barre{display:flex;justify-content:flex-end;margin-block-end:var(--st-espacement-2)}.st-line-chart__svg{display:block;inline-size:100%;block-size:auto;overflow:visible;direction:ltr}.st-line-chart__graduation,.st-line-chart__numero{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);fill:var(--st-couleur-texte-discret);font-variant-numeric:var(--st-chiffres-alignes)}.st-line-chart__numero{font-weight:var(--st-graisse-semi);fill:var(--st-couleur-texte)}.st-line-chart__grille{stroke:var(--st-couleur-bordure);stroke-width:1;shape-rendering:crispEdges}.st-line-chart__grille[data-zero]{stroke:var(--st-couleur-bordure-forte)}.st-line-chart__trace{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.st-line-chart__trace[data-trait=tirets]{stroke-dasharray:8 5;stroke-linecap:butt}.st-line-chart__trace[data-trait=points]{stroke-width:3;stroke-dasharray:0 6}.st-line-chart__trace[data-trait=mixte]{stroke-dasharray:10 5 0 5}.st-line-chart__trace[data-serie=\"1\"]{stroke:var(--st-couleur-serie1)}.st-line-chart__point[data-serie=\"1\"]{fill:var(--st-couleur-serie1)}.st-line-chart__trace[data-serie=\"2\"]{stroke:var(--st-couleur-serie2)}.st-line-chart__point[data-serie=\"2\"]{fill:var(--st-couleur-serie2)}.st-line-chart__trace[data-serie=\"3\"]{stroke:var(--st-couleur-serie3)}.st-line-chart__point[data-serie=\"3\"]{fill:var(--st-couleur-serie3)}.st-line-chart__trace[data-serie=\"4\"]{stroke:var(--st-couleur-serie4)}.st-line-chart__point[data-serie=\"4\"]{fill:var(--st-couleur-serie4)}.st-line-chart__perte{stroke:none}.st-line-chart__hachure{stroke:var(--st-couleur-texte-discret);stroke-width:1.5}.st-line-chart__marqueur{stroke:var(--st-couleur-texte-discret);stroke-width:1;stroke-dasharray:2 3}.st-line-chart__legende,.st-line-chart__evenements{font-size:var(--st-taille-sm);line-height:var(--st-interligne-sm);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);margin:var(--st-espacement-3) 0 0;color:var(--st-couleur-texte)}.st-line-chart__legende{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2) var(--st-espacement-4);padding:0;list-style:none}.st-line-chart__cle{display:inline-flex;gap:var(--st-espacement-2);align-items:center;min-inline-size:0;overflow-wrap:anywhere}.st-line-chart__echantillon{flex:none;overflow:visible}.st-line-chart__evenements{padding-inline-start:var(--st-espacement-5)}.st-line-chart__resume{font-size:var(--st-taille-sm);line-height:var(--st-interligne-sm);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);margin:var(--st-espacement-2) 0 0;color:var(--st-couleur-texte-discret)}.st-line-chart__vide{font-size:var(--st-taille-md);line-height:var(--st-interligne-md);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);display:grid;place-items:center;min-block-size:8rem;margin:0;padding:var(--st-espacement-4);color:var(--st-couleur-texte-discret);text-align:center;border:var(--st-epaisseur-fine) dashed var(--st-couleur-bordure);border-radius:var(--st-rayon-md)}@media(forced-colors:active){.st-line-chart__trace[data-serie],.st-line-chart__hachure,.st-line-chart__marqueur{stroke:CanvasText}.st-line-chart__point[data-serie]{fill:CanvasText}.st-line-chart__grille,.st-line-chart__grille[data-zero]{stroke:GrayText}.st-line-chart__graduation,.st-line-chart__numero{fill:CanvasText}}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		series: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "series",
+				required: true
+			}]
+		}],
+		zonePerte: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "zonePerte",
+				required: false
+			}]
+		}],
+		marqueurs: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "marqueurs",
+				required: false
+			}]
+		}],
+		devise: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "devise",
+				required: false
+			}]
+		}],
+		pourcentage: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "pourcentage",
+				required: false
+			}]
+		}],
+		fuseau: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "fuseau",
+				required: false
+			}]
+		}],
+		etiquette: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etiquette",
+				required: true
+			}]
+		}],
+		resume: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "resume",
+				required: true
+			}]
+		}],
+		pariteEchelle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "pariteEchelle",
+				required: false
+			}]
+		}],
+		hauteur: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "hauteur",
+				required: false
+			}]
+		}]
+	}
+});
+const LARGEUR = 100;
+const MARGE = 2;
+function arrondir(valeur) {
+	return Math.round(valeur * 100) / 100;
+}
+var StSparkline = class StSparkline {
+	locale = inject(ST_LOCALE);
+	libellesDuTronc = inject(ST_LIBELLES);
+	fuseauParDefaut = inject(FUSEAU_PAR_DEFAUT);
+	catalogue = catalogueDesGraphiques();
+	points = input.required(...ngDevMode ? [{ debugName: "points" }] : /* istanbul ignore next */ []);
+	etiquette = input(null, ...ngDevMode ? [{ debugName: "etiquette" }] : /* istanbul ignore next */ []);
+	devise = input(null, ...ngDevMode ? [{ debugName: "devise" }] : /* istanbul ignore next */ []);
+	pourcentage = input(false, {
+		...ngDevMode ? { debugName: "pourcentage" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	trait = input("plein", ...ngDevMode ? [{ debugName: "trait" }] : /* istanbul ignore next */ []);
+	fuseau = input(null, ...ngDevMode ? [{ debugName: "fuseau" }] : /* istanbul ignore next */ []);
+	lus = computed(() => lirePoints(this.points(), fuseauLisible(this.fuseau() ?? this.fuseauParDefaut), "st-sparkline"), ...ngDevMode ? [{ debugName: "lus" }] : /* istanbul ignore next */ []);
+	trace = computed(() => {
+		const points = this.lus();
+		const premier = points[0];
+		const dernier = points.at(-1);
+		if (premier === void 0 || dernier === void 0) return null;
+		let minimum = Infinity;
+		let maximum = -Infinity;
+		for (const point of points) {
+			minimum = Math.min(minimum, point.valeur);
+			maximum = Math.max(maximum, point.valeur);
+		}
+		const { debut, fin } = graduationsAgreables(minimum, maximum);
+		const duree = dernier.instant - premier.instant;
+		const x = (instant) => arrondir(duree === 0 ? LARGEUR / 2 : (instant - premier.instant) / duree * LARGEUR);
+		const y = (valeur) => arrondir(MARGE + (fin - valeur) / (fin - debut) * 20);
+		const coordonnees = points.map((point) => `${String(x(point.instant))} ${String(y(point.valeur))}`);
+		return {
+			ligne: points.length > 1 ? `M${coordonnees.join("L")}` : null,
+			dernier: `M${String(x(dernier.instant))} ${String(y(dernier.valeur))}h0`
+		};
+	}, ...ngDevMode ? [{ debugName: "trace" }] : /* istanbul ignore next */ []);
+	texte = computed(() => {
+		const points = this.lus();
+		const premier = points[0];
+		const dernier = points.at(-1);
+		if (premier === void 0 || dernier === void 0) return null;
+		const formater = formateurDeValeurs(this.locale(), {
+			devise: this.devise(),
+			pourcentage: this.pourcentage()
+		});
+		const variation = points.length > 1 ? differenceDecimale(dernier.texte, premier.texte) : null;
+		const lire = (valeur, signe) => valeur.startsWith("-") ? this.libellesDuTronc().montantNegatif(formater(valeur.slice(1))) : formater(valeur, signe);
+		return {
+			dernier: formater(dernier.texte),
+			variation: variation === null ? null : formater(variation, true),
+			lu: this.catalogue().libelles.tendance(lire(dernier.texte, false), variation === null ? null : lire(variation, true))
+		};
+	}, ...ngDevMode ? [{ debugName: "texte" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: StSparkline,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: StSparkline,
+		isStandalone: true,
+		selector: "st-sparkline",
+		inputs: {
+			points: {
+				classPropertyName: "points",
+				publicName: "points",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			etiquette: {
+				classPropertyName: "etiquette",
+				publicName: "etiquette",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			devise: {
+				classPropertyName: "devise",
+				publicName: "devise",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			pourcentage: {
+				classPropertyName: "pourcentage",
+				publicName: "pourcentage",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			trait: {
+				classPropertyName: "trait",
+				publicName: "trait",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			fuseau: {
+				classPropertyName: "fuseau",
+				publicName: "fuseau",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { classAttribute: "st-sparkline" },
+		ngImport: i0,
+		template: "<svg\n  class=\"st-sparkline__svg\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  viewBox=\"0 0 100 24\"\n  preserveAspectRatio=\"none\"\n  focusable=\"false\"\n  [attr.role]=\"etiquette() === null ? null : 'img'\"\n  [attr.aria-label]=\"etiquette()\"\n  [attr.aria-hidden]=\"etiquette() === null ? 'true' : null\"\n>\n  @if (trace(); as trace) {\n    @if (trace.ligne; as ligne) {\n      <path class=\"st-sparkline__ligne\" [attr.data-trait]=\"trait()\" [attr.d]=\"ligne\" />\n    }\n    <path class=\"st-sparkline__dernier\" [attr.d]=\"trace.dernier\" />\n  }\n</svg>\n@if (etiquette() === null) {\n  @if (texte(); as texte) {\n    <span class=\"st-sparkline__texte\">\n      <span aria-hidden=\"true\">\n        <span class=\"st-sparkline__valeur\">{{ texte.dernier }}</span>\n        @if (texte.variation; as variation) {\n          <span class=\"st-sparkline__variation\">{{ variation }}</span>\n        }\n      </span>\n      <span class=\"st-vh\" [attr.lang]=\"catalogue().langueDeRepli\">{{ texte.lu }}</span>\n    </span>\n  } @else {\n    <span class=\"st-sparkline__texte\" [attr.lang]=\"catalogue().langueDeRepli\">{{\n      catalogue().libelles.aucuneDonnee\n    }}</span>\n  }\n}\n",
+		styles: [".st-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host([hidden]){display:none!important}:host{display:inline-flex;gap:var(--st-espacement-2);align-items:center;max-inline-size:100%;vertical-align:middle}.st-sparkline__svg{display:block;flex:none;inline-size:4.5rem;block-size:1.25rem;overflow:visible;direction:ltr}.st-sparkline__ligne,.st-sparkline__dernier{fill:none;stroke:var(--st-couleur-serie1);stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.st-sparkline__ligne{stroke-width:1.5}.st-sparkline__ligne[data-trait=tirets]{stroke-dasharray:4 3;stroke-linecap:butt}.st-sparkline__ligne[data-trait=points]{stroke-width:2;stroke-dasharray:0 4}.st-sparkline__ligne[data-trait=mixte]{stroke-dasharray:6 3 0 3}.st-sparkline__dernier{stroke-width:4}.st-sparkline__texte{font-size:var(--st-taille-sm);line-height:var(--st-interligne-sm);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);display:inline-flex;flex-wrap:wrap;gap:0 var(--st-espacement-2);min-inline-size:0;font-variant-numeric:var(--st-chiffres-alignes);color:var(--st-couleur-texte)}.st-sparkline__variation{margin-inline-start:var(--st-espacement-2);color:var(--st-couleur-texte-discret)}@media(forced-colors:active){.st-sparkline__ligne,.st-sparkline__dernier{stroke:CanvasText}}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: StSparkline,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-sparkline",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: { class: "st-sparkline" },
+			template: "<svg\n  class=\"st-sparkline__svg\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  viewBox=\"0 0 100 24\"\n  preserveAspectRatio=\"none\"\n  focusable=\"false\"\n  [attr.role]=\"etiquette() === null ? null : 'img'\"\n  [attr.aria-label]=\"etiquette()\"\n  [attr.aria-hidden]=\"etiquette() === null ? 'true' : null\"\n>\n  @if (trace(); as trace) {\n    @if (trace.ligne; as ligne) {\n      <path class=\"st-sparkline__ligne\" [attr.data-trait]=\"trait()\" [attr.d]=\"ligne\" />\n    }\n    <path class=\"st-sparkline__dernier\" [attr.d]=\"trace.dernier\" />\n  }\n</svg>\n@if (etiquette() === null) {\n  @if (texte(); as texte) {\n    <span class=\"st-sparkline__texte\">\n      <span aria-hidden=\"true\">\n        <span class=\"st-sparkline__valeur\">{{ texte.dernier }}</span>\n        @if (texte.variation; as variation) {\n          <span class=\"st-sparkline__variation\">{{ variation }}</span>\n        }\n      </span>\n      <span class=\"st-vh\" [attr.lang]=\"catalogue().langueDeRepli\">{{ texte.lu }}</span>\n    </span>\n  } @else {\n    <span class=\"st-sparkline__texte\" [attr.lang]=\"catalogue().langueDeRepli\">{{\n      catalogue().libelles.aucuneDonnee\n    }}</span>\n  }\n}\n",
+			styles: [".st-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host([hidden]){display:none!important}:host{display:inline-flex;gap:var(--st-espacement-2);align-items:center;max-inline-size:100%;vertical-align:middle}.st-sparkline__svg{display:block;flex:none;inline-size:4.5rem;block-size:1.25rem;overflow:visible;direction:ltr}.st-sparkline__ligne,.st-sparkline__dernier{fill:none;stroke:var(--st-couleur-serie1);stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.st-sparkline__ligne{stroke-width:1.5}.st-sparkline__ligne[data-trait=tirets]{stroke-dasharray:4 3;stroke-linecap:butt}.st-sparkline__ligne[data-trait=points]{stroke-width:2;stroke-dasharray:0 4}.st-sparkline__ligne[data-trait=mixte]{stroke-dasharray:6 3 0 3}.st-sparkline__dernier{stroke-width:4}.st-sparkline__texte{font-size:var(--st-taille-sm);line-height:var(--st-interligne-sm);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);display:inline-flex;flex-wrap:wrap;gap:0 var(--st-espacement-2);min-inline-size:0;font-variant-numeric:var(--st-chiffres-alignes);color:var(--st-couleur-texte)}.st-sparkline__variation{margin-inline-start:var(--st-espacement-2);color:var(--st-couleur-texte-discret)}@media(forced-colors:active){.st-sparkline__ligne,.st-sparkline__dernier{stroke:CanvasText}}\n"]
+		}]
+	}],
+	propDecorators: {
+		points: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "points",
+				required: true
+			}]
+		}],
+		etiquette: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etiquette",
+				required: false
+			}]
+		}],
+		devise: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "devise",
+				required: false
+			}]
+		}],
+		pourcentage: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "pourcentage",
+				required: false
+			}]
+		}],
+		trait: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "trait",
+				required: false
+			}]
+		}],
+		fuseau: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "fuseau",
+				required: false
+			}]
+		}]
+	}
+});
+export { LIBELLES_GRAPHIQUES_EN, LIBELLES_GRAPHIQUES_FR, ST_LIBELLES_GRAPHIQUES, StLineChart, StSparkline, catalogueDesGraphiques, fournirLibellesGraphiques, libellesDesGraphiques };
+
+//# sourceMappingURL=starterlib-ui-graphiques.mjs.map