@gitlab/ui 124.0.0 → 124.1.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 (34) hide show
  1. package/dist/index.css +2 -2
  2. package/dist/index.css.map +1 -1
  3. package/dist/tokens/build/js/tokens.dark.js +17 -1
  4. package/dist/tokens/build/js/tokens.js +17 -1
  5. package/dist/tokens/css/tokens.css +20 -4
  6. package/dist/tokens/css/tokens.dark.css +20 -4
  7. package/dist/tokens/docs/tokens-tailwind-docs.dark.json +515 -3
  8. package/dist/tokens/docs/tokens-tailwind-docs.json +515 -3
  9. package/dist/tokens/figma/constants.tokens.json +203 -4
  10. package/dist/tokens/js/tokens.dark.js +20 -0
  11. package/dist/tokens/js/tokens.js +20 -0
  12. package/dist/tokens/json/tokens.dark.json +499 -3
  13. package/dist/tokens/json/tokens.json +499 -3
  14. package/dist/tokens/scss/_tokens.dark.scss +20 -4
  15. package/dist/tokens/scss/_tokens.scss +20 -4
  16. package/dist/tokens/scss/_tokens_custom_properties.scss +16 -0
  17. package/dist/tokens/tailwind/tokens.cjs +16 -0
  18. package/package.json +1 -1
  19. package/src/components/base/breadcrumb/breadcrumb.scss +2 -8
  20. package/src/components/base/link/link.scss +1 -1
  21. package/src/tokens/build/css/tokens.css +20 -4
  22. package/src/tokens/build/css/tokens.dark.css +20 -4
  23. package/src/tokens/build/docs/tokens-tailwind-docs.dark.json +515 -3
  24. package/src/tokens/build/docs/tokens-tailwind-docs.json +515 -3
  25. package/src/tokens/build/figma/constants.tokens.json +203 -4
  26. package/src/tokens/build/js/tokens.dark.js +16 -0
  27. package/src/tokens/build/js/tokens.js +16 -0
  28. package/src/tokens/build/json/tokens.dark.json +499 -3
  29. package/src/tokens/build/json/tokens.json +499 -3
  30. package/src/tokens/build/scss/_tokens.dark.scss +20 -4
  31. package/src/tokens/build/scss/_tokens.scss +20 -4
  32. package/src/tokens/build/scss/_tokens_custom_properties.scss +16 -0
  33. package/src/tokens/build/tailwind/tokens.cjs +16 -0
  34. package/src/tokens/constant/font.tokens.json +203 -4
@@ -42028,6 +42028,262 @@
42028
42028
  }
42029
42029
  },
