spoko-design-system 1.19.0 → 1.20.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.
Files changed (92) hide show
  1. package/.claude/settings.json +48 -48
  2. package/.github/dependabot.yml +11 -11
  3. package/.github/todo.yml +3 -3
  4. package/.github/workflows/claude.yml +37 -37
  5. package/.github/workflows/code-quality.yml +72 -72
  6. package/.github/workflows/deploy.yml +43 -43
  7. package/.husky/README.md +41 -41
  8. package/.husky/commit-msg +1 -1
  9. package/.husky/pre-commit +40 -40
  10. package/.prettierignore +14 -14
  11. package/.prettierrc +30 -30
  12. package/.stackblitzrc +5 -5
  13. package/.vscode/extensions.json +4 -4
  14. package/.vscode/launch.json +11 -11
  15. package/.vscode/settings.json +21 -21
  16. package/CHANGELOG.md +462 -456
  17. package/CLAUDE.md +268 -268
  18. package/LICENSE +21 -21
  19. package/README.md +303 -132
  20. package/TOOLTIPS.md +236 -236
  21. package/astro.config.mjs +84 -84
  22. package/commitlint.config.js +3 -3
  23. package/dev-dist/sw.js +91 -91
  24. package/dev-dist/workbox-c676b6d3.js +3391 -3391
  25. package/eslint.config.js +70 -70
  26. package/icon.config.ts +348 -348
  27. package/index.ts +78 -78
  28. package/package.json +160 -160
  29. package/public/arrow-bottom.svg +7 -7
  30. package/public/fonts/lg.svg +53 -53
  31. package/public/fonts/vwhead-bold-demo.html +549 -549
  32. package/public/fonts/vwhead-regular-demo.html +549 -549
  33. package/public/fonts/vwtext-bold-demo.html +549 -549
  34. package/public/fonts/vwtext-regular-demo.html +549 -549
  35. package/public/github.svg +3 -3
  36. package/public/grid_dot.svg +4 -4
  37. package/public/linkedin.svg +44 -44
  38. package/public/make-scrollable-code-focusable.js +3 -3
  39. package/public/pagefind.yml +3 -3
  40. package/public/polo.blue.svg +29 -29
  41. package/public/spoko.space.svg +71 -71
  42. package/public/twitter.svg +46 -46
  43. package/renovate.json +6 -6
  44. package/sandbox.config.json +11 -11
  45. package/sonar-project.properties +26 -26
  46. package/src/components/Category/CategoryDetails.astro +46 -18
  47. package/src/pages/components/badges.mdx +57 -57
  48. package/src/pages/components/breadcrumbs.mdx +139 -139
  49. package/src/pages/components/buttons.mdx +359 -359
  50. package/src/pages/components/card.mdx +294 -294
  51. package/src/pages/components/carousel.mdx +62 -62
  52. package/src/pages/components/copyright.mdx +42 -42
  53. package/src/pages/components/details-list.mdx +207 -207
  54. package/src/pages/components/features-list.mdx +37 -37
  55. package/src/pages/components/flags.mdx +49 -49
  56. package/src/pages/components/fuck-russia.mdx +39 -39
  57. package/src/pages/components/hand-drive.mdx +78 -78
  58. package/src/pages/components/headline.mdx +337 -337
  59. package/src/pages/components/image.mdx +513 -513
  60. package/src/pages/components/input.mdx +367 -367
  61. package/src/pages/components/jumbotron.mdx +530 -530
  62. package/src/pages/components/modal.mdx +212 -212
  63. package/src/pages/components/post-header.mdx +64 -64
  64. package/src/pages/components/pr-code.mdx +213 -213
  65. package/src/pages/components/product-engine.mdx +418 -418
  66. package/src/pages/components/product-number.mdx +58 -58
  67. package/src/pages/components/product-tile.mdx +51 -51
  68. package/src/pages/components/quote.mdx +33 -33
  69. package/src/pages/components/slimbanner.mdx +260 -260
  70. package/src/pages/components/table.mdx +108 -108
  71. package/src/pages/core/colors.mdx +21 -21
  72. package/src/pages/core/grid.mdx +193 -193
  73. package/src/pages/core/introduction.mdx +77 -77
  74. package/src/pages/core/tooltips.mdx +491 -491
  75. package/src/pages/patterns/introduction.mdx +60 -60
  76. package/src/styles/_variables.scss +70 -70
  77. package/tailwind.config.cjs +8 -8
  78. package/tsconfig.json +28 -28
  79. package/uno-config/index.ts +269 -269
  80. package/uno-config/theme/breakpoints.ts +9 -9
  81. package/uno-config/theme/colors.ts +65 -65
  82. package/uno-config/theme/dimensions.ts +17 -17
  83. package/uno-config/theme/effects.ts +14 -14
  84. package/uno-config/theme/grid.ts +10 -10
  85. package/uno-config/theme/index.ts +26 -26
  86. package/uno-config/theme/shortcuts/buttons.ts +53 -53
  87. package/uno-config/theme/shortcuts/components.ts +124 -124
  88. package/uno-config/theme/shortcuts/index.ts +20 -20
  89. package/uno-config/theme/shortcuts/jumbotron.ts +71 -71
  90. package/uno-config/theme/shortcuts/layout.ts +75 -75
  91. package/uno-config/theme/typography.ts +29 -29
  92. package/uno.config.ts +2 -2
