@starterlib/ui 0.7.2 → 0.9.0

package/fesm2022/starterlib-ui-messagerie.mjs

@@ -0,0 +1,737 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, DOCUMENT, DestroyRef, ElementRef, InjectionToken, Injector, afterNextRender, booleanAttribute, computed, effect, inject, input, output, signal, untracked, viewChild } from "@angular/core";
+import { AnnonceLocale, FUSEAU_PAR_DEFAUT, ST_LOCALE, StButton, StFormActions, StIcon, StSpinner, catalogueDuPointDEntree } from "@starterlib/ui";
+import { StPerson } from "@starterlib/ui/donnees";
+import { StAttachment } from "@starterlib/ui/listes";
+import { lireInstant, sansCommandesDeDirection } from "@starterlib/util";
+import { NgTemplateOutlet } from "@angular/common";
+import { delai } from "@starterlib/tokens";
+import { StFileUpload, StTextarea } from "@starterlib/ui/saisie";
+const LIBELLES_MESSAGERIE_FR = {
+	afficherLesMessagesPrecedents: "Afficher les messages précédents",
+	messagesPrecedentsAffiches: (nombre) => nombre > 1 ? `${String(nombre)} messages pr\u00e9c\u00e9dents affich\u00e9s` : `${String(nombre)} message pr\u00e9c\u00e9dent affich\u00e9`,
+	messageDe: (auteur, quand) => `${auteur}, ${quand}`,
+	noteInterne: "Note interne",
+	envoiEnCours: "Envoi en cours",
+	envoye: "Envoyé",
+	lu: "Lu",
+	echecDeLEnvoi: "Échec de l’envoi",
+	reessayer: "Réessayer",
+	reessayerLEnvoiDu: (quand) => `R\u00e9essayer l\u2019envoi du message du ${quand}`,
+	piecesJointes: "Pièces jointes",
+	votreMessage: "Votre message",
+	joindreDesFichiers: "Joindre des fichiers",
+	envoyer: "Envoyer",
+	raccourciDEnvoi: "Ctrl+Entrée pour envoyer."
+};
+const LIBELLES_MESSAGERIE_EN = {
+	afficherLesMessagesPrecedents: "Show earlier messages",
+	messagesPrecedentsAffiches: (nombre) => `${String(nombre)} earlier message${nombre > 1 ? "s" : ""} shown`,
+	messageDe: (auteur, quand) => `${auteur}, ${quand}`,
+	noteInterne: "Internal note",
+	envoiEnCours: "Sending",
+	envoye: "Sent",
+	lu: "Read",
+	echecDeLEnvoi: "Not sent",
+	reessayer: "Retry",
+	reessayerLEnvoiDu: (quand) => `Retry sending the message of ${quand}`,
+	piecesJointes: "Attachments",
+	votreMessage: "Your message",
+	joindreDesFichiers: "Attach files",
+	envoyer: "Send",
+	raccourciDEnvoi: "Ctrl+Enter to send."
+};
+const ST_LIBELLES_MESSAGERIE = new InjectionToken("ST_LIBELLES_MESSAGERIE", {
+	providedIn: "root",
+	factory: () => ({
+		fr: LIBELLES_MESSAGERIE_FR,
+		en: LIBELLES_MESSAGERIE_EN
+	})
+});
+function fournirLibellesMessagerie(catalogues) {
+	return {
+		provide: ST_LIBELLES_MESSAGERIE,
+		useValue: {
+			fr: LIBELLES_MESSAGERIE_FR,
+			en: LIBELLES_MESSAGERIE_EN,
+			...catalogues
+		}
+	};
+}
+function libellesDeLaMessagerie() {
+	const catalogue = catalogueDeLaMessagerie();
+	return computed(() => catalogue().libelles);
+}
+function catalogueDeLaMessagerie() {
+	return catalogueDuPointDEntree("@starterlib/ui/messagerie", inject(ST_LIBELLES_MESSAGERIE), LIBELLES_MESSAGERIE_FR, "fournirLibellesMessagerie");
+}
+var StMessage = class StMessage {
+	locale = inject(ST_LOCALE);
+	fuseau = inject(FUSEAU_PAR_DEFAUT);
+	element = inject(ElementRef);
+	document = inject(DOCUMENT);
+	injecteur = inject(Injector);
+	article = viewChild.required("article", ...ngDevMode ? [{ debugName: "article" }] : 	/* istanbul ignore next */ []);
+	catalogue = catalogueDeLaMessagerie();
+	libelles = computed(() => this.catalogue().libelles, ...ngDevMode ? [{ debugName: "libelles" }] : 	/* istanbul ignore next */ []);
+	langueDeRepli = computed(() => this.catalogue().langueDeRepli, ...ngDevMode ? [{ debugName: "langueDeRepli" }] : 	/* istanbul ignore next */ []);
+	message = input.required(...ngDevMode ? [{ debugName: "message" }] : 	/* istanbul ignore next */ []);
+	reessai = output();
+	nature = computed(() => this.message().nature ?? "ordinaire", ...ngDevMode ? [{ debugName: "nature" }] : 	/* istanbul ignore next */ []);
+	statut = computed(() => this.message().statut ?? null, ...ngDevMode ? [{ debugName: "statut" }] : 	/* istanbul ignore next */ []);
+	repriseDemandee = signal(false, ...ngDevMode ? [{ debugName: "repriseDemandee" }] : 	/* istanbul ignore next */ []);
+	repriseVisible = computed(() => {
+		const statut = this.statut();
+		return statut === "echec" || statut === "envoi" && this.repriseDemandee();
+	}, ...ngDevMode ? [{ debugName: "repriseVisible" }] : 	/* istanbul ignore next */ []);
+	constructor() {
+		effect(() => {
+			const statut = this.statut();
+			untracked(() => {
+				if (statut !== "envoi" && statut !== "echec") this.repriseDemandee.set(false);
+				if (!this.element.nativeElement.contains(this.document.activeElement)) return;
+				afterNextRender(() => {
+					const actif = this.document.activeElement;
+					if (actif === null || actif === this.document.body || !actif.isConnected) this.article().nativeElement.focus();
+				}, { injector: this.injecteur });
+			});
+		});
+	}
+	instant = computed(() => lireInstant(this.message().envoyeLe, this.fuseau), ...ngDevMode ? [{ debugName: "instant" }] : 	/* istanbul ignore next */ []);
+	heure = computed(() => this.formater({
+		hour: "2-digit",
+		minute: "2-digit"
+	}), ...ngDevMode ? [{ debugName: "heure" }] : 	/* istanbul ignore next */ []);
+	quand = computed(() => this.formater({
+		day: "2-digit",
+		month: "2-digit",
+		hour: "2-digit",
+		minute: "2-digit"
+	}), ...ngDevMode ? [{ debugName: "quand" }] : 	/* istanbul ignore next */ []);
+	nom = computed(() => this.libelles().messageDe(sansCommandesDeDirection(this.message().auteur), this.quand()), ...ngDevMode ? [{ debugName: "nom" }] : 	/* istanbul ignore next */ []);
+	paragraphes = computed(() => sansCommandesDeDirection(this.message().corps).split(/\n[ \t]*\n/).map((paragraphe) => paragraphe.trim()).filter((paragraphe) => paragraphe !== ""), ...ngDevMode ? [{ debugName: "paragraphes" }] : 	/* istanbul ignore next */ []);
+	pieces = computed(() => this.message().piecesJointes ?? [], ...ngDevMode ? [{ debugName: "pieces" }] : 	/* istanbul ignore next */ []);
+	reprendre() {
+		this.repriseDemandee.set(true);
+		this.reessai.emit(this.message().id);
+	}
+	formater(options) {
+		const instant = this.instant();
+		if (instant === null) return this.message().envoyeLe;
+		return new Intl.DateTimeFormat(this.locale(), {
+			...options,
+			timeZone: this.fuseau
+		}).format(instant);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StMessage,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: StMessage,
+		isStandalone: true,
+		selector: "st-message",
+		inputs: { message: {
+			classPropertyName: "message",
+			publicName: "message",
+			isSignal: true,
+			isRequired: true,
+			transformFunction: null
+		} },
+		outputs: { reessai: "reessai" },
+		host: {
+			properties: {
+				"attr.data-nature": "nature()",
+				"attr.data-soi": "message().soi === true ? \"\" : null"
+			},
+			classAttribute: "st-message"
+		},
+		viewQueries: [{
+			propertyName: "article",
+			first: true,
+			predicate: ["article"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "<!-- tabindex -1 : l'article recoit le focus quand le bouton qui l'avait part avec le statut (la\n     reprise aboutie), hors tabulation (audit UI du 2026-09-27, D-24). -->\n<article #article class=\"st-message__article\" tabindex=\"-1\" [attr.aria-label]=\"nom()\">\n  @if (nature() === 'systeme') {\n    <!-- Un evenement du dossier : centre, sans auteur ; son heure le suit. -->\n    <p class=\"st-message__systeme\">\n      @for (paragraphe of paragraphes(); track $index) {\n        <span class=\"st-message__ligne\" dir=\"auto\">{{ paragraphe }}</span>\n      }\n      <time class=\"st-message__heure\" [attr.datetime]=\"message().envoyeLe\">{{ heure() }}</time>\n    </p>\n  } @else {\n    <header class=\"st-message__entete\">\n      <st-person\n        taille=\"sm\"\n        [nom]=\"message().auteur\"\n        [precision]=\"message().precision ?? null\"\n        [sourceImage]=\"message().avatar ?? null\"\n        [soi]=\"message().soi === true\"\n      />\n      <time class=\"st-message__heure\" [attr.datetime]=\"message().envoyeLe\">{{ heure() }}</time>\n      <!-- `lang` : sur ce que le catalogue ecrit seul, quand il retombe sur le francais (D-29). -->\n      @if (nature() === 'interne') {\n        <span class=\"st-message__interne\" [attr.lang]=\"langueDeRepli()\">\n          <st-icon nom=\"cadenas\" taille=\"sm\" />\n          {{ libelles().noteInterne }}\n        </span>\n      }\n    </header>\n\n    <!-- Texte brut interpole : aucun HTML n'entre ni ne sort (SEC-6). -->\n    <div class=\"st-message__corps\">\n      @for (paragraphe of paragraphes(); track $index) {\n        <p class=\"st-message__paragraphe\" dir=\"auto\">{{ paragraphe }}</p>\n      }\n    </div>\n\n    @if (pieces().length > 0) {\n      <ul class=\"st-message__pieces\" role=\"list\" [attr.aria-label]=\"libelles().piecesJointes\">\n        @for (piece of pieces(); track $index) {\n          <li>\n            <st-attachment\n              [nom]=\"piece.nom\"\n              [type]=\"piece.type\"\n              [taille]=\"piece.taille ?? null\"\n              [lien]=\"piece.lien ?? null\"\n            />\n          </li>\n        }\n      </ul>\n    }\n\n    <!-- Un statut ne parle pas (`aria-live=\"off\"`, D-19) : dans le fil vivant, chaque passage\n         serait une insertion lue, et « Lu » se repeterait message apres message. L'echec seul\n         parle, par le fil. -->\n    @switch (statut()) {\n      @case ('envoi') {\n        @if (!repriseVisible()) {\n          <p class=\"st-message__statut\" aria-live=\"off\" [attr.lang]=\"langueDeRepli()\">\n            <!-- Muet : le texte qui le suit dit deja l'envoi. -->\n            <st-spinner taille=\"sm\" aria-hidden=\"true\" />\n            {{ libelles().envoiEnCours }}\n          </p>\n        }\n      }\n      @case ('envoye') {\n        <p class=\"st-message__statut\" aria-live=\"off\" [attr.lang]=\"langueDeRepli()\">\n          <st-icon nom=\"coche\" taille=\"sm\" />\n          {{ libelles().envoye }}\n        </p>\n      }\n      @case ('lu') {\n        <p class=\"st-message__statut\" aria-live=\"off\" [attr.lang]=\"langueDeRepli()\">\n          <st-icon nom=\"double-coche\" taille=\"sm\" />\n          {{ libelles().lu }}\n        </p>\n      }\n    }\n    @if (repriseVisible()) {\n      <!-- L'echec, puis la reprise qu'il a lancee : le MEME bouton garde le focus et tourne\n           pendant l'envoi (D-24, modele de st-file-upload) ; la reprise ne parle pas. Tout vient\n           du catalogue, le nom du bouton compris : sa date n'est que des chiffres. -->\n      <p\n        class=\"st-message__statut\"\n        [attr.lang]=\"langueDeRepli()\"\n        [attr.data-echec]=\"statut() === 'echec' ? '' : null\"\n        [attr.aria-live]=\"statut() === 'echec' ? null : 'off'\"\n      >\n        @if (statut() === 'echec') {\n          <st-icon nom=\"cercle-alerte\" taille=\"sm\" />\n          {{ libelles().echecDeLEnvoi }}\n        } @else {\n          {{ libelles().envoiEnCours }}\n        }\n        <button\n          stButton\n          type=\"button\"\n          variante=\"discret\"\n          taille=\"sm\"\n          [chargement]=\"statut() === 'envoi'\"\n          [attr.aria-label]=\"libelles().reessayerLEnvoiDu(quand())\"\n          (click)=\"reprendre()\"\n        >\n          {{ libelles().reessayer }}\n        </button>\n      </p>\n    }\n  }\n</article>\n",
+		styles: [".st-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host([hidden]){display:none!important}:host{display:block;min-inline-size:0}.st-message__article: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-message__article{display:flex;flex-direction:column;gap:var(--st-espacement-2);max-inline-size:min(100%,40rem);padding:var(--st-espacement-3) var(--st-espacement-4);color:var(--st-couleur-texte);background:var(--st-couleur-surface);border:var(--st-epaisseur-fine) solid var(--st-couleur-bordure);border-radius:var(--st-rayon-lg)}:host([data-soi]) .st-message__article{margin-inline-start:auto;background:var(--st-couleur-surface-conteneur-bas)}:host([data-nature=interne]) .st-message__article{background:var(--st-couleur-avertissement-discret);border-style:dashed}:host([data-nature=systeme]) .st-message__article{align-items:center;max-inline-size:100%;padding-block:var(--st-espacement-1);background:transparent;border:0}.st-message__entete{display:flex;flex-wrap:wrap;gap:var(--st-espacement-1) var(--st-espacement-3);align-items:center}.st-message__heure{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);font-variant-numeric:var(--st-chiffres-alignes);color:var(--st-couleur-texte-discret)}.st-message__interne{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);display:inline-flex;gap:var(--st-espacement-1);align-items:center;font-weight:var(--st-graisse-semi);color:var(--st-couleur-sur-avertissement-discret)}.st-message__corps{display:flex;flex-direction:column;gap:var(--st-espacement-2)}.st-message__paragraphe{font-size:var(--st-taille-md);line-height:var(--st-interligne-md);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);margin:0;overflow-wrap:anywhere;white-space:pre-line}.st-message__pieces{display:flex;flex-direction:column;gap:var(--st-espacement-2);padding:0;margin:0;list-style:none}.st-message__statut{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);display:inline-flex;flex-wrap:wrap;gap:var(--st-espacement-1) var(--st-espacement-2);align-items:center;align-self:flex-end;margin:0;color:var(--st-couleur-texte-discret)}.st-message__statut[data-echec]{font-weight:var(--st-graisse-semi);color:var(--st-couleur-danger)}.st-message__systeme{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);display:flex;flex-wrap:wrap;gap:var(--st-espacement-1) var(--st-espacement-2);justify-content:center;margin:0;color:var(--st-couleur-texte-discret);text-align:center}@media(forced-colors:active){.st-message__article{border-color:CanvasText}}\n"],
+		dependencies: [
+			{
+				kind: "component",
+				type: StAttachment,
+				selector: "st-attachment",
+				inputs: [
+					"nom",
+					"type",
+					"taille",
+					"lien",
+					"date",
+					"nouvelOnglet",
+					"enAttente"
+				],
+				outputs: ["telechargement"]
+			},
+			{
+				kind: "component",
+				type: StButton,
+				selector: "button[stButton]",
+				inputs: [
+					"variante",
+					"taille",
+					"pleineLargeur",
+					"iconeAvant",
+					"iconeApres",
+					"chargement",
+					"indisponible",
+					"raisonIndisponible"
+				]
+			},
+			{
+				kind: "component",
+				type: StIcon,
+				selector: "st-icon",
+				inputs: [
+					"icone",
+					"nom",
+					"variante",
+					"sprite",
+					"nomMetier",
+					"taille",
+					"ton",
+					"etiquette",
+					"miroir"
+				]
+			},
+			{
+				kind: "component",
+				type: StPerson,
+				selector: "st-person",
+				inputs: [
+					"nom",
+					"precision",
+					"sourceImage",
+					"lien",
+					"taille",
+					"disposition",
+					"ton",
+					"soi"
+				]
+			},
+			{
+				kind: "component",
+				type: StSpinner,
+				selector: "st-spinner",
+				inputs: [
+					"taille",
+					"ton",
+					"etiquette",
+					"icone"
+				]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StMessage,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-message",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				StAttachment,
+				StButton,
+				StIcon,
+				StPerson,
+				StSpinner
+			],
+			host: {
+				class: "st-message",
+				"[attr.data-nature]": "nature()",
+				"[attr.data-soi]": "message().soi === true ? \"\" : null"
+			},
+			template: "<!-- tabindex -1 : l'article recoit le focus quand le bouton qui l'avait part avec le statut (la\n     reprise aboutie), hors tabulation (audit UI du 2026-09-27, D-24). -->\n<article #article class=\"st-message__article\" tabindex=\"-1\" [attr.aria-label]=\"nom()\">\n  @if (nature() === 'systeme') {\n    <!-- Un evenement du dossier : centre, sans auteur ; son heure le suit. -->\n    <p class=\"st-message__systeme\">\n      @for (paragraphe of paragraphes(); track $index) {\n        <span class=\"st-message__ligne\" dir=\"auto\">{{ paragraphe }}</span>\n      }\n      <time class=\"st-message__heure\" [attr.datetime]=\"message().envoyeLe\">{{ heure() }}</time>\n    </p>\n  } @else {\n    <header class=\"st-message__entete\">\n      <st-person\n        taille=\"sm\"\n        [nom]=\"message().auteur\"\n        [precision]=\"message().precision ?? null\"\n        [sourceImage]=\"message().avatar ?? null\"\n        [soi]=\"message().soi === true\"\n      />\n      <time class=\"st-message__heure\" [attr.datetime]=\"message().envoyeLe\">{{ heure() }}</time>\n      <!-- `lang` : sur ce que le catalogue ecrit seul, quand il retombe sur le francais (D-29). -->\n      @if (nature() === 'interne') {\n        <span class=\"st-message__interne\" [attr.lang]=\"langueDeRepli()\">\n          <st-icon nom=\"cadenas\" taille=\"sm\" />\n          {{ libelles().noteInterne }}\n        </span>\n      }\n    </header>\n\n    <!-- Texte brut interpole : aucun HTML n'entre ni ne sort (SEC-6). -->\n    <div class=\"st-message__corps\">\n      @for (paragraphe of paragraphes(); track $index) {\n        <p class=\"st-message__paragraphe\" dir=\"auto\">{{ paragraphe }}</p>\n      }\n    </div>\n\n    @if (pieces().length > 0) {\n      <ul class=\"st-message__pieces\" role=\"list\" [attr.aria-label]=\"libelles().piecesJointes\">\n        @for (piece of pieces(); track $index) {\n          <li>\n            <st-attachment\n              [nom]=\"piece.nom\"\n              [type]=\"piece.type\"\n              [taille]=\"piece.taille ?? null\"\n              [lien]=\"piece.lien ?? null\"\n            />\n          </li>\n        }\n      </ul>\n    }\n\n    <!-- Un statut ne parle pas (`aria-live=\"off\"`, D-19) : dans le fil vivant, chaque passage\n         serait une insertion lue, et « Lu » se repeterait message apres message. L'echec seul\n         parle, par le fil. -->\n    @switch (statut()) {\n      @case ('envoi') {\n        @if (!repriseVisible()) {\n          <p class=\"st-message__statut\" aria-live=\"off\" [attr.lang]=\"langueDeRepli()\">\n            <!-- Muet : le texte qui le suit dit deja l'envoi. -->\n            <st-spinner taille=\"sm\" aria-hidden=\"true\" />\n            {{ libelles().envoiEnCours }}\n          </p>\n        }\n      }\n      @case ('envoye') {\n        <p class=\"st-message__statut\" aria-live=\"off\" [attr.lang]=\"langueDeRepli()\">\n          <st-icon nom=\"coche\" taille=\"sm\" />\n          {{ libelles().envoye }}\n        </p>\n      }\n      @case ('lu') {\n        <p class=\"st-message__statut\" aria-live=\"off\" [attr.lang]=\"langueDeRepli()\">\n          <st-icon nom=\"double-coche\" taille=\"sm\" />\n          {{ libelles().lu }}\n        </p>\n      }\n    }\n    @if (repriseVisible()) {\n      <!-- L'echec, puis la reprise qu'il a lancee : le MEME bouton garde le focus et tourne\n           pendant l'envoi (D-24, modele de st-file-upload) ; la reprise ne parle pas. Tout vient\n           du catalogue, le nom du bouton compris : sa date n'est que des chiffres. -->\n      <p\n        class=\"st-message__statut\"\n        [attr.lang]=\"langueDeRepli()\"\n        [attr.data-echec]=\"statut() === 'echec' ? '' : null\"\n        [attr.aria-live]=\"statut() === 'echec' ? null : 'off'\"\n      >\n        @if (statut() === 'echec') {\n          <st-icon nom=\"cercle-alerte\" taille=\"sm\" />\n          {{ libelles().echecDeLEnvoi }}\n        } @else {\n          {{ libelles().envoiEnCours }}\n        }\n        <button\n          stButton\n          type=\"button\"\n          variante=\"discret\"\n          taille=\"sm\"\n          [chargement]=\"statut() === 'envoi'\"\n          [attr.aria-label]=\"libelles().reessayerLEnvoiDu(quand())\"\n          (click)=\"reprendre()\"\n        >\n          {{ libelles().reessayer }}\n        </button>\n      </p>\n    }\n  }\n</article>\n",
+			styles: [".st-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host([hidden]){display:none!important}:host{display:block;min-inline-size:0}.st-message__article: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-message__article{display:flex;flex-direction:column;gap:var(--st-espacement-2);max-inline-size:min(100%,40rem);padding:var(--st-espacement-3) var(--st-espacement-4);color:var(--st-couleur-texte);background:var(--st-couleur-surface);border:var(--st-epaisseur-fine) solid var(--st-couleur-bordure);border-radius:var(--st-rayon-lg)}:host([data-soi]) .st-message__article{margin-inline-start:auto;background:var(--st-couleur-surface-conteneur-bas)}:host([data-nature=interne]) .st-message__article{background:var(--st-couleur-avertissement-discret);border-style:dashed}:host([data-nature=systeme]) .st-message__article{align-items:center;max-inline-size:100%;padding-block:var(--st-espacement-1);background:transparent;border:0}.st-message__entete{display:flex;flex-wrap:wrap;gap:var(--st-espacement-1) var(--st-espacement-3);align-items:center}.st-message__heure{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);font-variant-numeric:var(--st-chiffres-alignes);color:var(--st-couleur-texte-discret)}.st-message__interne{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);display:inline-flex;gap:var(--st-espacement-1);align-items:center;font-weight:var(--st-graisse-semi);color:var(--st-couleur-sur-avertissement-discret)}.st-message__corps{display:flex;flex-direction:column;gap:var(--st-espacement-2)}.st-message__paragraphe{font-size:var(--st-taille-md);line-height:var(--st-interligne-md);font-weight:var(--st-graisse-normale);letter-spacing:var(--st-interlettrage-normal);margin:0;overflow-wrap:anywhere;white-space:pre-line}.st-message__pieces{display:flex;flex-direction:column;gap:var(--st-espacement-2);padding:0;margin:0;list-style:none}.st-message__statut{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);display:inline-flex;flex-wrap:wrap;gap:var(--st-espacement-1) var(--st-espacement-2);align-items:center;align-self:flex-end;margin:0;color:var(--st-couleur-texte-discret)}.st-message__statut[data-echec]{font-weight:var(--st-graisse-semi);color:var(--st-couleur-danger)}.st-message__systeme{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);display:flex;flex-wrap:wrap;gap:var(--st-espacement-1) var(--st-espacement-2);justify-content:center;margin:0;color:var(--st-couleur-texte-discret);text-align:center}@media(forced-colors:active){.st-message__article{border-color:CanvasText}}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		article: [{
+			type: i0.ViewChild,
+			args: ["article", { isSignal: true }]
+		}],
+		message: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "message",
+				required: true
+			}]
+		}],
+		reessai: [{
+			type: i0.Output,
+			args: ["reessai"]
+		}]
+	}
+});
+var StMessageThread = class StMessageThread {
+	locale = inject(ST_LOCALE);
+	fuseau = inject(FUSEAU_PAR_DEFAUT);
+	element = inject(ElementRef);
+	document = inject(DOCUMENT);
+	injecteur = inject(Injector);
+	catalogue = catalogueDeLaMessagerie();
+	libelles = computed(() => this.catalogue().libelles, ...ngDevMode ? [{ debugName: "libelles" }] : 	/* istanbul ignore next */ []);
+	langueDeRepli = computed(() => this.catalogue().langueDeRepli, ...ngDevMode ? [{ debugName: "langueDeRepli" }] : 	/* istanbul ignore next */ []);
+	etiquette = input.required(...ngDevMode ? [{ debugName: "etiquette" }] : 	/* istanbul ignore next */ []);
+	messages = input.required(...ngDevMode ? [{ debugName: "messages" }] : 	/* istanbul ignore next */ []);
+	fige = input(false, {
+		...ngDevMode ? { debugName: "fige" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	precedents = input(false, {
+		...ngDevMode ? { debugName: "precedents" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	chargementDesPrecedents = input(false, {
+		...ngDevMode ? { debugName: "chargementDesPrecedents" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	chargerPrecedents = output();
+	reessai = output();
+	annonce = new AnnonceLocale(inject(DestroyRef));
+	insertionEnCours = signal(false, ...ngDevMode ? [{ debugName: "insertionEnCours" }] : 	/* istanbul ignore next */ []);
+	occupe = computed(() => this.chargementDesPrecedents() || this.insertionEnCours(), ...ngDevMode ? [{ debugName: "occupe" }] : 	/* istanbul ignore next */ []);
+	constructor() {
+		let levee;
+		inject(DestroyRef).onDestroy(() => {
+			clearTimeout(levee);
+		});
+		let premierConnu = null;
+		effect(() => {
+			const messages = this.messages();
+			untracked(() => {
+				const avant = premierConnu;
+				premierConnu = messages[0]?.id ?? null;
+				const ajoutes = avant === null ? 0 : messages.findIndex((message) => message.id === avant);
+				if (ajoutes <= 0) return;
+				this.insertionEnCours.set(true);
+				clearTimeout(levee);
+				levee = setTimeout(() => {
+					this.insertionEnCours.set(false);
+				}, delai.annonce);
+				this.annonce.annoncer(this.libelles().messagesPrecedentsAffiches(ajoutes));
+			});
+		});
+		effect(() => {
+			const precedents = this.precedents();
+			untracked(() => {
+				const hote = this.element.nativeElement;
+				if (precedents || !hote.contains(this.document.activeElement)) return;
+				afterNextRender(() => {
+					const actif = this.document.activeElement;
+					if (actif !== null && actif !== this.document.body && actif.isConnected) return;
+					hote.querySelector(".st-message__article")?.focus();
+				}, { injector: this.injecteur });
+			});
+		});
+	}
+	jours = computed(() => {
+		const cle = new Intl.DateTimeFormat("en-CA", {
+			timeZone: this.fuseau,
+			year: "numeric",
+			month: "2-digit",
+			day: "2-digit"
+		});
+		const titre = new Intl.DateTimeFormat(this.locale(), {
+			timeZone: this.fuseau,
+			weekday: "long",
+			day: "numeric",
+			month: "long",
+			year: "numeric"
+		});
+		const jours = [];
+		for (const message of this.messages()) {
+			const instant = lireInstant(message.envoyeLe, this.fuseau);
+			const jour = instant === null ? "" : cle.format(instant);
+			const dernier = jours.at(-1);
+			if (dernier?.jour === jour) dernier.messages.push(message);
+			else jours.push({
+				jour,
+				titre: instant === null ? "" : titre.format(instant),
+				messages: [message]
+			});
+		}
+		return jours;
+	}, ...ngDevMode ? [{ debugName: "jours" }] : 	/* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StMessageThread,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: StMessageThread,
+		isStandalone: true,
+		selector: "st-message-thread",
+		inputs: {
+			etiquette: {
+				classPropertyName: "etiquette",
+				publicName: "etiquette",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			messages: {
+				classPropertyName: "messages",
+				publicName: "messages",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			fige: {
+				classPropertyName: "fige",
+				publicName: "fige",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			precedents: {
+				classPropertyName: "precedents",
+				publicName: "precedents",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			chargementDesPrecedents: {
+				classPropertyName: "chargementDesPrecedents",
+				publicName: "chargementDesPrecedents",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			chargerPrecedents: "chargerPrecedents",
+			reessai: "reessai"
+		},
+		host: { classAttribute: "st-message-thread" },
+		ngImport: i0,
+		template: "@if (precedents()) {\n  <div class=\"st-message-thread__precedents\">\n    <!-- `lang` : le bouton et l'annonce du bas sont tout entiers au catalogue (D-29). -->\n    <button\n      stButton\n      type=\"button\"\n      variante=\"discret\"\n      taille=\"sm\"\n      [attr.lang]=\"langueDeRepli()\"\n      [chargement]=\"chargementDesPrecedents()\"\n      (click)=\"chargerPrecedents.emit()\"\n    >\n      {{ libelles().afficherLesMessagesPrecedents }}\n    </button>\n  </div>\n}\n\n<ng-template #jourDuFil let-jour>\n  @if (jour.titre !== '') {\n    <p class=\"st-message-thread__jour\">\n      <time [attr.datetime]=\"jour.jour\">{{ jour.titre }}</time>\n    </p>\n  }\n</ng-template>\n\n@if (fige()) {\n  <!-- Un historique clos : une liste, sans region vivante ; chaque message y est un element. -->\n  <ol\n    class=\"st-message-thread__liste\"\n    role=\"list\"\n    [attr.aria-label]=\"etiquette()\"\n    [attr.aria-busy]=\"occupe() ? 'true' : null\"\n  >\n    @for (jour of jours(); track jour.jour) {\n      @for (message of jour.messages; track message.id; let premier = $first) {\n        <li class=\"st-message-thread__element\">\n          @if (premier) {\n            <ng-container *ngTemplateOutlet=\"jourDuFil; context: { $implicit: jour }\" />\n          }\n          <st-message [message]=\"message\" (reessai)=\"reessai.emit($event)\" />\n        </li>\n      }\n    }\n  </ol>\n} @else {\n  <!-- Le fil vivant : un message ajoute s'annonce poliment, sans voler le focus. Occupe\n       (`aria-busy`) pendant le chargement des precedents et leur insertion en tete : ils ne\n       s'annoncent pas comme nouveaux ; leur nombre se dit une fois, hors du fil (D-19). -->\n  <section\n    class=\"st-message-thread__liste\"\n    role=\"log\"\n    [attr.aria-label]=\"etiquette()\"\n    [attr.aria-busy]=\"occupe() ? 'true' : null\"\n  >\n    @for (jour of jours(); track jour.jour) {\n      <ng-container *ngTemplateOutlet=\"jourDuFil; context: { $implicit: jour }\" />\n      @for (message of jour.messages; track message.id) {\n        <st-message [message]=\"message\" (reessai)=\"reessai.emit($event)\" />\n      }\n    }\n  </section>\n}\n<span class=\"st-vh\" aria-live=\"polite\" [attr.lang]=\"langueDeRepli()\">{{ 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:flex;flex-direction:column;gap:var(--st-espacement-3);min-inline-size:0}.st-message-thread__precedents{display:flex;justify-content:center}.st-message-thread__liste{display:flex;flex-direction:column;gap:var(--st-espacement-3);padding:0;margin:0;list-style:none}.st-message-thread__element{display:flex;flex-direction:column;gap:var(--st-espacement-3)}.st-message-thread__jour{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);display:flex;gap:var(--st-espacement-3);align-items:center;margin:var(--st-espacement-2) 0 0;color:var(--st-couleur-texte-discret)}.st-message-thread__jour:before,.st-message-thread__jour:after{flex:1;block-size:var(--st-epaisseur-capillaire);content:\"\";background:var(--st-couleur-bordure)}@media(forced-colors:active){.st-message-thread__jour:before,.st-message-thread__jour:after{background:CanvasText}}\n"],
+		dependencies: [
+			{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "component",
+				type: StButton,
+				selector: "button[stButton]",
+				inputs: [
+					"variante",
+					"taille",
+					"pleineLargeur",
+					"iconeAvant",
+					"iconeApres",
+					"chargement",
+					"indisponible",
+					"raisonIndisponible"
+				]
+			},
+			{
+				kind: "component",
+				type: StMessage,
+				selector: "st-message",
+				inputs: ["message"],
+				outputs: ["reessai"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StMessageThread,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-message-thread",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				NgTemplateOutlet,
+				StButton,
+				StMessage
+			],
+			host: { class: "st-message-thread" },
+			template: "@if (precedents()) {\n  <div class=\"st-message-thread__precedents\">\n    <!-- `lang` : le bouton et l'annonce du bas sont tout entiers au catalogue (D-29). -->\n    <button\n      stButton\n      type=\"button\"\n      variante=\"discret\"\n      taille=\"sm\"\n      [attr.lang]=\"langueDeRepli()\"\n      [chargement]=\"chargementDesPrecedents()\"\n      (click)=\"chargerPrecedents.emit()\"\n    >\n      {{ libelles().afficherLesMessagesPrecedents }}\n    </button>\n  </div>\n}\n\n<ng-template #jourDuFil let-jour>\n  @if (jour.titre !== '') {\n    <p class=\"st-message-thread__jour\">\n      <time [attr.datetime]=\"jour.jour\">{{ jour.titre }}</time>\n    </p>\n  }\n</ng-template>\n\n@if (fige()) {\n  <!-- Un historique clos : une liste, sans region vivante ; chaque message y est un element. -->\n  <ol\n    class=\"st-message-thread__liste\"\n    role=\"list\"\n    [attr.aria-label]=\"etiquette()\"\n    [attr.aria-busy]=\"occupe() ? 'true' : null\"\n  >\n    @for (jour of jours(); track jour.jour) {\n      @for (message of jour.messages; track message.id; let premier = $first) {\n        <li class=\"st-message-thread__element\">\n          @if (premier) {\n            <ng-container *ngTemplateOutlet=\"jourDuFil; context: { $implicit: jour }\" />\n          }\n          <st-message [message]=\"message\" (reessai)=\"reessai.emit($event)\" />\n        </li>\n      }\n    }\n  </ol>\n} @else {\n  <!-- Le fil vivant : un message ajoute s'annonce poliment, sans voler le focus. Occupe\n       (`aria-busy`) pendant le chargement des precedents et leur insertion en tete : ils ne\n       s'annoncent pas comme nouveaux ; leur nombre se dit une fois, hors du fil (D-19). -->\n  <section\n    class=\"st-message-thread__liste\"\n    role=\"log\"\n    [attr.aria-label]=\"etiquette()\"\n    [attr.aria-busy]=\"occupe() ? 'true' : null\"\n  >\n    @for (jour of jours(); track jour.jour) {\n      <ng-container *ngTemplateOutlet=\"jourDuFil; context: { $implicit: jour }\" />\n      @for (message of jour.messages; track message.id) {\n        <st-message [message]=\"message\" (reessai)=\"reessai.emit($event)\" />\n      }\n    }\n  </section>\n}\n<span class=\"st-vh\" aria-live=\"polite\" [attr.lang]=\"langueDeRepli()\">{{ 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:flex;flex-direction:column;gap:var(--st-espacement-3);min-inline-size:0}.st-message-thread__precedents{display:flex;justify-content:center}.st-message-thread__liste{display:flex;flex-direction:column;gap:var(--st-espacement-3);padding:0;margin:0;list-style:none}.st-message-thread__element{display:flex;flex-direction:column;gap:var(--st-espacement-3)}.st-message-thread__jour{font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);font-weight:var(--st-graisse-moyenne);letter-spacing:var(--st-interlettrage-large);display:flex;gap:var(--st-espacement-3);align-items:center;margin:var(--st-espacement-2) 0 0;color:var(--st-couleur-texte-discret)}.st-message-thread__jour:before,.st-message-thread__jour:after{flex:1;block-size:var(--st-epaisseur-capillaire);content:\"\";background:var(--st-couleur-bordure)}@media(forced-colors:active){.st-message-thread__jour:before,.st-message-thread__jour:after{background:CanvasText}}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		etiquette: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etiquette",
+				required: true
+			}]
+		}],
+		messages: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "messages",
+				required: true
+			}]
+		}],
+		fige: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "fige",
+				required: false
+			}]
+		}],
+		precedents: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "precedents",
+				required: false
+			}]
+		}],
+		chargementDesPrecedents: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "chargementDesPrecedents",
+				required: false
+			}]
+		}],
+		chargerPrecedents: [{
+			type: i0.Output,
+			args: ["chargerPrecedents"]
+		}],
+		reessai: [{
+			type: i0.Output,
+			args: ["reessai"]
+		}]
+	}
+});
+var StMessageComposer = class StMessageComposer {
+	catalogue = catalogueDeLaMessagerie();
+	libelles = computed(() => this.catalogue().libelles, ...ngDevMode ? [{ debugName: "libelles" }] : 	/* istanbul ignore next */ []);
+	langueDeRepli = computed(() => this.catalogue().langueDeRepli, ...ngDevMode ? [{ debugName: "langueDeRepli" }] : 	/* istanbul ignore next */ []);
+	etiquette = input(null, ...ngDevMode ? [{ debugName: "etiquette" }] : 	/* istanbul ignore next */ []);
+	piecesJointes = input("", ...ngDevMode ? [{ debugName: "piecesJointes" }] : 	/* istanbul ignore next */ []);
+	tailleMax = input(null, ...ngDevMode ? [{ debugName: "tailleMax" }] : 	/* istanbul ignore next */ []);
+	envoiEnCours = input(false, {
+		...ngDevMode ? { debugName: "envoiEnCours" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	envoi = output();
+	texte = signal("", ...ngDevMode ? [{ debugName: "texte" }] : 	/* istanbul ignore next */ []);
+	fichiers = signal([], ...ngDevMode ? [{ debugName: "fichiers" }] : 	/* istanbul ignore next */ []);
+	nom = computed(() => this.etiquette() ?? this.libelles().votreMessage, ...ngDevMode ? [{ debugName: "nom" }] : 	/* istanbul ignore next */ []);
+	vide = computed(() => this.texte().trim() === "" && this.fichiers().length === 0, ...ngDevMode ? [{ debugName: "vide" }] : 	/* istanbul ignore next */ []);
+	envoyer(evenement) {
+		evenement?.preventDefault();
+		if (this.vide() || this.envoiEnCours()) return;
+		this.envoi.emit({
+			texte: this.texte().trim(),
+			fichiers: this.fichiers()
+		});
+		this.texte.set("");
+		this.fichiers.set([]);
+	}
+	auClavier(evenement) {
+		if (evenement.key === "Enter" && (evenement.ctrlKey || evenement.metaKey)) this.envoyer(evenement);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StMessageComposer,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: StMessageComposer,
+		isStandalone: true,
+		selector: "st-message-composer",
+		inputs: {
+			etiquette: {
+				classPropertyName: "etiquette",
+				publicName: "etiquette",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			piecesJointes: {
+				classPropertyName: "piecesJointes",
+				publicName: "piecesJointes",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			tailleMax: {
+				classPropertyName: "tailleMax",
+				publicName: "tailleMax",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			envoiEnCours: {
+				classPropertyName: "envoiEnCours",
+				publicName: "envoiEnCours",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { envoi: "envoi" },
+		host: { classAttribute: "st-message-composer" },
+		ngImport: i0,
+		template: "<form class=\"st-message-composer__formulaire\" (submit)=\"envoyer($event)\">\n  <st-textarea\n    [libelle]=\"nom()\"\n    [aide]=\"libelles().raccourciDEnvoi\"\n    [lignes]=\"3\"\n    [(value)]=\"texte\"\n    (keydown)=\"auClavier($event)\"\n  />\n  @if (piecesJointes() !== '') {\n    <st-file-upload\n      multiple\n      [libelle]=\"libelles().joindreDesFichiers\"\n      [accept]=\"piecesJointes()\"\n      [tailleMax]=\"tailleMax()\"\n      [(value)]=\"fichiers\"\n    />\n  }\n  <st-form-actions disposition=\"pied\">\n    <!-- `lang` : « Envoyer » vient seul du catalogue (D-29) ; jamais sur la zone de saisie. -->\n    <button\n      stButton\n      type=\"submit\"\n      variante=\"primaire\"\n      iconeApres=\"envoyer\"\n      [attr.lang]=\"langueDeRepli()\"\n      [indisponible]=\"vide()\"\n      [chargement]=\"envoiEnCours()\"\n    >\n      {{ libelles().envoyer }}\n    </button>\n  </st-form-actions>\n</form>\n",
+		styles: [".st-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host([hidden]){display:none!important}:host{display:block;min-inline-size:0}.st-message-composer__formulaire{display:flex;flex-direction:column;gap:var(--st-espacement-3)}\n"],
+		dependencies: [
+			{
+				kind: "component",
+				type: StButton,
+				selector: "button[stButton]",
+				inputs: [
+					"variante",
+					"taille",
+					"pleineLargeur",
+					"iconeAvant",
+					"iconeApres",
+					"chargement",
+					"indisponible",
+					"raisonIndisponible"
+				]
+			},
+			{
+				kind: "component",
+				type: StFileUpload,
+				selector: "st-file-upload",
+				inputs: [
+					"value",
+					"accept",
+					"multiple",
+					"tailleMax",
+					"nombreMax",
+					"libelleDuChoix",
+					"etats"
+				],
+				outputs: [
+					"valueChange",
+					"annulation",
+					"remplacement"
+				]
+			},
+			{
+				kind: "component",
+				type: StFormActions,
+				selector: "st-form-actions",
+				inputs: ["disposition"]
+			},
+			{
+				kind: "component",
+				type: StTextarea,
+				selector: "st-textarea",
+				inputs: ["lignes", "lignesMax"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StMessageComposer,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-message-composer",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				StButton,
+				StFileUpload,
+				StFormActions,
+				StTextarea
+			],
+			host: { class: "st-message-composer" },
+			template: "<form class=\"st-message-composer__formulaire\" (submit)=\"envoyer($event)\">\n  <st-textarea\n    [libelle]=\"nom()\"\n    [aide]=\"libelles().raccourciDEnvoi\"\n    [lignes]=\"3\"\n    [(value)]=\"texte\"\n    (keydown)=\"auClavier($event)\"\n  />\n  @if (piecesJointes() !== '') {\n    <st-file-upload\n      multiple\n      [libelle]=\"libelles().joindreDesFichiers\"\n      [accept]=\"piecesJointes()\"\n      [tailleMax]=\"tailleMax()\"\n      [(value)]=\"fichiers\"\n    />\n  }\n  <st-form-actions disposition=\"pied\">\n    <!-- `lang` : « Envoyer » vient seul du catalogue (D-29) ; jamais sur la zone de saisie. -->\n    <button\n      stButton\n      type=\"submit\"\n      variante=\"primaire\"\n      iconeApres=\"envoyer\"\n      [attr.lang]=\"langueDeRepli()\"\n      [indisponible]=\"vide()\"\n      [chargement]=\"envoiEnCours()\"\n    >\n      {{ libelles().envoyer }}\n    </button>\n  </st-form-actions>\n</form>\n",
+			styles: [".st-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host([hidden]){display:none!important}:host{display:block;min-inline-size:0}.st-message-composer__formulaire{display:flex;flex-direction:column;gap:var(--st-espacement-3)}\n"]
+		}]
+	}],
+	propDecorators: {
+		etiquette: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "etiquette",
+				required: false
+			}]
+		}],
+		piecesJointes: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "piecesJointes",
+				required: false
+			}]
+		}],
+		tailleMax: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tailleMax",
+				required: false
+			}]
+		}],
+		envoiEnCours: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "envoiEnCours",
+				required: false
+			}]
+		}],
+		envoi: [{
+			type: i0.Output,
+			args: ["envoi"]
+		}]
+	}
+});
+export { LIBELLES_MESSAGERIE_EN, LIBELLES_MESSAGERIE_FR, ST_LIBELLES_MESSAGERIE, StMessage, StMessageComposer, StMessageThread, catalogueDeLaMessagerie, fournirLibellesMessagerie, libellesDeLaMessagerie };
+
+//# sourceMappingURL=starterlib-ui-messagerie.mjs.map