@gitlab/ui 134.9.0 → 135.0.1

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 (107) hide show
  1. package/dist/components/base/accordion/accordion_item.js +1 -1
  2. package/dist/components/base/animated_icon/base_animated_icon.js +3 -0
  3. package/dist/components/base/color_mode_toggle/color_mode_toggle.js +11 -1
  4. package/dist/components/base/filtered_search/filtered_search.js +9 -0
  5. package/dist/components/base/filtered_search/filtered_search_suggestion.js +3 -0
  6. package/dist/components/base/filtered_search/filtered_search_term.js +9 -0
  7. package/dist/components/base/filtered_search/filtered_search_token.js +15 -0
  8. package/dist/components/base/filtered_search/filtered_search_token_segment.js +27 -0
  9. package/dist/components/base/form/form_combobox/form_combobox.js +18 -0
  10. package/dist/components/base/form/form_date/form_date.js +18 -0
  11. package/dist/components/base/form/form_fields/form_field_validator.js +9 -0
  12. package/dist/components/base/form/form_fields/form_fields_loop.js +3 -0
  13. package/dist/components/base/markdown/markdown.js +3 -0
  14. package/dist/components/base/new_dropdowns/base_dropdown/base_dropdown.js +54 -0
  15. package/dist/components/base/new_dropdowns/disclosure/disclosure_dropdown_item.js +3 -0
  16. package/dist/components/base/new_dropdowns/listbox/listbox.js +3 -0
  17. package/dist/components/base/new_dropdowns/listbox/listbox_group.js +6 -0
  18. package/dist/components/base/new_dropdowns/listbox/listbox_item.js +15 -0
  19. package/dist/components/base/search_box_by_click/search_box_by_click.js +6 -0
  20. package/dist/components/base/segmented_control/segmented_control.js +6 -0
  21. package/dist/components/base/table_lite/table_lite.js +9 -0
  22. package/dist/components/base/tabs/tab/tab.js +3 -0
  23. package/dist/components/base/tabs/tabs/tabs.js +21 -0
  24. package/dist/components/base/toast/toast.js +12 -0
  25. package/dist/components/base/toggle/toggle.js +3 -0
  26. package/dist/components/base/token_selector/token_container.js +12 -0
  27. package/dist/components/base/token_selector/token_selector_dropdown.js +27 -0
  28. package/dist/components/charts/area/area.js +36 -0
  29. package/dist/components/charts/bar/bar.js +15 -0
  30. package/dist/components/charts/chart/chart.js +7 -1
  31. package/dist/components/charts/column/column.js +24 -0
  32. package/dist/components/charts/discrete_scatter/discrete_scatter.js +21 -0
  33. package/dist/components/charts/gauge/gauge.js +21 -0
  34. package/dist/components/charts/heatmap/heatmap.js +33 -0
  35. package/dist/components/charts/legend/legend.js +15 -0
  36. package/dist/components/charts/line/line.js +33 -0
  37. package/dist/components/charts/series_label/series_label.js +6 -0
  38. package/dist/components/charts/shared/tooltip/tooltip.js +6 -0
  39. package/dist/components/charts/shared/tooltip/tooltip_default_format/tooltip_default_format.js +3 -0
  40. package/dist/components/charts/single_stat/single_stat.js +30 -0
  41. package/dist/components/charts/stacked_column/stacked_column.js +55 -0
  42. package/dist/components/regions/empty_state/empty_state.js +3 -0
  43. package/dist/components/shared_components/clear_icon_button/clear_icon_button.js +6 -0
  44. package/dist/components/shared_components/close_button/close_button.js +3 -0
  45. package/dist/components/utilities/animated_number/animated_number.js +9 -0
  46. package/dist/components/utilities/intersperse/intersperse.js +6 -0
  47. package/dist/index.css +1 -1
  48. package/dist/index.css.map +1 -1
  49. package/dist/tailwind.css +1 -1
  50. package/dist/tailwind.css.map +1 -1
  51. package/dist/tokens/tokens_story.js +3 -0
  52. package/package.json +4 -3
  53. package/src/components/base/accordion/accordion_item.vue +6 -3
  54. package/src/components/base/animated_icon/base_animated_icon.vue +3 -0
  55. package/src/components/base/color_mode_toggle/color_mode_toggle.vue +11 -0
  56. package/src/components/base/filtered_search/filtered_search.vue +9 -0
  57. package/src/components/base/filtered_search/filtered_search_suggestion.vue +3 -0
  58. package/src/components/base/filtered_search/filtered_search_term.vue +9 -0
  59. package/src/components/base/filtered_search/filtered_search_token.vue +15 -0
  60. package/src/components/base/filtered_search/filtered_search_token_segment.vue +27 -0
  61. package/src/components/base/form/form_combobox/form_combobox.vue +18 -0
  62. package/src/components/base/form/form_date/form_date.vue +18 -0
  63. package/src/components/base/form/form_fields/form_field_validator.vue +9 -0
  64. package/src/components/base/form/form_fields/form_fields_loop.vue +3 -0
  65. package/src/components/base/icon/icon.figma.batch.ts +26 -0
  66. package/src/components/base/markdown/markdown.vue +3 -0
  67. package/src/components/base/new_dropdowns/base_dropdown/base_dropdown.vue +54 -0
  68. package/src/components/base/new_dropdowns/disclosure/disclosure_dropdown_item.vue +3 -0
  69. package/src/components/base/new_dropdowns/listbox/listbox.vue +3 -0
  70. package/src/components/base/new_dropdowns/listbox/listbox_group.vue +6 -0
  71. package/src/components/base/new_dropdowns/listbox/listbox_item.vue +15 -0
  72. package/src/components/base/pagination/pagination.scss +1 -0
  73. package/src/components/base/search_box_by_click/search_box_by_click.vue +6 -0
  74. package/src/components/base/segmented_control/segmented_control.vue +6 -0
  75. package/src/components/base/table_lite/table_lite.vue +9 -0
  76. package/src/components/base/tabs/tab/tab.vue +3 -0
  77. package/src/components/base/tabs/tabs/tabs.vue +21 -0
  78. package/src/components/base/toast/toast.vue +12 -0
  79. package/src/components/base/toggle/toggle.vue +3 -0
  80. package/src/components/base/token_selector/token_container.vue +12 -0
  81. package/src/components/base/token_selector/token_selector_dropdown.vue +27 -0
  82. package/src/components/charts/area/area.vue +36 -0
  83. package/src/components/charts/bar/bar.vue +15 -0
  84. package/src/components/charts/chart/chart.vue +7 -1
  85. package/src/components/charts/column/column.vue +24 -0
  86. package/src/components/charts/discrete_scatter/discrete_scatter.vue +21 -0
  87. package/src/components/charts/gauge/gauge.vue +21 -0
  88. package/src/components/charts/heatmap/heatmap.vue +33 -0
  89. package/src/components/charts/legend/legend.vue +15 -0
  90. package/src/components/charts/line/line.vue +33 -0
  91. package/src/components/charts/series_label/series_label.vue +6 -0
  92. package/src/components/charts/shared/tooltip/tooltip.vue +6 -0
  93. package/src/components/charts/shared/tooltip/tooltip_default_format/tooltip_default_format.vue +3 -0
  94. package/src/components/charts/single_stat/single_stat.vue +30 -0
  95. package/src/components/charts/stacked_column/stacked_column.vue +55 -0
  96. package/src/components/regions/empty_state/empty_state.vue +3 -0
  97. package/src/components/shared_components/clear_icon_button/clear_icon_button.vue +6 -0
  98. package/src/components/shared_components/close_button/close_button.vue +3 -0
  99. package/src/components/utilities/animated_number/animated_number.vue +9 -0
  100. package/src/components/utilities/intersperse/intersperse.vue +6 -0
  101. package/src/tokens/build/figma/mode.dark.json +35 -18
  102. package/src/tokens/build/figma/mode.json +35 -18
  103. package/src/tokens/build/json/tokens.dark.json +70 -36
  104. package/src/tokens/build/json/tokens.json +70 -36
  105. package/src/tokens/contextual/toggle.tokens.json +34 -17
  106. package/src/tokens/semantic/highlight.tokens.json +1 -1
  107. package/src/tokens/tokens_story.vue +3 -0
