@gitlab/ui 128.0.0 → 128.1.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 (40) hide show
  1. package/dist/components/base/form/form_checkbox/form_checkbox.js +0 -3
  2. package/dist/components/base/form/form_checkbox/form_checkbox_group.js +132 -3
  3. package/dist/index.css +1 -1
  4. package/dist/index.css.map +1 -1
  5. package/dist/tailwind.css +1 -1
  6. package/dist/tailwind.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 +1 -1
  12. package/src/tokens/build/css/tokens.css +24 -24
  13. package/src/tokens/build/css/tokens.dark.css +26 -26
  14. package/src/tokens/build/docs/tokens-tailwind-docs.dark.json +82 -82
  15. package/src/tokens/build/docs/tokens-tailwind-docs.json +81 -81
  16. package/src/tokens/build/figma/constants.tokens.json +2245 -226
  17. package/src/tokens/build/figma/contextual.tokens.json +753 -77
  18. package/src/tokens/build/figma/deprecated.tokens.json +4151 -420
  19. package/src/tokens/build/figma/semantic.tokens.json +171 -19
  20. package/src/tokens/build/js/tokens.dark.js +130 -127
  21. package/src/tokens/build/js/tokens.js +113 -110
  22. package/src/tokens/build/json/tokens.dark.json +161 -161
  23. package/src/tokens/build/json/tokens.json +142 -142
  24. package/src/tokens/build/scss/_tokens.dark.scss +26 -26
  25. package/src/tokens/build/scss/_tokens.scss +24 -24
  26. package/src/tokens/constant/color.alpha.tokens.json +135 -15
  27. package/src/tokens/constant/color.tokens.json +2110 -211
  28. package/src/tokens/contextual/avatar.tokens.json +54 -6
  29. package/src/tokens/contextual/button.tokens.json +90 -10
  30. package/src/tokens/contextual/chart.tokens.json +9 -1
  31. package/src/tokens/contextual/illustration.tokens.json +600 -60
  32. package/src/tokens/deprecated/deprecated.color.data_viz.tokens.json +1100 -110
  33. package/src/tokens/deprecated/deprecated.color.theme.tokens.json +1440 -144
  34. package/src/tokens/deprecated/deprecated.color.tokens.json +1490 -149
  35. package/src/tokens/deprecated/deprecated.color.transparency.tokens.json +147 -43
  36. package/src/tokens/semantic/action.tokens.json +162 -18
  37. package/src/tokens/semantic/background.tokens.json +9 -1
  38. package/dist/vendor/bootstrap-vue/src/components/form-checkbox/form-checkbox-group.js +0 -37
  39. package/dist/vendor/bootstrap-vue/src/components/form-checkbox/form-checkbox.js +0 -134
  40. package/dist/vendor/bootstrap-vue/src/components/form-checkbox/index.js +0 -2
package/src/tokens/build/css/tokens.dark.css CHANGED
@@ -4,14 +4,14 @@
4
4
 
