@starterlib/ui 0.7.2 → 0.8.0

package/types/starterlib-ui-selection.d.ts

@@ -0,0 +1,112 @@
+import * as _angular_core from '@angular/core';
+import * as _starterlib_ui from '@starterlib/ui';
+import { AnnonceLocale } from '@starterlib/ui';
+import { ControleDeSaisie, OptionDeListe, ContratDeChamp } from '@starterlib/ui/saisie';
+import { FormValueControl } from '@angular/forms/signals';
+
+/** `local` : le composant filtre `options`. `distant` : l'application filtre, sur `recherche`. */
+type FiltrageDeListe = 'local' | 'distant';
+/**
+ * Liste de choix a filtrer en tapant, sur `@angular/aria/combobox` et
+ * `@angular/aria/listbox`.
+ *
+ * ```html
+ * <st-combobox libelle="Beneficiaire" [options]="beneficiaires" [formField]="virement.beneficiaire" />
+ * <!-- liste servie par le serveur : -->
+ * <st-combobox libelle="Commune" filtrage="distant" [options]="communes()"
+ *   (recherche)="terme.set($event)" [formField]="adresse.commune" />
+ * ```
+ *
+ * Le modele est la VALEUR de l'option choisie, `''` sans choix. Le texte tape ne
+ * part jamais dans le modele : « Pari » n'est pas une commune.
+ *
+ * ⚠️ **Pour une longue liste seulement.** Sous une vingtaine d'options,
+ * `st-select` — natif — est plus sur, et plus rapide sur mobile.
+ *
+ * - La liste s'ouvre a la frappe et a la fleche bas ; Entree choisit, Echap
+ *   ferme. Le focus reste dans le champ (`aria-activedescendant`).
+ * - Le nombre de resultats s'annonce apres la frappe, une fois : le lecteur
+ *   d'ecran ne voit pas la liste se reduire.
+ * - ⚠️ **Quitter le champ sans choisir rend le texte du choix precedent.** Un
+ *   texte qui ne correspond a aucune option ne reste pas affiche comme s'il etait
+ *   retenu ; un champ vide, lui, retire le choix.
+ * - La liste est posee dans la couche superieure du navigateur (`popover`) par le
+ *   CDK : un dialogue ou un tableau defilant ne la rogne pas.
+ *
+ * ⚠️ En `distant`, `recherche` est emis a chaque frappe : a l'application de
+ * temporiser, et de ne pas mettre le terme dans l'adresse (SEC-6).
+ */
+declare class StCombobox extends ControleDeSaisie {
+    protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
+    private readonly element;
+    private readonly injecteur;
+    readonly options: _angular_core.InputSignal<readonly OptionDeListe[]>;
+    readonly filtrage: _angular_core.InputSignal<FiltrageDeListe>;
+    /** Texte tape, a chaque frappe. Sert au filtrage `distant`. */
+    readonly recherche: _angular_core.OutputEmitterRef<string>;
+    protected readonly annonce: AnnonceLocale;
+    protected readonly ouvert: _angular_core.WritableSignal<boolean>;
+    /** Texte du champ : le libelle du choix, tant que la personne ne tape pas. */
+    protected readonly texte: _angular_core.WritableSignal<string>;
+    /** Ce qui filtre : vide a l'ouverture par la fleche, pour montrer toute la liste. */
+    private readonly filtre;
+    /** Option active dans la liste ; le choix n'est retenu qu'a la validation. */
+    protected readonly surlignee: _angular_core.WritableSignal<string[]>;
+    protected readonly visibles: _angular_core.Signal<readonly OptionDeListe[]>;
+    private readonly liste;
+    constructor();
+    protected surSaisie(evenement: Event): void;
+    protected basculer(): void;
+    protected valider(): void;
+    protected aLaSortie(evenement: FocusEvent): void;
+    private libelleDe;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StCombobox, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StCombobox, "st-combobox", never, { "options": { "alias": "options"; "required": true; "isSignal": true; }; "filtrage": { "alias": "filtrage"; "required": false; "isSignal": true; }; }, { "recherche": "recherche"; }, never, never, true, never>;
+}
+
+/**
+ * Choix de plusieurs valeurs dans une liste, sur `@angular/aria/combobox` et
+ * `@angular/aria/listbox`.
+ *
+ * ```html
+ * <st-multiselect libelle="Comptes a inclure" [options]="comptes" [formField]="releve.comptes" />
+ * ```
+ *
+ * Le modele est la liste des VALEURS choisies, dans l'ordre des options.
+ *
+ * - Fleche bas, Entree ou Espace ouvrent la liste ; Espace coche ou decoche
+ *   l'option active sans fermer ; Echap ferme.
+ * - ⚠️ **Chaque choix reste visible et retirable** sous le champ, par un bouton
+ *   « Retirer … ». Un resume « 3 choix » dans le declencheur ne dit pas lesquels,
+ *   et obligerait a rouvrir la liste pour en retirer un.
+ * - Un choix retire rend le focus au retrait suivant, ou au champ : le focus ne
+ *   tombe jamais sur le document.
+ *
+ * ⚠️ Sous une dizaine d'options, un groupe de cases a cocher (`st-fieldset` et
+ * `st-checkbox`) est plus simple : tout est visible, rien a ouvrir.
+ */
+declare class StMultiselect extends ContratDeChamp implements FormValueControl<readonly string[]> {
+    protected readonly libelles: _angular_core.Signal<_starterlib_ui.LibellesUi>;
+    private readonly element;
+    private readonly injecteur;
+    readonly value: _angular_core.ModelSignal<readonly string[]>;
+    readonly options: _angular_core.InputSignal<readonly OptionDeListe[]>;
+    protected readonly annonce: AnnonceLocale;
+    protected readonly ouvert: _angular_core.WritableSignal<boolean>;
+    private readonly liste;
+    /** La liste d'Aria attend un tableau modifiable ; le modele, lui, est en lecture seule. */
+    protected readonly valeursDeListe: _angular_core.Signal<string[]>;
+    protected readonly choisies: _angular_core.Signal<OptionDeListe[]>;
+    protected readonly resume: _angular_core.Signal<string>;
+    constructor();
+    /** Le declencheur n'est pas un champ natif : la base ne le trouve pas par `#champ`. */
+    focus(options?: FocusOptions): void;
+    protected surChoix(valeurs: readonly string[]): void;
+    protected retirer(valeur: string, indice: number): void;
+    protected aLaSortie(evenement: FocusEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StMultiselect, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StMultiselect, "st-multiselect", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+}
+
+export { StCombobox, StMultiselect };
+export type { FiltrageDeListe };