@gitlab/ui 80.10.0 → 80.12.0

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+# [80.12.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v80.11.0...v80.12.0) (2024-05-20)
+
+
+### Bug Fixes
+
+* **dropdowns:** revert clipping changes ([57973f8](https://gitlab.com/gitlab-org/gitlab-ui/commit/57973f8d76da6c2023b02d9b160e8a9dcbcd27b6))
+
+
+### Features
+
+* **DesignTokens:** add aliases for semantic text design tokens ([24a08b5](https://gitlab.com/gitlab-org/gitlab-ui/commit/24a08b50da6bd3d34fb3f8d24f84436d90d165f6))
+
+# [80.11.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v80.10.0...v80.11.0) (2024-05-17)
+
+
+### Features
+
+* **DesignTokens:** Generate SCSS output with CSS custom property values ([3b92239](https://gitlab.com/gitlab-org/gitlab-ui/commit/3b92239aa7d916d4ee2ed64c7ef3220a5fafea08))
+
 # [80.10.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v80.9.0...v80.10.0) (2024-05-15)
 
 

package/README.md

@@ -162,26 +162,7 @@ You have two options to include those stylesheets:
 ### Design tokens
 
 GitLab UI uses design tokens to maintain a single source of truth that, through automation,
-can be formatted for different uses.
-
-- See [Pajamas](https://design.gitlab.com/product-foundations/design-tokens) for an overview
-on design tokens.
-- See [GitLab Docs](https://docs.gitlab.com/ee/development/fe_guide/design_tokens.html) for
-in-depth guides on creating and using design tokens.
-
-Example design token inheritance and automation:
-
-```mermaid
-flowchart TD
-    A[#1f1e24] -->|Constant token| B[color.neutral.950]
-    B -->|Semantic token| C[text.color.default]
-    C --> D{Automation}
-    D -->|Figma| E[text/color/default]
-    D -->|CSS| F[--gl-text-color-default]
-    D -->|SCSS| G[$gl-text-color-default]
-    D -->|JavaScript| H[GL_TEXT_COLOR_DEFAULT]
-    D -->|Tailwind| I[gl-text-default]
-```
+can be formatted for different uses. Read more on this in the [design tokens documentation](doc/contributing/design_tokens.md).
 
 ## Releases
 

package/dist/components/base/new_dropdowns/base_dropdown/base_dropdown.js

@@ -1,8 +1,8 @@
 import uniqueId from 'lodash/uniqueId';
 import { offset, autoPlacement, shift, size, autoUpdate, computePosition } from '@floating-ui/dom';
 import { buttonCategoryOptions, dropdownVariantOptions, buttonSizeOptions, dropdownPlacements, dropdownAllowedAutoPlacements } from '../../../../utils/constants';
-import { POSITION_ABSOLUTE, POSITION_FIXED, GL_DROPDOWN_HORIZONTAL_BOUNDARY_SELECTOR, GL_DROPDOWN_CONTENTS_CLASS, GL_DROPDOWN_BEFORE_CLOSE, GL_DROPDOWN_SHOWN, GL_DROPDOWN_HIDDEN, ENTER, SPACE, ARROW_DOWN, GL_DROPDOWN_FOCUS_CONTENT } from '../constants';
-import { logWarning, getHorizontalBoundingClientRect, isElementFocusable, isElementTabbable } from '../../../../utils/utils';
+import { POSITION_ABSOLUTE, POSITION_FIXED, GL_DROPDOWN_CONTENTS_CLASS, GL_DROPDOWN_BEFORE_CLOSE, GL_DROPDOWN_SHOWN, GL_DROPDOWN_HIDDEN, ENTER, SPACE, ARROW_DOWN, GL_DROPDOWN_FOCUS_CONTENT } from '../constants';
+import { logWarning, isElementFocusable, isElementTabbable } from '../../../../utils/utils';
 import GlButton from '../../button/button';
 import GlIcon from '../../icon/icon';
 import { OutsideDirective } from '../../../../directives/outside/outside';
@@ -250,13 +250,9 @@ var script = {
       return {
         placement,
         strategy: this.positioningStrategy,
-        middleware: [offset(this.offset), autoPlacement(() => {
-          const autoHorizontalBoundary = getHorizontalBoundingClientRect(this.$el.closest(GL_DROPDOWN_HORIZONTAL_BOUNDARY_SELECTOR));
-          return {
-            alignment,
-            boundary: autoHorizontalBoundary || 'clippingAncestors',
-            allowedPlacements: dropdownAllowedAutoPlacements[this.placement]
-          };
+        middleware: [offset(this.offset), autoPlacement({
+          alignment,
+          allowedPlacements: dropdownAllowedAutoPlacements[this.placement]
         }), shift(), size({
           apply: _ref => {
             var _this$nonScrollableCo;

package/dist/components/base/new_dropdowns/constants.js

@@ -1,5 +1,4 @@
 // base dropdown events
-const GL_DROPDOWN_HORIZONTAL_BOUNDARY_SELECTOR = 'main';
 const GL_DROPDOWN_SHOWN = 'shown';
 const GL_DROPDOWN_HIDDEN = 'hidden';
 const GL_DROPDOWN_BEFORE_CLOSE = 'beforeClose';
@@ -19,4 +18,4 @@ const POSITION_ABSOLUTE = 'absolute';
 const POSITION_FIXED = 'fixed';
 const GL_DROPDOWN_CONTENTS_CLASS = 'gl-new-dropdown-contents';
 
-export { ARROW_DOWN, ARROW_UP, END, ENTER, GL_DROPDOWN_BEFORE_CLOSE, GL_DROPDOWN_CONTENTS_CLASS, GL_DROPDOWN_FOCUS_CONTENT, GL_DROPDOWN_HIDDEN, GL_DROPDOWN_HORIZONTAL_BOUNDARY_SELECTOR, GL_DROPDOWN_SHOWN, HOME, POSITION_ABSOLUTE, POSITION_FIXED, SPACE };
+export { ARROW_DOWN, ARROW_UP, END, ENTER, GL_DROPDOWN_BEFORE_CLOSE, GL_DROPDOWN_CONTENTS_CLASS, GL_DROPDOWN_FOCUS_CONTENT, GL_DROPDOWN_HIDDEN, GL_DROPDOWN_SHOWN, HOME, POSITION_ABSOLUTE, POSITION_FIXED, SPACE };

package/dist/components/charts/discrete_scatter/discrete_scatter.js

@@ -1,5 +1,5 @@
 import merge from 'lodash/merge';
-import { GRAY_200 } from '../../../../dist/tokens/js/tokens';
+import { GRAY_200 } from '../../../tokens/build/js/tokens';
 import { defaultChartOptions, dataZoomAdjustments, mergeSeriesToOptions } from '../../../utils/charts/config';
 import { colorFromDefaultPalette } from '../../../utils/charts/theme';
 import { HEIGHT_AUTO_CLASSES } from '../../../utils/charts/constants';

package/dist/components/charts/heatmap/heatmap.js

@@ -1,5 +1,5 @@
 import merge from 'lodash/merge';
-import { GRAY_100, WHITE } from '../../../../dist/tokens/js/tokens';
+import { GRAY_100, WHITE } from '../../../tokens/build/js/tokens';
 import { getTooltipTitle, getTooltipContent } from '../../../utils/charts/config';
 import { HEIGHT_AUTO_CLASSES } from '../../../utils/charts/constants';
 import { heatmapHues } from '../../../utils/charts/theme';

package/dist/components/charts/legend/legend.js

@@ -1,5 +1,5 @@
 import * as echarts from 'echarts';
-import { GRAY_200 } from '../../../../dist/tokens/js/tokens';
+import { GRAY_200 } from '../../../tokens/build/js/tokens';
 import { defaultFontSize } from '../../../utils/charts/config';
 import { LEGEND_AVERAGE_TEXT, LEGEND_CURRENT_TEXT, LEGEND_MIN_TEXT, LEGEND_MAX_TEXT, LEGEND_LAYOUT_INLINE, LEGEND_LAYOUT_TABLE } from '../../../utils/charts/constants';
 import { engineeringNotation, average } from '../../../utils/number_utils';

package/dist/components/charts/line/line.js

@@ -1,5 +1,5 @@
 import merge from 'lodash/merge';
-import { GRAY_200 } from '../../../../dist/tokens/js/tokens';
+import { GRAY_200 } from '../../../tokens/build/js/tokens';
 import { symbolSize, lineStyle, getThresholdConfig, generateAnnotationSeries, defaultChartOptions, dataZoomAdjustments, mergeSeriesToOptions, mergeAnnotationAxisToOptions, grid } from '../../../utils/charts/config';
 import { LEGEND_AVERAGE_TEXT, LEGEND_MAX_TEXT, LEGEND_MIN_TEXT, LEGEND_CURRENT_TEXT, LEGEND_LAYOUT_INLINE, LEGEND_LAYOUT_TABLE, HEIGHT_AUTO_CLASSES } from '../../../utils/charts/constants';
 import { colorFromDefaultPalette } from '../../../utils/charts/theme';

package/dist/tailwind.css

@@ -1,2 +1,2 @@
-.gl-fixed{position:fixed}.\!gl-absolute{position:absolute!important}.gl-absolute{position:absolute}.gl-relative{position:relative}.gl-bottom-0{bottom:0}.gl-bottom-2{bottom:.25rem}.gl-left-0{left:0}.gl-right-2{right:.25rem}.gl-float-right{float:right}.gl-text-blue-100{color:var(--blue-100,#cbe2f9)}.gl-text-blue-500{color:var(--blue-500,#1f75cb)}.gl-text-blue-900{color:var(--blue-900,#033464)}.gl-text-danger{color:var(--gl-text-color-danger,#c91c00)}.gl-text-gray-400{color:var(--gray-400,#89888d)}.gl-text-gray-500{color:var(--gray-500,#737278)}.gl-text-gray-600{color:var(--gray-600,#626168)}.gl-text-gray-700{color:var(--gray-700,#535158)}.gl-text-gray-900{color:var(--gray-900,#333238)}.gl-text-gray-950{color:var(--gray-950,#1f1e24)}.gl-text-green-500{color:var(--green-500,#108548)}.gl-text-green-600{color:var(--green-600,#217645)}.gl-text-orange-500{color:var(--orange-500,#ab6100)}.gl-text-red-300{color:var(--red-300,#f57f6c)}.gl-text-red-500{color:var(--red-500,#dd2b0e)}.gl-text-red-600{color:var(--red-600,#c91c00)}.gl-text-secondary{color:var(--gl-text-secondary,#737278)}.gl-text-strong{color:var(--gl-text-color-strong,#1f1e24)}.gl-text-subtle{color:var(--gl-text-color-subtle,#626168)}.gl-text-white{color:var(--white,#fff)}
+.gl-fixed{position:fixed}.\!gl-absolute{position:absolute!important}.gl-absolute{position:absolute}.gl-relative{position:relative}.gl-bottom-0{bottom:0}.gl-bottom-2{bottom:.25rem}.gl-left-0{left:0}.gl-right-2{right:.25rem}.gl-float-right{float:right}.gl-text-blue-100{color:var(--blue-100,#cbe2f9)}.gl-text-blue-500{color:var(--blue-500,#1f75cb)}.gl-text-blue-900{color:var(--blue-900,#033464)}.gl-text-danger{color:var(--gl-text-color-danger,var(--gl-color-red-600,#c91c00))}.gl-text-gray-400{color:var(--gray-400,#89888d)}.gl-text-gray-500{color:var(--gray-500,#737278)}.gl-text-gray-600{color:var(--gray-600,#626168)}.gl-text-gray-700{color:var(--gray-700,#535158)}.gl-text-gray-900{color:var(--gray-900,#333238)}.gl-text-gray-950{color:var(--gray-950,#1f1e24)}.gl-text-green-500{color:var(--green-500,#108548)}.gl-text-green-600{color:var(--green-600,#217645)}.gl-text-orange-500{color:var(--orange-500,#ab6100)}.gl-text-red-300{color:var(--red-300,#f57f6c)}.gl-text-red-500{color:var(--red-500,#dd2b0e)}.gl-text-red-600{color:var(--red-600,#c91c00)}.gl-text-secondary{color:var(--gl-text-secondary,#737278)}.gl-text-strong{color:var(--gl-text-color-strong,var(--gl-color-neutral-950,#1f1e24))}.gl-text-subtle{color:var(--gl-text-color-subtle,var(--gl-color-neutral-600,#626168))}.gl-text-white{color:var(--white,#fff)}
 /*# sourceMappingURL=tailwind.css.map */

package/dist/tailwind.css.map

@@ -1 +1 @@
-{"version":3,"sources":["tailwind.css"],"names":[],"mappings":"AAAA,UAAA,cAAmB,CAAnB,eAAA,2BAAmB,CAAnB,aAAA,iBAAmB,CAAnB,aAAA,iBAAmB,CAAnB,aAAA,QAAmB,CAAnB,aAAA,aAAmB,CAAnB,WAAA,MAAmB,CAAnB,YAAA,YAAmB,CAAnB,gBAAA,WAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,gBAAA,yCAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,mBAAA,8BAAmB,CAAnB,mBAAA,8BAAmB,CAAnB,oBAAA,+BAAmB,CAAnB,iBAAA,4BAAmB,CAAnB,iBAAA,4BAAmB,CAAnB,iBAAA,4BAAmB,CAAnB,mBAAA,sCAAmB,CAAnB,gBAAA,yCAAmB,CAAnB,gBAAA,yCAAmB,CAAnB,eAAA,uBAAmB","file":"tailwind.css","sourcesContent":["@tailwind utilities;\n"]}
+{"version":3,"sources":["tailwind.css"],"names":[],"mappings":"AAAA,UAAA,cAAmB,CAAnB,eAAA,2BAAmB,CAAnB,aAAA,iBAAmB,CAAnB,aAAA,iBAAmB,CAAnB,aAAA,QAAmB,CAAnB,aAAA,aAAmB,CAAnB,WAAA,MAAmB,CAAnB,YAAA,YAAmB,CAAnB,gBAAA,WAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,gBAAA,iEAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,kBAAA,6BAAmB,CAAnB,mBAAA,8BAAmB,CAAnB,mBAAA,8BAAmB,CAAnB,oBAAA,+BAAmB,CAAnB,iBAAA,4BAAmB,CAAnB,iBAAA,4BAAmB,CAAnB,iBAAA,4BAAmB,CAAnB,mBAAA,sCAAmB,CAAnB,gBAAA,qEAAmB,CAAnB,gBAAA,qEAAmB,CAAnB,eAAA,uBAAmB","file":"tailwind.css","sourcesContent":["@tailwind utilities;\n"]}

package/dist/tokens/build/js/tokens.dark.js

@@ -3,6 +3,75 @@
  * Do not edit directly
  */
 
+const GL_COLOR_BLUE_50 = '#e9f3fc';
+const GL_COLOR_BLUE_100 = '#cbe2f9';
+const GL_COLOR_BLUE_200 = '#9dc7f1';
+const GL_COLOR_BLUE_300 = '#63a6e9';
+const GL_COLOR_BLUE_400 = '#428fdc';
+const GL_COLOR_BLUE_500 = '#1f75cb';
+const GL_COLOR_BLUE_600 = '#1068bf';
+const GL_COLOR_BLUE_700 = '#0b5cad';
+const GL_COLOR_BLUE_800 = '#064787';
+const GL_COLOR_BLUE_900 = '#033464';
+const GL_COLOR_BLUE_950 = '#002850';
+const GL_COLOR_NEUTRAL_0 = '#fff';
+const GL_COLOR_NEUTRAL_10 = '#fbfafd';
+const GL_COLOR_NEUTRAL_50 = '#ececef';
+const GL_COLOR_NEUTRAL_100 = '#dcdcde';
+const GL_COLOR_NEUTRAL_200 = '#bfbfc3';
+const GL_COLOR_NEUTRAL_300 = '#a4a3a8';
+const GL_COLOR_NEUTRAL_400 = '#89888d';
+const GL_COLOR_NEUTRAL_500 = '#737278';
+const GL_COLOR_NEUTRAL_600 = '#626168';
+const GL_COLOR_NEUTRAL_700 = '#535158';
+const GL_COLOR_NEUTRAL_800 = '#434248';
+const GL_COLOR_NEUTRAL_900 = '#333238';
+const GL_COLOR_NEUTRAL_950 = '#1f1e24';
+const GL_COLOR_NEUTRAL_1000 = '#000';
+const GL_COLOR_GREEN_50 = '#ecf4ee';
+const GL_COLOR_GREEN_100 = '#c3e6cd';
+const GL_COLOR_GREEN_200 = '#91d4a8';
+const GL_COLOR_GREEN_300 = '#52b87a';
+const GL_COLOR_GREEN_400 = '#2da160';
+const GL_COLOR_GREEN_500 = '#108548';
+const GL_COLOR_GREEN_600 = '#217645';
+const GL_COLOR_GREEN_700 = '#24663b';
+const GL_COLOR_GREEN_800 = '#0d532a';
+const GL_COLOR_GREEN_900 = '#0a4020';
+const GL_COLOR_GREEN_950 = '#072b15';
+const GL_COLOR_ORANGE_50 = '#fdf1dd';
+const GL_COLOR_ORANGE_100 = '#f5d9a8';
+const GL_COLOR_ORANGE_200 = '#e9be74';
+const GL_COLOR_ORANGE_300 = '#d99530';
+const GL_COLOR_ORANGE_400 = '#c17d10';
+const GL_COLOR_ORANGE_500 = '#ab6100';
+const GL_COLOR_ORANGE_600 = '#9e5400';
+const GL_COLOR_ORANGE_700 = '#8f4700';
+const GL_COLOR_ORANGE_800 = '#703800';
+const GL_COLOR_ORANGE_900 = '#5c2900';
+const GL_COLOR_ORANGE_950 = '#421f00';
+const GL_COLOR_PURPLE_50 = '#f4f0ff';
+const GL_COLOR_PURPLE_100 = '#e1d8f9';
+const GL_COLOR_PURPLE_200 = '#cbbbf2';
+const GL_COLOR_PURPLE_300 = '#ac93e6';
+const GL_COLOR_PURPLE_400 = '#9475db';
+const GL_COLOR_PURPLE_500 = '#7b58cf';
+const GL_COLOR_PURPLE_600 = '#694cc0';
+const GL_COLOR_PURPLE_700 = '#5943b6';
+const GL_COLOR_PURPLE_800 = '#453894';
+const GL_COLOR_PURPLE_900 = '#2f2a6b';
+const GL_COLOR_PURPLE_950 = '#232150';
+const GL_COLOR_RED_50 = '#fcf1ef';
+const GL_COLOR_RED_100 = '#fdd4cd';
+const GL_COLOR_RED_200 = '#fcb5aa';
+const GL_COLOR_RED_300 = '#f57f6c';
+const GL_COLOR_RED_400 = '#ec5941';
+const GL_COLOR_RED_500 = '#dd2b0e';
+const GL_COLOR_RED_600 = '#c91c00';
+const GL_COLOR_RED_700 = '#ae1800';
+const GL_COLOR_RED_800 = '#8d1300';
+const GL_COLOR_RED_900 = '#660e00';
+const GL_COLOR_RED_950 = '#4d0a00';
 const DATA_VIZ_GREEN_50 = '#133a03';
 const DATA_VIZ_GREEN_100 = '#1a4500';
 const DATA_VIZ_GREEN_200 = '#275600';
@@ -199,6 +268,40 @@ const RED_700 = '#fcb5aa';
 const RED_800 = '#fdd4cd';
 const RED_900 = '#fcf1ef';
 const RED_950 = '#fff4f3';
+const BRAND_CHARCOAL = '#171321';
+const BRAND_ORANGE_01 = '#fca326';
+const BRAND_ORANGE_02 = '#fc6d26';
+const BRAND_ORANGE_03 = '#e24329';
+const BRAND_PURPLE_01 = '#a989f5';
+const BRAND_PURPLE_02 = '#7759c2';
+const BRAND_GRAY_01 = '#d1d0d3';
+const BRAND_GRAY_02 = '#a2a1a6';
+const BRAND_GRAY_03 = '#74717a';
+const BRAND_GRAY_04 = '#45424d';
+const BRAND_GRAY_05 = '#2b2838';
+const T_GRAY_A_16 = 'rgba(31, 30, 36, 0.16)';
+const T_GRAY_A_24 = 'rgba(31, 30, 36, 0.24)';
+const T_GRAY_A_02 = 'rgba(31, 30, 36, 0.02)';
+const T_GRAY_A_04 = 'rgba(31, 30, 36, 0.04)';
+const T_GRAY_A_06 = 'rgba(31, 30, 36, 0.06)';
+const T_GRAY_A_08 = 'rgba(31, 30, 36, 0.08)';
+const T_WHITE_A_16 = 'rgba(255, 255, 255, 0.16)';
+const T_WHITE_A_24 = 'rgba(255, 255, 255, 0.24)';
+const T_WHITE_A_36 = 'rgba(255, 255, 255, 0.36)';
+const T_WHITE_A_02 = 'rgba(255, 255, 255, 0.02)';
+const T_WHITE_A_04 = 'rgba(255, 255, 255, 0.04)';
+const T_WHITE_A_06 = 'rgba(255, 255, 255, 0.06)';
+const T_WHITE_A_08 = 'rgba(255, 255, 255, 0.08)';
+const GL_LINE_HEIGHT_12 = '0.75rem';
+const GL_LINE_HEIGHT_16 = '1rem';
+const GL_LINE_HEIGHT_20 = '1.25rem';
+const GL_LINE_HEIGHT_24 = '1.5rem';
+const GL_LINE_HEIGHT_28 = '1.75rem';
+const GL_LINE_HEIGHT_32 = '2rem';
+const GL_LINE_HEIGHT_36 = '2.25rem';
+const GL_LINE_HEIGHT_42 = '2.625rem';
+const GL_LINE_HEIGHT_44 = '2.75rem';
+const GL_LINE_HEIGHT_52 = '3.25rem';
 const GL_TEXT_PRIMARY = '#ececef'; // Use text.color.default instead
 const GL_TEXT_SECONDARY = '#89888d'; // Use text.color.subtle instead
 const GL_TEXT_TERTIARY = '#737278'; // Use text.color.disabled instead
@@ -207,6 +310,8 @@ const GL_TEXT_COLOR_SUBTLE = '#bfbfc3'; // Used for supplemental text that doesn
 const GL_TEXT_COLOR_STRONG = '#fff'; // Used for text with the highest contrast.
 const GL_TEXT_COLOR_HEADING = '#fff'; // Used for headings level 1-6.
 const GL_TEXT_COLOR_LINK = '#63a6e9'; // Used for default text links.
+const GL_TEXT_COLOR_DANGER = '#f57f6c'; // Used for text indicating a problem, critical state, destructive action, error, failure, removal, stop, or declination.
+const GL_TEXT_COLOR_SUCCESS = '#52b87a'; // Used for text indicating success or validity.
 const GL_TEXT_COLOR_DISABLED = '#89888d'; // Used for disabled text.
 
-export { BLACK, BLUE_100, BLUE_200, BLUE_300, BLUE_400, BLUE_50, BLUE_500, BLUE_600, BLUE_700, BLUE_800, BLUE_900, BLUE_950, DATA_VIZ_AQUA_100, DATA_VIZ_AQUA_200, DATA_VIZ_AQUA_300, DATA_VIZ_AQUA_400, DATA_VIZ_AQUA_50, DATA_VIZ_AQUA_500, DATA_VIZ_AQUA_600, DATA_VIZ_AQUA_700, DATA_VIZ_AQUA_800, DATA_VIZ_AQUA_900, DATA_VIZ_AQUA_950, DATA_VIZ_BLUE_100, DATA_VIZ_BLUE_200, DATA_VIZ_BLUE_300, DATA_VIZ_BLUE_400, DATA_VIZ_BLUE_50, DATA_VIZ_BLUE_500, DATA_VIZ_BLUE_600, DATA_VIZ_BLUE_700, DATA_VIZ_BLUE_800, DATA_VIZ_BLUE_900, DATA_VIZ_BLUE_950, DATA_VIZ_GREEN_100, DATA_VIZ_GREEN_200, DATA_VIZ_GREEN_300, DATA_VIZ_GREEN_400, DATA_VIZ_GREEN_50, DATA_VIZ_GREEN_500, DATA_VIZ_GREEN_600, DATA_VIZ_GREEN_700, DATA_VIZ_GREEN_800, DATA_VIZ_GREEN_900, DATA_VIZ_GREEN_950, DATA_VIZ_MAGENTA_100, DATA_VIZ_MAGENTA_200, DATA_VIZ_MAGENTA_300, DATA_VIZ_MAGENTA_400, DATA_VIZ_MAGENTA_50, DATA_VIZ_MAGENTA_500, DATA_VIZ_MAGENTA_600, DATA_VIZ_MAGENTA_700, DATA_VIZ_MAGENTA_800, DATA_VIZ_MAGENTA_900, DATA_VIZ_MAGENTA_950, DATA_VIZ_ORANGE_100, DATA_VIZ_ORANGE_200, DATA_VIZ_ORANGE_300, DATA_VIZ_ORANGE_400, DATA_VIZ_ORANGE_50, DATA_VIZ_ORANGE_500, DATA_VIZ_ORANGE_600, DATA_VIZ_ORANGE_700, DATA_VIZ_ORANGE_800, DATA_VIZ_ORANGE_900, DATA_VIZ_ORANGE_950, GL_TEXT_COLOR_DEFAULT, GL_TEXT_COLOR_DISABLED, GL_TEXT_COLOR_HEADING, GL_TEXT_COLOR_LINK, GL_TEXT_COLOR_STRONG, GL_TEXT_COLOR_SUBTLE, GL_TEXT_PRIMARY, GL_TEXT_SECONDARY, GL_TEXT_TERTIARY, GRAY_10, GRAY_100, GRAY_200, GRAY_300, GRAY_400, GRAY_50, GRAY_500, GRAY_600, GRAY_700, GRAY_800, GRAY_900, GRAY_950, GREEN_100, GREEN_200, GREEN_300, GREEN_400, GREEN_50, GREEN_500, GREEN_600, GREEN_700, GREEN_800, GREEN_900, GREEN_950, ORANGE_100, ORANGE_200, ORANGE_300, ORANGE_400, ORANGE_50, ORANGE_500, ORANGE_600, ORANGE_700, ORANGE_800, ORANGE_900, ORANGE_950, PURPLE_100, PURPLE_200, PURPLE_300, PURPLE_400, PURPLE_50, PURPLE_500, PURPLE_600, PURPLE_700, PURPLE_800, PURPLE_900, PURPLE_950, RED_100, RED_200, RED_300, RED_400, RED_50, RED_500, RED_600, RED_700, RED_800, RED_900, RED_950, THEME_BLUE_10, THEME_BLUE_100, THEME_BLUE_200, THEME_BLUE_300, THEME_BLUE_400, THEME_BLUE_50, THEME_BLUE_500, THEME_BLUE_600, THEME_BLUE_700, THEME_BLUE_800, THEME_BLUE_900, THEME_BLUE_950, THEME_GREEN_10, THEME_GREEN_100, THEME_GREEN_200, THEME_GREEN_300, THEME_GREEN_400, THEME_GREEN_50, THEME_GREEN_500, THEME_GREEN_600, THEME_GREEN_700, THEME_GREEN_800, THEME_GREEN_900, THEME_GREEN_950, THEME_INDIGO_10, THEME_INDIGO_100, THEME_INDIGO_200, THEME_INDIGO_300, THEME_INDIGO_400, THEME_INDIGO_50, THEME_INDIGO_500, THEME_INDIGO_600, THEME_INDIGO_700, THEME_INDIGO_800, THEME_INDIGO_900, THEME_INDIGO_950, THEME_LIGHT_BLUE_10, THEME_LIGHT_BLUE_100, THEME_LIGHT_BLUE_200, THEME_LIGHT_BLUE_300, THEME_LIGHT_BLUE_400, THEME_LIGHT_BLUE_50, THEME_LIGHT_BLUE_500, THEME_LIGHT_BLUE_600, THEME_LIGHT_BLUE_700, THEME_LIGHT_BLUE_800, THEME_LIGHT_BLUE_900, THEME_LIGHT_BLUE_950, THEME_LIGHT_RED_10, THEME_LIGHT_RED_100, THEME_LIGHT_RED_200, THEME_LIGHT_RED_300, THEME_LIGHT_RED_400, THEME_LIGHT_RED_50, THEME_LIGHT_RED_500, THEME_LIGHT_RED_600, THEME_LIGHT_RED_700, THEME_LIGHT_RED_800, THEME_LIGHT_RED_900, THEME_LIGHT_RED_950, THEME_RED_10, THEME_RED_100, THEME_RED_200, THEME_RED_300, THEME_RED_400, THEME_RED_50, THEME_RED_500, THEME_RED_600, THEME_RED_700, THEME_RED_800, THEME_RED_900, THEME_RED_950, WHITE };
+export { BLACK, BLUE_100, BLUE_200, BLUE_300, BLUE_400, BLUE_50, BLUE_500, BLUE_600, BLUE_700, BLUE_800, BLUE_900, BLUE_950, BRAND_CHARCOAL, BRAND_GRAY_01, BRAND_GRAY_02, BRAND_GRAY_03, BRAND_GRAY_04, BRAND_GRAY_05, BRAND_ORANGE_01, BRAND_ORANGE_02, BRAND_ORANGE_03, BRAND_PURPLE_01, BRAND_PURPLE_02, DATA_VIZ_AQUA_100, DATA_VIZ_AQUA_200, DATA_VIZ_AQUA_300, DATA_VIZ_AQUA_400, DATA_VIZ_AQUA_50, DATA_VIZ_AQUA_500, DATA_VIZ_AQUA_600, DATA_VIZ_AQUA_700, DATA_VIZ_AQUA_800, DATA_VIZ_AQUA_900, DATA_VIZ_AQUA_950, DATA_VIZ_BLUE_100, DATA_VIZ_BLUE_200, DATA_VIZ_BLUE_300, DATA_VIZ_BLUE_400, DATA_VIZ_BLUE_50, DATA_VIZ_BLUE_500, DATA_VIZ_BLUE_600, DATA_VIZ_BLUE_700, DATA_VIZ_BLUE_800, DATA_VIZ_BLUE_900, DATA_VIZ_BLUE_950, DATA_VIZ_GREEN_100, DATA_VIZ_GREEN_200, DATA_VIZ_GREEN_300, DATA_VIZ_GREEN_400, DATA_VIZ_GREEN_50, DATA_VIZ_GREEN_500, DATA_VIZ_GREEN_600, DATA_VIZ_GREEN_700, DATA_VIZ_GREEN_800, DATA_VIZ_GREEN_900, DATA_VIZ_GREEN_950, DATA_VIZ_MAGENTA_100, DATA_VIZ_MAGENTA_200, DATA_VIZ_MAGENTA_300, DATA_VIZ_MAGENTA_400, DATA_VIZ_MAGENTA_50, DATA_VIZ_MAGENTA_500, DATA_VIZ_MAGENTA_600, DATA_VIZ_MAGENTA_700, DATA_VIZ_MAGENTA_800, DATA_VIZ_MAGENTA_900, DATA_VIZ_MAGENTA_950, DATA_VIZ_ORANGE_100, DATA_VIZ_ORANGE_200, DATA_VIZ_ORANGE_300, DATA_VIZ_ORANGE_400, DATA_VIZ_ORANGE_50, DATA_VIZ_ORANGE_500, DATA_VIZ_ORANGE_600, DATA_VIZ_ORANGE_700, DATA_VIZ_ORANGE_800, DATA_VIZ_ORANGE_900, DATA_VIZ_ORANGE_950, GL_COLOR_BLUE_100, GL_COLOR_BLUE_200, GL_COLOR_BLUE_300, GL_COLOR_BLUE_400, GL_COLOR_BLUE_50, GL_COLOR_BLUE_500, GL_COLOR_BLUE_600, GL_COLOR_BLUE_700, GL_COLOR_BLUE_800, GL_COLOR_BLUE_900, GL_COLOR_BLUE_950, GL_COLOR_GREEN_100, GL_COLOR_GREEN_200, GL_COLOR_GREEN_300, GL_COLOR_GREEN_400, GL_COLOR_GREEN_50, GL_COLOR_GREEN_500, GL_COLOR_GREEN_600, GL_COLOR_GREEN_700, GL_COLOR_GREEN_800, GL_COLOR_GREEN_900, GL_COLOR_GREEN_950, GL_COLOR_NEUTRAL_0, GL_COLOR_NEUTRAL_10, GL_COLOR_NEUTRAL_100, GL_COLOR_NEUTRAL_1000, GL_COLOR_NEUTRAL_200, GL_COLOR_NEUTRAL_300, GL_COLOR_NEUTRAL_400, GL_COLOR_NEUTRAL_50, GL_COLOR_NEUTRAL_500, GL_COLOR_NEUTRAL_600, GL_COLOR_NEUTRAL_700, GL_COLOR_NEUTRAL_800, GL_COLOR_NEUTRAL_900, GL_COLOR_NEUTRAL_950, GL_COLOR_ORANGE_100, GL_COLOR_ORANGE_200, GL_COLOR_ORANGE_300, GL_COLOR_ORANGE_400, GL_COLOR_ORANGE_50, GL_COLOR_ORANGE_500, GL_COLOR_ORANGE_600, GL_COLOR_ORANGE_700, GL_COLOR_ORANGE_800, GL_COLOR_ORANGE_900, GL_COLOR_ORANGE_950, GL_COLOR_PURPLE_100, GL_COLOR_PURPLE_200, GL_COLOR_PURPLE_300, GL_COLOR_PURPLE_400, GL_COLOR_PURPLE_50, GL_COLOR_PURPLE_500, GL_COLOR_PURPLE_600, GL_COLOR_PURPLE_700, GL_COLOR_PURPLE_800, GL_COLOR_PURPLE_900, GL_COLOR_PURPLE_950, GL_COLOR_RED_100, GL_COLOR_RED_200, GL_COLOR_RED_300, GL_COLOR_RED_400, GL_COLOR_RED_50, GL_COLOR_RED_500, GL_COLOR_RED_600, GL_COLOR_RED_700, GL_COLOR_RED_800, GL_COLOR_RED_900, GL_COLOR_RED_950, GL_LINE_HEIGHT_12, GL_LINE_HEIGHT_16, GL_LINE_HEIGHT_20, GL_LINE_HEIGHT_24, GL_LINE_HEIGHT_28, GL_LINE_HEIGHT_32, GL_LINE_HEIGHT_36, GL_LINE_HEIGHT_42, GL_LINE_HEIGHT_44, GL_LINE_HEIGHT_52, GL_TEXT_COLOR_DANGER, GL_TEXT_COLOR_DEFAULT, GL_TEXT_COLOR_DISABLED, GL_TEXT_COLOR_HEADING, GL_TEXT_COLOR_LINK, GL_TEXT_COLOR_STRONG, GL_TEXT_COLOR_SUBTLE, GL_TEXT_COLOR_SUCCESS, GL_TEXT_PRIMARY, GL_TEXT_SECONDARY, GL_TEXT_TERTIARY, GRAY_10, GRAY_100, GRAY_200, GRAY_300, GRAY_400, GRAY_50, GRAY_500, GRAY_600, GRAY_700, GRAY_800, GRAY_900, GRAY_950, GREEN_100, GREEN_200, GREEN_300, GREEN_400, GREEN_50, GREEN_500, GREEN_600, GREEN_700, GREEN_800, GREEN_900, GREEN_950, ORANGE_100, ORANGE_200, ORANGE_300, ORANGE_400, ORANGE_50, ORANGE_500, ORANGE_600, ORANGE_700, ORANGE_800, ORANGE_900, ORANGE_950, PURPLE_100, PURPLE_200, PURPLE_300, PURPLE_400, PURPLE_50, PURPLE_500, PURPLE_600, PURPLE_700, PURPLE_800, PURPLE_900, PURPLE_950, RED_100, RED_200, RED_300, RED_400, RED_50, RED_500, RED_600, RED_700, RED_800, RED_900, RED_950, THEME_BLUE_10, THEME_BLUE_100, THEME_BLUE_200, THEME_BLUE_300, THEME_BLUE_400, THEME_BLUE_50, THEME_BLUE_500, THEME_BLUE_600, THEME_BLUE_700, THEME_BLUE_800, THEME_BLUE_900, THEME_BLUE_950, THEME_GREEN_10, THEME_GREEN_100, THEME_GREEN_200, THEME_GREEN_300, THEME_GREEN_400, THEME_GREEN_50, THEME_GREEN_500, THEME_GREEN_600, THEME_GREEN_700, THEME_GREEN_800, THEME_GREEN_900, THEME_GREEN_950, THEME_INDIGO_10, THEME_INDIGO_100, THEME_INDIGO_200, THEME_INDIGO_300, THEME_INDIGO_400, THEME_INDIGO_50, THEME_INDIGO_500, THEME_INDIGO_600, THEME_INDIGO_700, THEME_INDIGO_800, THEME_INDIGO_900, THEME_INDIGO_950, THEME_LIGHT_BLUE_10, THEME_LIGHT_BLUE_100, THEME_LIGHT_BLUE_200, THEME_LIGHT_BLUE_300, THEME_LIGHT_BLUE_400, THEME_LIGHT_BLUE_50, THEME_LIGHT_BLUE_500, THEME_LIGHT_BLUE_600, THEME_LIGHT_BLUE_700, THEME_LIGHT_BLUE_800, THEME_LIGHT_BLUE_900, THEME_LIGHT_BLUE_950, THEME_LIGHT_RED_10, THEME_LIGHT_RED_100, THEME_LIGHT_RED_200, THEME_LIGHT_RED_300, THEME_LIGHT_RED_400, THEME_LIGHT_RED_50, THEME_LIGHT_RED_500, THEME_LIGHT_RED_600, THEME_LIGHT_RED_700, THEME_LIGHT_RED_800, THEME_LIGHT_RED_900, THEME_LIGHT_RED_950, THEME_RED_10, THEME_RED_100, THEME_RED_200, THEME_RED_300, THEME_RED_400, THEME_RED_50, THEME_RED_500, THEME_RED_600, THEME_RED_700, THEME_RED_800, THEME_RED_900, THEME_RED_950, T_GRAY_A_02, T_GRAY_A_04, T_GRAY_A_06, T_GRAY_A_08, T_GRAY_A_16, T_GRAY_A_24, T_WHITE_A_02, T_WHITE_A_04, T_WHITE_A_06, T_WHITE_A_08, T_WHITE_A_16, T_WHITE_A_24, T_WHITE_A_36, WHITE };

package/dist/tokens/build/js/tokens.js

@@ -3,6 +3,75 @@
  * Do not edit directly
  */
 
+const GL_COLOR_BLUE_50 = '#e9f3fc';
+const GL_COLOR_BLUE_100 = '#cbe2f9';
+const GL_COLOR_BLUE_200 = '#9dc7f1';
+const GL_COLOR_BLUE_300 = '#63a6e9';
+const GL_COLOR_BLUE_400 = '#428fdc';
+const GL_COLOR_BLUE_500 = '#1f75cb';
+const GL_COLOR_BLUE_600 = '#1068bf';
+const GL_COLOR_BLUE_700 = '#0b5cad';
+const GL_COLOR_BLUE_800 = '#064787';
+const GL_COLOR_BLUE_900 = '#033464';
+const GL_COLOR_BLUE_950 = '#002850';
+const GL_COLOR_NEUTRAL_0 = '#fff';
+const GL_COLOR_NEUTRAL_10 = '#fbfafd';
+const GL_COLOR_NEUTRAL_50 = '#ececef';
+const GL_COLOR_NEUTRAL_100 = '#dcdcde';
+const GL_COLOR_NEUTRAL_200 = '#bfbfc3';
+const GL_COLOR_NEUTRAL_300 = '#a4a3a8';
+const GL_COLOR_NEUTRAL_400 = '#89888d';
+const GL_COLOR_NEUTRAL_500 = '#737278';
+const GL_COLOR_NEUTRAL_600 = '#626168';
+const GL_COLOR_NEUTRAL_700 = '#535158';
+const GL_COLOR_NEUTRAL_800 = '#434248';
+const GL_COLOR_NEUTRAL_900 = '#333238';
+const GL_COLOR_NEUTRAL_950 = '#1f1e24';
+const GL_COLOR_NEUTRAL_1000 = '#000';
+const GL_COLOR_GREEN_50 = '#ecf4ee';
+const GL_COLOR_GREEN_100 = '#c3e6cd';
+const GL_COLOR_GREEN_200 = '#91d4a8';
+const GL_COLOR_GREEN_300 = '#52b87a';
+const GL_COLOR_GREEN_400 = '#2da160';
+const GL_COLOR_GREEN_500 = '#108548';
+const GL_COLOR_GREEN_600 = '#217645';
+const GL_COLOR_GREEN_700 = '#24663b';
+const GL_COLOR_GREEN_800 = '#0d532a';
+const GL_COLOR_GREEN_900 = '#0a4020';
+const GL_COLOR_GREEN_950 = '#072b15';
+const GL_COLOR_ORANGE_50 = '#fdf1dd';
+const GL_COLOR_ORANGE_100 = '#f5d9a8';
+const GL_COLOR_ORANGE_200 = '#e9be74';
+const GL_COLOR_ORANGE_300 = '#d99530';
+const GL_COLOR_ORANGE_400 = '#c17d10';
+const GL_COLOR_ORANGE_500 = '#ab6100';
+const GL_COLOR_ORANGE_600 = '#9e5400';
+const GL_COLOR_ORANGE_700 = '#8f4700';
+const GL_COLOR_ORANGE_800 = '#703800';
+const GL_COLOR_ORANGE_900 = '#5c2900';
+const GL_COLOR_ORANGE_950 = '#421f00';
+const GL_COLOR_PURPLE_50 = '#f4f0ff';
+const GL_COLOR_PURPLE_100 = '#e1d8f9';
+const GL_COLOR_PURPLE_200 = '#cbbbf2';
+const GL_COLOR_PURPLE_300 = '#ac93e6';
+const GL_COLOR_PURPLE_400 = '#9475db';
+const GL_COLOR_PURPLE_500 = '#7b58cf';
+const GL_COLOR_PURPLE_600 = '#694cc0';
+const GL_COLOR_PURPLE_700 = '#5943b6';
+const GL_COLOR_PURPLE_800 = '#453894';
+const GL_COLOR_PURPLE_900 = '#2f2a6b';
+const GL_COLOR_PURPLE_950 = '#232150';
+const GL_COLOR_RED_50 = '#fcf1ef';
+const GL_COLOR_RED_100 = '#fdd4cd';
+const GL_COLOR_RED_200 = '#fcb5aa';
+const GL_COLOR_RED_300 = '#f57f6c';
+const GL_COLOR_RED_400 = '#ec5941';
+const GL_COLOR_RED_500 = '#dd2b0e';
+const GL_COLOR_RED_600 = '#c91c00';
+const GL_COLOR_RED_700 = '#ae1800';
+const GL_COLOR_RED_800 = '#8d1300';
+const GL_COLOR_RED_900 = '#660e00';
+const GL_COLOR_RED_950 = '#4d0a00';
 const DATA_VIZ_GREEN_50 = '#ddfab7';
 const DATA_VIZ_GREEN_100 = '#c6ed94';
 const DATA_VIZ_GREEN_200 = '#b0d97b';
@@ -245,4 +314,4 @@ const GL_TEXT_COLOR_DANGER = '#c91c00'; // Used for text indicating a problem, c
 const GL_TEXT_COLOR_SUCCESS = '#217645'; // Used for text indicating success or validity.
 const GL_TEXT_COLOR_DISABLED = '#89888d'; // Used for disabled text.
 
-export { BLACK, BLUE_100, BLUE_200, BLUE_300, BLUE_400, BLUE_50, BLUE_500, BLUE_600, BLUE_700, BLUE_800, BLUE_900, BLUE_950, BRAND_CHARCOAL, BRAND_GRAY_01, BRAND_GRAY_02, BRAND_GRAY_03, BRAND_GRAY_04, BRAND_GRAY_05, BRAND_ORANGE_01, BRAND_ORANGE_02, BRAND_ORANGE_03, BRAND_PURPLE_01, BRAND_PURPLE_02, DATA_VIZ_AQUA_100, DATA_VIZ_AQUA_200, DATA_VIZ_AQUA_300, DATA_VIZ_AQUA_400, DATA_VIZ_AQUA_50, DATA_VIZ_AQUA_500, DATA_VIZ_AQUA_600, DATA_VIZ_AQUA_700, DATA_VIZ_AQUA_800, DATA_VIZ_AQUA_900, DATA_VIZ_AQUA_950, DATA_VIZ_BLUE_100, DATA_VIZ_BLUE_200, DATA_VIZ_BLUE_300, DATA_VIZ_BLUE_400, DATA_VIZ_BLUE_50, DATA_VIZ_BLUE_500, DATA_VIZ_BLUE_600, DATA_VIZ_BLUE_700, DATA_VIZ_BLUE_800, DATA_VIZ_BLUE_900, DATA_VIZ_BLUE_950, DATA_VIZ_GREEN_100, DATA_VIZ_GREEN_200, DATA_VIZ_GREEN_300, DATA_VIZ_GREEN_400, DATA_VIZ_GREEN_50, DATA_VIZ_GREEN_500, DATA_VIZ_GREEN_600, DATA_VIZ_GREEN_700, DATA_VIZ_GREEN_800, DATA_VIZ_GREEN_900, DATA_VIZ_GREEN_950, DATA_VIZ_MAGENTA_100, DATA_VIZ_MAGENTA_200, DATA_VIZ_MAGENTA_300, DATA_VIZ_MAGENTA_400, DATA_VIZ_MAGENTA_50, DATA_VIZ_MAGENTA_500, DATA_VIZ_MAGENTA_600, DATA_VIZ_MAGENTA_700, DATA_VIZ_MAGENTA_800, DATA_VIZ_MAGENTA_900, DATA_VIZ_MAGENTA_950, DATA_VIZ_ORANGE_100, DATA_VIZ_ORANGE_200, DATA_VIZ_ORANGE_300, DATA_VIZ_ORANGE_400, DATA_VIZ_ORANGE_50, DATA_VIZ_ORANGE_500, DATA_VIZ_ORANGE_600, DATA_VIZ_ORANGE_700, DATA_VIZ_ORANGE_800, DATA_VIZ_ORANGE_900, DATA_VIZ_ORANGE_950, GL_LINE_HEIGHT_12, GL_LINE_HEIGHT_16, GL_LINE_HEIGHT_20, GL_LINE_HEIGHT_24, GL_LINE_HEIGHT_28, GL_LINE_HEIGHT_32, GL_LINE_HEIGHT_36, GL_LINE_HEIGHT_42, GL_LINE_HEIGHT_44, GL_LINE_HEIGHT_52, GL_TEXT_COLOR_DANGER, GL_TEXT_COLOR_DEFAULT, GL_TEXT_COLOR_DISABLED, GL_TEXT_COLOR_HEADING, GL_TEXT_COLOR_LINK, GL_TEXT_COLOR_STRONG, GL_TEXT_COLOR_SUBTLE, GL_TEXT_COLOR_SUCCESS, GL_TEXT_PRIMARY, GL_TEXT_SECONDARY, GL_TEXT_TERTIARY, GRAY_10, GRAY_100, GRAY_200, GRAY_300, GRAY_400, GRAY_50, GRAY_500, GRAY_600, GRAY_700, GRAY_800, GRAY_900, GRAY_950, GREEN_100, GREEN_200, GREEN_300, GREEN_400, GREEN_50, GREEN_500, GREEN_600, GREEN_700, GREEN_800, GREEN_900, GREEN_950, ORANGE_100, ORANGE_200, ORANGE_300, ORANGE_400, ORANGE_50, ORANGE_500, ORANGE_600, ORANGE_700, ORANGE_800, ORANGE_900, ORANGE_950, PURPLE_100, PURPLE_200, PURPLE_300, PURPLE_400, PURPLE_50, PURPLE_500, PURPLE_600, PURPLE_700, PURPLE_800, PURPLE_900, PURPLE_950, RED_100, RED_200, RED_300, RED_400, RED_50, RED_500, RED_600, RED_700, RED_800, RED_900, RED_950, THEME_BLUE_10, THEME_BLUE_100, THEME_BLUE_200, THEME_BLUE_300, THEME_BLUE_400, THEME_BLUE_50, THEME_BLUE_500, THEME_BLUE_600, THEME_BLUE_700, THEME_BLUE_800, THEME_BLUE_900, THEME_BLUE_950, THEME_GREEN_10, THEME_GREEN_100, THEME_GREEN_200, THEME_GREEN_300, THEME_GREEN_400, THEME_GREEN_50, THEME_GREEN_500, THEME_GREEN_600, THEME_GREEN_700, THEME_GREEN_800, THEME_GREEN_900, THEME_GREEN_950, THEME_INDIGO_10, THEME_INDIGO_100, THEME_INDIGO_200, THEME_INDIGO_300, THEME_INDIGO_400, THEME_INDIGO_50, THEME_INDIGO_500, THEME_INDIGO_600, THEME_INDIGO_700, THEME_INDIGO_800, THEME_INDIGO_900, THEME_INDIGO_950, THEME_LIGHT_BLUE_10, THEME_LIGHT_BLUE_100, THEME_LIGHT_BLUE_200, THEME_LIGHT_BLUE_300, THEME_LIGHT_BLUE_400, THEME_LIGHT_BLUE_50, THEME_LIGHT_BLUE_500, THEME_LIGHT_BLUE_600, THEME_LIGHT_BLUE_700, THEME_LIGHT_BLUE_800, THEME_LIGHT_BLUE_900, THEME_LIGHT_BLUE_950, THEME_LIGHT_RED_10, THEME_LIGHT_RED_100, THEME_LIGHT_RED_200, THEME_LIGHT_RED_300, THEME_LIGHT_RED_400, THEME_LIGHT_RED_50, THEME_LIGHT_RED_500, THEME_LIGHT_RED_600, THEME_LIGHT_RED_700, THEME_LIGHT_RED_800, THEME_LIGHT_RED_900, THEME_LIGHT_RED_950, THEME_RED_10, THEME_RED_100, THEME_RED_200, THEME_RED_300, THEME_RED_400, THEME_RED_50, THEME_RED_500, THEME_RED_600, THEME_RED_700, THEME_RED_800, THEME_RED_900, THEME_RED_950, T_GRAY_A_02, T_GRAY_A_04, T_GRAY_A_06, T_GRAY_A_08, T_GRAY_A_16, T_GRAY_A_24, T_WHITE_A_02, T_WHITE_A_04, T_WHITE_A_06, T_WHITE_A_08, T_WHITE_A_16, T_WHITE_A_24, T_WHITE_A_36, WHITE };
+export { BLACK, BLUE_100, BLUE_200, BLUE_300, BLUE_400, BLUE_50, BLUE_500, BLUE_600, BLUE_700, BLUE_800, BLUE_900, BLUE_950, BRAND_CHARCOAL, BRAND_GRAY_01, BRAND_GRAY_02, BRAND_GRAY_03, BRAND_GRAY_04, BRAND_GRAY_05, BRAND_ORANGE_01, BRAND_ORANGE_02, BRAND_ORANGE_03, BRAND_PURPLE_01, BRAND_PURPLE_02, DATA_VIZ_AQUA_100, DATA_VIZ_AQUA_200, DATA_VIZ_AQUA_300, DATA_VIZ_AQUA_400, DATA_VIZ_AQUA_50, DATA_VIZ_AQUA_500, DATA_VIZ_AQUA_600, DATA_VIZ_AQUA_700, DATA_VIZ_AQUA_800, DATA_VIZ_AQUA_900, DATA_VIZ_AQUA_950, DATA_VIZ_BLUE_100, DATA_VIZ_BLUE_200, DATA_VIZ_BLUE_300, DATA_VIZ_BLUE_400, DATA_VIZ_BLUE_50, DATA_VIZ_BLUE_500, DATA_VIZ_BLUE_600, DATA_VIZ_BLUE_700, DATA_VIZ_BLUE_800, DATA_VIZ_BLUE_900, DATA_VIZ_BLUE_950, DATA_VIZ_GREEN_100, DATA_VIZ_GREEN_200, DATA_VIZ_GREEN_300, DATA_VIZ_GREEN_400, DATA_VIZ_GREEN_50, DATA_VIZ_GREEN_500, DATA_VIZ_GREEN_600, DATA_VIZ_GREEN_700, DATA_VIZ_GREEN_800, DATA_VIZ_GREEN_900, DATA_VIZ_GREEN_950, DATA_VIZ_MAGENTA_100, DATA_VIZ_MAGENTA_200, DATA_VIZ_MAGENTA_300, DATA_VIZ_MAGENTA_400, DATA_VIZ_MAGENTA_50, DATA_VIZ_MAGENTA_500, DATA_VIZ_MAGENTA_600, DATA_VIZ_MAGENTA_700, DATA_VIZ_MAGENTA_800, DATA_VIZ_MAGENTA_900, DATA_VIZ_MAGENTA_950, DATA_VIZ_ORANGE_100, DATA_VIZ_ORANGE_200, DATA_VIZ_ORANGE_300, DATA_VIZ_ORANGE_400, DATA_VIZ_ORANGE_50, DATA_VIZ_ORANGE_500, DATA_VIZ_ORANGE_600, DATA_VIZ_ORANGE_700, DATA_VIZ_ORANGE_800, DATA_VIZ_ORANGE_900, DATA_VIZ_ORANGE_950, GL_COLOR_BLUE_100, GL_COLOR_BLUE_200, GL_COLOR_BLUE_300, GL_COLOR_BLUE_400, GL_COLOR_BLUE_50, GL_COLOR_BLUE_500, GL_COLOR_BLUE_600, GL_COLOR_BLUE_700, GL_COLOR_BLUE_800, GL_COLOR_BLUE_900, GL_COLOR_BLUE_950, GL_COLOR_GREEN_100, GL_COLOR_GREEN_200, GL_COLOR_GREEN_300, GL_COLOR_GREEN_400, GL_COLOR_GREEN_50, GL_COLOR_GREEN_500, GL_COLOR_GREEN_600, GL_COLOR_GREEN_700, GL_COLOR_GREEN_800, GL_COLOR_GREEN_900, GL_COLOR_GREEN_950, GL_COLOR_NEUTRAL_0, GL_COLOR_NEUTRAL_10, GL_COLOR_NEUTRAL_100, GL_COLOR_NEUTRAL_1000, GL_COLOR_NEUTRAL_200, GL_COLOR_NEUTRAL_300, GL_COLOR_NEUTRAL_400, GL_COLOR_NEUTRAL_50, GL_COLOR_NEUTRAL_500, GL_COLOR_NEUTRAL_600, GL_COLOR_NEUTRAL_700, GL_COLOR_NEUTRAL_800, GL_COLOR_NEUTRAL_900, GL_COLOR_NEUTRAL_950, GL_COLOR_ORANGE_100, GL_COLOR_ORANGE_200, GL_COLOR_ORANGE_300, GL_COLOR_ORANGE_400, GL_COLOR_ORANGE_50, GL_COLOR_ORANGE_500, GL_COLOR_ORANGE_600, GL_COLOR_ORANGE_700, GL_COLOR_ORANGE_800, GL_COLOR_ORANGE_900, GL_COLOR_ORANGE_950, GL_COLOR_PURPLE_100, GL_COLOR_PURPLE_200, GL_COLOR_PURPLE_300, GL_COLOR_PURPLE_400, GL_COLOR_PURPLE_50, GL_COLOR_PURPLE_500, GL_COLOR_PURPLE_600, GL_COLOR_PURPLE_700, GL_COLOR_PURPLE_800, GL_COLOR_PURPLE_900, GL_COLOR_PURPLE_950, GL_COLOR_RED_100, GL_COLOR_RED_200, GL_COLOR_RED_300, GL_COLOR_RED_400, GL_COLOR_RED_50, GL_COLOR_RED_500, GL_COLOR_RED_600, GL_COLOR_RED_700, GL_COLOR_RED_800, GL_COLOR_RED_900, GL_COLOR_RED_950, GL_LINE_HEIGHT_12, GL_LINE_HEIGHT_16, GL_LINE_HEIGHT_20, GL_LINE_HEIGHT_24, GL_LINE_HEIGHT_28, GL_LINE_HEIGHT_32, GL_LINE_HEIGHT_36, GL_LINE_HEIGHT_42, GL_LINE_HEIGHT_44, GL_LINE_HEIGHT_52, GL_TEXT_COLOR_DANGER, GL_TEXT_COLOR_DEFAULT, GL_TEXT_COLOR_DISABLED, GL_TEXT_COLOR_HEADING, GL_TEXT_COLOR_LINK, GL_TEXT_COLOR_STRONG, GL_TEXT_COLOR_SUBTLE, GL_TEXT_COLOR_SUCCESS, GL_TEXT_PRIMARY, GL_TEXT_SECONDARY, GL_TEXT_TERTIARY, GRAY_10, GRAY_100, GRAY_200, GRAY_300, GRAY_400, GRAY_50, GRAY_500, GRAY_600, GRAY_700, GRAY_800, GRAY_900, GRAY_950, GREEN_100, GREEN_200, GREEN_300, GREEN_400, GREEN_50, GREEN_500, GREEN_600, GREEN_700, GREEN_800, GREEN_900, GREEN_950, ORANGE_100, ORANGE_200, ORANGE_300, ORANGE_400, ORANGE_50, ORANGE_500, ORANGE_600, ORANGE_700, ORANGE_800, ORANGE_900, ORANGE_950, PURPLE_100, PURPLE_200, PURPLE_300, PURPLE_400, PURPLE_50, PURPLE_500, PURPLE_600, PURPLE_700, PURPLE_800, PURPLE_900, PURPLE_950, RED_100, RED_200, RED_300, RED_400, RED_50, RED_500, RED_600, RED_700, RED_800, RED_900, RED_950, THEME_BLUE_10, THEME_BLUE_100, THEME_BLUE_200, THEME_BLUE_300, THEME_BLUE_400, THEME_BLUE_50, THEME_BLUE_500, THEME_BLUE_600, THEME_BLUE_700, THEME_BLUE_800, THEME_BLUE_900, THEME_BLUE_950, THEME_GREEN_10, THEME_GREEN_100, THEME_GREEN_200, THEME_GREEN_300, THEME_GREEN_400, THEME_GREEN_50, THEME_GREEN_500, THEME_GREEN_600, THEME_GREEN_700, THEME_GREEN_800, THEME_GREEN_900, THEME_GREEN_950, THEME_INDIGO_10, THEME_INDIGO_100, THEME_INDIGO_200, THEME_INDIGO_300, THEME_INDIGO_400, THEME_INDIGO_50, THEME_INDIGO_500, THEME_INDIGO_600, THEME_INDIGO_700, THEME_INDIGO_800, THEME_INDIGO_900, THEME_INDIGO_950, THEME_LIGHT_BLUE_10, THEME_LIGHT_BLUE_100, THEME_LIGHT_BLUE_200, THEME_LIGHT_BLUE_300, THEME_LIGHT_BLUE_400, THEME_LIGHT_BLUE_50, THEME_LIGHT_BLUE_500, THEME_LIGHT_BLUE_600, THEME_LIGHT_BLUE_700, THEME_LIGHT_BLUE_800, THEME_LIGHT_BLUE_900, THEME_LIGHT_BLUE_950, THEME_LIGHT_RED_10, THEME_LIGHT_RED_100, THEME_LIGHT_RED_200, THEME_LIGHT_RED_300, THEME_LIGHT_RED_400, THEME_LIGHT_RED_50, THEME_LIGHT_RED_500, THEME_LIGHT_RED_600, THEME_LIGHT_RED_700, THEME_LIGHT_RED_800, THEME_LIGHT_RED_900, THEME_LIGHT_RED_950, THEME_RED_10, THEME_RED_100, THEME_RED_200, THEME_RED_300, THEME_RED_400, THEME_RED_50, THEME_RED_500, THEME_RED_600, THEME_RED_700, THEME_RED_800, THEME_RED_900, THEME_RED_950, T_GRAY_A_02, T_GRAY_A_04, T_GRAY_A_06, T_GRAY_A_08, T_GRAY_A_16, T_GRAY_A_24, T_WHITE_A_02, T_WHITE_A_04, T_WHITE_A_06, T_WHITE_A_08, T_WHITE_A_16, T_WHITE_A_24, T_WHITE_A_36, WHITE };

package/dist/tokens/common_story_options.js

@@ -1,4 +1,4 @@
-import { WHITE, GRAY_950 } from '../../dist/tokens/js/tokens';
+import { WHITE, GRAY_950 } from './build/js/tokens';
 import TokensStory from './tokens_story';
 
 const createDesignTokenStory = function () {

package/dist/tokens/css/tokens.css

@@ -4,14 +4,6 @@
  */
 
 :root {
-  --gl-text-color-disabled: #89888d; /* Used for disabled text. */
-  --gl-text-color-success: #217645; /* Used for text indicating success or validity. */
-  --gl-text-color-danger: #c91c00; /* Used for text indicating a problem, critical state, destructive action, error, failure, removal, stop, or declination. */
-  --gl-text-color-link: #0b5cad; /* Used for default text links. */
-  --gl-text-color-heading: #1f1e24; /* Used for headings level 1-6. */
-  --gl-text-color-strong: #1f1e24; /* Used for text with the highest contrast. */
-  --gl-text-color-subtle: #626168; /* Used for supplemental text that doesn't need to be as prominent as other text. */
-  --gl-text-color-default: #434248; /* Used for the default text color. */
   --gl-text-tertiary: #89888d; /* Use text.color.disabled instead */
   --gl-text-secondary: #737278; /* Use text.color.subtle instead */
   --gl-text-primary: #333238; /* Use text.color.default instead */
@@ -245,4 +237,81 @@
   --data-viz-green-200: #b0d97b;
   --data-viz-green-100: #c6ed94;
   --data-viz-green-50: #ddfab7;
+  --gl-color-red-950: #4d0a00;
+  --gl-color-red-900: #660e00;
+  --gl-color-red-800: #8d1300;
+  --gl-color-red-700: #ae1800;
+  --gl-color-red-600: #c91c00;
+  --gl-color-red-500: #dd2b0e;
+  --gl-color-red-400: #ec5941;
+  --gl-color-red-300: #f57f6c;
+  --gl-color-red-200: #fcb5aa;
+  --gl-color-red-100: #fdd4cd;
+  --gl-color-red-50: #fcf1ef;
+  --gl-color-purple-950: #232150;
+  --gl-color-purple-900: #2f2a6b;
+  --gl-color-purple-800: #453894;
+  --gl-color-purple-700: #5943b6;
+  --gl-color-purple-600: #694cc0;
+  --gl-color-purple-500: #7b58cf;
+  --gl-color-purple-400: #9475db;
+  --gl-color-purple-300: #ac93e6;
+  --gl-color-purple-200: #cbbbf2;
+  --gl-color-purple-100: #e1d8f9;
+  --gl-color-purple-50: #f4f0ff;
+  --gl-color-orange-950: #421f00;
+  --gl-color-orange-900: #5c2900;
+  --gl-color-orange-800: #703800;
+  --gl-color-orange-700: #8f4700;
+  --gl-color-orange-600: #9e5400;
+  --gl-color-orange-500: #ab6100;
+  --gl-color-orange-400: #c17d10;
+  --gl-color-orange-300: #d99530;
+  --gl-color-orange-200: #e9be74;
+  --gl-color-orange-100: #f5d9a8;
+  --gl-color-orange-50: #fdf1dd;
+  --gl-color-green-950: #072b15;
+  --gl-color-green-900: #0a4020;
+  --gl-color-green-800: #0d532a;
+  --gl-color-green-700: #24663b;
+  --gl-color-green-600: #217645;
+  --gl-color-green-500: #108548;
+  --gl-color-green-400: #2da160;
+  --gl-color-green-300: #52b87a;
+  --gl-color-green-200: #91d4a8;
+  --gl-color-green-100: #c3e6cd;
+  --gl-color-green-50: #ecf4ee;
+  --gl-color-neutral-1000: #000;
+  --gl-color-neutral-950: #1f1e24;
+  --gl-color-neutral-900: #333238;
+  --gl-color-neutral-800: #434248;
+  --gl-color-neutral-700: #535158;
+  --gl-color-neutral-600: #626168;
+  --gl-color-neutral-500: #737278;
+  --gl-color-neutral-400: #89888d;
+  --gl-color-neutral-300: #a4a3a8;
+  --gl-color-neutral-200: #bfbfc3;
+  --gl-color-neutral-100: #dcdcde;
+  --gl-color-neutral-50: #ececef;
+  --gl-color-neutral-10: #fbfafd;
+  --gl-color-neutral-0: #fff;
+  --gl-color-blue-950: #002850;
+  --gl-color-blue-900: #033464;
+  --gl-color-blue-800: #064787;
+  --gl-color-blue-700: #0b5cad;
+  --gl-color-blue-600: #1068bf;
+  --gl-color-blue-500: #1f75cb;
+  --gl-color-blue-400: #428fdc;
+  --gl-color-blue-300: #63a6e9;
+  --gl-color-blue-200: #9dc7f1;
+  --gl-color-blue-100: #cbe2f9;
+  --gl-color-blue-50: #e9f3fc;
+  --gl-text-color-disabled: var(--gl-color-neutral-400); /* Used for disabled text. */
+  --gl-text-color-success: var(--gl-color-green-600); /* Used for text indicating success or validity. */
+  --gl-text-color-danger: var(--gl-color-red-600); /* Used for text indicating a problem, critical state, destructive action, error, failure, removal, stop, or declination. */
+  --gl-text-color-link: var(--gl-color-blue-700); /* Used for default text links. */
+  --gl-text-color-heading: var(--gl-color-neutral-950); /* Used for headings level 1-6. */
+  --gl-text-color-strong: var(--gl-color-neutral-950); /* Used for text with the highest contrast. */
+  --gl-text-color-subtle: var(--gl-color-neutral-600); /* Used for supplemental text that doesn't need to be as prominent as other text. */
+  --gl-text-color-default: var(--gl-color-neutral-800); /* Used for the default text color. */
 }

package/dist/tokens/css/tokens.dark.css

@@ -4,15 +4,43 @@
  */
 
 :root.gl-dark {
-  --gl-text-color-disabled: #89888d; /* Used for disabled text. */
-  --gl-text-color-link: #63a6e9; /* Used for default text links. */
-  --gl-text-color-heading: #fff; /* Used for headings level 1-6. */
-  --gl-text-color-strong: #fff; /* Used for text with the highest contrast. */
-  --gl-text-color-subtle: #bfbfc3; /* Used for supplemental text that doesn't need to be as prominent as other text. */
-  --gl-text-color-default: #ececef; /* Used for the default text color. */
   --gl-text-tertiary: #737278; /* Use text.color.disabled instead */
   --gl-text-secondary: #89888d; /* Use text.color.subtle instead */
   --gl-text-primary: #ececef; /* Use text.color.default instead */
+  --gl-line-height-52: 3.25rem;
+  --gl-line-height-44: 2.75rem;
+  --gl-line-height-42: 2.625rem;
+  --gl-line-height-36: 2.25rem;
+  --gl-line-height-32: 2rem;
+  --gl-line-height-28: 1.75rem;
+  --gl-line-height-24: 1.5rem;
+  --gl-line-height-20: 1.25rem;
+  --gl-line-height-16: 1rem;
+  --gl-line-height-12: 0.75rem;
+  --t-white-a-08: rgba(255, 255, 255, 0.08);
+  --t-white-a-06: rgba(255, 255, 255, 0.06);
+  --t-white-a-04: rgba(255, 255, 255, 0.04);
+  --t-white-a-02: rgba(255, 255, 255, 0.02);
+  --t-white-a-36: rgba(255, 255, 255, 0.36);
+  --t-white-a-24: rgba(255, 255, 255, 0.24);
+  --t-white-a-16: rgba(255, 255, 255, 0.16);
+  --t-gray-a-08: rgba(31, 30, 36, 0.08);
+  --t-gray-a-06: rgba(31, 30, 36, 0.06);
+  --t-gray-a-04: rgba(31, 30, 36, 0.04);
+  --t-gray-a-02: rgba(31, 30, 36, 0.02);
+  --t-gray-a-24: rgba(31, 30, 36, 0.24);
+  --t-gray-a-16: rgba(31, 30, 36, 0.16);
+  --brand-gray-05: #2b2838;
+  --brand-gray-04: #45424d;
+  --brand-gray-03: #74717a;
+  --brand-gray-02: #a2a1a6;
+  --brand-gray-01: #d1d0d3;
+  --brand-purple-02: #7759c2;
+  --brand-purple-01: #a989f5;
+  --brand-orange-03: #e24329;
+  --brand-orange-02: #fc6d26;
+  --brand-orange-01: #fca326;
+  --brand-charcoal: #171321;
   --red-950: #fff4f3;
   --red-900: #fcf1ef;
   --red-800: #fdd4cd;
@@ -209,4 +237,81 @@
   --data-viz-green-200: #275600;
   --data-viz-green-100: #1a4500;
   --data-viz-green-50: #133a03;
+  --gl-color-red-950: #4d0a00;
+  --gl-color-red-900: #660e00;
+  --gl-color-red-800: #8d1300;
+  --gl-color-red-700: #ae1800;
+  --gl-color-red-600: #c91c00;
+  --gl-color-red-500: #dd2b0e;
+  --gl-color-red-400: #ec5941;
+  --gl-color-red-300: #f57f6c;
+  --gl-color-red-200: #fcb5aa;
+  --gl-color-red-100: #fdd4cd;
+  --gl-color-red-50: #fcf1ef;
+  --gl-color-purple-950: #232150;
+  --gl-color-purple-900: #2f2a6b;
+  --gl-color-purple-800: #453894;
+  --gl-color-purple-700: #5943b6;
+  --gl-color-purple-600: #694cc0;
+  --gl-color-purple-500: #7b58cf;
+  --gl-color-purple-400: #9475db;
+  --gl-color-purple-300: #ac93e6;
+  --gl-color-purple-200: #cbbbf2;
+  --gl-color-purple-100: #e1d8f9;
+  --gl-color-purple-50: #f4f0ff;
+  --gl-color-orange-950: #421f00;
+  --gl-color-orange-900: #5c2900;
+  --gl-color-orange-800: #703800;
+  --gl-color-orange-700: #8f4700;
+  --gl-color-orange-600: #9e5400;
+  --gl-color-orange-500: #ab6100;
+  --gl-color-orange-400: #c17d10;
+  --gl-color-orange-300: #d99530;
+  --gl-color-orange-200: #e9be74;
+  --gl-color-orange-100: #f5d9a8;
+  --gl-color-orange-50: #fdf1dd;
+  --gl-color-green-950: #072b15;
+  --gl-color-green-900: #0a4020;
+  --gl-color-green-800: #0d532a;
+  --gl-color-green-700: #24663b;
+  --gl-color-green-600: #217645;
+  --gl-color-green-500: #108548;
+  --gl-color-green-400: #2da160;
+  --gl-color-green-300: #52b87a;
+  --gl-color-green-200: #91d4a8;
+  --gl-color-green-100: #c3e6cd;
+  --gl-color-green-50: #ecf4ee;
+  --gl-color-neutral-1000: #000;
+  --gl-color-neutral-950: #1f1e24;
+  --gl-color-neutral-900: #333238;
+  --gl-color-neutral-800: #434248;
+  --gl-color-neutral-700: #535158;
+  --gl-color-neutral-600: #626168;
+  --gl-color-neutral-500: #737278;
+  --gl-color-neutral-400: #89888d;
+  --gl-color-neutral-300: #a4a3a8;
+  --gl-color-neutral-200: #bfbfc3;
+  --gl-color-neutral-100: #dcdcde;
+  --gl-color-neutral-50: #ececef;
+  --gl-color-neutral-10: #fbfafd;
+  --gl-color-neutral-0: #fff;
+  --gl-color-blue-950: #002850;
+  --gl-color-blue-900: #033464;
+  --gl-color-blue-800: #064787;
+  --gl-color-blue-700: #0b5cad;
+  --gl-color-blue-600: #1068bf;
+  --gl-color-blue-500: #1f75cb;
+  --gl-color-blue-400: #428fdc;
+  --gl-color-blue-300: #63a6e9;
+  --gl-color-blue-200: #9dc7f1;
+  --gl-color-blue-100: #cbe2f9;
+  --gl-color-blue-50: #e9f3fc;
+  --gl-text-color-disabled: var(--gl-color-neutral-400); /* Used for disabled text. */
+  --gl-text-color-success: var(--gl-color-green-300); /* Used for text indicating success or validity. */
+  --gl-text-color-danger: var(--gl-color-red-300); /* Used for text indicating a problem, critical state, destructive action, error, failure, removal, stop, or declination. */
+  --gl-text-color-link: var(--gl-color-blue-300); /* Used for default text links. */
+  --gl-text-color-heading: var(--gl-color-neutral-0); /* Used for headings level 1-6. */
+  --gl-text-color-strong: var(--gl-color-neutral-0); /* Used for text with the highest contrast. */
+  --gl-text-color-subtle: var(--gl-color-neutral-200); /* Used for supplemental text that doesn't need to be as prominent as other text. */
+  --gl-text-color-default: var(--gl-color-neutral-50); /* Used for the default text color. */
 }