@gitlab/ui 122.7.0 → 122.9.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 (86) hide show
  1. package/README.md +5 -2
  2. package/dist/components/base/breadcrumb/breadcrumb.js +1 -1
  3. package/dist/components/base/search_box_by_click/search_box_by_click.js +1 -1
  4. package/dist/components/dashboards/dashboard_panel/dashboard_panel.js +1 -1
  5. package/dist/components/regions/dashboard_skeleton/dashboard_skeleton.js +1 -1
  6. package/dist/index.css +2 -2
  7. package/dist/index.css.map +1 -1
  8. package/dist/tailwind.css +1 -1
  9. package/dist/tailwind.css.map +1 -1
  10. package/dist/tokens/build/js/tokens.dark.js +25 -7
  11. package/dist/tokens/build/js/tokens.js +24 -6
  12. package/dist/tokens/css/tokens.css +23 -5
  13. package/dist/tokens/css/tokens.dark.css +24 -6
  14. package/dist/tokens/docs/tokens-tailwind-docs.dark.json +356 -0
  15. package/dist/tokens/docs/tokens-tailwind-docs.json +356 -0
  16. package/dist/tokens/figma/constants.tokens.json +94 -0
  17. package/dist/tokens/figma/contextual.tokens.json +80 -1
  18. package/dist/tokens/figma/semantic.tokens.json +34 -0
  19. package/dist/tokens/js/tokens.dark.js +24 -6
  20. package/dist/tokens/js/tokens.js +23 -5
  21. package/dist/tokens/json/tokens.dark.json +750 -173
  22. package/dist/tokens/json/tokens.json +749 -172
  23. package/dist/tokens/scss/_tokens.dark.scss +24 -6
  24. package/dist/tokens/scss/_tokens.scss +23 -5
  25. package/dist/tokens/scss/_tokens_custom_properties.scss +23 -5
  26. package/dist/tokens/tailwind/tokens.cjs +2 -0
  27. package/package.json +1 -1
  28. package/src/components/base/alert/alert.scss +1 -1
  29. package/src/components/base/avatar/avatar.scss +3 -3
  30. package/src/components/base/avatars_inline/avatars_inline.scss +1 -1
  31. package/src/components/base/breadcrumb/breadcrumb.scss +1 -1
  32. package/src/components/base/breadcrumb/breadcrumb.vue +1 -1
  33. package/src/components/base/broadcast_message/broadcast_message.scss +1 -1
  34. package/src/components/base/button/button.scss +1 -1
  35. package/src/components/base/card/card.scss +5 -5
  36. package/src/components/base/datepicker/datepicker.scss +3 -3
  37. package/src/components/base/dropdown/dropdown.scss +1 -1
  38. package/src/components/base/filtered_search/filtered_search.scss +1 -1
  39. package/src/components/base/filtered_search/filtered_search_suggestion_list.scss +1 -1
  40. package/src/components/base/form/form_input/form_input.scss +1 -0
  41. package/src/components/base/form/form_select/form_select.scss +1 -0
  42. package/src/components/base/form/input_group_text/input_group_text.scss +6 -5
  43. package/src/components/base/keyset_pagination/keyset_pagination.scss +1 -1
  44. package/src/components/base/link/link.scss +1 -1
  45. package/src/components/base/markdown/markdown.scss +3 -3
  46. package/src/components/base/modal/modal.scss +5 -5
  47. package/src/components/base/new_dropdowns/dropdown.scss +1 -6
  48. package/src/components/base/new_dropdowns/dropdown_item.scss +1 -1
  49. package/src/components/base/pagination/pagination.scss +2 -2
  50. package/src/components/base/path/path.scss +2 -2
  51. package/src/components/base/search_box_by_click/search_box_by_click.vue +1 -1
  52. package/src/components/base/tabs/tabs/tabs.scss +1 -1
  53. package/src/components/base/toast/toast.scss +1 -1
  54. package/src/components/base/token/token.scss +1 -1
  55. package/src/components/base/tooltip/tooltip.scss +1 -1
  56. package/src/components/charts/single_stat/single_stat.scss +1 -1
  57. package/src/components/dashboards/dashboard_panel/dashboard_panel.vue +2 -2
  58. package/src/components/regions/dashboard_skeleton/dashboard_skeleton.vue +1 -1
  59. package/src/scss/mixins.scss +2 -2
  60. package/src/scss/variables.scss +0 -1
  61. package/src/tokens/build/css/tokens.css +23 -5
  62. package/src/tokens/build/css/tokens.dark.css +24 -6
  63. package/src/tokens/build/docs/tokens-tailwind-docs.dark.json +356 -0
  64. package/src/tokens/build/docs/tokens-tailwind-docs.json +356 -0
  65. package/src/tokens/build/figma/constants.tokens.json +94 -0
  66. package/src/tokens/build/figma/contextual.tokens.json +80 -1
  67. package/src/tokens/build/figma/semantic.tokens.json +34 -0
  68. package/src/tokens/build/js/tokens.dark.js +24 -6
  69. package/src/tokens/build/js/tokens.js +23 -5
  70. package/src/tokens/build/json/tokens.dark.json +750 -173
  71. package/src/tokens/build/json/tokens.json +749 -172
  72. package/src/tokens/build/scss/_tokens.dark.scss +24 -6
  73. package/src/tokens/build/scss/_tokens.scss +23 -5
  74. package/src/tokens/build/scss/_tokens_custom_properties.scss +23 -5
  75. package/src/tokens/build/tailwind/tokens.cjs +14 -0
  76. package/src/tokens/constant/border.tokens.json +96 -0
  77. package/src/tokens/contextual/alert.tokens.json +12 -0
  78. package/src/tokens/contextual/broadcast.tokens.json +10 -0
  79. package/src/tokens/contextual/button.tokens.json +12 -0
  80. package/src/tokens/contextual/card.tokens.json +16 -0
  81. package/src/tokens/contextual/dropdown.tokens.json +12 -1
  82. package/src/tokens/contextual/modal.tokens.json +16 -0
  83. package/src/tokens/semantic/action.tokens.json +12 -0
  84. package/src/tokens/semantic/border.tokens.json +12 -0
  85. package/src/tokens/semantic/control.tokens.json +10 -0
  86. package/tailwind.defaults.js +2 -3
