@starterlib/ui 0.9.0 → 0.10.0

package/fesm2022/starterlib-ui-saisie.mjs

@@ -1,9 +1,11 @@
-import { ADRESSE_VIDE, CODES_DES_PAYS, adresseEstVide, ajouterJours, ajouterMois, bornerDate, codePostalValide, decimalesDe, estDateIso, estHeureIso, exempleDHeure, formatDAdresse, formaterDateLongue, formaterDateSaisie, formaterHeureSaisie, formaterIban, formaterMontant, formaterNombre, formaterTaille, ibanEstValide, jourDeLaSemaine, listeDesPays, masquerIban, montant, motifDHeure, motifDeDate, nomAffichable, nomDuPays, normaliserCodeDePays, normaliserCodePostal, normaliserIban, normaliserTelephone, partiesAffichees, partiesExigees, premierJourDeLaSemaine, regionReconnue, sansCommandesDeDirection, semainesDuMois, texteDUneLigne, typeDeFichierAccepte } from "@starterlib/util";
+import { ADRESSE_VIDE, CODES_DES_PAYS, adresseEstVide, ajouterJours, ajouterMois, bornerDate, codePostalValide, decimalesDe, estDateIso, estHeureIso, exempleDHeure, formatDAdresse, formaterDateLongue, formaterDateSaisie, formaterHeureSaisie, formaterIban, formaterMontant, formaterNombre, formaterTaille, ibanEstValide, jourDeLaSemaine, listeDesPays, masquerIban, montant, motifDHeure, motifDeDate, nomAffichable, nomDuPays, normaliserCodeDePays, normaliserCodePostal, normaliserIban, normaliserTelephone, partiesAffichees, partiesExigees, premierJourDeLaSemaine, regionReconnue, semainesDuMois, typeDeFichierAccepte } from "@starterlib/util/valeurs";
 import * as i0 from "@angular/core";
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, DOCUMENT, DestroyRef, Directive, ElementRef, Injectable, InjectionToken, Injector, afterEveryRender, afterNextRender, afterRenderEffect, booleanAttribute, computed, contentChild, contentChildren, effect, inject, input, isDevMode, linkedSignal, model, numberAttribute, output, resource, signal, untracked, viewChild, viewChildren } from "@angular/core";
-import { AnnonceLocale, FUSEAU_PAR_DEFAUT, ST_CHAMP_A_ETIQUETTES, ST_LIBELLES, ST_LISTES_D_ADRESSES, ST_LOCALE, StButton, StIcon, StIconButton, StIdentifiants, StInlineMessage, StProgress, StSpinner, StTagGroup, affichageDiffere } from "@starterlib/ui";
+import { AnnonceLocale, FUSEAU_PAR_DEFAUT, ST_LIBELLES, ST_LISTES_D_ADRESSES, ST_LOCALE, StButton, StIcon, StIconButton, StIdentifiants, StInlineMessage, StProgress, StSpinner, affichageDiffere } from "@starterlib/ui";
 import { DOCUMENT as DOCUMENT$1 } from "@angular/common";
 import { tenue } from "@starterlib/tokens";
