@gitlab/ui 128.0.0 → 128.2.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 (43) hide show
  1. package/dist/components/base/color_mode_toggle/color_mode_toggle.js +92 -0
  2. package/dist/components/base/form/form_checkbox/form_checkbox.js +0 -3
  3. package/dist/components/base/form/form_checkbox/form_checkbox_group.js +132 -3
  4. package/dist/components/index.js +1 -0
  5. package/dist/index.css +1 -1
  6. package/dist/index.css.map +1 -1
  7. package/dist/tokens/build/js/tokens.dark.js +127 -127
  8. package/dist/tokens/build/js/tokens.js +110 -110
  9. package/dist/vendor/bootstrap-vue/src/constants/components.js +1 -3
  10. package/dist/vendor/bootstrap-vue/src/mixins/form-radio-check-group.js +1 -2
  11. package/package.json +4 -4
  12. package/src/components/base/color_mode_toggle/color_mode_toggle.vue +65 -0
  13. package/src/components/index.js +1 -0
  14. package/src/tokens/build/css/tokens.css +24 -24
  15. package/src/tokens/build/css/tokens.dark.css +26 -26
  16. package/src/tokens/build/docs/tokens-tailwind-docs.dark.json +82 -82
  17. package/src/tokens/build/docs/tokens-tailwind-docs.json +81 -81
  18. package/src/tokens/build/figma/constants.tokens.json +2245 -226
  19. package/src/tokens/build/figma/contextual.tokens.json +753 -77
  20. package/src/tokens/build/figma/deprecated.tokens.json +4151 -420
  21. package/src/tokens/build/figma/semantic.tokens.json +171 -19
  22. package/src/tokens/build/js/tokens.dark.js +130 -127
  23. package/src/tokens/build/js/tokens.js +113 -110
  24. package/src/tokens/build/json/tokens.dark.json +161 -161
  25. package/src/tokens/build/json/tokens.json +142 -142
  26. package/src/tokens/build/scss/_tokens.dark.scss +26 -26
  27. package/src/tokens/build/scss/_tokens.scss +24 -24
  28. package/src/tokens/constant/color.alpha.tokens.json +135 -15
  29. package/src/tokens/constant/color.tokens.json +2110 -211
  30. package/src/tokens/contextual/avatar.tokens.json +54 -6
  31. package/src/tokens/contextual/button.tokens.json +90 -10
  32. package/src/tokens/contextual/chart.tokens.json +9 -1
  33. package/src/tokens/contextual/illustration.tokens.json +600 -60
  34. package/src/tokens/deprecated/deprecated.color.data_viz.tokens.json +1100 -110
  35. package/src/tokens/deprecated/deprecated.color.theme.tokens.json +1440 -144
  36. package/src/tokens/deprecated/deprecated.color.tokens.json +1490 -149
  37. package/src/tokens/deprecated/deprecated.color.transparency.tokens.json +147 -43
  38. package/src/tokens/semantic/action.tokens.json +162 -18
  39. package/src/tokens/semantic/background.tokens.json +9 -1
  40. package/translations.js +2 -0
  41. package/dist/vendor/bootstrap-vue/src/components/form-checkbox/form-checkbox-group.js +0 -37
  42. package/dist/vendor/bootstrap-vue/src/components/form-checkbox/form-checkbox.js +0 -134
  43. package/dist/vendor/bootstrap-vue/src/components/form-checkbox/index.js +0 -2
