@feugene/granularity 0.28.1 → 0.28.3
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 +16 -12
- package/dist/web-types.json +1 -1
- package/package.json +89 -5
package/README.md
CHANGED
|
@@ -32,16 +32,16 @@ strategies.
|
|
|
32
32
|
|
|
33
33
|
- root export: `@feugene/granularity`;
|
|
34
34
|
- component subpath exports: `@feugene/granularity/components/<ComponentName>`;
|
|
35
|
-
- ready-made CSS
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
- low-level foundation exports: `@feugene/granularity/styles/tokens.css`, `@feugene/granularity/styles/base.css`, `@feugene/granularity/styles/themes/light.css`, `@feugene/granularity/styles/themes/dark.css`;
|
|
35
|
+
- ready-made CSS entrypoint: `@feugene/granularity/styles.css` — tokens, base layer, preflight and the
|
|
36
|
+
built-in `light`/`dark` themes in one file, for consumers who do not run the `UnoCSS` preset. A
|
|
37
|
+
component's own CSS is not there and does not need to be: the component's chunk imports it itself;
|
|
38
|
+
- low-level foundation exports: `@feugene/granularity/styles/tokens.css`, `@feugene/granularity/styles/base.css`, `@feugene/granularity/styles/preflight.css`, `@feugene/granularity/styles/themes/light.css`, `@feugene/granularity/styles/themes/dark.css`;
|
|
40
39
|
- package-level API: `@feugene/granularity/directives`, `@feugene/granularity/fileValidation`;
|
|
41
40
|
- design tokens as data: `@feugene/granularity/tokens` (typed registry) and the raw `@feugene/granularity/tokens/*.json` source the CSS is generated from;
|
|
42
|
-
- two `UnoCSS` integration scenarios:
|
|
43
|
-
- `@feugene/granularity/
|
|
44
|
-
- `@feugene/granularity/
|
|
41
|
+
- two `UnoCSS` integration scenarios, both through the granular provider:
|
|
42
|
+
- `@feugene/granularity/granular-provider` — browser-safe registry of components;
|
|
43
|
+
- `@feugene/granularity/granular-provider/node` — the node-side counterpart, which reads CSS and
|
|
44
|
+
preflight from the file system.
|
|
45
45
|
|
|
46
46
|
## Limitations
|
|
47
47
|
|
|
@@ -74,11 +74,15 @@ yarn add -D unocss
|
|
|
74
74
|
import '@feugene/granularity/styles.css'
|
|
75
75
|
```
|
|
76
76
|
|
|
77
|
-
That's enough to
|
|
78
|
-
built-in `light`/`dark` themes
|
|
77
|
+
That's enough to get a working base: the file carries the tokens, the base layer, the preflight and the
|
|
78
|
+
built-in `light`/`dark` themes. What it does not carry is the utility classes the components are built
|
|
79
|
+
from — those are generated by the `UnoCSS` preset for the components you actually select. Without the preset
|
|
80
|
+
a component renders with its own CSS but without layout utilities.
|
|
79
81
|
|
|
80
|
-
|
|
81
|
-
|
|
82
|
+
For a finer setup take the layers apart — `@feugene/granularity/styles/tokens.css`,
|
|
83
|
+
`styles/base.css`, `styles/preflight.css`, `styles/themes/<name>.css` — or assemble everything with the
|
|
84
|
+
preset. There is no per-component stylesheet to import: a component that has CSS of its own imports it
|
|
85
|
+
from its own chunk, so a granular import already brings everything it needs.
|
|
82
86
|
|
|
83
87
|
## Documentation
|
|
84
88
|
|
package/dist/web-types.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
|
|
3
3
|
"name": "@feugene/granularity",
|
|
4
|
-
"version": "0.28.
|
|
4
|
+
"version": "0.28.3",
|
|
5
5
|
"framework": "vue",
|
|
6
6
|
"js-types-syntax": "typescript",
|
|
7
7
|
"description-markup": "markdown",
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@feugene/granularity",
|
|
3
3
|
"description": "Granularity design system package with Vue 3 components, consumed via the `@feugene/unocss-preset-granular` preset.",
|
|
4
|
-
"version": "0.28.
|
|
4
|
+
"version": "0.28.3",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"author": {
|
|
7
7
|
"name": "Evgeniy Fureev",
|
|
@@ -53,6 +53,7 @@
|
|
|
53
53
|
"default": "./dist/index.js"
|
|
54
54
|
},
|
|
55
55
|
"./styles/*": "./dist/styles/*",
|
|
56
|
+
"./styles.css": "./dist/styles/index.css",
|
|
56
57
|
"./composables/useAnnouncer": {
|
|
57
58
|
"types": "./dist/types/composables/useAnnouncer.d.ts",
|
|
58
59
|
"import": "./dist/composables/useAnnouncer.js"
|
|
@@ -69,6 +70,10 @@
|
|
|
69
70
|
"types": "./dist/types/components/GrAvatar/index.d.ts",
|
|
70
71
|
"import": "./dist/components/GrAvatar/index.js"
|
|
71
72
|
},
|
|
73
|
+
"./components/GrAvatarGroup": {
|
|
74
|
+
"types": "./dist/types/components/GrAvatar/index.d.ts",
|
|
75
|
+
"import": "./dist/components/GrAvatar/index.js"
|
|
76
|
+
},
|
|
72
77
|
"./components/GrBadge": {
|
|
73
78
|
"types": "./dist/types/components/GrBadge/index.d.ts",
|
|
74
79
|
"import": "./dist/components/GrBadge/index.js"
|
|
@@ -121,6 +126,10 @@
|
|
|
121
126
|
"types": "./dist/types/components/GrCollapse/index.d.ts",
|
|
122
127
|
"import": "./dist/components/GrCollapse/index.js"
|
|
123
128
|
},
|
|
129
|
+
"./components/GrCollapseItem": {
|
|
130
|
+
"types": "./dist/types/components/GrCollapse/index.d.ts",
|
|
131
|
+
"import": "./dist/components/GrCollapse/index.js"
|
|
132
|
+
},
|
|
124
133
|
"./components/GrColorPicker": {
|
|
125
134
|
"types": "./dist/types/components/GrColorPicker/index.d.ts",
|
|
126
135
|
"import": "./dist/components/GrColorPicker/index.js"
|
|
@@ -157,10 +166,26 @@
|
|
|
157
166
|
"types": "./dist/types/components/GrDialog/index.d.ts",
|
|
158
167
|
"import": "./dist/components/GrDialog/index.js"
|
|
159
168
|
},
|
|
169
|
+
"./components/GrDialogCloseButton": {
|
|
170
|
+
"types": "./dist/types/components/GrDialog/index.d.ts",
|
|
171
|
+
"import": "./dist/components/GrDialog/index.js"
|
|
172
|
+
},
|
|
173
|
+
"./components/GrDialogFooter": {
|
|
174
|
+
"types": "./dist/types/components/GrDialog/index.d.ts",
|
|
175
|
+
"import": "./dist/components/GrDialog/index.js"
|
|
176
|
+
},
|
|
177
|
+
"./components/GrDialogHeader": {
|
|
178
|
+
"types": "./dist/types/components/GrDialog/index.d.ts",
|
|
179
|
+
"import": "./dist/components/GrDialog/index.js"
|
|
180
|
+
},
|
|
160
181
|
"./components/GrDialogService": {
|
|
161
182
|
"types": "./dist/types/components/GrDialogService/index.d.ts",
|
|
162
183
|
"import": "./dist/components/GrDialogService/index.js"
|
|
163
184
|
},
|
|
185
|
+
"./components/GrDialogServiceHost": {
|
|
186
|
+
"types": "./dist/types/components/GrDialogService/index.d.ts",
|
|
187
|
+
"import": "./dist/components/GrDialogService/index.js"
|
|
188
|
+
},
|
|
164
189
|
"./components/GrDivider": {
|
|
165
190
|
"types": "./dist/types/components/GrDivider/index.d.ts",
|
|
166
191
|
"import": "./dist/components/GrDivider/index.js"
|
|
@@ -177,6 +202,34 @@
|
|
|
177
202
|
"types": "./dist/types/components/GrDropdownMenu/index.d.ts",
|
|
178
203
|
"import": "./dist/components/GrDropdownMenu/index.js"
|
|
179
204
|
},
|
|
205
|
+
"./components/GrDropdownMenuColumn": {
|
|
206
|
+
"types": "./dist/types/components/GrDropdownMenu/index.d.ts",
|
|
207
|
+
"import": "./dist/components/GrDropdownMenu/index.js"
|
|
208
|
+
},
|
|
209
|
+
"./components/GrDropdownMenuColumns": {
|
|
210
|
+
"types": "./dist/types/components/GrDropdownMenu/index.d.ts",
|
|
211
|
+
"import": "./dist/components/GrDropdownMenu/index.js"
|
|
212
|
+
},
|
|
213
|
+
"./components/GrDropdownMenuDivider": {
|
|
214
|
+
"types": "./dist/types/components/GrDropdownMenu/index.d.ts",
|
|
215
|
+
"import": "./dist/components/GrDropdownMenu/index.js"
|
|
216
|
+
},
|
|
217
|
+
"./components/GrDropdownMenuGroup": {
|
|
218
|
+
"types": "./dist/types/components/GrDropdownMenu/index.d.ts",
|
|
219
|
+
"import": "./dist/components/GrDropdownMenu/index.js"
|
|
220
|
+
},
|
|
221
|
+
"./components/GrDropdownMenuHeader": {
|
|
222
|
+
"types": "./dist/types/components/GrDropdownMenu/index.d.ts",
|
|
223
|
+
"import": "./dist/components/GrDropdownMenu/index.js"
|
|
224
|
+
},
|
|
225
|
+
"./components/GrDropdownMenuItem": {
|
|
226
|
+
"types": "./dist/types/components/GrDropdownMenu/index.d.ts",
|
|
227
|
+
"import": "./dist/components/GrDropdownMenu/index.js"
|
|
228
|
+
},
|
|
229
|
+
"./components/GrDropdownMenuList": {
|
|
230
|
+
"types": "./dist/types/components/GrDropdownMenu/index.d.ts",
|
|
231
|
+
"import": "./dist/components/GrDropdownMenu/index.js"
|
|
232
|
+
},
|
|
180
233
|
"./components/GrEmptyState": {
|
|
181
234
|
"types": "./dist/types/components/GrEmptyState/index.d.ts",
|
|
182
235
|
"import": "./dist/components/GrEmptyState/index.js"
|
|
@@ -193,6 +246,10 @@
|
|
|
193
246
|
"types": "./dist/types/components/GrForm/index.d.ts",
|
|
194
247
|
"import": "./dist/components/GrForm/index.js"
|
|
195
248
|
},
|
|
249
|
+
"./components/GrFormErrorBanner": {
|
|
250
|
+
"types": "./dist/types/components/GrResponseErrorBanner/index.d.ts",
|
|
251
|
+
"import": "./dist/components/GrResponseErrorBanner/index.js"
|
|
252
|
+
},
|
|
196
253
|
"./components/GrFormField": {
|
|
197
254
|
"types": "./dist/types/components/GrFormField/index.d.ts",
|
|
198
255
|
"import": "./dist/components/GrFormField/index.js"
|
|
@@ -237,6 +294,10 @@
|
|
|
237
294
|
"types": "./dist/types/components/GrList/index.d.ts",
|
|
238
295
|
"import": "./dist/components/GrList/index.js"
|
|
239
296
|
},
|
|
297
|
+
"./components/GrListItem": {
|
|
298
|
+
"types": "./dist/types/components/GrList/index.d.ts",
|
|
299
|
+
"import": "./dist/components/GrList/index.js"
|
|
300
|
+
},
|
|
240
301
|
"./components/GrLoading": {
|
|
241
302
|
"types": "./dist/types/components/GrLoading/index.d.ts",
|
|
242
303
|
"import": "./dist/components/GrLoading/index.js"
|
|
@@ -301,6 +362,14 @@
|
|
|
301
362
|
"types": "./dist/types/components/GrSidebar/index.d.ts",
|
|
302
363
|
"import": "./dist/components/GrSidebar/index.js"
|
|
303
364
|
},
|
|
365
|
+
"./components/GrSidebarGroup": {
|
|
366
|
+
"types": "./dist/types/components/GrSidebar/index.d.ts",
|
|
367
|
+
"import": "./dist/components/GrSidebar/index.js"
|
|
368
|
+
},
|
|
369
|
+
"./components/GrSidebarItem": {
|
|
370
|
+
"types": "./dist/types/components/GrSidebar/index.d.ts",
|
|
371
|
+
"import": "./dist/components/GrSidebar/index.js"
|
|
372
|
+
},
|
|
304
373
|
"./components/GrSkeleton": {
|
|
305
374
|
"types": "./dist/types/components/GrSkeleton/index.d.ts",
|
|
306
375
|
"import": "./dist/components/GrSkeleton/index.js"
|
|
@@ -333,6 +402,10 @@
|
|
|
333
402
|
"types": "./dist/types/components/GrTable/index.d.ts",
|
|
334
403
|
"import": "./dist/components/GrTable/index.js"
|
|
335
404
|
},
|
|
405
|
+
"./components/GrTabPanel": {
|
|
406
|
+
"types": "./dist/types/components/GrTabPanels/index.d.ts",
|
|
407
|
+
"import": "./dist/components/GrTabPanels/index.js"
|
|
408
|
+
},
|
|
336
409
|
"./components/GrTabPanels": {
|
|
337
410
|
"types": "./dist/types/components/GrTabPanels/index.d.ts",
|
|
338
411
|
"import": "./dist/components/GrTabPanels/index.js"
|
|
@@ -349,6 +422,10 @@
|
|
|
349
422
|
"types": "./dist/types/components/GrTimeline/index.d.ts",
|
|
350
423
|
"import": "./dist/components/GrTimeline/index.js"
|
|
351
424
|
},
|
|
425
|
+
"./components/GrTimelineItem": {
|
|
426
|
+
"types": "./dist/types/components/GrTimeline/index.d.ts",
|
|
427
|
+
"import": "./dist/components/GrTimeline/index.js"
|
|
428
|
+
},
|
|
352
429
|
"./components/GrToaster": {
|
|
353
430
|
"types": "./dist/types/components/GrToaster/index.d.ts",
|
|
354
431
|
"import": "./dist/components/GrToaster/index.js"
|
|
@@ -365,6 +442,10 @@
|
|
|
365
442
|
"types": "./dist/types/components/GrTreeSelect/index.d.ts",
|
|
366
443
|
"import": "./dist/components/GrTreeSelect/index.js"
|
|
367
444
|
},
|
|
445
|
+
"./components/GrUploadErrorBanner": {
|
|
446
|
+
"types": "./dist/types/components/GrResponseErrorBanner/index.d.ts",
|
|
447
|
+
"import": "./dist/components/GrResponseErrorBanner/index.js"
|
|
448
|
+
},
|
|
368
449
|
"./components/GrValue": {
|
|
369
450
|
"types": "./dist/types/components/GrValue/index.d.ts",
|
|
370
451
|
"import": "./dist/components/GrValue/index.js"
|
|
@@ -449,6 +530,9 @@
|
|
|
449
530
|
"types": "./dist/types/directives/dropzone.d.ts",
|
|
450
531
|
"import": "./dist/directives/dropzone.js"
|
|
451
532
|
},
|
|
533
|
+
"./directives/globalDirectives": {
|
|
534
|
+
"types": "./dist/types/directives/globalDirectives.d.ts"
|
|
535
|
+
},
|
|
452
536
|
"./directives/hotkey": {
|
|
453
537
|
"types": "./dist/types/directives/hotkey.d.ts",
|
|
454
538
|
"import": "./dist/directives/hotkey.js"
|
|
@@ -508,7 +592,7 @@
|
|
|
508
592
|
},
|
|
509
593
|
"peerDependencies": {
|
|
510
594
|
"@feugene/fint-i18n": "^0.6.0",
|
|
511
|
-
"@feugene/unocss-preset-granular": "^0.
|
|
595
|
+
"@feugene/unocss-preset-granular": "^0.10.1",
|
|
512
596
|
"@floating-ui/dom": "^1.8.0",
|
|
513
597
|
"vue": "^3.5.0"
|
|
514
598
|
},
|
|
@@ -523,8 +607,8 @@
|
|
|
523
607
|
"devDependencies": {
|
|
524
608
|
"@antfu/eslint-config": "^9.1.0",
|
|
525
609
|
"@feugene/fint-i18n": "^0.6.0",
|
|
526
|
-
"@feugene/granularity-test-kit": "^0.
|
|
527
|
-
"@feugene/unocss-preset-granular": "^0.
|
|
610
|
+
"@feugene/granularity-test-kit": "^0.5.0",
|
|
611
|
+
"@feugene/unocss-preset-granular": "^0.10.1",
|
|
528
612
|
"@floating-ui/dom": "^1.8.0",
|
|
529
613
|
"@iconify-json/lucide": "^1.2.117",
|
|
530
614
|
"@types/node": "^25.9.5",
|
|
@@ -545,7 +629,7 @@
|
|
|
545
629
|
"vue-tsc": "^3.3.7"
|
|
546
630
|
},
|
|
547
631
|
"scripts": {
|
|
548
|
-
"build": "vite build && gr-check-dist-dev-guard && node scripts/check-dist-no-tests.mjs && node scripts/generate-web-types.mjs && vue-tsc -p tsconfig.build.json",
|
|
632
|
+
"build": "vite build && gr-check-dist-dev-guard && node scripts/check-dist-no-tests.mjs && node scripts/generate-web-types.mjs && vue-tsc -p tsconfig.build.json && node scripts/check-dist-exports.mjs",
|
|
549
633
|
"check:messages": "fint-i18n-check-messages src/i18n/locales",
|
|
550
634
|
"dev": "vite build --watch",
|
|
551
635
|
"doctor": "granular doctor ./granular.options.mjs --strict",
|