@wavemaker/foundation-css 11.10.5-next.27872 → 11.10.5-rc.207

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 (79) hide show
  1. package/foundation/foundation.css +1278 -1063
  2. package/foundation/foundation.min.css +1 -1
  3. package/index.d.ts +18 -27
  4. package/index.js +92 -42
  5. package/index.js.map +1 -0
  6. package/npm-shrinkwrap.json +225 -8
  7. package/package-lock.json +225 -8
  8. package/package.json +10 -3
  9. package/tokens/components/accordion/accordion.json +10 -0
  10. package/tokens/components/anchor/anchor.json +86 -0
  11. package/tokens/components/badge/badge.json +52 -0
  12. package/tokens/components/breadcrumb/breadcrumb.json +98 -0
  13. package/tokens/components/button/button.json +710 -0
  14. package/tokens/components/button-group/button-group.json +18 -0
  15. package/tokens/components/calendar/calendar.json +274 -0
  16. package/tokens/components/cards/cards.json +176 -0
  17. package/tokens/components/carousel/carousel.json +46 -0
  18. package/tokens/components/checkbox/checkbox.json +106 -0
  19. package/tokens/components/checkboxset/checkboxset.json +10 -0
  20. package/tokens/components/chips/chips.json +202 -0
  21. package/tokens/components/composite/composite.json +202 -0
  22. package/tokens/components/container/container.json +32 -0
  23. package/tokens/components/currency/currency.json +32 -0
  24. package/tokens/components/data-table/data-table.json +170 -0
  25. package/tokens/components/date/date.json +146 -0
  26. package/tokens/components/dropdown-menu/dropdown-menu.json +116 -0
  27. package/tokens/components/fileupload/fileupload.json +180 -0
  28. package/tokens/components/grid-layout/grid-layout.json +18 -0
  29. package/tokens/components/icon/icon.json +8 -0
  30. package/tokens/components/label/label.json +8 -0
  31. package/tokens/components/list/list.json +72 -0
  32. package/tokens/components/message/message.json +144 -0
  33. package/tokens/components/modal-dialog/modal-dialog.json +176 -0
  34. package/tokens/components/nav/nav.json +222 -0
  35. package/tokens/components/page-layout/page-layout.json +842 -0
  36. package/tokens/components/pagination/pagination.json +250 -0
  37. package/tokens/components/panel/panel.json +218 -0
  38. package/tokens/components/picture/picture.json +42 -0
  39. package/tokens/components/popover/popover.json +102 -0
  40. package/tokens/components/progress-bar/progress-bar.json +122 -0
  41. package/tokens/components/progress-circle/progress-circle.json +64 -0
  42. package/tokens/components/radioset/radioset.json +116 -0
  43. package/tokens/components/rating/rating.json +42 -0
  44. package/tokens/components/richtext-editor/richtext-editor.json +546 -0
  45. package/tokens/components/scrollbar/scrollbar.json +38 -0
  46. package/tokens/components/search/search.json +200 -0
  47. package/tokens/components/spinner/spinner.json +44 -0
  48. package/tokens/components/switch/switch.json +106 -0
  49. package/tokens/components/tabs/tabs.json +136 -0
  50. package/tokens/components/tile/tile.json +186 -0
  51. package/tokens/components/time/time.json +90 -0
  52. package/tokens/components/toast/toast.json +214 -0
  53. package/tokens/components/toggle/toggle.json +98 -0
  54. package/tokens/components/wizard/wizard.json +232 -0
  55. package/tokens/global/border/border.json +96 -0
  56. package/tokens/global/box-shadow/box-shadow.json +9 -0
  57. package/tokens/{primitives → global}/colors/color.dark.json +12 -3
  58. package/tokens/global/colors/color.json +343 -0
  59. package/tokens/{semantics → global}/font/font.json +74 -20
  60. package/tokens/global/gap/gap.json +58 -0
  61. package/tokens/{semantics → global}/icon/icon.json +1 -1
  62. package/tokens/global/margin/margin.json +57 -0
  63. package/tokens/global/radius/radius.json +45 -0
  64. package/tokens/global/shadow/shadow.json +74 -0
  65. package/tokens/global/space/space.json +57 -0
  66. package/tokens/global/spacer/spacer.json +46 -0
  67. package/utils/style-dictionary-utils.d.ts +7 -0
  68. package/utils/style-dictionary-utils.js +65 -0
  69. package/utils/style-dictionary-utils.js.map +1 -0
  70. package/tokens/primitives/border/border.json +0 -10
  71. package/tokens/primitives/colors/color.json +0 -163
  72. package/tokens/primitives/font/font.json +0 -20
  73. package/tokens/primitives/radius/radius.json +0 -14
  74. package/tokens/primitives/space/space.json +0 -57
  75. package/tokens/primitives/spacer/spacer.json +0 -45
  76. package/tokens/semantics/box-shadow/box-shadow.json +0 -8
  77. package/tokens/semantics/colors/color.json +0 -948
  78. /package/tokens/{primitives → global}/colors/color.light.json +0 -0
  79. /package/tokens/{semantics → global}/opacity/opacity.json +0 -0