package/src/tokens/build/json/tokens.json CHANGED
@@ -23818,7 +23818,8 @@
23818
23818
  "$description": "Used for the track color of an unchecked toggle switch in the default state.",
23819
23819
  "$extensions": {
23820
23820
  "com.figma.scopes": [
23821
- "SHAPE_FILL"
23821
+ "SHAPE_FILL",
23822
+ "FRAME_FILL"
23822
23823
  ]
23823
23824
  },
23824
23825
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -23829,7 +23830,8 @@
23829
23830
  "$description": "Used for the track color of an unchecked toggle switch in the default state.",
23830
23831
  "$extensions": {
23831
23832
  "com.figma.scopes": [
23832
- "SHAPE_FILL"
23833
+ "SHAPE_FILL",
23834
+ "FRAME_FILL"
23833
23835
  ]
23834
23836
  },
23835
23837
  "key": "{toggle.switch.track.color.unchecked.default}"
@@ -23852,7 +23854,8 @@
23852
23854
  "$description": "Used for the track color of an unchecked toggle switch in the hover state.",
23853
23855
  "$extensions": {
23854
23856
  "com.figma.scopes": [
23855
- "SHAPE_FILL"
23857
+ "SHAPE_FILL",
23858
+ "FRAME_FILL"
23856
23859
  ]
23857
23860
  },
