@depersgroep/lfvp-design-tokens 0.149.0 → 0.151.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 (3) hide show
  1. package/package.json +1 -1
  2. package/tokens/$themes.json +75 -3
  3. package/tokens/components/selectable-box.json +174 -70
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@depersgroep/lfvp-design-tokens",
3
- "version": "0.149.0",
3
+ "version": "0.151.0",
4
4
  "description": "Figma design tokens for LFVP",
5
5
  "repository": {
6
6
  "type": "git",
package/tokens/$themes.json CHANGED
@@ -12,7 +12,13 @@
12
12
  "components/landingpage": "enabled",
13
13
  "components/form": "enabled",
14
14
  "base/ui": "enabled",
15
- "components/top-10": "enabled"
15
+ "components/top-10": "enabled",
16
+ "components/app-header": "enabled",
17
+ "components/box": "enabled",
18
+ "components/selectable": "enabled",
19
+ "components/selectable-box": "enabled",
20
+ "components/input": "enabled",
21
+ "components/toggle": "enabled"
16
22
  },
17
23
  "$figmaCollectionId": "VariableCollectionId:936:4507",
18
24
  "$figmaModeId": "936:0",
@@ -24,10 +30,12 @@
24
30
  "button.small.horizontalPadding": "8fc8e75b425ef6856031e200b5c354693bc30bf3",
25
31
  "button.small.verticalPadding": "7bc4da686b55aab811ceeaf10b30a9ff1be1e3c2",
26
32
  "button.small.gap": "6fe6f940b12e975712f095e1d0d2346e467afecf",
33
+ "button.small.maxHeight": "4baafdc814450032539c4902a0795522457738b8",
27
34
  "button.medium.borderRadius": "bf9afe3bdd98a8a8bbf3720a8617cd13370bc207",
28
35
  "button.medium.horizontalPadding": "64b6a40a419be9fec0ef283ffa2f5bfa1fbec314",
29
36
  "button.medium.verticalPadding": "94293250d54a4aefdf59c54bfb76b59057828a4c",
30
37
  "button.medium.gap": "269800cd3487b16e919213af8521531521be49ad",
38
+ "button.medium.maxHeight": "ad10c0fe4702ca88d4a8ed848a4a13c2d04de8b9",
31
39
  "button.transparent.normal.backgroundColor": "c031a45de4eb19448787a67633760aaa256b69e1",
32
40
  "button.transparent.normal.textColor": "2b30c48ecea33b60a85c0e4eb011982590f54426",
33
41
  "button.transparent.hover.backgroundColor": "193e62bb8e662a0312dc40eee485f0bd774b99f6",
@@ -52,6 +60,22 @@
52
60
  "button.primary.active.textColor": "6c466de488225cb96d1076d16f0989757a6f1795",
53
61
  "button.primary.disabled.backgroundColor": "899b8d128a65c1b92ef395c19c3fb9b5ff2efaff",
54
62
  "button.primary.disabled.textColor": "f490060b1c861b285808752b5539094921881142",