+import { sansCommandesDeDirection, texteDUneLigne } from "@starterlib/util";
+import { ST_CHAMP_A_ETIQUETTES, StTagGroup } from "@starterlib/ui/indicateurs";
 function messageDErreur(erreur, libelles, locale = "fr-FR") {
 	const fourni = erreur.message?.trim();
 	if (fourni !== void 0 && fourni !== "") return fourni;
@@ -8604,6 +8606,132 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { ContratDeCase, ContratDeChamp, ContratDeChampABornes, ControleDeSaisie, ST_CHAMP_D_ADRESSE, ST_ETAT_D_ENVOI, StAddressFieldset, StCalendar, StCheckbox, StCheckboxGroup, StChoice, StChoiceGroup, StChoiceMatrix, StConsentGroup, StConsentRow, StControleDeChamp, StCountryField, StErrorSummary, StFieldset, StFileUpload, StFormField, StFormRow, StIbanField, StInput, StOtpField, StPasswordField, StRadioGroup, StSearchField, StSelect, StSwitch, StTagInput, StTextarea, cleDeFichier, erreurCode, erreurDate, erreurHeure, erreurIban, erreurPays, erreurPlageDeDates, erreurTelephone, erreursDAdresse, erreursDeFichiers, exempleDeDate, filtrerOptions, fusionnerErreurs, groupesDOptions, libelleDePartie, messageDErreur, motifDHeureLocal, motifLocal, normaliserPourRecherche, optionsDesPays };
+var StFormActions = class StFormActions {
+	disposition = input("collee", ...ngDevMode ? [{ debugName: "disposition" }] : 	/* istanbul ignore next */ []);
+	collee = signal(false, ...ngDevMode ? [{ debugName: "collee" }] : 	/* istanbul ignore next */ []);
+	constructor() {
+		const element = inject(ElementRef).nativeElement;
+		const document = inject(DOCUMENT$1);
+		let arreter = () => void 0;
+		afterNextRender(() => {
+			if (isDevMode()) avertirDesEnvoisMultiples(element);
+			if (this.disposition() === "collee") arreter = this.suivreLaBarre(element, document);
+		});
+		inject(DestroyRef).onDestroy(() => {
+			arreter();
+		});
+	}
+	suivreLaBarre(element, document) {
+		const fenetre = document.defaultView;
+		const Intersection = fenetre?.IntersectionObserver;
+		const Taille = fenetre?.ResizeObserver;
+		if (fenetre === null || Intersection === void 0) return () => void 0;
+		const conteneur = conteneurDeDefilement(element, fenetre);
+		const cible = conteneur ?? document.documentElement;
+		const decalage = Number.parseFloat(fenetre.getComputedStyle(element).bottom) || 0;
+		const intersection = new Intersection(([entree]) => {
+			if (entree === void 0) return;
+			const bas = entree.rootBounds?.bottom ?? fenetre.innerHeight;
+			this.collee.set(entree.isIntersecting && entree.intersectionRatio < 1 && entree.boundingClientRect.bottom > bas);
+		}, {
+			root: conteneur,
+			rootMargin: `0px 0px -${String(decalage + 1)}px 0px`,
+			threshold: [0, 1]
+		});
+		intersection.observe(element);
+		let taille = null;
+		if (Taille !== void 0) {
+			taille = new Taille((entrees) => {
+				const hauteur = entrees[0]?.borderBoxSize[0]?.blockSize ?? element.getBoundingClientRect().height;
+				const recouvert = `${String(Math.ceil(hauteur + decalage))}px`;
+				cible.style.setProperty(PROPRIETE_HAUTEUR, recouvert);
+				cible.style.setProperty("scroll-padding-block-end", recouvert);
+			});
+			taille.observe(element);
+		}
+		return () => {
+			intersection.disconnect();
+			taille?.disconnect();
+			cible.style.removeProperty(PROPRIETE_HAUTEUR);
+			cible.style.removeProperty("scroll-padding-block-end");
+		};
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: StFormActions,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: StFormActions,
+		isStandalone: true,
+		selector: "st-form-actions",
+		inputs: { disposition: {
+			classPropertyName: "disposition",
+			publicName: "disposition",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		host: {
+			properties: {
+				"attr.data-disposition": "disposition()",
+				"attr.data-collee": "collee() ? \"\" : null"
+			},
+			classAttribute: "st-form-actions"
+		},
+		ngImport: i0,
+		template: "<div class=\"st-form-actions__cadre\">\n  <div class=\"st-form-actions__debut\"><ng-content select=\"[debut]\" /></div>\n  <div class=\"st-form-actions__aide\"><ng-content select=\"[aide]\" /></div>\n  <div class=\"st-form-actions__fin\"><ng-content /></div>\n</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:block;container-type:inline-size;margin-block-start:var(--st-espacement-4)}:host([data-disposition=collee]){position:sticky;inset-block-end:calc(var(--st-espacement-4) + env(safe-area-inset-bottom,0px));z-index:var(--st-plan-contenu-eleve);margin-block-start:var(--st-espacement-8);padding:var(--st-espacement-4);background:var(--st-couleur-surface);border:var(--st-epaisseur-moyenne) solid var(--st-couleur-surface-active);border-radius:var(--st-rayon-lg);box-shadow:var(--st-ombre-surelevee)}:host([data-disposition=collee][data-collee]){box-shadow:var(--st-ombre-flottante)}.st-form-actions__cadre,.st-form-actions__debut,.st-form-actions__fin{display:flex;flex-direction:column;align-items:stretch;gap:var(--st-espacement-1)}.st-form-actions__aide{display:flex;align-items:center;gap:var(--st-espacement-1-5);font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);color:var(--st-couleur-texte-discret)}.st-form-actions__debut:empty,.st-form-actions__aide:empty,.st-form-actions__fin:empty{display:none}@container (min-width: 30rem){.st-form-actions__cadre,.st-form-actions__debut,.st-form-actions__fin{flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--st-espacement-3)}.st-form-actions__fin{justify-content:flex-end;margin-inline-start:auto}}@media print{:host([data-disposition=collee]){position:static}}@media(forced-colors:active){:host([data-disposition=collee]){border-color:CanvasText}}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: StFormActions,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "st-form-actions",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				class: "st-form-actions",
+				"[attr.data-disposition]": "disposition()",
+				"[attr.data-collee]": "collee() ? \"\" : null"
+			},
+			template: "<div class=\"st-form-actions__cadre\">\n  <div class=\"st-form-actions__debut\"><ng-content select=\"[debut]\" /></div>\n  <div class=\"st-form-actions__aide\"><ng-content select=\"[aide]\" /></div>\n  <div class=\"st-form-actions__fin\"><ng-content /></div>\n</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:block;container-type:inline-size;margin-block-start:var(--st-espacement-4)}:host([data-disposition=collee]){position:sticky;inset-block-end:calc(var(--st-espacement-4) + env(safe-area-inset-bottom,0px));z-index:var(--st-plan-contenu-eleve);margin-block-start:var(--st-espacement-8);padding:var(--st-espacement-4);background:var(--st-couleur-surface);border:var(--st-epaisseur-moyenne) solid var(--st-couleur-surface-active);border-radius:var(--st-rayon-lg);box-shadow:var(--st-ombre-surelevee)}:host([data-disposition=collee][data-collee]){box-shadow:var(--st-ombre-flottante)}.st-form-actions__cadre,.st-form-actions__debut,.st-form-actions__fin{display:flex;flex-direction:column;align-items:stretch;gap:var(--st-espacement-1)}.st-form-actions__aide{display:flex;align-items:center;gap:var(--st-espacement-1-5);font-size:var(--st-taille-xs);line-height:var(--st-interligne-xs);color:var(--st-couleur-texte-discret)}.st-form-actions__debut:empty,.st-form-actions__aide:empty,.st-form-actions__fin:empty{display:none}@container (min-width: 30rem){.st-form-actions__cadre,.st-form-actions__debut,.st-form-actions__fin{flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--st-espacement-3)}.st-form-actions__fin{justify-content:flex-end;margin-inline-start:auto}}@media print{:host([data-disposition=collee]){position:static}}@media(forced-colors:active){:host([data-disposition=collee]){border-color:CanvasText}}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: { disposition: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "disposition",
+			required: false
+		}]
+	}] }
+});
+const PROPRIETE_HAUTEUR = "--st-form-actions-hauteur";
+function conteneurDeDefilement(element, fenetre) {
+	for (let parent = element.parentElement; parent !== null; parent = parent.parentElement) {
+		if (parent === element.ownerDocument.body) return null;
+		const { overflowY } = fenetre.getComputedStyle(parent);
+		if (overflowY === "auto" || overflowY === "scroll" || overflowY === "overlay") return parent;
+	}
+	return null;
+}
+function avertirDesEnvoisMultiples(element) {
+	const envois = element.querySelectorAll("button[type=\"submit\"], input[type=\"submit\"]").length;
+	if (envois > 1) console.warn(`[st-form-actions] ${String(envois)} boutons d'envoi : un formulaire n'a qu'une action principale, et Entree dans un champ declenche la premiere.`);
+}
+export { ContratDeCase, ContratDeChamp, ContratDeChampABornes, ControleDeSaisie, ST_CHAMP_D_ADRESSE, ST_ETAT_D_ENVOI, StAddressFieldset, StCalendar, StCheckbox, StCheckboxGroup, StChoice, StChoiceGroup, StChoiceMatrix, StConsentGroup, StConsentRow, StControleDeChamp, StCountryField, StErrorSummary, StFieldset, StFileUpload, StFormActions, StFormField, StFormRow, StIbanField, StInput, StOtpField, StPasswordField, StRadioGroup, StSearchField, StSelect, StSwitch, StTagInput, StTextarea, cleDeFichier, erreurCode, erreurDate, erreurHeure, erreurIban, erreurPays, erreurPlageDeDates, erreurTelephone, erreursDAdresse, erreursDeFichiers, exempleDeDate, filtrerOptions, fusionnerErreurs, groupesDOptions, libelleDePartie, messageDErreur, motifDHeureLocal, motifLocal, normaliserPourRecherche, optionsDesPays };
 
 //# sourceMappingURL=starterlib-ui-saisie.mjs.map