23858
23861
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -23863,7 +23866,8 @@
23863
23866
  "$description": "Used for the track color of an unchecked toggle switch in the hover state.",
23864
23867
  "$extensions": {
23865
23868
  "com.figma.scopes": [
23866
- "SHAPE_FILL"
23869
+ "SHAPE_FILL",
23870
+ "FRAME_FILL"
23867
23871
  ]
23868
23872
  },
23869
23873
  "key": "{toggle.switch.track.color.unchecked.hover}"
@@ -23886,7 +23890,8 @@
23886
23890
  "$description": "Used for the track color of an unchecked toggle switch in the focus state.",
23887
23891
  "$extensions": {
23888
23892
  "com.figma.scopes": [
23889
- "SHAPE_FILL"
23893
+ "SHAPE_FILL",
23894
+ "FRAME_FILL"
23890
23895
  ]
23891
23896
  },
23892
23897
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -23897,7 +23902,8 @@
23897
23902
  "$description": "Used for the track color of an unchecked toggle switch in the focus state.",
23898
23903
  "$extensions": {
23899
23904
  "com.figma.scopes": [
23900
- "SHAPE_FILL"
23905
+ "SHAPE_FILL",
23906
+ "FRAME_FILL"
23901
23907
  ]
23902
23908
  },
23903
23909
  "key": "{toggle.switch.track.color.unchecked.focus}"
@@ -23920,7 +23926,8 @@
23920
23926
  "$description": "Used for the track color of an unchecked toggle switch in the active state.",
23921
23927
  "$extensions": {
23922
23928
  "com.figma.scopes": [
23923
- "SHAPE_FILL"
23929
+ "SHAPE_FILL",
23930
+ "FRAME_FILL"
23924
23931
  ]
23925
23932
  },
23926
23933
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -23931,7 +23938,8 @@
23931
23938
  "$description": "Used for the track color of an unchecked toggle switch in the active state.",
23932
23939
  "$extensions": {
23933
23940
  "com.figma.scopes": [
23934
- "SHAPE_FILL"
23941
+ "SHAPE_FILL",
23942
+ "FRAME_FILL"
23935
23943
  ]
23936
23944
  },