@@ -1,4 +1,487 @@
1
1
  {
2
+ "border": {
3
+ "radius": {
4
+ "none": {
5
+ "key": "{border.radius.none}",
6
+ "$value": "0",
7
+ "$type": "dimension",
8
+ "$description": "",
9
+ "$extensions": {
10
+ "com.figma.scope": [
11
+ "CORNER_RADIUS"
12
+ ]
13
+ },
14
+ "filePath": "src/tokens/constant/border.tokens.json",
15
+ "isSource": true,
16
+ "original": {
17
+ "$value": "{spacing-scale.0}",
18
+ "$type": "dimension",
19
+ "$description": "",
20
+ "$extensions": {
21
+ "com.figma.scope": [
22
+ "CORNER_RADIUS"
23
+ ]
24
+ },
25
+ "key": "{border.radius.none}"
26
+ },
27
+ "name": "BORDER_RADIUS_NONE",
28
+ "attributes": {},
29
+ "path": [
30
+ "border",
31
+ "radius",
32
+ "none"
33
+ ]
34
+ },
35
+ "xs": {
36
+ "key": "{border.radius.xs}",
37
+ "$value": "1px",
38
+ "$type": "dimension",
39
+ "$description": "",
40
+ "$extensions": {
41
+ "com.figma.scope": [
42
+ "CORNER_RADIUS"
43
+ ]
44
+ },
45
+ "filePath": "src/tokens/constant/border.tokens.json",
46
+ "isSource": true,
47
+ "original": {
48
+ "$value": "{spacing-scale.px}",
49
+ "$type": "dimension",
50
+ "$description": "",
51
+ "$extensions": {
52
+ "com.figma.scope": [
53
+ "CORNER_RADIUS"
54
+ ]
55
+ },
56
+ "key": "{border.radius.xs}"
57
+ },
58
+ "name": "BORDER_RADIUS_XS",
59
+ "attributes": {},
60
+ "path": [
61
+ "border",
62
+ "radius",
63
+ "xs"
64
+ ]
65
+ },
66
+ "sm": {
67
+ "key": "{border.radius.sm}",
68
+ "$value": "0.125rem",
69
+ "$type": "dimension",
70
+ "$description": "",
71
+ "$extensions": {
72
+ "com.figma.scope": [
73
+ "CORNER_RADIUS"
74
+ ]
75
+ },
76
+ "filePath": "src/tokens/constant/border.tokens.json",
77
+ "isSource": true,
78
+ "original": {
79
+ "$value": "{spacing-scale.1}",
80
+ "$type": "dimension",
81
+ "$description": "",
82
+ "$extensions": {
83
+ "com.figma.scope": [
84
+ "CORNER_RADIUS"
85
+ ]
86
+ },
87
+ "key": "{border.radius.sm}"
88
+ },
89
+ "name": "BORDER_RADIUS_SM",
90
+ "attributes": {},
91
+ "path": [
92
+ "border",
93
+ "radius",
94
+ "sm"
95
+ ]
96
+ },
97
+ "md": {
98
+ "key": "{border.radius.md}",
99
+ "$value": "0.25rem",
100
+ "$type": "dimension",
101
+ "$description": "",
102
+ "$extensions": {
103
+ "com.figma.scope": [
104
+ "CORNER_RADIUS"
105
+ ]
106
+ },
107
+ "filePath": "src/tokens/constant/border.tokens.json",
108
+ "isSource": true,
109
+ "original": {
110
+ "$value": "{spacing-scale.2}",
111
+ "$type": "dimension",
112
+ "$description": "",
113
+ "$extensions": {
114
+ "com.figma.scope": [
115
+ "CORNER_RADIUS"
116
+ ]
117
+ },
118
+ "key": "{border.radius.md}"
119
+ },
120
+ "name": "BORDER_RADIUS_MD",
121
+ "attributes": {},
122
+ "path": [
123
+ "border",
124
+ "radius",
125
+ "md"
126
+ ]
127
+ },
128
+ "lg": {
129
+ "key": "{border.radius.lg}",
130
+ "$value": "0.5rem",
131
+ "$type": "dimension",
132
+ "$description": "",
133
+ "$extensions": {
134
+ "com.figma.scope": [
135
+ "CORNER_RADIUS"
136
+ ]
137
+ },
138
+ "filePath": "src/tokens/constant/border.tokens.json",
139
+ "isSource": true,
140
+ "original": {
141
+ "$value": "{spacing-scale.3}",
142
+ "$type": "dimension",
143
+ "$description": "",
144
+ "$extensions": {
145
+ "com.figma.scope": [
146
+ "CORNER_RADIUS"
147
+ ]
148
+ },
149
+ "key": "{border.radius.lg}"
150
+ },
151
+ "name": "BORDER_RADIUS_LG",
152
+ "attributes": {},
153
+ "path": [
154
+ "border",
155
+ "radius",
156
+ "lg"
157
+ ]
158
+ },
159
+ "xl": {
160
+ "key": "{border.radius.xl}",
161
+ "$value": "0.75rem",
162
+ "$type": "dimension",
163
+ "$description": "",
164
+ "$extensions": {
165
+ "com.figma.scope": [
166
+ "CORNER_RADIUS"
167
+ ]
168
+ },
169
+ "filePath": "src/tokens/constant/border.tokens.json",
170
+ "isSource": true,
171
+ "original": {
172
+ "$value": "{spacing-scale.4}",
173
+ "$type": "dimension",
174
+ "$description": "",
175
+ "$extensions": {
176
+ "com.figma.scope": [
177
+ "CORNER_RADIUS"
178
+ ]
179
+ },
180
+ "key": "{border.radius.xl}"
181
+ },
182
+ "name": "BORDER_RADIUS_XL",
183
+ "attributes": {},
184
+ "path": [
185
+ "border",
186
+ "radius",
187
+ "xl"
188
+ ]
189
+ },
190
+ "2xl": {
191
+ "key": "{border.radius.2xl}",
192
+ "$value": "1rem",
193
+ "$type": "dimension",
194
+ "$description": "",
195
+ "$extensions": {
196
+ "com.figma.scope": [
197
+ "CORNER_RADIUS"
198
+ ]
199
+ },
200
+ "filePath": "src/tokens/constant/border.tokens.json",
201
+ "isSource": true,
202
+ "original": {
203
+ "$value": "{spacing-scale.5}",
204
+ "$type": "dimension",
205
+ "$description": "",
206
+ "$extensions": {
207
+ "com.figma.scope": [
208
+ "CORNER_RADIUS"
209
+ ]
210
+ },
211
+ "key": "{border.radius.2xl}"
212
+ },
213
+ "name": "BORDER_RADIUS_2XL",
214
+ "attributes": {},
215
+ "path": [
216
+ "border",
217
+ "radius",
218
+ "2xl"
219
+ ]
220
+ },
221
+ "3xl": {
222
+ "key": "{border.radius.3xl}",
223
+ "$value": "1.5rem",
224
+ "$type": "dimension",
225
+ "$description": "",
226
+ "$extensions": {
227
+ "com.figma.scope": [
228
+ "CORNER_RADIUS"
229
+ ]
230
+ },
231
+ "filePath": "src/tokens/constant/border.tokens.json",
232
+ "isSource": true,
233
+ "original": {
234
+ "$value": "{spacing-scale.6}",
235
+ "$type": "dimension",
236
+ "$description": "",
237
+ "$extensions": {
238
+ "com.figma.scope": [
239
+ "CORNER_RADIUS"
240
+ ]
241
+ },
242
+ "key": "{border.radius.3xl}"
243
+ },
244
+ "name": "BORDER_RADIUS_3XL",
245
+ "attributes": {},
246
+ "path": [
247
+ "border",
248
+ "radius",
249
+ "3xl"
250
+ ]
251
+ },
252
+ "full": {
253
+ "key": "{border.radius.full}",
254
+ "$value": "9999px",
255
+ "$type": "dimension",
256
+ "$description": "",
257
+ "$extensions": {
258
+ "com.figma.scope": [
259
+ "CORNER_RADIUS"
260
+ ]
261
+ },
262
+ "filePath": "src/tokens/constant/border.tokens.json",
263
+ "isSource": true,
264
+ "original": {
265
+ "$value": "9999px",
266
+ "$type": "dimension",
267
+ "$description": "",
268
+ "$extensions": {
269
+ "com.figma.scope": [
270
+ "CORNER_RADIUS"
271
+ ]
272
+ },
273
+ "key": "{border.radius.full}"
274
+ },
275
+ "name": "BORDER_RADIUS_FULL",
276
+ "attributes": {},
277
+ "path": [
278
+ "border",
279
+ "radius",
280
+ "full"
281
+ ]
282
+ },
283
+ "default": {
284
+ "key": "{border.radius.default}",
285
+ "$value": "0.25rem",
286
+ "$type": "dimension",
287
+ "$description": "",
288
+ "$extensions": {
289
+ "com.figma.scope": [
290
+ "CORNER_RADIUS"
291
+ ]
292
+ },
293
+ "filePath": "src/tokens/semantic/border.tokens.json",
294
+ "isSource": true,
295
+ "original": {
296
+ "$value": "{border.radius.md}",
297
+ "$type": "dimension",
298
+ "$description": "",
299
+ "$extensions": {
300
+ "com.figma.scope": [
301
+ "CORNER_RADIUS"
302
+ ]
303
+ },
304
+ "key": "{border.radius.default}"
305
+ },
306
+ "name": "BORDER_RADIUS_DEFAULT",
307
+ "attributes": {},
308
+ "path": [
309
+ "border",
310
+ "radius",
311
+ "default"
312
+ ]
313
+ }
314
+ },
315
+ "color": {
316
+ "default": {
317
+ "key": "{border.color.default}",
318
+ "$value": "#dcdcde",
319
+ "$type": "color",
320
+ "$description": "Used for the default border color.",
321
+ "$extensions": {
322
+ "com.figma.scope": [
323
+ "STROKE_COLOR"
324
+ ]
325
+ },
326
+ "filePath": "src/tokens/semantic/border.tokens.json",
327
+ "isSource": true,
328
+ "original": {
329
+ "$value": {
330
+ "default": "{color.neutral.100}",
331
+ "dark": "{color.neutral.700}"
332
+ },
333
+ "$type": "color",
334
+ "$description": "Used for the default border color.",
335
+ "$extensions": {
336
+ "com.figma.scope": [
337
+ "STROKE_COLOR"
338
+ ]
339
+ },
340
+ "key": "{border.color.default}"
341
+ },
342
+ "name": "BORDER_COLOR_DEFAULT",
343
+ "attributes": {},
344
+ "path": [
345
+ "border",
346
+ "color",
347
+ "default"
348
+ ]
349
+ },
350
+ "subtle": {
351
+ "key": "{border.color.subtle}",
352
+ "$value": "#ececef",
353
+ "$type": "color",
354
+ "$description": "Used for a subtle border in combination with the default background.",
355
+ "$extensions": {
356
+ "com.figma.scope": [
357
+ "STROKE_COLOR"
358
+ ]
359
+ },
360
+ "filePath": "src/tokens/semantic/border.tokens.json",
361
+ "isSource": true,
362
+ "original": {
363
+ "$value": {
364
+ "default": "{color.neutral.50}",
365
+ "dark": "{color.neutral.800}"
366
+ },
367
+ "$type": "color",
368
+ "$description": "Used for a subtle border in combination with the default background.",
369
+ "$extensions": {
370
+ "com.figma.scope": [
371
+ "STROKE_COLOR"
372
+ ]
373
+ },
374
+ "key": "{border.color.subtle}"
375
+ },
376
+ "name": "BORDER_COLOR_SUBTLE",
377
+ "attributes": {},
378
+ "path": [
379
+ "border",
380
+ "color",
381
+ "subtle"
382
+ ]
383
+ },
384
+ "strong": {
385
+ "key": "{border.color.strong}",
386
+ "$value": "#bfbfc3",
387
+ "$type": "color",
388
+ "$description": "Used for a distinct border that emphasizes an edge or boundaries.",
389
+ "$extensions": {
390
+ "com.figma.scope": [
391
+ "STROKE_COLOR"
392
+ ]
393
+ },
394
+ "filePath": "src/tokens/semantic/border.tokens.json",
395
+ "isSource": true,
396
+ "original": {
397
+ "$value": {
398
+ "default": "{color.neutral.200}",
399
+ "dark": "{color.neutral.600}"
400
+ },
401
+ "$type": "color",
402
+ "$description": "Used for a distinct border that emphasizes an edge or boundaries.",
403
+ "$extensions": {
404
+ "com.figma.scope": [
405
+ "STROKE_COLOR"
406
+ ]
407
+ },
408
+ "key": "{border.color.strong}"
409
+ },
410
+ "name": "BORDER_COLOR_STRONG",
411
+ "attributes": {},
412
+ "path": [
413
+ "border",
414
+ "color",
415
+ "strong"
416
+ ]
417
+ },
418
+ "section": {
419
+ "key": "{border.color.section}",
420
+ "$value": "#dcdcde",
421
+ "$type": "color",
422
+ "$description": "Used for the border color that surrounds content or elements when they appear as a closed container or closed section of the page.",
423
+ "$extensions": {
424
+ "com.figma.scope": [
425
+ "STROKE_COLOR"
426
+ ]
427
+ },
428
+ "filePath": "src/tokens/semantic/border.tokens.json",
429
+ "isSource": true,
430
+ "original": {
431
+ "$value": {
432
+ "default": "{border.color.default}",
433
+ "dark": "{background.color.default}"
434
+ },
435
+ "$type": "color",
436
+ "$description": "Used for the border color that surrounds content or elements when they appear as a closed container or closed section of the page.",
437
+ "$extensions": {
438
+ "com.figma.scope": [
439
+ "STROKE_COLOR"
440
+ ]
441
+ },
442
+ "key": "{border.color.section}"
443
+ },
444
+ "name": "BORDER_COLOR_SECTION",
445
+ "attributes": {},
446
+ "path": [
447
+ "border",
448
+ "color",
449
+ "section"
450
+ ]
451
+ },
452
+ "transparent": {
453
+ "key": "{border.color.transparent}",
454
+ "$value": "transparent",
455
+ "$type": "color",
456
+ "$description": "Used when a border needs to be present, but not visibly perceived.",
457
+ "$extensions": {
458
+ "com.figma.scope": [
459
+ "ALL_SCOPES"
460
+ ]
461
+ },
462
+ "filePath": "src/tokens/semantic/border.tokens.json",
463
+ "isSource": true,
464
+ "original": {
465
+ "$value": "{color.alpha.0}",
466
+ "$type": "color",
467
+ "$description": "Used when a border needs to be present, but not visibly perceived.",
468
+ "$extensions": {
469
+ "com.figma.scope": [
470
+ "ALL_SCOPES"
471
+ ]
472
+ },
473
+ "key": "{border.color.transparent}"
474
+ },
475
+ "name": "BORDER_COLOR_TRANSPARENT",
476
+ "attributes": {},
477
+ "path": [
478
+ "border",
479
+ "color",
480
+ "transparent"
481
+ ]
482
+ }
483
+ }
484
+ },
2
485
  "color": {
3
486
  "alpha": {
4
487
  "0": {
@@ -6724,6 +7207,39 @@
6724
7207
  }
6725
7208
  },
6726
7209
  "alert": {
7210
+ "border": {
7211
+ "radius": {
7212
+ "key": "{alert.border.radius}",
7213
+ "$value": "0.25rem",
7214
+ "$type": "dimension",
7215
+ "$description": "Used for alert border radius.",
7216
+ "$extensions": {
7217
+ "com.figma.scope": [
7218
+ "CORNER_RADIUS"
7219
+ ]
7220
+ },
7221
+ "filePath": "src/tokens/contextual/alert.tokens.json",
7222
+ "isSource": true,
7223
+ "original": {
7224
+ "$value": "{border.radius.default}",
7225
+ "$type": "dimension",
7226
+ "$description": "Used for alert border radius.",
7227
+ "$extensions": {
7228
+ "com.figma.scope": [
7229
+ "CORNER_RADIUS"
7230
+ ]
7231
+ },
7232
+ "key": "{alert.border.radius}"
7233
+ },
7234
+ "name": "ALERT_BORDER_RADIUS",
7235
+ "attributes": {},
7236
+ "path": [
7237
+ "alert",
7238
+ "border",
7239
+ "radius"
7240
+ ]
7241
+ }
7242
+ },
6727
7243
  "neutral": {
6728
7244
  "title": {
6729
7245
  "color": {
@@ -12969,6 +13485,38 @@
12969
13485
  "red"
12970
13486
  ]
12971
13487
  }
13488
+ },
13489
+ "radius": {
13490
+ "key": "{broadcast.banner.border.radius}",
13491
+ "$value": "0.25rem",
13492
+ "$type": "dimension",
13493
+ "$description": "Used for broadcast banner border radius.",
13494
+ "$extensions": {
13495
+ "com.figma.scope": [
13496
+ "CORNER_RADIUS"
13497
+ ]
13498
+ },
13499
+ "filePath": "src/tokens/contextual/broadcast.tokens.json",
13500
+ "isSource": true,
13501
+ "original": {
13502
+ "$value": "{border.radius.default}",
13503
+ "$type": "dimension",
13504
+ "$description": "Used for broadcast banner border radius.",
13505
+ "$extensions": {
13506
+ "com.figma.scope": [
13507
+ "CORNER_RADIUS"
13508
+ ]
13509
+ },
13510
+ "key": "{broadcast.banner.border.radius}"
13511
+ },
13512
+ "name": "BROADCAST_BANNER_BORDER_RADIUS",
13513
+ "attributes": {},
13514
+ "path": [
13515
+ "broadcast",
13516
+ "banner",
13517
+ "border",
13518
+ "radius"
13519
+ ]
12972
13520
  }
12973
13521
  },
12974
13522
  "icon": {
@@ -13662,6 +14210,39 @@
13662
14210
  }
13663
14211
  },
13664
14212
  "button": {
14213
+ "border": {
14214
+ "radius": {
14215
+ "key": "{button.border.radius}",
14216
+ "$value": "0.25rem",
14217
+ "$type": "dimension",
14218
+ "$description": "Used for button border radius.",
14219
+ "$extensions": {
14220
+ "com.figma.scope": [
14221
+ "CORNER_RADIUS"
14222
+ ]
14223
+ },
14224
+ "filePath": "src/tokens/contextual/button.tokens.json",
14225
+ "isSource": true,
14226
+ "original": {
14227
+ "$value": "{action.border.radius}",
14228
+ "$type": "dimension",
14229
+ "$description": "Used for button border radius.",
14230
+ "$extensions": {
14231
+ "com.figma.scope": [
14232
+ "CORNER_RADIUS"
14233
+ ]
14234
+ },
14235
+ "key": "{button.border.radius}"
14236
+ },
14237
+ "name": "BUTTON_BORDER_RADIUS",
14238
+ "attributes": {},
14239
+ "path": [
14240
+ "button",
14241
+ "border",
14242
+ "radius"
14243
+ ]
14244
+ }
14245
+ },
13665
14246
  "default": {
13666
14247
  "primary": {
13667
14248
  "foreground": {
@@ -18155,6 +18736,41 @@
18155
18736
  }
18156
18737
  }
18157
18738
  },
18739
+ "card": {
18740
+ "border": {
18741
+ "radius": {
18742
+ "key": "{card.border.radius}",
18743
+ "$value": "0.25rem",
18744
+ "$type": "dimension",
18745
+ "$description": "Used for card border radius.",
18746
+ "$extensions": {
18747
+ "com.figma.scope": [
18748
+ "CORNER_RADIUS"
18749
+ ]
18750
+ },
18751
+ "filePath": "src/tokens/contextual/card.tokens.json",
18752
+ "isSource": true,
18753
+ "original": {
18754
+ "$value": "{border.radius.default}",
18755
+ "$type": "dimension",
18756
+ "$description": "Used for card border radius.",
18757
+ "$extensions": {
18758
+ "com.figma.scope": [
18759
+ "CORNER_RADIUS"
18760
+ ]
18761
+ },
18762
+ "key": "{card.border.radius}"
18763
+ },
18764
+ "name": "CARD_BORDER_RADIUS",
18765
+ "attributes": {},
18766
+ "path": [
18767
+ "card",
18768
+ "border",
18769
+ "radius"
18770
+ ]
18771
+ }
18772
+ }
18773
+ },
18158
18774
  "chart": {
18159
18775
  "axis": {
18160
18776
  "pointer": {
@@ -18537,6 +19153,7 @@
18537
19153
  "STROKE_COLOR"
18538
19154
  ]
18539
19155
  },
19156
+ "$deprecated": true,
18540
19157
  "filePath": "src/tokens/contextual/dropdown.tokens.json",
18541
19158
  "isSource": true,
18542
19159
  "original": {
@@ -18552,6 +19169,7 @@
18552
19169
  "STROKE_COLOR"
18553
19170
  ]
18554
19171
  },
19172
+ "$deprecated": true,
18555
19173
  "key": "{dropdown.border.color}"
18556
19174
  },
18557
19175
  "name": "DROPDOWN_BORDER_COLOR",
@@ -18561,6 +19179,37 @@
18561
19179
  "border",
18562
19180
  "color"
18563
19181
  ]
