@starterlib/ui 0.7.2 → 0.9.0

package/fesm2022/starterlib-ui-parcours.mjs

@@ -0,0 +1,2449 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, InjectionToken, Injector, afterNextRender, booleanAttribute, computed, effect, inject, input, isDevMode, linkedSignal, model, numberAttribute, output, signal, untracked, viewChild } from "@angular/core";
+import { AnnonceLocale, ICONES_DE_TON, REGION_VIVANTE_PARENTE, ST_LIBELLES, StBanner, StButton, StCode, StCopyButton, StFormActions, StHeading, StIcon, StIdentifiants, StInlineMessage, StLink, StPageTitle, StSpinner, StStatusPill, StStepper, StTimer } from "@starterlib/ui";
+import { estUneErreurRejouable, sansCommandesDeDirection, varianteDErreur } from "@starterlib/util";
+import { StDate } from "@starterlib/ui/donnees";
+import { DOCUMENT, NgTemplateOutlet } from "@angular/common";
+import { RouterLink } from "@angular/router";
+import { StCheckbox, StInput, StOtpField, erreurCode } from "@starterlib/ui/saisie";
+var StRefusal = class StRefusal {
+	injecteur = inject(Injector);
+	libelles = inject(ST_LIBELLES);
+	erreur = input.required(...ngDevMode ? [{ debugName: "erreur" }] : 	/* istanbul ignore next */ []);
+	message = input.required(...ngDevMode ? [{ debugName: "message" }] : 	/* istanbul ignore next */ []);
+	titre = input(null, ...ngDevMode ? [{ debugName: "titre" }] : 	/* istanbul ignore next */ []);
+	codeInconnu = input(false, {
+		...ngDevMode ? { debugName: "codeInconnu" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	rejeuEnCours = input(false, {
+		...ngDevMode ? { debugName: "rejeuEnCours" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	rechargementEnCours = input(false, {
+		...ngDevMode ? { debugName: "rechargementEnCours" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	rejeu = output();
+	rechargement = output();
+	attenteTerminee = output();
+	banniere = viewChild.required(StBanner, {
+		...ngDevMode ? { debugName: "banniere" } : 		/* istanbul ignore next */ {},
+		read: ElementRef
+	});
+	decompte = viewChild(StTimer, ...ngDevMode ? [{ debugName: "decompte" }] : 	/* istanbul ignore next */ []);
+	variante = computed(() => {
+		const erreur = this.erreur();
+		return varianteDErreur(erreur.status, erreur.code, erreur.horsLigne);
+	}, ...ngDevMode ? [{ debugName: "variante" }] : 	/* istanbul ignore next */ []);
+	rejouableSelonLaTable = computed(() => estUneErreurRejouable(this.variante(), this.erreur().status), ...ngDevMode ? [{ debugName: "rejouableSelonLaTable" }] : 	/* istanbul ignore next */ []);
+	ton = computed(() => this.rejouableSelonLaTable() || this.variante() === "conflit" ? "avertissement" : "danger", ...ngDevMode ? [{ debugName: "ton" }] : 	/* istanbul ignore next */ []);
+	titreLu = computed(() => this.titre() ?? (this.variante() === "hors-ligne" ? this.libelles().horsConnexion : null), ...ngDevMode ? [{ debugName: "titreLu" }] : 	/* istanbul ignore next */ []);
+	attente = computed(() => {
+		const secondes = this.erreur().reessayerDans;
+		return this.variante() === "limite" && secondes !== null && secondes > 0 ? secondes : null;
+	}, ...ngDevMode ? [{ debugName: "attente" }] : 	/* istanbul ignore next */ []);
+	attenteFinie = linkedSignal({
+		...ngDevMode ? { debugName: "attenteFinie" } : 		/* istanbul ignore next */ {},
+		source: this.erreur,
+		computation: () => false
+	});
+	rejouable = computed(() => this.rejouableSelonLaTable() && (this.variante() !== "limite" || this.attente() !== null), ...ngDevMode ? [{ debugName: "rejouable" }] : 	/* istanbul ignore next */ []);
+	enAttente = computed(() => this.attente() !== null && !this.attenteFinie(), ...ngDevMode ? [{ debugName: "enAttente" }] : 	/* istanbul ignore next */ []);
+	raisonDuRejeu = computed(() => this.enAttente() ? this.decompte()?.phrase() ?? null : null, ...ngDevMode ? [{ debugName: "raisonDuRejeu" }] : 	/* istanbul ignore next */ []);
+	constructor() {
+		effect(() => {
+			this.erreur();
+			afterNextRender(() => {
+				this.banniere().nativeElement.focus();
+			}, { injector: this.injecteur });
+		});
+	}
+	finDeLAttente() {
+		this.attenteFinie.set(true);
+		this.attenteTerminee.emit();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StRefusal,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: StRefusal,
+		isStandalone: true,
+		selector: "st-refusal",
+		inputs: {
+			erreur: {
+				classPropertyName: "erreur",
+				publicName: "erreur",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			message: {
+				classPropertyName: "message",
+				publicName: "message",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			titre: {
+				classPropertyName: "titre",
+				publicName: "titre",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			codeInconnu: {
+				classPropertyName: "codeInconnu",
+				publicName: "codeInconnu",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			rejeuEnCours: {
+				classPropertyName: "rejeuEnCours",
+				publicName: "rejeuEnCours",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			rechargementEnCours: {
+				classPropertyName: "rechargementEnCours",
+				publicName: "rechargementEnCours",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			rejeu: "rejeu",
+			rechargement: "rechargement",
+			attenteTerminee: "attenteTerminee"
+		},
+		host: {
+			properties: { "attr.data-variante": "variante()" },
+			classAttribute: "st-refusal"
+		},
+		viewQueries: [{
+			propertyName: "banniere",
+			first: true,
+			predicate: StBanner,
+			descendants: true,
+			read: ElementRef,
+			isSignal: true
+		}, {
+			propertyName: "decompte",
+			first: true,
+			predicate: StTimer,
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "<!-- Sans alert ni status (REGION_VIVANTE_PARENTE, D-18) : le focus seul la fait lire, une fois. -->\n<st-banner tabindex=\"-1\" [ton]=\"ton()\" [titre]=\"titreLu()\" [message]=\"message()\">\n  @if (attente(); as secondes) {\n    <st-timer [secondes]=\"secondes\" (termine)=\"finDeLAttente()\" />\n  }\n  <div class=\"st-refusal__actions\">\n    <!-- `chargement` : la requete relancee attend, et un second clic est avale (D-7). -->\n    @if (variante() === 'conflit') {\n      <button\n        stButton\n        type=\"button\"\n        taille=\"sm\"\n        iconeAvant=\"rafraichir\"\n        [chargement]=\"rechargementEnCours()\"\n        (click)=\"rechargement.emit()\"\n      >\n        {{ libelles().recharger }}\n      </button>\n    } @else if (rejouable()) {\n      <button\n        stButton\n        type=\"button\"\n        taille=\"sm\"\n        iconeAvant=\"rafraichir\"\n        [chargement]=\"rejeuEnCours()\"\n        [indisponible]=\"enAttente()\"\n        [raisonIndisponible]=\"raisonDuRejeu()\"\n        (click)=\"rejeu.emit()\"\n      >\n        {{ libelles().reessayer }}\n      </button>\n    }\n    <ng-content select=\"[actions]\" />\n  </div>\n  @if (codeInconnu()) {\n    <div class=\"st-refusal__technique\">\n      <div class=\"st-refusal__fait\">\n        <!-- Vue ici, lue par st-code, qui la dit avant la valeur : une seule lecture. -->\n        <span class=\"st-refusal__etiquette\" aria-hidden=\"true\">{{ libelles().codeTechnique }}</span>\n        <st-code [valeur]=\"erreur().code\" [etiquette]=\"libelles().codeTechnique\" />\n      </div>\n      @if (erreur().traceId; as trace) {\n        <div class=\"st-refusal__fait\">\n          <span class=\"st-refusal__etiquette\" aria-hidden=\"true\">{{\n            libelles().identifiantDeTrace\n          }}</span>\n          <st-code [valeur]=\"trace\" [etiquette]=\"libelles().identifiantDeTrace\" />\n        </div>\n      }\n    </div>\n  }\n</st-banner>\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}st-banner:focus{outline:var(--st-focus-epaisseur) solid var(--st-couleur-anneau-focus);outline-offset:var(--st-focus-decalage);box-shadow:0 0 0 var(--st-focus-lisere) var(--st-couleur-lisere-focus)}.st-refusal__actions{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2);align-items:center;margin-block-start:var(--st-espacement-2)}.st-refusal__actions:empty{display:none}.st-refusal__technique{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2) var(--st-espacement-4);margin-block-start:var(--st-espacement-2)}.st-refusal__fait{display:grid;gap:var(--st-espacement-1);justify-items:start}.st-refusal__etiquette{font-size:var(--st-taille-xs);font-weight:var(--st-graisse-semi);line-height:var(--st-interligne-xs);text-transform:uppercase;letter-spacing:var(--st-interlettrage-capitales)}\n"],
+		dependencies: [
+			{
+				kind: "component",
+				type: StBanner,
+				selector: "st-banner",
+				inputs: [
+					"ton",
+					"message",
+					"titre",
+					"forme",
+					"identifiant",
+					"fermable",
+					"libelleFermeture"
+				],
+				outputs: ["ferme"]
+			},
+			{
+				kind: "component",
+				type: StButton,
+				selector: "button[stButton]",
+				inputs: [
+					"variante",
+					"taille",
+					"pleineLargeur",
+					"iconeAvant",
+					"iconeApres",
+					"chargement",
+					"indisponible",
+					"raisonIndisponible"
+				]
+			},
+			{
+				kind: "component",
+				type: StCode,
+				selector: "st-code",
+				inputs: [
+					"valeur",
+					"copiable",
+					"etiquette",
+					"libelleCopier",
+					"messageDeConfirmation"
+				],
+				outputs: ["copie"]
+			},
+			{
+				kind: "component",
+				type: StTimer,
+				selector: "st-timer",
+				inputs: [
+					"secondes",
+					"echeance",
+					"nature",
+					"variante",
+					"avecIcone"
+				],
+				outputs: ["termine"]
+			}
+		],
+		viewProviders: [{
+			provide: REGION_VIVANTE_PARENTE,
+			useValue: true
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StRefusal,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-refusal",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				StBanner,
+				StButton,
+				StCode,
+				StTimer
+			],
+			viewProviders: [{
+				provide: REGION_VIVANTE_PARENTE,
+				useValue: true
+			}],
+			host: {
+				class: "st-refusal",
+				"[attr.data-variante]": "variante()"
+			},
+			template: "<!-- Sans alert ni status (REGION_VIVANTE_PARENTE, D-18) : le focus seul la fait lire, une fois. -->\n<st-banner tabindex=\"-1\" [ton]=\"ton()\" [titre]=\"titreLu()\" [message]=\"message()\">\n  @if (attente(); as secondes) {\n    <st-timer [secondes]=\"secondes\" (termine)=\"finDeLAttente()\" />\n  }\n  <div class=\"st-refusal__actions\">\n    <!-- `chargement` : la requete relancee attend, et un second clic est avale (D-7). -->\n    @if (variante() === 'conflit') {\n      <button\n        stButton\n        type=\"button\"\n        taille=\"sm\"\n        iconeAvant=\"rafraichir\"\n        [chargement]=\"rechargementEnCours()\"\n        (click)=\"rechargement.emit()\"\n      >\n        {{ libelles().recharger }}\n      </button>\n    } @else if (rejouable()) {\n      <button\n        stButton\n        type=\"button\"\n        taille=\"sm\"\n        iconeAvant=\"rafraichir\"\n        [chargement]=\"rejeuEnCours()\"\n        [indisponible]=\"enAttente()\"\n        [raisonIndisponible]=\"raisonDuRejeu()\"\n        (click)=\"rejeu.emit()\"\n      >\n        {{ libelles().reessayer }}\n      </button>\n    }\n    <ng-content select=\"[actions]\" />\n  </div>\n  @if (codeInconnu()) {\n    <div class=\"st-refusal__technique\">\n      <div class=\"st-refusal__fait\">\n        <!-- Vue ici, lue par st-code, qui la dit avant la valeur : une seule lecture. -->\n        <span class=\"st-refusal__etiquette\" aria-hidden=\"true\">{{ libelles().codeTechnique }}</span>\n        <st-code [valeur]=\"erreur().code\" [etiquette]=\"libelles().codeTechnique\" />\n      </div>\n      @if (erreur().traceId; as trace) {\n        <div class=\"st-refusal__fait\">\n          <span class=\"st-refusal__etiquette\" aria-hidden=\"true\">{{\n            libelles().identifiantDeTrace\n          }}</span>\n          <st-code [valeur]=\"trace\" [etiquette]=\"libelles().identifiantDeTrace\" />\n        </div>\n      }\n    </div>\n  }\n</st-banner>\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}st-banner:focus{outline:var(--st-focus-epaisseur) solid var(--st-couleur-anneau-focus);outline-offset:var(--st-focus-decalage);box-shadow:0 0 0 var(--st-focus-lisere) var(--st-couleur-lisere-focus)}.st-refusal__actions{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2);align-items:center;margin-block-start:var(--st-espacement-2)}.st-refusal__actions:empty{display:none}.st-refusal__technique{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2) var(--st-espacement-4);margin-block-start:var(--st-espacement-2)}.st-refusal__fait{display:grid;gap:var(--st-espacement-1);justify-items:start}.st-refusal__etiquette{font-size:var(--st-taille-xs);font-weight:var(--st-graisse-semi);line-height:var(--st-interligne-xs);text-transform:uppercase;letter-spacing:var(--st-interlettrage-capitales)}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		erreur: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "erreur",
+				required: true
+			}]
+		}],
+		message: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "message",
+				required: true
+			}]
+		}],
+		titre: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "titre",
+				required: false
+			}]
+		}],
+		codeInconnu: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "codeInconnu",
+				required: false
+			}]
+		}],
+		rejeuEnCours: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "rejeuEnCours",
+				required: false
+			}]
+		}],
+		rechargementEnCours: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "rechargementEnCours",
+				required: false
+			}]
+		}],
+		rejeu: [{
+			type: i0.Output,
+			args: ["rejeu"]
+		}],
+		rechargement: [{
+			type: i0.Output,
+			args: ["rechargement"]
+		}],
+		attenteTerminee: [{
+			type: i0.Output,
+			args: ["attenteTerminee"]
+		}],
+		banniere: [{
+			type: i0.ViewChild,
+			args: [i0.forwardRef(() => StBanner), {
+				read: ElementRef,
+				isSignal: true
+			}]
+		}],
+		decompte: [{
+			type: i0.ViewChild,
+			args: [i0.forwardRef(() => StTimer), { isSignal: true }]
+		}]
+	}
+});
+const TONS = {
+	succes: "succes",
+	attente: "information",
+	echec: "danger",
+	partiel: "avertissement"
+};
+var StOutcome = class StOutcome {
+	libelles = inject(ST_LIBELLES);
+	issue = input.required(...ngDevMode ? [{ debugName: "issue" }] : 	/* istanbul ignore next */ []);
+	titre = input.required(...ngDevMode ? [{ debugName: "titre" }] : 	/* istanbul ignore next */ []);
+	precision = input(null, ...ngDevMode ? [{ debugName: "precision" }] : 	/* istanbul ignore next */ []);
+	reference = input(null, ...ngDevMode ? [{ debugName: "reference" }] : 	/* istanbul ignore next */ []);
+	etiquetteDeReference = input(null, ...ngDevMode ? [{ debugName: "etiquetteDeReference" }] : 	/* istanbul ignore next */ []);
+	horodatage = input(null, ...ngDevMode ? [{ debugName: "horodatage" }] : 	/* istanbul ignore next */ []);
+	etiquetteDHorodatage = input(null, ...ngDevMode ? [{ debugName: "etiquetteDHorodatage" }] : 	/* istanbul ignore next */ []);
+	niveauDuTitre = input(1, ...ngDevMode ? [{ debugName: "niveauDuTitre" }] : 	/* istanbul ignore next */ []);
+	disposition = input("page", ...ngDevMode ? [{ debugName: "disposition" }] : 	/* istanbul ignore next */ []);
+	ton = computed(() => TONS[this.issue()], ...ngDevMode ? [{ debugName: "ton" }] : 	/* istanbul ignore next */ []);
+	icone = computed(() => this.issue() === "attente" ? "horloge" : ICONES_DE_TON[this.ton()], ...ngDevMode ? [{ debugName: "icone" }] : 	/* istanbul ignore next */ []);
+	mot = computed(() => {
+		const libelles = this.libelles();
+		switch (this.ton()) {
+			case "succes": return libelles.tonSucces;
+			case "danger": return libelles.tonDanger;
+			case "avertissement": return libelles.tonAvertissement;
+			default: return libelles.tonInformation;
+		}
+	}, ...ngDevMode ? [{ debugName: "mot" }] : 	/* istanbul ignore next */ []);
+	etiquetteDeReferenceLue = computed(() => this.etiquetteDeReference() ?? this.libelles().referenceDeLOperation, ...ngDevMode ? [{ debugName: "etiquetteDeReferenceLue" }] : 	/* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StOutcome,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: StOutcome,
+		isStandalone: true,
+		selector: "st-outcome",
+		inputs: {
+			issue: {
+				classPropertyName: "issue",
+				publicName: "issue",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			titre: {
+				classPropertyName: "titre",
+				publicName: "titre",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			precision: {
+				classPropertyName: "precision",
+				publicName: "precision",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			reference: {
+				classPropertyName: "reference",
+				publicName: "reference",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			etiquetteDeReference: {
+				classPropertyName: "etiquetteDeReference",
+				publicName: "etiquetteDeReference",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			horodatage: {
+				classPropertyName: "horodatage",
+				publicName: "horodatage",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			etiquetteDHorodatage: {
+				classPropertyName: "etiquetteDHorodatage",
+				publicName: "etiquetteDHorodatage",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			niveauDuTitre: {
+				classPropertyName: "niveauDuTitre",
+				publicName: "niveauDuTitre",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disposition: {
+				classPropertyName: "disposition",
+				publicName: "disposition",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			properties: {
+				"attr.data-issue": "issue()",
+				"attr.data-disposition": "disposition()"
+			},
+			classAttribute: "st-outcome"
+		},
+		ngImport: i0,
+		template: "<div class=\"st-outcome__entete\">\n  <st-icon\n    class=\"st-outcome__icone\"\n    [nom]=\"icone()\"\n    variante=\"plein\"\n    [ton]=\"ton()\"\n    [taille]=\"disposition() === 'page' ? '48' : '20'\"\n  />\n  @switch (niveauDuTitre()) {\n    @case (1) {\n      <h1 stHeading class=\"st-outcome__titre\" [taille]=\"disposition() === 'page' ? '2xl' : 'sm'\">\n        <span class=\"st-vh\">{{ mot() }}</span\n        >{{ titre() }}\n      </h1>\n    }\n    @case (2) {\n      <h2 stHeading class=\"st-outcome__titre\" [taille]=\"disposition() === 'page' ? '2xl' : 'sm'\">\n        <span class=\"st-vh\">{{ mot() }}</span\n        >{{ titre() }}\n      </h2>\n    }\n    @case (3) {\n      <h3 stHeading class=\"st-outcome__titre\" [taille]=\"disposition() === 'page' ? '2xl' : 'sm'\">\n        <span class=\"st-vh\">{{ mot() }}</span\n        >{{ titre() }}\n      </h3>\n    }\n    @default {\n      <h4 stHeading class=\"st-outcome__titre\" [taille]=\"disposition() === 'page' ? '2xl' : 'sm'\">\n        <span class=\"st-vh\">{{ mot() }}</span\n        >{{ titre() }}\n      </h4>\n    }\n  }\n  <span class=\"st-outcome__etiquette\"><ng-content select=\"[etiquette]\" /></span>\n</div>\n\n@if (precision(); as texte) {\n  <p class=\"st-outcome__precision\">{{ texte }}</p>\n}\n\n@if (reference() !== null || horodatage() !== null) {\n  <div class=\"st-outcome__faits\">\n    @if (reference(); as valeur) {\n      <div class=\"st-outcome__fait\">\n        <!-- Vue ici, lue par st-code, qui la dit avant la valeur : une seule lecture. -->\n        <span class=\"st-outcome__etiquette-de-fait\" aria-hidden=\"true\">{{\n          etiquetteDeReferenceLue()\n        }}</span>\n        <st-code [valeur]=\"valeur\" [etiquette]=\"etiquetteDeReferenceLue()\" />\n      </div>\n    }\n    @if (horodatage(); as instant) {\n      <div class=\"st-outcome__fait\">\n        @if (etiquetteDHorodatage(); as etiquette) {\n          <span class=\"st-outcome__etiquette-de-fait\">{{ etiquette }}</span>\n        }\n        <st-date class=\"st-outcome__instant\" [valeur]=\"instant\" format=\"date-heure\" />\n      </div>\n    }\n    <span class=\"st-outcome__medaillon\"><ng-content select=\"[medaillon]\" /></span>\n  </div>\n}\n\n<ng-content select=\"[recapitulatif]\" />\n<ng-content select=\"[suite]\" />\n<div class=\"st-outcome__actions\"><ng-content select=\"[actions]\" /></div>\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:grid;gap:var(--st-espacement-4);justify-items:start}.st-outcome__entete{display:grid;gap:var(--st-espacement-3);justify-items:start}.st-outcome__titre{margin:0}.st-outcome__precision{max-inline-size:var(--st-largeur-normale);margin:0;color:var(--st-couleur-texte-discret)}.st-outcome__faits{display:flex;flex-wrap:wrap;gap:var(--st-espacement-3) var(--st-espacement-6);align-items:center}.st-outcome__fait{display:grid;gap:var(--st-espacement-1);justify-items:start}.st-outcome__etiquette-de-fait{font-size:var(--st-taille-xs);font-weight:var(--st-graisse-semi);line-height:var(--st-interligne-xs);color:var(--st-couleur-texte-discret);text-transform:uppercase;letter-spacing:var(--st-interlettrage-capitales)}.st-outcome__instant{font-weight:var(--st-graisse-semi)}.st-outcome__actions{display:flex;flex-wrap:wrap;gap:var(--st-espacement-3);align-items:center}.st-outcome__actions:empty{display:none}:host ::ng-deep .st-outcome__actions>[actions]{display:flex;flex-wrap:wrap;gap:var(--st-espacement-3);align-items:center}.st-outcome__etiquette:empty,.st-outcome__medaillon:empty{display:none}:host([data-disposition=compacte]){gap:var(--st-espacement-2);justify-items:stretch;padding:var(--st-espacement-4);background:var(--st-couleur-surface-conteneur-bas);border-radius:var(--st-rayon-lg)}:host([data-disposition=compacte]) .st-outcome__entete{display:flex;gap:var(--st-espacement-1-5);align-items:center}:host([data-disposition=compacte]) .st-outcome__titre{flex:1;font-weight:var(--st-graisse-semi)}:host([data-disposition=compacte]) .st-outcome__faits{justify-content:space-between}:host([data-disposition=compacte][data-issue=succes]) .st-outcome__titre{color:var(--st-couleur-succes)}:host([data-disposition=compacte][data-issue=echec]) .st-outcome__titre{color:var(--st-couleur-danger)}@media(forced-colors:active){:host([data-disposition=compacte]){border:var(--st-epaisseur-fine) solid CanvasText}}\n"],
+		dependencies: [
+			{
+				kind: "component",
+				type: StCode,
+				selector: "st-code",
+				inputs: [
+					"valeur",
+					"copiable",
+					"etiquette",
+					"libelleCopier",
+					"messageDeConfirmation"
+				],
+				outputs: ["copie"]
+			},
+			{
+				kind: "component",
+				type: StDate,
+				selector: "st-date",
+				inputs: [
+					"valeur",
+					"format",
+					"fuseau",
+					"afficherLeFuseau",
+					"variante"
+				]
+			},
+			{
+				kind: "component",
+				type: StHeading,
+				selector: "h1[stHeading], h2[stHeading], h3[stHeading], h4[stHeading], h5[stHeading], h6[stHeading]",
+				inputs: [
+					"taille",
+					"serre",
+					"identifiant"
+				]
+			},
+			{
+				kind: "component",
+				type: StIcon,
+				selector: "st-icon",
+				inputs: [
+					"icone",
+					"nom",
+					"variante",
+					"sprite",
+					"nomMetier",
+					"taille",
+					"ton",
+					"etiquette",
+					"miroir"
+				]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StOutcome,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-outcome",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				StCode,
+				StDate,
+				StHeading,
+				StIcon
+			],
+			host: {
+				class: "st-outcome",
+				"[attr.data-issue]": "issue()",
+				"[attr.data-disposition]": "disposition()"
+			},
+			template: "<div class=\"st-outcome__entete\">\n  <st-icon\n    class=\"st-outcome__icone\"\n    [nom]=\"icone()\"\n    variante=\"plein\"\n    [ton]=\"ton()\"\n    [taille]=\"disposition() === 'page' ? '48' : '20'\"\n  />\n  @switch (niveauDuTitre()) {\n    @case (1) {\n      <h1 stHeading class=\"st-outcome__titre\" [taille]=\"disposition() === 'page' ? '2xl' : 'sm'\">\n        <span class=\"st-vh\">{{ mot() }}</span\n        >{{ titre() }}\n      </h1>\n    }\n    @case (2) {\n      <h2 stHeading class=\"st-outcome__titre\" [taille]=\"disposition() === 'page' ? '2xl' : 'sm'\">\n        <span class=\"st-vh\">{{ mot() }}</span\n        >{{ titre() }}\n      </h2>\n    }\n    @case (3) {\n      <h3 stHeading class=\"st-outcome__titre\" [taille]=\"disposition() === 'page' ? '2xl' : 'sm'\">\n        <span class=\"st-vh\">{{ mot() }}</span\n        >{{ titre() }}\n      </h3>\n    }\n    @default {\n      <h4 stHeading class=\"st-outcome__titre\" [taille]=\"disposition() === 'page' ? '2xl' : 'sm'\">\n        <span class=\"st-vh\">{{ mot() }}</span\n        >{{ titre() }}\n      </h4>\n    }\n  }\n  <span class=\"st-outcome__etiquette\"><ng-content select=\"[etiquette]\" /></span>\n</div>\n\n@if (precision(); as texte) {\n  <p class=\"st-outcome__precision\">{{ texte }}</p>\n}\n\n@if (reference() !== null || horodatage() !== null) {\n  <div class=\"st-outcome__faits\">\n    @if (reference(); as valeur) {\n      <div class=\"st-outcome__fait\">\n        <!-- Vue ici, lue par st-code, qui la dit avant la valeur : une seule lecture. -->\n        <span class=\"st-outcome__etiquette-de-fait\" aria-hidden=\"true\">{{\n          etiquetteDeReferenceLue()\n        }}</span>\n        <st-code [valeur]=\"valeur\" [etiquette]=\"etiquetteDeReferenceLue()\" />\n      </div>\n    }\n    @if (horodatage(); as instant) {\n      <div class=\"st-outcome__fait\">\n        @if (etiquetteDHorodatage(); as etiquette) {\n          <span class=\"st-outcome__etiquette-de-fait\">{{ etiquette }}</span>\n        }\n        <st-date class=\"st-outcome__instant\" [valeur]=\"instant\" format=\"date-heure\" />\n      </div>\n    }\n    <span class=\"st-outcome__medaillon\"><ng-content select=\"[medaillon]\" /></span>\n  </div>\n}\n\n<ng-content select=\"[recapitulatif]\" />\n<ng-content select=\"[suite]\" />\n<div class=\"st-outcome__actions\"><ng-content select=\"[actions]\" /></div>\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:grid;gap:var(--st-espacement-4);justify-items:start}.st-outcome__entete{display:grid;gap:var(--st-espacement-3);justify-items:start}.st-outcome__titre{margin:0}.st-outcome__precision{max-inline-size:var(--st-largeur-normale);margin:0;color:var(--st-couleur-texte-discret)}.st-outcome__faits{display:flex;flex-wrap:wrap;gap:var(--st-espacement-3) var(--st-espacement-6);align-items:center}.st-outcome__fait{display:grid;gap:var(--st-espacement-1);justify-items:start}.st-outcome__etiquette-de-fait{font-size:var(--st-taille-xs);font-weight:var(--st-graisse-semi);line-height:var(--st-interligne-xs);color:var(--st-couleur-texte-discret);text-transform:uppercase;letter-spacing:var(--st-interlettrage-capitales)}.st-outcome__instant{font-weight:var(--st-graisse-semi)}.st-outcome__actions{display:flex;flex-wrap:wrap;gap:var(--st-espacement-3);align-items:center}.st-outcome__actions:empty{display:none}:host ::ng-deep .st-outcome__actions>[actions]{display:flex;flex-wrap:wrap;gap:var(--st-espacement-3);align-items:center}.st-outcome__etiquette:empty,.st-outcome__medaillon:empty{display:none}:host([data-disposition=compacte]){gap:var(--st-espacement-2);justify-items:stretch;padding:var(--st-espacement-4);background:var(--st-couleur-surface-conteneur-bas);border-radius:var(--st-rayon-lg)}:host([data-disposition=compacte]) .st-outcome__entete{display:flex;gap:var(--st-espacement-1-5);align-items:center}:host([data-disposition=compacte]) .st-outcome__titre{flex:1;font-weight:var(--st-graisse-semi)}:host([data-disposition=compacte]) .st-outcome__faits{justify-content:space-between}:host([data-disposition=compacte][data-issue=succes]) .st-outcome__titre{color:var(--st-couleur-succes)}:host([data-disposition=compacte][data-issue=echec]) .st-outcome__titre{color:var(--st-couleur-danger)}@media(forced-colors:active){:host([data-disposition=compacte]){border:var(--st-epaisseur-fine) solid CanvasText}}\n"]
+		}]
+	}],
+	propDecorators: {
+		issue: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "issue",
+				required: true
+			}]
+		}],
+		titre: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "titre",
+				required: true
+			}]
+		}],
+		precision: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "precision",
+				required: false
+			}]
+		}],
+		reference: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "reference",
+				required: false
+			}]
+		}],
+		etiquetteDeReference: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etiquetteDeReference",
+				required: false
+			}]
+		}],
+		horodatage: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "horodatage",
+				required: false
+			}]
+		}],
+		etiquetteDHorodatage: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etiquetteDHorodatage",
+				required: false
+			}]
+		}],
+		niveauDuTitre: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "niveauDuTitre",
+				required: false
+			}]
+		}],
+		disposition: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disposition",
+				required: false
+			}]
+		}]
+	}
+});
+const PROFILS = {
+	"a-faire": {
+		ton: "neutre",
+		icone: "cercle"
+	},
+	"en-cours": {
+		ton: "information",
+		icone: "horloge"
+	},
+	terminee: {
+		ton: "succes",
+		icone: "cercle-coche"
+	},
+	refusee: {
+		ton: "danger",
+		icone: "cercle-croix"
+	},
+	bloquee: {
+		ton: "neutre",
+		icone: "cadenas"
+	}
+};
+var StTaskList = class StTaskList {
+	libelles = inject(ST_LIBELLES);
+	identifiants = inject(StIdentifiants);
+	taches = input.required(...ngDevMode ? [{ debugName: "taches" }] : 	/* istanbul ignore next */ []);
+	etiquette = input.required(...ngDevMode ? [{ debugName: "etiquette" }] : 	/* istanbul ignore next */ []);
+	sections = input(null, ...ngDevMode ? [{ debugName: "sections" }] : 	/* istanbul ignore next */ []);
+	niveauDuTitre = input(2, ...ngDevMode ? [{ debugName: "niveauDuTitre" }] : 	/* istanbul ignore next */ []);
+	resume = input(true, {
+		...ngDevMode ? { debugName: "resume" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	ouverture = output();
+	prefixe = this.identifiants.prochain("st-tache");
+	lues = computed(() => this.taches().map((tache, indice) => {
+		const profil = PROFILS[tache.statut];
+		const idDuStatut = `${this.prefixe}-${String(indice)}-statut`;
+		const idDeLaPrecision = (tache.statut === "bloquee" ? tache.raison : tache.precision) === void 0 ? null : `${this.prefixe}-${String(indice)}-precision`;
+		return {
+			...tache,
+			ton: profil.ton,
+			icone: profil.icone,
+			idDuStatut,
+			idDeLaPrecision,
+			decritPar: idDeLaPrecision === null ? idDuStatut : `${idDuStatut} ${idDeLaPrecision}`
+		};
+	}), ...ngDevMode ? [{ debugName: "lues" }] : 	/* istanbul ignore next */ []);
+	groupes = computed(() => {
+		const sections = this.sections();
+		if (sections === null) return null;
+		const parCle = new Map(this.lues().map((tache) => [tache.cle, tache]));
+		return sections.map((section) => ({
+			titre: section.titre,
+			taches: section.cles.flatMap((cle) => {
+				const tache = parCle.get(cle);
+				return tache === void 0 ? [] : [tache];
+			})
+		}));
+	}, ...ngDevMode ? [{ debugName: "groupes" }] : 	/* istanbul ignore next */ []);
+	texteDuResume = computed(() => {
+		const taches = this.taches();
+		const faites = taches.filter((tache) => tache.statut === "terminee").length;
+		return this.libelles().tachesTerminees(faites, taches.length);
+	}, ...ngDevMode ? [{ debugName: "texteDuResume" }] : 	/* istanbul ignore next */ []);
+	idDuTitre = (indice) => `${this.prefixe}-section-${String(indice)}`;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StTaskList,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: StTaskList,
+		isStandalone: true,
+		selector: "st-task-list",
+		inputs: {
+			taches: {
+				classPropertyName: "taches",
+				publicName: "taches",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			etiquette: {
+				classPropertyName: "etiquette",
+				publicName: "etiquette",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			sections: {
+				classPropertyName: "sections",
+				publicName: "sections",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			niveauDuTitre: {
+				classPropertyName: "niveauDuTitre",
+				publicName: "niveauDuTitre",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			resume: {
+				classPropertyName: "resume",
+				publicName: "resume",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { ouverture: "ouverture" },
+		host: { classAttribute: "st-task-list" },
+		ngImport: i0,
+		template: "@if (resume()) {\n  <p class=\"st-task-list__resume\">{{ texteDuResume() }}</p>\n}\n@if (groupes(); as groupes) {\n  @for (groupe of groupes; track groupe.titre; let indice = $index) {\n    <section class=\"st-task-list__section\" [attr.aria-labelledby]=\"idDuTitre(indice)\">\n      @switch (niveauDuTitre()) {\n        @case (2) {\n          <h2 stHeading taille=\"md\" class=\"st-task-list__titre\" [id]=\"idDuTitre(indice)\">\n            {{ groupe.titre }}\n          </h2>\n        }\n        @case (3) {\n          <h3 stHeading taille=\"md\" class=\"st-task-list__titre\" [id]=\"idDuTitre(indice)\">\n            {{ groupe.titre }}\n          </h3>\n        }\n        @default {\n          <h4 stHeading taille=\"md\" class=\"st-task-list__titre\" [id]=\"idDuTitre(indice)\">\n            {{ groupe.titre }}\n          </h4>\n        }\n      }\n      <!-- `role=\"list\"` : sans puces, Safari ne lit plus une liste comme une liste (D-1). -->\n      <ul class=\"st-task-list__liste\" role=\"list\" [attr.aria-labelledby]=\"idDuTitre(indice)\">\n        @for (tache of groupe.taches; track tache.cle) {\n          <ng-container\n            [ngTemplateOutlet]=\"rangee\"\n            [ngTemplateOutletContext]=\"{ $implicit: tache }\"\n          />\n        }\n      </ul>\n    </section>\n  }\n} @else {\n  <!-- `role=\"list\"` : sans puces, Safari ne lit plus une liste comme une liste (D-1). -->\n  <ul class=\"st-task-list__liste\" role=\"list\" [attr.aria-label]=\"etiquette()\">\n    @for (tache of lues(); track tache.cle) {\n      <ng-container [ngTemplateOutlet]=\"rangee\" [ngTemplateOutletContext]=\"{ $implicit: tache }\" />\n    }\n  </ul>\n}\n\n<ng-template #rangee let-tache>\n  <li class=\"st-task-list__tache\" [attr.data-statut]=\"tache.statut\">\n    <div class=\"st-task-list__textes\">\n      @if (tache.statut === 'bloquee') {\n        <span class=\"st-task-list__nom\">{{ tache.titre }}</span>\n      } @else if (tache.lien) {\n        <a\n          stLink\n          class=\"st-task-list__nom st-task-list__lien\"\n          [routerLink]=\"tache.lien\"\n          [attr.aria-describedby]=\"tache.decritPar\"\n          >{{ tache.titre }}</a\n        >\n      } @else {\n        <button\n          type=\"button\"\n          class=\"st-task-list__nom st-task-list__lien st-task-list__bouton\"\n          [attr.aria-describedby]=\"tache.decritPar\"\n          (click)=\"ouverture.emit(tache.cle)\"\n        >\n          {{ tache.titre }}\n        </button>\n      }\n      @if (tache.idDeLaPrecision; as id) {\n        <span class=\"st-task-list__precision\" [id]=\"id\">{{\n          tache.statut === 'bloquee' ? tache.raison : tache.precision\n        }}</span>\n      }\n    </div>\n    <!-- Le statut sur la ligne du nom de la tache, pas au milieu de sa precision. -->\n    <span class=\"st-task-list__statut\">\n      <st-status-pill\n        [id]=\"tache.idDuStatut\"\n        [statut]=\"tache.statut\"\n        [libelle]=\"tache.libelleDuStatut\"\n        [ton]=\"tache.ton\"\n        [icone]=\"tache.icone\"\n      />\n    </span>\n  </li>\n</ng-template>\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:grid;gap:var(--st-espacement-4)}.st-task-list__resume{margin:0;color:var(--st-couleur-texte-discret)}.st-task-list__section{display:grid;gap:var(--st-espacement-2)}.st-task-list__titre{margin:0}.st-task-list__liste{margin:0;padding:0;list-style:none;border-block-start:var(--st-epaisseur-fine) solid var(--st-couleur-bordure)}.st-task-list__tache{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2) var(--st-espacement-4);align-items:start;justify-content:space-between;padding-block:var(--st-espacement-2);border-block-end:var(--st-epaisseur-fine) solid var(--st-couleur-bordure)}.st-task-list__textes{display:grid;flex:1 1 16rem;min-inline-size:0}.st-task-list__lien{display:flex;align-items:center;min-block-size:var(--st-cible-tactile-min);font-weight:var(--st-graisse-semi)}.st-task-list__bouton:focus-visible{outline:var(--st-focus-epaisseur) solid var(--st-couleur-anneau-focus);outline-offset:var(--st-focus-decalage);box-shadow:0 0 0 var(--st-focus-lisere) var(--st-couleur-lisere-focus)}.st-task-list__bouton{padding:0;font:inherit;font-weight:var(--st-graisse-semi);color:var(--st-couleur-texte-primaire);text-align:start;text-decoration:underline;text-decoration-thickness:var(--st-epaisseur-fine);text-decoration-skip-ink:auto;text-underline-offset:var(--st-espacement-demi);cursor:pointer;background:none;border:0;border-radius:var(--st-rayon-xs);transition:color var(--st-duree-rapide) var(--st-courbe-standard)}@media(hover:hover){.st-task-list__bouton:hover{color:var(--st-couleur-primaire-survol);text-decoration-thickness:var(--st-epaisseur-moyenne)}}.st-task-list__bouton:active{color:var(--st-couleur-primaire-actif)}@media(prefers-contrast:more){.st-task-list__bouton{text-decoration-thickness:var(--st-epaisseur-moyenne)}}.st-task-list__tache[data-statut=bloquee] .st-task-list__nom{display:flex;align-items:center;min-block-size:var(--st-cible-tactile-min);color:var(--st-couleur-texte-discret)}.st-task-list__precision{font-size:var(--st-taille-sm);line-height:var(--st-interligne-sm);color:var(--st-couleur-texte-discret)}.st-task-list__statut{display:flex;flex:none;align-items:center;min-block-size:var(--st-cible-tactile-min)}\n"],
+		dependencies: [
+			{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "directive",
+				type: RouterLink,
+				selector: "[routerLink]",
+				inputs: [
+					"target",
+					"queryParams",
+					"fragment",
+					"queryParamsHandling",
+					"state",
+					"info",
+					"relativeTo",
+					"preserveFragment",
+					"skipLocationChange",
+					"replaceUrl",
+					"browserUrl",
+					"routerLink"
+				]
+			},
+			{
+				kind: "component",
+				type: StHeading,
+				selector: "h1[stHeading], h2[stHeading], h3[stHeading], h4[stHeading], h5[stHeading], h6[stHeading]",
+				inputs: [
+					"taille",
+					"serre",
+					"identifiant"
+				]
+			},
+			{
+				kind: "component",
+				type: StLink,
+				selector: "a[stLink]",
+				inputs: [
+					"variante",
+					"externe",
+					"mentionExterne",
+					"iconeAvant",
+					"iconeApres"
+				]
+			},
+			{
+				kind: "component",
+				type: StStatusPill,
+				selector: "st-status-pill",
+				inputs: [
+					"statut",
+					"libelle",
+					"icone",
+					"ton",
+					"taille",
+					"variante",
+					"casse"
+				]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StTaskList,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-task-list",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				NgTemplateOutlet,
+				RouterLink,
+				StHeading,
+				StLink,
+				StStatusPill
+			],
+			host: { class: "st-task-list" },
+			template: "@if (resume()) {\n  <p class=\"st-task-list__resume\">{{ texteDuResume() }}</p>\n}\n@if (groupes(); as groupes) {\n  @for (groupe of groupes; track groupe.titre; let indice = $index) {\n    <section class=\"st-task-list__section\" [attr.aria-labelledby]=\"idDuTitre(indice)\">\n      @switch (niveauDuTitre()) {\n        @case (2) {\n          <h2 stHeading taille=\"md\" class=\"st-task-list__titre\" [id]=\"idDuTitre(indice)\">\n            {{ groupe.titre }}\n          </h2>\n        }\n        @case (3) {\n          <h3 stHeading taille=\"md\" class=\"st-task-list__titre\" [id]=\"idDuTitre(indice)\">\n            {{ groupe.titre }}\n          </h3>\n        }\n        @default {\n          <h4 stHeading taille=\"md\" class=\"st-task-list__titre\" [id]=\"idDuTitre(indice)\">\n            {{ groupe.titre }}\n          </h4>\n        }\n      }\n      <!-- `role=\"list\"` : sans puces, Safari ne lit plus une liste comme une liste (D-1). -->\n      <ul class=\"st-task-list__liste\" role=\"list\" [attr.aria-labelledby]=\"idDuTitre(indice)\">\n        @for (tache of groupe.taches; track tache.cle) {\n          <ng-container\n            [ngTemplateOutlet]=\"rangee\"\n            [ngTemplateOutletContext]=\"{ $implicit: tache }\"\n          />\n        }\n      </ul>\n    </section>\n  }\n} @else {\n  <!-- `role=\"list\"` : sans puces, Safari ne lit plus une liste comme une liste (D-1). -->\n  <ul class=\"st-task-list__liste\" role=\"list\" [attr.aria-label]=\"etiquette()\">\n    @for (tache of lues(); track tache.cle) {\n      <ng-container [ngTemplateOutlet]=\"rangee\" [ngTemplateOutletContext]=\"{ $implicit: tache }\" />\n    }\n  </ul>\n}\n\n<ng-template #rangee let-tache>\n  <li class=\"st-task-list__tache\" [attr.data-statut]=\"tache.statut\">\n    <div class=\"st-task-list__textes\">\n      @if (tache.statut === 'bloquee') {\n        <span class=\"st-task-list__nom\">{{ tache.titre }}</span>\n      } @else if (tache.lien) {\n        <a\n          stLink\n          class=\"st-task-list__nom st-task-list__lien\"\n          [routerLink]=\"tache.lien\"\n          [attr.aria-describedby]=\"tache.decritPar\"\n          >{{ tache.titre }}</a\n        >\n      } @else {\n        <button\n          type=\"button\"\n          class=\"st-task-list__nom st-task-list__lien st-task-list__bouton\"\n          [attr.aria-describedby]=\"tache.decritPar\"\n          (click)=\"ouverture.emit(tache.cle)\"\n        >\n          {{ tache.titre }}\n        </button>\n      }\n      @if (tache.idDeLaPrecision; as id) {\n        <span class=\"st-task-list__precision\" [id]=\"id\">{{\n          tache.statut === 'bloquee' ? tache.raison : tache.precision\n        }}</span>\n      }\n    </div>\n    <!-- Le statut sur la ligne du nom de la tache, pas au milieu de sa precision. -->\n    <span class=\"st-task-list__statut\">\n      <st-status-pill\n        [id]=\"tache.idDuStatut\"\n        [statut]=\"tache.statut\"\n        [libelle]=\"tache.libelleDuStatut\"\n        [ton]=\"tache.ton\"\n        [icone]=\"tache.icone\"\n      />\n    </span>\n  </li>\n</ng-template>\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:grid;gap:var(--st-espacement-4)}.st-task-list__resume{margin:0;color:var(--st-couleur-texte-discret)}.st-task-list__section{display:grid;gap:var(--st-espacement-2)}.st-task-list__titre{margin:0}.st-task-list__liste{margin:0;padding:0;list-style:none;border-block-start:var(--st-epaisseur-fine) solid var(--st-couleur-bordure)}.st-task-list__tache{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2) var(--st-espacement-4);align-items:start;justify-content:space-between;padding-block:var(--st-espacement-2);border-block-end:var(--st-epaisseur-fine) solid var(--st-couleur-bordure)}.st-task-list__textes{display:grid;flex:1 1 16rem;min-inline-size:0}.st-task-list__lien{display:flex;align-items:center;min-block-size:var(--st-cible-tactile-min);font-weight:var(--st-graisse-semi)}.st-task-list__bouton:focus-visible{outline:var(--st-focus-epaisseur) solid var(--st-couleur-anneau-focus);outline-offset:var(--st-focus-decalage);box-shadow:0 0 0 var(--st-focus-lisere) var(--st-couleur-lisere-focus)}.st-task-list__bouton{padding:0;font:inherit;font-weight:var(--st-graisse-semi);color:var(--st-couleur-texte-primaire);text-align:start;text-decoration:underline;text-decoration-thickness:var(--st-epaisseur-fine);text-decoration-skip-ink:auto;text-underline-offset:var(--st-espacement-demi);cursor:pointer;background:none;border:0;border-radius:var(--st-rayon-xs);transition:color var(--st-duree-rapide) var(--st-courbe-standard)}@media(hover:hover){.st-task-list__bouton:hover{color:var(--st-couleur-primaire-survol);text-decoration-thickness:var(--st-epaisseur-moyenne)}}.st-task-list__bouton:active{color:var(--st-couleur-primaire-actif)}@media(prefers-contrast:more){.st-task-list__bouton{text-decoration-thickness:var(--st-epaisseur-moyenne)}}.st-task-list__tache[data-statut=bloquee] .st-task-list__nom{display:flex;align-items:center;min-block-size:var(--st-cible-tactile-min);color:var(--st-couleur-texte-discret)}.st-task-list__precision{font-size:var(--st-taille-sm);line-height:var(--st-interligne-sm);color:var(--st-couleur-texte-discret)}.st-task-list__statut{display:flex;flex:none;align-items:center;min-block-size:var(--st-cible-tactile-min)}\n"]
+		}]
+	}],
+	propDecorators: {
+		taches: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "taches",
+				required: true
+			}]
+		}],
+		etiquette: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etiquette",
+				required: true
+			}]
+		}],
+		sections: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "sections",
+				required: false
+			}]
+		}],
+		niveauDuTitre: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "niveauDuTitre",
+				required: false
+			}]
+		}],
+		resume: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "resume",
+				required: false
+			}]
+		}],
+		ouverture: [{
+			type: i0.Output,
+			args: ["ouverture"]
+		}]
+	}
+});
+const ST_ASSISTANT = new InjectionToken("ST_ASSISTANT");
+var StWizard = class StWizard {
+	etapes = input.required(...ngDevMode ? [{ debugName: "etapes" }] : 	/* istanbul ignore next */ []);
+	etape = input.required(...ngDevMode ? [{ debugName: "etape" }] : 	/* istanbul ignore next */ []);
+	libelle = input(null, ...ngDevMode ? [{ debugName: "libelle" }] : 	/* istanbul ignore next */ []);
+	etiquette = input(null, ...ngDevMode ? [{ debugName: "etiquette" }] : 	/* istanbul ignore next */ []);
+	orientation = input("horizontale", ...ngDevMode ? [{ debugName: "orientation" }] : 	/* istanbul ignore next */ []);
+	retourVers = input(null, ...ngDevMode ? [{ debugName: "retourVers" }] : 	/* istanbul ignore next */ []);
+	retour = output();
+	total = computed(() => this.etapes().length, ...ngDevMode ? [{ debugName: "total" }] : 	/* istanbul ignore next */ []);
+	numero = computed(() => {
+		const etape = Math.trunc(Number.isFinite(this.etape()) ? this.etape() : 0);
+		return Math.min(this.total(), Math.max(0, etape)) + 1;
+	}, ...ngDevMode ? [{ debugName: "numero" }] : 	/* istanbul ignore next */ []);
+	retourPossible = computed(() => this.retourVers() !== null || this.numero() > 1, ...ngDevMode ? [{ debugName: "retourPossible" }] : 	/* istanbul ignore next */ []);
+	demanderLeRetour() {
+		this.retour.emit();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StWizard,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: StWizard,
+		isStandalone: true,
+		selector: "st-wizard",
+		inputs: {
+			etapes: {
+				classPropertyName: "etapes",
+				publicName: "etapes",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			etape: {
+				classPropertyName: "etape",
+				publicName: "etape",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			libelle: {
+				classPropertyName: "libelle",
+				publicName: "libelle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			etiquette: {
+				classPropertyName: "etiquette",
+				publicName: "etiquette",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			orientation: {
+				classPropertyName: "orientation",
+				publicName: "orientation",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			retourVers: {
+				classPropertyName: "retourVers",
+				publicName: "retourVers",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { retour: "retour" },
+		host: { classAttribute: "st-wizard" },
+		providers: [{
+			provide: ST_ASSISTANT,
+			useExisting: StWizard
+		}],
+		ngImport: i0,
+		template: "<st-stepper\n  class=\"st-wizard__etapes\"\n  [etapes]=\"etapes()\"\n  [etape]=\"etape()\"\n  [libelle]=\"libelle()\"\n  [etiquette]=\"etiquette()\"\n  [orientation]=\"orientation()\"\n/>\n<div class=\"st-wizard__etape\"><ng-content /></div>\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:grid;gap:var(--st-espacement-6);container-type:inline-size}.st-wizard__etape{min-inline-size:0}\n"],
+		dependencies: [{
+			kind: "component",
+			type: StStepper,
+			selector: "st-stepper",
+			inputs: [
+				"etapes",
+				"etape",
+				"etiquette",
+				"libelle",
+				"compacte",
+				"orientation"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StWizard,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-wizard",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [StStepper],
+			providers: [{
+				provide: ST_ASSISTANT,
+				useExisting: StWizard
+			}],
+			host: { class: "st-wizard" },
+			template: "<st-stepper\n  class=\"st-wizard__etapes\"\n  [etapes]=\"etapes()\"\n  [etape]=\"etape()\"\n  [libelle]=\"libelle()\"\n  [etiquette]=\"etiquette()\"\n  [orientation]=\"orientation()\"\n/>\n<div class=\"st-wizard__etape\"><ng-content /></div>\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:grid;gap:var(--st-espacement-6);container-type:inline-size}.st-wizard__etape{min-inline-size:0}\n"]
+		}]
+	}],
+	propDecorators: {
+		etapes: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etapes",
+				required: true
+			}]
+		}],
+		etape: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etape",
+				required: true
+			}]
+		}],
+		libelle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "libelle",
+				required: false
+			}]
+		}],
+		etiquette: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etiquette",
+				required: false
+			}]
+		}],
+		orientation: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "orientation",
+				required: false
+			}]
+		}],
+		retourVers: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "retourVers",
+				required: false
+			}]
+		}],
+		retour: [{
+			type: i0.Output,
+			args: ["retour"]
+		}]
+	}
+});
+var StWizardStep = class StWizardStep {
+	assistant = inject(ST_ASSISTANT, { optional: true });
+	element = inject(ElementRef).nativeElement;
+	libelles = inject(ST_LIBELLES);
+	titre = input.required(...ngDevMode ? [{ debugName: "titre" }] : 	/* istanbul ignore next */ []);
+	niveauDuTitre = input(1, ...ngDevMode ? [{ debugName: "niveauDuTitre" }] : 	/* istanbul ignore next */ []);
+	derniere = input(false, {
+		...ngDevMode ? { debugName: "derniere" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	avertissement = input(null, ...ngDevMode ? [{ debugName: "avertissement" }] : 	/* istanbul ignore next */ []);
+	libelleContinuer = input(null, ...ngDevMode ? [{ debugName: "libelleContinuer" }] : 	/* istanbul ignore next */ []);
+	chargement = input(false, {
+		...ngDevMode ? { debugName: "chargement" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	indisponible = input(false, {
+		...ngDevMode ? { debugName: "indisponible" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	dispositionDesActions = input("pied", ...ngDevMode ? [{ debugName: "dispositionDesActions" }] : 	/* istanbul ignore next */ []);
+	titreLu = computed(() => {
+		const assistant = this.assistant;
+		if (assistant === null) return this.titre();
+		return this.libelles().etapeSur(assistant.numero(), assistant.total(), this.titre());
+	}, ...ngDevMode ? [{ debugName: "titreLu" }] : 	/* istanbul ignore next */ []);
+	compte = computed(() => {
+		const assistant = this.assistant;
+		return assistant === null ? null : this.libelles().etapeSurTotal(assistant.numero(), assistant.total());
+	}, ...ngDevMode ? [{ debugName: "compte" }] : 	/* istanbul ignore next */ []);
+	retourVers = computed(() => this.assistant?.retourVers() ?? null, ...ngDevMode ? [{ debugName: "retourVers" }] : 	/* istanbul ignore next */ []);
+	orientation = computed(() => this.assistant?.orientation() ?? null, ...ngDevMode ? [{ debugName: "orientation" }] : 	/* istanbul ignore next */ []);
+	retourPossible = computed(() => this.assistant?.retourPossible() ?? false, ...ngDevMode ? [{ debugName: "retourPossible" }] : 	/* istanbul ignore next */ []);
+	libelleDeLAction = computed(() => this.derniere() ? this.libelles().confirmer : this.libelleContinuer() ?? this.libelles().continuer, ...ngDevMode ? [{ debugName: "libelleDeLAction" }] : 	/* istanbul ignore next */ []);
+	avecAvertissement = computed(() => this.derniere() && this.avertissement() !== null, ...ngDevMode ? [{ debugName: "avecAvertissement" }] : 	/* istanbul ignore next */ []);
+	idDeLAvertissement = inject(StIdentifiants).prochain("st-etape-avertissement");
+	constructor() {
+		let averti = false;
+		effect(() => {
+			if (!isDevMode() || averti || !this.derniere() || this.avertissement() !== null) return;
+			averti = true;
+			console.warn("[st-wizard-step] derniere etape sans avertissement : dire ce qui ne pourra plus etre annule avant de confirmer (WCAG 3.3.4).");
+		});
+		afterNextRender(() => {
+			if (!isDevMode()) return;
+			const principales = this.element.querySelectorAll("st-form-actions [data-variante=\"primaire\"]").length;
+			if (principales > 1) console.warn(`[st-wizard-step] ${String(principales)} actions principales : une seule par etape.`);
+		});
+	}
+	retourner() {
+		this.assistant?.demanderLeRetour();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StWizardStep,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: StWizardStep,
+		isStandalone: true,
+		selector: "st-wizard-step",
+		inputs: {
+			titre: {
+				classPropertyName: "titre",
+				publicName: "titre",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			niveauDuTitre: {
+				classPropertyName: "niveauDuTitre",
+				publicName: "niveauDuTitre",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			derniere: {
+				classPropertyName: "derniere",
+				publicName: "derniere",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			avertissement: {
+				classPropertyName: "avertissement",
+				publicName: "avertissement",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			libelleContinuer: {
+				classPropertyName: "libelleContinuer",
+				publicName: "libelleContinuer",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			chargement: {
+				classPropertyName: "chargement",
+				publicName: "chargement",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			indisponible: {
+				classPropertyName: "indisponible",
+				publicName: "indisponible",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			dispositionDesActions: {
+				classPropertyName: "dispositionDesActions",
+				publicName: "dispositionDesActions",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			properties: { "attr.data-orientation": "orientation()" },
+			classAttribute: "st-wizard-step"
+		},
+		ngImport: i0,
+		template: "<st-page-title class=\"st-wizard-step__titre\" taille=\"2xl\" [niveau]=\"niveauDuTitre()\">\n  @if (compte(); as texte) {\n    <!-- Lu : « Etape 2 sur 3 : Montant » ; vu : le compte en surtitre, le nom dessous. -->\n    <span class=\"st-wizard-step__compte\" aria-hidden=\"true\">{{ texte }}</span>\n    <span class=\"st-vh\">{{ titreLu() }}</span>\n    <span aria-hidden=\"true\">{{ titre() }}</span>\n  } @else {\n    {{ titre() }}\n  }\n</st-page-title>\n\n<div class=\"st-wizard-step__contenu\"><ng-content /></div>\n<ng-content select=\"[avantActions]\" />\n\n@if (avecAvertissement()) {\n  <st-inline-message\n    class=\"st-wizard-step__avertissement\"\n    ton=\"avertissement\"\n    [identifiant]=\"idDeLAvertissement\"\n    >{{ avertissement() }}</st-inline-message\n  >\n}\n\n<st-form-actions [disposition]=\"dispositionDesActions()\">\n  @if (retourPossible()) {\n    @if (retourVers(); as route) {\n      <a debut stLink class=\"st-wizard-step__retour\" [routerLink]=\"route\">{{\n        libelles().retour\n      }}</a>\n    } @else {\n      <button debut stButton type=\"button\" (click)=\"retourner()\">\n        {{ libelles().retour }}\n      </button>\n    }\n  }\n  <ng-content select=\"[actions]\" />\n  <!-- L'avertissement decrit « Confirmer » : qui tabule droit sur le bouton l'entend (D-33). -->\n  <button\n    stButton\n    type=\"submit\"\n    variante=\"primaire\"\n    [chargement]=\"chargement()\"\n    [indisponible]=\"indisponible()\"\n    [attr.aria-describedby]=\"avecAvertissement() ? idDeLAvertissement : null\"\n  >\n    {{ libelleDeLAction() }}\n  </button>\n</st-form-actions>\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:grid;gap:var(--st-espacement-6)}.st-wizard-step__compte{font-size:var(--st-taille-2xs);line-height:var(--st-interligne-2xs);font-weight:var(--st-graisse-semi);letter-spacing:var(--st-interlettrage-capitales);text-transform:uppercase;display:block;margin-block-end:var(--st-espacement-1);color:var(--st-couleur-texte-discret)}:host([data-orientation=horizontale]) .st-wizard-step__compte{display:none}@container (min-width: 48rem){:host([data-orientation=horizontale]) .st-wizard-step__compte{display:block}}.st-wizard-step__contenu{display:grid;gap:var(--st-espacement-4);min-inline-size:0}.st-wizard-step__retour{display:inline-flex;align-items:center;min-block-size:var(--st-cible-tactile-min)}\n"],
+		dependencies: [
+			{
+				kind: "directive",
+				type: RouterLink,
+				selector: "[routerLink]",
+				inputs: [
+					"target",
+					"queryParams",
+					"fragment",
+					"queryParamsHandling",
+					"state",
+					"info",
+					"relativeTo",
+					"preserveFragment",
+					"skipLocationChange",
+					"replaceUrl",
+					"browserUrl",
+					"routerLink"
+				]
+			},
+			{
+				kind: "component",
+				type: StButton,
+				selector: "button[stButton]",
+				inputs: [
+					"variante",
+					"taille",
+					"pleineLargeur",
+					"iconeAvant",
+					"iconeApres",
+					"chargement",
+					"indisponible",
+					"raisonIndisponible"
+				]
+			},
+			{
+				kind: "component",
+				type: StFormActions,
+				selector: "st-form-actions",
+				inputs: ["disposition"]
+			},
+			{
+				kind: "component",
+				type: StInlineMessage,
+				selector: "st-inline-message",
+				inputs: [
+					"ton",
+					"identifiant",
+					"annonce",
+					"encadre",
+					"icone"
+				]
+			},
+			{
+				kind: "component",
+				type: StLink,
+				selector: "a[stLink]",
+				inputs: [
+					"variante",
+					"externe",
+					"mentionExterne",
+					"iconeAvant",
+					"iconeApres"
+				]
+			},
+			{
+				kind: "component",
+				type: StPageTitle,
+				selector: "st-page-title",
+				inputs: [
+					"precision",
+					"identifiant",
+					"niveau",
+					"taille"
+				]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StWizardStep,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-wizard-step",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				RouterLink,
+				StButton,
+				StFormActions,
+				StInlineMessage,
+				StLink,
+				StPageTitle
+			],
+			host: {
+				class: "st-wizard-step",
+				"[attr.data-orientation]": "orientation()"
+			},
+			template: "<st-page-title class=\"st-wizard-step__titre\" taille=\"2xl\" [niveau]=\"niveauDuTitre()\">\n  @if (compte(); as texte) {\n    <!-- Lu : « Etape 2 sur 3 : Montant » ; vu : le compte en surtitre, le nom dessous. -->\n    <span class=\"st-wizard-step__compte\" aria-hidden=\"true\">{{ texte }}</span>\n    <span class=\"st-vh\">{{ titreLu() }}</span>\n    <span aria-hidden=\"true\">{{ titre() }}</span>\n  } @else {\n    {{ titre() }}\n  }\n</st-page-title>\n\n<div class=\"st-wizard-step__contenu\"><ng-content /></div>\n<ng-content select=\"[avantActions]\" />\n\n@if (avecAvertissement()) {\n  <st-inline-message\n    class=\"st-wizard-step__avertissement\"\n    ton=\"avertissement\"\n    [identifiant]=\"idDeLAvertissement\"\n    >{{ avertissement() }}</st-inline-message\n  >\n}\n\n<st-form-actions [disposition]=\"dispositionDesActions()\">\n  @if (retourPossible()) {\n    @if (retourVers(); as route) {\n      <a debut stLink class=\"st-wizard-step__retour\" [routerLink]=\"route\">{{\n        libelles().retour\n      }}</a>\n    } @else {\n      <button debut stButton type=\"button\" (click)=\"retourner()\">\n        {{ libelles().retour }}\n      </button>\n    }\n  }\n  <ng-content select=\"[actions]\" />\n  <!-- L'avertissement decrit « Confirmer » : qui tabule droit sur le bouton l'entend (D-33). -->\n  <button\n    stButton\n    type=\"submit\"\n    variante=\"primaire\"\n    [chargement]=\"chargement()\"\n    [indisponible]=\"indisponible()\"\n    [attr.aria-describedby]=\"avecAvertissement() ? idDeLAvertissement : null\"\n  >\n    {{ libelleDeLAction() }}\n  </button>\n</st-form-actions>\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:grid;gap:var(--st-espacement-6)}.st-wizard-step__compte{font-size:var(--st-taille-2xs);line-height:var(--st-interligne-2xs);font-weight:var(--st-graisse-semi);letter-spacing:var(--st-interlettrage-capitales);text-transform:uppercase;display:block;margin-block-end:var(--st-espacement-1);color:var(--st-couleur-texte-discret)}:host([data-orientation=horizontale]) .st-wizard-step__compte{display:none}@container (min-width: 48rem){:host([data-orientation=horizontale]) .st-wizard-step__compte{display:block}}.st-wizard-step__contenu{display:grid;gap:var(--st-espacement-4);min-inline-size:0}.st-wizard-step__retour{display:inline-flex;align-items:center;min-block-size:var(--st-cible-tactile-min)}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		titre: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "titre",
+				required: true
+			}]
+		}],
+		niveauDuTitre: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "niveauDuTitre",
+				required: false
+			}]
+		}],
+		derniere: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "derniere",
+				required: false
+			}]
+		}],
+		avertissement: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "avertissement",
+				required: false
+			}]
+		}],
+		libelleContinuer: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "libelleContinuer",
+				required: false
+			}]
+		}],
+		chargement: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "chargement",
+				required: false
+			}]
+		}],
+		indisponible: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "indisponible",
+				required: false
+			}]
+		}],
+		dispositionDesActions: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "dispositionDesActions",
+				required: false
+			}]
+		}]
+	}
+});
+function echeance(secondes) {
+	return secondes !== null && secondes > 0 ? Date.now() + secondes * 1e3 : null;
+}
+const DELAI_DE_RENVOI_PAR_DEFAUT = 30;
+var StChallenge = class StChallenge {
+	injecteur = inject(Injector);
+	hote = inject(ElementRef);
+	libelles = inject(ST_LIBELLES);
+	annonce = new AnnonceLocale(inject(DestroyRef));
+	identifiants = inject(StIdentifiants);
+	idDuTitre = this.identifiants.prochain("st-ceremonie");
+	idDeLOperation = this.identifiants.prochain("st-ceremonie-operation");
+	idDesMoyens = this.identifiants.prochain("st-ceremonie-moyens");
+	idDesTentatives = this.identifiants.prochain("st-ceremonie-tentatives");
+	titre = input(null, ...ngDevMode ? [{ debugName: "titre" }] : 	/* istanbul ignore next */ []);
+	niveauDuTitre = input(2, ...ngDevMode ? [{ debugName: "niveauDuTitre" }] : 	/* istanbul ignore next */ []);
+	description = input(null, ...ngDevMode ? [{ debugName: "description" }] : 	/* istanbul ignore next */ []);
+	moyen = model("code", ...ngDevMode ? [{ debugName: "moyen" }] : 	/* istanbul ignore next */ []);
+	autresMoyens = input([], ...ngDevMode ? [{ debugName: "autresMoyens" }] : 	/* istanbul ignore next */ []);
+	ceremonie = input(null, ...ngDevMode ? [{ debugName: "ceremonie" }] : 	/* istanbul ignore next */ []);
+	longueurDuCode = input(6, {
+		...ngDevMode ? { debugName: "longueurDuCode" } : 		/* istanbul ignore next */ {},
+		transform: numberAttribute
+	});
+	libelleDuCode = input(null, ...ngDevMode ? [{ debugName: "libelleDuCode" }] : 	/* istanbul ignore next */ []);
+	aideDuCode = input(null, ...ngDevMode ? [{ debugName: "aideDuCode" }] : 	/* istanbul ignore next */ []);
+	renvoyable = input(false, {
+		...ngDevMode ? { debugName: "renvoyable" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	renvoiDans = input(null, ...ngDevMode ? [{ debugName: "renvoiDans" }] : 	/* istanbul ignore next */ []);
+	renvoiEnCours = input(false, {
+		...ngDevMode ? { debugName: "renvoiEnCours" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	expireDans = input(null, ...ngDevMode ? [{ debugName: "expireDans" }] : 	/* istanbul ignore next */ []);
+	chargement = input(false, {
+		...ngDevMode ? { debugName: "chargement" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	proposerAppareilDeConfiance = input(false, {
+		...ngDevMode ? { debugName: "proposerAppareilDeConfiance" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	appareilDeConfiance = model(false, ...ngDevMode ? [{ debugName: "appareilDeConfiance" }] : 	/* istanbul ignore next */ []);
+	annulable = input(false, {
+		...ngDevMode ? { debugName: "annulable" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	libelleDAnnulation = input(null, ...ngDevMode ? [{ debugName: "libelleDAnnulation" }] : 	/* istanbul ignore next */ []);
+	libelleDeLAction = input(null, ...ngDevMode ? [{ debugName: "libelleDeLAction" }] : 	/* istanbul ignore next */ []);
+	code = model("", ...ngDevMode ? [{ debugName: "code" }] : 	/* istanbul ignore next */ []);
+	focusALArrivee = input(true, {
+		...ngDevMode ? { debugName: "focusALArrivee" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	envoi = output();
+	renvoi = output();
+	annulation = output();
+	expiration = output();
+	champDuCode = viewChild(StOtpField, ...ngDevMode ? [{ debugName: "champDuCode" }] : 	/* istanbul ignore next */ []);
+	champDeSecours = viewChild(StInput, ...ngDevMode ? [{ debugName: "champDeSecours" }] : 	/* istanbul ignore next */ []);
+	operation = viewChild("operation", ...ngDevMode ? [{ debugName: "operation" }] : 	/* istanbul ignore next */ []);
+	lecture = linkedSignal({
+		...ngDevMode ? { debugName: "lecture" } : 		/* istanbul ignore next */ {},
+		source: () => ({
+			moyen: this.moyen(),
+			ceremonie: this.ceremonie()
+		}),
+		computation: (source, precedent) => precedent !== void 0 && precedent.source.moyen !== source.moyen && precedent.source.ceremonie === source.ceremonie ? null : source.ceremonie
+	});
+	etat = linkedSignal(() => this.lecture()?.etat ?? (this.moyen() === "appareil" ? "attente" : "saisie"), ...ngDevMode ? [{ debugName: "etat" }] : 	/* istanbul ignore next */ []);
+	bloque = computed(() => this.etat() === "bloque", ...ngDevMode ? [{ debugName: "bloque" }] : 	/* istanbul ignore next */ []);
+	expiree = computed(() => this.etat() === "expire", ...ngDevMode ? [{ debugName: "expiree" }] : 	/* istanbul ignore next */ []);
+	horsService = computed(() => this.bloque() || this.expiree(), ...ngDevMode ? [{ debugName: "horsService" }] : 	/* istanbul ignore next */ []);
+	avecCode = computed(() => this.moyen() === "code", ...ngDevMode ? [{ debugName: "avecCode" }] : 	/* istanbul ignore next */ []);
+	tentativesRestantes = computed(() => this.etat() === "refuse" ? this.lecture()?.tentativesRestantes ?? null : null, ...ngDevMode ? [{ debugName: "tentativesRestantes" }] : 	/* istanbul ignore next */ []);
+	descriptionsDuChamp = computed(() => this.tentativesRestantes() ? [this.idDesTentatives] : [], ...ngDevMode ? [{ debugName: "descriptionsDuChamp" }] : 	/* istanbul ignore next */ []);
+	attenteDuBlocage = computed(() => {
+		const secondes = this.lecture()?.reessayerDans ?? null;
+		return this.bloque() && secondes !== null && secondes > 0 ? secondes : null;
+	}, ...ngDevMode ? [{ debugName: "attenteDuBlocage" }] : 	/* istanbul ignore next */ []);
+	libelleDuChamp = computed(() => this.libelleDuCode() ?? (this.avecCode() ? this.libelles().codeDeVerification : this.libelles().codeDeSecours), ...ngDevMode ? [{ debugName: "libelleDuChamp" }] : 	/* istanbul ignore next */ []);
+	libelleDuBouton = computed(() => this.libelleDeLAction() ?? this.libelles().confirmer, ...ngDevMode ? [{ debugName: "libelleDuBouton" }] : 	/* istanbul ignore next */ []);
+	delaiDeRenvoi = computed(() => this.renvoiDans() ?? (this.renvoyable() && this.avecCode() ? DELAI_DE_RENVOI_PAR_DEFAUT : null), ...ngDevMode ? [{ debugName: "delaiDeRenvoi" }] : 	/* istanbul ignore next */ []);
+	finDuDelaiDeRenvoi = linkedSignal({
+		...ngDevMode ? { debugName: "finDuDelaiDeRenvoi" } : 		/* istanbul ignore next */ {},
+		source: this.delaiDeRenvoi,
+		computation: (secondes) => echeance(secondes)
+	});
+	renvoiEnAttente = computed(() => this.finDuDelaiDeRenvoi() !== null, ...ngDevMode ? [{ debugName: "renvoiEnAttente" }] : 	/* istanbul ignore next */ []);
+	finDeValidite = linkedSignal({
+		...ngDevMode ? { debugName: "finDeValidite" } : 		/* istanbul ignore next */ {},
+		source: this.expireDans,
+		computation: (secondes) => echeance(secondes)
+	});
+	decompteDuRenvoi = viewChild("decompteDuRenvoi", ...ngDevMode ? [{ debugName: "decompteDuRenvoi" }] : 	/* istanbul ignore next */ []);
+	raisonDuRenvoi = computed(() => this.renvoiEnAttente() ? this.decompteDuRenvoi()?.phrase() ?? null : null, ...ngDevMode ? [{ debugName: "raisonDuRenvoi" }] : 	/* istanbul ignore next */ []);
+	moyensOuverts = signal(false, ...ngDevMode ? [{ debugName: "moyensOuverts" }] : 	/* istanbul ignore next */ []);
+	autres = computed(() => this.autresMoyens().filter((moyen) => moyen !== this.moyen()), ...ngDevMode ? [{ debugName: "autres" }] : 	/* istanbul ignore next */ []);
+	tente = linkedSignal({
+		...ngDevMode ? { debugName: "tente" } : 		/* istanbul ignore next */ {},
+		source: this.moyen,
+		computation: () => false
+	});
+	codeAuRefus = signal(null, ...ngDevMode ? [{ debugName: "codeAuRefus" }] : 	/* istanbul ignore next */ []);
+	erreurs = computed(() => {
+		const code = this.code();
+		if (this.etat() === "refuse" && code === this.codeAuRefus()) return [{
+			kind: "code-refuse",
+			message: this.libelles().codeRefuse
+		}];
+		if (!this.tente()) return [];
+		if (code.trim() === "") return [{ kind: "required" }];
+		const forme = this.avecCode() ? erreurCode(code, this.longueurDuCode()) : null;
+		return forme === null ? [] : [forme];
+	}, ...ngDevMode ? [{ debugName: "erreurs" }] : 	/* istanbul ignore next */ []);
+	erreursVisibles = computed(() => this.erreurs().length > 0, ...ngDevMode ? [{ debugName: "erreursVisibles" }] : 	/* istanbul ignore next */ []);
+	avecOperation = signal(false, ...ngDevMode ? [{ debugName: "avecOperation" }] : 	/* istanbul ignore next */ []);
+	constructor() {
+		afterNextRender(() => {
+			this.avecOperation.set((this.operation()?.nativeElement.childElementCount ?? 0) > 0);
+			if (isDevMode() && this.hote.nativeElement.parentElement?.closest("form") !== null) console.warn("st-challenge : le composant porte son propre formulaire ; ne le placez pas dans un <form>.");
+			const avecChamp = this.moyen() === "code" || this.moyen() === "secours";
+			if (this.focusALArrivee() && avecChamp) this.focaliserLeChamp(false);
+		});
+		effect(() => {
+			const lecture = this.lecture();
+			if (lecture === null) return;
+			untracked(() => {
+				if (lecture.etat !== "refuse") return;
+				this.codeAuRefus.set(this.code());
+				afterNextRender(() => {
+					const annonce = this.annonceDuRefus(lecture.tentativesRestantes);
+					if (annonce !== null) this.annonce.annoncer(annonce);
+					this.focaliserLeChamp(true);
+				}, { injector: this.injecteur });
+			});
+		});
+	}
+	annonceDuRefus(restantes) {
+		const libelles = this.libelles();
+		const saisie = this.saisieDuCode();
+		if (saisie === null) {
+			if (this.moyen() === "appareil") return libelles.demandeRefusee;
+			return this.moyen() === "passkey" ? libelles.cleRefusee : null;
+		}
+		if (saisie.ownerDocument.activeElement !== saisie) return null;
+		return restantes === null ? libelles.codeRefuse : `${libelles.codeRefuse} ${libelles.tentativesRestantes(restantes)}`;
+	}
+	surEnvoi(evenement) {
+		evenement.preventDefault();
+		if (this.chargement() || this.horsService()) return;
+		this.tente.set(true);
+		if (this.erreursVisibles()) {
+			this.focaliserLeChamp(false);
+			return;
+		}
+		this.envoi.emit({
+			moyen: this.moyen(),
+			code: this.code()
+		});
+	}
+	utiliserLaCle() {
+		if (this.chargement() || this.horsService()) return;
+		this.envoi.emit({
+			moyen: "passkey",
+			code: ""
+		});
+	}
+	renvoyer() {
+		if (this.renvoiEnCours()) return;
+		if (this.renvoiEnAttente() && !this.expiree()) return;
+		this.finDuDelaiDeRenvoi.set(echeance(this.delaiDeRenvoi()));
+		this.finDeValidite.set(echeance(this.expireDans()));
+		this.etat.set(this.moyen() === "appareil" ? "attente" : "saisie");
+		this.renvoi.emit();
+		if (this.moyen() === "code") this.annonce.annoncer(this.libelles().nouveauCodeDemande);
+	}
+	choisir(moyen) {
+		this.moyensOuverts.set(false);
+		this.code.set("");
+		this.moyen.set(moyen);
+		afterNextRender(() => {
+			if (moyen === "code" || moyen === "secours") {
+				this.focaliserLeChamp(false);
+				return;
+			}
+			this.hote.nativeElement.querySelector(".st-challenge__cible")?.focus();
+		}, { injector: this.injecteur });
+	}
+	finDuRenvoi() {
+		this.finDuDelaiDeRenvoi.set(null);
+	}
+	finDeLaDemande() {
+		this.etat.set("expire");
+		this.expiration.emit();
+	}
+	finDuBlocage() {
+		this.code.set("");
+		this.etat.set("saisie");
+	}
+	focaliserLeChamp(selectionner) {
+		(this.champDuCode() ?? this.champDeSecours())?.focus();
+		if (!selectionner) return;
+		this.saisieDuCode()?.select();
+	}
+	saisieDuCode() {
+		return this.hote.nativeElement.querySelector(".st-challenge__champ input");
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StChallenge,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: StChallenge,
+		isStandalone: true,
+		selector: "st-challenge",
+		inputs: {
+			titre: {
+				classPropertyName: "titre",
+				publicName: "titre",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			niveauDuTitre: {
+				classPropertyName: "niveauDuTitre",
+				publicName: "niveauDuTitre",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			description: {
+				classPropertyName: "description",
+				publicName: "description",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			moyen: {
+				classPropertyName: "moyen",
+				publicName: "moyen",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			autresMoyens: {
+				classPropertyName: "autresMoyens",
+				publicName: "autresMoyens",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ceremonie: {
+				classPropertyName: "ceremonie",
+				publicName: "ceremonie",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			longueurDuCode: {
+				classPropertyName: "longueurDuCode",
+				publicName: "longueurDuCode",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			libelleDuCode: {
+				classPropertyName: "libelleDuCode",
+				publicName: "libelleDuCode",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			aideDuCode: {
+				classPropertyName: "aideDuCode",
+				publicName: "aideDuCode",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			renvoyable: {
+				classPropertyName: "renvoyable",
+				publicName: "renvoyable",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			renvoiDans: {
+				classPropertyName: "renvoiDans",
+				publicName: "renvoiDans",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			renvoiEnCours: {
+				classPropertyName: "renvoiEnCours",
+				publicName: "renvoiEnCours",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			expireDans: {
+				classPropertyName: "expireDans",
+				publicName: "expireDans",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			chargement: {
+				classPropertyName: "chargement",
+				publicName: "chargement",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			proposerAppareilDeConfiance: {
+				classPropertyName: "proposerAppareilDeConfiance",
+				publicName: "proposerAppareilDeConfiance",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			appareilDeConfiance: {
+				classPropertyName: "appareilDeConfiance",
+				publicName: "appareilDeConfiance",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			annulable: {
+				classPropertyName: "annulable",
+				publicName: "annulable",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			libelleDAnnulation: {
+				classPropertyName: "libelleDAnnulation",
+				publicName: "libelleDAnnulation",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			libelleDeLAction: {
+				classPropertyName: "libelleDeLAction",
+				publicName: "libelleDeLAction",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			code: {
+				classPropertyName: "code",
+				publicName: "code",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			focusALArrivee: {
+				classPropertyName: "focusALArrivee",
+				publicName: "focusALArrivee",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			moyen: "moyenChange",
+			appareilDeConfiance: "appareilDeConfianceChange",
+			code: "codeChange",
+			envoi: "envoi",
+			renvoi: "renvoi",
+			annulation: "annulation",
+			expiration: "expiration"
+		},
+		host: {
+			properties: {
+				"attr.role": "titre() === null ? null : \"group\"",
+				"attr.aria-labelledby": "titre() === null ? null : idDuTitre",
+				"attr.aria-describedby": "avecOperation() ? idDeLOperation : null",
+				"attr.data-moyen": "moyen()",
+				"attr.data-etat": "etat()"
+			},
+			classAttribute: "st-challenge"
+		},
+		viewQueries: [
+			{
+				propertyName: "champDuCode",
+				first: true,
+				predicate: StOtpField,
+				descendants: true,
+				isSignal: true
+			},
+			{
+				propertyName: "champDeSecours",
+				first: true,
+				predicate: StInput,
+				descendants: true,
+				isSignal: true
+			},
+			{
+				propertyName: "operation",
+				first: true,
+				predicate: ["operation"],
+				descendants: true,
+				isSignal: true
+			},
+			{
+				propertyName: "decompteDuRenvoi",
+				first: true,
+				predicate: ["decompteDuRenvoi"],
+				descendants: true,
+				isSignal: true
+			}
+		],
+		ngImport: i0,
+		template: "@if (titre(); as texte) {\n  @switch (niveauDuTitre()) {\n    @case (1) {\n      <h1 stHeading taille=\"lg\" class=\"st-challenge__titre\" [id]=\"idDuTitre\">{{ texte }}</h1>\n    }\n    @case (3) {\n      <h3 stHeading taille=\"lg\" class=\"st-challenge__titre\" [id]=\"idDuTitre\">{{ texte }}</h3>\n    }\n    @case (4) {\n      <h4 stHeading taille=\"lg\" class=\"st-challenge__titre\" [id]=\"idDuTitre\">{{ texte }}</h4>\n    }\n    @default {\n      <h2 stHeading taille=\"lg\" class=\"st-challenge__titre\" [id]=\"idDuTitre\">{{ texte }}</h2>\n    }\n  }\n}\n@if (description(); as texte) {\n  <p class=\"st-challenge__description\">{{ texte }}</p>\n}\n\n<!-- Ce que l'on confirme (DSP2, lien dynamique) : lu avant le champ, il decrit le groupe. -->\n<div #operation class=\"st-challenge__operation\" [id]=\"idDeLOperation\">\n  <ng-content select=\"[operation]\" />\n</div>\n\n<span class=\"st-vh\" aria-live=\"polite\">{{ annonce.texte() }}</span>\n\n@if (bloque()) {\n  <!-- Le ton danger rend la banniere en alert : le blocage s'annonce a son arrivee. -->\n  <st-banner class=\"st-challenge__blocage\" ton=\"danger\" [message]=\"libelles().tropDeTentatives\">\n    @if (attenteDuBlocage(); as secondes) {\n      <st-timer nature=\"reessai\" [secondes]=\"secondes\" (termine)=\"finDuBlocage()\" />\n    }\n  </st-banner>\n}\n\n@switch (moyen()) {\n  @case ('appareil') {\n    <div class=\"st-challenge__appareil\">\n      @if (etat() === 'attente') {\n        <!-- L'indicateur s'annonce une fois (sa region, texte compris, reste lue) ; la phrase\n             visible le double pour les yeux seulement. Le decompte ne dit que sa fin. -->\n        <p class=\"st-challenge__attente\">\n          <st-spinner taille=\"sm\" [etiquette]=\"libelles().enAttenteDeValidation\" />\n          <span aria-hidden=\"true\">{{ libelles().enAttenteDeValidation }}</span>\n        </p>\n      }\n      @if (etat() === 'refuse') {\n        <st-inline-message ton=\"danger\">{{ libelles().demandeRefusee }}</st-inline-message>\n      }\n      @if (finDeValidite(); as fin) {\n        <st-timer\n          nature=\"expiration\"\n          avecIcone\n          [secondes]=\"expireDans() ?? 0\"\n          [echeance]=\"fin\"\n          (termine)=\"finDeLaDemande()\"\n        />\n      }\n      <!-- En attente, un recours discret ; expiree ou refusee, la nouvelle demande est l'action. -->\n      <button\n        stButton\n        class=\"st-challenge__cible\"\n        type=\"button\"\n        [variante]=\"etat() === 'attente' ? 'discret' : 'secondaire'\"\n        [chargement]=\"renvoiEnCours()\"\n        [indisponible]=\"bloque()\"\n        (click)=\"renvoyer()\"\n      >\n        {{ etat() === 'attente' ? libelles().demandeNonRecue : libelles().nouvelleDemande }}\n      </button>\n    </div>\n  }\n  @case ('passkey') {\n    @if (etat() === 'refuse') {\n      <st-inline-message ton=\"danger\">{{ libelles().cleRefusee }}</st-inline-message>\n    }\n    <button\n      stButton\n      class=\"st-challenge__cible st-challenge__cle\"\n      variante=\"primaire\"\n      type=\"button\"\n      iconeAvant=\"cle\"\n      [chargement]=\"chargement()\"\n      [indisponible]=\"horsService()\"\n      (click)=\"utiliserLaCle()\"\n    >\n      {{ libelles().moyenDeCeremonie('passkey') }}\n    </button>\n  }\n  @default {\n    <form class=\"st-challenge__formulaire\" novalidate (submit)=\"surEnvoi($event)\">\n      @if (avecCode()) {\n        <st-otp-field\n          class=\"st-challenge__champ\"\n          [libelle]=\"libelleDuChamp()\"\n          [aide]=\"aideDuCode()\"\n          [longueur]=\"longueurDuCode()\"\n          [decritPar]=\"descriptionsDuChamp()\"\n          [(value)]=\"code\"\n          [errors]=\"erreurs()\"\n          [touched]=\"erreursVisibles()\"\n          [disabled]=\"horsService()\"\n        >\n          @if (renvoyable()) {\n            <!-- Le renvoi attend son delai (30 s sans `renvoiDans`) puis la requete partie :\n                 deux clics ne font jamais partir deux codes (D-9). -->\n            <span stRenvoi class=\"st-challenge__renvoi\">\n              <button\n                stButton\n                variante=\"discret\"\n                type=\"button\"\n                iconeAvant=\"rotation-arriere\"\n                [chargement]=\"renvoiEnCours()\"\n                [indisponible]=\"renvoiEnAttente() || bloque()\"\n                [raisonIndisponible]=\"raisonDuRenvoi()\"\n                (click)=\"renvoyer()\"\n              >\n                {{ libelles().renvoyerLeCode }}\n              </button>\n              @if (finDuDelaiDeRenvoi(); as fin) {\n                <st-timer\n                  #decompteDuRenvoi\n                  nature=\"renvoi\"\n                  [secondes]=\"delaiDeRenvoi() ?? 0\"\n                  [echeance]=\"fin\"\n                  (termine)=\"finDuRenvoi()\"\n                />\n              }\n            </span>\n          }\n        </st-otp-field>\n        @if (finDeValidite(); as fin) {\n          <st-timer\n            nature=\"expiration\"\n            avecIcone\n            [secondes]=\"expireDans() ?? 0\"\n            [echeance]=\"fin\"\n            (termine)=\"finDeLaDemande()\"\n          />\n        }\n      } @else {\n        <st-input\n          class=\"st-challenge__champ\"\n          autocomplete=\"off\"\n          chiffres=\"reference\"\n          [libelle]=\"libelleDuChamp()\"\n          [aide]=\"aideDuCode() ?? libelles().aideDuCodeDeSecours\"\n          [decritPar]=\"descriptionsDuChamp()\"\n          [(value)]=\"code\"\n          [errors]=\"erreurs()\"\n          [touched]=\"erreursVisibles()\"\n          [disabled]=\"horsService()\"\n        />\n      }\n\n      <!-- Les essais restants decrivent le champ (`descriptionsDuChamp`, D-20) : le focus amene au\n           champ les lit avec l'erreur. -->\n      @if (tentativesRestantes(); as restantes) {\n        <st-inline-message ton=\"avertissement\" [identifiant]=\"idDesTentatives\">{{\n          libelles().tentativesRestantes(restantes)\n        }}</st-inline-message>\n      }\n\n      @if (proposerAppareilDeConfiance()) {\n        <st-checkbox\n          [libelle]=\"libelles().faireConfianceACetAppareil\"\n          [aide]=\"libelles().aideDeLAppareilDeConfiance\"\n          [(checked)]=\"appareilDeConfiance\"\n        />\n      }\n\n      <!-- L'ordre du document est l'ordre visuel : l'annulation, puis la seule action principale. -->\n      <st-form-actions class=\"st-challenge__actions\" disposition=\"pied\">\n        @if (annulable()) {\n          <button debut stButton type=\"button\" (click)=\"annulation.emit()\">\n            {{ libelleDAnnulation() ?? libelles().annuler }}\n          </button>\n        }\n        <button\n          stButton\n          variante=\"primaire\"\n          type=\"submit\"\n          [chargement]=\"chargement()\"\n          [indisponible]=\"horsService()\"\n        >\n          {{ libelleDuBouton() }}\n        </button>\n      </st-form-actions>\n    </form>\n  }\n}\n\n@if (annulable() && (moyen() === 'appareil' || moyen() === 'passkey')) {\n  <st-form-actions class=\"st-challenge__actions\" disposition=\"pied\">\n    <button debut stButton type=\"button\" (click)=\"annulation.emit()\">\n      {{ libelleDAnnulation() ?? libelles().annuler }}\n    </button>\n  </st-form-actions>\n}\n\n@if (autres().length > 0) {\n  <div class=\"st-challenge__moyens\">\n    <button\n      stButton\n      variante=\"discret\"\n      type=\"button\"\n      [attr.aria-expanded]=\"moyensOuverts()\"\n      [attr.aria-controls]=\"idDesMoyens\"\n      (click)=\"moyensOuverts.set(!moyensOuverts())\"\n    >\n      {{ libelles().utiliserUnAutreMoyen }}\n    </button>\n    <!-- `role=\"list\"` : sans puces, Safari ne lit plus une liste comme une liste (D-1). -->\n    <ul\n      class=\"st-challenge__liste-des-moyens\"\n      role=\"list\"\n      [id]=\"idDesMoyens\"\n      [hidden]=\"!moyensOuverts()\"\n    >\n      @for (autre of autres(); track autre) {\n        <li>\n          <button stButton variante=\"discret\" type=\"button\" (click)=\"choisir(autre)\">\n            {{ libelles().moyenDeCeremonie(autre) }}\n          </button>\n        </li>\n      }\n    </ul>\n  </div>\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:grid;gap:var(--st-espacement-5);min-inline-size:0}.st-challenge__titre,.st-challenge__description{margin:0}.st-challenge__titre+.st-challenge__description{margin-block-start:calc(var(--st-espacement-3) - var(--st-espacement-5))}.st-challenge__description{color:var(--st-couleur-texte-discret)}.st-challenge__operation:empty{display:none}.st-challenge__formulaire,.st-challenge__appareil{display:grid;gap:var(--st-espacement-4);justify-items:start;min-inline-size:0}.st-challenge__champ{justify-self:stretch}.st-challenge__renvoi{display:grid;gap:var(--st-espacement-1);justify-items:start}.st-challenge__attente{display:inline-flex;gap:var(--st-espacement-2);align-items:center;margin:0;font-weight:var(--st-graisse-semi)}.st-challenge__actions,.st-challenge__cle{justify-self:stretch}@media(min-width:30rem){.st-challenge__cle{justify-self:start}}.st-challenge__moyens{display:grid;gap:var(--st-espacement-1);justify-items:start}.st-challenge__liste-des-moyens{display:grid;gap:var(--st-espacement-1);padding:0;padding-inline-start:var(--st-espacement-4);margin:0;list-style:none;border-inline-start:var(--st-epaisseur-fine) solid var(--st-couleur-bordure)}.st-challenge__liste-des-moyens[hidden]{display:none}\n"],
+		dependencies: [
+			{
+				kind: "component",
+				type: StBanner,
+				selector: "st-banner",
+				inputs: [
+					"ton",
+					"message",
+					"titre",
+					"forme",
+					"identifiant",
+					"fermable",
+					"libelleFermeture"
+				],
+				outputs: ["ferme"]
+			},
+			{
+				kind: "component",
+				type: StButton,
+				selector: "button[stButton]",
+				inputs: [
+					"variante",
+					"taille",
+					"pleineLargeur",
+					"iconeAvant",
+					"iconeApres",
+					"chargement",
+					"indisponible",
+					"raisonIndisponible"
+				]
+			},
+			{
+				kind: "component",
+				type: StCheckbox,
+				selector: "st-checkbox",
+				inputs: ["indetermine", "aideDEtat"],
+				outputs: ["indetermineChange"]
+			},
+			{
+				kind: "component",
+				type: StFormActions,
+				selector: "st-form-actions",
+				inputs: ["disposition"]
+			},
+			{
+				kind: "component",
+				type: StHeading,
+				selector: "h1[stHeading], h2[stHeading], h3[stHeading], h4[stHeading], h5[stHeading], h6[stHeading]",
+				inputs: [
+					"taille",
+					"serre",
+					"identifiant"
+				]
+			},
+			{
+				kind: "component",
+				type: StInlineMessage,
+				selector: "st-inline-message",
+				inputs: [
+					"ton",
+					"identifiant",
+					"annonce",
+					"encadre",
+					"icone"
+				]
+			},
+			{
+				kind: "component",
+				type: StInput,
+				selector: "st-input",
+				inputs: [
+					"type",
+					"autocomplete",
+					"inputmode",
+					"icone",
+					"chiffres",
+					"presentation",
+					"decritPar",
+					"suggestions"
+				]
+			},
+			{
+				kind: "component",
+				type: StOtpField,
+				selector: "st-otp-field",
+				inputs: ["longueur", "decritPar"]
+			},
+			{
+				kind: "component",
+				type: StSpinner,
+				selector: "st-spinner",
+				inputs: [
+					"taille",
+					"ton",
+					"etiquette",
+					"icone"
+				]
+			},
+			{
+				kind: "component",
+				type: StTimer,
+				selector: "st-timer",
+				inputs: [
+					"secondes",
+					"echeance",
+					"nature",
+					"variante",
+					"avecIcone"
+				],
+				outputs: ["termine"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StChallenge,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-challenge",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				StBanner,
+				StButton,
+				StCheckbox,
+				StFormActions,
+				StHeading,
+				StInlineMessage,
+				StInput,
+				StOtpField,
+				StSpinner,
+				StTimer
+			],
+			host: {
+				class: "st-challenge",
+				"[attr.role]": "titre() === null ? null : \"group\"",
+				"[attr.aria-labelledby]": "titre() === null ? null : idDuTitre",
+				"[attr.aria-describedby]": "avecOperation() ? idDeLOperation : null",
+				"[attr.data-moyen]": "moyen()",
+				"[attr.data-etat]": "etat()"
+			},
+			template: "@if (titre(); as texte) {\n  @switch (niveauDuTitre()) {\n    @case (1) {\n      <h1 stHeading taille=\"lg\" class=\"st-challenge__titre\" [id]=\"idDuTitre\">{{ texte }}</h1>\n    }\n    @case (3) {\n      <h3 stHeading taille=\"lg\" class=\"st-challenge__titre\" [id]=\"idDuTitre\">{{ texte }}</h3>\n    }\n    @case (4) {\n      <h4 stHeading taille=\"lg\" class=\"st-challenge__titre\" [id]=\"idDuTitre\">{{ texte }}</h4>\n    }\n    @default {\n      <h2 stHeading taille=\"lg\" class=\"st-challenge__titre\" [id]=\"idDuTitre\">{{ texte }}</h2>\n    }\n  }\n}\n@if (description(); as texte) {\n  <p class=\"st-challenge__description\">{{ texte }}</p>\n}\n\n<!-- Ce que l'on confirme (DSP2, lien dynamique) : lu avant le champ, il decrit le groupe. -->\n<div #operation class=\"st-challenge__operation\" [id]=\"idDeLOperation\">\n  <ng-content select=\"[operation]\" />\n</div>\n\n<span class=\"st-vh\" aria-live=\"polite\">{{ annonce.texte() }}</span>\n\n@if (bloque()) {\n  <!-- Le ton danger rend la banniere en alert : le blocage s'annonce a son arrivee. -->\n  <st-banner class=\"st-challenge__blocage\" ton=\"danger\" [message]=\"libelles().tropDeTentatives\">\n    @if (attenteDuBlocage(); as secondes) {\n      <st-timer nature=\"reessai\" [secondes]=\"secondes\" (termine)=\"finDuBlocage()\" />\n    }\n  </st-banner>\n}\n\n@switch (moyen()) {\n  @case ('appareil') {\n    <div class=\"st-challenge__appareil\">\n      @if (etat() === 'attente') {\n        <!-- L'indicateur s'annonce une fois (sa region, texte compris, reste lue) ; la phrase\n             visible le double pour les yeux seulement. Le decompte ne dit que sa fin. -->\n        <p class=\"st-challenge__attente\">\n          <st-spinner taille=\"sm\" [etiquette]=\"libelles().enAttenteDeValidation\" />\n          <span aria-hidden=\"true\">{{ libelles().enAttenteDeValidation }}</span>\n        </p>\n      }\n      @if (etat() === 'refuse') {\n        <st-inline-message ton=\"danger\">{{ libelles().demandeRefusee }}</st-inline-message>\n      }\n      @if (finDeValidite(); as fin) {\n        <st-timer\n          nature=\"expiration\"\n          avecIcone\n          [secondes]=\"expireDans() ?? 0\"\n          [echeance]=\"fin\"\n          (termine)=\"finDeLaDemande()\"\n        />\n      }\n      <!-- En attente, un recours discret ; expiree ou refusee, la nouvelle demande est l'action. -->\n      <button\n        stButton\n        class=\"st-challenge__cible\"\n        type=\"button\"\n        [variante]=\"etat() === 'attente' ? 'discret' : 'secondaire'\"\n        [chargement]=\"renvoiEnCours()\"\n        [indisponible]=\"bloque()\"\n        (click)=\"renvoyer()\"\n      >\n        {{ etat() === 'attente' ? libelles().demandeNonRecue : libelles().nouvelleDemande }}\n      </button>\n    </div>\n  }\n  @case ('passkey') {\n    @if (etat() === 'refuse') {\n      <st-inline-message ton=\"danger\">{{ libelles().cleRefusee }}</st-inline-message>\n    }\n    <button\n      stButton\n      class=\"st-challenge__cible st-challenge__cle\"\n      variante=\"primaire\"\n      type=\"button\"\n      iconeAvant=\"cle\"\n      [chargement]=\"chargement()\"\n      [indisponible]=\"horsService()\"\n      (click)=\"utiliserLaCle()\"\n    >\n      {{ libelles().moyenDeCeremonie('passkey') }}\n    </button>\n  }\n  @default {\n    <form class=\"st-challenge__formulaire\" novalidate (submit)=\"surEnvoi($event)\">\n      @if (avecCode()) {\n        <st-otp-field\n          class=\"st-challenge__champ\"\n          [libelle]=\"libelleDuChamp()\"\n          [aide]=\"aideDuCode()\"\n          [longueur]=\"longueurDuCode()\"\n          [decritPar]=\"descriptionsDuChamp()\"\n          [(value)]=\"code\"\n          [errors]=\"erreurs()\"\n          [touched]=\"erreursVisibles()\"\n          [disabled]=\"horsService()\"\n        >\n          @if (renvoyable()) {\n            <!-- Le renvoi attend son delai (30 s sans `renvoiDans`) puis la requete partie :\n                 deux clics ne font jamais partir deux codes (D-9). -->\n            <span stRenvoi class=\"st-challenge__renvoi\">\n              <button\n                stButton\n                variante=\"discret\"\n                type=\"button\"\n                iconeAvant=\"rotation-arriere\"\n                [chargement]=\"renvoiEnCours()\"\n                [indisponible]=\"renvoiEnAttente() || bloque()\"\n                [raisonIndisponible]=\"raisonDuRenvoi()\"\n                (click)=\"renvoyer()\"\n              >\n                {{ libelles().renvoyerLeCode }}\n              </button>\n              @if (finDuDelaiDeRenvoi(); as fin) {\n                <st-timer\n                  #decompteDuRenvoi\n                  nature=\"renvoi\"\n                  [secondes]=\"delaiDeRenvoi() ?? 0\"\n                  [echeance]=\"fin\"\n                  (termine)=\"finDuRenvoi()\"\n                />\n              }\n            </span>\n          }\n        </st-otp-field>\n        @if (finDeValidite(); as fin) {\n          <st-timer\n            nature=\"expiration\"\n            avecIcone\n            [secondes]=\"expireDans() ?? 0\"\n            [echeance]=\"fin\"\n            (termine)=\"finDeLaDemande()\"\n          />\n        }\n      } @else {\n        <st-input\n          class=\"st-challenge__champ\"\n          autocomplete=\"off\"\n          chiffres=\"reference\"\n          [libelle]=\"libelleDuChamp()\"\n          [aide]=\"aideDuCode() ?? libelles().aideDuCodeDeSecours\"\n          [decritPar]=\"descriptionsDuChamp()\"\n          [(value)]=\"code\"\n          [errors]=\"erreurs()\"\n          [touched]=\"erreursVisibles()\"\n          [disabled]=\"horsService()\"\n        />\n      }\n\n      <!-- Les essais restants decrivent le champ (`descriptionsDuChamp`, D-20) : le focus amene au\n           champ les lit avec l'erreur. -->\n      @if (tentativesRestantes(); as restantes) {\n        <st-inline-message ton=\"avertissement\" [identifiant]=\"idDesTentatives\">{{\n          libelles().tentativesRestantes(restantes)\n        }}</st-inline-message>\n      }\n\n      @if (proposerAppareilDeConfiance()) {\n        <st-checkbox\n          [libelle]=\"libelles().faireConfianceACetAppareil\"\n          [aide]=\"libelles().aideDeLAppareilDeConfiance\"\n          [(checked)]=\"appareilDeConfiance\"\n        />\n      }\n\n      <!-- L'ordre du document est l'ordre visuel : l'annulation, puis la seule action principale. -->\n      <st-form-actions class=\"st-challenge__actions\" disposition=\"pied\">\n        @if (annulable()) {\n          <button debut stButton type=\"button\" (click)=\"annulation.emit()\">\n            {{ libelleDAnnulation() ?? libelles().annuler }}\n          </button>\n        }\n        <button\n          stButton\n          variante=\"primaire\"\n          type=\"submit\"\n          [chargement]=\"chargement()\"\n          [indisponible]=\"horsService()\"\n        >\n          {{ libelleDuBouton() }}\n        </button>\n      </st-form-actions>\n    </form>\n  }\n}\n\n@if (annulable() && (moyen() === 'appareil' || moyen() === 'passkey')) {\n  <st-form-actions class=\"st-challenge__actions\" disposition=\"pied\">\n    <button debut stButton type=\"button\" (click)=\"annulation.emit()\">\n      {{ libelleDAnnulation() ?? libelles().annuler }}\n    </button>\n  </st-form-actions>\n}\n\n@if (autres().length > 0) {\n  <div class=\"st-challenge__moyens\">\n    <button\n      stButton\n      variante=\"discret\"\n      type=\"button\"\n      [attr.aria-expanded]=\"moyensOuverts()\"\n      [attr.aria-controls]=\"idDesMoyens\"\n      (click)=\"moyensOuverts.set(!moyensOuverts())\"\n    >\n      {{ libelles().utiliserUnAutreMoyen }}\n    </button>\n    <!-- `role=\"list\"` : sans puces, Safari ne lit plus une liste comme une liste (D-1). -->\n    <ul\n      class=\"st-challenge__liste-des-moyens\"\n      role=\"list\"\n      [id]=\"idDesMoyens\"\n      [hidden]=\"!moyensOuverts()\"\n    >\n      @for (autre of autres(); track autre) {\n        <li>\n          <button stButton variante=\"discret\" type=\"button\" (click)=\"choisir(autre)\">\n            {{ libelles().moyenDeCeremonie(autre) }}\n          </button>\n        </li>\n      }\n    </ul>\n  </div>\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:grid;gap:var(--st-espacement-5);min-inline-size:0}.st-challenge__titre,.st-challenge__description{margin:0}.st-challenge__titre+.st-challenge__description{margin-block-start:calc(var(--st-espacement-3) - var(--st-espacement-5))}.st-challenge__description{color:var(--st-couleur-texte-discret)}.st-challenge__operation:empty{display:none}.st-challenge__formulaire,.st-challenge__appareil{display:grid;gap:var(--st-espacement-4);justify-items:start;min-inline-size:0}.st-challenge__champ{justify-self:stretch}.st-challenge__renvoi{display:grid;gap:var(--st-espacement-1);justify-items:start}.st-challenge__attente{display:inline-flex;gap:var(--st-espacement-2);align-items:center;margin:0;font-weight:var(--st-graisse-semi)}.st-challenge__actions,.st-challenge__cle{justify-self:stretch}@media(min-width:30rem){.st-challenge__cle{justify-self:start}}.st-challenge__moyens{display:grid;gap:var(--st-espacement-1);justify-items:start}.st-challenge__liste-des-moyens{display:grid;gap:var(--st-espacement-1);padding:0;padding-inline-start:var(--st-espacement-4);margin:0;list-style:none;border-inline-start:var(--st-epaisseur-fine) solid var(--st-couleur-bordure)}.st-challenge__liste-des-moyens[hidden]{display:none}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		titre: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "titre",
+				required: false
+			}]
+		}],
+		niveauDuTitre: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "niveauDuTitre",
+				required: false
+			}]
+		}],
+		description: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "description",
+				required: false
+			}]
+		}],
+		moyen: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "moyen",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["moyenChange"]
+		}],
+		autresMoyens: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "autresMoyens",
+				required: false
+			}]
+		}],
+		ceremonie: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ceremonie",
+				required: false
+			}]
+		}],
+		longueurDuCode: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "longueurDuCode",
+				required: false
+			}]
+		}],
+		libelleDuCode: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "libelleDuCode",
+				required: false
+			}]
+		}],
+		aideDuCode: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "aideDuCode",
+				required: false
+			}]
+		}],
+		renvoyable: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "renvoyable",
+				required: false
+			}]
+		}],
+		renvoiDans: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "renvoiDans",
+				required: false
+			}]
+		}],
+		renvoiEnCours: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "renvoiEnCours",
+				required: false
+			}]
+		}],
+		expireDans: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "expireDans",
+				required: false
+			}]
+		}],
+		chargement: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "chargement",
+				required: false
+			}]
+		}],
+		proposerAppareilDeConfiance: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "proposerAppareilDeConfiance",
+				required: false
+			}]
+		}],
+		appareilDeConfiance: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "appareilDeConfiance",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["appareilDeConfianceChange"]
+		}],
+		annulable: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "annulable",
+				required: false
+			}]
+		}],
+		libelleDAnnulation: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "libelleDAnnulation",
+				required: false
+			}]
+		}],
+		libelleDeLAction: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "libelleDeLAction",
+				required: false
+			}]
+		}],
+		code: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "code",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["codeChange"]
+		}],
+		focusALArrivee: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "focusALArrivee",
+				required: false
+			}]
+		}],
+		envoi: [{
+			type: i0.Output,
+			args: ["envoi"]
+		}],
+		renvoi: [{
+			type: i0.Output,
+			args: ["renvoi"]
+		}],
+		annulation: [{
+			type: i0.Output,
+			args: ["annulation"]
+		}],
+		expiration: [{
+			type: i0.Output,
+			args: ["expiration"]
+		}],
+		champDuCode: [{
+			type: i0.ViewChild,
+			args: [i0.forwardRef(() => StOtpField), { isSignal: true }]
+		}],
+		champDeSecours: [{
+			type: i0.ViewChild,
+			args: [i0.forwardRef(() => StInput), { isSignal: true }]
+		}],
+		operation: [{
+			type: i0.ViewChild,
+			args: ["operation", { isSignal: true }]
+		}],
+		decompteDuRenvoi: [{
+			type: i0.ViewChild,
+			args: ["decompteDuRenvoi", { isSignal: true }]
+		}]
+	}
+});
+const IMPRESSION_EXCLUSIVE = "data-st-impression-exclusive";
+const DELAI_AVANT_REVOCATION = 4e4;
+var StRecoveryCodes = class StRecoveryCodes {
+	document = inject(DOCUMENT);
+	destruction = inject(DestroyRef);
+	libelles = inject(ST_LIBELLES);
+	annonce = new AnnonceLocale(this.destruction);
+	codes = input([], ...ngDevMode ? [{ debugName: "codes" }] : 	/* istanbul ignore next */ []);
+	restants = input(null, ...ngDevMode ? [{ debugName: "restants" }] : 	/* istanbul ignore next */ []);
+	regenerationEnCours = input(false, {
+		...ngDevMode ? { debugName: "regenerationEnCours" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	enTeteDuFichier = input(null, ...ngDevMode ? [{ debugName: "enTeteDuFichier" }] : 	/* istanbul ignore next */ []);
+	nomDuFichier = input("codes-de-secours.txt", ...ngDevMode ? [{ debugName: "nomDuFichier" }] : 	/* istanbul ignore next */ []);
+	libelleDeLAction = input(null, ...ngDevMode ? [{ debugName: "libelleDeLAction" }] : 	/* istanbul ignore next */ []);
+	confirme = model(false, ...ngDevMode ? [{ debugName: "confirme" }] : 	/* istanbul ignore next */ []);
+	confirmation = output();
+	copie = output();
+	telechargement = output();
+	impression = output();
+	regeneration = output();
+	tousLesCodes = computed(() => this.codes().join("\n"), ...ngDevMode ? [{ debugName: "tousLesCodes" }] : 	/* istanbul ignore next */ []);
+	raisonDeLAttente = computed(() => this.libelles().cocherPourContinuer(this.libelles().codesEnregistres), ...ngDevMode ? [{ debugName: "raisonDeLAttente" }] : 	/* istanbul ignore next */ []);
+	tonDuCompteur = computed(() => {
+		const restants = this.restants() ?? 0;
+		return restants === 0 ? "danger" : restants <= 2 ? "avertissement" : "neutre";
+	}, ...ngDevMode ? [{ debugName: "tonDuCompteur" }] : 	/* istanbul ignore next */ []);
+	constructor() {
+		this.destruction.onDestroy(() => {
+			this.document.documentElement.removeAttribute(IMPRESSION_EXCLUSIVE);
+		});
+	}
+	copier() {
+		this.copie.emit();
+	}
+	regenerer() {
+		if (this.regenerationEnCours()) return;
+		this.regeneration.emit();
+	}
+	telecharger() {
+		const enTete = this.enTeteDuFichier();
+		const texte = `${enTete === null ? "" : `${enTete}\n\n`}${this.tousLesCodes()}\n`;
+		const adresse = URL.createObjectURL(new Blob([texte], { type: "text/plain;charset=utf-8" }));
+		const lien = this.document.createElement("a");
+		lien.href = adresse;
+		lien.download = this.nomDuFichier();
+		lien.click();
+		setTimeout(() => {
+			URL.revokeObjectURL(adresse);
+		}, DELAI_AVANT_REVOCATION);
+		this.annonce.annoncer(this.libelles().fichierTelecharge(sansCommandesDeDirection(this.nomDuFichier())));
+		this.telechargement.emit();
+	}
+	imprimer() {
+		const racine = this.document.documentElement;
+		const vue = this.document.defaultView;
+		racine.setAttribute(IMPRESSION_EXCLUSIVE, "");
+		vue?.addEventListener("afterprint", () => {
+			racine.removeAttribute(IMPRESSION_EXCLUSIVE);
+		}, { once: true });
+		this.impression.emit();
+		vue?.print();
+	}
+	confirmer() {
+		if (this.confirme()) this.confirmation.emit();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StRecoveryCodes,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: StRecoveryCodes,
+		isStandalone: true,
+		selector: "st-recovery-codes",
+		inputs: {
+			codes: {
+				classPropertyName: "codes",
+				publicName: "codes",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			restants: {
+				classPropertyName: "restants",
+				publicName: "restants",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			regenerationEnCours: {
+				classPropertyName: "regenerationEnCours",
+				publicName: "regenerationEnCours",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			enTeteDuFichier: {
+				classPropertyName: "enTeteDuFichier",
+				publicName: "enTeteDuFichier",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			nomDuFichier: {
+				classPropertyName: "nomDuFichier",
+				publicName: "nomDuFichier",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			libelleDeLAction: {
+				classPropertyName: "libelleDeLAction",
+				publicName: "libelleDeLAction",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			confirme: {
+				classPropertyName: "confirme",
+				publicName: "confirme",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			confirme: "confirmeChange",
+			confirmation: "confirmation",
+			copie: "copie",
+			telechargement: "telechargement",
+			impression: "impression",
+			regeneration: "regeneration"
+		},
+		host: { classAttribute: "st-recovery-codes" },
+		ngImport: i0,
+		template: "@if (restants() !== null) {\n  <!-- Le compteur : ce qui reste, et le moyen d'en obtenir d'autres. -->\n  <div class=\"st-recovery-codes__compteur\" [attr.data-ton]=\"tonDuCompteur()\">\n    <p class=\"st-recovery-codes__restants\">{{ libelles().codesRestants(restants() ?? 0) }}</p>\n    <!-- La regeneration attend et avale les clics : deux clics feraient deux jeux (D-8). -->\n    <button stButton type=\"button\" [chargement]=\"regenerationEnCours()\" (click)=\"regenerer()\">\n      {{ libelles().genererDeNouveauxCodes }}\n    </button>\n  </div>\n} @else {\n  <st-banner ton=\"avertissement\" [message]=\"libelles().codesAUsageUnique\" />\n\n  <!-- La seule region imprimee quand on demande l'impression (feuille des jetons). -->\n  <ol class=\"st-recovery-codes__liste\" data-st-imprimable>\n    @for (code of codes(); track $index; let rang = $index) {\n      <li class=\"st-recovery-codes__code\">\n        <!-- Le rang dans la phrase de la langue, et non colle a un libelle (D-26). -->\n        <st-code\n          [valeur]=\"code\"\n          [etiquette]=\"libelles().codeDeSecoursNumero(rang + 1)\"\n          (copie)=\"copier()\"\n        />\n      </li>\n    }\n  </ol>\n\n  <div class=\"st-recovery-codes__outils\">\n    <st-copy-button\n      variante=\"secondaire\"\n      [valeur]=\"tousLesCodes()\"\n      [libelle]=\"libelles().copierTousLesCodes\"\n      (copie)=\"copier()\"\n    />\n    <button stButton type=\"button\" iconeAvant=\"telecharger\" (click)=\"telecharger()\">\n      {{ libelles().telecharger }}\n    </button>\n    <button stButton type=\"button\" iconeAvant=\"imprimer\" (click)=\"imprimer()\">\n      {{ libelles().imprimer }}\n    </button>\n  </div>\n\n  <st-checkbox [libelle]=\"libelles().codesEnregistres\" [(checked)]=\"confirme\" />\n\n  <st-form-actions class=\"st-recovery-codes__actions\" disposition=\"pied\">\n    <button\n      stButton\n      variante=\"primaire\"\n      type=\"button\"\n      [indisponible]=\"!confirme()\"\n      [raisonIndisponible]=\"raisonDeLAttente()\"\n      (click)=\"confirmer()\"\n    >\n      {{ libelleDeLAction() ?? libelles().continuer }}\n    </button>\n  </st-form-actions>\n}\n<!-- Nee vide, hors des deux branches : observee avant que le telechargement ne s'y dise (D-8). -->\n<span class=\"st-vh\" aria-live=\"polite\">{{ annonce.texte() }}</span>\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:grid;gap:var(--st-espacement-5);min-inline-size:0}.st-recovery-codes__liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,13rem),1fr));gap:var(--st-espacement-2) var(--st-espacement-6);padding:0;padding-inline-start:var(--st-espacement-6);margin:0;font-variant-numeric:var(--st-chiffres-alignes);list-style:decimal}.st-recovery-codes__code{display:list-item;min-inline-size:0}.st-recovery-codes__code::marker{color:var(--st-couleur-texte-discret)}.st-recovery-codes__outils{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2)}.st-recovery-codes__actions{justify-self:stretch}.st-recovery-codes__compteur{display:flex;flex-wrap:wrap;gap:var(--st-espacement-3) var(--st-espacement-4);align-items:center;justify-content:space-between}.st-recovery-codes__restants{margin:0;font-weight:var(--st-graisse-semi)}.st-recovery-codes__compteur[data-ton=danger] .st-recovery-codes__restants{color:var(--st-couleur-danger)}@media print{.st-recovery-codes__liste{grid-template-columns:repeat(2,minmax(0,1fr))}}\n"],
+		dependencies: [
+			{
+				kind: "component",
+				type: StBanner,
+				selector: "st-banner",
+				inputs: [
+					"ton",
+					"message",
+					"titre",
+					"forme",
+					"identifiant",
+					"fermable",
+					"libelleFermeture"
+				],
+				outputs: ["ferme"]
+			},
+			{
+				kind: "component",
+				type: StButton,
+				selector: "button[stButton]",
+				inputs: [
+					"variante",
+					"taille",
+					"pleineLargeur",
+					"iconeAvant",
+					"iconeApres",
+					"chargement",
+					"indisponible",
+					"raisonIndisponible"
+				]
+			},
+			{
+				kind: "component",
+				type: StCheckbox,
+				selector: "st-checkbox",
+				inputs: ["indetermine", "aideDEtat"],
+				outputs: ["indetermineChange"]
+			},
+			{
+				kind: "component",
+				type: StCode,
+				selector: "st-code",
+				inputs: [
+					"valeur",
+					"copiable",
+					"etiquette",
+					"libelleCopier",
+					"messageDeConfirmation"
+				],
+				outputs: ["copie"]
+			},
+			{
+				kind: "component",
+				type: StCopyButton,
+				selector: "st-copy-button",
+				inputs: [
+					"valeur",
+					"libelle",
+					"iconeSeule",
+					"messageDeConfirmation",
+					"variante",
+					"taille",
+					"tailleDuGlyphe"
+				],
+				outputs: ["copie"]
+			},
+			{
+				kind: "component",
+				type: StFormActions,
+				selector: "st-form-actions",
+				inputs: ["disposition"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StRecoveryCodes,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-recovery-codes",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				StBanner,
+				StButton,
+				StCheckbox,
+				StCode,
+				StCopyButton,
+				StFormActions
+			],
+			host: { class: "st-recovery-codes" },
+			template: "@if (restants() !== null) {\n  <!-- Le compteur : ce qui reste, et le moyen d'en obtenir d'autres. -->\n  <div class=\"st-recovery-codes__compteur\" [attr.data-ton]=\"tonDuCompteur()\">\n    <p class=\"st-recovery-codes__restants\">{{ libelles().codesRestants(restants() ?? 0) }}</p>\n    <!-- La regeneration attend et avale les clics : deux clics feraient deux jeux (D-8). -->\n    <button stButton type=\"button\" [chargement]=\"regenerationEnCours()\" (click)=\"regenerer()\">\n      {{ libelles().genererDeNouveauxCodes }}\n    </button>\n  </div>\n} @else {\n  <st-banner ton=\"avertissement\" [message]=\"libelles().codesAUsageUnique\" />\n\n  <!-- La seule region imprimee quand on demande l'impression (feuille des jetons). -->\n  <ol class=\"st-recovery-codes__liste\" data-st-imprimable>\n    @for (code of codes(); track $index; let rang = $index) {\n      <li class=\"st-recovery-codes__code\">\n        <!-- Le rang dans la phrase de la langue, et non colle a un libelle (D-26). -->\n        <st-code\n          [valeur]=\"code\"\n          [etiquette]=\"libelles().codeDeSecoursNumero(rang + 1)\"\n          (copie)=\"copier()\"\n        />\n      </li>\n    }\n  </ol>\n\n  <div class=\"st-recovery-codes__outils\">\n    <st-copy-button\n      variante=\"secondaire\"\n      [valeur]=\"tousLesCodes()\"\n      [libelle]=\"libelles().copierTousLesCodes\"\n      (copie)=\"copier()\"\n    />\n    <button stButton type=\"button\" iconeAvant=\"telecharger\" (click)=\"telecharger()\">\n      {{ libelles().telecharger }}\n    </button>\n    <button stButton type=\"button\" iconeAvant=\"imprimer\" (click)=\"imprimer()\">\n      {{ libelles().imprimer }}\n    </button>\n  </div>\n\n  <st-checkbox [libelle]=\"libelles().codesEnregistres\" [(checked)]=\"confirme\" />\n\n  <st-form-actions class=\"st-recovery-codes__actions\" disposition=\"pied\">\n    <button\n      stButton\n      variante=\"primaire\"\n      type=\"button\"\n      [indisponible]=\"!confirme()\"\n      [raisonIndisponible]=\"raisonDeLAttente()\"\n      (click)=\"confirmer()\"\n    >\n      {{ libelleDeLAction() ?? libelles().continuer }}\n    </button>\n  </st-form-actions>\n}\n<!-- Nee vide, hors des deux branches : observee avant que le telechargement ne s'y dise (D-8). -->\n<span class=\"st-vh\" aria-live=\"polite\">{{ annonce.texte() }}</span>\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:grid;gap:var(--st-espacement-5);min-inline-size:0}.st-recovery-codes__liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,13rem),1fr));gap:var(--st-espacement-2) var(--st-espacement-6);padding:0;padding-inline-start:var(--st-espacement-6);margin:0;font-variant-numeric:var(--st-chiffres-alignes);list-style:decimal}.st-recovery-codes__code{display:list-item;min-inline-size:0}.st-recovery-codes__code::marker{color:var(--st-couleur-texte-discret)}.st-recovery-codes__outils{display:flex;flex-wrap:wrap;gap:var(--st-espacement-2)}.st-recovery-codes__actions{justify-self:stretch}.st-recovery-codes__compteur{display:flex;flex-wrap:wrap;gap:var(--st-espacement-3) var(--st-espacement-4);align-items:center;justify-content:space-between}.st-recovery-codes__restants{margin:0;font-weight:var(--st-graisse-semi)}.st-recovery-codes__compteur[data-ton=danger] .st-recovery-codes__restants{color:var(--st-couleur-danger)}@media print{.st-recovery-codes__liste{grid-template-columns:repeat(2,minmax(0,1fr))}}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		codes: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "codes",
+				required: false
+			}]
+		}],
+		restants: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "restants",
+				required: false
+			}]
+		}],
+		regenerationEnCours: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "regenerationEnCours",
+				required: false
+			}]
+		}],
+		enTeteDuFichier: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "enTeteDuFichier",
+				required: false
+			}]
+		}],
+		nomDuFichier: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "nomDuFichier",
+				required: false
+			}]
+		}],
+		libelleDeLAction: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "libelleDeLAction",
+				required: false
+			}]
+		}],
+		confirme: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "confirme",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["confirmeChange"]
+		}],
+		confirmation: [{
+			type: i0.Output,
+			args: ["confirmation"]
+		}],
+		copie: [{
+			type: i0.Output,
+			args: ["copie"]
+		}],
+		telechargement: [{
+			type: i0.Output,
+			args: ["telechargement"]
+		}],
+		impression: [{
+			type: i0.Output,
+			args: ["impression"]
+		}],
+		regeneration: [{
+			type: i0.Output,
+			args: ["regeneration"]
+		}]
+	}
+});
+export { StChallenge, StOutcome, StRecoveryCodes, StRefusal, StTaskList, StWizard, StWizardStep };
+
+//# sourceMappingURL=starterlib-ui-parcours.mjs.map