23937
23945
  "key": "{toggle.switch.track.color.unchecked.active}"
@@ -23956,7 +23964,8 @@
23956
23964
  "$description": "Used for the track color of a checked toggle switch in the default state.",
23957
23965
  "$extensions": {
23958
23966
  "com.figma.scopes": [
23959
- "SHAPE_FILL"
23967
+ "SHAPE_FILL",
23968
+ "FRAME_FILL"
23960
23969
  ]
23961
23970
  },
23962
23971
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -23967,7 +23976,8 @@
23967
23976
  "$description": "Used for the track color of a checked toggle switch in the default state.",
23968
23977
  "$extensions": {
23969
23978
  "com.figma.scopes": [
23970
- "SHAPE_FILL"
23979
+ "SHAPE_FILL",
23980
+ "FRAME_FILL"
23971
23981
  ]
23972
23982
  },
23973
23983
  "key": "{toggle.switch.track.color.checked.default}"
@@ -23990,7 +24000,8 @@
23990
24000
  "$description": "Used for the track color of a checked toggle switch in the hover state.",
23991
24001
  "$extensions": {
23992
24002
  "com.figma.scopes": [
23993
- "SHAPE_FILL"
24003
+ "SHAPE_FILL",
24004
+ "FRAME_FILL"
23994
24005
  ]
23995
24006
  },
23996
24007
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24001,7 +24012,8 @@
24001
24012
  "$description": "Used for the track color of a checked toggle switch in the hover state.",
24002
24013
  "$extensions": {
24003
24014
  "com.figma.scopes": [
24004
- "SHAPE_FILL"
24015
+ "SHAPE_FILL",
24016
+ "FRAME_FILL"
24005
24017
  ]
24006
24018
  },
24007
24019
  "key": "{toggle.switch.track.color.checked.hover}"
@@ -24024,7 +24036,8 @@
24024
24036
  "$description": "Used for the track color of a checked toggle switch in the focus state.",
24025
24037
  "$extensions": {
24026
24038
  "com.figma.scopes": [
24027
- "SHAPE_FILL"
24039
+ "SHAPE_FILL",
24040
+ "FRAME_FILL"
24028
24041
  ]
24029
24042
  },
24030
24043
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24035,7 +24048,8 @@
24035
24048
  "$description": "Used for the track color of a checked toggle switch in the focus state.",
24036
24049
  "$extensions": {
24037
24050
  "com.figma.scopes": [
24038
- "SHAPE_FILL"
24051
+ "SHAPE_FILL",
24052
+ "FRAME_FILL"
24039
24053
  ]
24040
24054
  },
24041
24055
  "key": "{toggle.switch.track.color.checked.focus}"
@@ -24058,7 +24072,8 @@
24058
24072
  "$description": "Used for the track color of a checked toggle switch in the active state.",
24059
24073
  "$extensions": {
24060
24074
  "com.figma.scopes": [
24061
- "SHAPE_FILL"
24075
+ "SHAPE_FILL",
24076
+ "FRAME_FILL"
24062
24077
  ]
24063
24078
  },
24064
24079
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24069,7 +24084,8 @@
24069
24084
  "$description": "Used for the track color of a checked toggle switch in the active state.",
24070
24085
  "$extensions": {
24071
24086
  "com.figma.scopes": [
24072
- "SHAPE_FILL"
24087
+ "SHAPE_FILL",
24088
+ "FRAME_FILL"
24073
24089
  ]
24074
24090
  },
24075
24091
  "key": "{toggle.switch.track.color.checked.active}"
@@ -24098,7 +24114,8 @@
24098
24114
  "$description": "Used for the background color of the unchecked toggle switch thumb in the default state.",
24099
24115
  "$extensions": {
24100
24116
  "com.figma.scopes": [
24101
- "SHAPE_FILL"
24117
+ "SHAPE_FILL",
24118
+ "FRAME_FILL"
24102
24119
  ]
24103
24120
  },