19182
+ },
19183
+ "radius": {
19184
+ "key": "{dropdown.border.radius}",
19185
+ "$value": "0.5rem",
19186
+ "$type": "dimension",
19187
+ "$description": "Used for the border radius of a dropdown.",
19188
+ "$extensions": {
19189
+ "com.figma.scope": [
19190
+ "CORNER_RADIUS"
19191
+ ]
19192
+ },
19193
+ "filePath": "src/tokens/contextual/dropdown.tokens.json",
19194
+ "isSource": true,
19195
+ "original": {
19196
+ "$value": "{border.radius.lg}",
19197
+ "$type": "dimension",
19198
+ "$description": "Used for the border radius of a dropdown.",
19199
+ "$extensions": {
19200
+ "com.figma.scope": [
19201
+ "CORNER_RADIUS"
19202
+ ]
19203
+ },
19204
+ "key": "{dropdown.border.radius}"
19205
+ },
19206
+ "name": "DROPDOWN_BORDER_RADIUS",
19207
+ "attributes": {},
19208
+ "path": [
19209
+ "dropdown",
19210
+ "border",
19211
+ "radius"
19212
+ ]
18564
19213
  }
18565
19214
  },
18566
19215
  "divider": {
@@ -19245,7 +19894,7 @@
19245
19894
  "original": {
19246
19895
  "$value": {
19247
19896
  "default": "{color.alpha.dark.2}",
19248
- "dark": "{color.alpha.dark.24}"
19897
+ "dark": "{color.alpha.dark.16}"
19249
19898
  },
19250
19899
  "$type": "color",
19251
19900
  "$description": "Used for the background of a search input in a dropdown listbox.",
@@ -21436,6 +22085,41 @@
21436
22085
  }
21437
22086
  }
