@starterlib/ui 0.7.2 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +95 -42
- package/fesm2022/starterlib-ui-arbre.mjs +82 -0
- package/fesm2022/starterlib-ui-arbre.mjs.map +1 -0
- package/fesm2022/starterlib-ui-donnees.mjs +532 -0
- package/fesm2022/starterlib-ui-donnees.mjs.map +1 -0
- package/fesm2022/starterlib-ui-formulaires.mjs +2 -1
- package/fesm2022/starterlib-ui-formulaires.mjs.map +1 -1
- package/fesm2022/starterlib-ui-interactions.mjs +34 -589
- package/fesm2022/starterlib-ui-interactions.mjs.map +1 -1
- package/fesm2022/starterlib-ui-libelles-en.mjs +142 -0
- package/fesm2022/starterlib-ui-libelles-en.mjs.map +1 -0
- package/fesm2022/starterlib-ui-listes.mjs +671 -0
- package/fesm2022/starterlib-ui-listes.mjs.map +1 -0
- package/fesm2022/starterlib-ui-navigation.mjs +246 -0
- package/fesm2022/starterlib-ui-navigation.mjs.map +1 -0
- package/fesm2022/starterlib-ui-onglets.mjs +137 -0
- package/fesm2022/starterlib-ui-onglets.mjs.map +1 -0
- package/fesm2022/starterlib-ui-saisie.mjs +1632 -0
- package/fesm2022/starterlib-ui-saisie.mjs.map +1 -0
- package/fesm2022/starterlib-ui-selection.mjs +269 -0
- package/fesm2022/starterlib-ui-selection.mjs.map +1 -0
- package/fesm2022/starterlib-ui.mjs +105 -2931
- package/fesm2022/starterlib-ui.mjs.map +1 -1
- package/package.json +35 -3
- package/types/starterlib-ui-arbre.d.ts +51 -0
- package/types/starterlib-ui-donnees.d.ts +228 -0
- package/types/starterlib-ui-formulaires.d.ts +5 -4
- package/types/starterlib-ui-interactions.d.ts +4 -316
- package/types/starterlib-ui-libelles-en.d.ts +25 -0
- package/types/starterlib-ui-listes.d.ts +432 -0
- package/types/starterlib-ui-navigation.d.ts +104 -0
- package/types/starterlib-ui-onglets.d.ts +89 -0
- package/types/starterlib-ui-saisie.d.ts +924 -0
- package/types/starterlib-ui-selection.d.ts +112 -0
- package/types/starterlib-ui.d.ts +9 -1575
package/types/starterlib-ui.d.ts
CHANGED
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
|
-
import { InjectionToken, Signal, Provider, DestroyRef,
|
|
3
|
-
import { Ton,
|
|
2
|
+
import { InjectionToken, Signal, Provider, DestroyRef, Resource, TemplateRef } from '@angular/core';
|
|
3
|
+
import { Ton, TonSemantique, ChoixDeTheme, Langue, EtatDeBloc } from '@starterlib/util';
|
|
4
4
|
export { ETATS_DE_BLOC, EtatDeBloc } from '@starterlib/util';
|
|
5
5
|
import * as i1 from '@angular/router';
|
|
6
|
-
import { ValidationError, FormValueControl, FormCheckboxControl } from '@angular/forms/signals';
|
|
7
|
-
import * as _starterlib_ui from '@starterlib/ui';
|
|
8
6
|
|
|
9
7
|
/**
|
|
10
8
|
* Les textes que les composants portent eux-memes.
|
|
@@ -183,8 +181,6 @@ interface LibellesUi {
|
|
|
183
181
|
* l'apostrophe typographique, pour garder la source en ASCII.
|
|
184
182
|
*/
|
|
185
183
|
declare const LIBELLES_FR: LibellesUi;
|
|
186
|
-
/** Traduction anglaise du meme dictionnaire. La paire est obligatoire. */
|
|
187
|
-
declare const LIBELLES_EN: LibellesUi;
|
|
188
184
|
|
|
189
185
|
/**
|
|
190
186
|
* Locale de formatage des montants, des dates et des nombres, **sous forme de
|
|
@@ -716,228 +712,6 @@ declare class StCode {
|
|
|
716
712
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StCode, "st-code", never, { "valeur": { "alias": "valeur"; "required": true; "isSignal": true; }; "copiable": { "alias": "copiable"; "required": false; "isSignal": true; }; "etiquette": { "alias": "etiquette"; "required": false; "isSignal": true; }; "libelleCopier": { "alias": "libelleCopier"; "required": false; "isSignal": true; }; "messageDeConfirmation": { "alias": "messageDeConfirmation"; "required": false; "isSignal": true; }; }, { "copie": "copie"; }, never, never, true, never>;
|
|
717
713
|
}
|
|
718
714
|
|
|
719
|
-
type TypeMasque = 'iban' | 'carte' | 'telephone';
|
|
720
|
-
/**
|
|
721
|
-
* Identifiant sensible, masque par defaut.
|
|
722
|
-
*
|
|
723
|
-
* ⚠️ La valeur masquee porte un `aria-label` en toutes lettres (« IBAN se
|
|
724
|
-
* terminant par 2606 ») : plusieurs lecteurs d'ecran epellent une suite de
|
|
725
|
-
* puces caractere par caractere, ce qui est a la fois illisible et interminable.
|
|
726
|
-
*
|
|
727
|
-
* La revelation est un EVENEMENT METIER : elle se journalise cote appelant par
|
|
728
|
-
* la sortie `revelation`. La valeur revelee, elle, ne part jamais dans un
|
|
729
|
-
* journal.
|
|
730
|
-
*/
|
|
731
|
-
declare class StMasked {
|
|
732
|
-
private readonly libelles;
|
|
733
|
-
readonly valeur: _angular_core.InputSignal<string>;
|
|
734
|
-
readonly type: _angular_core.InputSignal<TypeMasque>;
|
|
735
|
-
readonly revele: _angular_core.ModelSignal<boolean>;
|
|
736
|
-
readonly revelationAutorisee: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
737
|
-
readonly dureeDeRevelationEnSecondes: _angular_core.InputSignal<number>;
|
|
738
|
-
/** `null` : les textes viennent du dictionnaire de l'application. */
|
|
739
|
-
readonly libelleAfficher: _angular_core.InputSignal<string | null>;
|
|
740
|
-
readonly libelleMasquer: _angular_core.InputSignal<string | null>;
|
|
741
|
-
readonly revelation: _angular_core.OutputEmitterRef<{
|
|
742
|
-
type: TypeMasque;
|
|
743
|
-
}>;
|
|
744
|
-
/**
|
|
745
|
-
* ⚠️ Par `AnnonceLocale`, et non par un signal pose directement. La 0.2.0
|
|
746
|
-
* reposait « Valeur masquee a nouveau » a l'identique : aucune mutation, donc
|
|
747
|
-
* une seconde remise en masque jamais annoncee.
|
|
748
|
-
*/
|
|
749
|
-
protected readonly annonce: AnnonceLocale;
|
|
750
|
-
private minuterie;
|
|
751
|
-
constructor();
|
|
752
|
-
protected readonly valeurMasquee: _angular_core.Signal<string>;
|
|
753
|
-
protected readonly valeurAffichee: _angular_core.Signal<string>;
|
|
754
|
-
/**
|
|
755
|
-
* La nature et la tournure viennent du dictionnaire : l'ordre des mots change
|
|
756
|
-
* d'une langue a l'autre, « IBAN se terminant par 2606 » contre « IBAN ending
|
|
757
|
-
* in 2606 ». Une chaine a trous ne suffirait pas.
|
|
758
|
-
*/
|
|
759
|
-
protected readonly nomAccessible: _angular_core.Signal<string>;
|
|
760
|
-
protected readonly libelleDuBouton: _angular_core.Signal<string>;
|
|
761
|
-
private valeurLisible;
|
|
762
|
-
protected basculer(): void;
|
|
763
|
-
private masquer;
|
|
764
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StMasked, never>;
|
|
765
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StMasked, "st-masked", never, { "valeur": { "alias": "valeur"; "required": true; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "revele": { "alias": "revele"; "required": false; "isSignal": true; }; "revelationAutorisee": { "alias": "revelationAutorisee"; "required": false; "isSignal": true; }; "dureeDeRevelationEnSecondes": { "alias": "dureeDeRevelationEnSecondes"; "required": false; "isSignal": true; }; "libelleAfficher": { "alias": "libelleAfficher"; "required": false; "isSignal": true; }; "libelleMasquer": { "alias": "libelleMasquer"; "required": false; "isSignal": true; }; }, { "revele": "reveleChange"; "revelation": "revelation"; }, never, never, true, never>;
|
|
766
|
-
}
|
|
767
|
-
|
|
768
|
-
/**
|
|
769
|
-
* Somme d'argent.
|
|
770
|
-
*
|
|
771
|
-
* Le montant entre sous forme d'unites mineures entieres : un nombre a virgule
|
|
772
|
-
* flottante ne represente pas exactement 0,10 EUR, et les erreurs s'accumulent.
|
|
773
|
-
* La conversion n'a lieu qu'a l'instant du rendu.
|
|
774
|
-
*
|
|
775
|
-
* ⚠️ Le signe negatif est TOUJOURS rendu en texte. La couleur ne fait que le
|
|
776
|
-
* renforcer : un daltonien, une impression en noir et blanc ou un theme a fort
|
|
777
|
-
* contraste ne doivent jamais transformer un debit en credit.
|
|
778
|
-
*/
|
|
779
|
-
declare class StMoney {
|
|
780
|
-
private readonly locale;
|
|
781
|
-
readonly valeur: _angular_core.InputSignal<Montant>;
|
|
782
|
-
readonly signeExplicite: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
783
|
-
readonly sansDevise: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
784
|
-
readonly taille: _angular_core.InputSignal<"sm" | "md" | "lg" | "xl">;
|
|
785
|
-
protected readonly signe: _angular_core.Signal<"negatif" | "positif" | "nul">;
|
|
786
|
-
protected readonly texte: _angular_core.Signal<string>;
|
|
787
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StMoney, never>;
|
|
788
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StMoney, "st-money", never, { "valeur": { "alias": "valeur"; "required": true; "isSignal": true; }; "signeExplicite": { "alias": "signeExplicite"; "required": false; "isSignal": true; }; "sansDevise": { "alias": "sansDevise"; "required": false; "isSignal": true; }; "taille": { "alias": "taille"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
789
|
-
}
|
|
790
|
-
|
|
791
|
-
type FormatDeDate = 'court' | 'long' | 'date-heure' | 'heure';
|
|
792
|
-
/**
|
|
793
|
-
* Date rendue dans la locale et le fuseau de l'application.
|
|
794
|
-
*
|
|
795
|
-
* ⚠️ La locale et le fuseau sont EXPLICITES, jamais deduits de l'environnement
|
|
796
|
-
* d'execution. Un rendu serveur et un rendu navigateur qui ne s'accordent pas
|
|
797
|
-
* produisent deux textes differents, et l'hydratation casse. Le rendu serveur
|
|
798
|
-
* est ecarte en version 1, mais la compatibilite reste gardee a cout nul.
|
|
799
|
-
*
|
|
800
|
-
* Le format court garde un nom accessible en toutes lettres : « 12/09/26 » est
|
|
801
|
-
* ambigu a l'oral, et l'ordre jour-mois n'est pas universel.
|
|
802
|
-
*/
|
|
803
|
-
declare class StDate {
|
|
804
|
-
private readonly locale;
|
|
805
|
-
private readonly fuseauParDefaut;
|
|
806
|
-
readonly valeur: _angular_core.InputSignal<string | Date>;
|
|
807
|
-
readonly format: _angular_core.InputSignal<FormatDeDate>;
|
|
808
|
-
readonly fuseau: _angular_core.InputSignal<string | null>;
|
|
809
|
-
/**
|
|
810
|
-
* Une DATE DE CALENDRIER (`2026-09-12`) n'est pas un instant : une date de
|
|
811
|
-
* naissance, une echeance ou un jour de valeur n'ont pas d'heure, et ne
|
|
812
|
-
* doivent pas changer de jour selon le fuseau de qui les regarde.
|
|
813
|
-
*
|
|
814
|
-
* ⚠️ Le piege est dans la norme : `new Date('2026-09-12')` vaut minuit UTC,
|
|
815
|
-
* donc le 11 septembre partout a l'ouest de Greenwich. Une echeance affichee
|
|
816
|
-
* la veille est un defaut que personne ne voit depuis l'Europe.
|
|
817
|
-
*/
|
|
818
|
-
private readonly estDateDeCalendrier;
|
|
819
|
-
private readonly date;
|
|
820
|
-
protected readonly estValide: _angular_core.Signal<boolean>;
|
|
821
|
-
/**
|
|
822
|
-
* Le fuseau de rendu. Pour une date de calendrier, c'est UTC : la valeur a
|
|
823
|
-
* ete construite a minuit UTC, la relire en UTC rend donc le jour ecrit.
|
|
824
|
-
*/
|
|
825
|
-
private readonly fuseauDeRendu;
|
|
826
|
-
/**
|
|
827
|
-
* Une date de calendrier porte `2026-09-12`, sans heure ni decalage : c'est
|
|
828
|
-
* la forme que la norme HTML attend, et la seule qui ne mente pas.
|
|
829
|
-
*/
|
|
830
|
-
protected readonly iso: _angular_core.Signal<string | null>;
|
|
831
|
-
/** Une date sans heure ne peut pas en afficher une. */
|
|
832
|
-
private readonly optionsDeFormat;
|
|
833
|
-
protected readonly texte: _angular_core.Signal<string>;
|
|
834
|
-
/** Forme longue, lue par les technologies d'assistance. */
|
|
835
|
-
protected readonly texteAccessible: _angular_core.Signal<string | null>;
|
|
836
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StDate, never>;
|
|
837
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StDate, "st-date", never, { "valeur": { "alias": "valeur"; "required": true; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; "fuseau": { "alias": "fuseau"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
838
|
-
}
|
|
839
|
-
|
|
840
|
-
/**
|
|
841
|
-
* Temps ecoule, exprime relativement (« il y a 5 minutes »).
|
|
842
|
-
*
|
|
843
|
-
* ⚠️ Ce composant ne doit JAMAIS etre place dans une region vivante : son texte
|
|
844
|
-
* se reecrit tout seul, et une region vivante le ferait annoncer en boucle.
|
|
845
|
-
* Son nom accessible porte la date absolue, qui elle ne bouge pas.
|
|
846
|
-
*
|
|
847
|
-
* La cadence de rafraichissement s'adapte : rafraichir chaque seconde une date
|
|
848
|
-
* vieille de trois jours reveille l'onglet pour rien.
|
|
849
|
-
*/
|
|
850
|
-
declare class StRelativeTime {
|
|
851
|
-
private readonly locale;
|
|
852
|
-
private readonly libelles;
|
|
853
|
-
private readonly fuseau;
|
|
854
|
-
readonly valeur: _angular_core.InputSignal<string | Date>;
|
|
855
|
-
readonly rafraichir: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
856
|
-
/** Au-dela de ce nombre de jours, la date absolue est plus parlante. */
|
|
857
|
-
readonly seuilAbsoluEnJours: _angular_core.InputSignal<number>;
|
|
858
|
-
private readonly destruction;
|
|
859
|
-
private readonly maintenant;
|
|
860
|
-
constructor();
|
|
861
|
-
private dateEnMillisecondes;
|
|
862
|
-
protected readonly estValide: _angular_core.Signal<boolean>;
|
|
863
|
-
protected readonly iso: _angular_core.Signal<string | null>;
|
|
864
|
-
protected readonly depasseLeSeuil: _angular_core.Signal<boolean>;
|
|
865
|
-
protected readonly texte: _angular_core.Signal<string>;
|
|
866
|
-
protected readonly texteAccessible: _angular_core.Signal<string>;
|
|
867
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StRelativeTime, never>;
|
|
868
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StRelativeTime, "st-relative-time", never, { "valeur": { "alias": "valeur"; "required": true; "isSignal": true; }; "rafraichir": { "alias": "rafraichir"; "required": false; "isSignal": true; }; "seuilAbsoluEnJours": { "alias": "seuilAbsoluEnJours"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
869
|
-
}
|
|
870
|
-
|
|
871
|
-
/**
|
|
872
|
-
* Nombre dans le flux du texte.
|
|
873
|
-
*
|
|
874
|
-
* Distinct de `st-badge`, qui est une pastille superposee a un autre element.
|
|
875
|
-
*
|
|
876
|
-
* ⚠️ Quand la valeur est abregee (« 1,2 k »), le nom accessible porte le nombre
|
|
877
|
-
* COMPLET : l'abreviation est une commodite visuelle, pas une perte
|
|
878
|
-
* d'information pour qui ecoute la page.
|
|
879
|
-
*/
|
|
880
|
-
declare class StCount {
|
|
881
|
-
private readonly locale;
|
|
882
|
-
readonly valeur: _angular_core.InputSignal<number>;
|
|
883
|
-
readonly ton: _angular_core.InputSignal<"neutre" | "discret">;
|
|
884
|
-
/** `null` : jamais d'abreviation. */
|
|
885
|
-
readonly abregerAuDela: _angular_core.InputSignal<number | null>;
|
|
886
|
-
protected readonly estAbrege: _angular_core.Signal<boolean>;
|
|
887
|
-
protected readonly texteComplet: _angular_core.Signal<string>;
|
|
888
|
-
protected readonly texte: _angular_core.Signal<string>;
|
|
889
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StCount, never>;
|
|
890
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StCount, "st-count", never, { "valeur": { "alias": "valeur"; "required": true; "isSignal": true; }; "ton": { "alias": "ton"; "required": false; "isSignal": true; }; "abregerAuDela": { "alias": "abregerAuDela"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
891
|
-
}
|
|
892
|
-
|
|
893
|
-
type SensDeTendance = 'hausse' | 'baisse' | 'stable';
|
|
894
|
-
/** La tendance d'un indicateur, decrite par l'appelant. Le texte est deja traduit. */
|
|
895
|
-
interface TendanceDeStat {
|
|
896
|
-
readonly sens: SensDeTendance;
|
|
897
|
-
/** Ce qui s'affiche a cote de la fleche : « +2,4 % sur un mois ». */
|
|
898
|
-
readonly texte: string;
|
|
899
|
-
/**
|
|
900
|
-
* ⚠️ Choisi par l'appelant, et non deduit du sens : une hausse des frais est
|
|
901
|
-
* un `danger`, une hausse de l'epargne un `succes`. Le socle ne sait pas
|
|
902
|
-
* lequel des deux il affiche.
|
|
903
|
-
*/
|
|
904
|
-
readonly ton?: TonSemantique;
|
|
905
|
-
}
|
|
906
|
-
/**
|
|
907
|
-
* Indicateur chiffre : un libelle, une valeur, et sa tendance.
|
|
908
|
-
*
|
|
909
|
-
* ```html
|
|
910
|
-
* <st-stat libelle="Solde disponible" [tendance]="{ sens: 'hausse', texte: '+2,4 % sur un mois', ton: 'succes' }">
|
|
911
|
-
* <st-money [valeur]="solde" />
|
|
912
|
-
* </st-stat>
|
|
913
|
-
* ```
|
|
914
|
-
*
|
|
915
|
-
* La valeur est PROJETEE : c'est `st-money`, `st-count` ou `st-date` qui la
|
|
916
|
-
* formate dans la langue courante, et le socle n'a pas a redire comment.
|
|
917
|
-
*
|
|
918
|
-
* ⚠️ **La tendance se lit par un texte ET une icone, jamais par la couleur
|
|
919
|
-
* seule.** Le texte de l'appelant porte deja le signe ; l'icone porte le sens ;
|
|
920
|
-
* et un mot lisible par lecteur seulement — « en hausse », « en baisse »,
|
|
921
|
-
* « stable » — precede le texte, parce qu'un lecteur d'ecran ne lit pas un
|
|
922
|
-
* chevron.
|
|
923
|
-
*
|
|
924
|
-
* Le libelle vient AVANT la valeur dans le document, comme dans une phrase :
|
|
925
|
-
* « Solde disponible, 1 234,50 € ». A l'ecran, il se pose au-dessus, en petit.
|
|
926
|
-
*/
|
|
927
|
-
declare class StStat {
|
|
928
|
-
private readonly libelles;
|
|
929
|
-
/** Texte visible, deja traduit. */
|
|
930
|
-
readonly libelle: _angular_core.InputSignal<string>;
|
|
931
|
-
readonly tendance: _angular_core.InputSignal<TendanceDeStat | null>;
|
|
932
|
-
/** Precision sous la valeur : la periode, la source. Jamais une information critique. */
|
|
933
|
-
readonly precision: _angular_core.InputSignal<string | null>;
|
|
934
|
-
protected readonly icone: _angular_core.Signal<"copie" | "boite-vide" | "calendrier" | "cercle" | "cercle-coche" | "cercle-croix" | "cercle-info" | "chevron-bas" | "chevron-droite" | "chevron-gauche" | "chevron-haut" | "coche" | "corbeille" | "croix" | "fichier" | "hors-ligne" | "lien-externe" | "menu" | "oeil" | "oeil-barre" | "plus" | "rafraichir" | "recherche" | "serveur" | "televerser" | "tri" | "triangle-alerte" | "utilisateur" | null>;
|
|
935
|
-
protected readonly tonDeTendance: _angular_core.Signal<TonSemantique>;
|
|
936
|
-
protected readonly sensLu: _angular_core.Signal<string>;
|
|
937
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StStat, never>;
|
|
938
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StStat, "st-stat", never, { "libelle": { "alias": "libelle"; "required": true; "isSignal": true; }; "tendance": { "alias": "tendance"; "required": false; "isSignal": true; }; "precision": { "alias": "precision"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
939
|
-
}
|
|
940
|
-
|
|
941
715
|
/**
|
|
942
716
|
* ⚠️ `primaire` et non « info » : les deux designaient deja la meme couleur
|
|
943
717
|
* d'accent, et rien ne distinguait un statut « info » d'un statut « primaire »
|
|
@@ -1470,10 +1244,11 @@ declare class StFooter {
|
|
|
1470
1244
|
* ```
|
|
1471
1245
|
*
|
|
1472
1246
|
* **Ou il vit, et pourquoi.** Dans le tronc, a cote de `st-breadcrumb` et non
|
|
1473
|
-
* dans `ui/
|
|
1474
|
-
*
|
|
1475
|
-
*
|
|
1476
|
-
*
|
|
1247
|
+
* dans `ui/navigation` avec `st-sidenav` : les points d'entree se decoupent par
|
|
1248
|
+
* pair lourd, et ce lien n'en traine aucun — `@angular/router` est deja exige
|
|
1249
|
+
* par le tronc. Une SPA qui rend sa navigation sans tiroir n'a pas a charger
|
|
1250
|
+
* l'observateur de rupture pour un lien. Et la coquille le PEINT : le second
|
|
1251
|
+
* critere de l'ADR 0031 le garde au tronc pour la meme raison.
|
|
1477
1252
|
*
|
|
1478
1253
|
* ⚠️ **L'etat actif est porte par `aria-current="page"`**, pose par le routeur,
|
|
1479
1254
|
* et c'est sur lui que la feuille se branche — jamais sur la seule couleur : le
|
|
@@ -1774,1347 +1549,6 @@ declare class StInlineMessage {
|
|
|
1774
1549
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StInlineMessage, "st-inline-message", never, { "ton": { "alias": "ton"; "required": false; "isSignal": true; }; "identifiant": { "alias": "identifiant"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1775
1550
|
}
|
|
1776
1551
|
|
|
1777
|
-
/**
|
|
1778
|
-
* Forme minimale d'une erreur de validation, telle que Signal Forms la rend :
|
|
1779
|
-
* un genre, et parfois un message.
|
|
1780
|
-
*
|
|
1781
|
-
* Structurelle, pour ne pas importer `@angular/forms` a l'execution (audit de la
|
|
1782
|
-
* vague 3, V3-1). Les proprietes propres a chaque genre — `minLength`, `max`… —
|
|
1783
|
-
* se lisent par leur nom.
|
|
1784
|
-
*/
|
|
1785
|
-
interface ErreurAffichable {
|
|
1786
|
-
readonly kind: string;
|
|
1787
|
-
readonly message?: string;
|
|
1788
|
-
}
|
|
1789
|
-
/**
|
|
1790
|
-
* Le texte d'une erreur, dans la langue courante.
|
|
1791
|
-
*
|
|
1792
|
-
* ⚠️ **Un `message` fourni l'emporte toujours.** Un validateur metier, ou une
|
|
1793
|
-
* erreur du serveur deja traduite, en sait plus que le genre : « IBAN d'un pays
|
|
1794
|
-
* non pris en charge » vaut mieux que « Le format n'est pas valide ».
|
|
1795
|
-
*
|
|
1796
|
-
* ⚠️ **Un genre inconnu rend un message generique, jamais le genre brut.**
|
|
1797
|
-
* Afficher `ibanChecksum` a une personne qui saisit un IBAN, c'est lui montrer le
|
|
1798
|
-
* code source.
|
|
1799
|
-
*
|
|
1800
|
-
* La locale sert aux messages qui citent un format, une date ou une taille : « au
|
|
1801
|
-
* format jj/mm/aaaa » n'est pas « mm/dd/yyyy ».
|
|
1802
|
-
*/
|
|
1803
|
-
declare function messageDErreur(erreur: ErreurAffichable, libelles: LibellesUi, locale?: string): string;
|
|
1804
|
-
/** Le motif a taper dans la langue courante : `jj/mm/aaaa`. */
|
|
1805
|
-
declare function motifLocal(libelles: LibellesUi, locale: string): string;
|
|
1806
|
-
/**
|
|
1807
|
-
* Un jour superieur a 12 : « 31/03/2026 » montre sans ambiguite ou va le jour,
|
|
1808
|
-
* ce que « 01/02/2026 » ne dit pas.
|
|
1809
|
-
*/
|
|
1810
|
-
declare function exempleDeDate(locale: string): string;
|
|
1811
|
-
/**
|
|
1812
|
-
* Erreur d'IBAN, a brancher sur un schema :
|
|
1813
|
-
*
|
|
1814
|
-
* ```ts
|
|
1815
|
-
* validate(chemin.iban, ({ value }) => erreurIban(value()));
|
|
1816
|
-
* ```
|
|
1817
|
-
*
|
|
1818
|
-
* Une fonction pure plutot qu'une regle toute faite : fournir la regle
|
|
1819
|
-
* importerait `validate` d'`@angular/forms` A L'EXECUTION, et le socle ne
|
|
1820
|
-
* l'importe que pour ses types (audit de la vague 3, V3-1).
|
|
1821
|
-
*
|
|
1822
|
-
* ⚠️ Confort de saisie, jamais controle (SEC-5) : le serveur revalide. Un champ
|
|
1823
|
-
* vide n'est pas « invalide » ici — c'est `required` qui le dit, avec le bon
|
|
1824
|
-
* message.
|
|
1825
|
-
*/
|
|
1826
|
-
declare function erreurIban(valeur: string): ErreurAffichable | null;
|
|
1827
|
-
/**
|
|
1828
|
-
* Erreur de FORME d'un numero de telephone : chiffres, `+` de tete facultatif,
|
|
1829
|
-
* de 4 a 15 chiffres — la longueur maximale d'un numero international (E.164).
|
|
1830
|
-
*
|
|
1831
|
-
* ```ts
|
|
1832
|
-
* validate(chemin.telephone, ({ value }) => erreurTelephone(value()));
|
|
1833
|
-
* ```
|
|
1834
|
-
*
|
|
1835
|
-
* ⚠️ Une forme valide ne dit pas que le numero existe : seul le serveur le sait.
|
|
1836
|
-
* Un champ vide n'est pas une erreur de forme : l'obligation est une autre regle.
|
|
1837
|
-
*/
|
|
1838
|
-
declare function erreurTelephone(valeur: string): ErreurAffichable | null;
|
|
1839
|
-
/** Bornes d'une date, en ISO. Absente : pas de borne. */
|
|
1840
|
-
interface BornesDeDate {
|
|
1841
|
-
readonly min?: DateIso | null;
|
|
1842
|
-
readonly max?: DateIso | null;
|
|
1843
|
-
}
|
|
1844
|
-
/**
|
|
1845
|
-
* Erreur de bornes d'une date, a brancher sur un schema :
|
|
1846
|
-
*
|
|
1847
|
-
* ```ts
|
|
1848
|
-
* validate(chemin.naissance, ({ value }) => erreurDate(value(), { max: aujourdHui }));
|
|
1849
|
-
* ```
|
|
1850
|
-
*
|
|
1851
|
-
* Les bornes du schema et celles passees au calendrier doivent etre les memes :
|
|
1852
|
-
* le calendrier grise, le schema refuse une date tapee a la main.
|
|
1853
|
-
*/
|
|
1854
|
-
declare function erreurDate(valeur: DateIso | null, bornes: BornesDeDate): ErreurAffichable | null;
|
|
1855
|
-
/** Une fin anterieure au debut. Une borne manquante n'est pas une erreur de plage. */
|
|
1856
|
-
declare function erreurPlageDeDates(plage: PlageDeDates): ErreurAffichable | null;
|
|
1857
|
-
/** Regles de `st-file-upload`, les memes que ses entrees. */
|
|
1858
|
-
interface ReglesDeFichiers {
|
|
1859
|
-
/** Attribut `accept` : `.pdf, image/*`. */
|
|
1860
|
-
readonly accept?: string;
|
|
1861
|
-
/** En octets. */
|
|
1862
|
-
readonly tailleMax?: number;
|
|
1863
|
-
readonly nombreMax?: number;
|
|
1864
|
-
}
|
|
1865
|
-
/**
|
|
1866
|
-
* Erreurs d'une liste de fichiers, une par fichier refuse, pour dire LEQUEL :
|
|
1867
|
-
*
|
|
1868
|
-
* ```ts
|
|
1869
|
-
* validate(chemin.pieces, ({ value }) => erreursDeFichiers(value(), regles));
|
|
1870
|
-
* ```
|
|
1871
|
-
*
|
|
1872
|
-
* ⚠️ Confort, jamais securite (SEC-5) : le type se deduit de l'extension, et le
|
|
1873
|
-
* serveur relit le contenu.
|
|
1874
|
-
*/
|
|
1875
|
-
declare function erreursDeFichiers(fichiers: readonly DescriptionDeFichier[], regles: ReglesDeFichiers): ErreurAffichable[];
|
|
1876
|
-
/**
|
|
1877
|
-
* Erreurs a afficher par un champ qui LIT sa saisie (`transformedValue`) : celles
|
|
1878
|
-
* du formulaire, plus les erreurs de lecture qu'il ne connait pas encore.
|
|
1879
|
-
*
|
|
1880
|
-
* ⚠️ Relie a un formulaire, un champ recoit ses erreurs de lecture DANS `errors`,
|
|
1881
|
-
* par Signal Forms. Employe seul, par `[(value)]`, il ne les recoit nulle part :
|
|
1882
|
-
* sans cette fusion, « 12,5,3 » s'afficherait sans le moindre message. Une erreur
|
|
1883
|
-
* deja presente — meme genre, meme partie — n'est pas repetee.
|
|
1884
|
-
*/
|
|
1885
|
-
declare function fusionnerErreurs(formulaire: readonly ValidationError.WithOptionalFieldTree[], lecture: readonly ValidationError.WithoutFieldTree[]): readonly ErreurAffichable[];
|
|
1886
|
-
|
|
1887
|
-
/** Elements natifs qui portent la saisie d'un champ du socle. */
|
|
1888
|
-
type ElementDeSaisie = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;
|
|
1889
|
-
/**
|
|
1890
|
-
* Base des champs du socle : le contrat Signal Forms, ecrit une fois — tout sauf
|
|
1891
|
-
* `value`, dont le type depend du champ (texte, montant, date).
|
|
1892
|
-
*
|
|
1893
|
-
* ⚠️ **Une base, et non une copie par champ.** Neuf membres de contrat recopies
|
|
1894
|
-
* dans six composants, c'est six occasions d'en oublier un — et l'oubli ne se
|
|
1895
|
-
* voit pas : un champ sans `touched` n'affiche jamais ses erreurs, un champ sans
|
|
1896
|
-
* reflet de `hidden` ne se masque pas, et rien n'echoue.
|
|
1897
|
-
*
|
|
1898
|
-
* Les noms restent anglais : voir le glossaire, § 8.
|
|
1899
|
-
*
|
|
1900
|
-
* Le gabarit du champ doit nommer son element natif `#champ`, et le brancher sur
|
|
1901
|
-
* `touch` a la perte du focus.
|
|
1902
|
-
*/
|
|
1903
|
-
declare abstract class ContratDeChamp {
|
|
1904
|
-
readonly libelle: _angular_core.InputSignal<string>;
|
|
1905
|
-
readonly aide: _angular_core.InputSignal<string | null>;
|
|
1906
|
-
readonly errors: _angular_core.InputSignal<readonly ValidationError.WithOptionalFieldTree[]>;
|
|
1907
|
-
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1908
|
-
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1909
|
-
readonly readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1910
|
-
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1911
|
-
readonly hidden: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1912
|
-
readonly name: _angular_core.InputSignal<string>;
|
|
1913
|
-
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
1914
|
-
private readonly champ;
|
|
1915
|
-
/** Appele par Signal Forms pour amener le focus sur un champ en erreur. */
|
|
1916
|
-
focus(options?: FocusOptions): void;
|
|
1917
|
-
protected texteSaisi(evenement: Event): string;
|
|
1918
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ContratDeChamp, never>;
|
|
1919
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ContratDeChamp, never, never, { "libelle": { "alias": "libelle"; "required": true; "isSignal": true; }; "aide": { "alias": "aide"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "touch": "touch"; }, never, never, true, never>;
|
|
1920
|
-
}
|
|
1921
|
-
/** Base des champs dont la valeur est le texte saisi. */
|
|
1922
|
-
declare abstract class ControleDeSaisie extends ContratDeChamp implements FormValueControl<string> {
|
|
1923
|
-
readonly value: _angular_core.ModelSignal<string>;
|
|
1924
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ControleDeSaisie, never>;
|
|
1925
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ControleDeSaisie, never, never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
1926
|
-
}
|
|
1927
|
-
|
|
1928
|
-
/**
|
|
1929
|
-
* `empilee` : etiquette au-dessus du controle, pour un champ texte.
|
|
1930
|
-
* `case` : controle AVANT son etiquette, pour une case a cocher ou un interrupteur.
|
|
1931
|
-
*/
|
|
1932
|
-
type DispositionDeChamp = 'empilee' | 'case';
|
|
1933
|
-
/**
|
|
1934
|
-
* Etiquette, aide, erreur et controle d'un champ de saisie — et le cablage qui
|
|
1935
|
-
* les relie.
|
|
1936
|
-
*
|
|
1937
|
-
* ⚠️ **Le SEUL endroit ou ce cablage existe** (audit de la vague 3, V3-2). Chaque
|
|
1938
|
-
* champ du socle l'emploie au lieu de refaire identifiants, `aria-describedby` et
|
|
1939
|
-
* `aria-invalid` : c'est precisement le code que l'on croit fini et qui se perd,
|
|
1940
|
-
* un champ specialise a la fois.
|
|
1941
|
-
*
|
|
1942
|
-
* L'ordre visuel suit celui de la lecture : etiquette, aide, erreur, controle.
|
|
1943
|
-
* L'erreur est AU-DESSUS du controle, pour etre vue avant de retaper.
|
|
1944
|
-
*
|
|
1945
|
-
* ⚠️ **L'erreur n'est pas une region vivante.** Annoncee a la perte du focus, elle
|
|
1946
|
-
* couperait la lecture du champ suivant, ou la personne est deja passee. Elle est
|
|
1947
|
-
* reliee au controle, donc lue quand on y revient ; a l'envoi, c'est le
|
|
1948
|
-
* recapitulatif d'erreurs qui prend le focus et les enumere.
|
|
1949
|
-
*/
|
|
1950
|
-
declare class StFormField {
|
|
1951
|
-
private readonly libelles;
|
|
1952
|
-
private readonly locale;
|
|
1953
|
-
private readonly element;
|
|
1954
|
-
/**
|
|
1955
|
-
* ⚠️ OBLIGATOIRE et toujours visible (UX-1). Un texte indicatif ne le remplace
|
|
1956
|
-
* jamais : il disparait a la premiere frappe.
|
|
1957
|
-
*/
|
|
1958
|
-
readonly libelle: _angular_core.InputSignal<string>;
|
|
1959
|
-
/** Aide permanente : format attendu, exemple. Lue apres l'etiquette. */
|
|
1960
|
-
readonly aide: _angular_core.InputSignal<string | null>;
|
|
1961
|
-
/** Texte complementaire tenu a jour par le controle, comme un compteur. */
|
|
1962
|
-
readonly complement: _angular_core.InputSignal<string | null>;
|
|
1963
|
-
readonly erreurs: _angular_core.InputSignal<readonly ErreurAffichable[]>;
|
|
1964
|
-
/**
|
|
1965
|
-
* ⚠️ Faux tant que la personne n'a pas quitte le champ ou tente l'envoi (UX-3) :
|
|
1966
|
-
* un formulaire vierge couvert d'erreurs accuse avant qu'on ait rien fait.
|
|
1967
|
-
*/
|
|
1968
|
-
readonly afficherErreurs: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1969
|
-
readonly obligatoire: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1970
|
-
/**
|
|
1971
|
-
* ⚠️ Change l'ordre VISUEL, jamais celui du document : l'etiquette reste
|
|
1972
|
-
* reliee par `for`, et l'ordre de tabulation ne passe que par le controle.
|
|
1973
|
-
*/
|
|
1974
|
-
readonly disposition: _angular_core.InputSignal<DispositionDeChamp>;
|
|
1975
|
-
/**
|
|
1976
|
-
* Etiquette lue mais non affichee.
|
|
1977
|
-
*
|
|
1978
|
-
* ⚠️ Reservee a la RECHERCHE, ou l'icone, le bouton et la position en tete de
|
|
1979
|
-
* page disent deja le but du champ. Partout ailleurs, une etiquette masquee est
|
|
1980
|
-
* l'etiquette qui manque au moment ou l'on tape (UX-1).
|
|
1981
|
-
*/
|
|
1982
|
-
readonly libelleMasque: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1983
|
-
/** Identifiants du champ, lus par `stControleDeChamp` et par le gabarit. */
|
|
1984
|
-
readonly identifiants: {
|
|
1985
|
-
readonly controle: string;
|
|
1986
|
-
readonly libelle: `${string}-libelle`;
|
|
1987
|
-
readonly aide: `${string}-aide`;
|
|
1988
|
-
readonly complement: `${string}-complement`;
|
|
1989
|
-
readonly erreur: `${string}-erreur`;
|
|
1990
|
-
};
|
|
1991
|
-
protected readonly libelleObligatoire: _angular_core.Signal<string>;
|
|
1992
|
-
/** Messages a afficher, dans la langue courante. Vide tant qu'ils ne doivent pas l'etre. */
|
|
1993
|
-
protected readonly messages: _angular_core.Signal<string[]>;
|
|
1994
|
-
/**
|
|
1995
|
-
* Un clic sur l'etiquette d'un controle non natif n'y mene pas de lui-meme :
|
|
1996
|
-
* on y amene le focus, comme le navigateur le fait pour un champ natif.
|
|
1997
|
-
*/
|
|
1998
|
-
protected focaliserLeControle(): void;
|
|
1999
|
-
/** Lu par le controle pour `aria-invalid`. */
|
|
2000
|
-
readonly enErreur: _angular_core.Signal<boolean>;
|
|
2001
|
-
/**
|
|
2002
|
-
* ⚠️ Seuls les elements PRESENTS sont references : un `aria-describedby` qui
|
|
2003
|
-
* vise un identifiant absent est ignore par certains lecteurs d'ecran — tout
|
|
2004
|
-
* entier, y compris les references valides qui l'accompagnent.
|
|
2005
|
-
*/
|
|
2006
|
-
readonly descriptions: _angular_core.Signal<string | null>;
|
|
2007
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StFormField, never>;
|
|
2008
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StFormField, "st-form-field", never, { "libelle": { "alias": "libelle"; "required": true; "isSignal": true; }; "aide": { "alias": "aide"; "required": false; "isSignal": true; }; "complement": { "alias": "complement"; "required": false; "isSignal": true; }; "erreurs": { "alias": "erreurs"; "required": false; "isSignal": true; }; "afficherErreurs": { "alias": "afficherErreurs"; "required": false; "isSignal": true; }; "obligatoire": { "alias": "obligatoire"; "required": false; "isSignal": true; }; "disposition": { "alias": "disposition"; "required": false; "isSignal": true; }; "libelleMasque": { "alias": "libelleMasque"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
2009
|
-
}
|
|
2010
|
-
/**
|
|
2011
|
-
* Pose sur l'element natif d'un champ le cablage de son `st-form-field` :
|
|
2012
|
-
* identifiant, description, invalidite, obligation.
|
|
2013
|
-
*
|
|
2014
|
-
* ⚠️ `aria-required` et NON l'attribut `required` natif. Le natif declenche la
|
|
2015
|
-
* validation du navigateur a l'envoi : une bulle « Veuillez renseigner ce champ »
|
|
2016
|
-
* dans la langue du NAVIGATEUR, pas dans celle de l'application, et qui double
|
|
2017
|
-
* le message du socle.
|
|
2018
|
-
*/
|
|
2019
|
-
declare class StControleDeChamp {
|
|
2020
|
-
protected readonly champ: StFormField;
|
|
2021
|
-
/**
|
|
2022
|
-
* ⚠️ `label for` n'etiquette que les elements natifs de formulaire. Le
|
|
2023
|
-
* declencheur d'une selection multiple est un `div` de role `combobox` : sans
|
|
2024
|
-
* `aria-labelledby`, il n'aurait aucun nom, et l'etiquette visible ne dirait
|
|
2025
|
-
* rien au lecteur d'ecran.
|
|
2026
|
-
*/
|
|
2027
|
-
protected readonly etiquetable: boolean;
|
|
2028
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StControleDeChamp, never>;
|
|
2029
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<StControleDeChamp, "[stControleDeChamp]", never, {}, {}, never, never, true, never>;
|
|
2030
|
-
}
|
|
2031
|
-
|
|
2032
|
-
type TypeDeSaisie = 'text' | 'email' | 'tel' | 'url' | 'search';
|
|
2033
|
-
/**
|
|
2034
|
-
* Champ de saisie d'une ligne, integre a Signal Forms.
|
|
2035
|
-
*
|
|
2036
|
-
* ```html
|
|
2037
|
-
* <st-input libelle="Nom du beneficiaire" autocomplete="name" [formField]="virement.beneficiaire" />
|
|
2038
|
-
* <!-- ou, sans formulaire : -->
|
|
2039
|
-
* <st-input libelle="Reference" [(value)]="reference" />
|
|
2040
|
-
* ```
|
|
2041
|
-
*
|
|
2042
|
-
* ⚠️ **Contrat Signal Forms, noms anglais.** `value`, `errors`, `touched`,
|
|
2043
|
-
* `disabled`… sont cherches PAR LEUR NOM par la directive `[formField]` : les
|
|
2044
|
-
* traduire romprait l'integration sans la moindre erreur (audit de la vague 3,
|
|
2045
|
-
* V3-1). L'import d'`@angular/forms` est un import de TYPE : aucun code n'entre
|
|
2046
|
-
* dans le paquet.
|
|
2047
|
-
*
|
|
2048
|
-
* ⚠️ **Pas d'attribut `maxlength` natif.** Il TRONQUE en silence un texte colle
|
|
2049
|
-
* trop long : la personne croit avoir saisi sa reference entiere, et n'en envoie
|
|
2050
|
-
* que le debut. La limite passe par la validation, qui DIT le depassement.
|
|
2051
|
-
*/
|
|
2052
|
-
declare class StInput extends ControleDeSaisie {
|
|
2053
|
-
readonly type: _angular_core.InputSignal<TypeDeSaisie>;
|
|
2054
|
-
/**
|
|
2055
|
-
* WCAG 1.3.5 : identifie le but du champ, pour le remplissage automatique et les
|
|
2056
|
-
* aides techniques. `null` : laisse le navigateur decider.
|
|
2057
|
-
*/
|
|
2058
|
-
readonly autocomplete: _angular_core.InputSignal<string | null>;
|
|
2059
|
-
/** Clavier virtuel adapte : `numeric`, `decimal`, `email`… */
|
|
2060
|
-
readonly inputmode: _angular_core.InputSignal<string | null>;
|
|
2061
|
-
protected surSaisie(evenement: Event): void;
|
|
2062
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StInput, never>;
|
|
2063
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StInput, "st-input", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "inputmode": { "alias": "inputmode"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2064
|
-
}
|
|
2065
|
-
|
|
2066
|
-
/**
|
|
2067
|
-
* Zone de texte, integree a Signal Forms, avec compteur quand une longueur
|
|
2068
|
-
* maximale est fixee.
|
|
2069
|
-
*
|
|
2070
|
-
* ⚠️ **Le compteur n'est pas annonce a chaque frappe** : une region vivante qui
|
|
2071
|
-
* change a chaque caractere recouvre ce que la personne tape. Il est RELIE a la
|
|
2072
|
-
* zone — donc lu quand on y revient — et seuls les seuils (20, 10, 0 restants)
|
|
2073
|
-
* et le depassement s'annoncent (UX-11).
|
|
2074
|
-
*
|
|
2075
|
-
* ⚠️ **Pas de `maxlength` natif**, meme raison que `st-input` : un texte colle
|
|
2076
|
-
* serait tronque en silence. Le compteur affiche le depassement, la validation
|
|
2077
|
-
* le refuse.
|
|
2078
|
-
*/
|
|
2079
|
-
declare class StTextarea extends ControleDeSaisie {
|
|
2080
|
-
private readonly libelles;
|
|
2081
|
-
readonly lignes: _angular_core.InputSignal<number>;
|
|
2082
|
-
/** Contrat Signal Forms : la longueur maximale fixee par le schema. */
|
|
2083
|
-
readonly maxLength: _angular_core.InputSignal<number | undefined>;
|
|
2084
|
-
protected readonly annonce: AnnonceLocale;
|
|
2085
|
-
private readonly restants;
|
|
2086
|
-
protected readonly compteur: _angular_core.Signal<string | null>;
|
|
2087
|
-
constructor();
|
|
2088
|
-
protected surSaisie(evenement: Event): void;
|
|
2089
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StTextarea, never>;
|
|
2090
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StTextarea, "st-textarea", never, { "lignes": { "alias": "lignes"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2091
|
-
}
|
|
2092
|
-
|
|
2093
|
-
/**
|
|
2094
|
-
* Groupe de controles, nomme par sa QUESTION.
|
|
2095
|
-
*
|
|
2096
|
-
* ⚠️ `fieldset` et `legend` natifs (UX-7). Sans legende, un lecteur d'ecran
|
|
2097
|
-
* annonce « Oui, bouton radio » et « Non, bouton radio » : la reponse, jamais la
|
|
2098
|
-
* question. La legende est lue a l'entree dans le groupe.
|
|
2099
|
-
*
|
|
2100
|
-
* C'est le pendant de `st-form-field` pour un GROUPE : l'aide et l'erreur sont
|
|
2101
|
-
* reliees au `fieldset` par `aria-describedby`, et l'erreur porte sur le groupe
|
|
2102
|
-
* entier — « Choisissez un mode de reglement » — et non sur chaque option.
|
|
2103
|
-
*
|
|
2104
|
-
* ⚠️ L'obligation se dit dans la legende, en texte : `aria-required` n'est pas
|
|
2105
|
-
* valide sur un groupe, et `required` natif ferait parler le navigateur dans sa
|
|
2106
|
-
* propre langue.
|
|
2107
|
-
*/
|
|
2108
|
-
declare class StFieldset {
|
|
2109
|
-
private readonly libelles;
|
|
2110
|
-
private readonly locale;
|
|
2111
|
-
/** La question posee par le groupe. Obligatoire. */
|
|
2112
|
-
readonly legende: _angular_core.InputSignal<string>;
|
|
2113
|
-
readonly aide: _angular_core.InputSignal<string | null>;
|
|
2114
|
-
readonly erreurs: _angular_core.InputSignal<readonly ErreurAffichable[]>;
|
|
2115
|
-
readonly afficherErreurs: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2116
|
-
readonly obligatoire: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2117
|
-
private readonly base;
|
|
2118
|
-
protected readonly identifiantAide: string;
|
|
2119
|
-
protected readonly identifiantErreur: string;
|
|
2120
|
-
protected readonly libelleObligatoire: _angular_core.Signal<string>;
|
|
2121
|
-
protected readonly messages: _angular_core.Signal<string[]>;
|
|
2122
|
-
protected readonly enErreur: _angular_core.Signal<boolean>;
|
|
2123
|
-
protected readonly descriptions: _angular_core.Signal<string | null>;
|
|
2124
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StFieldset, never>;
|
|
2125
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StFieldset, "st-fieldset", never, { "legende": { "alias": "legende"; "required": true; "isSignal": true; }; "aide": { "alias": "aide"; "required": false; "isSignal": true; }; "erreurs": { "alias": "erreurs"; "required": false; "isSignal": true; }; "afficherErreurs": { "alias": "afficherErreurs"; "required": false; "isSignal": true; }; "obligatoire": { "alias": "obligatoire"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
2126
|
-
}
|
|
2127
|
-
|
|
2128
|
-
/**
|
|
2129
|
-
* Case a cocher, integree a Signal Forms.
|
|
2130
|
-
*
|
|
2131
|
-
* ```html
|
|
2132
|
-
* <st-checkbox libelle="J'accepte les conditions generales" [formField]="inscription.conditions" />
|
|
2133
|
-
* ```
|
|
2134
|
-
*
|
|
2135
|
-
* Un element `input type="checkbox"` natif : Espace coche, l'etat est annonce,
|
|
2136
|
-
* et la case suit le reglage de contraste du systeme sans rien ecrire.
|
|
2137
|
-
*
|
|
2138
|
-
* ⚠️ **Pour un choix a envoyer avec un formulaire.** Un reglage qui s'applique
|
|
2139
|
-
* IMMEDIATEMENT est un `st-switch` : la case promet un effet a l'envoi, et
|
|
2140
|
-
* l'interrupteur un effet tout de suite (UX-8).
|
|
2141
|
-
*/
|
|
2142
|
-
declare class StCheckbox implements FormCheckboxControl {
|
|
2143
|
-
readonly libelle: _angular_core.InputSignal<string>;
|
|
2144
|
-
readonly aide: _angular_core.InputSignal<string | null>;
|
|
2145
|
-
/** Contrat Signal Forms. */
|
|
2146
|
-
readonly checked: _angular_core.ModelSignal<boolean>;
|
|
2147
|
-
readonly errors: _angular_core.InputSignal<readonly ValidationError.WithOptionalFieldTree[]>;
|
|
2148
|
-
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2149
|
-
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2150
|
-
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2151
|
-
readonly hidden: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2152
|
-
readonly name: _angular_core.InputSignal<string>;
|
|
2153
|
-
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
2154
|
-
private readonly champ;
|
|
2155
|
-
focus(options?: FocusOptions): void;
|
|
2156
|
-
protected surChangement(evenement: Event): void;
|
|
2157
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StCheckbox, never>;
|
|
2158
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StCheckbox, "st-checkbox", never, { "libelle": { "alias": "libelle"; "required": true; "isSignal": true; }; "aide": { "alias": "aide"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2159
|
-
}
|
|
2160
|
-
|
|
2161
|
-
/** Une option du groupe. */
|
|
2162
|
-
interface OptionRadio {
|
|
2163
|
-
readonly valeur: string;
|
|
2164
|
-
readonly libelle: string;
|
|
2165
|
-
/** Precision sous le libelle, reliee a l'option. */
|
|
2166
|
-
readonly aide?: string;
|
|
2167
|
-
readonly desactivee?: boolean;
|
|
2168
|
-
}
|
|
2169
|
-
/**
|
|
2170
|
-
* Groupe de boutons radio, integre a Signal Forms.
|
|
2171
|
-
*
|
|
2172
|
-
* ```html
|
|
2173
|
-
* <st-radio-group legende="Mode de reglement" [options]="modes" [formField]="commande.mode" />
|
|
2174
|
-
* ```
|
|
2175
|
-
*
|
|
2176
|
-
* ⚠️ **De vrais boutons radio natifs** : un seul arret de tabulation pour le
|
|
2177
|
-
* groupe, deplacement aux fleches, « 2 sur 3 » annonce. Les recrire en ARIA,
|
|
2178
|
-
* c'est cent lignes pour obtenir moins bien — meme raison que `st-theme-toggle`.
|
|
2179
|
-
*
|
|
2180
|
-
* ⚠️ **L'erreur porte sur le groupe**, par `st-fieldset`, et non sur chaque option :
|
|
2181
|
-
* « Choisissez un mode de reglement », une fois.
|
|
2182
|
-
*
|
|
2183
|
-
* `touch` n'est emis que lorsque le focus QUITTE le groupe : passer d'une option a
|
|
2184
|
-
* l'autre aux fleches n'est pas une fin de saisie, et l'erreur n'a pas a surgir
|
|
2185
|
-
* pendant qu'on choisit.
|
|
2186
|
-
*/
|
|
2187
|
-
declare class StRadioGroup implements FormValueControl<string> {
|
|
2188
|
-
private readonly element;
|
|
2189
|
-
readonly legende: _angular_core.InputSignal<string>;
|
|
2190
|
-
readonly aide: _angular_core.InputSignal<string | null>;
|
|
2191
|
-
readonly options: _angular_core.InputSignal<readonly OptionRadio[]>;
|
|
2192
|
-
/** Contrat Signal Forms. */
|
|
2193
|
-
readonly value: _angular_core.ModelSignal<string>;
|
|
2194
|
-
readonly errors: _angular_core.InputSignal<readonly ValidationError.WithOptionalFieldTree[]>;
|
|
2195
|
-
readonly touched: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2196
|
-
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2197
|
-
readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2198
|
-
readonly hidden: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2199
|
-
readonly name: _angular_core.InputSignal<string>;
|
|
2200
|
-
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
2201
|
-
/** Nom partage par les options : sans lui, chaque radio forme son propre groupe. */
|
|
2202
|
-
private readonly nomParDefaut;
|
|
2203
|
-
protected nomDuGroupe(): string;
|
|
2204
|
-
protected identifiantAide(indice: number): string;
|
|
2205
|
-
/** Focus sur l'option cochee, sinon la premiere disponible : c'est l'arret du groupe. */
|
|
2206
|
-
focus(options?: FocusOptions): void;
|
|
2207
|
-
protected choisir(valeur: string): void;
|
|
2208
|
-
protected aLaSortie(evenement: FocusEvent): void;
|
|
2209
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StRadioGroup, never>;
|
|
2210
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StRadioGroup, "st-radio-group", never, { "legende": { "alias": "legende"; "required": true; "isSignal": true; }; "aide": { "alias": "aide"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2211
|
-
}
|
|
2212
|
-
|
|
2213
|
-
/**
|
|
2214
|
-
* Interrupteur : un reglage qui s'applique IMMEDIATEMENT.
|
|
2215
|
-
*
|
|
2216
|
-
* ```html
|
|
2217
|
-
* <st-switch libelle="Notifications par SMS" [(checked)]="sms" (checkedChange)="enregistrer($event)" />
|
|
2218
|
-
* ```
|
|
2219
|
-
*
|
|
2220
|
-
* ⚠️ **Jamais dans un formulaire a envoyer** (UX-8). Un interrupteur promet que
|
|
2221
|
-
* l'effet a lieu au basculement ; pose au-dessus d'un bouton « Enregistrer », il
|
|
2222
|
-
* ment — la personne croit le reglage applique, quitte la page, et le perd. Pour
|
|
2223
|
-
* un choix envoye plus tard, c'est `st-checkbox`.
|
|
2224
|
-
*
|
|
2225
|
-
* C'est pourquoi il n'affiche aucune erreur de validation : un reglage immediat
|
|
2226
|
-
* ne se valide pas a l'envoi. Un refus du serveur se dit par un message, et
|
|
2227
|
-
* l'interrupteur revient a son etat precedent.
|
|
2228
|
-
*
|
|
2229
|
-
* ⚠️ Une case a cocher native avec `role="switch"` : Espace bascule, l'etiquette
|
|
2230
|
-
* est reliee par `for`, et le lecteur d'ecran annonce « active » ou
|
|
2231
|
-
* « desactive » — mieux qu'un `div` qui imiterait tout cela.
|
|
2232
|
-
*/
|
|
2233
|
-
declare class StSwitch implements FormCheckboxControl {
|
|
2234
|
-
readonly libelle: _angular_core.InputSignal<string>;
|
|
2235
|
-
readonly aide: _angular_core.InputSignal<string | null>;
|
|
2236
|
-
/** Contrat Signal Forms. */
|
|
2237
|
-
readonly checked: _angular_core.ModelSignal<boolean>;
|
|
2238
|
-
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2239
|
-
readonly hidden: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2240
|
-
readonly name: _angular_core.InputSignal<string>;
|
|
2241
|
-
readonly touch: _angular_core.OutputEmitterRef<void>;
|
|
2242
|
-
private readonly champ;
|
|
2243
|
-
focus(options?: FocusOptions): void;
|
|
2244
|
-
protected surChangement(evenement: Event): void;
|
|
2245
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StSwitch, never>;
|
|
2246
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StSwitch, "st-switch", never, { "libelle": { "alias": "libelle"; "required": true; "isSignal": true; }; "aide": { "alias": "aide"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "touch": "touch"; }, never, never, true, never>;
|
|
2247
|
-
}
|
|
2248
|
-
|
|
2249
|
-
/** Une ligne du recapitulatif. */
|
|
2250
|
-
interface LigneDErreur {
|
|
2251
|
-
readonly libelle: string | null;
|
|
2252
|
-
readonly message: string;
|
|
2253
|
-
readonly aller: () => void;
|
|
2254
|
-
}
|
|
2255
|
-
/**
|
|
2256
|
-
* Recapitulatif des erreurs d'un formulaire, a l'envoi.
|
|
2257
|
-
*
|
|
2258
|
-
* ```html
|
|
2259
|
-
* <st-error-summary [erreurs]="tentative() ? virement().errorSummary() : []" />
|
|
2260
|
-
* ```
|
|
2261
|
-
*
|
|
2262
|
-
* ⚠️ **Il prend le focus en apparaissant** (UX-5). Sans lui, une personne au
|
|
2263
|
-
* clavier ou au lecteur d'ecran appuie sur « Envoyer », et rien ne se passe : le
|
|
2264
|
-
* champ refuse est en haut de la page, hors de sa vue, et personne ne le lui dit.
|
|
2265
|
-
*
|
|
2266
|
-
* ⚠️ **Chaque ligne nomme son champ.** « Ce champ est obligatoire. » repete cinq
|
|
2267
|
-
* fois n'apprend rien ; « Nom du beneficiaire : ce champ est obligatoire. », si.
|
|
2268
|
-
* Le libelle est lu sur l'element lie au champ, par Signal Forms — sans registre,
|
|
2269
|
-
* et quel que soit le composant.
|
|
2270
|
-
*
|
|
2271
|
-
* ⚠️ **Une ligne par champ**, la premiere erreur seulement : trois erreurs sur le
|
|
2272
|
-
* meme IBAN font trois lignes pour une seule correction.
|
|
2273
|
-
*
|
|
2274
|
-
* ⚠️ **Une region nommee par son titre.** Un `div` sans role ne PEUT pas porter
|
|
2275
|
-
* `aria-labelledby` : le nom serait ignore, et le focus n'annoncerait rien. En
|
|
2276
|
-
* region, il annonce « 2 erreurs a corriger » a l'arrivee du focus, et se
|
|
2277
|
-
* retrouve dans la liste des reperes.
|
|
2278
|
-
*
|
|
2279
|
-
* Chaque ligne amene le focus sur son champ : c'est le champ, et non la ligne,
|
|
2280
|
-
* qu'il faut corriger. Une erreur rattachee au formulaire entier — un refus du
|
|
2281
|
-
* serveur sur un champ inconnu — s'affiche sans lien.
|
|
2282
|
-
*/
|
|
2283
|
-
declare class StErrorSummary {
|
|
2284
|
-
private readonly libelles;
|
|
2285
|
-
private readonly locale;
|
|
2286
|
-
private readonly element;
|
|
2287
|
-
private readonly injecteur;
|
|
2288
|
-
readonly erreurs: _angular_core.InputSignal<readonly ValidationError.WithOptionalFieldTree[]>;
|
|
2289
|
-
/** `null` : « N erreurs a corriger », du dictionnaire. */
|
|
2290
|
-
readonly titre: _angular_core.InputSignal<string | null>;
|
|
2291
|
-
/** Unique par instance : deux recapitulatifs sur une page partageraient leur titre. */
|
|
2292
|
-
protected readonly identifiantDuTitre: string;
|
|
2293
|
-
protected readonly lignes: _angular_core.Signal<readonly LigneDErreur[]>;
|
|
2294
|
-
protected readonly titreLu: _angular_core.Signal<string>;
|
|
2295
|
-
constructor();
|
|
2296
|
-
/** A appeler apres un envoi refuse, quand le recapitulatif etait deja visible. */
|
|
2297
|
-
focus(): void;
|
|
2298
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StErrorSummary, never>;
|
|
2299
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StErrorSummary, "st-error-summary", never, { "erreurs": { "alias": "erreurs"; "required": true; "isSignal": true; }; "titre": { "alias": "titre"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2300
|
-
}
|
|
2301
|
-
|
|
2302
|
-
/** `connexion` : un mot de passe existant. `creation` : un nouveau. */
|
|
2303
|
-
type UsageDuMotDePasse = 'connexion' | 'creation';
|
|
2304
|
-
/**
|
|
2305
|
-
* Mot de passe, avec revelation.
|
|
2306
|
-
*
|
|
2307
|
-
* ```html
|
|
2308
|
-
* <st-password-field libelle="Mot de passe" usage="creation" [regles]="regles" [formField]="compte.motDePasse" />
|
|
2309
|
-
* ```
|
|
2310
|
-
*
|
|
2311
|
-
* ⚠️ **`autocomplete` selon l'usage** (SEC-2) : `current-password` a la connexion,
|
|
2312
|
-
* `new-password` a la creation — c'est ce qui fait proposer par le gestionnaire
|
|
2313
|
-
* un mot de passe FORT au bon endroit, et non l'ancien.
|
|
2314
|
-
*
|
|
2315
|
-
* ⚠️ **Le collage n'est jamais bloque** (SEC-1, NIST SP 800-63B) : l'interdire
|
|
2316
|
-
* pousse vers des mots de passe courts, retenus de tete, et casse les
|
|
2317
|
-
* gestionnaires de mots de passe.
|
|
2318
|
-
*
|
|
2319
|
-
* ⚠️ **Revele, il se remasque des que le focus quitte le champ, et a l'envoi du
|
|
2320
|
-
* formulaire** (SEC-4) : un mot de passe laisse en clair reste lisible par-dessus
|
|
2321
|
-
* l'epaule, sur l'ecran suivant comme sur celui-ci. L'envoi par Entree ne fait
|
|
2322
|
-
* pas quitter le champ : d'ou l'ecoute de `submit`, qui remonte jusqu'au document.
|
|
2323
|
-
*
|
|
2324
|
-
* Le bouton de revelation est un bouton bascule : `aria-pressed` porte l'etat, et
|
|
2325
|
-
* l'etiquette ne change PAS — « Masquer le mot de passe, enfonce » se lirait
|
|
2326
|
-
* comme une double negation.
|
|
2327
|
-
*
|
|
2328
|
-
* ⚠️ **Aucun indicateur de « force »**, et c'est un refus. Une estimation faite
|
|
2329
|
-
* dans le navigateur donne « fort » a `Motdepasse1!` : elle rassure a tort. Les
|
|
2330
|
-
* regles sont affichees AVANT la saisie (UX-10), et c'est le serveur qui verifie —
|
|
2331
|
-
* y compris contre les mots de passe deja divulgues, qu'aucune regle locale ne
|
|
2332
|
-
* voit.
|
|
2333
|
-
*/
|
|
2334
|
-
declare class StPasswordField extends ControleDeSaisie {
|
|
2335
|
-
protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
|
|
2336
|
-
private readonly element;
|
|
2337
|
-
readonly usage: _angular_core.InputSignal<UsageDuMotDePasse>;
|
|
2338
|
-
/** Regles affichees avant la saisie, comme aide du champ. */
|
|
2339
|
-
readonly regles: _angular_core.InputSignal<readonly string[]>;
|
|
2340
|
-
protected readonly revele: _angular_core.WritableSignal<boolean>;
|
|
2341
|
-
protected readonly autocomplete: _angular_core.Signal<"current-password" | "new-password">;
|
|
2342
|
-
protected readonly aideLue: _angular_core.Signal<string | null>;
|
|
2343
|
-
protected basculer(): void;
|
|
2344
|
-
protected surSaisie(evenement: Event): void;
|
|
2345
|
-
protected aLEnvoi(evenement: Event): void;
|
|
2346
|
-
protected aLaSortie(evenement: FocusEvent): void;
|
|
2347
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StPasswordField, never>;
|
|
2348
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StPasswordField, "st-password-field", never, { "usage": { "alias": "usage"; "required": false; "isSignal": true; }; "regles": { "alias": "regles"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2349
|
-
}
|
|
2350
|
-
|
|
2351
|
-
/**
|
|
2352
|
-
* Code a usage unique : second facteur, code recu par SMS ou par courriel.
|
|
2353
|
-
*
|
|
2354
|
-
* ⚠️ **UN seul champ, pas six cases** (UX-9). Six champs cassent le collage, le
|
|
2355
|
-
* remplissage automatique du code recu par SMS, et la lecture au lecteur d'ecran,
|
|
2356
|
-
* qui annonce six champs sans nom au lieu d'un seul.
|
|
2357
|
-
*
|
|
2358
|
-
* ⚠️ `autocomplete="one-time-code"` : iOS et Android proposent alors le code recu,
|
|
2359
|
-
* d'un toucher. Clavier numerique par `inputmode`, et NON par `type="number"`,
|
|
2360
|
-
* qui retire les zeros de tete et accepte « 1e5 ».
|
|
2361
|
-
*
|
|
2362
|
-
* ⚠️ **Aucun envoi automatique** a la sixieme saisie : un formulaire qui part de
|
|
2363
|
-
* lui-meme surprend (WCAG 3.2.2), et part aussi avec un code mal colle. Le code
|
|
2364
|
-
* colle est nettoye de ses espaces et tirets — « 123 456 » —, jamais tronque.
|
|
2365
|
-
*/
|
|
2366
|
-
declare class StOtpField extends ControleDeSaisie {
|
|
2367
|
-
private readonly libelles;
|
|
2368
|
-
readonly longueur: _angular_core.InputSignal<number>;
|
|
2369
|
-
protected readonly aideLue: _angular_core.Signal<string>;
|
|
2370
|
-
protected surSaisie(evenement: Event): void;
|
|
2371
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StOtpField, never>;
|
|
2372
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StOtpField, "st-otp-field", never, { "longueur": { "alias": "longueur"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2373
|
-
}
|
|
2374
|
-
|
|
2375
|
-
/**
|
|
2376
|
-
* Champ de recherche : un repere, un champ, un bouton.
|
|
2377
|
-
*
|
|
2378
|
-
* ```html
|
|
2379
|
-
* <st-search-field libelle="Rechercher un beneficiaire" (recherche)="filtrer($event)" />
|
|
2380
|
-
* ```
|
|
2381
|
-
*
|
|
2382
|
-
* ⚠️ **Un repere `search`** : la recherche se retrouve dans la liste des reperes du
|
|
2383
|
-
* lecteur d'ecran, a cote de la navigation et du contenu.
|
|
2384
|
-
*
|
|
2385
|
-
* L'etiquette est lue sans etre affichee — seule exception au socle (UX-1) : la
|
|
2386
|
-
* loupe, le bouton et la position disent deja le but du champ.
|
|
2387
|
-
*
|
|
2388
|
-
* ⚠️ **Jamais dans l'adresse quand le terme est personnel** (SEC-6). Chercher un
|
|
2389
|
-
* nom, un IBAN ou un numero en `?q=` inscrit la donnee dans l'historique, dans les
|
|
2390
|
-
* journaux des intermediaires, et dans l'en-tete `Referer` des pages suivantes.
|
|
2391
|
-
* `recherche` emet le terme : c'est a l'appelant de ne pas le mettre dans l'URL.
|
|
2392
|
-
*/
|
|
2393
|
-
declare class StSearchField extends ControleDeSaisie {
|
|
2394
|
-
protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
|
|
2395
|
-
/** Emis a la validation — Entree ou bouton —, et non a chaque frappe. */
|
|
2396
|
-
readonly recherche: _angular_core.OutputEmitterRef<string>;
|
|
2397
|
-
protected surSaisie(evenement: Event): void;
|
|
2398
|
-
protected lancer(evenement?: Event): void;
|
|
2399
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StSearchField, never>;
|
|
2400
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StSearchField, "st-search-field", never, {}, { "recherche": "recherche"; }, never, never, true, never>;
|
|
2401
|
-
}
|
|
2402
|
-
|
|
2403
|
-
/**
|
|
2404
|
-
* IBAN. La valeur du modele est NORMALISEE — sans espaces, en majuscules —, et
|
|
2405
|
-
* l'affichage groupe par quatre.
|
|
2406
|
-
*
|
|
2407
|
-
* ```html
|
|
2408
|
-
* <st-iban-field libelle="IBAN du beneficiaire" [formField]="virement.iban" />
|
|
2409
|
-
* <!-- schema : validate(chemin.iban, ({ value }) => erreurIban(value())) -->
|
|
2410
|
-
* ```
|
|
2411
|
-
*
|
|
2412
|
-
* ⚠️ **Le groupement se fait a la sortie du champ, jamais pendant la frappe.**
|
|
2413
|
-
* Reformater a chaque caractere deplace le curseur a la fin : corriger une
|
|
2414
|
-
* erreur au milieu de 27 caracteres devient impossible, chaque frappe renvoyant a
|
|
2415
|
-
* la fin de la ligne.
|
|
2416
|
-
*
|
|
2417
|
-
* ⚠️ **Aucune verification de validite ici** : elle appartient au schema, par
|
|
2418
|
-
* `erreurIban`, pour s'afficher au bon moment et par le bon canal. Et elle reste un
|
|
2419
|
-
* confort (SEC-5) : le serveur revalide.
|
|
2420
|
-
*
|
|
2421
|
-
* `autocapitalize="characters"` et correction orthographique coupee : un IBAN
|
|
2422
|
-
* n'est pas un mot, et une correction automatique le fausserait.
|
|
2423
|
-
*/
|
|
2424
|
-
declare class StIbanField extends ControleDeSaisie {
|
|
2425
|
-
private readonly libelles;
|
|
2426
|
-
private readonly enSaisie;
|
|
2427
|
-
private readonly brut;
|
|
2428
|
-
protected readonly aideLue: _angular_core.Signal<string>;
|
|
2429
|
-
/**
|
|
2430
|
-
* Brut pendant la saisie ; groupe par quatre au repos. Une valeur changee de
|
|
2431
|
-
* l'exterieur pendant la saisie — remise a zero du formulaire — l'emporte sur
|
|
2432
|
-
* le brut, qui ne la represente plus.
|
|
2433
|
-
*/
|
|
2434
|
-
protected readonly affichage: _angular_core.Signal<string>;
|
|
2435
|
-
protected auFocus(): void;
|
|
2436
|
-
protected surSaisie(evenement: Event): void;
|
|
2437
|
-
protected aLaSortie(): void;
|
|
2438
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StIbanField, never>;
|
|
2439
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StIbanField, "st-iban-field", never, {}, {}, never, never, true, never>;
|
|
2440
|
-
}
|
|
2441
|
-
|
|
2442
|
-
/** `tel` : numero complet, indicatif compris. `tel-national` : sans indicatif. */
|
|
2443
|
-
type RemplissageDeTelephone = 'tel' | 'tel-national';
|
|
2444
|
-
/**
|
|
2445
|
-
* Numero de telephone. La valeur du modele ne garde que les chiffres et le `+` de
|
|
2446
|
-
* tete ; la saisie s'affiche telle qu'elle a ete tapee.
|
|
2447
|
-
*
|
|
2448
|
-
* ```html
|
|
2449
|
-
* <st-phone-field libelle="Telephone portable" [formField]="contact.telephone" />
|
|
2450
|
-
* <!-- schema : validate(chemin.telephone, ({ value }) => erreurTelephone(value())) -->
|
|
2451
|
-
* ```
|
|
2452
|
-
*
|
|
2453
|
-
* ⚠️ **Aucun formatage automatique.** Le groupement des chiffres depend du pays,
|
|
2454
|
-
* et reformater pendant la frappe renvoie le curseur en fin de ligne. La saisie
|
|
2455
|
-
* reste celle de la personne, espaces et points compris.
|
|
2456
|
-
*
|
|
2457
|
-
* ⚠️ **Pas de selecteur de pays, pas de verification par pays.** Il faudrait une
|
|
2458
|
-
* table des plans de numerotation, lourde et souvent perimee : c'est au serveur
|
|
2459
|
-
* de dire si le numero existe (SEC-5). `erreurTelephone` ne verifie que la forme.
|
|
2460
|
-
*
|
|
2461
|
-
* `type="tel"`, et jamais `type="number"` : un numero n'est pas une quantite, et le
|
|
2462
|
-
* champ numerique retire le zero de tete et le `+`.
|
|
2463
|
-
*/
|
|
2464
|
-
declare class StPhoneField extends ControleDeSaisie {
|
|
2465
|
-
readonly autocomplete: _angular_core.InputSignal<RemplissageDeTelephone>;
|
|
2466
|
-
private readonly brut;
|
|
2467
|
-
/**
|
|
2468
|
-
* La saisie telle que tapee, tant qu'elle represente encore la valeur ; une
|
|
2469
|
-
* valeur changee de l'exterieur — remise a zero, pre-remplissage — l'emporte.
|
|
2470
|
-
*/
|
|
2471
|
-
protected readonly affichage: _angular_core.Signal<string>;
|
|
2472
|
-
protected surSaisie(evenement: Event): void;
|
|
2473
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StPhoneField, never>;
|
|
2474
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StPhoneField, "st-phone-field", never, { "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2475
|
-
}
|
|
2476
|
-
|
|
2477
|
-
/**
|
|
2478
|
-
* Un choix d'une liste : `st-select`, `st-combobox`, `st-multiselect`.
|
|
2479
|
-
*
|
|
2480
|
-
* La `valeur` part dans le modele, le `libelle` s'affiche : un identifiant
|
|
2481
|
-
* technique ne s'affiche jamais, et un libelle traduit ne s'envoie jamais.
|
|
2482
|
-
*/
|
|
2483
|
-
interface OptionDeListe {
|
|
2484
|
-
readonly valeur: string;
|
|
2485
|
-
readonly libelle: string;
|
|
2486
|
-
readonly desactivee?: boolean;
|
|
2487
|
-
/** Regroupe les options consecutives sous un intitule (`optgroup`). */
|
|
2488
|
-
readonly groupe?: string;
|
|
2489
|
-
}
|
|
2490
|
-
/** Sans accents ni casse : « eleve » trouve « Élève ». */
|
|
2491
|
-
declare function normaliserPourRecherche(texte: string): string;
|
|
2492
|
-
/** Options dont le libelle CONTIENT le texte cherche, sans accents ni casse. */
|
|
2493
|
-
declare function filtrerOptions(options: readonly OptionDeListe[], recherche: string): readonly OptionDeListe[];
|
|
2494
|
-
|
|
2495
|
-
interface BlocDOptions {
|
|
2496
|
-
readonly groupe: string | null;
|
|
2497
|
-
readonly options: readonly OptionDeListe[];
|
|
2498
|
-
}
|
|
2499
|
-
/**
|
|
2500
|
-
* Liste deroulante, sur un `select` NATIF.
|
|
2501
|
-
*
|
|
2502
|
-
* ```html
|
|
2503
|
-
* <st-select libelle="Pays" [options]="pays" autocomplete="country" [formField]="adresse.pays" />
|
|
2504
|
-
* ```
|
|
2505
|
-
*
|
|
2506
|
-
* ⚠️ **Natif, et non une liste ARIA** (FE-4). Le `select` natif ouvre le selecteur
|
|
2507
|
-
* du systeme sur mobile, se remplit automatiquement, se parcourt a la lettre, et
|
|
2508
|
-
* se lit partout. Une liste recomposee en ARIA ne fait jamais mieux sur ces
|
|
2509
|
-
* points ; elle ne se justifie que pour filtrer une longue liste — c'est
|
|
2510
|
-
* `st-combobox` — ou choisir plusieurs valeurs — `st-multiselect`.
|
|
2511
|
-
*
|
|
2512
|
-
* La premiere option, vide, dit « Choisir… » : sans elle, la premiere vraie
|
|
2513
|
-
* option paraitrait choisie alors que personne ne l'a fait. Le modele vaut
|
|
2514
|
-
* alors `''`, que `required` refuse.
|
|
2515
|
-
*
|
|
2516
|
-
* `readonly` n'existe pas sur un `select` : le champ annonce `aria-readonly` et
|
|
2517
|
-
* ignore le changement, plutot que d'etre desactive — un champ desactive sort de
|
|
2518
|
-
* l'ordre de tabulation, et sa valeur ne se lit plus.
|
|
2519
|
-
*/
|
|
2520
|
-
declare class StSelect extends ControleDeSaisie {
|
|
2521
|
-
protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
|
|
2522
|
-
readonly options: _angular_core.InputSignal<readonly OptionDeListe[]>;
|
|
2523
|
-
/** Texte de l'option vide. Par defaut : « Choisir… ». */
|
|
2524
|
-
readonly texteVide: _angular_core.InputSignal<string | null>;
|
|
2525
|
-
/** WCAG 1.3.5 : `country`, `sex`, `honorific-prefix`… */
|
|
2526
|
-
readonly autocomplete: _angular_core.InputSignal<string | null>;
|
|
2527
|
-
/** Options consecutives d'un meme groupe, dans l'ordre fourni. */
|
|
2528
|
-
protected readonly blocs: _angular_core.Signal<readonly BlocDOptions[]>;
|
|
2529
|
-
protected surChoix(evenement: Event): void;
|
|
2530
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StSelect, never>;
|
|
2531
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StSelect, "st-select", never, { "options": { "alias": "options"; "required": true; "isSignal": true; }; "texteVide": { "alias": "texteVide"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2532
|
-
}
|
|
2533
|
-
|
|
2534
|
-
interface Jour {
|
|
2535
|
-
readonly date: DateIso;
|
|
2536
|
-
/** Jour d'un mois voisin : cellule vide, la date vit dans son propre mois. */
|
|
2537
|
-
readonly horsDuMois: boolean;
|
|
2538
|
-
readonly numero: string;
|
|
2539
|
-
readonly nom: string;
|
|
2540
|
-
readonly horsBornes: boolean;
|
|
2541
|
-
readonly choisi: boolean;
|
|
2542
|
-
readonly dansLaPlage: boolean;
|
|
2543
|
-
readonly aujourdHui: boolean;
|
|
2544
|
-
}
|
|
2545
|
-
/**
|
|
2546
|
-
* Calendrier d'un mois, pour choisir une date.
|
|
2547
|
-
*
|
|
2548
|
-
* ```html
|
|
2549
|
-
* <st-calendar [selection]="depart()" dateMin="2026-09-17" (choix)="depart.set($event)" />
|
|
2550
|
-
* ```
|
|
2551
|
-
*
|
|
2552
|
-
* ⚠️ **Une aide, jamais la seule voie.** Dans `st-date-field`, le calendrier
|
|
2553
|
-
* complete un champ texte : une date de naissance se tape plus vite qu'elle ne se
|
|
2554
|
-
* cherche mois par mois, et un calendrier reste penible au lecteur d'ecran.
|
|
2555
|
-
*
|
|
2556
|
-
* ⚠️ **Le clavier navigue de DATE en date, pas de cellule en cellule** (decision
|
|
2557
|
-
* D7 de l'audit de la vague 3). Fleche droite le 30 septembre mene au 1er
|
|
2558
|
-
* octobre ; Page suivante change de mois, Maj + Page d'annee ; Debut et Fin vont
|
|
2559
|
-
* aux bords de la semaine de la LOCALE. La grille d'Angular Aria deplace un focus
|
|
2560
|
-
* entre cellules affichees : il aurait fallu la contourner sur chaque touche qui
|
|
2561
|
-
* compte, et elle aurait fait entrer le CDK dans les formulaires.
|
|
2562
|
-
*
|
|
2563
|
-
* Semaine commencant au jour de la locale, noms de jours et de mois dans la
|
|
2564
|
-
* langue courante, « aujourd'hui » dans le fuseau de la personne
|
|
2565
|
-
* (`FUSEAU_PAR_DEFAUT`) et non celui du poste.
|
|
2566
|
-
*/
|
|
2567
|
-
declare class StCalendar {
|
|
2568
|
-
protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
|
|
2569
|
-
private readonly locale;
|
|
2570
|
-
private readonly element;
|
|
2571
|
-
private readonly injecteur;
|
|
2572
|
-
private readonly aujourdHui;
|
|
2573
|
-
readonly selection: _angular_core.InputSignal<string | null>;
|
|
2574
|
-
readonly dateMin: _angular_core.InputSignal<string | null>;
|
|
2575
|
-
readonly dateMax: _angular_core.InputSignal<string | null>;
|
|
2576
|
-
/** Periode a faire ressortir, pour un choix de plage. */
|
|
2577
|
-
readonly plage: _angular_core.InputSignal<PlageDeDates | null>;
|
|
2578
|
-
readonly choix: _angular_core.OutputEmitterRef<string>;
|
|
2579
|
-
/** Echap : le conteneur decide de fermer, et ou rendre le focus. */
|
|
2580
|
-
readonly fermeture: _angular_core.OutputEmitterRef<void>;
|
|
2581
|
-
protected readonly identifiants: {
|
|
2582
|
-
readonly titre: `${string}-titre`;
|
|
2583
|
-
readonly aide: `${string}-aide`;
|
|
2584
|
-
};
|
|
2585
|
-
/** La date qui porte le focus. Suit la selection, bornee. */
|
|
2586
|
-
private readonly active;
|
|
2587
|
-
private readonly premierJour;
|
|
2588
|
-
protected readonly titre: _angular_core.Signal<string>;
|
|
2589
|
-
protected readonly joursDeLaSemaine: _angular_core.Signal<{
|
|
2590
|
-
court: string;
|
|
2591
|
-
long: string;
|
|
2592
|
-
}[]>;
|
|
2593
|
-
protected readonly semaines: _angular_core.Signal<readonly (readonly Jour[])[]>;
|
|
2594
|
-
protected readonly moisPrecedentPossible: _angular_core.Signal<boolean>;
|
|
2595
|
-
protected readonly moisSuivantPossible: _angular_core.Signal<boolean>;
|
|
2596
|
-
protected estActive(date: DateIso): boolean;
|
|
2597
|
-
/** Amene le focus sur la date active. */
|
|
2598
|
-
focus(): void;
|
|
2599
|
-
protected changerDeMois(ecart: number): void;
|
|
2600
|
-
protected choisir(jour: Jour): void;
|
|
2601
|
-
protected surTouche(evenement: KeyboardEvent): void;
|
|
2602
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StCalendar, never>;
|
|
2603
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StCalendar, "st-calendar", never, { "selection": { "alias": "selection"; "required": false; "isSignal": true; }; "dateMin": { "alias": "dateMin"; "required": false; "isSignal": true; }; "dateMax": { "alias": "dateMax"; "required": false; "isSignal": true; }; "plage": { "alias": "plage"; "required": false; "isSignal": true; }; }, { "choix": "choix"; "fermeture": "fermeture"; }, never, never, true, never>;
|
|
2604
|
-
}
|
|
2605
|
-
|
|
2606
|
-
/**
|
|
2607
|
-
* Cle d'un fichier choisi : deux choix du meme fichier ne l'ajoutent pas deux
|
|
2608
|
-
* fois, et l'application s'en sert pour dire ou en est chaque televersement.
|
|
2609
|
-
*/
|
|
2610
|
-
declare function cleDeFichier(fichier: File): string;
|
|
2611
|
-
/**
|
|
2612
|
-
* Ou en est un fichier, vu de l'application. `message` dit POURQUOI un fichier
|
|
2613
|
-
* est refuse — « antivirus indisponible » et « type refuse » n'appellent pas la
|
|
2614
|
-
* meme suite (UX-3 de la 0.6.0).
|
|
2615
|
-
*/
|
|
2616
|
-
interface EtatDeTeleversementAffiche {
|
|
2617
|
-
readonly etape: 'en-cours' | 'depose' | 'refuse';
|
|
2618
|
-
/** 0 a 100, pendant l'envoi. */
|
|
2619
|
-
readonly progression?: number;
|
|
2620
|
-
readonly message?: string;
|
|
2621
|
-
}
|
|
2622
|
-
/**
|
|
2623
|
-
* Choix de fichiers, sur un `input type="file"` natif.
|
|
2624
|
-
*
|
|
2625
|
-
* ```html
|
|
2626
|
-
* <st-file-upload libelle="Justificatifs" accept=".pdf, image/*" [tailleMax]="5_000_000" multiple
|
|
2627
|
-
* [formField]="dossier.pieces" />
|
|
2628
|
-
* <!-- schema : validate(chemin.pieces, ({ value }) => erreursDeFichiers(value(), regles)) -->
|
|
2629
|
-
* ```
|
|
2630
|
-
*
|
|
2631
|
-
* Le modele est la liste des `File` choisis. L'envoi appartient a l'application,
|
|
2632
|
-
* par `@starterlib/core` : le composant choisit, il ne televerse pas.
|
|
2633
|
-
*
|
|
2634
|
-
* ⚠️ **L'element natif reste la voie principale** (FE-4) : il ouvre le selecteur
|
|
2635
|
-
* du systeme, l'appareil photo sur mobile, et se commande au clavier. Il est
|
|
2636
|
-
* masque visuellement, pas retire : le bouton affiche est son etiquette. Le
|
|
2637
|
-
* depot par glisser est un complement a la souris, jamais la seule voie.
|
|
2638
|
-
*
|
|
2639
|
-
* ⚠️ **Aucun apercu d'image** (SEC-7). Un apercu passe par une adresse `blob:`
|
|
2640
|
-
* que la politique de securite du contenu doit autoriser, et un SVG affiche peut
|
|
2641
|
-
* porter du script. Le nom et la taille suffisent a reconnaitre un fichier.
|
|
2642
|
-
*
|
|
2643
|
-
* ⚠️ **`accept`, `tailleMax` et `nombreMax` sont un confort** (SEC-5) : ils
|
|
2644
|
-
* s'affichent en aide et filtrent le selecteur du systeme, mais la verification
|
|
2645
|
-
* est dans le schema — `erreursDeFichiers` —, et le serveur relit le contenu.
|
|
2646
|
-
*
|
|
2647
|
-
* Chaque changement de la liste s'annonce : « 2 fichiers choisis ». Un fichier
|
|
2648
|
-
* retire rend le focus au bouton de retrait suivant, ou au choix de fichiers : le
|
|
2649
|
-
* focus ne tombe jamais sur le document.
|
|
2650
|
-
*
|
|
2651
|
-
* ⚠️ **Il ne televerse pas.** `etats` dit ou en est chaque fichier, et le bouton
|
|
2652
|
-
* de la ligne devient « Annuler » pendant l'envoi : le trajet — declaration, depot
|
|
2653
|
-
* pre-signe, confirmation antivirus — vit dans `StTeleversement`
|
|
2654
|
-
* (`@starterlib/core`), seul a parler au reseau.
|
|
2655
|
-
*/
|
|
2656
|
-
declare class StFileUpload extends ContratDeChamp implements FormValueControl<readonly File[]> {
|
|
2657
|
-
protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
|
|
2658
|
-
private readonly locale;
|
|
2659
|
-
private readonly element;
|
|
2660
|
-
private readonly injecteur;
|
|
2661
|
-
readonly value: _angular_core.ModelSignal<readonly File[]>;
|
|
2662
|
-
/** Attribut `accept` natif : `.pdf, image/*`. */
|
|
2663
|
-
readonly accept: _angular_core.InputSignal<string>;
|
|
2664
|
-
readonly multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2665
|
-
/** En octets. Affiche en aide ; la verification est dans le schema. */
|
|
2666
|
-
readonly tailleMax: _angular_core.InputSignal<number | null>;
|
|
2667
|
-
/**
|
|
2668
|
-
* Ou en est chaque fichier, par `cleDeFichier`. Le composant AFFICHE ce trajet,
|
|
2669
|
-
* il ne le fait pas : `StTeleversement` de `@starterlib/core` s'en charge.
|
|
2670
|
-
*/
|
|
2671
|
-
readonly etats: _angular_core.InputSignal<ReadonlyMap<string, EtatDeTeleversementAffiche> | null>;
|
|
2672
|
-
protected readonly annonce: AnnonceLocale;
|
|
2673
|
-
protected readonly survol: _angular_core.WritableSignal<boolean>;
|
|
2674
|
-
protected readonly aideLue: _angular_core.Signal<string | null>;
|
|
2675
|
-
protected readonly lignes: _angular_core.Signal<{
|
|
2676
|
-
fichier: File;
|
|
2677
|
-
cle: string;
|
|
2678
|
-
taille: string;
|
|
2679
|
-
etat: EtatDeTeleversementAffiche | null;
|
|
2680
|
-
}[]>;
|
|
2681
|
-
protected surChoix(evenement: Event): void;
|
|
2682
|
-
protected surSurvol(evenement: DragEvent): void;
|
|
2683
|
-
protected surDepot(evenement: DragEvent): void;
|
|
2684
|
-
/** Emis quand la personne interrompt un envoi : c'est l'application qui annule. */
|
|
2685
|
-
readonly annulation: _angular_core.OutputEmitterRef<File>;
|
|
2686
|
-
protected retirer(indice: number): void;
|
|
2687
|
-
protected aLaSortie(evenement: FocusEvent): void;
|
|
2688
|
-
private ajouter;
|
|
2689
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StFileUpload, never>;
|
|
2690
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StFileUpload, "st-file-upload", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "accept": { "alias": "accept"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "tailleMax": { "alias": "tailleMax"; "required": false; "isSignal": true; }; "etats": { "alias": "etats"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "annulation": "annulation"; }, never, never, true, never>;
|
|
2691
|
-
}
|
|
2692
|
-
|
|
2693
|
-
/**
|
|
2694
|
-
* `pages` : page precedente et suivante, pour un tableau.
|
|
2695
|
-
* `suite` : « Afficher plus », pour une liste qui s'allonge.
|
|
2696
|
-
*/
|
|
2697
|
-
type ModeDePagination = 'pages' | 'suite';
|
|
2698
|
-
/** Ce qui peut recevoir le focus apres un changement de page. */
|
|
2699
|
-
interface Focalisable {
|
|
2700
|
-
focus(options?: FocusOptions): void;
|
|
2701
|
-
}
|
|
2702
|
-
/**
|
|
2703
|
-
* Pagination d'une liste par curseur.
|
|
2704
|
-
*
|
|
2705
|
-
* ```html
|
|
2706
|
-
* <st-data-table #tableau … />
|
|
2707
|
-
* <st-pagination
|
|
2708
|
-
* [numero]="navigation.numeroDePage()"
|
|
2709
|
-
* [precedenteDisponible]="navigation.precedenteDisponible()"
|
|
2710
|
-
* [suivanteDisponible]="page.value()?.hasMore ?? false"
|
|
2711
|
-
* [chargement]="page.isLoading()"
|
|
2712
|
-
* [cible]="tableau"
|
|
2713
|
-
* (precedente)="navigation.precedente()"
|
|
2714
|
-
* (suivante)="navigation.suivante(page.value())"
|
|
2715
|
-
* />
|
|
2716
|
-
* ```
|
|
2717
|
-
*
|
|
2718
|
-
* ⚠️ **Ni total, ni numeros cliquables** : le backend ne compte pas et ne va que
|
|
2719
|
-
* vers l'avant (audit de la vague 4, V4-2). « Page 3 » se dit ; « page 3 sur 12 »
|
|
2720
|
-
* serait invente.
|
|
2721
|
-
*
|
|
2722
|
-
* ⚠️ **Boutons indisponibles, jamais desactives** : sur la derniere page, « Page
|
|
2723
|
-
* suivante » garde le focus qu'il avait. Desactive, il le perdrait, et le lecteur
|
|
2724
|
-
* d'ecran retomberait sur le debut du document.
|
|
2725
|
-
*
|
|
2726
|
-
* ⚠️ **Apres un changement de page, le focus va a la `cible`** — la legende du
|
|
2727
|
-
* tableau — et « Page 2 » s'annonce (UX-13). Sans cela, la personne au clavier
|
|
2728
|
-
* reste en bas, sur « Page suivante », sans savoir que le contenu au-dessus a
|
|
2729
|
-
* change.
|
|
2730
|
-
*/
|
|
2731
|
-
declare class StPagination {
|
|
2732
|
-
protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
|
|
2733
|
-
private readonly injecteur;
|
|
2734
|
-
readonly mode: _angular_core.InputSignal<ModeDePagination>;
|
|
2735
|
-
/** A partir de 1. */
|
|
2736
|
-
readonly numero: _angular_core.InputSignal<number>;
|
|
2737
|
-
readonly precedenteDisponible: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2738
|
-
readonly suivanteDisponible: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2739
|
-
readonly chargement: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2740
|
-
/** Nom de la navigation, quand une page en porte plusieurs. */
|
|
2741
|
-
readonly etiquette: _angular_core.InputSignal<string | null>;
|
|
2742
|
-
/** Tailles proposees ; vide, pas de choix. Plafonnees a 100. */
|
|
2743
|
-
readonly taillesDePage: _angular_core.InputSignal<readonly number[]>;
|
|
2744
|
-
readonly taille: _angular_core.ModelSignal<number>;
|
|
2745
|
-
/** Recoit le focus apres un changement de page. */
|
|
2746
|
-
readonly cible: _angular_core.InputSignal<Focalisable | (() => Focalisable | null) | null>;
|
|
2747
|
-
readonly precedente: _angular_core.OutputEmitterRef<void>;
|
|
2748
|
-
readonly suivante: _angular_core.OutputEmitterRef<void>;
|
|
2749
|
-
protected readonly annonce: AnnonceLocale;
|
|
2750
|
-
protected readonly tailles: _angular_core.Signal<number[]>;
|
|
2751
|
-
protected readonly etiquetteLue: _angular_core.Signal<string>;
|
|
2752
|
-
constructor();
|
|
2753
|
-
protected surTaille(evenement: Event): void;
|
|
2754
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StPagination, never>;
|
|
2755
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StPagination, "st-pagination", never, { "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "numero": { "alias": "numero"; "required": false; "isSignal": true; }; "precedenteDisponible": { "alias": "precedenteDisponible"; "required": false; "isSignal": true; }; "suivanteDisponible": { "alias": "suivanteDisponible"; "required": false; "isSignal": true; }; "chargement": { "alias": "chargement"; "required": false; "isSignal": true; }; "etiquette": { "alias": "etiquette"; "required": false; "isSignal": true; }; "taillesDePage": { "alias": "taillesDePage"; "required": false; "isSignal": true; }; "taille": { "alias": "taille"; "required": false; "isSignal": true; }; "cible": { "alias": "cible"; "required": false; "isSignal": true; }; }, { "taille": "tailleChange"; "precedente": "precedente"; "suivante": "suivante"; }, never, never, true, never>;
|
|
2756
|
-
}
|
|
2757
|
-
|
|
2758
|
-
/** Une paire terme et valeur. `description` nulle : « Non renseigne ». */
|
|
2759
|
-
interface ElementDeDescription {
|
|
2760
|
-
/** Relie l'element a un gabarit `stDescription`. Par defaut : le terme. */
|
|
2761
|
-
readonly cle?: string;
|
|
2762
|
-
readonly terme: string;
|
|
2763
|
-
readonly description: string | null;
|
|
2764
|
-
}
|
|
2765
|
-
/** Contexte d'un gabarit de description. */
|
|
2766
|
-
interface ContexteDeDescription {
|
|
2767
|
-
readonly $implicit: ElementDeDescription;
|
|
2768
|
-
}
|
|
2769
|
-
/**
|
|
2770
|
-
* Valeur riche d'un element : montant, date, valeur masquee.
|
|
2771
|
-
*
|
|
2772
|
-
* ```html
|
|
2773
|
-
* <ng-template stDescription="iban" let-element>
|
|
2774
|
-
* <st-masked nature="iban" [valeur]="compte().iban" />
|
|
2775
|
-
* </ng-template>
|
|
2776
|
-
* ```
|
|
2777
|
-
*/
|
|
2778
|
-
declare class StDescription {
|
|
2779
|
-
readonly cle: _angular_core.InputSignal<string>;
|
|
2780
|
-
readonly gabarit: TemplateRef<ContexteDeDescription>;
|
|
2781
|
-
static ngTemplateContextGuard(_directive: StDescription, _contexte: unknown): _contexte is ContexteDeDescription;
|
|
2782
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StDescription, never>;
|
|
2783
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<StDescription, "ng-template[stDescription]", never, { "cle": { "alias": "stDescription"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2784
|
-
}
|
|
2785
|
-
/**
|
|
2786
|
-
* Liste de descriptions : les proprietes d'un objet, sur une page de detail.
|
|
2787
|
-
*
|
|
2788
|
-
* ```html
|
|
2789
|
-
* <st-description-list [elements]="[
|
|
2790
|
-
* { terme: 'Reference', description: commande().reference },
|
|
2791
|
-
* { cle: 'montant', terme: 'Montant', description: null },
|
|
2792
|
-
* ]">
|
|
2793
|
-
* <ng-template stDescription="montant"><st-money [valeur]="commande().montant" /></ng-template>
|
|
2794
|
-
* </st-description-list>
|
|
2795
|
-
* ```
|
|
2796
|
-
*
|
|
2797
|
-
* ⚠️ **Un vrai `dl`, rendu par le composant.** Le lecteur d'ecran annonce « liste de
|
|
2798
|
-
* descriptions, 4 elements » et lit chaque terme avec sa valeur. Ecrits par
|
|
2799
|
-
* l'application et projetes, `dt` et `dd` echapperaient aux styles du composant,
|
|
2800
|
-
* et un `div` mal place rendrait la liste invalide.
|
|
2801
|
-
*
|
|
2802
|
-
* ⚠️ **Une valeur absente se dit** : « — » a l'ecran, « Non renseigne » au lecteur
|
|
2803
|
-
* d'ecran. Une cellule vide ne distingue pas « aucun » de « pas encore charge ».
|
|
2804
|
-
*
|
|
2805
|
-
* En colonnes quand la place le permet, empile en dessous : la largeur est celle
|
|
2806
|
-
* du CONTENEUR, pas de l'ecran — la meme liste dans une carte etroite s'empile
|
|
2807
|
-
* aussi sur un grand ecran (UX-18).
|
|
2808
|
-
*/
|
|
2809
|
-
declare class StDescriptionList {
|
|
2810
|
-
protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
|
|
2811
|
-
readonly elements: _angular_core.InputSignal<readonly ElementDeDescription[]>;
|
|
2812
|
-
private readonly gabarits;
|
|
2813
|
-
protected readonly lignes: _angular_core.Signal<{
|
|
2814
|
-
element: ElementDeDescription;
|
|
2815
|
-
gabarit: TemplateRef<ContexteDeDescription> | null;
|
|
2816
|
-
}[]>;
|
|
2817
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StDescriptionList, never>;
|
|
2818
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StDescriptionList, "st-description-list", never, { "elements": { "alias": "elements"; "required": true; "isSignal": true; }; }, {}, ["gabarits"], never, true, never>;
|
|
2819
|
-
}
|
|
2820
|
-
|
|
2821
|
-
/** Contexte d'un gabarit d'element de liste. */
|
|
2822
|
-
interface ContexteDElementDeListe<T> {
|
|
2823
|
-
readonly $implicit: T;
|
|
2824
|
-
readonly indice: number;
|
|
2825
|
-
}
|
|
2826
|
-
/**
|
|
2827
|
-
* Rendu d'un element, type par `[stElementDeListeDe]` :
|
|
2828
|
-
*
|
|
2829
|
-
* ```html
|
|
2830
|
-
* <ng-template stElementDeListe [stElementDeListeDe]="expeditions()" let-expedition>
|
|
2831
|
-
* <a [routerLink]="['/expeditions', expedition.id]">{{ expedition.reference }}</a>
|
|
2832
|
-
* </ng-template>
|
|
2833
|
-
* ```
|
|
2834
|
-
*/
|
|
2835
|
-
declare class StElementDeListe<T> {
|
|
2836
|
-
/** Sert seulement au typage du contexte ; nom de l'attribut, d'ou l'absence d'alias. */
|
|
2837
|
-
readonly stElementDeListeDe: _angular_core.InputSignal<readonly T[] | null | undefined>;
|
|
2838
|
-
readonly gabarit: TemplateRef<ContexteDElementDeListe<T>>;
|
|
2839
|
-
static ngTemplateContextGuard<T>(_directive: StElementDeListe<T>, _contexte: unknown): _contexte is ContexteDElementDeListe<T>;
|
|
2840
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StElementDeListe<any>, never>;
|
|
2841
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<StElementDeListe<any>, "ng-template[stElementDeListe]", never, { "stElementDeListeDe": { "alias": "stElementDeListeDe"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2842
|
-
}
|
|
2843
|
-
/**
|
|
2844
|
-
* Liste d'objets : expeditions, notifications, documents. La forme mobile d'un
|
|
2845
|
-
* tableau (UX-5).
|
|
2846
|
-
*
|
|
2847
|
-
* ```html
|
|
2848
|
-
* <st-list #liste etiquette="Mes expeditions" [elements]="expeditions()" cle="id">
|
|
2849
|
-
* <ng-template stElementDeListe [stElementDeListeDe]="expeditions()" let-expedition>…</ng-template>
|
|
2850
|
-
* </st-list>
|
|
2851
|
-
* <st-pagination mode="suite" [cible]="liste" … />
|
|
2852
|
-
* ```
|
|
2853
|
-
*
|
|
2854
|
-
* ⚠️ **Un lien DANS l'element, jamais un element cliquable** (UX-3) : le lien a un
|
|
2855
|
-
* nom, s'ouvre dans un onglet, et laisse les autres boutons de l'element
|
|
2856
|
-
* atteignables.
|
|
2857
|
-
*
|
|
2858
|
-
* ⚠️ **`focus()` va au premier element AJOUTE** depuis le dernier affichage : apres
|
|
2859
|
-
* « Afficher plus », la lecture reprend la ou la liste s'est allongee, et non en
|
|
2860
|
-
* tete. Apres un filtre, la liste raccourcit, et le focus va au premier element.
|
|
2861
|
-
*
|
|
2862
|
-
* `track` par la cle : un rafraichissement garde le focus sur le bon element.
|
|
2863
|
-
*/
|
|
2864
|
-
declare class StList<T> {
|
|
2865
|
-
private readonly element;
|
|
2866
|
-
readonly elements: _angular_core.InputSignal<readonly T[]>;
|
|
2867
|
-
/** Propriete qui identifie un element. */
|
|
2868
|
-
readonly cle: _angular_core.InputSignal<keyof T & string>;
|
|
2869
|
-
/** Nom de la liste, lu a l'entree. */
|
|
2870
|
-
readonly etiquette: _angular_core.InputSignal<string | null>;
|
|
2871
|
-
/** `ol` quand l'ordre a un sens : etapes, classement. */
|
|
2872
|
-
readonly ordonnee: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2873
|
-
/** Contenu en cours de remplacement : `aria-busy`. */
|
|
2874
|
-
readonly chargement: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2875
|
-
protected readonly gabarit: _angular_core.Signal<StElementDeListe<any> | undefined>;
|
|
2876
|
-
private indiceDuPremierAjout;
|
|
2877
|
-
protected readonly lignes: _angular_core.Signal<{
|
|
2878
|
-
valeur: T;
|
|
2879
|
-
indice: number;
|
|
2880
|
-
identifiant: string;
|
|
2881
|
-
}[]>;
|
|
2882
|
-
constructor();
|
|
2883
|
-
/** Focus sur le premier element ajoute, ou sur le premier. */
|
|
2884
|
-
focus(options?: FocusOptions): void;
|
|
2885
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StList<any>, never>;
|
|
2886
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StList<any>, "st-list", never, { "elements": { "alias": "elements"; "required": true; "isSignal": true; }; "cle": { "alias": "cle"; "required": true; "isSignal": true; }; "etiquette": { "alias": "etiquette"; "required": false; "isSignal": true; }; "ordonnee": { "alias": "ordonnee"; "required": false; "isSignal": true; }; "chargement": { "alias": "chargement"; "required": false; "isSignal": true; }; }, {}, ["gabarit"], never, true, never>;
|
|
2887
|
-
}
|
|
2888
|
-
|
|
2889
|
-
type SensDeTri = 'croissant' | 'decroissant';
|
|
2890
|
-
/**
|
|
2891
|
-
* Bouton de tri d'une colonne, pose DANS l'en-tete : `<th><button stSortHeader>`.
|
|
2892
|
-
*
|
|
2893
|
-
* ⚠️ **Le bouton, pas l'en-tete cliquable** : un `th` n'est ni focalisable ni
|
|
2894
|
-
* annonce comme actionnable. Et l'etat se porte par `aria-sort` sur le `th`, que
|
|
2895
|
-
* `st-data-table` pose sur la SEULE colonne triee (FE-3).
|
|
2896
|
-
*
|
|
2897
|
-
* ⚠️ **Ne trie rien.** Il dit l'intention ; c'est le serveur qui trie, et le
|
|
2898
|
-
* contrat actuel ne le fait pas (audit de la vague 4, V4-3). Trier la page
|
|
2899
|
-
* affichee ferait croire a un tri de toute la liste.
|
|
2900
|
-
*
|
|
2901
|
-
* Une colonne non triee montre deux chevrons, pour se signaler triable sans
|
|
2902
|
-
* attendre le survol ; l'icone est decorative, l'etat est lu par `aria-sort`.
|
|
2903
|
-
*/
|
|
2904
|
-
declare class StSortHeader {
|
|
2905
|
-
readonly sens: _angular_core.InputSignal<SensDeTri | null>;
|
|
2906
|
-
protected readonly icone: _angular_core.Signal<"copie" | "boite-vide" | "calendrier" | "cercle" | "cercle-coche" | "cercle-croix" | "cercle-info" | "chevron-bas" | "chevron-droite" | "chevron-gauche" | "chevron-haut" | "coche" | "corbeille" | "croix" | "fichier" | "hors-ligne" | "lien-externe" | "menu" | "oeil" | "oeil-barre" | "plus" | "rafraichir" | "recherche" | "serveur" | "televerser" | "tri" | "triangle-alerte" | "utilisateur">;
|
|
2907
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StSortHeader, never>;
|
|
2908
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StSortHeader, "button[stSortHeader]", never, { "sens": { "alias": "sens"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
2909
|
-
}
|
|
2910
|
-
|
|
2911
|
-
/** Une colonne, decrite en donnees. */
|
|
2912
|
-
interface ColonneDeTableau {
|
|
2913
|
-
/** Identifie la colonne ; par defaut, la propriete affichee. */
|
|
2914
|
-
readonly cle: string;
|
|
2915
|
-
readonly libelle: string;
|
|
2916
|
-
/** `fin` pour les nombres et les montants (UX-4). */
|
|
2917
|
-
readonly alignement?: 'debut' | 'fin';
|
|
2918
|
-
/** Seulement si le SERVEUR trie sur cette colonne (V4-3). */
|
|
2919
|
-
readonly triable?: boolean;
|
|
2920
|
-
/** Libelle lu mais non affiche : colonne d'actions. Jamais vide. */
|
|
2921
|
-
readonly libelleMasque?: boolean;
|
|
2922
|
-
}
|
|
2923
|
-
interface TriDeTableau {
|
|
2924
|
-
readonly cle: string;
|
|
2925
|
-
readonly sens: SensDeTri;
|
|
2926
|
-
}
|
|
2927
|
-
type DensiteDeTableau = 'confortable' | 'compacte';
|
|
2928
|
-
/** Contexte d'un gabarit de cellule. */
|
|
2929
|
-
interface ContexteDeCellule<T> {
|
|
2930
|
-
readonly $implicit: T;
|
|
2931
|
-
readonly colonne: ColonneDeTableau;
|
|
2932
|
-
}
|
|
2933
|
-
/**
|
|
2934
|
-
* Rendu d'une cellule, type par `[stCelluleDe]` :
|
|
2935
|
-
*
|
|
2936
|
-
* ```html
|
|
2937
|
-
* <ng-template stCellule="montant" [stCelluleDe]="lignes()" let-ligne>
|
|
2938
|
-
* <st-money [valeur]="ligne.montant" />
|
|
2939
|
-
* </ng-template>
|
|
2940
|
-
* ```
|
|
2941
|
-
*/
|
|
2942
|
-
declare class StCellule<T> {
|
|
2943
|
-
readonly cle: _angular_core.InputSignal<string>;
|
|
2944
|
-
/** Sert seulement au typage du contexte ; nom de l'attribut, d'ou l'absence d'alias. */
|
|
2945
|
-
readonly stCelluleDe: _angular_core.InputSignal<readonly T[] | null | undefined>;
|
|
2946
|
-
readonly gabarit: TemplateRef<ContexteDeCellule<T>>;
|
|
2947
|
-
static ngTemplateContextGuard<T>(_directive: StCellule<T>, _contexte: unknown): _contexte is ContexteDeCellule<T>;
|
|
2948
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StCellule<any>, never>;
|
|
2949
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<StCellule<any>, "ng-template[stCellule]", never, { "cle": { "alias": "stCellule"; "required": true; "isSignal": true; }; "stCelluleDe": { "alias": "stCelluleDe"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
2950
|
-
}
|
|
2951
|
-
/** Contenu du tableau vide : un `st-empty`, avec son action. */
|
|
2952
|
-
declare class StTableauVide {
|
|
2953
|
-
readonly gabarit: TemplateRef<unknown>;
|
|
2954
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StTableauVide, never>;
|
|
2955
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<StTableauVide, "ng-template[stTableauVide]", never, {}, {}, never, never, true, never>;
|
|
2956
|
-
}
|
|
2957
|
-
/**
|
|
2958
|
-
* Tableau de donnees, sur un `<table>` NATIF.
|
|
2959
|
-
*
|
|
2960
|
-
* ```html
|
|
2961
|
-
* <st-data-table #tableau legende="Expeditions" [colonnes]="colonnes" [lignes]="lignes()"
|
|
2962
|
-
* cle="id" selectionnable [(selection)]="choisies" [chargement]="page.isLoading()">
|
|
2963
|
-
* <ng-template stCellule="reference" [stCelluleDe]="lignes()" let-ligne>
|
|
2964
|
-
* <a [routerLink]="['/expeditions', ligne.id]">{{ ligne.reference }}</a>
|
|
2965
|
-
* </ng-template>
|
|
2966
|
-
* <button stButton stActionsDeTableau (click)="exporter()">Exporter</button>
|
|
2967
|
-
* </st-data-table>
|
|
2968
|
-
* ```
|
|
2969
|
-
*
|
|
2970
|
-
* ⚠️ **Un tableau, pas une grille** (audit de la vague 4, V4-1). Le lecteur d'ecran
|
|
2971
|
-
* sait parcourir un `<table>` de cellule en cellule ; une grille ARIA remplacerait
|
|
2972
|
-
* ce parcours par les fleches, et rendrait les liens des cellules plus durs a
|
|
2973
|
-
* atteindre. Ni Material, ni `CdkTable` : pas de pair dans le tronc.
|
|
2974
|
-
*
|
|
2975
|
-
* - **Legende obligatoire** (UX-1), et une colonne d'en-tete de ligne — la premiere
|
|
2976
|
-
* par defaut — pour que chaque cellule se lise avec sa ligne (UX-2).
|
|
2977
|
-
* - **Zone de defilement nommee** : focalisable quand le tableau deborde (UX-6),
|
|
2978
|
-
* colonne figee sans masquer le focus (UX-7), en-tete fige seulement avec
|
|
2979
|
-
* `hauteurMax` (UX-8).
|
|
2980
|
-
* - **Selection de la PAGE, par cle** (V4-4) : elle ne garde que les lignes encore
|
|
2981
|
-
* affichees, et se vide donc au changement de page.
|
|
2982
|
-
* - **Tri PILOTE** : le tableau dit la demande et l'annonce, il ne reordonne
|
|
2983
|
-
* jamais les lignes (V4-3).
|
|
2984
|
-
* - **Chargement** : squelette au premier, lignes gardees et `aria-busy` ensuite
|
|
2985
|
-
* (UX-11).
|
|
2986
|
-
* - Export, actions de masse : zone `stActionsDeTableau`, et le SERVEUR fait le
|
|
2987
|
-
* travail (V4-5, SEC-4, SEC-5).
|
|
2988
|
-
*/
|
|
2989
|
-
declare class StDataTable<T> {
|
|
2990
|
-
protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
|
|
2991
|
-
readonly legende: _angular_core.InputSignal<string>;
|
|
2992
|
-
/** Lue mais non affichee, quand un titre visible nomme deja le tableau. */
|
|
2993
|
-
readonly legendeMasquee: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2994
|
-
readonly colonnes: _angular_core.InputSignal<readonly ColonneDeTableau[]>;
|
|
2995
|
-
readonly lignes: _angular_core.InputSignal<readonly T[]>;
|
|
2996
|
-
/** Propriete qui identifie une ligne. Jamais l'indice (FE-1). */
|
|
2997
|
-
readonly cle: _angular_core.InputSignal<keyof T & string>;
|
|
2998
|
-
/** Colonne lue comme en-tete de chaque ligne. Par defaut : la premiere. */
|
|
2999
|
-
readonly enTeteDeLigne: _angular_core.InputSignal<string | null>;
|
|
3000
|
-
readonly premiereColonneFigee: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3001
|
-
/** Hauteur maximale, `32rem` : l'en-tete se fige, le corps defile. */
|
|
3002
|
-
readonly hauteurMax: _angular_core.InputSignal<string | null>;
|
|
3003
|
-
readonly densite: _angular_core.InputSignal<DensiteDeTableau>;
|
|
3004
|
-
readonly chargement: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3005
|
-
readonly selectionnable: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3006
|
-
readonly selection: _angular_core.ModelSignal<readonly string[]>;
|
|
3007
|
-
readonly tri: _angular_core.ModelSignal<TriDeTableau | null>;
|
|
3008
|
-
/** Texte du tableau vide, sans gabarit `stTableauVide`. */
|
|
3009
|
-
readonly texteVide: _angular_core.InputSignal<string | null>;
|
|
3010
|
-
private readonly gabarits;
|
|
3011
|
-
protected readonly gabaritVide: _angular_core.Signal<StTableauVide | undefined>;
|
|
3012
|
-
private readonly zone;
|
|
3013
|
-
protected readonly annonce: AnnonceLocale;
|
|
3014
|
-
protected readonly deborde: _angular_core.WritableSignal<boolean>;
|
|
3015
|
-
protected readonly largeurFigee: _angular_core.WritableSignal<number>;
|
|
3016
|
-
protected readonly identifiants: {
|
|
3017
|
-
readonly legende: `${string}-legende`;
|
|
3018
|
-
readonly selection: `${string}-selection`;
|
|
3019
|
-
};
|
|
3020
|
-
protected readonly cleDEnTete: _angular_core.Signal<string>;
|
|
3021
|
-
protected readonly cellules: _angular_core.Signal<{
|
|
3022
|
-
colonne: ColonneDeTableau;
|
|
3023
|
-
gabarit: TemplateRef<ContexteDeCellule<any>> | null;
|
|
3024
|
-
enTete: boolean;
|
|
3025
|
-
}[]>;
|
|
3026
|
-
protected readonly rangees: _angular_core.Signal<{
|
|
3027
|
-
valeur: T;
|
|
3028
|
-
identifiant: string;
|
|
3029
|
-
nom: string | null;
|
|
3030
|
-
choisie: boolean;
|
|
3031
|
-
}[]>;
|
|
3032
|
-
protected readonly squelette: _angular_core.Signal<number[]>;
|
|
3033
|
-
protected readonly nombreDeColonnes: _angular_core.Signal<number>;
|
|
3034
|
-
protected readonly colonnesDeSquelette: _angular_core.Signal<number[]>;
|
|
3035
|
-
protected readonly toutesChoisies: _angular_core.Signal<boolean>;
|
|
3036
|
-
protected readonly quelquesChoisies: _angular_core.Signal<boolean>;
|
|
3037
|
-
constructor();
|
|
3038
|
-
/** Amene le focus sur le tableau : sa legende est lue (UX-13). */
|
|
3039
|
-
focus(options?: FocusOptions): void;
|
|
3040
|
-
protected sensDe(colonne: ColonneDeTableau): SensDeTri | null;
|
|
3041
|
-
protected ariaSort(colonne: ColonneDeTableau): string | null;
|
|
3042
|
-
protected trier(colonne: ColonneDeTableau): void;
|
|
3043
|
-
protected basculerTout(): void;
|
|
3044
|
-
protected basculer(identifiant: string): void;
|
|
3045
|
-
protected texteDe(ligne: T, colonne: ColonneDeTableau): string | null;
|
|
3046
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StDataTable<any>, never>;
|
|
3047
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StDataTable<any>, "st-data-table", never, { "legende": { "alias": "legende"; "required": true; "isSignal": true; }; "legendeMasquee": { "alias": "legendeMasquee"; "required": false; "isSignal": true; }; "colonnes": { "alias": "colonnes"; "required": true; "isSignal": true; }; "lignes": { "alias": "lignes"; "required": true; "isSignal": true; }; "cle": { "alias": "cle"; "required": true; "isSignal": true; }; "enTeteDeLigne": { "alias": "enTeteDeLigne"; "required": false; "isSignal": true; }; "premiereColonneFigee": { "alias": "premiereColonneFigee"; "required": false; "isSignal": true; }; "hauteurMax": { "alias": "hauteurMax"; "required": false; "isSignal": true; }; "densite": { "alias": "densite"; "required": false; "isSignal": true; }; "chargement": { "alias": "chargement"; "required": false; "isSignal": true; }; "selectionnable": { "alias": "selectionnable"; "required": false; "isSignal": true; }; "selection": { "alias": "selection"; "required": false; "isSignal": true; }; "tri": { "alias": "tri"; "required": false; "isSignal": true; }; "texteVide": { "alias": "texteVide"; "required": false; "isSignal": true; }; }, { "selection": "selectionChange"; "tri": "triChange"; }, ["gabarits", "gabaritVide"], ["[stActionsDeTableau]"], true, never>;
|
|
3048
|
-
}
|
|
3049
|
-
|
|
3050
|
-
/**
|
|
3051
|
-
* Filtre actif, retirable : « Statut : Expediee ✕ ».
|
|
3052
|
-
*
|
|
3053
|
-
* ```html
|
|
3054
|
-
* <button stFilterChip libelle="Statut : Expediee" (click)="retirer('statut')"></button>
|
|
3055
|
-
* ```
|
|
3056
|
-
*
|
|
3057
|
-
* ⚠️ **Toute la puce est le bouton**, et son nom CONTIENT le texte visible —
|
|
3058
|
-
* « Retirer le filtre Statut : Expediee » (WCAG 2.5.3) : une commande vocale
|
|
3059
|
-
* « cliquer Statut » l'atteint. Une croix seule, a cote d'un texte inerte, serait
|
|
3060
|
-
* une cible de quelques pixels sans nom.
|
|
3061
|
-
*/
|
|
3062
|
-
declare class StFilterChip {
|
|
3063
|
-
private readonly libelles;
|
|
3064
|
-
readonly libelle: _angular_core.InputSignal<string>;
|
|
3065
|
-
protected readonly nom: _angular_core.Signal<string>;
|
|
3066
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StFilterChip, never>;
|
|
3067
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StFilterChip, "button[stFilterChip]", never, { "libelle": { "alias": "libelle"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
3068
|
-
}
|
|
3069
|
-
|
|
3070
|
-
/** Un filtre en vigueur, tel qu'il se lit : « Statut : Expediee ». */
|
|
3071
|
-
interface FiltreActif {
|
|
3072
|
-
readonly cle: string;
|
|
3073
|
-
readonly libelle: string;
|
|
3074
|
-
}
|
|
3075
|
-
/**
|
|
3076
|
-
* Barre de filtres : les champs, puis les filtres en vigueur, retirables.
|
|
3077
|
-
*
|
|
3078
|
-
* ```html
|
|
3079
|
-
* <st-filter-bar [filtresActifs]="actifs()" (retrait)="retirer($event)" (effacement)="effacer()">
|
|
3080
|
-
* <st-select libelle="Statut" [options]="statuts" [(value)]="statut" />
|
|
3081
|
-
* </st-filter-bar>
|
|
3082
|
-
* ```
|
|
3083
|
-
*
|
|
3084
|
-
* Un formulaire NOMME : repere « Filtres » dans la liste des reperes du lecteur
|
|
3085
|
-
* d'ecran. Pas un repere `search` : un `st-search-field` pose dedans en porte deja
|
|
3086
|
-
* un, et deux reperes imbriques se liraient en double.
|
|
3087
|
-
*
|
|
3088
|
-
* ⚠️ **Les filtres s'appliquent au changement**, par l'application : Entree dans
|
|
3089
|
-
* un champ n'envoie rien, et ne recharge pas la page.
|
|
3090
|
-
*
|
|
3091
|
-
* ⚠️ **Retirer un filtre rend le focus a la puce suivante**, sinon a la
|
|
3092
|
-
* precedente, sinon au formulaire ; « Effacer les filtres » le rend au formulaire
|
|
3093
|
-
* (UX-14). Le focus ne tombe jamais sur le document, et le retrait s'annonce.
|
|
3094
|
-
*
|
|
3095
|
-
* ⚠️ **Dans l'adresse, des valeurs d'enumeration seulement** (SEC-2) : un texte
|
|
3096
|
-
* cherche, un nom, un IBAN n'y vont pas. Le composant ne touche pas a l'adresse ;
|
|
3097
|
-
* la regle est pour l'application qui le ferait.
|
|
3098
|
-
*/
|
|
3099
|
-
declare class StFilterBar {
|
|
3100
|
-
protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
|
|
3101
|
-
private readonly element;
|
|
3102
|
-
private readonly injecteur;
|
|
3103
|
-
/** Nom du formulaire. Par defaut : « Filtres ». */
|
|
3104
|
-
readonly etiquette: _angular_core.InputSignal<string | null>;
|
|
3105
|
-
readonly filtresActifs: _angular_core.InputSignal<readonly FiltreActif[]>;
|
|
3106
|
-
readonly retrait: _angular_core.OutputEmitterRef<string>;
|
|
3107
|
-
readonly effacement: _angular_core.OutputEmitterRef<void>;
|
|
3108
|
-
protected readonly annonce: AnnonceLocale;
|
|
3109
|
-
protected readonly identifiantActifs: string;
|
|
3110
|
-
protected readonly etiquetteLue: _angular_core.Signal<string>;
|
|
3111
|
-
protected retirer(filtre: FiltreActif, indice: number): void;
|
|
3112
|
-
protected effacer(): void;
|
|
3113
|
-
private apresLeRendu;
|
|
3114
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StFilterBar, never>;
|
|
3115
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StFilterBar, "st-filter-bar", never, { "etiquette": { "alias": "etiquette"; "required": false; "isSignal": true; }; "filtresActifs": { "alias": "filtresActifs"; "required": false; "isSignal": true; }; }, { "retrait": "retrait"; "effacement": "effacement"; }, never, ["*"], true, never>;
|
|
3116
|
-
}
|
|
3117
|
-
|
|
3118
1552
|
/**
|
|
3119
1553
|
* Choix du theme : systeme, clair, sombre.
|
|
3120
1554
|
*
|
|
@@ -3446,5 +1880,5 @@ declare class StChargement {
|
|
|
3446
1880
|
/** Toutes les directives de gabarit, a importer d'un coup. */
|
|
3447
1881
|
declare const GABARITS_D_ETAT: readonly [typeof StSucces, typeof StErreur, typeof StVide, typeof StHorsLigne, typeof StChargement];
|
|
3448
1882
|
|
|
3449
|
-
export { AnnonceLocale, CHEMIN_DU_SPRITE,
|
|
3450
|
-
export type {
|
|
1883
|
+
export { AnnonceLocale, CHEMIN_DU_SPRITE, FUSEAU_PAR_DEFAUT, GABARITS_D_ETAT, IDENTIFIANT_DU_CONTENU_PRINCIPAL, LIBELLES_FR, NOMS_DICONE, PROPRIETE_HAUTEUR_ENTETE, REGION_VIVANTE_PARENTE, ST_LIBELLES, ST_LOCALE, StAppShell, StAuthShell, StAvatar, StBadge, StBanner, StBreadcrumb, StButton, StButtonGroup, StCard, StChargement, StCode, StCopyButton, StDivider, StEmpty, StErreur, StError, StFooter, StFormActions, StHeader, StHeading, StHorsLigne, StIcon, StIconButton, StInlineMessage, StLangSwitch, StLink, StLogo, StNavLink, StOfflineBanner, StPageHeader, StPageTitle, StProgress, StRouteProgress, StSection, StSettingsRow, StSkeleton, StSkipLink, StSpinner, StState, StStatusPill, StStepper, StSucces, StTag, StText, StThemeToggle, StTimer, StVide, copierDansLePressePapiers, formaterDuree, fournirCheminDuSprite, pressePapiersDisponible, provideStarterUi };
|
|
1884
|
+
export type { ConfigurationUi, EpaisseurDeProgression, EtapeDeParcours, EtatDEtape, GraisseDeTexte, IssueDeCopie, LibellesUi, MaillonDeFil, NiveauDeTitre, NomDIcone, OrientationDeSeparateur, ReliefDeCarte, RembourrageDeCarte, TailleDIcone, TailleDeBouton, TailleDeSpinner, TailleDeTitre, TonDIcone, TonDeBadge, TonDeBanniere, TonDeMessage, TonDeProgression, TonDeSpinner, TonDeStatut, VarianteDErreur, VarianteDeBouton, VarianteDeBoutonIcone, VarianteDeLien, VarianteDeSquelette, VarianteDeTexte };
|