24104
24121
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24109,7 +24126,8 @@
24109
24126
  "$description": "Used for the background color of the unchecked toggle switch thumb in the default state.",
24110
24127
  "$extensions": {
24111
24128
  "com.figma.scopes": [
24112
- "SHAPE_FILL"
24129
+ "SHAPE_FILL",
24130
+ "FRAME_FILL"
24113
24131
  ]
24114
24132
  },
24115
24133
  "key": "{toggle.switch.background.color.unchecked.default}"
@@ -24132,7 +24150,8 @@
24132
24150
  "$description": "Used for the background color of the unchecked toggle switch thumb in the hover state.",
24133
24151
  "$extensions": {
24134
24152
  "com.figma.scopes": [
24135
- "SHAPE_FILL"
24153
+ "SHAPE_FILL",
24154
+ "FRAME_FILL"
24136
24155
  ]
24137
24156
  },
24138
24157
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24143,7 +24162,8 @@
24143
24162
  "$description": "Used for the background color of the unchecked toggle switch thumb in the hover state.",
24144
24163
  "$extensions": {
24145
24164
  "com.figma.scopes": [
24146
- "SHAPE_FILL"
24165
+ "SHAPE_FILL",
24166
+ "FRAME_FILL"
24147
24167
  ]
24148
24168
  },
24149
24169
  "key": "{toggle.switch.background.color.unchecked.hover}"
@@ -24166,7 +24186,8 @@
24166
24186
  "$description": "Used for the background color of the unchecked toggle switch thumb in the focus state.",
24167
24187
  "$extensions": {
24168
24188
  "com.figma.scopes": [
24169
- "SHAPE_FILL"
24189
+ "SHAPE_FILL",
24190
+ "FRAME_FILL"
24170
24191
  ]
24171
24192
  },
24172
24193
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24177,7 +24198,8 @@
24177
24198
  "$description": "Used for the background color of the unchecked toggle switch thumb in the focus state.",
24178
24199
  "$extensions": {
24179
24200
  "com.figma.scopes": [
24180
- "SHAPE_FILL"
24201
+ "SHAPE_FILL",
24202
+ "FRAME_FILL"
24181
24203
  ]
24182
24204
  },
24183
24205
  "key": "{toggle.switch.background.color.unchecked.focus}"
@@ -24200,7 +24222,8 @@
24200
24222
  "$description": "Used for the background color of the unchecked toggle switch thumb in the active state.",
24201
24223
  "$extensions": {
24202
24224
  "com.figma.scopes": [
24203
- "SHAPE_FILL"
24225
+ "SHAPE_FILL",
24226
+ "FRAME_FILL"
24204
24227
  ]
24205
24228
  },
24206
24229
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24211,7 +24234,8 @@
24211
24234
  "$description": "Used for the background color of the unchecked toggle switch thumb in the active state.",
24212
24235
  "$extensions": {
24213
24236
  "com.figma.scopes": [
24214
- "SHAPE_FILL"
24237
+ "SHAPE_FILL",
24238
+ "FRAME_FILL"
24215
24239
  ]
24216
24240
  },
24217
24241
  "key": "{toggle.switch.background.color.unchecked.active}"
@@ -24236,7 +24260,8 @@
24236
24260
  "$description": "Used for the background color of the checked toggle switch thumb in the default state.",
24237
24261
  "$extensions": {
24238
24262
  "com.figma.scopes": [
24239
- "SHAPE_FILL"
24263
+ "SHAPE_FILL",
24264
+ "FRAME_FILL"
24240
24265
  ]
24241
24266
  },
24242
24267
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24247,7 +24272,8 @@
24247
24272
  "$description": "Used for the background color of the checked toggle switch thumb in the default state.",
24248
24273
  "$extensions": {
24249
24274
  "com.figma.scopes": [
24250
- "SHAPE_FILL"
24275
+ "SHAPE_FILL",
24276
+ "FRAME_FILL"
24251
24277
  ]
24252
24278
  },
