@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/chips/chips.json ADDED
@@ -0,0 +1,202 @@
1
+ {
2
+ "chips": {
3
+ "list": {
4
+ "gap": {
5
+ "value": "{space.3.value}",
6
+ "type": "space"
7
+ },
8
+ "icon": {
9
+ "size": {
10
+ "value": "{icon.size.sm.value}",
11
+ "type": "space"
12
+ }
13
+ },
14
+ "padding": {
15
+ "value": "{form.control.padding.value}",
16
+ "type": "space"
17
+ },
18
+ "background": {
19
+ "value": "none",
20
+ "type": "color"
21
+ },
22
+ "border": {
23
+ "width": {
24
+ "@": {
25
+ "value": "{form.control.border.width.@.value}",
26
+ "type": "space"
27
+ },
28
+ "focus": {
29
+ "value": "{form.control.border.width.focus.value}",
30
+ "type": "radius"
31
+ }
32
+ },
33
+ "style": {
34
+ "value": "{form.control.border.style.value}",
35
+ "type": "radius"
36
+ },
37
+ "color": {
38
+ "@": {
39
+ "value": "{form.control.border.color.@.value}",
40
+ "type": "color"
41
+ },
42
+ "hover": {
43
+ "value": "{form.control.border.color.hover.value}",
44
+ "type": "color"
45
+ },
46
+ "focus": {
47
+ "value": "{form.control.border.color.focus.value}",
48
+ "type": "color"
49
+ },
50
+ "error": {
51
+ "value": "{form.control.border.color.error.value}",
52
+ "type": "color"
53
+ }
54
+ },
55
+ "radius": {
56
+ "value": "{form.control.radius.value}",
57
+ "type": "radius"
58
+ }
59
+ },
60
+ "place": {
61
+ "holder": {
62
+ "color": {
63
+ "value": "{form.control.color.place-holder.value}",
64
+ "type": "color"
65
+ }
66
+ }
67
+ },
68
+ "height": {
69
+ "value": "{form.control.height.value}",
70
+ "type": "space"
71
+ }
72
+ },
73
+ "input": {
74
+ "padding": {
75
+ "value": "{space.0.value}",
76
+ "type": "space"
77
+ }
78
+ }
79
+ },
80
+ "chip": {
81
+ "item": {
82
+ "height": {
83
+ "value": "32px",
84
+ "type": "space"
85
+ },
86
+ "padding": {
87
+ "value": "{space.1.value} {space.3.value}",
88
+ "type": "space"
89
+ },
90
+ "gap": {
91
+ "value": "{space.2.value}",
92
+ "type": "space"
93
+ },
94
+ "color": {
95
+ "@":{
96
+ "value": "{color.on-surface.variant.@.value}",
97
+ "type": "color"
98
+ },
99
+ "selected": {
100
+ "value": "{color.on-surface.variant.@.value}",
101
+ "type": "color"
102
+ }
103
+ },
104
+ "background": {
105
+ "@": {
106
+ "value": "none",
107
+ "type": "color"
108
+ },
109
+ "selected": {
110
+ "value": "{color.secondary.container.@.value}",
111
+ "type": "color"
112
+ }
113
+ },
114
+ "border": {
115
+ "width": {
116
+ "value": "{border.width.base.value}",
117
+ "type": "space"
118
+ },
119
+ "style": {
120
+ "value": "{border.style.base.value}",
121
+ "type": "radius"
122
+ },
123
+ "color": {
124
+ "@": {
125
+ "value": "{color.outline.@.value}",
126
+ "type": "color"
127
+ },
128
+ "selected": {
129
+ "value": "{color.secondary.container.@.value}",
130
+ "type": "color"
131
+ }
132
+ },
133
+ "radius": {
134
+ "@": {
135
+ "value": "{radius.sm.value}",
136
+ "type": "radius"
137
+ },
138
+ "with": {
139
+ "icon": {
140
+ "value": "{radius.sm.value}",
141
+ "type": "radius"
142
+ },
143
+ "avatar": {
144
+ "value": "{radius.pill.value}",
145
+ "type": "radius"
146
+ }
147
+ }
148
+ }
149
+ },
150
+ "font-family": {
151
+ "value": "{label.large.font-family.value}",
152
+ "type": "font"
153
+ },
154
+ "font-weight": {
155
+ "value": "{label.large.font-weight.value}",
156
+ "type": "font"
157
+ },
158
+ "font-size": {
159
+ "value": "{label.large.font-size.value}",
160
+ "type": "font"
161
+ },
162
+ "line-height": {
163
+ "value": "{label.large.line-height.value}",
164
+ "type": "font"
165
+ },
166
+ "letter-spacing": {
167
+ "value": "{label.large.letter-spacing.value}",
168
+ "type": "font"
169
+ },
170
+ "layer": {
171
+ "color": {
172
+ "value": "{color.on-surface.variant.@.value}",
173
+ "type": "color"
174
+ },
175
+ "opacity": {
176
+ "hover": {
177
+ "value": "{opacity.hover.value}",
178
+ "type": "radius"
179
+ },
180
+ "focus": {
181
+ "value": "{opacity.focus.value}",
182
+ "type": "radius"
183
+ },
184
+ "active": {
185
+ "value": "{opacity.active.value}",
186
+ "type": "radius"
187
+ }
188
+ }
189
+ },
190
+ "avatar": {
191
+ "size": {
192
+ "value": "{icon.size.@.value}",
193
+ "type": "space"
194
+ },
195
+ "radius": {
196
+ "value": "{radius.pill.value}",
197
+ "type": "radius"
198
+ }
199
+ }
200
+ }
201
+ }
202
+ }
package/tokens/components/composite/composite.json ADDED
@@ -0,0 +1,202 @@
1
+ {
2
+ "form": {
3
+ "group": {
4
+ "gap": {
5
+ "value": "{space.0.value}",
6
+ "type": "space"
7
+ }
8
+ },
9
+ "control": {
10
+ "color": {
11
+ "@": {
12
+ "value": "{color.on-surface.@.value}",
13
+ "type": "color"
14
+ },
15
+ "place-holder": {
16
+ "value": "{color.outline.@.value}",
17
+ "type": "color"
18
+ }
19
+ },
20
+ "background": {
21
+ "value": "{color.surface.@.value}",
22
+ "type": "color"
23
+ },
24
+ "border": {
25
+ "width": {
26
+ "@": {
27
+ "value": "{border.width.base.value}",
28
+ "type": "space"
29
+ },
30
+ "focus": {
31
+ "value": "2px",
32
+ "type": "space"
33
+ }
34
+ },
35
+ "style": {
36
+ "value": "{border.style.base.value}",
37
+ "type": "radius"
38
+ },
39
+ "color": {
40
+ "@": {
41
+ "value": "{color.outline.@.value}",
42
+ "type": "color"
43
+ },
44
+ "hover": {
45
+ "value": "{color.on-surface.@.value}",
46
+ "type": "color"
47
+ },
48
+ "focus": {
49
+ "value": "{color.secondary.@.value}",
50
+ "type": "color"
51
+ },
52
+ "error": {
53
+ "value": "{color.error.@.value}",
54
+ "type": "color"
55
+ }
56
+ }
57
+ },
58
+ "radius": {
59
+ "value": "{radius.xs.value}",
60
+ "type": "radius"
61
+ },
62
+ "height": {
63
+ "value": "56px",
64
+ "type": "space"
65
+ },
66
+ "padding": {
67
+ "value": "{space.4.value}",
68
+ "type": "space"
69
+ },
70
+ "font-family": {
71
+ "value": "{body.large.font-family.value}",
72
+ "type": "font"
73
+ },
74
+ "font-size": {
75
+ "value": "{body.large.font-size.value}",
76
+ "type": "font"
77
+ },
78
+ "font-weight": {
79
+ "value": "{body.large.font-weight.value}",
80
+ "type": "font"
81
+ },
82
+ "line-height": {
83
+ "value": "{body.large.line-height.value}",
84
+ "type": "font"
85
+ },
86
+ "letter-spacing": {
87
+ "value": "{body.large.letter-spacing.value}",
88
+ "type": "font"
89
+ }
90
+ }
91
+ },
92
+ "caption": {
93
+ "font-family": {
94
+ "value": "{body.large.font-family.value}",
95
+ "type": "font"
96
+ },
97
+ "font-size": {
98
+ "value": "{body.large.font-size.value}",
99
+ "type": "font"
100
+ },
101
+ "font-weight": {
102
+ "value": "{body.large.font-weight.value}",
103
+ "type": "font"
104
+ },
105
+ "line-height": {
106
+ "value": "{body.large.line-height.value}",
107
+ "type": "font"
108
+ },
109
+ "letter-spacing": {
110
+ "value": "{body.large.letter-spacing.value}",
111
+ "type": "font"
112
+ },
113
+ "color": {
114
+ "value": "{color.on-surface.variant.@.value}",
115
+ "type": "color"
116
+ },
117
+ "margin": {
118
+ "value": "{space.0.value}",
119
+ "type": "space"
120
+ },
121
+ "padding": {
122
+ "value": "{space.0.value}",
123
+ "type": "space"
124
+ },
125
+ "gap": {
126
+ "value": "~\"calc({space.1.value} * 0.5)\"",
127
+ "type": "space"
128
+ }
129
+ },
130
+ "required": {
131
+ "content": {
132
+ "value": "\"*\"",
133
+ "type": "radius"
134
+ },
135
+ "color": {
136
+ "value": "{color.error.@.value}",
137
+ "type": "color"
138
+ },
139
+ "font-size": {
140
+ "value": "inherit",
141
+ "type": "font"
142
+ },
143
+ "font-weight": {
144
+ "value": "{font.weight.bold.value}",
145
+ "type": "font"
146
+ }
147
+ },
148
+ "help": {
149
+ "block": {
150
+ "color": {
151
+ "value": "{color.on-surface.@.value}",
152
+ "type": "color"
153
+ },
154
+ "font-family": {
155
+ "value": "{body.small.font-family.value}",
156
+ "type": "font"
157
+ },
158
+ "font-size": {
159
+ "value": "{body.small.font-size.value}",
160
+ "type": "font"
161
+ },
162
+ "font-weight": {
163
+ "value": "{body.small.font-weight.value}",
164
+ "type": "font"
165
+ },
166
+ "line-height": {
167
+ "value": "{body.small.line-height.value}",
168
+ "type": "font"
169
+ },
170
+ "letter-spacing": {
171
+ "value": "{body.small.letter-spacing.value}",
172
+ "type": "font"
173
+ }
174
+ }
175
+ },
176
+ "input": {
177
+ "group": {
178
+ "btn": {
179
+ "width": {
180
+ "value": "{btn.icon.md.width.value}",
181
+ "type": "space"
182
+ },
183
+ "height": {
184
+ "value": "{btn.icon.md.height.value}",
185
+ "type": "space"
186
+ },
187
+ "font": {
188
+ "size": {
189
+ "value": "{btn.icon.md.size.value}",
190
+ "type": "space"
191
+ }
192
+ },
193
+ "border": {
194
+ "radius": {
195
+ "value": "{btn.icon.md.radius.value}",
196
+ "type": "radius"
197
+ }
198
+ }
199
+ }
200
+ }
201
+ }
202
+ }
package/tokens/components/container/container.json ADDED
@@ -0,0 +1,32 @@
1
+ {
2
+ "container": {
3
+ "outlined": {
4
+ "border": {
5
+ "color": {
6
+ "value": "{color.outline.variant.value}",
7
+ "type": "color"
8
+ },
9
+ "width": {
10
+ "value": "{border.width.base.value}",
11
+ "type": "space"
12
+ },
13
+ "style": {
14
+ "value": "{border.style.base.value}",
15
+ "type": "radius"
16
+ }
17
+ }
18
+ },
19
+ "elevation": {
20
+ "border": {
21
+ "radius": {
22
+ "value": "{radius.sm.value}",
23
+ "type": "radius"
24
+ }
25
+ },
26
+ "shadow": {
27
+ "value": "{elevation.shadow.1.value}",
28
+ "type": "radius"
29
+ }
30
+ }
31
+ }
32
+ }
package/tokens/components/currency/currency.json ADDED
@@ -0,0 +1,32 @@
1
+ {
2
+ "currency": {
3
+ "inputgroup": {
4
+ "addon": {
5
+ "width": {
6
+ "value": "40px",
7
+ "type": "space"
8
+ },
9
+ "font-family": {
10
+ "value": "{form.control.font-family.value}",
11
+ "type": "font"
12
+ },
13
+ "font-size": {
14
+ "value": "{form.control.font-size.value}",
15
+ "type": "font"
16
+ },
17
+ "font-weight": {
18
+ "value": "{form.control.font-weight.value}",
19
+ "type": "font"
20
+ },
21
+ "line-height": {
22
+ "value": "{form.control.line-height.value}",
23
+ "type": "font"
24
+ },
25
+ "letter-spacing": {
26
+ "value": "{form.control.letter-spacing.value}",
27
+ "type": "font"
28
+ }
29
+ }
30
+ }
31
+ }
32
+ }
package/tokens/components/data-table/data-table.json ADDED
@@ -0,0 +1,170 @@
1
+ {
2
+ "data": {
3
+ "table": {
4
+ "border": {
5
+ "collapse": {
6
+ "value": "unset",
7
+ "type": "radius"
8
+ },
9
+ "spacing": {
10
+ "value": "unset",
11
+ "type": "space"
12
+ }
13
+ },
14
+ "overlay": {
15
+ "background": {
16
+ "value": "{color.surface.container.lowest.@.value}",
17
+ "type": "color"
18
+ },
19
+ "color": {
20
+ "value": "inherit",
21
+ "type": "color"
22
+ },
23
+ "opacity": {
24
+ "value": "90%",
25
+ "type": "radius"
26
+ }
27
+ },
28
+ "padding": {
29
+ "@": {
30
+ "value": "{space.3.value}",
31
+ "type": "space"
32
+ },
33
+ "condensed": {
34
+ "value": "{space.1.value} {space.2.value}",
35
+ "type": "space"
36
+ }
37
+ },
38
+ "thead": {
39
+ "tr": {
40
+ "color": {
41
+ "value": "{color.on-background.@.value}",
42
+ "type": "color"
43
+ },
44
+ "background": {
45
+ "value": "{color.surface.variant.@.value}",
46
+ "type": "color"
47
+ },
48
+ "font-size": {
49
+ "value": "{h5.font-size.value}",
50
+ "type": "font"
51
+ },
52
+ "font-weight": {
53
+ "value": "{h5.font-weight.value}",
54
+ "type": "font"
55
+ },
56
+ "font-family": {
57
+ "value": "{h5.font-family.value}",
58
+ "type": "font"
59
+ },
60
+ "line-height": {
61
+ "value": "{h5.line-height.value}",
62
+ "type": "font"
63
+ },
64
+ "letterspacing": {
65
+ "value": "{h5.letter-spacing.value}",
66
+ "type": "font"
67
+ }
68
+ },
69
+ "th": {
70
+ "padding": {
71
+ "value": "{data.table.padding.@.value}",
72
+ "type": "space"
73
+ },
74
+ "border": {
75
+ "width": {
76
+ "value": "{border.width.base.value}",
77
+ "type": "space"
78
+ },
79
+ "style": {
80
+ "value": "{border.style.base.value}",
81
+ "type": "radius"
82
+ },
83
+ "color": {
84
+ "value": "{border.color.@.value}",
85
+ "type": "color"
86
+ }
87
+ }
88
+ }
89
+ },
90
+ "tbody": {
91
+ "tr": {
92
+ "background": {
93
+ "@": {
94
+ "value": "{color.surface.@.value}",
95
+ "type": "color"
96
+ },
97
+ "hover": {
98
+ "value": "{color.surface.variant.@.value}",
99
+ "type": "color"
100
+ },
101
+ "active": {
102
+ "value": "{color.surface.container.lowest.@.value}",
103
+ "type": "color"
104
+ }
105
+ },
106
+ "color": {
107
+ "value": "{color.on-background.@.value}",
108
+ "type": "color"
109
+ },
110
+ "font-size": {
111
+ "value": "{body.large.font-size.value}",
112
+ "type": "font"
113
+ },
114
+ "font-weight": {
115
+ "value": "{body.large.font-weight.value}",
116
+ "type": "font"
117
+ },
118
+ "font-family": {
119
+ "value": "{body.large.font-family.value}",
120
+ "type": "font"
121
+ },
122
+ "line-height": {
123
+ "value": "{body.large.line-height.value}",
124
+ "type": "font"
125
+ },
126
+ "letter-spacing": {
127
+ "value": "{body.large.letter-spacing.value}",
128
+ "type": "font"
129
+ }
130
+ },
131
+ "td": {
132
+ "padding": {
133
+ "value": "{data.table.padding.@.value}",
134
+ "type": "space"
135
+ },
136
+ "border": {
137
+ "width": {
138
+ "value": "{border.width.base.value}",
139
+ "type": "space"
140
+ },
141
+ "style": {
142
+ "value": "{border.style.base.value}",
143
+ "type": "radius"
144
+ },
145
+ "color": {
146
+ "value": "{border.color.@.value}",
147
+ "type": "color"
148
+ },
149
+ "radius": {
150
+ "value": "{radius.md.value}",
151
+ "type": "radius"
152
+ }
153
+ }
154
+ }
155
+ },
156
+ "sort": {
157
+ "icon": {
158
+ "size": {
159
+ "value": "{icon.size.sm.value}",
160
+ "type": "space"
161
+ },
162
+ "color": {
163
+ "value": "{data.table.thead.tr.color.value}",
164
+ "type": "color"
165
+ }
166
+ }
167
+ }
168
+ }
169
+ }
170
+ }