@sia-ui/react-web 0.4.0 → 0.6.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/CHANGELOG.md +85 -0
- package/README.md +161 -74
- package/dist/index.cjs +3912 -3427
- package/dist/index.css +2752 -2520
- package/dist/index.d.cts +568 -287
- package/dist/index.d.ts +568 -287
- package/dist/index.js +3899 -3432
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,90 @@
|
|
|
1
1
|
# @sia-ui/react-web
|
|
2
2
|
|
|
3
|
+
## 0.6.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- Rôles, requêtes serveur, ressources par mode, et deux blocs de console.
|
|
8
|
+
- **Rôles** — la couche d'accès lit les rôles de la session sous la forme
|
|
9
|
+
`role:<nom>` (`role("admin")`), avec les trois évaluateurs.
|
|
10
|
+
- **Tableaux servis par le serveur** — `useDataTableQuery` accepte un
|
|
11
|
+
`storage` (TanStack Router, React Router) et `serverParams` pour les noms
|
|
12
|
+
attendus (`limit`, `sort` + `order`, `ASC`/`DESC`). `toServerParams` dans
|
|
13
|
+
`@sia-ui/headless`.
|
|
14
|
+
- **TanStack Query** — `createQueryResource(service)` : clés emboîtées,
|
|
15
|
+
options de requête avec annulation, mutations qui invalident ce qu'elles
|
|
16
|
+
rendent périmé. Aucune dépendance à TanStack.
|
|
17
|
+
- **Ressources** — `inForm` et `required` par mode (`"create"`, `"edit"`),
|
|
18
|
+
`value` pour une colonne calculée.
|
|
19
|
+
- **En-têtes** — `PageHeader` `level`, `CrudPage` `headingLevel`. Le repli
|
|
20
|
+
suit la place disponible ; les actions ne s'écrasent plus.
|
|
21
|
+
- **Nouveaux** — `SecretFields` (secrets en écriture seule), `ActivityLog`
|
|
22
|
+
(journal filtré par le serveur), `StatusBadge` et `toneOf`, dix icônes de
|
|
23
|
+
console.
|
|
24
|
+
- Les icônes des boutons de `CrudPage` et `DataTable` passent par
|
|
25
|
+
`leftIcon` : elles ne se collent plus au libellé.
|
|
26
|
+
|
|
27
|
+
### Patch Changes
|
|
28
|
+
|
|
29
|
+
- Updated dependencies
|
|
30
|
+
- @sia-ui/react@0.6.0
|
|
31
|
+
- @sia-ui/tokens@0.6.0
|
|
32
|
+
- @sia-ui/utils@0.6.0
|
|
33
|
+
- @sia-ui/headless@0.6.0
|
|
34
|
+
|
|
35
|
+
## 0.5.0
|
|
36
|
+
|
|
37
|
+
### Minor Changes
|
|
38
|
+
|
|
39
|
+
- Erreurs serveur dans les formulaires, client HTTP plus sûr, registre vérifié.
|
|
40
|
+
|
|
41
|
+
## Défauts
|
|
42
|
+
- **Registre `drawer`** — `context.ts` et la dépendance `icons` manquaient :
|
|
43
|
+
`sia-ui add app-shell` produisait un projet qui ne compilait pas. Un test
|
|
44
|
+
vérifie désormais que chaque import relatif de chaque entrée est apporté par
|
|
45
|
+
son installation.
|
|
46
|
+
- **`sia-ui.css`** pose `box-sizing: border-box` (spécificité nulle). Sans
|
|
47
|
+
reset côté projet, `AppShell` débordait de 32 px.
|
|
48
|
+
- **`@sia-ui/api`** ne rejoue plus d'office que `GET` et `HEAD`
|
|
49
|
+
(`retryMethods`). Une écriture n'est rejouée que si l'appel pose `retry`.
|
|
50
|
+
- Plus aucun avertissement `react-hooks/exhaustive-deps` dans les composants.
|
|
51
|
+
|
|
52
|
+
## Formulaires et erreurs serveur
|
|
53
|
+
- `Form` intercepte un envoi rejeté : erreurs de champ sous les champs, le
|
|
54
|
+
reste dans une alerte. `onSubmit` peut aussi rendre `{ champ: message }`
|
|
55
|
+
(`FormSubmitResult`), dans `useLocalForm`, `Form`, `CrudPage` et
|
|
56
|
+
l'adaptateur react-hook-form. `CrudPage` garde alors sa boîte ouverte.
|
|
57
|
+
- Les erreurs posées par `setErrors` survivent à la validation locale jusqu'à
|
|
58
|
+
la modification de leur champ.
|
|
59
|
+
- `HttpError.toFormErrors()`, option `fieldErrors` du client et préréglage
|
|
60
|
+
`nestFieldErrors` (class-validator). `readSubmitError` et `hasFormErrors`
|
|
61
|
+
dans `@sia-ui/headless`.
|
|
62
|
+
- La pagination à plat `{ data, total, page, limit }` est reconnue, et `get`
|
|
63
|
+
ne déballe plus `data` quand l'objet porte une pagination.
|
|
64
|
+
|
|
65
|
+
## Tableaux
|
|
66
|
+
- `searchDelay` sur `DataTable` et `CrudPage`.
|
|
67
|
+
- `CrudPage` place les `extraRowActions` avant « Supprimer ».
|
|
68
|
+
|
|
69
|
+
- Pagination, téléphone et recherche du `Select`.
|
|
70
|
+
- `Pagination` propose le nombre de lignes par page : `pageSize`,
|
|
71
|
+
`onPageSizeChange`, `pageSizeOptions`, `pageSizeLabel`, et
|
|
72
|
+
`renderPageSize` pour remplacer le contrôle. `CrudPage` transmet les trois
|
|
73
|
+
premières. Nouvelle clé de libellé `perPage` (« Par page »).
|
|
74
|
+
- La page courante de `Pagination` n'est plus blanche sur blanc au survol.
|
|
75
|
+
- `PhoneInput` choisit l'indicatif dans le `Select` du système, avec
|
|
76
|
+
recherche, à la place du `<select>` natif.
|
|
77
|
+
- `Select` : `variant="embedded"` et `renderValue` ; recherche insensible aux
|
|
78
|
+
accents ; Entrée choisit le premier résultat après un filtrage.
|
|
79
|
+
|
|
80
|
+
### Patch Changes
|
|
81
|
+
|
|
82
|
+
- Updated dependencies
|
|
83
|
+
- @sia-ui/react@0.5.0
|
|
84
|
+
- @sia-ui/tokens@0.5.0
|
|
85
|
+
- @sia-ui/utils@0.5.0
|
|
86
|
+
- @sia-ui/headless@0.5.0
|
|
87
|
+
|
|
3
88
|
## 0.4.0
|
|
4
89
|
|
|
5
90
|
### Minor Changes
|
package/README.md
CHANGED
|
@@ -1,74 +1,160 @@
|
|
|
1
|
-
<p align="center"><img src="https://beatjo.github.io/sia-ui-site/brand/sia-ui-logo.png" alt="SIA UI" width="320"></p>
|
|
2
|
-
|
|
3
|
-
# @sia-ui/react-web
|
|
4
|
-
|
|
5
|
-
Les composants SIA UI pour le DOM.
|
|
6
|
-
|
|
7
|
-
```bash
|
|
8
|
-
pnpm add @sia-ui/react-web
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
```tsx
|
|
12
|
-
import { Button, DataTable, DatePicker } from "@sia-ui/react-web";
|
|
13
|
-
import "@sia-ui/react-web/styles.css";
|
|
14
|
-
```
|
|
15
|
-
|
|
16
|
-
88 composants : primitives, saisie, date et heure, affichage de données,
|
|
17
|
-
feedback et patterns applicatifs — `CrudPage`, `AppShell`, `FiltersBar`,
|
|
18
|
-
`AuthLayout`.
|
|
19
|
-
|
|
20
|
-
## Valeurs par défaut et libellés
|
|
21
|
-
|
|
22
|
-
```tsx
|
|
23
|
-
import { SiaConfigProvider } from "@sia-ui/headless";
|
|
24
|
-
|
|
25
|
-
<SiaConfigProvider
|
|
26
|
-
defaults={{ button: { variant: "outline" } }}
|
|
27
|
-
locale={{ loading: "Loading", empty: "No data" }}
|
|
28
|
-
>
|
|
29
|
-
```
|
|
30
|
-
|
|
31
|
-
Aucune librairie d'i18n n'est requise : toutes les chaînes sont des props, et
|
|
32
|
-
le fournisseur ne fixe que les défauts.
|
|
33
|
-
|
|
34
|
-
## Ou copier le code
|
|
35
|
-
|
|
36
|
-
```bash
|
|
37
|
-
npx sia-ui add data-table
|
|
38
|
-
```
|
|
39
|
-
|
|
40
|
-
Le fichier installé est **exactement** celui de ce paquet.
|
|
41
|
-
|
|
42
|
-
## Place dans SIA UI
|
|
43
|
-
|
|
44
|
-
```
|
|
45
|
-
@sia-ui/tokens valeurs : couleurs, espacements, mouvement, vocabulaire
|
|
46
|
-
@sia-ui/utils fonctions sans dépendance
|
|
47
|
-
@sia-ui/api client HTTP — indépendant de l'interface
|
|
48
|
-
@sia-ui/headless comportement, avec React, sans plateforme
|
|
49
|
-
@sia-ui/react primitives de runtime DOM
|
|
50
|
-
@sia-ui/react-web composants DOM
|
|
51
|
-
@sia-ui/react-native composants natifs, à venir
|
|
52
|
-
```
|
|
53
|
-
|
|
54
|
-
Une chose s'écrit au niveau le plus bas où elle a du sens, et une seule fois.
|
|
55
|
-
Voir [la documentation](https://beatjo.github.io/sia-ui-site).
|
|
56
|
-
|
|
57
|
-
## Contribuer
|
|
58
|
-
|
|
59
|
-
Le code source principal de SIA UI est privé pour le moment. Les retours publics passent par le dépôt `BeatJo/sia-ui-site` : bugs, demandes de composants, corrections de documentation et questions d'usage.
|
|
60
|
-
|
|
61
|
-
- Signaler un bug : https://github.com/BeatJo/sia-ui-site/issues
|
|
62
|
-
- Lire la documentation : https://beatjo.github.io/sia-ui-site/
|
|
63
|
-
- Voir la démonstration : https://beatjo.github.io/sia-ui-site/preview/
|
|
64
|
-
|
|
65
|
-
Les contributions directes au code des packages se font sur invitation dans le dépôt source privé.
|
|
66
|
-
## Journal des changements
|
|
67
|
-
|
|
68
|
-
Le contenu ci-dessous reprend intégralement `CHANGELOG.md` pour rester visible sur npm.
|
|
69
|
-
|
|
1
|
+
<p align="center"><img src="https://beatjo.github.io/sia-ui-site/brand/sia-ui-logo.png" alt="SIA UI" width="320"></p>
|
|
2
|
+
|
|
3
|
+
# @sia-ui/react-web
|
|
4
|
+
|
|
5
|
+
Les composants SIA UI pour le DOM.
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
pnpm add @sia-ui/react-web
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
```tsx
|
|
12
|
+
import { Button, DataTable, DatePicker } from "@sia-ui/react-web";
|
|
13
|
+
import "@sia-ui/react-web/styles.css";
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
88 composants : primitives, saisie, date et heure, affichage de données,
|
|
17
|
+
feedback et patterns applicatifs — `CrudPage`, `AppShell`, `FiltersBar`,
|
|
18
|
+
`AuthLayout`.
|
|
19
|
+
|
|
20
|
+
## Valeurs par défaut et libellés
|
|
21
|
+
|
|
22
|
+
```tsx
|
|
23
|
+
import { SiaConfigProvider } from "@sia-ui/headless";
|
|
24
|
+
|
|
25
|
+
<SiaConfigProvider
|
|
26
|
+
defaults={{ button: { variant: "outline" } }}
|
|
27
|
+
locale={{ loading: "Loading", empty: "No data" }}
|
|
28
|
+
>
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
Aucune librairie d'i18n n'est requise : toutes les chaînes sont des props, et
|
|
32
|
+
le fournisseur ne fixe que les défauts.
|
|
33
|
+
|
|
34
|
+
## Ou copier le code
|
|
35
|
+
|
|
36
|
+
```bash
|
|
37
|
+
npx sia-ui add data-table
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
Le fichier installé est **exactement** celui de ce paquet.
|
|
41
|
+
|
|
42
|
+
## Place dans SIA UI
|
|
43
|
+
|
|
44
|
+
```
|
|
45
|
+
@sia-ui/tokens valeurs : couleurs, espacements, mouvement, vocabulaire
|
|
46
|
+
@sia-ui/utils fonctions sans dépendance
|
|
47
|
+
@sia-ui/api client HTTP — indépendant de l'interface
|
|
48
|
+
@sia-ui/headless comportement, avec React, sans plateforme
|
|
49
|
+
@sia-ui/react primitives de runtime DOM
|
|
50
|
+
@sia-ui/react-web composants DOM
|
|
51
|
+
@sia-ui/react-native composants natifs, à venir
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
Une chose s'écrit au niveau le plus bas où elle a du sens, et une seule fois.
|
|
55
|
+
Voir [la documentation](https://beatjo.github.io/sia-ui-site).
|
|
56
|
+
|
|
57
|
+
## Contribuer
|
|
58
|
+
|
|
59
|
+
Le code source principal de SIA UI est privé pour le moment. Les retours publics passent par le dépôt `BeatJo/sia-ui-site` : bugs, demandes de composants, corrections de documentation et questions d'usage.
|
|
60
|
+
|
|
61
|
+
- Signaler un bug : https://github.com/BeatJo/sia-ui-site/issues
|
|
62
|
+
- Lire la documentation : https://beatjo.github.io/sia-ui-site/
|
|
63
|
+
- Voir la démonstration : https://beatjo.github.io/sia-ui-site/preview/
|
|
64
|
+
|
|
65
|
+
Les contributions directes au code des packages se font sur invitation dans le dépôt source privé.
|
|
66
|
+
## Journal des changements
|
|
67
|
+
|
|
68
|
+
Le contenu ci-dessous reprend intégralement `CHANGELOG.md` pour rester visible sur npm.
|
|
69
|
+
|
|
70
|
+
<!-- sia:changelog:start -->
|
|
70
71
|
# @sia-ui/react-web
|
|
71
72
|
|
|
73
|
+
## 0.6.0
|
|
74
|
+
|
|
75
|
+
### Minor Changes
|
|
76
|
+
|
|
77
|
+
- Rôles, requêtes serveur, ressources par mode, et deux blocs de console.
|
|
78
|
+
- **Rôles** — la couche d'accès lit les rôles de la session sous la forme
|
|
79
|
+
`role:<nom>` (`role("admin")`), avec les trois évaluateurs.
|
|
80
|
+
- **Tableaux servis par le serveur** — `useDataTableQuery` accepte un
|
|
81
|
+
`storage` (TanStack Router, React Router) et `serverParams` pour les noms
|
|
82
|
+
attendus (`limit`, `sort` + `order`, `ASC`/`DESC`). `toServerParams` dans
|
|
83
|
+
`@sia-ui/headless`.
|
|
84
|
+
- **TanStack Query** — `createQueryResource(service)` : clés emboîtées,
|
|
85
|
+
options de requête avec annulation, mutations qui invalident ce qu'elles
|
|
86
|
+
rendent périmé. Aucune dépendance à TanStack.
|
|
87
|
+
- **Ressources** — `inForm` et `required` par mode (`"create"`, `"edit"`),
|
|
88
|
+
`value` pour une colonne calculée.
|
|
89
|
+
- **En-têtes** — `PageHeader` `level`, `CrudPage` `headingLevel`. Le repli
|
|
90
|
+
suit la place disponible ; les actions ne s'écrasent plus.
|
|
91
|
+
- **Nouveaux** — `SecretFields` (secrets en écriture seule), `ActivityLog`
|
|
92
|
+
(journal filtré par le serveur), `StatusBadge` et `toneOf`, dix icônes de
|
|
93
|
+
console.
|
|
94
|
+
- Les icônes des boutons de `CrudPage` et `DataTable` passent par
|
|
95
|
+
`leftIcon` : elles ne se collent plus au libellé.
|
|
96
|
+
|
|
97
|
+
### Patch Changes
|
|
98
|
+
|
|
99
|
+
- Updated dependencies
|
|
100
|
+
- @sia-ui/react@0.6.0
|
|
101
|
+
- @sia-ui/tokens@0.6.0
|
|
102
|
+
- @sia-ui/utils@0.6.0
|
|
103
|
+
- @sia-ui/headless@0.6.0
|
|
104
|
+
|
|
105
|
+
## 0.5.0
|
|
106
|
+
|
|
107
|
+
### Minor Changes
|
|
108
|
+
|
|
109
|
+
- Erreurs serveur dans les formulaires, client HTTP plus sûr, registre vérifié.
|
|
110
|
+
|
|
111
|
+
## Défauts
|
|
112
|
+
- **Registre `drawer`** — `context.ts` et la dépendance `icons` manquaient :
|
|
113
|
+
`sia-ui add app-shell` produisait un projet qui ne compilait pas. Un test
|
|
114
|
+
vérifie désormais que chaque import relatif de chaque entrée est apporté par
|
|
115
|
+
son installation.
|
|
116
|
+
- **`sia-ui.css`** pose `box-sizing: border-box` (spécificité nulle). Sans
|
|
117
|
+
reset côté projet, `AppShell` débordait de 32 px.
|
|
118
|
+
- **`@sia-ui/api`** ne rejoue plus d'office que `GET` et `HEAD`
|
|
119
|
+
(`retryMethods`). Une écriture n'est rejouée que si l'appel pose `retry`.
|
|
120
|
+
- Plus aucun avertissement `react-hooks/exhaustive-deps` dans les composants.
|
|
121
|
+
|
|
122
|
+
## Formulaires et erreurs serveur
|
|
123
|
+
- `Form` intercepte un envoi rejeté : erreurs de champ sous les champs, le
|
|
124
|
+
reste dans une alerte. `onSubmit` peut aussi rendre `{ champ: message }`
|
|
125
|
+
(`FormSubmitResult`), dans `useLocalForm`, `Form`, `CrudPage` et
|
|
126
|
+
l'adaptateur react-hook-form. `CrudPage` garde alors sa boîte ouverte.
|
|
127
|
+
- Les erreurs posées par `setErrors` survivent à la validation locale jusqu'à
|
|
128
|
+
la modification de leur champ.
|
|
129
|
+
- `HttpError.toFormErrors()`, option `fieldErrors` du client et préréglage
|
|
130
|
+
`nestFieldErrors` (class-validator). `readSubmitError` et `hasFormErrors`
|
|
131
|
+
dans `@sia-ui/headless`.
|
|
132
|
+
- La pagination à plat `{ data, total, page, limit }` est reconnue, et `get`
|
|
133
|
+
ne déballe plus `data` quand l'objet porte une pagination.
|
|
134
|
+
|
|
135
|
+
## Tableaux
|
|
136
|
+
- `searchDelay` sur `DataTable` et `CrudPage`.
|
|
137
|
+
- `CrudPage` place les `extraRowActions` avant « Supprimer ».
|
|
138
|
+
|
|
139
|
+
- Pagination, téléphone et recherche du `Select`.
|
|
140
|
+
- `Pagination` propose le nombre de lignes par page : `pageSize`,
|
|
141
|
+
`onPageSizeChange`, `pageSizeOptions`, `pageSizeLabel`, et
|
|
142
|
+
`renderPageSize` pour remplacer le contrôle. `CrudPage` transmet les trois
|
|
143
|
+
premières. Nouvelle clé de libellé `perPage` (« Par page »).
|
|
144
|
+
- La page courante de `Pagination` n'est plus blanche sur blanc au survol.
|
|
145
|
+
- `PhoneInput` choisit l'indicatif dans le `Select` du système, avec
|
|
146
|
+
recherche, à la place du `<select>` natif.
|
|
147
|
+
- `Select` : `variant="embedded"` et `renderValue` ; recherche insensible aux
|
|
148
|
+
accents ; Entrée choisit le premier résultat après un filtrage.
|
|
149
|
+
|
|
150
|
+
### Patch Changes
|
|
151
|
+
|
|
152
|
+
- Updated dependencies
|
|
153
|
+
- @sia-ui/react@0.5.0
|
|
154
|
+
- @sia-ui/tokens@0.5.0
|
|
155
|
+
- @sia-ui/utils@0.5.0
|
|
156
|
+
- @sia-ui/headless@0.5.0
|
|
157
|
+
|
|
72
158
|
## 0.4.0
|
|
73
159
|
|
|
74
160
|
### Minor Changes
|
|
@@ -262,8 +348,9 @@ Le contenu ci-dessous reprend intégralement `CHANGELOG.md` pour rester visible
|
|
|
262
348
|
- @sia-ui/headless@0.2.0
|
|
263
349
|
- @sia-ui/tokens@0.2.0
|
|
264
350
|
- @sia-ui/utils@0.2.0
|
|
265
|
-
- @sia-ui/react@0.2.0
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
351
|
+
- @sia-ui/react@0.2.0
|
|
352
|
+
<!-- sia:changelog:end -->
|
|
353
|
+
|
|
354
|
+
## Licence
|
|
355
|
+
|
|
356
|
+
MIT
|