24253
24279
  "key": "{toggle.switch.background.color.checked.default}"
@@ -24270,7 +24296,8 @@
24270
24296
  "$description": "Used for the background color of the checked toggle switch thumb in the hover state.",
24271
24297
  "$extensions": {
24272
24298
  "com.figma.scopes": [
24273
- "SHAPE_FILL"
24299
+ "SHAPE_FILL",
24300
+ "FRAME_FILL"
24274
24301
  ]
24275
24302
  },
24276
24303
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24281,7 +24308,8 @@
24281
24308
  "$description": "Used for the background color of the checked toggle switch thumb in the hover state.",
24282
24309
  "$extensions": {
24283
24310
  "com.figma.scopes": [
24284
- "SHAPE_FILL"
24311
+ "SHAPE_FILL",
24312
+ "FRAME_FILL"
24285
24313
  ]
24286
24314
  },
24287
24315
  "key": "{toggle.switch.background.color.checked.hover}"
@@ -24304,7 +24332,8 @@
24304
24332
  "$description": "Used for the background color of the checked toggle switch thumb in the focus state.",
24305
24333
  "$extensions": {
24306
24334
  "com.figma.scopes": [
24307
- "SHAPE_FILL"
24335
+ "SHAPE_FILL",
24336
+ "FRAME_FILL"
24308
24337
  ]
24309
24338
  },
24310
24339
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24315,7 +24344,8 @@
24315
24344
  "$description": "Used for the background color of the checked toggle switch thumb in the focus state.",
24316
24345
  "$extensions": {
24317
24346
  "com.figma.scopes": [
24318
- "SHAPE_FILL"
24347
+ "SHAPE_FILL",
24348
+ "FRAME_FILL"
24319
24349
  ]
24320
24350
  },
24321
24351
  "key": "{toggle.switch.background.color.checked.focus}"
@@ -24338,7 +24368,8 @@
24338
24368
  "$description": "Used for the background color of the checked toggle switch thumb in the active state.",
24339
24369
  "$extensions": {
24340
24370
  "com.figma.scopes": [
24341
- "SHAPE_FILL"
24371
+ "SHAPE_FILL",
24372
+ "FRAME_FILL"
24342
24373
  ]
24343
24374
  },
24344
24375
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24349,7 +24380,8 @@
24349
24380
  "$description": "Used for the background color of the checked toggle switch thumb in the active state.",
24350
24381
  "$extensions": {
24351
24382
  "com.figma.scopes": [
24352
- "SHAPE_FILL"
24383
+ "SHAPE_FILL",
24384
+ "FRAME_FILL"
24353
24385
  ]
24354
24386
  },
24355
24387
  "key": "{toggle.switch.background.color.checked.active}"
@@ -24373,7 +24405,8 @@
24373
24405
  "$description": "Used for the background color of the toggle switch thumb in the disabled state.",
24374
24406
  "$extensions": {
24375
24407
  "com.figma.scopes": [
24376
- "SHAPE_FILL"
24408
+ "SHAPE_FILL",
24409
+ "FRAME_FILL"
24377
24410
  ]
24378
24411
  },
24379
24412
  "filePath": "src/tokens/contextual/toggle.tokens.json",
@@ -24384,7 +24417,8 @@
24384
24417
  "$description": "Used for the background color of the toggle switch thumb in the disabled state.",
24385
24418
  "$extensions": {
24386
24419
  "com.figma.scopes": [
24387
- "SHAPE_FILL"
24420
+ "SHAPE_FILL",
24421
+ "FRAME_FILL"
24388
24422
  ]
24389
24423
  },
24390
24424
  "key": "{toggle.switch.background.color.disabled}"
@@ -34381,7 +34415,7 @@
34381
34415
  "$description": "Used to provide additional visual emphasis for borders of temporarily targeted elements or when visualizing connections between related content, distinct from persistent states.",
34382
34416
  "$extensions": {
34383
34417
  "com.figma.scopes": [
34384
- "TEXT_FILL"
34418
+ "STROKE_COLOR"
34385
34419
  ]
34386
34420
  },