21438
22087
  },
22088
+ "modal": {
22089
+ "border": {
22090
+ "radius": {
22091
+ "key": "{modal.border.radius}",
22092
+ "$value": "0.25rem",
22093
+ "$type": "dimension",
22094
+ "$description": "Used for modal border radius.",
22095
+ "$extensions": {
22096
+ "com.figma.scope": [
22097
+ "CORNER_RADIUS"
22098
+ ]
22099
+ },
22100
+ "filePath": "src/tokens/contextual/modal.tokens.json",
22101
+ "isSource": true,
22102
+ "original": {
22103
+ "$value": "{border.radius.default}",
22104
+ "$type": "dimension",
22105
+ "$description": "Used for modal border radius.",
22106
+ "$extensions": {
22107
+ "com.figma.scope": [
22108
+ "CORNER_RADIUS"
22109
+ ]
22110
+ },
22111
+ "key": "{modal.border.radius}"
22112
+ },
22113
+ "name": "MODAL_BORDER_RADIUS",
22114
+ "attributes": {},
22115
+ "path": [
22116
+ "modal",
22117
+ "border",
22118
+ "radius"
22119
+ ]
22120
+ }
22121
+ }
22122
+ },
21439
22123
  "progress-bar": {
21440
22124
  "indicator": {
21441
22125
  "color": {
@@ -29824,6 +30508,39 @@
29824
30508
  }
29825
30509
  },
29826
30510
  "action": {
30511
+ "border": {
30512
+ "radius": {
30513
+ "key": "{action.border.radius}",
30514
+ "$value": "0.25rem",
30515
+ "$type": "dimension",
30516
+ "$description": "Used for the border radius of an action.",
30517
+ "$extensions": {
30518
+ "com.figma.scope": [
30519
+ "CORNER_RADIUS"
30520
+ ]
30521
+ },
30522
+ "filePath": "src/tokens/semantic/action.tokens.json",
30523
+ "isSource": true,
30524
+ "original": {
30525
+ "$value": "{border.radius.default}",
30526
+ "$type": "dimension",
30527
+ "$description": "Used for the border radius of an action.",
30528
+ "$extensions": {
30529
+ "com.figma.scope": [
30530
+ "CORNER_RADIUS"
30531
+ ]
30532
+ },
30533
+ "key": "{action.border.radius}"
30534
+ },
30535
+ "name": "ACTION_BORDER_RADIUS",
30536
+ "attributes": {},
30537
+ "path": [
30538
+ "action",
30539
+ "border",
30540
+ "radius"
30541
+ ]
30542
+ }
30543
+ },
29827
30544
  "disabled": {
29828
30545
  "foreground": {
29829
30546
  "color": {
@@ -32873,177 +33590,6 @@
32873
33590
  }
32874
33591
  }
32875
33592
  },
32876
- "border": {
32877
- "color": {
32878
- "default": {
32879
- "key": "{border.color.default}",
32880
- "$value": "#dcdcde",
32881
- "$type": "color",
32882
- "$description": "Used for the default border color.",
32883
- "$extensions": {
32884
- "com.figma.scope": [
32885
- "STROKE_COLOR"
32886
- ]
32887
- },
32888
- "filePath": "src/tokens/semantic/border.tokens.json",
32889
- "isSource": true,
32890
- "original": {
32891
- "$value": {
32892
- "default": "{color.neutral.100}",
32893
- "dark": "{color.neutral.700}"
32894
- },
32895
- "$type": "color",
32896
- "$description": "Used for the default border color.",
32897
- "$extensions": {
32898
- "com.figma.scope": [
32899
- "STROKE_COLOR"
32900
- ]
32901
- },
32902
- "key": "{border.color.default}"
32903
- },
32904
- "name": "BORDER_COLOR_DEFAULT",
32905
- "attributes": {},
32906
- "path": [
32907
- "border",
32908
- "color",
32909
- "default"
32910
- ]
32911
- },
32912
- "subtle": {
32913
- "key": "{border.color.subtle}",
32914
- "$value": "#ececef",
32915
- "$type": "color",
32916
- "$description": "Used for a subtle border in combination with the default background.",
32917
- "$extensions": {
32918
- "com.figma.scope": [
32919
- "STROKE_COLOR"
32920
- ]
32921
- },
32922
- "filePath": "src/tokens/semantic/border.tokens.json",
32923
- "isSource": true,
32924
- "original": {
32925
- "$value": {
32926
- "default": "{color.neutral.50}",
32927
- "dark": "{color.neutral.800}"
32928
- },
32929
- "$type": "color",
32930
- "$description": "Used for a subtle border in combination with the default background.",
32931
- "$extensions": {
32932
- "com.figma.scope": [
32933
- "STROKE_COLOR"
32934
- ]
32935
- },
32936
- "key": "{border.color.subtle}"
32937
- },
32938
- "name": "BORDER_COLOR_SUBTLE",
32939
- "attributes": {},
32940
- "path": [
32941
- "border",
32942
- "color",
32943
- "subtle"
32944
- ]
32945
- },
32946
- "strong": {
32947
- "key": "{border.color.strong}",
32948
- "$value": "#bfbfc3",
32949
- "$type": "color",
32950
- "$description": "Used for a distinct border that emphasizes an edge or boundaries.",
32951
- "$extensions": {
32952
- "com.figma.scope": [
32953
- "STROKE_COLOR"
32954
- ]
32955
- },
32956
- "filePath": "src/tokens/semantic/border.tokens.json",
32957
- "isSource": true,
32958
- "original": {
32959
- "$value": {
32960
- "default": "{color.neutral.200}",
32961
- "dark": "{color.neutral.600}"
32962
- },
32963
- "$type": "color",
32964
- "$description": "Used for a distinct border that emphasizes an edge or boundaries.",
32965
- "$extensions": {
32966
- "com.figma.scope": [
32967
- "STROKE_COLOR"
32968
- ]
32969
- },
32970
- "key": "{border.color.strong}"
32971
- },
32972
- "name": "BORDER_COLOR_STRONG",
32973
- "attributes": {},
32974
- "path": [
32975
- "border",
32976
- "color",
32977
- "strong"
32978
- ]
32979
- },
32980
- "section": {
32981
- "key": "{border.color.section}",
32982
- "$value": "#dcdcde",
32983
- "$type": "color",
32984
- "$description": "Used for the border color that surrounds content or elements when they appear as a closed container or closed section of the page.",
32985
- "$extensions": {
32986
- "com.figma.scope": [
32987
- "STROKE_COLOR"
32988
- ]
32989
- },
32990
- "filePath": "src/tokens/semantic/border.tokens.json",
32991
- "isSource": true,
32992
- "original": {
32993
- "$value": {
32994
- "default": "{border.color.default}",
32995
- "dark": "{background.color.default}"
32996
- },
32997
- "$type": "color",
32998
- "$description": "Used for the border color that surrounds content or elements when they appear as a closed container or closed section of the page.",
32999
- "$extensions": {
33000
- "com.figma.scope": [
33001
- "STROKE_COLOR"
33002
- ]
33003
- },
33004
- "key": "{border.color.section}"
33005
- },
33006
- "name": "BORDER_COLOR_SECTION",
33007
- "attributes": {},
33008
- "path": [
33009
- "border",
33010
- "color",
33011
- "section"
33012
- ]
33013
- },
33014
- "transparent": {
33015
- "key": "{border.color.transparent}",
33016
- "$value": "transparent",
33017
- "$type": "color",
33018
- "$description": "Used when a border needs to be present, but not visibly perceived.",
33019
- "$extensions": {
33020
- "com.figma.scope": [
33021
- "ALL_SCOPES"
33022
- ]
33023
- },
33024
- "filePath": "src/tokens/semantic/border.tokens.json",
33025
- "isSource": true,
33026
- "original": {
33027
- "$value": "{color.alpha.0}",
33028
- "$type": "color",
33029
- "$description": "Used when a border needs to be present, but not visibly perceived.",
33030
- "$extensions": {
33031
- "com.figma.scope": [
33032
- "ALL_SCOPES"
33033
- ]
33034
- },
33035
- "key": "{border.color.transparent}"
33036
- },
33037
- "name": "BORDER_COLOR_TRANSPARENT",
33038
- "attributes": {},
33039
- "path": [
33040
- "border",
33041
- "color",
33042
- "transparent"
33043
- ]
33044
- }
33045
- }
33046
- },
33047
33593
  "control": {
33048
33594
  "background": {
33049
33595
  "color": {
@@ -33600,6 +34146,37 @@
33600
34146
  ]
33601
34147
  }
33602
34148
  }
34149
+ },
34150
+ "radius": {
34151
+ "key": "{control.border.radius}",
34152
+ "$value": "0.25rem",
34153
+ "$type": "dimension",
34154
+ "$description": "Used for form control (input, radio button, checkbox, textarea) default border radius.",
34155
+ "$extensions": {
34156
+ "com.figma.scope": [
34157
+ "CORNER_RADIUS"
34158
+ ]
34159
+ },
34160
+ "filePath": "src/tokens/semantic/control.tokens.json",
34161
+ "isSource": true,
34162
+ "original": {
34163
+ "$value": "{border.radius.default}",
34164
+ "$type": "dimension",
34165
+ "$description": "Used for form control (input, radio button, checkbox, textarea) default border radius.",
34166
+ "$extensions": {
34167
+ "com.figma.scope": [
34168
+ "CORNER_RADIUS"
34169
+ ]
34170
+ },
34171
+ "key": "{control.border.radius}"
34172
+ },
34173
+ "name": "CONTROL_BORDER_RADIUS",
34174
+ "attributes": {},
34175
+ "path": [
34176
+ "control",
34177
+ "border",
34178
+ "radius"
34179
+ ]
33603
34180
  }
33604
34181
  },
33605
34182
  "text": {