@starterlib/ui 0.10.13 → 0.10.14

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.
@@ -1,8 +1,10 @@
1
1
  # Licences tierces de `@starterlib/ui`
2
2
 
3
- Ce paquet livre un seul actif d'origine tierce : le sprite d'icones `assets/icones/sprite.svg` (et
4
- son catalogue `assets/icones/catalogue.json`). Aucune bibliotheque d'icones n'est une dependance du
5
- paquet ; les symboles sont derives a la construction du depot, puis versionnes.
3
+ Ce paquet livre deux actifs d'origine tierce : le sprite d'icones `assets/icones/sprite.svg` (et
4
+ son catalogue `assets/icones/catalogue.json`), et le logo de la planche 8 (`assets/logos/`, lot 240),
5
+ dont la tuile porte le glyphe `account_balance` (`banque` du sprite). Aucune bibliotheque d'icones
6
+ n'est une dependance du paquet ; les symboles sont derives a la construction du depot, puis
7
+ versionnes.
6
8
 
7
9
  ## Material Symbols Outlined
8
10
 
@@ -28,6 +30,10 @@ paquet ; les symboles sont derives a la construction du depot, puis versionnes.
28
30
  Le catalogue source le declare (`origine.derive`), et `pnpm icones:check` exige que chaque dessin
29
31
  du depot declare ses glyphes d'origine, ou se declare original.
30
32
 
33
+ - **Logo de la planche 8** (`assets/logos/starter-bank-*.svg`, lot 240) : le contour de
34
+ `account_balance` (`@material-symbols/svg-400` 0.47.5, grille de 960 unites) pose tel quel, reduit a
35
+ 18 px, dans une tuile de 28 px ; meme licence.
36
+
31
37
  ---
32
38
 
33
39
  ```text
package/README.md CHANGED
@@ -14,12 +14,13 @@ des dependances de pair : c'est l'application qui les installe, et elles doivent
14
14
  etre **identiques dans l'hote et dans chaque remote**. Deux versions du socle
15
15
  dans le meme navigateur, ce sont deux jeux de jetons d'injection.
16
16
 
17
- ## Dix-huit points d'entree
17
+ ## Dix-neuf points d'entree
18
18
 
19
19
  Deux criteres, dans cet ordre (le douzieme, `sens`, le treizieme, `parcours`, et le
20
20
  quatorzieme, `qr`, et le quinzieme, `messagerie`, depuis la 0.9.0 : lots 228, 243, 264 et 266 ;
21
21
  `etats`, `indicateurs` et `mise-en-page` depuis la 0.10.0 : greffe 268c, ce que la coquille ne peint
22
- pas sort du tronc).
22
+ pas sort du tronc ; `virtuel` depuis la 0.10.14 : lot 267, la liste virtuelle, bonus sous condition
23
+ ecrite, `packages/ui/virtuel/README.md`).
23
24
 
24
25
  1. **La dependance** (ADR 0003) : un composant sort du tronc quand il traine un
25
26
  pair lourd, et le point d'entree ou il va se choisit par ce qu'il EST pour
@@ -42,7 +43,7 @@ pas sort du tronc).
42
43
  | `@starterlib/ui/onglets` | les onglets et leurs panneaux | `@angular/aria/tabs` |
43
44
  | `@starterlib/ui/selection` | liste deroulante filtrante, choix multiple, recherche d'adresse (`st-address-search`), liste des pays filtrable (`st-country-combobox`) | `@angular/aria/{combobox,listbox}`, `@angular/cdk/overlay` |
44
45
  | `@starterlib/ui/arbre` | l'arborescence | `@angular/aria/tree` |
45
- | `@starterlib/ui/formulaires` | les champs qui LISENT leur saisie : montant, date, plage de dates, heure (`st-time-field`), plage de montants (`st-amount-range`), recurrence d'un virement (`st-recurrence-field`) | le code d'`@angular/forms` (`transformedValue`) |
46
+ | `@starterlib/ui/formulaires` | les champs qui LISENT leur saisie : montant, date, plage de dates, heure (`st-time-field`), plage de montants (`st-amount-range`), recurrence d'un virement (`st-recurrence-field`) ; bonus sous condition ecrite du lot 267 (README de chacun) : mois (`st-month-field`), date memorable (`st-memorable-date`) | le code d'`@angular/forms` (`transformedValue`) |
46
47
  | `@starterlib/ui/sens` | le sens d'ecriture du CDK tenu a jour avec `dir` (`provideSensDuDocument`, pose par l'hote) | `@angular/cdk/bidi` — et rien d'autre |
47
48
  | `@starterlib/ui/parcours` | les patrons composites d'un parcours : refus du serveur (`st-refusal`), issue d'une operation (`st-outcome`), assistant par etapes et son indicateur (`st-wizard`, `st-wizard-step`, `st-stepper`), dossier a completer (`st-task-list`), ceremonie de second facteur (`st-challenge`) et codes de secours (`st-recovery-codes`) | aucun |
48
49
  | `@starterlib/ui/qr` | le code QR : l'encodeur pur (`encoderQr`, ISO/IEC 18004) et son dessin (`st-qr-code`), pour l'enrolement d'un authentificateur et le virement a scanner | aucun |
@@ -50,6 +51,7 @@ pas sort du tronc).
50
51
  | `@starterlib/ui/etats` | l'etat d'un bloc de donnees et ses gabarits (`st-state`, `GABARITS_D_ETAT`), le squelette de chargement (`st-skeleton`), l'ecran d'attente d'une application (`st-splash-screen`) | aucun |
51
52
  | `@starterlib/ui/indicateurs` | pastille de statut (`st-status-pill`), badge et compteur ancre (`st-badge`, `st-badge-ancre`), etiquettes et groupes d'etiquettes (`st-tag`, `st-tag-group`, `st-groupe-d-etiquettes`) | aucun |
52
53
  | `@starterlib/ui/mise-en-page` | section, separateur, texte long (`st-text`), rangee de reglage (`st-settings-row`), groupe de boutons (`st-button-group`) | aucun |
54
+ | `@starterlib/ui/virtuel` | la liste virtuelle (`st-virtual-list`, `stVirtualItem`) : plusieurs milliers de lignes affichees ensemble, la fenetre seule rendue ; bonus sous condition ecrite du lot 267 (`packages/ui/virtuel/README.md`) | `@angular/cdk/scrolling` — et rien d'autre |
53
55
 
54
56
  ```ts