63
+ "button.nakedOnDark.normal.textColor": "1f2ea4af6a1b81499f9aeee4d0077363d027ad1a",
64
+ "button.nakedOnDark.normal.backgroundColor": "797b3537eff139218660c0c7289ce5d80e3532aa",
65
+ "button.nakedOnDark.hover.textColor": "aaa8f6bceee7687f7d9fbb6ee4a2d083aaadada2",
66
+ "button.nakedOnDark.hover.backgroundColor": "514b4e041bc96e2f687210666adbfe7588b0f4e6",
67
+ "button.nakedOnDark.active.textColor": "d528619f566267b51773b09f5fe4ef7c04635e48",
68
+ "button.nakedOnDark.active.backgroundColor": "914ddac8b8a3c7802b592002470e5ebce11ba82e",
69
+ "button.nakedOnDark.disabled.textColor": "4da4e7c66a06e2befcbbdfb1959be1f4d149665f",
70
+ "button.nakedOnDark.disabled.backgroundColor": "7a907a12ccea738af6a3d65c98546acd52402255",
71
+ "button.nakedOnLight.normal.textColor": "e14205c2ae05c207b33b3a5c254156706e916aa1",
72
+ "button.nakedOnLight.normal.backgroundColor": "4302b9c26f16f8dd7b51ca5f51914d116e1afd45",
73
+ "button.nakedOnLight.hover.textColor": "f717d75f6ab22976bf937abe113b0d4c79911e3a",
74
+ "button.nakedOnLight.hover.backgroundColor": "bdc6e2337e98416d934405d35b3a1fd8f9d3d1cc",
75
+ "button.nakedOnLight.active.textColor": "6b7da187cb7d802790121a612298b48192ce5a79",
76
+ "button.nakedOnLight.active.backgroundColor": "f3e8d325bc71cc16eb8d4c585ece7ed9d209010d",
77
+ "button.nakedOnLight.disabled.textColor": "8681d7ce089c83bc5ad045f53ab13e2cb295b369",
78
+ "button.nakedOnLight.disabled.backgroundColor": "957b44a20d48e4a968603ec56721f14913ede140",
55
79
  "base.container.borderRadius.level1": "13beefede85bc32e52a45d5c0b600c4a4786a000",
56
80
  "base.color.primary.lighter": "ce3b6554a10a4bf4759b787b1ea439b341357a58",
57
81
  "base.color.primary.default": "fb02bec2bf3616c6f23b3195ae038e86d80a674d",
@@ -188,7 +212,13 @@
188
212
  "components/landingpage": "enabled",
189
213
  "components/form": "enabled",
190
214
  "base/ui": "enabled",
191
- "components/top-10": "enabled"
215
+ "components/top-10": "enabled",
216
+ "components/app-header": "enabled",
217
+ "components/box": "enabled",
218
+ "components/selectable": "enabled",
219
+ "components/selectable-box": "enabled",
220
+ "components/input": "enabled",
221
+ "components/toggle": "enabled"
192
222
  },
193
223
  "$figmaCollectionId": "VariableCollectionId:936:4507",
194
224
  "$figmaModeId": "936:1",
@@ -200,10 +230,12 @@
200
230
  "button.small.horizontalPadding": "8fc8e75b425ef6856031e200b5c354693bc30bf3",
201
231
  "button.small.verticalPadding": "7bc4da686b55aab811ceeaf10b30a9ff1be1e3c2",
202
232
  "button.small.gap": "6fe6f940b12e975712f095e1d0d2346e467afecf",
233
+ "button.small.maxHeight": "4baafdc814450032539c4902a0795522457738b8",
203
234
  "button.medium.borderRadius": "bf9afe3bdd98a8a8bbf3720a8617cd13370bc207",
204
235
  "button.medium.horizontalPadding": "64b6a40a419be9fec0ef283ffa2f5bfa1fbec314",
205
236
  "button.medium.verticalPadding": "94293250d54a4aefdf59c54bfb76b59057828a4c",
206
237
  "button.medium.gap": "269800cd3487b16e919213af8521531521be49ad",
238
+ "button.medium.maxHeight": "ad10c0fe4702ca88d4a8ed848a4a13c2d04de8b9",
207
239
  "button.transparent.normal.backgroundColor": "c031a45de4eb19448787a67633760aaa256b69e1",
208
240
  "button.transparent.normal.textColor": "2b30c48ecea33b60a85c0e4eb011982590f54426",
209
241
  "button.transparent.hover.backgroundColor": "193e62bb8e662a0312dc40eee485f0bd774b99f6",
@@ -228,6 +260,22 @@
228
260
  "button.primary.active.textColor": "6c466de488225cb96d1076d16f0989757a6f1795",
229
261
  "button.primary.disabled.backgroundColor": "899b8d128a65c1b92ef395c19c3fb9b5ff2efaff",