package/tokens/components/richtext-editor/richtext-editor.json ADDED
@@ -0,0 +1,546 @@
1
+ {
2
+ "note": {
3
+ "editor": {
4
+ "toolbar": {
5
+ "border": {
6
+ "@": {
7
+ "value": "{border.color.translucent.value}",
8
+ "type": "color"
9
+ },
10
+ "style": {
11
+ "value": "{border.style.base.value}",
12
+ "type": "radius"
13
+ },
14
+ "width": {
15
+ "value": "{border.width.base.value}",
16
+ "type": "space"
17
+ },
18
+ "gap": {
19
+ "value": "{space.1.value}",
20
+ "type": "space"
21
+ }
22
+ },
23
+ "background": {
24
+ "value": "{color.white.@.value}",
25
+ "type": "color"
26
+ },
27
+ "padding": {
28
+ "value": "{space.2.value}",
29
+ "type": "space"
30
+ },
31
+ "gap": {
32
+ "value": "{space.3.value}",
33
+ "type": "space"
34
+ }
35
+ },
36
+ "radius": {
37
+ "value": "{radius.sm.value}",
38
+ "type": "radius"
39
+ },
40
+ "border": {
41
+ "@": {
42
+ "value": "{border.color.translucent.value}",
43
+ "type": "color"
44
+ },
45
+ "style": {
46
+ "value": "{border.style.base.value}",
47
+ "type": "radius"
48
+ },
49
+ "width": {
50
+ "value": "{border.width.base.value}",
51
+ "type": "space"
52
+ }
53
+ },
54
+ "note": {
55
+ "placeholder": {
56
+ "pdding": {
57
+ "value": "{space.3.value}",
58
+ "type": "space"
59
+ }
60
+ },
61
+ "code": {
62
+ "padding": {
63
+ "value": "{space.3.value}",
64
+ "type": "space"
65
+ },
66
+ "background": {
67
+ "value": "{color.on-warning.@.value}",
68
+ "type": "color"
69
+ },
70
+ "color": {
71
+ "value": "{color.surface.@.value}",
72
+ "type": "color"
73
+ },
74
+ "font-size": {
75
+ "value": "{body.medium.font-size.value}",
76
+ "type": "font"
77
+ },
78
+ "font-weight": {
79
+ "value": "{body.medium.font-weight.value}",
80
+ "type": "font"
81
+ },
82
+ "font-family": {
83
+ "value": "Menlo, Monaco, monospace, sans-serif",
84
+ "type": "font"
85
+ }
86
+ }
87
+ },
88
+ "btn": {
89
+ "group": {
90
+ "gap": {
91
+ "value": "{space.2.value}",
92
+ "type": "space"
93
+ }
94
+ },
95
+ "padding": {
96
+ "value": "{space.1.value}",
97
+ "type": "space"
98
+ },
99
+ "min": {
100
+ "height": {
101
+ "value": "28px",
102
+ "type": "space"
103
+ }
104
+ },
105
+ "width": {
106
+ "value": "28px",
107
+ "type": "space"
108
+ },
109
+ "radius": {
110
+ "value": "{radius.xs.value}",
111
+ "type": "radius"
112
+ }
113
+ },
114
+ "dropdown": {
115
+ "menu": {
116
+ "background": {
117
+ "value": "{color.surface.@.value}",
118
+ "type": "color"
119
+ },
120
+ "border": {
121
+ "radius": {
122
+ "value": "{radius.xs.value}",
123
+ "type": "radius"
124
+ }
125
+ },
126
+ "box": {
127
+ "shadow": {
128
+ "value": "{elevation.shadow.2.value}",
129
+ "type": "radius"
130
+ }
131
+ },
132
+ "width": {
133
+ "value": "200px",
134
+ "type": "space"
135
+ },
136
+ "max": {
137
+ "height": {
138
+ "value": "250px",
139
+ "type": "space"
140
+ }
141
+ },
142
+ "padding": {
143
+ "value": "{space.2.value}",
144
+ "type": "space"
145
+ },
146
+ "item": {
147
+ "font-family": {
148
+ "value": "{body.large.font-family.value}",
149
+ "type": "font"
150
+ },
151
+ "font-size": {
152
+ "value": "{body.large.font-size.value}",
153
+ "type": "font"
154
+ },
155
+ "font-weight": {
156
+ "value": "{body.large.font-weight.value}",
157
+ "type": "font"
158
+ },
159
+ "line-height": {
160
+ "value": "{body.large.line-height.value}",
161
+ "type": "font"
162
+ },
163
+ "letter-spacing": {
164
+ "value": "{body.large.letter-spacing.value}",
165
+ "type": "font"
166
+ },
167
+ "color": {
168
+ "value": "{color.on-surface.@.value}",
169
+ "type": "color"
170
+ },
171
+ "state": {
172
+ "layer": {
173
+ "opacity": {
174
+ "focus": {
175
+ "value": "{opacity.focus.value}",
176
+ "type": "radius"
177
+ },
178
+ "hover": {
179
+ "value": "{opacity.hover.value}",
180
+ "type": "radius"
181
+ },
182
+ "active": {
183
+ "value": "{opacity.active.value}",
184
+ "type": "radius"
185
+ }
186
+ }
187
+ }
188
+ }
189
+ },
190
+ "min": {
191
+ "width": {
192
+ "value": "180px",
193
+ "type": "space"
194
+ }
195
+ }
196
+ }
197
+ },
198
+ "pre": {
199
+ "border": {
200
+ "color": {
201
+ "value": "{color.secondary.fixed.@.value}",
202
+ "type": "color"
203
+ },
204
+ "width": {
205
+ "value": "{border.width.base.value}",
206
+ "type": "space"
207
+ }
208
+ },
209
+ "background": {
210
+ "value": "{color.surface.@.value}",
211
+ "type": "color"
212
+ },
213
+ "padding": {
214
+ "value": "{space.2.value}",
215
+ "type": "space"
216
+ },
217
+ "radius": {
218
+ "value": "{radius.xs.value}",
219
+ "type": "radius"
220
+ },
221
+ "font-family": {
222
+ "value": "{body.small.font-family.value}",
223
+ "type": "font"
224
+ },
225
+ "font-size": {
226
+ "value": "{body.small.font-size.value}",
227
+ "type": "font"
228
+ },
229
+ "font-weight": {
230
+ "value": "{body.small.font-weight.value}",
231
+ "type": "font"
232
+ },
233
+ "line-height": {
234
+ "value": "{body.small.line-height.value}",
235
+ "type": "font"
236
+ },
237
+ "color": {
238
+ "value": "{color.on-secondary.fixed.variant.value}",
239
+ "type": "color"
240
+ }
241
+ },
242
+ "blockquote": {
243
+ "border": {
244
+ "color": {
245
+ "value": "{color.primary.container.@.value}",
246
+ "type": "color"
247
+ },
248
+ "width": {
249
+ "value": "4px",
250
+ "type": "space"
251
+ },
252
+ "hover": {
253
+ "color": {
254
+ "value": "{color.primary.@.value}",
255
+ "type": "color"
256
+ }
257
+ }
258
+ },
259
+ "margin": {
260
+ "value": "{space.3.value}",
261
+ "type": "space"
262
+ },
263
+ "inline": {
264
+ "padding": {
265
+ "value": "{space.3.value}",
266
+ "type": "space"
267
+ }
268
+ },
269
+ "block": {
270
+ "padding": {
271
+ "value": "{space.2.value}",
272
+ "type": "space"
273
+ }
274
+ }
275
+ },
276
+ "para": {
277
+ "dropdown": {
278
+ "padding": {
279
+ "value": "{space.1.value}",
280
+ "type": "space"
281
+ }
282
+ }
283
+ },
284
+ "tooltip": {
285
+ "border": {
286
+ "color": {
287
+ "value": "{color.black.@.value}",
288
+ "type": "color"
289
+ }
290
+ },
291
+ "content": {
292
+ "color": {
293
+ "value": "{color.white.@.value}",
294
+ "type": "color"
295
+ },
296
+ "background": {
297
+ "value": "{color.black.@.value}",
298
+ "type": "color"
299
+ },
300
+ "padding": {
301
+ "value": "{space.1.value} {space.2.value}",
302
+ "type": "space"
303
+ },
304
+ "max": {
305
+ "width": {
306
+ "value": "200px",
307
+ "type": "space"
308
+ }
309
+ }
310
+ },
311
+ "arrow": {
312
+ "border": {
313
+ "width": {
314
+ "value": "5px",
315
+ "type": "space"
316
+ }
317
+ },
318
+ "margin": {
319
+ "value": "{space.1.value}",
320
+ "type": "space"
321
+ }
322
+ },
323
+ "radius": {
324
+ "value": "{radius.xs.value}",
325
+ "type": "radius"
326
+ },
327
+ "font-size": {
328
+ "value": "{body.medium.font-size.value}",
329
+ "type": "font"
330
+ },
331
+ "font-weight": {
332
+ "value": "{body.medium.font-weight.value}",
333
+ "type": "font"
334
+ },
335
+ "font-family": {
336
+ "value": "{body.medium.font-family.value}",
337
+ "type": "font"
338
+ },
339
+ "padding": {
340
+ "value": "{space.1.value}",
341
+ "type": "space"
342
+ },
343
+ "margin": {
344
+ "value": "{space.1.value}",
345
+ "type": "space"
346
+ }
347
+ },
348
+ "color": {
349
+ "btn": {
350
+ "size": {
351
+ "value": "16px",
352
+ "type": "space"
353
+ }
354
+ },
355
+ "reset": {
356
+ "background": {
357
+ "value": "{color.white.@.value}",
358
+ "type": "color"
359
+ }
360
+ },
361
+ "select": {
362
+ "background": {
363
+ "value": "{color.white.@.value}",
364
+ "type": "color"
365
+ },
366
+ "btn": {
367
+ "width": {
368
+ "value": "40px",
369
+ "type": "space"
370
+ },
371
+ "height": {
372
+ "value": "14px",
373
+ "type": "space"
374
+ },
375
+ "min": {
376
+ "height": {
377
+ "value": "14px",
378
+ "type": "space"
379
+ }
380
+ }
381
+ }
382
+ },
383
+ "dropdown": {
384
+ "gap": {
385
+ "value": "{space.3.value}",
386
+ "type": "space"
387
+ },
388
+ "padding": {
389
+ "value": "{space.3.value}",
390
+ "type": "space"
391
+ }
392
+ },
393
+ "palette": {
394
+ "gap": {
395
+ "xs": {
396
+ "value": "{space.1.value}",
397
+ "type": "space"
398
+ }
399
+ }
400
+ },
401
+ "row": {
402
+ "gap": {
403
+ "value": "{space.1.value}",
404
+ "type": "space"
405
+ }
406
+ }
407
+ },
408
+ "palette": {
409
+ "width": {
410
+ "value": "160px",
411
+ "type": "space"
412
+ },
413
+ "gap": {
414
+ "value": "{space.2.value}",
415
+ "type": "space"
416
+ }
417
+ },
418
+ "dropzone": {
419
+ "color": {
420
+ "value": "{color.primary.@.value}",
421
+ "type": "color"
422
+ },
423
+ "background": {
424
+ "value": "{color.white.@.value}",
425
+ "type": "color"
426
+ },
427
+ "hover": {
428
+ "color": {
429
+ "value": "{color.primary.container.@.value}",
430
+ "type": "color"
431
+ }
432
+ }
433
+ },
434
+ "td": {
435
+ "border": {
436
+ "color": {
437
+ "value": "{border.color.translucent.value}",
438
+ "type": "color"
439
+ },
440
+ "width": {
441
+ "value": "{border.width.base.value}",
442
+ "type": "space"
443
+ },
444
+ "style": {
445
+ "value": "{border.style.base.value}",
446
+ "type": "radius"
447
+ }
448
+ },
449
+ "padding": {
450
+ "value": "{space.1.value}",
451
+ "type": "space"
452
+ }
453
+ },
454
+ "popover": {
455
+ "arrow": {
456
+ "margin": {
457
+ "value": "{space.2.value}",
458
+ "type": "space"
459
+ },
460
+ "background": {
461
+ "value": "{color.white.@.value}",
462
+ "type": "color"
463
+ }
464
+ },
465
+ "margin": {
466
+ "value": "{space.1.value}",
467
+ "type": "space"
468
+ },
469
+ "background": {
470
+ "value": "{color.white.@.value}",
471
+ "type": "color"
472
+ },
473
+ "radius": {
474
+ "value": "{radius.xs.value}",
475
+ "type": "radius"
476
+ },
477
+ "padding": {
478
+ "@": {
479
+ "value": "{space.1.value}",
480
+ "type": "space"
481
+ },
482
+ "container": {
483
+ "value": "{space.2.value}",
484
+ "type": "space"
485
+ }
486
+ },
487
+ "content": {
488
+ "color": {
489
+ "value": "{color.black.@.value}",
490
+ "type": "color"
491
+ },
492
+ "background": {
493
+ "value": "{color.white.@.value}",
494
+ "type": "color"
495
+ },
496
+ "min": {
497
+ "width": {
498
+ "value": "100px",
499
+ "type": "space"
500
+ },
501
+ "height": {
502
+ "value": "30px",
503
+ "type": "space"
504
+ }
505
+ },
506
+ "padding": {
507
+ "value": "{space.1.value} {space.2.value}",
508
+ "type": "space"
509
+ }
510
+ },
511
+ "border": {
512
+ "value": "{color.outline.variant.value}",
513
+ "type": "color"
514
+ },
515
+ "btn": {
516
+ "group": {
517
+ "gap": {
518
+ "value": "{space.2.value}",
519
+ "type": "space"
520
+ }
521
+ }
522
+ }
523
+ }
524
+ },
525
+ "editable": {
526
+ "background": {
527
+ "value": "{color.surface.container.low.@.value}",
528
+ "type": "color"
529
+ },
530
+ "padding": {
531
+ "value": "{space.3.value}",
532
+ "type": "space"
533
+ },
534
+ "color": {
535
+ "value": "{color.black.@.value}",
536
+ "type": "color"
537
+ },
538
+ "hr": {
539
+ "color": {
540
+ "value": "{color.inverse.on-surface.@.value}",
541
+ "type": "color"
542
+ }
543
+ }
544
+ }
545
+ }
546
+ }
package/tokens/components/scrollbar/scrollbar.json ADDED
@@ -0,0 +1,38 @@
1
+ {
2
+ "scroll": {
3
+ "bar": {
4
+ "width": {
5
+ "value": "6px",
6
+ "type": "space"
7
+ },
8
+ "height": {
9
+ "value": "6px",
10
+ "type": "space"
11
+ },
12
+ "track": {
13
+ "bg": {
14
+ "value": "{color.surface.@.value}",
15
+ "type": "color"
16
+ },
17
+ "radius": {
18
+ "value": "6px",
19
+ "type": "space"
20
+ }
21
+ },
22
+ "thumb": {
23
+ "bg": {
24
+ "value": "{color.surface.container.high.@.value}",
25
+ "type": "color"
26
+ },
27
+ "radius": {
28
+ "value": "6px",
29
+ "type": "space"
30
+ },
31
+ "hover": {
32
+ "value": "{color.surface.container.highest.@.value}",
33
+ "type": "color"
34
+ }
35
+ }
36
+ }
37
+ }
38
+ }