package/icon.config.ts CHANGED
@@ -1,349 +1,349 @@
1
- // icon.config.ts
2
-
3
- interface IconConfig {
4
- include: {
5
- [key: string]: string[];
6
- };
7
- collections?: {
8
- [key: string]: () => Promise<any>;
9
- };
10
- }
11
-
12
- // List of all supported collections
13
- export const iconCollections = [
14
- 'ant-design',
15
- 'bi',
16
- 'bx',
17
- 'carbon',
18
- 'circle-flags',
19
- 'ei',
20
- 'el',
21
- 'eos-icons',
22
- 'et',
23
- 'flowbite',
24
- 'fluent',
25
- 'fluent-emoji',
26
- 'ic',
27
- 'icon-park-outline',
28
- 'la',
29
- 'material-symbols-light',
30
- 'mdi',
31
- 'noto-v1',
32
- 'octicon',
33
- 'ph',
34
- 'simple-icons',
35
- 'system-uicons',
36
- 'uil',
37
- 'lucide',
38
- 'vscode-icons',
39
- 'streamline-freehand-color',
40
- ] as const;
41
-
42
- export type IconCollectionName = typeof iconCollections[number];
43
-
44
- export const iconConfig: IconConfig = {
45
- include: {
46
- mdi: [
47
- // Social
48
- "npm",
49
- "github",
50
- "facebook",
51
- "instagram",
52
- "youtube",
53
-
54
- // Notes & Content
55
- "post-it-note-edit-outline",
56
-
57
- // Car related
58
- "car-hatchback",
59
- "car-door",
60
- "car-side",
61
- "car-windshield-outline",
62
- "car-light-alert",
63
- "car-tire-alert",
64
- "car-light-dimmed",
65
- "car-light-fog",
66
- "car-light-high",
67
- "car-parking-lights",
68
- "car-esp",
69
- "car-brake-abs",
70
- "car-horn",
71
- "engine-outline",
72
-
73
- // Climate & Temperature
74
- "fan",
75
- "fan-off",
76
- "air-conditioner",
77
- "coolant-temperature",
78
-
79
- // Alerts & Warnings
80
- "car-brake-alert",
81
- "car-traction-control",
82
-
83
- // Other
84
- "card-text-outline",
85
- "fuel",
86
- "oil",
87
- "hazard-lights",
88
- "credit-card-outline"
89
- ],
90
-
91
- "ant-design": [
92
- "menu-fold-outlined",
93
- "menu-unfold-outlined",
94
- "menu-outlined",
95
- "bars-outlined",
96
- "appstore-outlined",
97
- "cluster-outlined",
98
- "audit-outlined",
99
- "build-twotone",
100
- "home-outlined",
101
- "close-outlined"
102
- ],
103
-
104
- bi: [
105
- "arrow-right-short",
106
- "credit-card",
107
- "emoji-smile",
108
- "envelope-open",
109
- "folder",
110
- "graph-up",
111
- "list-check",
112
- "list-task",
113
- "qr-code",
114
- "tag",
115
- "tags",
116
- "text-indent-left",
117
- "text-indent-right",
118
- "x"
119
- ],
120
-
121
- bx: [
122
- "arrow-back",
123
- "check",
124
- "detail",
125
- "file",
126
- "car",
127
- "credit-card",
128
- "barcode",
129
- "qr",
130
- "left-arrow-alt",
131
- "right-arrow-alt",
132
- "arrow-back"
133
- ],
134
-
135
- carbon: [
136
- "language",
137
- "checkmark",
138
- "home",
139
- "dicom-overlay"
140
- ],
141
-
142
- el: [
143
- "star-empty",
144
- "star",
145
- "heart-empty",
146
- "heart",
147
- "map-marker",
148
- "fire",
149
- "quote-right",
150
- "qrcode",
151
- "car",
152
- "indent-left",
153
- "indent-right",
154
- "ok"
155
- ],
156
-
157
- 'eos-icons': [
158
- "three-dots-loading",
159
- "bubble-loading",
160
- "loading",
161
- "installing"
162
- ],
163
-
164
- fluent: [
165
- "share-android-24-regular",
166
- "checkmark-24-filled",
167
- "tag-24-regular",
168
- "tag-multiple-24-regular"
169
- ],
170
-
171
- "fluent-emoji": [
172
- "cookie",
173
- "construction",
174
- "warning",
175
- "wrench"
176
- ],
177
-
178
- la: [
179
- "arrow-right",
180
- "arrow-left",
181
- "car",
182
- "car-side"
183
- ],
184
-
185
- octicon: [
186
- "chevron-left-24",
187
- "x-24",
188
- "alert-24",
189
- "graph-24",
190
- "comment-24",
191
- "comment-discussion-24",
192
- "clock-24",
193
- "star-24",
194
- "star-fill-24",
195
- "file-media-24",
196
- "heart-24",
197
- "heart-fill-24",
198
- "project-roadmap-24",
199
- "location-24",
200
- "info-24",
201
- "mark-github-16"
202
- ],
203
-
204
- uil: [
205
- "map-marker",
206
- "envelope",
207
- "phone",
208
- "tag-alt"
209
- ],
210
-
211
- lucide: [
212
- "book-text",
213
- "brain",
214
- "camera",
215
- "car-front",
216
- "car",
217
- "circle",
218
- "circuit-board",
219
- "codesandbox",
220
- "component",
221
- "cpu",
222
- "disc-2",
223
- "fan",
224
- "folder",
225
- "info",
226
- "lamp",
227
- "lightbulb",
228
- "link",
229
- "package",
230
- "qr-code",
231
- "radio",
232
- "scan-qr-code",
233
- "settings",
234
- "split",
235
- "trash-2",
236
- "warehouse",
237
- "wind",
238
- "wrench",
239
- ],
240
-
241
- "simple-icons": [
242
- "astro",
243
- "ebay",
244
- "allegro",
245
- "volkswagen",
246
- "audi",
247
- "skoda",
248
- "seat",
249
- "whatsapp",
250
- "x",
251
- "facebook",
252
- "messenger",
253
- "instagram",
254
- "telegram",
255
- "youtube",
256
- "vimeo",
257
- "carrd"
258
- ],
259
-
260
- "icon-park-outline": [
261
- "shopping-bag",
262
- "comment",
263
- "comments",
264
- "tag-one"
265
- ],
266
-
267
- flowbite: [
268
- "arrow-left-outline",
269
- "arrow-right-outline",
270
- "angle-left-outline",
271
- "angle-right-outline",
272
- "chevron-left-outline",
273
- "chevron-right-outline",
274
- "map-location-outline",
275
- "map-pin-alt-solid",
276
- "x-outline",
277
- "messages-outline",
278
- "arrow-down-to-bracket-outline",
279
- "check-outline",
280
- "plus-outline",
281
- "edit-outline",
282
- ],
283
-
284
- ph: [
285
- 'images-light',
286
- 'image-square-thin',
287
- 'cat-thin',
288
- 'copy-simple-light',
289
- 'engine-bold',
290
- ],
291
-
292
- ic: [
293
- 'sharp-photo-library'
294
- ],
295
-
296
- 'material-symbols-light': [
297
- 'broken-image-outline'
298
- ],
299
-
300
- et: [
301
- 'documents'
302
- ],
303
-
304
- 'system-uicons': [
305
- 'document-justified'
306
- ],
307
-
308
- 'vscode-icons': [
309
- 'file-type-astro',
310
- 'file-type-light-astro',
311
- 'file-type-unocss',
312
- 'file-type-vue',
313
- 'file-type-typescript',
314
- 'file-type-node',
315
- 'file-type-npm'
316
- ],
317
-
318
- 'streamline-freehand-color': [
319
- 'data-transfer-document-module',
320
- 'design-process-drawing-board',
321
- 'app-window-source-code',
322
- 'app-window-layout',
323
- 'database',
324
- 'module-building-blocks',
325
- 'layouts-array-1',
326
- 'archive-box',
327
- 'donation-charity-donate-box',
328
- 'coding-files-network-folder'
329
- ]
330
- },
331
- collections: {
332
- "streamline-freehand-color": () => import("@iconify-json/streamline-freehand-color/icons.json")
333
- }
334
- };
335
-
336
- // Helpers
337
- export function isIconIncluded(collection: IconCollectionName, iconName: string): boolean {
338
- return iconConfig.include[collection]?.includes(iconName) ?? false;
339
- }
340
-
341
- export function getIncludedIcons(collection: IconCollectionName): string[] {
342
- return iconConfig.include[collection] || [];
343
- }
344
-
345
- export function getAllIncludedIcons(): { [key in IconCollectionName]?: string[] } {
346
- return iconConfig.include;
347
- }
348
-
1
+ // icon.config.ts
2
+
3
+ interface IconConfig {
4
+ include: {
5
+ [key: string]: string[];
6
+ };
7
+ collections?: {
8
+ [key: string]: () => Promise<any>;
9
+ };
10
+ }
11
+
12
+ // List of all supported collections
13
+ export const iconCollections = [
14
+ 'ant-design',
15
+ 'bi',
16
+ 'bx',
17
+ 'carbon',
18
+ 'circle-flags',
19
+ 'ei',
20
+ 'el',
21
+ 'eos-icons',
22
+ 'et',
23
+ 'flowbite',
24
+ 'fluent',
25
+ 'fluent-emoji',
26
+ 'ic',
27
+ 'icon-park-outline',
28
+ 'la',
29
+ 'material-symbols-light',
30
+ 'mdi',
31
+ 'noto-v1',
32
+ 'octicon',
33
+ 'ph',
34
+ 'simple-icons',
35
+ 'system-uicons',
36
+ 'uil',
37
+ 'lucide',
38
+ 'vscode-icons',
39
+ 'streamline-freehand-color',
40
+ ] as const;
41
+
42
+ export type IconCollectionName = typeof iconCollections[number];
43
+
44
+ export const iconConfig: IconConfig = {
45
+ include: {
46
+ mdi: [
47
+ // Social
48
+ "npm",
49
+ "github",
50
+ "facebook",
51
+ "instagram",
52
+ "youtube",
53
+
54
+ // Notes & Content
55
+ "post-it-note-edit-outline",
56
+
57
+ // Car related
58
+ "car-hatchback",
59
+ "car-door",
60
+ "car-side",
61
+ "car-windshield-outline",
62
+ "car-light-alert",
63
+ "car-tire-alert",
64
+ "car-light-dimmed",
65
+ "car-light-fog",
66
+ "car-light-high",
67
+ "car-parking-lights",
68
+ "car-esp",
69
+ "car-brake-abs",
70
+ "car-horn",
71
+ "engine-outline",
72
+
73
+ // Climate & Temperature
74
+ "fan",
75
+ "fan-off",
76
+ "air-conditioner",
77
+ "coolant-temperature",
78
+
79
+ // Alerts & Warnings
80
+ "car-brake-alert",
81
+ "car-traction-control",
82
+
83
+ // Other
84
+ "card-text-outline",
85
+ "fuel",
86
+ "oil",
87
+ "hazard-lights",
88
+ "credit-card-outline"
89
+ ],
90
+
91
+ "ant-design": [
92
+ "menu-fold-outlined",
93
+ "menu-unfold-outlined",
94
+ "menu-outlined",
95
+ "bars-outlined",
96
+ "appstore-outlined",
97
+ "cluster-outlined",
98
+ "audit-outlined",
99
+ "build-twotone",
100
+ "home-outlined",
101
+ "close-outlined"
102
+ ],
103
+
104
+ bi: [
105
+ "arrow-right-short",
106
+ "credit-card",
107
+ "emoji-smile",
108
+ "envelope-open",
109
+ "folder",
110
+ "graph-up",
111
+ "list-check",
112
+ "list-task",
113
+ "qr-code",
114
+ "tag",
115
+ "tags",
116
+ "text-indent-left",
117
+ "text-indent-right",
118
+ "x"
119
+ ],
120
+
121
+ bx: [
122
+ "arrow-back",
123
+ "check",
124
+ "detail",
125
+ "file",
126
+ "car",
127
+ "credit-card",
128
+ "barcode",
129
+ "qr",
130
+ "left-arrow-alt",
131
+ "right-arrow-alt",
132
+ "arrow-back"
133
+ ],
134
+
135
+ carbon: [
136
+ "language",
137
+ "checkmark",
138
+ "home",
139
+ "dicom-overlay"
140
+ ],
141
+
142
+ el: [
143
+ "star-empty",
144
+ "star",
145
+ "heart-empty",
146
+ "heart",
147
+ "map-marker",
148
+ "fire",
149
+ "quote-right",
150
+ "qrcode",
151
+ "car",
152
+ "indent-left",
153
+ "indent-right",
154
+ "ok"
155
+ ],
156
+
157
+ 'eos-icons': [
158
+ "three-dots-loading",
159
+ "bubble-loading",
160
+ "loading",
161
+ "installing"
162
+ ],
163
+
164
+ fluent: [
165
+ "share-android-24-regular",
166
+ "checkmark-24-filled",
167
+ "tag-24-regular",
168
+ "tag-multiple-24-regular"
169
+ ],
170
+
171
+ "fluent-emoji": [
172
+ "cookie",
173
+ "construction",
174
+ "warning",
175
+ "wrench"
176
+ ],
177
+
178
+ la: [
179
+ "arrow-right",
180
+ "arrow-left",
181
+ "car",
182
+ "car-side"
183
+ ],
184
+
185
+ octicon: [
186
+ "chevron-left-24",
187
+ "x-24",
188
+ "alert-24",
189
+ "graph-24",
190
+ "comment-24",
191
+ "comment-discussion-24",
192
+ "clock-24",
193
+ "star-24",
194
+ "star-fill-24",
195
+ "file-media-24",
196
+ "heart-24",
197
+ "heart-fill-24",
198
+ "project-roadmap-24",
199
+ "location-24",
200
+ "info-24",
201
+ "mark-github-16"
202
+ ],
203
+
204
+ uil: [
205
+ "map-marker",
206
+ "envelope",
207
+ "phone",
208
+ "tag-alt"
209
+ ],
210
+
211
+ lucide: [
212
+ "book-text",
213
+ "brain",
214
+ "camera",
215
+ "car-front",
216
+ "car",
217
+ "circle",
218
+ "circuit-board",
219
+ "codesandbox",
220
+ "component",
221
+ "cpu",
222
+ "disc-2",
223
+ "fan",
224
+ "folder",
225
+ "info",
226
+ "lamp",
227
+ "lightbulb",
228
+ "link",
229
+ "package",
230
+ "qr-code",
231
+ "radio",
232
+ "scan-qr-code",
233
+ "settings",
234
+ "split",
235
+ "trash-2",
236
+ "warehouse",
237
+ "wind",
238
+ "wrench",
239
+ ],
240
+
241
+ "simple-icons": [
242
+ "astro",
243
+ "ebay",
244
+ "allegro",
245
+ "volkswagen",
246
+ "audi",
247
+ "skoda",
248
+ "seat",
249
+ "whatsapp",
250
+ "x",
251
+ "facebook",
252
+ "messenger",
253
+ "instagram",
254
+ "telegram",
255
+ "youtube",
256
+ "vimeo",
257
+ "carrd"
258
+ ],
259
+
260
+ "icon-park-outline": [
261
+ "shopping-bag",
262
+ "comment",
263
+ "comments",
264
+ "tag-one"
265
+ ],
266
+
267
+ flowbite: [
268
+ "arrow-left-outline",
269
+ "arrow-right-outline",
270
+ "angle-left-outline",
271
+ "angle-right-outline",
272
+ "chevron-left-outline",
273
+ "chevron-right-outline",
274
+ "map-location-outline",
275
+ "map-pin-alt-solid",
276
+ "x-outline",
277
+ "messages-outline",
278
+ "arrow-down-to-bracket-outline",
279
+ "check-outline",
280
+ "plus-outline",
281
+ "edit-outline",
282
+ ],
283
+
284
+ ph: [
285
+ 'images-light',
286
+ 'image-square-thin',
287
+ 'cat-thin',
288
+ 'copy-simple-light',
289
+ 'engine-bold',
290
+ ],
291
+
292
+ ic: [
293
+ 'sharp-photo-library'
294
+ ],
295
+
296
+ 'material-symbols-light': [
297
+ 'broken-image-outline'
298
+ ],
299
+
300
+ et: [
301
+ 'documents'
302
+ ],
303
+
304
+ 'system-uicons': [
305
+ 'document-justified'
306
+ ],
307
+
308
+ 'vscode-icons': [
309
+ 'file-type-astro',
310
+ 'file-type-light-astro',
311
+ 'file-type-unocss',
312
+ 'file-type-vue',
313
+ 'file-type-typescript',
314
+ 'file-type-node',
315
+ 'file-type-npm'
316
+ ],
317
+
318
+ 'streamline-freehand-color': [
319
+ 'data-transfer-document-module',
320
+ 'design-process-drawing-board',
321
+ 'app-window-source-code',
322
+ 'app-window-layout',
323
+ 'database',
324
+ 'module-building-blocks',
325
+ 'layouts-array-1',
326
+ 'archive-box',
327
+ 'donation-charity-donate-box',
328
+ 'coding-files-network-folder'
329
+ ]
330
+ },
331
+ collections: {
332
+ "streamline-freehand-color": () => import("@iconify-json/streamline-freehand-color/icons.json")
333
+ }
334
+ };
335
+
336
+ // Helpers
337
+ export function isIconIncluded(collection: IconCollectionName, iconName: string): boolean {
338
+ return iconConfig.include[collection]?.includes(iconName) ?? false;
339
+ }
340
+
341
+ export function getIncludedIcons(collection: IconCollectionName): string[] {
342
+ return iconConfig.include[collection] || [];
343
+ }
344
+
345
+ export function getAllIncludedIcons(): { [key in IconCollectionName]?: string[] } {
346
+ return iconConfig.include;
347
+ }
348
+
349
349
  export default iconConfig;