5
5
  :root.gl-dark, .gl-dark-scope {
6
6
  --gl-border-radius-full: 9999px;
7
- --gl-color-alpha-0: transparent;
8
- --gl-color-alpha-dark-2: rgba(05, 05, 06, 0.02);
9
- --gl-color-alpha-dark-4: rgba(05, 05, 06, 0.04);
10
- --gl-color-alpha-dark-6: rgba(05, 05, 06, 0.06);
11
- --gl-color-alpha-dark-8: rgba(05, 05, 06, 0.08);
12
- --gl-color-alpha-dark-16: rgba(05, 05, 06, 0.16);
13
- --gl-color-alpha-dark-24: rgba(05, 05, 06, 0.24);
14
- --gl-color-alpha-dark-40: rgba(05, 05, 06, 0.4);
7
+ --gl-color-alpha-0: rgba(0, 0, 0, 0);
8
+ --gl-color-alpha-dark-2: rgba(5, 5, 6, 0.02);
9
+ --gl-color-alpha-dark-4: rgba(5, 5, 6, 0.04);
10
+ --gl-color-alpha-dark-6: rgba(5, 5, 6, 0.06);
11
+ --gl-color-alpha-dark-8: rgba(5, 5, 6, 0.08);
12
+ --gl-color-alpha-dark-16: rgba(5, 5, 6, 0.16);
13
+ --gl-color-alpha-dark-24: rgba(5, 5, 6, 0.24);
14
+ --gl-color-alpha-dark-40: rgba(5, 5, 6, 0.4);
15
15
  --gl-color-alpha-light-2: rgba(255, 255, 255, 0.02);
16
16
  --gl-color-alpha-light-4: rgba(255, 255, 255, 0.04);
17
17
  --gl-color-alpha-light-6: rgba(255, 255, 255, 0.06);
@@ -316,23 +316,23 @@
316
316
  --gl-zindex-4: 4;
317
317
  --gl-zindex-200: 200;
318
318
  --gl-zindex-9999: 9999;
319
- --gl-avatar-fallback-background-color-red: #fcb5aa3d; /** Red background for avatar fallback with no particular meaning. */
320
- --gl-avatar-fallback-background-color-purple: #cbbbf23d; /** Purple background for avatar fallback with no particular meaning. */
321
- --gl-avatar-fallback-background-color-blue: #9dc7f13d; /** Blue background for avatar fallback with no particular meaning. */
322
- --gl-avatar-fallback-background-color-green: #91d4a83d; /** Green background for avatar fallback with no particular meaning. */
323
- --gl-avatar-fallback-background-color-orange: #e9be743d; /** Orange background for avatar fallback with no particular meaning. */
324
- --gl-avatar-fallback-background-color-neutral: #bfbfc33d; /** Neutral background for avatar fallback with no particular meaning. */
319
+ --gl-avatar-fallback-background-color-red: rgba(252, 181, 170, 0.23921568627450981); /** Red background for avatar fallback with no particular meaning. */
320
+ --gl-avatar-fallback-background-color-purple: rgba(203, 187, 242, 0.23921568627450981); /** Purple background for avatar fallback with no particular meaning. */
321
+ --gl-avatar-fallback-background-color-blue: rgba(157, 199, 241, 0.23921568627450981); /** Blue background for avatar fallback with no particular meaning. */
322
+ --gl-avatar-fallback-background-color-green: rgba(145, 212, 168, 0.23921568627450981); /** Green background for avatar fallback with no particular meaning. */
323
+ --gl-avatar-fallback-background-color-orange: rgba(233, 190, 116, 0.23921568627450981); /** Orange background for avatar fallback with no particular meaning. */
324
+ --gl-avatar-fallback-background-color-neutral: rgba(191, 191, 195, 0.23921568627450981); /** Neutral background for avatar fallback with no particular meaning. */
325
325
  --gl-button-default-primary-background-color-default: rgba(137, 136, 141, 0.4); /** Used for the background of an default primary button in the default state. */
326
326
  --gl-button-default-primary-background-color-hover: rgba(137, 136, 141, 0.64); /** Used for the background of an default primary button in the hover state. */
327
327
  --gl-button-default-primary-background-color-active: rgba(137, 136, 141, 0.32); /** Used for the background of an default primary button in the active state. */
328
328
  --gl-button-confirm-secondary-background-color-default: rgba(66, 143, 220, 0.4); /** Used for the background of an outlined confirm (positive) button in the default state. */
329
329
  --gl-button-confirm-secondary-background-color-hover: rgba(66, 143, 220, 0.64); /** Used for the background of an outlined confirm (positive) button in the hover state. */
330
330
  --gl-button-confirm-secondary-background-color-active: rgba(66, 143, 220, 0.32); /** Used for the background of an outlined confirm (positive) button in the active state. */
331
- --gl-button-danger-secondary-background-color-default: rgba(236, 89, 65, 0.40); /** Used for the background of an outlined danger (destructive) button in the default state. */
331
+ --gl-button-danger-secondary-background-color-default: rgba(236, 89, 65, 0.4); /** Used for the background of an outlined danger (destructive) button in the default state. */
332
332
  --gl-button-danger-secondary-background-color-hover: rgba(236, 89, 65, 0.64); /** Used for the background of an outlined danger (destructive) button in the hover state. */
333
333
  --gl-button-danger-secondary-background-color-active: rgba(236, 89, 65, 0.32); /** Used for the background of an outlined danger (destructive) button in the active state. */
334
334
  --gl-button-disabled-background-color: rgba(137, 136, 141, 0.16); /** Used for the background of a disabled button. */
335
- --gl-chart-threshold-area-color: rgba(221,43,14,0.1); /** Used in charts to delineate a threshold area in a chart. */
335
+ --gl-chart-threshold-area-color: rgba(221, 43, 14, 0.1); /** Used in charts to delineate a threshold area in a chart. */
336
336
  --gl-illustration-stroke-color-default: #e3e3e8; /** Default stroke color to define shape and provide essential detail. */
337
337
  --gl-illustration-stroke-width-default: 1.5; /** Default stroke width to define shape and provide essential detail. */
338
338
  --gl-illustration-fill-color-default: #423f4f; /** Default fill color for an element where specific meaning or emphasis is not required. */
@@ -572,12 +572,12 @@
572
572
  --brand-gray-03: #74717a; /** Use color.brand-gray.03 instead. */
573
573
  --brand-gray-04: #45424d; /** Use color.brand-gray.04 instead. */
574
574
  --brand-gray-05: #2b2838; /** Use color.brand-gray.05 instead. */
575
- --t-gray-a-16: rgba(05, 05, 06, 0.16); /** Use color.alpha.dark.16 instead. */
576
- --t-gray-a-24: rgba(05, 05, 06, 0.24); /** Use color.alpha.dark.24 instead. */
577
- --t-gray-a-02: rgba(05, 05, 06, 0.02); /** Use color.alpha.dark.2 instead. */
578
- --t-gray-a-04: rgba(05, 05, 06, 0.04); /** Use color.alpha.dark.4 instead. */
579
- --t-gray-a-06: rgba(05, 05, 06, 0.06); /** Use color.alpha.dark.6 instead. */
580
- --t-gray-a-08: rgba(05, 05, 06, 0.08); /** Use color.alpha.dark.8 instead. */
575
+ --t-gray-a-16: rgba(5, 5, 6, 0.16); /** Use color.alpha.dark.16 instead. */
576
+ --t-gray-a-24: rgba(5, 5, 6, 0.24); /** Use color.alpha.dark.24 instead. */
577
+ --t-gray-a-02: rgba(5, 5, 6, 0.02); /** Use color.alpha.dark.2 instead. */
578
+ --t-gray-a-04: rgba(5, 5, 6, 0.04); /** Use color.alpha.dark.4 instead. */
579
+ --t-gray-a-06: rgba(5, 5, 6, 0.06); /** Use color.alpha.dark.6 instead. */
580
+ --t-gray-a-08: rgba(5, 5, 6, 0.08); /** Use color.alpha.dark.8 instead. */
581
581
  --t-white-a-16: rgba(255, 255, 255, 0.16); /** Use color.alpha.light.16 instead. */
582
582
  --t-white-a-24: rgba(255, 255, 255, 0.24); /** Use color.alpha.light.24 instead. */
583
583
  --t-white-a-36: rgba(255, 255, 255, 0.36); /** Use color.alpha.light.36 instead. */
@@ -585,16 +585,16 @@
585
585
  --t-white-a-04: rgba(255, 255, 255, 0.04); /** Use color.alpha.light.4 instead. */
586
586
  --t-white-a-06: rgba(255, 255, 255, 0.06); /** Use color.alpha.light.6 instead. */
587
587
  --t-white-a-08: rgba(255, 255, 255, 0.08); /** Use color.alpha.light.8 instead. */
588
- --gl-action-neutral-background-color-default: rgba(137, 136, 141, 0.0); /** Used for the background of a neutral action in the default state. */
588
+ --gl-action-neutral-background-color-default: rgba(137, 136, 141, 0); /** Used for the background of a neutral action in the default state. */
589
589
  --gl-action-neutral-background-color-hover: rgba(137, 136, 141, 0.4); /** Used for the background of a neutral action in the hover state. */
590
590
  --gl-action-neutral-background-color-active: rgba(137, 136, 141, 0.16); /** Used for the background of a neutral action in the active state. */
591
- --gl-action-confirm-background-color-default: rgba(66, 143, 220, 0.0); /** Used for the background of a confirm (positive) action in the default state. */
591
+ --gl-action-confirm-background-color-default: rgba(66, 143, 220, 0); /** Used for the background of a confirm (positive) action in the default state. */
592
592
  --gl-action-confirm-background-color-hover: rgba(66, 143, 220, 0.4); /** Used for the background of a confirm (positive) action in the hover state. */
593
593
  --gl-action-confirm-background-color-active: rgba(66, 143, 220, 0.16); /** Used for the background of a confirm (positive) action in the active state. */
594
- --gl-action-danger-background-color-default: rgba(236, 89, 65, 0.0); /** Used for the background of a danger (destructive) action in the default state. */
594
+ --gl-action-danger-background-color-default: rgba(236, 89, 65, 0); /** Used for the background of a danger (destructive) action in the default state. */
595
595
  --gl-action-danger-background-color-hover: rgba(236, 89, 65, 0.4); /** Used for the background of a danger (destructive) action in the hover state. */
596
596
  --gl-action-danger-background-color-active: rgba(236, 89, 65, 0.16); /** Used for the background of a danger (destructive) action in the active state. */
597
- --gl-background-color-overlay: rgba(0,0,0,0.64); /** Used for an overlay that covers other content. */
597
+ --gl-background-color-overlay: rgba(0, 0, 0, 0.64); /** Used for an overlay that covers other content. */
598
598
  --gl-letter-spacing-heading: -0.01em;
599
599
  --gl-heading-3-letter-spacing: inherit;
600
600
  --gl-heading-4-letter-spacing: inherit;