34387
34421
  "filePath": "src/tokens/semantic/highlight.tokens.json",
@@ -34392,7 +34426,7 @@
34392
34426
  "$description": "Used to provide additional visual emphasis for borders of temporarily targeted elements or when visualizing connections between related content, distinct from persistent states.",
34393
34427
  "$extensions": {
34394
34428
  "com.figma.scopes": [
34395
- "TEXT_FILL"
34429
+ "STROKE_COLOR"
34396
34430
  ]
34397
34431
  },
34398
34432
  "key": "{highlight.target.border.color}"
package/src/tokens/contextual/toggle.tokens.json CHANGED
@@ -10,7 +10,8 @@
10
10
  "$description": "Used for the track color of an unchecked toggle switch in the default state.",
11
11
  "$extensions": {
12
12
  "com.figma.scopes": [
13
- "SHAPE_FILL"
13
+ "SHAPE_FILL",
14
+ "FRAME_FILL"
14
15
  ]
15
16
  }
16
17
  },
@@ -20,7 +21,8 @@
20
21
  "$description": "Used for the track color of an unchecked toggle switch in the hover state.",
21
22
  "$extensions": {
22
23
  "com.figma.scopes": [
23
- "SHAPE_FILL"
24
+ "SHAPE_FILL",
25
+ "FRAME_FILL"
24
26
  ]
25
27
  }
26
28
  },
@@ -30,7 +32,8 @@
30
32
  "$description": "Used for the track color of an unchecked toggle switch in the focus state.",
31
33
  "$extensions": {
32
34
  "com.figma.scopes": [
33
- "SHAPE_FILL"
35
+ "SHAPE_FILL",
36
+ "FRAME_FILL"
34
37
  ]
35
38
  }
36
39
  },
@@ -40,7 +43,8 @@
40
43
  "$description": "Used for the track color of an unchecked toggle switch in the active state.",
41
44
  "$extensions": {
42
45
  "com.figma.scopes": [
43
- "SHAPE_FILL"
46
+ "SHAPE_FILL",
47
+ "FRAME_FILL"
44
48
  ]
45
49
  }
46
50
  }
@@ -55,7 +59,8 @@
55
59
  "$description": "Used for the track color of a checked toggle switch in the default state.",
56
60
  "$extensions": {
57
61
  "com.figma.scopes": [
58
- "SHAPE_FILL"
62
+ "SHAPE_FILL",
63
+ "FRAME_FILL"
59
64
  ]
60
65
  }
61
66
  },
@@ -68,7 +73,8 @@
68
73
  "$description": "Used for the track color of a checked toggle switch in the hover state.",
69
74
  "$extensions": {
70
75
  "com.figma.scopes": [
71
- "SHAPE_FILL"
76
+ "SHAPE_FILL",
77
+ "FRAME_FILL"
72
78
  ]
73
79
  }
74
80
  },
@@ -78,7 +84,8 @@
78
84
  "$description": "Used for the track color of a checked toggle switch in the focus state.",
79
85
  "$extensions": {
80
86
  "com.figma.scopes": [
81
- "SHAPE_FILL"
87
+ "SHAPE_FILL",
88
+ "FRAME_FILL"
82
89
  ]
83
90
  }
84
91
  },
@@ -91,7 +98,8 @@
91
98
  "$description": "Used for the track color of a checked toggle switch in the active state.",
92
99
  "$extensions": {
93
100
  "com.figma.scopes": [
94
- "SHAPE_FILL"
101
+ "SHAPE_FILL",
102
+ "FRAME_FILL"
95
103
  ]
96
104
  }
97
105
  }
@@ -107,7 +115,8 @@
107
115
  "$description": "Used for the background color of the unchecked toggle switch thumb in the default state.",
108
116
  "$extensions": {
109
117
  "com.figma.scopes": [
110
- "SHAPE_FILL"
118
+ "SHAPE_FILL",
119
+ "FRAME_FILL"
111
120
  ]
112
121
  }