42030
42030
  "fontSize": {
42031
+ "100": {
42032
+ "key": "{font.size.100}",
42033
+ "$value": "0.75rem",
42034
+ "$type": "dimension",
42035
+ "$description": "Used for meta text and small labels.",
42036
+ "$extensions": {
42037
+ "com.figma.scope": [
42038
+ "FONT_SIZE"
42039
+ ]
42040
+ },
42041
+ "filePath": "src/tokens/constant/font.tokens.json",
42042
+ "isSource": true,
42043
+ "original": {
42044
+ "$value": "0.75rem",
42045
+ "$type": "dimension",
42046
+ "$description": "Used for meta text and small labels.",
42047
+ "$extensions": {
42048
+ "com.figma.scope": [
42049
+ "FONT_SIZE"
42050
+ ]
42051
+ },
42052
+ "key": "{font.size.100}"
42053
+ },
42054
+ "name": "FONT_SIZE_100",
42055
+ "attributes": {},
42056
+ "path": [
42057
+ "font",
42058
+ "size",
42059
+ "100"
42060
+ ],
42061
+ "cssWithValue": "var(--gl-font-size-100)"
42062
+ },
42063
+ "200": {
42064
+ "key": "{font.size.200}",
42065
+ "$value": "0.8125rem",
42066
+ "$type": "dimension",
42067
+ "$description": "Used for level 6 headings.",
42068
+ "$extensions": {
42069
+ "com.figma.scope": [
42070
+ "FONT_SIZE"
42071
+ ]
42072
+ },
42073
+ "filePath": "src/tokens/constant/font.tokens.json",
42074
+ "isSource": true,
42075
+ "original": {
42076
+ "$value": "0.8125rem",
42077
+ "$type": "dimension",
42078
+ "$description": "Used for level 6 headings.",
42079
+ "$extensions": {
42080
+ "com.figma.scope": [
42081
+ "FONT_SIZE"
42082
+ ]
42083
+ },
42084
+ "key": "{font.size.200}"
42085
+ },
42086
+ "name": "FONT_SIZE_200",
42087
+ "attributes": {},
42088
+ "path": [
42089
+ "font",
42090
+ "size",
42091
+ "200"
42092
+ ],
42093
+ "cssWithValue": "var(--gl-font-size-200)"
42094
+ },
42095
+ "300": {
42096
+ "key": "{font.size.300}",
42097
+ "$value": "0.875rem",
42098
+ "$type": "dimension",
42099
+ "$description": "Used for level 5 headings, body text, input labels, and help text.",
42100
+ "$extensions": {
42101
+ "com.figma.scope": [
42102
+ "FONT_SIZE"
42103
+ ]
42104
+ },
42105
+ "filePath": "src/tokens/constant/font.tokens.json",
42106
+ "isSource": true,
42107
+ "original": {
42108
+ "$value": "0.875rem",
42109
+ "$type": "dimension",
42110
+ "$description": "Used for level 5 headings, body text, input labels, and help text.",
42111
+ "$extensions": {
42112
+ "com.figma.scope": [
42113
+ "FONT_SIZE"
42114
+ ]
42115
+ },
42116
+ "key": "{font.size.300}"
42117
+ },
42118
+ "name": "FONT_SIZE_300",
42119
+ "attributes": {},
42120
+ "path": [
42121
+ "font",
42122
+ "size",
42123
+ "300"
42124
+ ],
42125
+ "cssWithValue": "var(--gl-font-size-300)"
42126
+ },
42127
+ "400": {
42128
+ "key": "{font.size.400}",
42129
+ "$value": "1rem",
42130
+ "$type": "dimension",
42131
+ "$description": "Used for level 4 headings, large body text.",
42132
+ "$extensions": {
42133
+ "com.figma.scope": [
42134
+ "FONT_SIZE"
42135
+ ]
42136
+ },
42137
+ "filePath": "src/tokens/constant/font.tokens.json",
42138
+ "isSource": true,
42139
+ "original": {
42140
+ "$value": "1rem",
42141
+ "$type": "dimension",
42142
+ "$description": "Used for level 4 headings, large body text.",
42143
+ "$extensions": {
42144
+ "com.figma.scope": [
42145
+ "FONT_SIZE"
42146
+ ]
42147
+ },
42148
+ "key": "{font.size.400}"
42149
+ },
42150
+ "name": "FONT_SIZE_400",
42151
+ "attributes": {},
42152
+ "path": [
42153
+ "font",
42154
+ "size",
42155
+ "400"
42156
+ ],
42157
+ "cssWithValue": "var(--gl-font-size-400)"
42158
+ },
42159
+ "500": {
42160
+ "key": "{font.size.500}",
42161
+ "$value": "clamp(1.125rem, 0.9027777778rem + 0.462962963vw, 1.25rem)",
42162
+ "$type": "dimension",
42163
+ "$description": "Used for responsive level 3 headings.",
42164
+ "$extensions": {
42165
+ "com.figma.scope": [
42166
+ "FONT_SIZE"
42167
+ ]
42168
+ },
42169
+ "filePath": "src/tokens/constant/font.tokens.json",
42170
+ "isSource": true,
42171
+ "original": {
42172
+ "$value": "clamp(1.125rem, 0.9027777778rem + 0.462962963vw, 1.25rem)",
42173
+ "$type": "dimension",
42174
+ "$description": "Used for responsive level 3 headings.",
42175
+ "$extensions": {
42176
+ "com.figma.scope": [
42177
+ "FONT_SIZE"
42178
+ ]
42179
+ },
42180
+ "key": "{font.size.500}"
42181
+ },
42182
+ "name": "FONT_SIZE_500",
42183
+ "attributes": {},
42184
+ "path": [
42185
+ "font",
42186
+ "size",
42187
+ "500"
42188
+ ],
42189
+ "cssWithValue": "var(--gl-font-size-500)"
42190
+ },
42191
+ "600": {
42192
+ "key": "{font.size.600}",
42193
+ "$value": "clamp(1.3125rem, 0.8680555556rem + 0.9259259259vw, 1.5625rem)",
42194
+ "$type": "dimension",
42195
+ "$description": "Used for responsive level 2 headings.",
42196
+ "$extensions": {
42197
+ "com.figma.scope": [
42198
+ "FONT_SIZE"
42199
+ ]
42200
+ },
42201
+ "filePath": "src/tokens/constant/font.tokens.json",
42202
+ "isSource": true,
42203
+ "original": {
42204
+ "$value": "clamp(1.3125rem, 0.8680555556rem + 0.9259259259vw, 1.5625rem)",
42205
+ "$type": "dimension",
42206
+ "$description": "Used for responsive level 2 headings.",
42207
+ "$extensions": {
42208
+ "com.figma.scope": [
42209
+ "FONT_SIZE"
42210
+ ]
42211
+ },
42212
+ "key": "{font.size.600}"
42213
+ },
42214
+ "name": "FONT_SIZE_600",
42215
+ "attributes": {},
42216
+ "path": [
42217
+ "font",
42218
+ "size",
42219
+ "600"
42220
+ ],
42221
+ "cssWithValue": "var(--gl-font-size-600)"
42222
+ },
42223
+ "700": {
42224
+ "key": "{font.size.700}",
42225
+ "$value": "clamp(1.5rem, 0.8333333333rem + 1.3888888889vw, 1.875rem)",
42226
+ "$type": "dimension",
42227
+ "$description": "Used for responsive level 1 headings",
42228
+ "$extensions": {
42229
+ "com.figma.scope": [
42230
+ "FONT_SIZE"
42231
+ ]
42232
+ },
42233
+ "filePath": "src/tokens/constant/font.tokens.json",
42234
+ "isSource": true,
42235
+ "original": {
42236
+ "$value": "clamp(1.5rem, 0.8333333333rem + 1.3888888889vw, 1.875rem)",
42237
+ "$type": "dimension",
42238
+ "$description": "Used for responsive level 1 headings",
42239
+ "$extensions": {
42240
+ "com.figma.scope": [
42241
+ "FONT_SIZE"
42242
+ ]
42243
+ },
42244
+ "key": "{font.size.700}"
42245
+ },
42246
+ "name": "FONT_SIZE_700",
42247
+ "attributes": {},
42248
+ "path": [
42249
+ "font",
42250
+ "size",
42251
+ "700"
42252
+ ],
42253
+ "cssWithValue": "var(--gl-font-size-700)"
42254
+ },
42255
+ "800": {
42256
+ "key": "{font.size.800}",
42257
+ "$value": "clamp(1.75rem, 0.8611111111rem + 1.8518518519vw, 2.25rem)",
42258
+ "$type": "dimension",
42259
+ "$description": "Used for a responsive display option that can be applied to a level 1 heading to increase its prominence.",
42260
+ "$extensions": {
42261
+ "com.figma.scope": [
42262
+ "FONT_SIZE"
42263
+ ]
42264
+ },
42265
+ "filePath": "src/tokens/constant/font.tokens.json",
42266
+ "isSource": true,
42267
+ "original": {
42268
+ "$value": "clamp(1.75rem, 0.8611111111rem + 1.8518518519vw, 2.25rem)",
42269
+ "$type": "dimension",
42270
+ "$description": "Used for a responsive display option that can be applied to a level 1 heading to increase its prominence.",
42271
+ "$extensions": {
42272
+ "com.figma.scope": [
42273
+ "FONT_SIZE"
42274
+ ]
42275
+ },
42276
+ "key": "{font.size.800}"
42277
+ },
42278
+ "name": "FONT_SIZE_800",
42279
+ "attributes": {},
42280
+ "path": [
42281
+ "font",
42282
+ "size",
42283
+ "800"
42284
+ ],
42285
+ "cssWithValue": "var(--gl-font-size-800)"
42286
+ },
42031
42287
  "xs": {
42032
42288
  "key": "{font.size.xs}",
42033
42289
  "$value": "0.625rem",
@@ -42070,7 +42326,7 @@
42070
42326
  "filePath": "src/tokens/constant/font.tokens.json",
42071
42327
  "isSource": true,
42072
42328
  "original": {
42073
- "$value": "0.75rem",
42329
+ "$value": "{font.size.100}",
42074
42330
  "$type": "dimension",
42075
42331
  "$extensions": {
42076
42332
  "com.figma.scope": [
@@ -42100,7 +42356,7 @@
42100
42356
  "filePath": "src/tokens/constant/font.tokens.json",
42101
42357
  "isSource": true,
42102
42358
  "original": {
42103
- "$value": "0.875rem",
42359
+ "$value": "{font.size.300}",
42104
42360
  "$type": "dimension",
42105
42361
  "$extensions": {
42106
42362
  "com.figma.scope": [
@@ -42130,7 +42386,7 @@
42130
42386
  "filePath": "src/tokens/constant/font.tokens.json",
42131
42387
  "isSource": true,
42132
42388
  "original": {
42133
- "$value": "1rem",
42389
+ "$value": "{font.size.400}",
42134
42390
  "$type": "dimension",
42135
42391
  "$extensions": {
42136
42392
  "com.figma.scope": [
@@ -42148,6 +42404,262 @@
42148
42404
  ],
42149
42405
  "cssWithValue": "var(--gl-font-size-lg)"
42150
42406
  },
42407
+ "100-fixed": {
42408
+ "key": "{font.size.100-fixed}",
42409
+ "$value": "0.75rem",
42410
+ "$type": "dimension",
42411
+ "$description": "Used for meta text and small labels.",
42412
+ "$extensions": {
42413
+ "com.figma.scope": [
42414
+ "FONT_SIZE"
42415
+ ]
42416
+ },
42417
+ "filePath": "src/tokens/constant/font.tokens.json",
42418
+ "isSource": true,
42419
+ "original": {
42420
+ "$value": "0.75rem",
42421
+ "$type": "dimension",
42422
+ "$description": "Used for meta text and small labels.",
42423
+ "$extensions": {
42424
+ "com.figma.scope": [
42425
+ "FONT_SIZE"
42426
+ ]
42427
+ },
42428
+ "key": "{font.size.100-fixed}"
42429
+ },
42430
+ "name": "FONT_SIZE_100_FIXED",
42431
+ "attributes": {},
42432
+ "path": [
42433
+ "font",
42434
+ "size",
42435
+ "100-fixed"
42436
+ ],
42437
+ "cssWithValue": "var(--gl-font-size-100-fixed)"
42438
+ },
42439
+ "200-fixed": {
42440
+ "key": "{font.size.200-fixed}",
42441
+ "$value": "0.8125rem",
42442
+ "$type": "dimension",
42443
+ "$description": "Used for level 6 headings.",
42444
+ "$extensions": {
42445
+ "com.figma.scope": [
42446
+ "FONT_SIZE"
42447
+ ]
42448
+ },
42449
+ "filePath": "src/tokens/constant/font.tokens.json",
42450
+ "isSource": true,
42451
+ "original": {
42452
+ "$value": "0.8125rem",
42453
+ "$type": "dimension",
42454
+ "$description": "Used for level 6 headings.",
42455
+ "$extensions": {
42456
+ "com.figma.scope": [
42457
+ "FONT_SIZE"
42458
+ ]
42459
+ },
42460
+ "key": "{font.size.200-fixed}"
42461
+ },
42462
+ "name": "FONT_SIZE_200_FIXED",
42463
+ "attributes": {},
42464
+ "path": [
42465
+ "font",
42466
+ "size",
42467
+ "200-fixed"
42468
+ ],
42469
+ "cssWithValue": "var(--gl-font-size-200-fixed)"
42470
+ },
42471
+ "300-fixed": {
42472
+ "key": "{font.size.300-fixed}",
42473
+ "$value": "0.875rem",
42474
+ "$type": "dimension",
42475
+ "$description": "Used for level 5 headings, body text, input labels, and help text.",
42476
+ "$extensions": {
42477
+ "com.figma.scope": [
42478
+ "FONT_SIZE"
42479
+ ]
42480
+ },
42481
+ "filePath": "src/tokens/constant/font.tokens.json",
42482
+ "isSource": true,
42483
+ "original": {
42484
+ "$value": "0.875rem",
42485
+ "$type": "dimension",
42486
+ "$description": "Used for level 5 headings, body text, input labels, and help text.",
42487
+ "$extensions": {
42488
+ "com.figma.scope": [
42489
+ "FONT_SIZE"
42490
+ ]
42491
+ },
42492
+ "key": "{font.size.300-fixed}"
42493
+ },
42494
+ "name": "FONT_SIZE_300_FIXED",
42495
+ "attributes": {},
42496
+ "path": [
42497
+ "font",
42498
+ "size",
42499
+ "300-fixed"
42500
+ ],
42501
+ "cssWithValue": "var(--gl-font-size-300-fixed)"
42502
+ },
42503
+ "400-fixed": {
42504
+ "key": "{font.size.400-fixed}",
42505
+ "$value": "1rem",
42506
+ "$type": "dimension",
42507
+ "$description": "Used for level 4 headings, large body text.",
42508
+ "$extensions": {
42509
+ "com.figma.scope": [
42510
+ "FONT_SIZE"
42511
+ ]
42512
+ },
42513
+ "filePath": "src/tokens/constant/font.tokens.json",
42514
+ "isSource": true,
42515
+ "original": {
42516
+ "$value": "1rem",
42517
+ "$type": "dimension",
42518
+ "$description": "Used for level 4 headings, large body text.",
42519
+ "$extensions": {
42520
+ "com.figma.scope": [
42521
+ "FONT_SIZE"
42522
+ ]
42523
+ },
42524
+ "key": "{font.size.400-fixed}"
42525
+ },
42526
+ "name": "FONT_SIZE_400_FIXED",
42527
+ "attributes": {},
42528
+ "path": [
42529
+ "font",
42530
+ "size",
42531
+ "400-fixed"
42532
+ ],
42533
+ "cssWithValue": "var(--gl-font-size-400-fixed)"
42534
+ },
42535
+ "500-fixed": {
42536
+ "key": "{font.size.500-fixed}",
42537
+ "$value": "1.125rem",
42538
+ "$type": "dimension",
42539
+ "$description": "Used for level 3 headings.",
42540
+ "$extensions": {
42541
+ "com.figma.scope": [
42542
+ "FONT_SIZE"
42543
+ ]
42544
+ },
42545
+ "filePath": "src/tokens/constant/font.tokens.json",
42546
+ "isSource": true,
42547
+ "original": {
42548
+ "$value": "1.125rem",
42549
+ "$type": "dimension",
42550
+ "$description": "Used for level 3 headings.",
42551
+ "$extensions": {
42552
+ "com.figma.scope": [
42553
+ "FONT_SIZE"
42554
+ ]
42555
+ },
42556
+ "key": "{font.size.500-fixed}"
42557
+ },
42558
+ "name": "FONT_SIZE_500_FIXED",
42559
+ "attributes": {},
42560
+ "path": [
42561
+ "font",
42562
+ "size",
42563
+ "500-fixed"
42564
+ ],
42565
+ "cssWithValue": "var(--gl-font-size-500-fixed)"
42566
+ },
42567
+ "600-fixed": {
42568
+ "key": "{font.size.600-fixed}",
42569
+ "$value": "1.3125rem",
42570
+ "$type": "dimension",
42571
+ "$description": "Used for level 2 headings.",
42572
+ "$extensions": {
42573
+ "com.figma.scope": [
42574
+ "FONT_SIZE"
42575
+ ]
42576
+ },
42577
+ "filePath": "src/tokens/constant/font.tokens.json",
42578
+ "isSource": true,
42579
+ "original": {
42580
+ "$value": "1.3125rem",
42581
+ "$type": "dimension",
42582
+ "$description": "Used for level 2 headings.",
42583
+ "$extensions": {
42584
+ "com.figma.scope": [
42585
+ "FONT_SIZE"
42586
+ ]
42587
+ },
42588
+ "key": "{font.size.600-fixed}"
42589
+ },
42590
+ "name": "FONT_SIZE_600_FIXED",
42591
+ "attributes": {},
42592
+ "path": [
42593
+ "font",
42594
+ "size",
42595
+ "600-fixed"
42596
+ ],
42597
+ "cssWithValue": "var(--gl-font-size-600-fixed)"
42598
+ },
42599
+ "700-fixed": {
42600
+ "key": "{font.size.700-fixed}",
42601
+ "$value": "1.5rem",
42602
+ "$type": "dimension",
42603
+ "$description": "Used for level 1 headings",
42604
+ "$extensions": {
42605
+ "com.figma.scope": [
42606
+ "FONT_SIZE"
42607
+ ]
42608
+ },
42609
+ "filePath": "src/tokens/constant/font.tokens.json",
42610
+ "isSource": true,
42611
+ "original": {
42612
+ "$value": "1.5rem",
42613
+ "$type": "dimension",
42614
+ "$description": "Used for level 1 headings",
42615
+ "$extensions": {
42616
+ "com.figma.scope": [
42617
+ "FONT_SIZE"
42618
+ ]
42619
+ },
42620
+ "key": "{font.size.700-fixed}"
42621
+ },
42622
+ "name": "FONT_SIZE_700_FIXED",
42623
+ "attributes": {},
42624
+ "path": [
42625
+ "font",
42626
+ "size",
42627
+ "700-fixed"
42628
+ ],
42629
+ "cssWithValue": "var(--gl-font-size-700-fixed)"
42630
+ },
42631
+ "800-fixed": {
42632
+ "key": "{font.size.800-fixed}",
42633
+ "$value": "1.75rem",
42634
+ "$type": "dimension",
42635
+ "$description": "Used for a display option that can be applied to a level 1 heading to increase its prominence.",
42636
+ "$extensions": {
42637
+ "com.figma.scope": [
42638
+ "FONT_SIZE"
42639
+ ]
42640
+ },
42641
+ "filePath": "src/tokens/constant/font.tokens.json",
42642
+ "isSource": true,
42643
+ "original": {
42644
+ "$value": "1.75rem",
42645
+ "$type": "dimension",
42646
+ "$description": "Used for a display option that can be applied to a level 1 heading to increase its prominence.",
42647
+ "$extensions": {
42648
+ "com.figma.scope": [
42649
+ "FONT_SIZE"
42650
+ ]
42651
+ },
42652
+ "key": "{font.size.800-fixed}"
42653
+ },
42654
+ "name": "FONT_SIZE_800_FIXED",
42655
+ "attributes": {},
42656
+ "path": [
42657
+ "font",
42658
+ "size",
42659
+ "800-fixed"
42660
+ ],
42661
+ "cssWithValue": "var(--gl-font-size-800-fixed)"
42662
+ },
42151
42663
  "base": {
42152
42664
  "key": "{font.size.base}",
42153
42665
  "$value": "0.875rem",