@wakastellar/ui 0.1.0 → 0.1.2

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.
Files changed (3) hide show
  1. package/LICENSE +17 -0
  2. package/README.md +291 -0
  3. package/package.json +5 -2
package/LICENSE ADDED
@@ -0,0 +1,17 @@
1
+ GNU AFFERO GENERAL PUBLIC LICENSE
2
+ Version 3, 19 November 2007
3
+
4
+ Copyright (C) 2025 Wakastellar
5
+
6
+ This program is free software: you can redistribute it and/or modify
7
+ it under the terms of the GNU Affero General Public License as published by
8
+ the Free Software Foundation, either version 3 of the License, or
9
+ (at your option) any later version.
10
+
11
+ This program is distributed in the hope that it will be useful,
12
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
13
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
14
+ GNU Affero General Public License for more details.
15
+
16
+ You should have received a copy of the GNU Affero General Public License
17
+ along with this program. If not, see <https://www.gnu.org/licenses/>.
package/README.md ADDED
@@ -0,0 +1,291 @@
1
+ # @wakastellar/ui
2
+
3
+ <div align="center">
4
+
5
+ ![npm version](https://img.shields.io/npm/v/@wakastellar/ui?style=for-the-badge&color=blue)
6
+ ![npm license](https://img.shields.io/npm/l/@wakastellar/ui?style=for-the-badge)
7
+ ![TypeScript](https://img.shields.io/badge/TypeScript-5.5.0-blue?style=for-the-badge&logo=typescript)
8
+ ![React](https://img.shields.io/badge/React-19.1.0+-61dafb?style=for-the-badge&logo=react)
9
+ ![Next.js](https://img.shields.io/badge/Next.js-15.5.4+-000000?style=for-the-badge&logo=next.js)
10
+
11
+ **Librairie de composants React professionnelle et modulaire pour applications Next.js modernes**
12
+
13
+ [Installation](#installation) • [Composants](#composants) • [Technologies](#technologies) • [Licence](#licence)
14
+
15
+ </div>
16
+
17
+ ---
18
+
19
+ ## Description
20
+
21
+ `@wakastellar/ui` est une librairie de composants React complète, typée avec TypeScript strict, conçue pour les applications Next.js modernes. Elle inclut un DataTable avancé basé sur TanStack Table v8, un système de theming dynamique compatible Tailwind CSS et TweakCN, ainsi qu'une collection complète de composants UI prêts pour la production.
22
+
23
+ ### Caractéristiques principales
24
+
25
+ - ✅ **TypeScript strict** - Typage complet et API type-safe
26
+ - ✅ **SSR/SSG Ready** - Compatible React 18/19 et Next.js 15+
27
+ - ✅ **Production-ready** - Builds ESM + CJS optimisés avec tree-shaking
28
+ - ✅ **Accessible** - Conforme ARIA et navigation clavier complète
29
+ - ✅ **Performant** - Virtualisation, debouncing, memoization
30
+ - ✅ **Themable** - Système de thèmes dynamique et variantes multiples
31
+ - ✅ **i18n Ready** - Support i18next / react-i18next
32
+ - ✅ **Headless UI** - Basé sur Radix UI primitives
33
+
34
+ ---
35
+
36
+ ## Installation
37
+
38
+ ```bash
39
+ npm install @wakastellar/ui
40
+ # ou
41
+ pnpm add @wakastellar/ui
42
+ # ou
43
+ yarn add @wakastellar/ui
44
+ ```
45
+
46
+ ### Styles CSS
47
+
48
+ ```ts
49
+ import "@wakastellar/ui/dist/ui.css"
50
+ ```
51
+
52
+ ### Peer Dependencies
53
+
54
+ La librairie nécessite les dépendances suivantes (à installer si ce n'est pas déjà fait) :
55
+
56
+ - `react` >= 19.1.0
57
+ - `react-dom` >= 18.0.0
58
+ - `next` >= 15.5.4 (pour Next.js)
59
+ - `react-hook-form` >= 7.0.0 (optionnel, pour certains composants)
60
+
61
+ ---
62
+
63
+ ## Technologies
64
+
65
+ ### Core
66
+
67
+ - **React** 19.1.0+
68
+ - **TypeScript** 5.5.0
69
+ - **Next.js** 15.5.4+
70
+ - **Tailwind CSS** 3.4.0
71
+
72
+ ### Build & Tooling
73
+
74
+ - **Vite** 7.1.9 - Build tool
75
+ - **vitest** 3.2.4 - Testing framework
76
+ - **eslint** - Linting
77
+ - **prettier** - Code formatting
78
+
79
+ ### Principales dépendances
80
+
81
+ - **@radix-ui/react-*** - Composants headless UI
82
+ - `@radix-ui/react-dialog` ^1.0.5
83
+ - `@radix-ui/react-select` ^2.0.0
84
+ - `@radix-ui/react-dropdown-menu` ^2.0.6
85
+ - `@radix-ui/react-tabs` ^1.0.4
86
+ - `@radix-ui/react-toast` ^1.1.5
87
+ - Et 20+ autres primitives Radix UI
88
+
89
+ - **@tanstack/react-table** ^8.21.3 - Moteur DataTable
90
+ - **@tanstack/react-virtual** ^3.13.12 - Virtualisation
91
+ - **i18next** ^23.7.0 - Internationalisation
92
+ - **date-fns** ^4.1.0 - Gestion des dates
93
+ - **lucide-react** ^0.293.0 - Icônes
94
+ - **class-variance-authority** ^0.7.1 - Variants
95
+ - **tailwind-merge** ^3.3.1 - Fusion de classes Tailwind
96
+ - **tailwind-variants** ^0.1.18 - Variants Tailwind
97
+
98
+ ---
99
+
100
+ ## Composants
101
+
102
+ ### Data & Tables
103
+
104
+ - **DataTable** - Table de données basique
105
+ - **DataTableAdvanced** - Table de données avancée avec :
106
+ - Tri multi-colonnes
107
+ - Filtrage et recherche globale
108
+ - Pagination client/serveur
109
+ - Sélection simple/multiple
110
+ - Groupement et agrégation
111
+ - Expansion des lignes
112
+ - Édition inline avec validation
113
+ - Export/Import (CSV, XLSX, JSON, PDF)
114
+ - Virtualisation pour grandes quantités de données
115
+
116
+ ### Formulaires
117
+
118
+ - **Button** - Boutons avec variantes et tailles
119
+ - **Input** - Champs de saisie texte
120
+ - **Textarea** - Zones de texte multilignes
121
+ - **Checkbox** - Cases à cocher
122
+ - **RadioGroup** - Groupes de boutons radio
123
+ - **Switch** - Interrupteurs toggle
124
+ - **Select** - Listes déroulantes
125
+ - **Slider** - Curseurs de sélection
126
+ - **InputOTP** - Champs OTP
127
+ - **Label** - Labels de formulaire
128
+ - **Form** - Intégration React Hook Form
129
+
130
+ ### DateTime
131
+
132
+ - **Calendar** - Calendrier de sélection de date
133
+ - **WakaDateTimePicker** - Sélecteur de date/heure complet avec :
134
+ - Variants : date, time, datetime, range, multiple
135
+ - Presets configurables
136
+ - Validation avancée
137
+ - Support multi-langues
138
+ - Intégration React Hook Form
139
+
140
+ ### Navigation
141
+
142
+ - **Tabs** - Onglets
143
+ - **Menubar** - Barre de menu
144
+ - **NavigationMenu** - Menu de navigation
145
+ - **DropdownMenu** - Menus déroulants
146
+ - **ContextMenu** - Menus contextuels
147
+ - **Command** - Palette de commandes (cmd+k)
148
+ - **WakaAdmincrumb** - Fil d'Ariane admin
149
+
150
+ ### Overlays
151
+
152
+ - **Dialog** - Modales
153
+ - **AlertDialog** - Dialogues d'alerte
154
+ - **Popover** - Popovers
155
+ - **Tooltip** - Info-bulles
156
+ - **HoverCard** - Cartes au survol
157
+ - **Sheet** - Panneaux latéraux
158
+
159
+ ### Feedback
160
+
161
+ - **Toast** / **Toaster** - Notifications toast
162
+ - **Alert** - Alertes
163
+ - **Progress** - Barres de progression
164
+ - **Skeleton** - Placeholders de chargement
165
+ - **WakaNotifications** - Système de notifications
166
+ - **WakaSpinner** - Indicateurs de chargement
167
+
168
+ ### Layout
169
+
170
+ - **Card** - Cartes
171
+ - **Separator** - Séparateurs
172
+ - **ScrollArea** - Zones de défilement
173
+ - **AspectRatio** - Ratios d'aspect
174
+ - **Collapsible** - Éléments repliables
175
+ - **Accordion** - Accordéons
176
+
177
+ ### Media
178
+
179
+ - **Avatar** - Avatars utilisateurs
180
+ - **WakaCarousel** - Carrousel d'images avec :
181
+ - Navigation clavier/tactile
182
+ - Mode plein écran
183
+ - Téléchargement et partage
184
+ - Autoplay avec contrôles
185
+ - Miniatures et indicateurs
186
+
187
+ ### Typography
188
+
189
+ - **Typography** - Composants typographiques
190
+ - **Code** - Affichage de code avec coloration syntaxique
191
+ - **Heading** - Titres sémantiques h1-h6
192
+ - **Text** - Textes avec variantes
193
+
194
+ ### Affichage
195
+
196
+ - **Badge** - Badges et étiquettes
197
+ - **Table** - Tables HTML de base
198
+ - **Tabs** - Onglets
199
+
200
+ ### Configuration
201
+
202
+ - **LanguageSelector** - Sélecteur de langue avec i18n
203
+ - **ThemeSelector** - Sélecteur de thème
204
+ - **WakaThemeManager** - Gestionnaire de thèmes TweakCN
205
+ - **WakaThemeCreator** - Créateur de thèmes interactif
206
+
207
+ ---
208
+
209
+ ## API
210
+
211
+ Tous les composants sont typés avec TypeScript. Consultez les définitions de types dans `dist/index.d.ts` pour la documentation complète de l'API.
212
+
213
+ ### Entry Points
214
+
215
+ - **Import principal** : `import { Component } from "@wakastellar/ui"`
216
+ - **Styles** : `import "@wakastellar/ui/dist/ui.css"`
217
+ - **Exports** : ESM (`dist/index.es.js`) et CJS (`dist/index.cjs.js`)
218
+
219
+ ---
220
+
221
+ ## Bonnes pratiques
222
+
223
+ ### Performance
224
+
225
+ - Utilisez la virtualisation pour les grandes quantités de données (DataTable)
226
+ - Debouncez les filtres et recherches
227
+ - Mémoïsez les colonnes et callbacks dans les DataTables
228
+
229
+ ### Accessibilité
230
+
231
+ - Fournissez des labels descriptifs pour tous les champs
232
+ - Validez la navigation clavier
233
+ - Respectez les standards ARIA
234
+
235
+ ### Sécurité
236
+
237
+ - Validez et sanitisez tout contenu injecté dans les cellules (XSS)
238
+ - Ne loggez pas d'informations sensibles
239
+ - Utilisez des validations côté serveur en complément
240
+
241
+ ### SSR/Next.js
242
+
243
+ - Évitez l'accès direct à `window` côté serveur
244
+ - Initialisez les données côté client si nécessaire
245
+ - Utilisez les composants avec `"use client"` pour l'interactivité
246
+
247
+ ---
248
+
249
+ ## Tests & Qualité
250
+
251
+ La librairie est testée avec :
252
+
253
+ - **vitest** 3.2.4 - Tests unitaires
254
+ - **@testing-library/react** - Tests de composants
255
+ - **@vitest/coverage-v8** - Couverture de code
256
+ - **TypeScript strict mode** - Validation de types
257
+ - **eslint** - Linting
258
+ - **prettier** - Formatage
259
+
260
+ **Recommandations pour l'intégration** :
261
+
262
+ - Testez les cas critiques (tri, filtres, pagination, sélection)
263
+ - Validez l'accessibilité (navigation clavier, lecteurs d'écran)
264
+ - Vérifiez le tree-shaking (ESM) et la taille des bundles
265
+ - Exécutez `tsc --noEmit` en CI pour valider les types
266
+
267
+ ---
268
+
269
+ ## Distribution
270
+
271
+ - **Format** : ESM + CJS
272
+ - **TypeScript** : Définitions de types incluses
273
+ - **Sourcemaps** : Incluses pour le debugging
274
+ - **Tree-shaking** : Supporté via ESM
275
+ - **Versioning** : SemVer (major.minor.patch)
276
+
277
+ ---
278
+
279
+ ## Licence
280
+
281
+ Ce projet est publié sous licence **AGPL-3.0**.
282
+
283
+ Voir le fichier [LICENSE](./LICENSE) pour plus de détails.
284
+
285
+ ---
286
+
287
+ <div align="center">
288
+
289
+ **Fait avec ❤️ par Wakastellar**
290
+
291
+ </div>
package/package.json CHANGED
@@ -1,8 +1,11 @@
1
1
  {
2
2
  "name": "@wakastellar/ui",
3
- "version": "0.1.0",
3
+ "version": "0.1.2",
4
4
  "description": "UI Library compatible TweakCN + i18n pour Next.js",
5
- "keywords": ["ui", "interfaces"],
5
+ "keywords": [
6
+ "ui",
7
+ "interfaces"
8
+ ],
6
9
  "publisher": "wakastellar",
7
10
  "displayName": "Wakastellar - UI",
8
11
  "main": "./dist/index.cjs.js",