113
122
  },
@@ -117,7 +126,8 @@
117
126
  "$description": "Used for the background color of the unchecked toggle switch thumb in the hover state.",
118
127
  "$extensions": {
119
128
  "com.figma.scopes": [
120
- "SHAPE_FILL"
129
+ "SHAPE_FILL",
130
+ "FRAME_FILL"
121
131
  ]
122
132
  }
123
133
  },
@@ -127,7 +137,8 @@
127
137
  "$description": "Used for the background color of the unchecked toggle switch thumb in the focus state.",
128
138
  "$extensions": {
129
139
  "com.figma.scopes": [
130
- "SHAPE_FILL"
140
+ "SHAPE_FILL",
141
+ "FRAME_FILL"
131
142
  ]
132
143
  }
133
144
  },
@@ -137,7 +148,8 @@
137
148
  "$description": "Used for the background color of the unchecked toggle switch thumb in the active state.",
138
149
  "$extensions": {
139
150
  "com.figma.scopes": [
140
- "SHAPE_FILL"
151
+ "SHAPE_FILL",
152
+ "FRAME_FILL"
141
153
  ]
142
154
  }
143
155
  }
@@ -149,7 +161,8 @@
149
161
  "$description": "Used for the background color of the checked toggle switch thumb in the default state.",
150
162
  "$extensions": {
151
163
  "com.figma.scopes": [
152
- "SHAPE_FILL"
164
+ "SHAPE_FILL",
165
+ "FRAME_FILL"
153
166
  ]
154
167
  }
155
168
  },
@@ -159,7 +172,8 @@
159
172
  "$description": "Used for the background color of the checked toggle switch thumb in the hover state.",
160
173
  "$extensions": {
161
174
  "com.figma.scopes": [
162
- "SHAPE_FILL"
175
+ "SHAPE_FILL",
176
+ "FRAME_FILL"
163
177
  ]
164
178
  }
165
179
  },
@@ -169,7 +183,8 @@
169
183
  "$description": "Used for the background color of the checked toggle switch thumb in the focus state.",
170
184
  "$extensions": {
171
185
  "com.figma.scopes": [
172
- "SHAPE_FILL"
186
+ "SHAPE_FILL",
187
+ "FRAME_FILL"
173
188
  ]
174
189
  }
175
190
  },
@@ -179,7 +194,8 @@
179
194
  "$description": "Used for the background color of the checked toggle switch thumb in the active state.",
180
195
  "$extensions": {
181
196
  "com.figma.scopes": [
182
- "SHAPE_FILL"
197
+ "SHAPE_FILL",
198
+ "FRAME_FILL"
183
199
  ]
184
200
  }
185
201
  }
@@ -190,7 +206,8 @@
190
206
  "$description": "Used for the background color of the toggle switch thumb in the disabled state.",
191
207
  "$extensions": {
192
208
  "com.figma.scopes": [
193
- "SHAPE_FILL"
209
+ "SHAPE_FILL",
210
+ "FRAME_FILL"
194
211
  ]
195
212
  }
196
213
  }
package/src/tokens/semantic/highlight.tokens.json CHANGED
@@ -60,7 +60,7 @@
60
60
  "$description": "Used to provide additional visual emphasis for borders of temporarily targeted elements or when visualizing connections between related content, distinct from persistent states.",
61
61
  "$extensions": {
62
62
  "com.figma.scopes": [
63
- "TEXT_FILL"
63
+ "STROKE_COLOR"
64
64
  ]
65
65
  }
66
66
  }
package/src/tokens/tokens_story.vue CHANGED
@@ -13,6 +13,9 @@ export default {
13
13
  },
14
14
  inject: ['containerClass'],
15
15
  props: {
16
+ /**
17
+ * Map of design tokens to display in the story.
18
+ */
16
19
  tokens: {
17
20
  type: Object,
18
21
  required: false,