55
57
  import { StButton, StCard, StError } from '@starterlib/ui';
@@ -66,6 +68,7 @@ import { provideSensDuDocument } from '@starterlib/ui/sens';
66
68
  import { GABARITS_D_ETAT, StState } from '@starterlib/ui/etats';
67
69
  import { StStatusPill, StTag } from '@starterlib/ui/indicateurs';
68
70
  import { StSection, StText } from '@starterlib/ui/mise-en-page';
71
+ import { StVirtualItem, StVirtualList } from '@starterlib/ui/virtuel';
69
72
  ```
70
73
 
71
74
  `sens` ne porte aucun composant : il remplace le `Directionality` du CDK, qui ne lit `dir` qu'a sa
@@ -84,8 +87,8 @@ d'abord des CHAMPS ; `parcours` et `messagerie` composent le tronc, `saisie`, `l
84
87
  0.10.0, ce qui est sorti du tronc est importe la ou il se compose : `listes` importe `etats` (le
85
88
  squelette) et `indicateurs` (la pastille de statut), `saisie` et `parcours` importent
86
89
  `indicateurs`, `formulaires` et `surfaces` importent `mise-en-page`.
87
- `libelles-en` et `sens` n'importent aucun autre point d'entree : le catalogue
88
- anglais ne lit du tronc que le TYPE `LibellesUi`. `navigation` atteint
90
+ `libelles-en`, `sens` et `virtuel` n'importent aucun autre point d'entree : le catalogue
91
+ anglais ne lit du tronc que le TYPE `LibellesUi`, et la liste virtuelle ne compose que le CDK. `navigation` atteint
89
92
  `surfaces` par `import()` seulement : le dialogue du tiroir ne pese pas sur le
90
93
  premier rendu.
91
94
 
@@ -119,12 +122,12 @@ construit (`pnpm paquets:check`), **au specificateur exact** : `navigation` a
119
122
  droit a `@angular/cdk/layout`, et un `@angular/cdk/overlay` qui s'y glisserait
120
123
  echoue avant la publication. Une regle non outillee est une opinion.
121
124
 
122
- ⚠️ **En federation, chaque point d'entree se partage SEPAREMENT.** Ce sont dix-huit
125
+ ⚠️ **En federation, chaque point d'entree se partage SEPAREMENT.** Ce sont dix-neuf
123
126
  specificateurs de module distincts : partager `@starterlib/ui` ne couvre aucun
124
- des dix-sept autres. Omis de la configuration, chaque remote en embarque sa propre
127
+ des dix-huit autres. Omis de la configuration, chaque remote en embarque sa propre
125
128
  copie — et la regle `singleton: true, strictVersion: true` qui protege le tronc
126
129
  ne protege plus rien au-dessus. Le decoupage achete l'independance de
127
- CHARGEMENT, jamais celle de VERSION : les dix-huit portent le numero de leur paquet.
130
+ CHARGEMENT, jamais celle de VERSION : les dix-neuf portent le numero de leur paquet.
128
131
 
129
132
  ```js
130
133
  // federation.config.mjs de l'hote ET de chaque remote
@@ -134,9 +137,10 @@ shared: { ...share({ ...partageAngular('22.2', '7.8'), ...partageDuSocle('0.10')
134
137
  ```
135
138
 
136
139
  ⚠️ **Cette liste ne se recopie plus.** Depuis la 0.8.0 elle est publiee par