230
262
  "button.primary.disabled.textColor": "f490060b1c861b285808752b5539094921881142",
263
+ "button.nakedOnDark.normal.textColor": "1f2ea4af6a1b81499f9aeee4d0077363d027ad1a",
264
+ "button.nakedOnDark.normal.backgroundColor": "797b3537eff139218660c0c7289ce5d80e3532aa",
265
+ "button.nakedOnDark.hover.textColor": "aaa8f6bceee7687f7d9fbb6ee4a2d083aaadada2",
266
+ "button.nakedOnDark.hover.backgroundColor": "514b4e041bc96e2f687210666adbfe7588b0f4e6",
267
+ "button.nakedOnDark.active.textColor": "d528619f566267b51773b09f5fe4ef7c04635e48",
268
+ "button.nakedOnDark.active.backgroundColor": "914ddac8b8a3c7802b592002470e5ebce11ba82e",
269
+ "button.nakedOnDark.disabled.textColor": "4da4e7c66a06e2befcbbdfb1959be1f4d149665f",
270
+ "button.nakedOnDark.disabled.backgroundColor": "7a907a12ccea738af6a3d65c98546acd52402255",
271
+ "button.nakedOnLight.normal.textColor": "e14205c2ae05c207b33b3a5c254156706e916aa1",
272
+ "button.nakedOnLight.normal.backgroundColor": "4302b9c26f16f8dd7b51ca5f51914d116e1afd45",
273
+ "button.nakedOnLight.hover.textColor": "f717d75f6ab22976bf937abe113b0d4c79911e3a",
274
+ "button.nakedOnLight.hover.backgroundColor": "bdc6e2337e98416d934405d35b3a1fd8f9d3d1cc",
275
+ "button.nakedOnLight.active.textColor": "6b7da187cb7d802790121a612298b48192ce5a79",
276
+ "button.nakedOnLight.active.backgroundColor": "f3e8d325bc71cc16eb8d4c585ece7ed9d209010d",
277
+ "button.nakedOnLight.disabled.textColor": "8681d7ce089c83bc5ad045f53ab13e2cb295b369",
278
+ "button.nakedOnLight.disabled.backgroundColor": "957b44a20d48e4a968603ec56721f14913ede140",
231
279
  "base.container.borderRadius.level1": "13beefede85bc32e52a45d5c0b600c4a4786a000",
232
280
  "base.color.primary.lighter": "ce3b6554a10a4bf4759b787b1ea439b341357a58",
233
281
  "base.color.primary.default": "fb02bec2bf3616c6f23b3195ae038e86d80a674d",
@@ -364,7 +412,13 @@
364
412
  "components/landingpage": "enabled",
365
413
  "components/form": "enabled",
366
414
  "base/ui": "enabled",
367
- "components/top-10": "enabled"
415
+ "components/top-10": "enabled",
416
+ "components/app-header": "enabled",
417
+ "components/box": "enabled",
418
+ "components/selectable": "enabled",
419
+ "components/selectable-box": "enabled",
420
+ "components/input": "enabled",
421
+ "components/toggle": "enabled"
368
422
  },
369
423
  "$figmaCollectionId": "VariableCollectionId:936:4507",
370
424
  "$figmaModeId": "936:2",
@@ -376,10 +430,12 @@
376
430
  "button.small.horizontalPadding": "8fc8e75b425ef6856031e200b5c354693bc30bf3",
377
431
  "button.small.verticalPadding": "7bc4da686b55aab811ceeaf10b30a9ff1be1e3c2",
378
432
  "button.small.gap": "6fe6f940b12e975712f095e1d0d2346e467afecf",
433
+ "button.small.maxHeight": "4baafdc814450032539c4902a0795522457738b8",
379
434
  "button.medium.borderRadius": "bf9afe3bdd98a8a8bbf3720a8617cd13370bc207",