package/src/tokens/build/figma/semantic.tokens.json CHANGED
@@ -271,8 +271,24 @@
271
271
  "color": {
272
272
  "default": {
273
273
  "$value": {
274
- "default": "rgba(164, 163, 168, 0.0)",
275
- "dark": "rgba(137, 136, 141, 0.0)"
274
+ "default": {
275
+ "colorSpace": "srgb",
276
+ "components": [
277
+ 0.6431372549019608,
278
+ 0.6392156862745098,
279
+ 0.6588235294117647
280
+ ],
281
+ "alpha": 0
282
+ },
283
+ "dark": {
284
+ "colorSpace": "srgb",
285
+ "components": [
286
+ 0.5372549019607843,
287
+ 0.5333333333333333,
288
+ 0.5529411764705883
289
+ ],
290
+ "alpha": 0
291
+ }
276
292
  },
277
293
  "$type": "color",
278
294
  "$description": "Used for the background of a neutral action in the default state.",
@@ -285,8 +301,24 @@
285
301
  },
286
302
  "hover": {
287
303
  "$value": {
288
- "default": "rgba(164, 163, 168, 0.16)",
289
- "dark": "rgba(137, 136, 141, 0.4)"
304
+ "default": {
305
+ "colorSpace": "srgb",
306
+ "components": [
307
+ 0.6431372549019608,
308
+ 0.6392156862745098,
309
+ 0.6588235294117647
310
+ ],
311
+ "alpha": 0.16
312
+ },
313
+ "dark": {
314
+ "colorSpace": "srgb",
315
+ "components": [
316
+ 0.5372549019607843,
317
+ 0.5333333333333333,
318
+ 0.5529411764705883
319
+ ],
320
+ "alpha": 0.4
321
+ }
290
322
  },
291
323
  "$type": "color",
292
324
  "$description": "Used for the background of a neutral action in the hover state.",
@@ -310,8 +342,24 @@
310
342
  },
311
343
  "active": {
312
344
  "$value": {
313
- "default": "rgba(83, 81, 88, 0.24)",
314
- "dark": "rgba(137, 136, 141, 0.16)"
345
+ "default": {
346
+ "colorSpace": "srgb",
347
+ "components": [
348
+ 0.3254901960784314,
349
+ 0.3176470588235294,
350
+ 0.34509803921568627
351
+ ],
352
+ "alpha": 0.24
353
+ },
354
+ "dark": {
355
+ "colorSpace": "srgb",
356
+ "components": [
357
+ 0.5372549019607843,
358
+ 0.5333333333333333,
359
+ 0.5529411764705883
360
+ ],
361
+ "alpha": 0.16
362
+ }
315
363
  },
316
364
  "$type": "color",
317
365
  "$description": "Used for the background of a neutral action in the active state.",
@@ -431,8 +479,24 @@
431
479
  "color": {
432
480
  "default": {
433
481
  "$value": {
434
- "default": "rgba(99, 166, 233, 0.0)",
435
- "dark": "rgba(66, 143, 220, 0.0)"
482
+ "default": {
483
+ "colorSpace": "srgb",
484
+ "components": [
485
+ 0.38823529411764707,
486
+ 0.6509803921568628,
487
+ 0.9137254901960784
488
+ ],
489
+ "alpha": 0
490
+ },
491
+ "dark": {
492
+ "colorSpace": "srgb",
493
+ "components": [
494
+ 0.25882352941176473,
495
+ 0.5607843137254902,
496
+ 0.8627450980392157
497
+ ],
498
+ "alpha": 0
499
+ }
436
500
  },
437
501
  "$type": "color",
438
502
  "$description": "Used for the background of a confirm (positive) action in the default state.",
@@ -445,8 +509,24 @@
445
509
  },
446
510
  "hover": {
447
511
  "$value": {
448
- "default": "rgba(99, 166, 233, 0.16)",
449
- "dark": "rgba(66, 143, 220, 0.4)"
512
+ "default": {
513
+ "colorSpace": "srgb",
514
+ "components": [
515
+ 0.38823529411764707,
516
+ 0.6509803921568628,
517
+ 0.9137254901960784
518
+ ],
519
+ "alpha": 0.16
520
+ },
521
+ "dark": {
522
+ "colorSpace": "srgb",
523
+ "components": [
524
+ 0.25882352941176473,
525
+ 0.5607843137254902,
526
+ 0.8627450980392157
527
+ ],
528
+ "alpha": 0.4
529
+ }
450
530
  },
451
531
  "$type": "color",
452
532
  "$description": "Used for the background of a confirm (positive) action in the hover state.",
@@ -470,8 +550,24 @@
470
550
  },
471
551
  "active": {
472
552
  "$value": {
473
- "default": "rgba(11, 92, 173, 0.24)",
474
- "dark": "rgba(66, 143, 220, 0.16)"
553
+ "default": {
554
+ "colorSpace": "srgb",
555
+ "components": [
556
+ 0.043137254901960784,
557
+ 0.3607843137254902,
558
+ 0.6784313725490196
559
+ ],
560
+ "alpha": 0.24
561
+ },
562
+ "dark": {
563
+ "colorSpace": "srgb",
564
+ "components": [
565
+ 0.25882352941176473,
566
+ 0.5607843137254902,
567
+ 0.8627450980392157
568
+ ],
569
+ "alpha": 0.16
570
+ }
475
571
  },
476
572
  "$type": "color",
477
573
  "$description": "Used for the background of a confirm (positive) action in the active state.",
@@ -591,8 +687,24 @@
591
687
  "color": {
592
688
  "default": {
593
689
  "$value": {
594
- "default": "rgba(245, 127, 108, 0.0)",
595
- "dark": "rgba(236, 89, 65, 0.0)"
690
+ "default": {
691
+ "colorSpace": "srgb",
692
+ "components": [
693
+ 0.9607843137254902,
694
+ 0.4980392156862745,
695
+ 0.4235294117647059
696
+ ],
697
+ "alpha": 0
698
+ },
699
+ "dark": {
700
+ "colorSpace": "srgb",
701
+ "components": [
702
+ 0.9254901960784314,
703
+ 0.34901960784313724,
704
+ 0.2549019607843137
705
+ ],
706
+ "alpha": 0
707
+ }
596
708
  },
597
709
  "$type": "color",
598
710
  "$description": "Used for the background of a danger (destructive) action in the default state.",
@@ -605,8 +717,24 @@
605
717
  },
606
718
  "hover": {
607
719
  "$value": {
608
- "default": "rgba(245, 127, 108, 0.16)",
609
- "dark": "rgba(236, 89, 65, 0.4)"
720
+ "default": {
721
+ "colorSpace": "srgb",
722
+ "components": [
723
+ 0.9607843137254902,
724
+ 0.4980392156862745,
725
+ 0.4235294117647059
726
+ ],
727
+ "alpha": 0.16
728
+ },
729
+ "dark": {
730
+ "colorSpace": "srgb",
731
+ "components": [
732
+ 0.9254901960784314,
733
+ 0.34901960784313724,
734
+ 0.2549019607843137
735
+ ],
736
+ "alpha": 0.4
737
+ }
610
738
  },
611
739
  "$type": "color",
612
740
  "$description": "Used for the background of a danger (destructive) action in the hover state.",
@@ -630,8 +758,24 @@
630
758
  },
631
759
  "active": {
632
760
  "$value": {
633
- "default": "rgba(174, 24, 0, 0.24)",
634
- "dark": "rgba(236, 89, 65, 0.16)"
761
+ "default": {
762
+ "colorSpace": "srgb",
763
+ "components": [
764
+ 0.6823529411764706,
765
+ 0.09411764705882353,
766
+ 0
767
+ ],
768
+ "alpha": 0.24
769
+ },
770
+ "dark": {
771
+ "colorSpace": "srgb",
772
+ "components": [
773
+ 0.9254901960784314,
774
+ 0.34901960784313724,
775
+ 0.2549019607843137
776
+ ],
777
+ "alpha": 0.16
778
+ }
635
779
  },
636
780
  "$type": "color",
637
781
  "$description": "Used for the background of a danger (destructive) action in the active state.",
@@ -1098,7 +1242,15 @@
1098
1242
  "overlay": {
1099
1243
  "$value": {
1100
1244
  "default": "{color.alpha.dark.24}",
1101
- "dark": "rgba(0,0,0,0.64)"
1245
+ "dark": {
1246
+ "colorSpace": "srgb",
1247
+ "components": [
1248
+ 0,
1249
+ 0,
1250
+ 0
1251
+ ],
1252
+ "alpha": 0.64
1253
+ }
1102
1254
  },
1103
1255
  "$type": "color",
1104
1256
  "$description": "Used for an overlay that covers other content.",