137
- `@starterlib/core/federation` : `partageDuSocle(train)` rend les **vingt-six**
138
- specificateurs du socle — les dix-huit de `ui`, `tokens`, `tokens/moteur`, `util`,
139
- `util/valeurs`, `core`, `core/federation`, `core/adresses` et `core/fichiers` —, chacun en `singleton: true, strictVersion: true,
140
+ `@starterlib/core/federation` : `partageDuSocle(train)` rend les **vingt-huit**
141
+ specificateurs du socle — les dix-neuf de `ui`, `tokens`, `tokens/moteur`, `util`,
142
+ `util/valeurs`, `core`, `core/federation`, `core/adresses`, `core/fichiers` et `core/navigateur` —,
143
+ chacun en `singleton: true, strictVersion: true,
140
144
  includeSecondaries: false`. La raison n'est pas la commodite : une ligne oubliee
141
145
  **n'est pas une erreur de construction**, le specificateur se duplique simplement
142
146
  dans le remote, avec son etat. Passer de quatre a douze specificateurs `ui` en
@@ -209,6 +213,32 @@ export const appConfig: ApplicationConfig = {
209
213
  ```
210
214
 
211
215
  Le prefixe est celui sous lequel l'interface est servie (`/ui/<interface>/`).
216
+
217
+ ## Logo de la planche 8 — un actif du socle (0.10.14, lot 240)
218
+
219
+ `assets/logos/` livre le logo de la carte d'authentification de la planche 8 : la tuile de 28 px a
220
+ l'encre primaire (glyphe `banque`, Material Symbols, `LICENCES-TIERCES.md`) et le nom « Starter
221
+ Bank » en 18/700, en trois variantes (`starter-bank-clair.svg`, `starter-bank-sombre.svg`,
222
+ `starter-bank-monochrome.svg`), aux couleurs des jetons (garde `tools/logos-du-socle.test.mjs`).
223
+ L'ecran anonyme et la coquille le servent depuis le paquet, au lieu d'en garder chacun une copie :
224
+
225
+ ```jsonc
226
+ "assets": [
227
+ { "glob": "starter-bank-*.svg", "input": "node_modules/@starterlib/ui/assets/logos", "output": "assets/logos" },
228
+ ]
229
+ ```
230
+
231
+ ```html
232
+ <st-logo
233
+ nom="Starter Bank"
234
+ [clair]="'/ui/identity-auth/assets/logos/starter-bank-clair.svg'"
235
+ [sombre]="'/ui/identity-auth/assets/logos/starter-bank-sombre.svg'"
236
+ [monochrome]="'/ui/identity-auth/assets/logos/starter-bank-monochrome.svg'"
237
+ />
238
+ ```
239
+
240
+ Le nom est le texte alternatif du logo (`st-logo`) : jamais « logo ». Le texte du SVG est rendu dans
241
+ la police du systeme quand l'image est servie seule (une image n'a pas acces aux polices de la page).
212
242
  Un chemin empreinte (`sprite.<hash>.svg`) donne un cache immuable.
213
243
 
214
244
  ## Feuille de jetons
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "paquet": "@starterlib/ui",
3
- "version": "0.10.13",
3
+ "version": "0.10.14",
4
4
  "sprite": {
5
5
  "fichier": "sprite.svg",
6
6
  "empreinte": "A5A8196C",
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 156 28" role="img" aria-label="Starter Bank"><rect width="28" height="28" rx="4" fill="#003181"/><path transform="translate(5 23) scale(0.01875)" d="M212-241v-339h60v339h-60Zm242 0v-339h60v339h-60ZM80-121v-60h800v60H80Zm608-120v-339h60v339h-60ZM80-640v-53l400-228 400 228v53H80Zm134-60h532-532Zm0 0h532L480-852 214-700Z" fill="#ffffff"/><text x="36" y="20.5" font-family="Inter, system-ui, -apple-system, 'Segoe UI', sans-serif" font-size="18" font-weight="700" letter-spacing="-0.45" fill="#003181">Starter Bank</text></svg>
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 156 28" role="img" aria-label="Starter Bank"><rect width="28" height="28" rx="4" fill="#000000"/><path transform="translate(5 23) scale(0.01875)" d="M212-241v-339h60v339h-60Zm242 0v-339h60v339h-60ZM80-121v-60h800v60H80Zm608-120v-339h60v339h-60ZM80-640v-53l400-228 400 228v53H80Zm134-60h532-532Zm0 0h532L480-852 214-700Z" fill="#ffffff"/><text x="36" y="20.5" font-family="Inter, system-ui, -apple-system, 'Segoe UI', sans-serif" font-size="18" font-weight="700" letter-spacing="-0.45" fill="#000000">Starter Bank</text></svg>
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 156 28" role="img" aria-label="Starter Bank"><rect width="28" height="28" rx="4" fill="#9ebef8"/><path transform="translate(5 23) scale(0.01875)" d="M212-241v-339h60v339h-60Zm242 0v-339h60v339h-60ZM80-121v-60h800v60H80Zm608-120v-339h60v339h-60ZM80-640v-53l400-228 400 228v53H80Zm134-60h532-532Zm0 0h532L480-852 214-700Z" fill="#070d14"/><text x="36" y="20.5" font-family="Inter, system-ui, -apple-system, 'Segoe UI', sans-serif" font-size="18" font-weight="700" letter-spacing="-0.45" fill="#9ebef8">Starter Bank</text></svg>