380
435
  "button.medium.horizontalPadding": "64b6a40a419be9fec0ef283ffa2f5bfa1fbec314",
381
436
  "button.medium.verticalPadding": "94293250d54a4aefdf59c54bfb76b59057828a4c",
382
437
  "button.medium.gap": "269800cd3487b16e919213af8521531521be49ad",
438
+ "button.medium.maxHeight": "ad10c0fe4702ca88d4a8ed848a4a13c2d04de8b9",
383
439
  "button.transparent.normal.backgroundColor": "c031a45de4eb19448787a67633760aaa256b69e1",
384
440
  "button.transparent.normal.textColor": "2b30c48ecea33b60a85c0e4eb011982590f54426",
385
441
  "button.transparent.hover.backgroundColor": "193e62bb8e662a0312dc40eee485f0bd774b99f6",
@@ -404,6 +460,22 @@
404
460
  "button.primary.active.textColor": "6c466de488225cb96d1076d16f0989757a6f1795",
405
461
  "button.primary.disabled.backgroundColor": "899b8d128a65c1b92ef395c19c3fb9b5ff2efaff",
406
462
  "button.primary.disabled.textColor": "f490060b1c861b285808752b5539094921881142",
463
+ "button.nakedOnDark.normal.textColor": "1f2ea4af6a1b81499f9aeee4d0077363d027ad1a",
464
+ "button.nakedOnDark.normal.backgroundColor": "797b3537eff139218660c0c7289ce5d80e3532aa",
465
+ "button.nakedOnDark.hover.textColor": "aaa8f6bceee7687f7d9fbb6ee4a2d083aaadada2",
466
+ "button.nakedOnDark.hover.backgroundColor": "514b4e041bc96e2f687210666adbfe7588b0f4e6",
467
+ "button.nakedOnDark.active.textColor": "d528619f566267b51773b09f5fe4ef7c04635e48",
468
+ "button.nakedOnDark.active.backgroundColor": "914ddac8b8a3c7802b592002470e5ebce11ba82e",
469
+ "button.nakedOnDark.disabled.textColor": "4da4e7c66a06e2befcbbdfb1959be1f4d149665f",
470
+ "button.nakedOnDark.disabled.backgroundColor": "7a907a12ccea738af6a3d65c98546acd52402255",
471
+ "button.nakedOnLight.normal.textColor": "e14205c2ae05c207b33b3a5c254156706e916aa1",
472
+ "button.nakedOnLight.normal.backgroundColor": "4302b9c26f16f8dd7b51ca5f51914d116e1afd45",
473
+ "button.nakedOnLight.hover.textColor": "f717d75f6ab22976bf937abe113b0d4c79911e3a",
474
+ "button.nakedOnLight.hover.backgroundColor": "bdc6e2337e98416d934405d35b3a1fd8f9d3d1cc",
475
+ "button.nakedOnLight.active.textColor": "6b7da187cb7d802790121a612298b48192ce5a79",
476
+ "button.nakedOnLight.active.backgroundColor": "f3e8d325bc71cc16eb8d4c585ece7ed9d209010d",
477
+ "button.nakedOnLight.disabled.textColor": "8681d7ce089c83bc5ad045f53ab13e2cb295b369",
478
+ "button.nakedOnLight.disabled.backgroundColor": "957b44a20d48e4a968603ec56721f14913ede140",
407
479
  "base.container.borderRadius.level1": "13beefede85bc32e52a45d5c0b600c4a4786a000",
408
480
  "base.color.primary.lighter": "ce3b6554a10a4bf4759b787b1ea439b341357a58",
409
481
  "base.color.primary.default": "fb02bec2bf3616c6f23b3195ae038e86d80a674d",
package/tokens/components/selectable-box.json CHANGED
@@ -1,93 +1,197 @@
1
1
  {
2
2
  "selectableBox": {
3
- "normal": {
4
- "backgroundColor": {
5
- "value": "{base.color.ui.dark4}",
6
- "type": "color"
3
+ "unchecked": {
4
+ "normal": {
5
+ "backgroundColor": {
6
+ "value": "{base.color.ui.dark2}",
7
+ "type": "color"
8
+ },
9
+ "borderColor": {
10
+ "value": "{base.color.ui.dark4}",
11
+ "type": "color"
12
+ },
13
+ "textColor": {
14
+ "value": "{base.color.text.default}",
15
+ "type": "color"
16
+ }
7
17
  },
8
- "borderColor": {
9
- "value": "{base.color.ui.dark4}",
10
- "type": "color"
18
+ "hover": {
19
+ "backgroundColor": {
20
+ "value": "{base.color.ui.dark2}",
21
+ "type": "color"
22
+ },
23
+ "borderColor": {
24
+ "value": "{base.color.ui.accent1}",
25
+ "type": "color"
26
+ },
27
+ "textColor": {
28
+ "value": "{base.color.text.default}",
29
+ "type": "color"
30
+ }
11
31
  },
12
- "textColor": {
13
- "value": "{base.color.text.default}",
14
- "type": "color"
15
- }
16
- },
17
- "hover": {
18
- "backgroundColor": {
19
- "value": "{base.color.ui.dark4}",
20
- "type": "color"
32
+ "active": {
33
+ "backgroundColor": {
34
+ "value": "{base.color.ui.dark2}",
35
+ "type": "color"
36
+ },
37
+ "borderColor": {
38
+ "value": "{base.color.ui.white}",
39
+ "type": "color"
40
+ },
41
+ "textColor": {
42
+ "value": "{base.color.text.default}",
43
+ "type": "color"
44
+ }
21
45
  },
22
- "borderColor": {
23
- "value": "{base.color.ui.accent1}",
24
- "type": "color"
46
+ "disabled": {
47
+ "backgroundColor": {
48
+ "value": "{core.color.softAlpha.20}",
49
+ "type": "color"
50
+ },
51
+ "borderColor": {
52
+ "value": "transparent",
53
+ "type": "color"
54
+ },
55
+ "textColor": {
56
+ "value": "{base.color.ui.accent2}",
57
+ "type": "color"
58
+ }
25
59
  },
26
- "textColor": {
27
- "value": "{base.color.text.default}",
28
- "type": "color"
29
- }
30
- },
31
- "active": {
32
- "backgroundColor": {
33
- "value": "{base.color.ui.dark4}",
34
- "type": "color"
35
- },
36
- "borderColor": {
37
- "value": "{base.color.ui.white}",
38
- "type": "color"
60
+ "focus": {
61
+ "backgroundColor": {
62
+ "value": "{base.color.ui.dark2}",
63
+ "type": "color"
64
+ },
65
+ "borderColor": {
66
+ "value": "{base.color.ui.dark4}",
67
+ "type": "color"
68
+ },
69
+ "textColor": {
70
+ "value": "{base.color.text.default}",
71
+ "type": "color"
72
+ }
39
73
  },
40
- "textColor": {
41
- "value": "{base.color.text.default}",
42
- "type": "color"
43
- }
44
- },
45
- "disabled": {
46
- "backgroundColor": {
47
- "value": "{core.color.softAlpha.20}",
48
- "type": "color"
49
- },
50
- "borderColor": {
51
- "value": "transparent",
52
- "type": "color"
53
- },
54
- "textColor": {
55
- "value": "{base.color.ui.accent2}",
56
- "type": "color"
74
+ "error": {
75
+ "backgroundColor": {
76
+ "value": "{base.color.ui.dark2}",
77
+ "type": "color"
78
+ },
79
+ "borderColor": {
80
+ "value": "{base.color.primary.default}",
81
+ "type": "color"
82
+ },
83
+ "helpTextColor": {
84
+ "value": "{base.color.primary.lighter}",
85
+ "type": "color"
86
+ },
87
+ "textColor": {
88
+ "value": "{base.color.text.default}",
89
+ "type": "color"
90
+ }
57
91
  }
58
92
  },
59
93
  "default": {
60
94
  "borderWidth": {
61
95
  "value": "{core.borderWidth.3}",
62
96
  "type": "borderWidth"
63
- }
64
- },
65
- "focus": {
66
- "backgroundColor": {
67
- "value": "{base.color.ui.dark4}",
68
- "type": "color"
69
97
  },
70
- "borderColor": {
71
- "value": "{base.color.functional.focus}",
72
- "type": "color"
98
+ "borderRadius": {
99
+ "value": "{core.borderRadius.8}",
100
+ "type": "borderRadius"
73
101
  },
74
- "textColor": {
75
- "value": "{base.color.text.default}",
102
+ "focusColor": {
103
+ "value": "{base.color.functional.focus}",
76
104
  "type": "color"
77
105
  }
78
106
  },
79
- "error": {
80
- "backgroundColor": {
81
- "value": "{base.color.ui.dark4}",
82
- "type": "color"
107
+ "checked": {
108
+ "normal": {
109
+ "backgroundColor": {
110
+ "value": "{base.color.ui.dark2}",
111
+ "type": "color"
112
+ },
113
+ "borderColor": {
114
+ "value": "{base.color.ui.white}",
115
+ "type": "color"
116
+ },
117
+ "textColor": {
118
+ "value": "{base.color.text.default}",
119
+ "type": "color"
120
+ }
83
121
  },
84
- "borderColor": {
85
- "value": "{base.color.primary.default}",
86
- "type": "color"
122
+ "hover": {
123
+ "backgroundColor": {
124
+ "value": "{base.color.ui.dark2}",
125
+ "type": "color"
126
+ },
127
+ "borderColor": {
128
+ "value": "{base.color.ui.accent2}",
129
+ "type": "color"
130
+ },
131
+ "textColor": {
132
+ "value": "{base.color.text.default}",
133
+ "type": "color"
134
+ }
87
135
  },
88
- "textColor": {
89
- "value": "{base.color.text.default}",
90
- "type": "color"
136
+ "active": {
137
+ "backgroundColor": {
138
+ "value": "{base.color.ui.dark2}",
139
+ "type": "color"
140
+ },
141
+ "borderColor": {
142
+ "value": "{base.color.ui.white}",
143
+ "type": "color"
144
+ },
145
+ "textColor": {
146
+ "value": "{base.color.text.default}",
147
+ "type": "color"
148
+ }
149
+ },
150
+ "disabled": {
151
+ "backgroundColor": {
152
+ "value": "{core.color.softAlpha.20}",
153
+ "type": "color"
154
+ },
155
+ "borderColor": {
156
+ "value": "transparent",
157
+ "type": "color"
158
+ },
159
+ "textColor": {
160
+ "value": "{base.color.ui.accent2}",
161
+ "type": "color"
162
+ }
163
+ },
164
+ "focus": {
165
+ "backgroundColor": {
166
+ "value": "{base.color.ui.dark2}",
167
+ "type": "color"
168
+ },
169
+ "borderColor": {
170
+ "value": "{base.color.ui.white}",
171
+ "type": "color"
172
+ },
173
+ "textColor": {
174
+ "value": "{base.color.text.default}",
175
+ "type": "color"
176
+ }
177
+ },
178
+ "error": {
179
+ "backgroundColor": {
180
+ "value": "{base.color.ui.dark2}",
181
+ "type": "color"
182
+ },
183
+ "borderColor": {
184
+ "value": "{base.color.primary.default}",
185
+ "type": "color"
186
+ },
187
+ "helpTextColor": {
188
+ "value": "{base.color.primary.lighter}",
189
+ "type": "color"
190
+ },
191
+ "textColor": {
192
+ "value": "{base.color.text.default}",
193
+ "type": "color"
194
+ }
91
195
  }
92
196
  }
93
197
  }