@gitlab/ui 85.10.0 → 85.12.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 (35) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/components/base/new_dropdowns/listbox/listbox.js +2 -8
  3. package/dist/components/base/pagination/pagination.js +15 -5
  4. package/dist/index.css +2 -2
  5. package/dist/index.css.map +1 -1
  6. package/dist/tokens/build/js/tokens.dark.js +2 -1
  7. package/dist/tokens/build/js/tokens.js +2 -1
  8. package/dist/tokens/css/tokens.css +1 -0
  9. package/dist/tokens/css/tokens.dark.css +1 -0
  10. package/dist/tokens/js/tokens.dark.js +1 -0
  11. package/dist/tokens/js/tokens.js +1 -0
  12. package/dist/tokens/json/tokens.dark.json +22 -0
  13. package/dist/tokens/json/tokens.json +22 -0
  14. package/dist/tokens/scss/_tokens.dark.scss +1 -0
  15. package/dist/tokens/scss/_tokens.scss +1 -0
  16. package/dist/tokens/scss/_tokens_custom_properties.scss +1 -0
  17. package/dist/tokens/tailwind/tokens.cjs +2 -0
  18. package/dist/utils/i18n.js +49 -1
  19. package/package.json +3 -3
  20. package/src/components/base/modal/modal.scss +6 -4
  21. package/src/components/base/new_dropdowns/listbox/listbox.vue +6 -8
  22. package/src/components/base/pagination/pagination.vue +18 -5
  23. package/src/tokens/background.tokens.json +8 -0
  24. package/src/tokens/build/css/tokens.css +1 -0
  25. package/src/tokens/build/css/tokens.dark.css +1 -0
  26. package/src/tokens/build/js/tokens.dark.js +1 -0
  27. package/src/tokens/build/js/tokens.js +1 -0
  28. package/src/tokens/build/json/tokens.dark.json +22 -0
  29. package/src/tokens/build/json/tokens.json +22 -0
  30. package/src/tokens/build/scss/_tokens.dark.scss +1 -0
  31. package/src/tokens/build/scss/_tokens.scss +1 -0
  32. package/src/tokens/build/scss/_tokens_custom_properties.scss +1 -0
  33. package/src/tokens/build/tailwind/tokens.cjs +2 -0
  34. package/src/utils/i18n.js +52 -0
  35. package/translations.js +2 -1
@@ -74,6 +74,7 @@ const GL_BACKGROUND_COLOR_DEFAULT = '#1f1e24'; // Used for the default backgroun
74
74
  const GL_BACKGROUND_COLOR_SUBTLE = '#333238'; // Used to slightly differentiate the background from the default.
75
75
  const GL_BACKGROUND_COLOR_STRONG = '#434248'; // Used to make the background easily stand out from the default.
76
76
  const GL_BACKGROUND_COLOR_DISABLED = '#333238'; // Used to identify a disabled section.
77
+ const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(0,0,0,0.64)'; // Used for an overlay that covers other content.
77
78
  const GL_BORDER_COLOR_DEFAULT = '#434248'; // Used for the default border color.
78
79
  const GL_BORDER_COLOR_SUBTLE = '#333238'; // Used for a border that has a little more definition, or is used in combination with a subtle background.
79
80
  const GL_BORDER_COLOR_STRONG = '#89888d'; // Used for a distinct border that emphasizes an edge or boundaries.
@@ -606,4 +607,4 @@ const GL_TEXT_COLOR_DANGER = '#f57f6c'; // Used for text indicating a problem, c
606
607
  const GL_TEXT_COLOR_SUCCESS = '#52b87a'; // Used for text indicating success or validity.
607
608
  const GL_TEXT_COLOR_DISABLED = '#89888d'; // Used for disabled text.
608
609
 
609
- 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_ACTION_BACKGROUND_COLOR_DISABLED, GL_ACTION_BORDER_COLOR_DISABLED, GL_ACTION_CONFIRM_BACKGROUND_COLOR_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_HOVER, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_HOVER, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_SELECTED, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_ACTIVE, GL_ACTION_CONFIRM_BORDER_COLOR_DEFAULT, GL_ACTION_CONFIRM_BORDER_COLOR_FOCUS, GL_ACTION_CONFIRM_BORDER_COLOR_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_ACTIVE, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_DEFAULT, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_FOCUS, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_SELECTED, GL_ACTION_CONFIRM_ICON_COLOR_ACTIVE, GL_ACTION_CONFIRM_ICON_COLOR_DEFAULT, GL_ACTION_CONFIRM_ICON_COLOR_FOCUS, GL_ACTION_CONFIRM_ICON_COLOR_HOVER, GL_ACTION_CONFIRM_ICON_COLOR_STRONG, GL_ACTION_CONFIRM_TEXT_COLOR_ACTIVE, GL_ACTION_CONFIRM_TEXT_COLOR_DEFAULT, GL_ACTION_CONFIRM_TEXT_COLOR_FOCUS, GL_ACTION_CONFIRM_TEXT_COLOR_HOVER, GL_ACTION_CONFIRM_TEXT_COLOR_STRONG, GL_ACTION_ICON_COLOR_DISABLED, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_HOVER, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_HOVER, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_HOVER, GL_ACTION_NEUTRAL_BORDER_COLOR_ACTIVE, GL_ACTION_NEUTRAL_BORDER_COLOR_DEFAULT, GL_ACTION_NEUTRAL_BORDER_COLOR_FOCUS, GL_ACTION_NEUTRAL_BORDER_COLOR_HOVER, GL_ACTION_NEUTRAL_BORDER_COLOR_SELECTED, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_ACTIVE, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_DEFAULT, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_FOCUS, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_HOVER, GL_ACTION_NEUTRAL_ICON_COLOR_ACTIVE, GL_ACTION_NEUTRAL_ICON_COLOR_DEFAULT, GL_ACTION_NEUTRAL_ICON_COLOR_FOCUS, GL_ACTION_NEUTRAL_ICON_COLOR_HOVER, GL_ACTION_NEUTRAL_ICON_COLOR_STRONG, GL_ACTION_NEUTRAL_TEXT_COLOR_ACTIVE, GL_ACTION_NEUTRAL_TEXT_COLOR_DEFAULT, GL_ACTION_NEUTRAL_TEXT_COLOR_FOCUS, GL_ACTION_NEUTRAL_TEXT_COLOR_HOVER, GL_ACTION_NEUTRAL_TEXT_COLOR_STRONG, GL_ACTION_TEXT_COLOR_DISABLED, GL_AVATAR_BORDER_COLOR_DEFAULT, GL_AVATAR_BORDER_COLOR_HOVER, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_BLUE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_GREEN, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_NEUTRAL, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_ORANGE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_PURPLE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_RED, GL_BACKGROUND_COLOR_DEFAULT, GL_BACKGROUND_COLOR_DISABLED, GL_BACKGROUND_COLOR_STRONG, GL_BACKGROUND_COLOR_SUBTLE, GL_BANNER_INTRO_BORDER_COLOR, GL_BANNER_PROMO_BACKGROUND_COLOR, GL_BORDER_COLOR_DEFAULT, GL_BORDER_COLOR_STRONG, GL_BORDER_COLOR_SUBTLE, GL_BORDER_COLOR_TRANSPARENT, GL_BREADCRUMB_SEPARATOR_COLOR, GL_COLOR_ALPHA_0, GL_COLOR_ALPHA_DARK_16, GL_COLOR_ALPHA_DARK_2, GL_COLOR_ALPHA_DARK_24, GL_COLOR_ALPHA_DARK_4, GL_COLOR_ALPHA_DARK_6, GL_COLOR_ALPHA_DARK_8, GL_COLOR_ALPHA_LIGHT_16, GL_COLOR_ALPHA_LIGHT_2, GL_COLOR_ALPHA_LIGHT_24, GL_COLOR_ALPHA_LIGHT_36, GL_COLOR_ALPHA_LIGHT_4, GL_COLOR_ALPHA_LIGHT_6, GL_COLOR_ALPHA_LIGHT_8, 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_COLOR_THEME_BLUE_10, GL_COLOR_THEME_BLUE_100, GL_COLOR_THEME_BLUE_200, GL_COLOR_THEME_BLUE_300, GL_COLOR_THEME_BLUE_400, GL_COLOR_THEME_BLUE_50, GL_COLOR_THEME_BLUE_500, GL_COLOR_THEME_BLUE_600, GL_COLOR_THEME_BLUE_700, GL_COLOR_THEME_BLUE_800, GL_COLOR_THEME_BLUE_900, GL_COLOR_THEME_BLUE_950, GL_COLOR_THEME_GREEN_10, GL_COLOR_THEME_GREEN_100, GL_COLOR_THEME_GREEN_200, GL_COLOR_THEME_GREEN_300, GL_COLOR_THEME_GREEN_400, GL_COLOR_THEME_GREEN_50, GL_COLOR_THEME_GREEN_500, GL_COLOR_THEME_GREEN_600, GL_COLOR_THEME_GREEN_700, GL_COLOR_THEME_GREEN_800, GL_COLOR_THEME_GREEN_900, GL_COLOR_THEME_GREEN_950, GL_COLOR_THEME_INDIGO_10, GL_COLOR_THEME_INDIGO_100, GL_COLOR_THEME_INDIGO_200, GL_COLOR_THEME_INDIGO_300, GL_COLOR_THEME_INDIGO_400, GL_COLOR_THEME_INDIGO_50, GL_COLOR_THEME_INDIGO_500, GL_COLOR_THEME_INDIGO_600, GL_COLOR_THEME_INDIGO_700, GL_COLOR_THEME_INDIGO_800, GL_COLOR_THEME_INDIGO_900, GL_COLOR_THEME_INDIGO_950, GL_COLOR_THEME_LIGHT_BLUE_10, GL_COLOR_THEME_LIGHT_BLUE_100, GL_COLOR_THEME_LIGHT_BLUE_200, GL_COLOR_THEME_LIGHT_BLUE_300, GL_COLOR_THEME_LIGHT_BLUE_400, GL_COLOR_THEME_LIGHT_BLUE_50, GL_COLOR_THEME_LIGHT_BLUE_500, GL_COLOR_THEME_LIGHT_BLUE_600, GL_COLOR_THEME_LIGHT_BLUE_700, GL_COLOR_THEME_LIGHT_BLUE_800, GL_COLOR_THEME_LIGHT_BLUE_900, GL_COLOR_THEME_LIGHT_BLUE_950, GL_COLOR_THEME_LIGHT_RED_10, GL_COLOR_THEME_LIGHT_RED_100, GL_COLOR_THEME_LIGHT_RED_200, GL_COLOR_THEME_LIGHT_RED_300, GL_COLOR_THEME_LIGHT_RED_400, GL_COLOR_THEME_LIGHT_RED_50, GL_COLOR_THEME_LIGHT_RED_500, GL_COLOR_THEME_LIGHT_RED_600, GL_COLOR_THEME_LIGHT_RED_700, GL_COLOR_THEME_LIGHT_RED_800, GL_COLOR_THEME_LIGHT_RED_900, GL_COLOR_THEME_LIGHT_RED_950, GL_COLOR_THEME_RED_10, GL_COLOR_THEME_RED_100, GL_COLOR_THEME_RED_200, GL_COLOR_THEME_RED_300, GL_COLOR_THEME_RED_400, GL_COLOR_THEME_RED_50, GL_COLOR_THEME_RED_500, GL_COLOR_THEME_RED_600, GL_COLOR_THEME_RED_700, GL_COLOR_THEME_RED_800, GL_COLOR_THEME_RED_900, GL_COLOR_THEME_RED_950, GL_CONTROL_BACKGROUND_COLOR_DEFAULT, GL_CONTROL_BACKGROUND_COLOR_DISABLED, GL_CONTROL_BACKGROUND_COLOR_SELECTED_DEFAULT, GL_CONTROL_BACKGROUND_COLOR_SELECTED_FOCUS, GL_CONTROL_BACKGROUND_COLOR_SELECTED_HOVER, GL_CONTROL_BORDER_COLOR_DEFAULT, GL_CONTROL_BORDER_COLOR_DISABLED, GL_CONTROL_BORDER_COLOR_ERROR, GL_CONTROL_BORDER_COLOR_FOCUS, GL_CONTROL_BORDER_COLOR_HOVER, GL_CONTROL_INDICATOR_COLOR_DISABLED, GL_CONTROL_INDICATOR_COLOR_SELECTED, GL_CONTROL_PLACEHOLDER_COLOR, GL_CONTROL_TEXT_COLOR_ERROR, GL_CONTROL_TEXT_COLOR_VALID, GL_FEEDBACK_BACKGROUND_COLOR_STRONG, GL_FEEDBACK_DANGER_BACKGROUND_COLOR, GL_FEEDBACK_DANGER_ICON_COLOR, GL_FEEDBACK_ICON_COLOR_STRONG, GL_FEEDBACK_INFO_BACKGROUND_COLOR, GL_FEEDBACK_INFO_ICON_COLOR, GL_FEEDBACK_LINK_COLOR_STRONG, GL_FEEDBACK_NEUTRAL_BACKGROUND_COLOR, GL_FEEDBACK_NEUTRAL_ICON_COLOR, GL_FEEDBACK_SUCCESS_BACKGROUND_COLOR, GL_FEEDBACK_SUCCESS_ICON_COLOR, GL_FEEDBACK_TEXT_COLOR_STRONG, GL_FEEDBACK_WARNING_BACKGROUND_COLOR, GL_FEEDBACK_WARNING_ICON_COLOR, GL_FOCUS_RING_INNER_COLOR, GL_FOCUS_RING_OUTER_COLOR, GL_ICON_COLOR_DANGER, GL_ICON_COLOR_DEFAULT, GL_ICON_COLOR_DISABLED, GL_ICON_COLOR_INFO, GL_ICON_COLOR_LINK, GL_ICON_COLOR_STRONG, GL_ICON_COLOR_SUBTLE, GL_ICON_COLOR_SUCCESS, GL_ICON_COLOR_WARNING, 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_POPOVER_BACKGROUND_COLOR, GL_SKELETON_LOADER_BACKGROUND_COLOR, GL_SKELETON_LOADER_SHIMMER_COLOR, GL_STATUS_BRAND_BACKGROUND_COLOR_ACTIVE, GL_STATUS_BRAND_BACKGROUND_COLOR_DEFAULT, GL_STATUS_BRAND_BORDER_COLOR_HOVER, GL_STATUS_BRAND_ICON_COLOR_ACTIVE, GL_STATUS_BRAND_ICON_COLOR_DEFAULT, GL_STATUS_BRAND_ICON_COLOR_FOCUS, GL_STATUS_BRAND_ICON_COLOR_HOVER, GL_STATUS_BRAND_TEXT_COLOR_ACTIVE, GL_STATUS_BRAND_TEXT_COLOR_DEFAULT, GL_STATUS_BRAND_TEXT_COLOR_FOCUS, GL_STATUS_BRAND_TEXT_COLOR_HOVER, GL_STATUS_DANGER_BACKGROUND_COLOR_ACTIVE, GL_STATUS_DANGER_BACKGROUND_COLOR_DEFAULT, GL_STATUS_DANGER_BORDER_COLOR_HOVER, GL_STATUS_DANGER_ICON_COLOR_ACTIVE, GL_STATUS_DANGER_ICON_COLOR_DEFAULT, GL_STATUS_DANGER_ICON_COLOR_FOCUS, GL_STATUS_DANGER_ICON_COLOR_HOVER, GL_STATUS_DANGER_TEXT_COLOR_ACTIVE, GL_STATUS_DANGER_TEXT_COLOR_DEFAULT, GL_STATUS_DANGER_TEXT_COLOR_FOCUS, GL_STATUS_DANGER_TEXT_COLOR_HOVER, GL_STATUS_INFO_BACKGROUND_COLOR_ACTIVE, GL_STATUS_INFO_BACKGROUND_COLOR_DEFAULT, GL_STATUS_INFO_BORDER_COLOR_HOVER, GL_STATUS_INFO_ICON_COLOR_ACTIVE, GL_STATUS_INFO_ICON_COLOR_DEFAULT, GL_STATUS_INFO_ICON_COLOR_FOCUS, GL_STATUS_INFO_ICON_COLOR_HOVER, GL_STATUS_INFO_TEXT_COLOR_ACTIVE, GL_STATUS_INFO_TEXT_COLOR_DEFAULT, GL_STATUS_INFO_TEXT_COLOR_FOCUS, GL_STATUS_INFO_TEXT_COLOR_HOVER, GL_STATUS_MUTED_BACKGROUND_COLOR_ACTIVE, GL_STATUS_MUTED_BACKGROUND_COLOR_DEFAULT, GL_STATUS_MUTED_BORDER_COLOR_HOVER, GL_STATUS_MUTED_ICON_COLOR_ACTIVE, GL_STATUS_MUTED_ICON_COLOR_DEFAULT, GL_STATUS_MUTED_ICON_COLOR_FOCUS, GL_STATUS_MUTED_ICON_COLOR_HOVER, GL_STATUS_MUTED_TEXT_COLOR_ACTIVE, GL_STATUS_MUTED_TEXT_COLOR_DEFAULT, GL_STATUS_MUTED_TEXT_COLOR_FOCUS, GL_STATUS_MUTED_TEXT_COLOR_HOVER, GL_STATUS_NEUTRAL_BACKGROUND_COLOR_ACTIVE, GL_STATUS_NEUTRAL_BACKGROUND_COLOR_DEFAULT, GL_STATUS_NEUTRAL_BORDER_COLOR_HOVER, GL_STATUS_NEUTRAL_ICON_COLOR_ACTIVE, GL_STATUS_NEUTRAL_ICON_COLOR_DEFAULT, GL_STATUS_NEUTRAL_ICON_COLOR_FOCUS, GL_STATUS_NEUTRAL_ICON_COLOR_HOVER, GL_STATUS_NEUTRAL_TEXT_COLOR_ACTIVE, GL_STATUS_NEUTRAL_TEXT_COLOR_DEFAULT, GL_STATUS_NEUTRAL_TEXT_COLOR_FOCUS, GL_STATUS_NEUTRAL_TEXT_COLOR_HOVER, GL_STATUS_SUCCESS_BACKGROUND_COLOR_ACTIVE, GL_STATUS_SUCCESS_BACKGROUND_COLOR_DEFAULT, GL_STATUS_SUCCESS_BORDER_COLOR_HOVER, GL_STATUS_SUCCESS_ICON_COLOR_ACTIVE, GL_STATUS_SUCCESS_ICON_COLOR_DEFAULT, GL_STATUS_SUCCESS_ICON_COLOR_FOCUS, GL_STATUS_SUCCESS_ICON_COLOR_HOVER, GL_STATUS_SUCCESS_TEXT_COLOR_ACTIVE, GL_STATUS_SUCCESS_TEXT_COLOR_DEFAULT, GL_STATUS_SUCCESS_TEXT_COLOR_FOCUS, GL_STATUS_SUCCESS_TEXT_COLOR_HOVER, GL_STATUS_WARNING_BACKGROUND_COLOR_ACTIVE, GL_STATUS_WARNING_BACKGROUND_COLOR_DEFAULT, GL_STATUS_WARNING_BORDER_COLOR_HOVER, GL_STATUS_WARNING_ICON_COLOR_ACTIVE, GL_STATUS_WARNING_ICON_COLOR_DEFAULT, GL_STATUS_WARNING_ICON_COLOR_FOCUS, GL_STATUS_WARNING_ICON_COLOR_HOVER, GL_STATUS_WARNING_TEXT_COLOR_ACTIVE, GL_STATUS_WARNING_TEXT_COLOR_DEFAULT, GL_STATUS_WARNING_TEXT_COLOR_FOCUS, GL_STATUS_WARNING_TEXT_COLOR_HOVER, 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 };
610
+ 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_ACTION_BACKGROUND_COLOR_DISABLED, GL_ACTION_BORDER_COLOR_DISABLED, GL_ACTION_CONFIRM_BACKGROUND_COLOR_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_HOVER, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_HOVER, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_SELECTED, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_ACTIVE, GL_ACTION_CONFIRM_BORDER_COLOR_DEFAULT, GL_ACTION_CONFIRM_BORDER_COLOR_FOCUS, GL_ACTION_CONFIRM_BORDER_COLOR_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_ACTIVE, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_DEFAULT, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_FOCUS, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_SELECTED, GL_ACTION_CONFIRM_ICON_COLOR_ACTIVE, GL_ACTION_CONFIRM_ICON_COLOR_DEFAULT, GL_ACTION_CONFIRM_ICON_COLOR_FOCUS, GL_ACTION_CONFIRM_ICON_COLOR_HOVER, GL_ACTION_CONFIRM_ICON_COLOR_STRONG, GL_ACTION_CONFIRM_TEXT_COLOR_ACTIVE, GL_ACTION_CONFIRM_TEXT_COLOR_DEFAULT, GL_ACTION_CONFIRM_TEXT_COLOR_FOCUS, GL_ACTION_CONFIRM_TEXT_COLOR_HOVER, GL_ACTION_CONFIRM_TEXT_COLOR_STRONG, GL_ACTION_ICON_COLOR_DISABLED, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_HOVER, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_HOVER, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_HOVER, GL_ACTION_NEUTRAL_BORDER_COLOR_ACTIVE, GL_ACTION_NEUTRAL_BORDER_COLOR_DEFAULT, GL_ACTION_NEUTRAL_BORDER_COLOR_FOCUS, GL_ACTION_NEUTRAL_BORDER_COLOR_HOVER, GL_ACTION_NEUTRAL_BORDER_COLOR_SELECTED, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_ACTIVE, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_DEFAULT, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_FOCUS, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_HOVER, GL_ACTION_NEUTRAL_ICON_COLOR_ACTIVE, GL_ACTION_NEUTRAL_ICON_COLOR_DEFAULT, GL_ACTION_NEUTRAL_ICON_COLOR_FOCUS, GL_ACTION_NEUTRAL_ICON_COLOR_HOVER, GL_ACTION_NEUTRAL_ICON_COLOR_STRONG, GL_ACTION_NEUTRAL_TEXT_COLOR_ACTIVE, GL_ACTION_NEUTRAL_TEXT_COLOR_DEFAULT, GL_ACTION_NEUTRAL_TEXT_COLOR_FOCUS, GL_ACTION_NEUTRAL_TEXT_COLOR_HOVER, GL_ACTION_NEUTRAL_TEXT_COLOR_STRONG, GL_ACTION_TEXT_COLOR_DISABLED, GL_AVATAR_BORDER_COLOR_DEFAULT, GL_AVATAR_BORDER_COLOR_HOVER, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_BLUE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_GREEN, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_NEUTRAL, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_ORANGE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_PURPLE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_RED, GL_BACKGROUND_COLOR_DEFAULT, GL_BACKGROUND_COLOR_DISABLED, GL_BACKGROUND_COLOR_OVERLAY, GL_BACKGROUND_COLOR_STRONG, GL_BACKGROUND_COLOR_SUBTLE, GL_BANNER_INTRO_BORDER_COLOR, GL_BANNER_PROMO_BACKGROUND_COLOR, GL_BORDER_COLOR_DEFAULT, GL_BORDER_COLOR_STRONG, GL_BORDER_COLOR_SUBTLE, GL_BORDER_COLOR_TRANSPARENT, GL_BREADCRUMB_SEPARATOR_COLOR, GL_COLOR_ALPHA_0, GL_COLOR_ALPHA_DARK_16, GL_COLOR_ALPHA_DARK_2, GL_COLOR_ALPHA_DARK_24, GL_COLOR_ALPHA_DARK_4, GL_COLOR_ALPHA_DARK_6, GL_COLOR_ALPHA_DARK_8, GL_COLOR_ALPHA_LIGHT_16, GL_COLOR_ALPHA_LIGHT_2, GL_COLOR_ALPHA_LIGHT_24, GL_COLOR_ALPHA_LIGHT_36, GL_COLOR_ALPHA_LIGHT_4, GL_COLOR_ALPHA_LIGHT_6, GL_COLOR_ALPHA_LIGHT_8, 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_COLOR_THEME_BLUE_10, GL_COLOR_THEME_BLUE_100, GL_COLOR_THEME_BLUE_200, GL_COLOR_THEME_BLUE_300, GL_COLOR_THEME_BLUE_400, GL_COLOR_THEME_BLUE_50, GL_COLOR_THEME_BLUE_500, GL_COLOR_THEME_BLUE_600, GL_COLOR_THEME_BLUE_700, GL_COLOR_THEME_BLUE_800, GL_COLOR_THEME_BLUE_900, GL_COLOR_THEME_BLUE_950, GL_COLOR_THEME_GREEN_10, GL_COLOR_THEME_GREEN_100, GL_COLOR_THEME_GREEN_200, GL_COLOR_THEME_GREEN_300, GL_COLOR_THEME_GREEN_400, GL_COLOR_THEME_GREEN_50, GL_COLOR_THEME_GREEN_500, GL_COLOR_THEME_GREEN_600, GL_COLOR_THEME_GREEN_700, GL_COLOR_THEME_GREEN_800, GL_COLOR_THEME_GREEN_900, GL_COLOR_THEME_GREEN_950, GL_COLOR_THEME_INDIGO_10, GL_COLOR_THEME_INDIGO_100, GL_COLOR_THEME_INDIGO_200, GL_COLOR_THEME_INDIGO_300, GL_COLOR_THEME_INDIGO_400, GL_COLOR_THEME_INDIGO_50, GL_COLOR_THEME_INDIGO_500, GL_COLOR_THEME_INDIGO_600, GL_COLOR_THEME_INDIGO_700, GL_COLOR_THEME_INDIGO_800, GL_COLOR_THEME_INDIGO_900, GL_COLOR_THEME_INDIGO_950, GL_COLOR_THEME_LIGHT_BLUE_10, GL_COLOR_THEME_LIGHT_BLUE_100, GL_COLOR_THEME_LIGHT_BLUE_200, GL_COLOR_THEME_LIGHT_BLUE_300, GL_COLOR_THEME_LIGHT_BLUE_400, GL_COLOR_THEME_LIGHT_BLUE_50, GL_COLOR_THEME_LIGHT_BLUE_500, GL_COLOR_THEME_LIGHT_BLUE_600, GL_COLOR_THEME_LIGHT_BLUE_700, GL_COLOR_THEME_LIGHT_BLUE_800, GL_COLOR_THEME_LIGHT_BLUE_900, GL_COLOR_THEME_LIGHT_BLUE_950, GL_COLOR_THEME_LIGHT_RED_10, GL_COLOR_THEME_LIGHT_RED_100, GL_COLOR_THEME_LIGHT_RED_200, GL_COLOR_THEME_LIGHT_RED_300, GL_COLOR_THEME_LIGHT_RED_400, GL_COLOR_THEME_LIGHT_RED_50, GL_COLOR_THEME_LIGHT_RED_500, GL_COLOR_THEME_LIGHT_RED_600, GL_COLOR_THEME_LIGHT_RED_700, GL_COLOR_THEME_LIGHT_RED_800, GL_COLOR_THEME_LIGHT_RED_900, GL_COLOR_THEME_LIGHT_RED_950, GL_COLOR_THEME_RED_10, GL_COLOR_THEME_RED_100, GL_COLOR_THEME_RED_200, GL_COLOR_THEME_RED_300, GL_COLOR_THEME_RED_400, GL_COLOR_THEME_RED_50, GL_COLOR_THEME_RED_500, GL_COLOR_THEME_RED_600, GL_COLOR_THEME_RED_700, GL_COLOR_THEME_RED_800, GL_COLOR_THEME_RED_900, GL_COLOR_THEME_RED_950, GL_CONTROL_BACKGROUND_COLOR_DEFAULT, GL_CONTROL_BACKGROUND_COLOR_DISABLED, GL_CONTROL_BACKGROUND_COLOR_SELECTED_DEFAULT, GL_CONTROL_BACKGROUND_COLOR_SELECTED_FOCUS, GL_CONTROL_BACKGROUND_COLOR_SELECTED_HOVER, GL_CONTROL_BORDER_COLOR_DEFAULT, GL_CONTROL_BORDER_COLOR_DISABLED, GL_CONTROL_BORDER_COLOR_ERROR, GL_CONTROL_BORDER_COLOR_FOCUS, GL_CONTROL_BORDER_COLOR_HOVER, GL_CONTROL_INDICATOR_COLOR_DISABLED, GL_CONTROL_INDICATOR_COLOR_SELECTED, GL_CONTROL_PLACEHOLDER_COLOR, GL_CONTROL_TEXT_COLOR_ERROR, GL_CONTROL_TEXT_COLOR_VALID, GL_FEEDBACK_BACKGROUND_COLOR_STRONG, GL_FEEDBACK_DANGER_BACKGROUND_COLOR, GL_FEEDBACK_DANGER_ICON_COLOR, GL_FEEDBACK_ICON_COLOR_STRONG, GL_FEEDBACK_INFO_BACKGROUND_COLOR, GL_FEEDBACK_INFO_ICON_COLOR, GL_FEEDBACK_LINK_COLOR_STRONG, GL_FEEDBACK_NEUTRAL_BACKGROUND_COLOR, GL_FEEDBACK_NEUTRAL_ICON_COLOR, GL_FEEDBACK_SUCCESS_BACKGROUND_COLOR, GL_FEEDBACK_SUCCESS_ICON_COLOR, GL_FEEDBACK_TEXT_COLOR_STRONG, GL_FEEDBACK_WARNING_BACKGROUND_COLOR, GL_FEEDBACK_WARNING_ICON_COLOR, GL_FOCUS_RING_INNER_COLOR, GL_FOCUS_RING_OUTER_COLOR, GL_ICON_COLOR_DANGER, GL_ICON_COLOR_DEFAULT, GL_ICON_COLOR_DISABLED, GL_ICON_COLOR_INFO, GL_ICON_COLOR_LINK, GL_ICON_COLOR_STRONG, GL_ICON_COLOR_SUBTLE, GL_ICON_COLOR_SUCCESS, GL_ICON_COLOR_WARNING, 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_POPOVER_BACKGROUND_COLOR, GL_SKELETON_LOADER_BACKGROUND_COLOR, GL_SKELETON_LOADER_SHIMMER_COLOR, GL_STATUS_BRAND_BACKGROUND_COLOR_ACTIVE, GL_STATUS_BRAND_BACKGROUND_COLOR_DEFAULT, GL_STATUS_BRAND_BORDER_COLOR_HOVER, GL_STATUS_BRAND_ICON_COLOR_ACTIVE, GL_STATUS_BRAND_ICON_COLOR_DEFAULT, GL_STATUS_BRAND_ICON_COLOR_FOCUS, GL_STATUS_BRAND_ICON_COLOR_HOVER, GL_STATUS_BRAND_TEXT_COLOR_ACTIVE, GL_STATUS_BRAND_TEXT_COLOR_DEFAULT, GL_STATUS_BRAND_TEXT_COLOR_FOCUS, GL_STATUS_BRAND_TEXT_COLOR_HOVER, GL_STATUS_DANGER_BACKGROUND_COLOR_ACTIVE, GL_STATUS_DANGER_BACKGROUND_COLOR_DEFAULT, GL_STATUS_DANGER_BORDER_COLOR_HOVER, GL_STATUS_DANGER_ICON_COLOR_ACTIVE, GL_STATUS_DANGER_ICON_COLOR_DEFAULT, GL_STATUS_DANGER_ICON_COLOR_FOCUS, GL_STATUS_DANGER_ICON_COLOR_HOVER, GL_STATUS_DANGER_TEXT_COLOR_ACTIVE, GL_STATUS_DANGER_TEXT_COLOR_DEFAULT, GL_STATUS_DANGER_TEXT_COLOR_FOCUS, GL_STATUS_DANGER_TEXT_COLOR_HOVER, GL_STATUS_INFO_BACKGROUND_COLOR_ACTIVE, GL_STATUS_INFO_BACKGROUND_COLOR_DEFAULT, GL_STATUS_INFO_BORDER_COLOR_HOVER, GL_STATUS_INFO_ICON_COLOR_ACTIVE, GL_STATUS_INFO_ICON_COLOR_DEFAULT, GL_STATUS_INFO_ICON_COLOR_FOCUS, GL_STATUS_INFO_ICON_COLOR_HOVER, GL_STATUS_INFO_TEXT_COLOR_ACTIVE, GL_STATUS_INFO_TEXT_COLOR_DEFAULT, GL_STATUS_INFO_TEXT_COLOR_FOCUS, GL_STATUS_INFO_TEXT_COLOR_HOVER, GL_STATUS_MUTED_BACKGROUND_COLOR_ACTIVE, GL_STATUS_MUTED_BACKGROUND_COLOR_DEFAULT, GL_STATUS_MUTED_BORDER_COLOR_HOVER, GL_STATUS_MUTED_ICON_COLOR_ACTIVE, GL_STATUS_MUTED_ICON_COLOR_DEFAULT, GL_STATUS_MUTED_ICON_COLOR_FOCUS, GL_STATUS_MUTED_ICON_COLOR_HOVER, GL_STATUS_MUTED_TEXT_COLOR_ACTIVE, GL_STATUS_MUTED_TEXT_COLOR_DEFAULT, GL_STATUS_MUTED_TEXT_COLOR_FOCUS, GL_STATUS_MUTED_TEXT_COLOR_HOVER, GL_STATUS_NEUTRAL_BACKGROUND_COLOR_ACTIVE, GL_STATUS_NEUTRAL_BACKGROUND_COLOR_DEFAULT, GL_STATUS_NEUTRAL_BORDER_COLOR_HOVER, GL_STATUS_NEUTRAL_ICON_COLOR_ACTIVE, GL_STATUS_NEUTRAL_ICON_COLOR_DEFAULT, GL_STATUS_NEUTRAL_ICON_COLOR_FOCUS, GL_STATUS_NEUTRAL_ICON_COLOR_HOVER, GL_STATUS_NEUTRAL_TEXT_COLOR_ACTIVE, GL_STATUS_NEUTRAL_TEXT_COLOR_DEFAULT, GL_STATUS_NEUTRAL_TEXT_COLOR_FOCUS, GL_STATUS_NEUTRAL_TEXT_COLOR_HOVER, GL_STATUS_SUCCESS_BACKGROUND_COLOR_ACTIVE, GL_STATUS_SUCCESS_BACKGROUND_COLOR_DEFAULT, GL_STATUS_SUCCESS_BORDER_COLOR_HOVER, GL_STATUS_SUCCESS_ICON_COLOR_ACTIVE, GL_STATUS_SUCCESS_ICON_COLOR_DEFAULT, GL_STATUS_SUCCESS_ICON_COLOR_FOCUS, GL_STATUS_SUCCESS_ICON_COLOR_HOVER, GL_STATUS_SUCCESS_TEXT_COLOR_ACTIVE, GL_STATUS_SUCCESS_TEXT_COLOR_DEFAULT, GL_STATUS_SUCCESS_TEXT_COLOR_FOCUS, GL_STATUS_SUCCESS_TEXT_COLOR_HOVER, GL_STATUS_WARNING_BACKGROUND_COLOR_ACTIVE, GL_STATUS_WARNING_BACKGROUND_COLOR_DEFAULT, GL_STATUS_WARNING_BORDER_COLOR_HOVER, GL_STATUS_WARNING_ICON_COLOR_ACTIVE, GL_STATUS_WARNING_ICON_COLOR_DEFAULT, GL_STATUS_WARNING_ICON_COLOR_FOCUS, GL_STATUS_WARNING_ICON_COLOR_HOVER, GL_STATUS_WARNING_TEXT_COLOR_ACTIVE, GL_STATUS_WARNING_TEXT_COLOR_DEFAULT, GL_STATUS_WARNING_TEXT_COLOR_FOCUS, GL_STATUS_WARNING_TEXT_COLOR_HOVER, 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 };
@@ -74,6 +74,7 @@ const GL_BACKGROUND_COLOR_DEFAULT = '#fff'; // Used for the default background c
74
74
  const GL_BACKGROUND_COLOR_SUBTLE = '#fbfafd'; // Used to slightly differentiate the background from the default.
75
75
  const GL_BACKGROUND_COLOR_STRONG = '#ececef'; // Used to make the background easily stand out from the default.
76
76
  const GL_BACKGROUND_COLOR_DISABLED = '#fbfafd'; // Used to identify a disabled section.
77
+ const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(31, 30, 36, 0.24)'; // Used for an overlay that covers other content.
77
78
  const GL_BORDER_COLOR_DEFAULT = '#dcdcde'; // Used for the default border color.
78
79
  const GL_BORDER_COLOR_SUBTLE = '#ececef'; // Used for a border that has a little more definition, or is used in combination with a subtle background.
79
80
  const GL_BORDER_COLOR_STRONG = '#89888d'; // Used for a distinct border that emphasizes an edge or boundaries.
@@ -606,4 +607,4 @@ const GL_TEXT_COLOR_DANGER = '#c91c00'; // Used for text indicating a problem, c
606
607
  const GL_TEXT_COLOR_SUCCESS = '#217645'; // Used for text indicating success or validity.
607
608
  const GL_TEXT_COLOR_DISABLED = '#89888d'; // Used for disabled text.
608
609
 
609
- 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_ACTION_BACKGROUND_COLOR_DISABLED, GL_ACTION_BORDER_COLOR_DISABLED, GL_ACTION_CONFIRM_BACKGROUND_COLOR_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_HOVER, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_HOVER, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_SELECTED, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_ACTIVE, GL_ACTION_CONFIRM_BORDER_COLOR_DEFAULT, GL_ACTION_CONFIRM_BORDER_COLOR_FOCUS, GL_ACTION_CONFIRM_BORDER_COLOR_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_ACTIVE, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_DEFAULT, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_FOCUS, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_SELECTED, GL_ACTION_CONFIRM_ICON_COLOR_ACTIVE, GL_ACTION_CONFIRM_ICON_COLOR_DEFAULT, GL_ACTION_CONFIRM_ICON_COLOR_FOCUS, GL_ACTION_CONFIRM_ICON_COLOR_HOVER, GL_ACTION_CONFIRM_ICON_COLOR_STRONG, GL_ACTION_CONFIRM_TEXT_COLOR_ACTIVE, GL_ACTION_CONFIRM_TEXT_COLOR_DEFAULT, GL_ACTION_CONFIRM_TEXT_COLOR_FOCUS, GL_ACTION_CONFIRM_TEXT_COLOR_HOVER, GL_ACTION_CONFIRM_TEXT_COLOR_STRONG, GL_ACTION_ICON_COLOR_DISABLED, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_HOVER, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_HOVER, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_HOVER, GL_ACTION_NEUTRAL_BORDER_COLOR_ACTIVE, GL_ACTION_NEUTRAL_BORDER_COLOR_DEFAULT, GL_ACTION_NEUTRAL_BORDER_COLOR_FOCUS, GL_ACTION_NEUTRAL_BORDER_COLOR_HOVER, GL_ACTION_NEUTRAL_BORDER_COLOR_SELECTED, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_ACTIVE, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_DEFAULT, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_FOCUS, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_HOVER, GL_ACTION_NEUTRAL_ICON_COLOR_ACTIVE, GL_ACTION_NEUTRAL_ICON_COLOR_DEFAULT, GL_ACTION_NEUTRAL_ICON_COLOR_FOCUS, GL_ACTION_NEUTRAL_ICON_COLOR_HOVER, GL_ACTION_NEUTRAL_ICON_COLOR_STRONG, GL_ACTION_NEUTRAL_TEXT_COLOR_ACTIVE, GL_ACTION_NEUTRAL_TEXT_COLOR_DEFAULT, GL_ACTION_NEUTRAL_TEXT_COLOR_FOCUS, GL_ACTION_NEUTRAL_TEXT_COLOR_HOVER, GL_ACTION_NEUTRAL_TEXT_COLOR_STRONG, GL_ACTION_TEXT_COLOR_DISABLED, GL_AVATAR_BORDER_COLOR_DEFAULT, GL_AVATAR_BORDER_COLOR_HOVER, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_BLUE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_GREEN, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_NEUTRAL, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_ORANGE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_PURPLE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_RED, GL_BACKGROUND_COLOR_DEFAULT, GL_BACKGROUND_COLOR_DISABLED, GL_BACKGROUND_COLOR_STRONG, GL_BACKGROUND_COLOR_SUBTLE, GL_BANNER_INTRO_BORDER_COLOR, GL_BANNER_PROMO_BACKGROUND_COLOR, GL_BORDER_COLOR_DEFAULT, GL_BORDER_COLOR_STRONG, GL_BORDER_COLOR_SUBTLE, GL_BORDER_COLOR_TRANSPARENT, GL_BREADCRUMB_SEPARATOR_COLOR, GL_COLOR_ALPHA_0, GL_COLOR_ALPHA_DARK_16, GL_COLOR_ALPHA_DARK_2, GL_COLOR_ALPHA_DARK_24, GL_COLOR_ALPHA_DARK_4, GL_COLOR_ALPHA_DARK_6, GL_COLOR_ALPHA_DARK_8, GL_COLOR_ALPHA_LIGHT_16, GL_COLOR_ALPHA_LIGHT_2, GL_COLOR_ALPHA_LIGHT_24, GL_COLOR_ALPHA_LIGHT_36, GL_COLOR_ALPHA_LIGHT_4, GL_COLOR_ALPHA_LIGHT_6, GL_COLOR_ALPHA_LIGHT_8, 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_COLOR_THEME_BLUE_10, GL_COLOR_THEME_BLUE_100, GL_COLOR_THEME_BLUE_200, GL_COLOR_THEME_BLUE_300, GL_COLOR_THEME_BLUE_400, GL_COLOR_THEME_BLUE_50, GL_COLOR_THEME_BLUE_500, GL_COLOR_THEME_BLUE_600, GL_COLOR_THEME_BLUE_700, GL_COLOR_THEME_BLUE_800, GL_COLOR_THEME_BLUE_900, GL_COLOR_THEME_BLUE_950, GL_COLOR_THEME_GREEN_10, GL_COLOR_THEME_GREEN_100, GL_COLOR_THEME_GREEN_200, GL_COLOR_THEME_GREEN_300, GL_COLOR_THEME_GREEN_400, GL_COLOR_THEME_GREEN_50, GL_COLOR_THEME_GREEN_500, GL_COLOR_THEME_GREEN_600, GL_COLOR_THEME_GREEN_700, GL_COLOR_THEME_GREEN_800, GL_COLOR_THEME_GREEN_900, GL_COLOR_THEME_GREEN_950, GL_COLOR_THEME_INDIGO_10, GL_COLOR_THEME_INDIGO_100, GL_COLOR_THEME_INDIGO_200, GL_COLOR_THEME_INDIGO_300, GL_COLOR_THEME_INDIGO_400, GL_COLOR_THEME_INDIGO_50, GL_COLOR_THEME_INDIGO_500, GL_COLOR_THEME_INDIGO_600, GL_COLOR_THEME_INDIGO_700, GL_COLOR_THEME_INDIGO_800, GL_COLOR_THEME_INDIGO_900, GL_COLOR_THEME_INDIGO_950, GL_COLOR_THEME_LIGHT_BLUE_10, GL_COLOR_THEME_LIGHT_BLUE_100, GL_COLOR_THEME_LIGHT_BLUE_200, GL_COLOR_THEME_LIGHT_BLUE_300, GL_COLOR_THEME_LIGHT_BLUE_400, GL_COLOR_THEME_LIGHT_BLUE_50, GL_COLOR_THEME_LIGHT_BLUE_500, GL_COLOR_THEME_LIGHT_BLUE_600, GL_COLOR_THEME_LIGHT_BLUE_700, GL_COLOR_THEME_LIGHT_BLUE_800, GL_COLOR_THEME_LIGHT_BLUE_900, GL_COLOR_THEME_LIGHT_BLUE_950, GL_COLOR_THEME_LIGHT_RED_10, GL_COLOR_THEME_LIGHT_RED_100, GL_COLOR_THEME_LIGHT_RED_200, GL_COLOR_THEME_LIGHT_RED_300, GL_COLOR_THEME_LIGHT_RED_400, GL_COLOR_THEME_LIGHT_RED_50, GL_COLOR_THEME_LIGHT_RED_500, GL_COLOR_THEME_LIGHT_RED_600, GL_COLOR_THEME_LIGHT_RED_700, GL_COLOR_THEME_LIGHT_RED_800, GL_COLOR_THEME_LIGHT_RED_900, GL_COLOR_THEME_LIGHT_RED_950, GL_COLOR_THEME_RED_10, GL_COLOR_THEME_RED_100, GL_COLOR_THEME_RED_200, GL_COLOR_THEME_RED_300, GL_COLOR_THEME_RED_400, GL_COLOR_THEME_RED_50, GL_COLOR_THEME_RED_500, GL_COLOR_THEME_RED_600, GL_COLOR_THEME_RED_700, GL_COLOR_THEME_RED_800, GL_COLOR_THEME_RED_900, GL_COLOR_THEME_RED_950, GL_CONTROL_BACKGROUND_COLOR_DEFAULT, GL_CONTROL_BACKGROUND_COLOR_DISABLED, GL_CONTROL_BACKGROUND_COLOR_SELECTED_DEFAULT, GL_CONTROL_BACKGROUND_COLOR_SELECTED_FOCUS, GL_CONTROL_BACKGROUND_COLOR_SELECTED_HOVER, GL_CONTROL_BORDER_COLOR_DEFAULT, GL_CONTROL_BORDER_COLOR_DISABLED, GL_CONTROL_BORDER_COLOR_ERROR, GL_CONTROL_BORDER_COLOR_FOCUS, GL_CONTROL_BORDER_COLOR_HOVER, GL_CONTROL_INDICATOR_COLOR_DISABLED, GL_CONTROL_INDICATOR_COLOR_SELECTED, GL_CONTROL_PLACEHOLDER_COLOR, GL_CONTROL_TEXT_COLOR_ERROR, GL_CONTROL_TEXT_COLOR_VALID, GL_FEEDBACK_BACKGROUND_COLOR_STRONG, GL_FEEDBACK_DANGER_BACKGROUND_COLOR, GL_FEEDBACK_DANGER_ICON_COLOR, GL_FEEDBACK_ICON_COLOR_STRONG, GL_FEEDBACK_INFO_BACKGROUND_COLOR, GL_FEEDBACK_INFO_ICON_COLOR, GL_FEEDBACK_LINK_COLOR_STRONG, GL_FEEDBACK_NEUTRAL_BACKGROUND_COLOR, GL_FEEDBACK_NEUTRAL_ICON_COLOR, GL_FEEDBACK_SUCCESS_BACKGROUND_COLOR, GL_FEEDBACK_SUCCESS_ICON_COLOR, GL_FEEDBACK_TEXT_COLOR_STRONG, GL_FEEDBACK_WARNING_BACKGROUND_COLOR, GL_FEEDBACK_WARNING_ICON_COLOR, GL_FOCUS_RING_INNER_COLOR, GL_FOCUS_RING_OUTER_COLOR, GL_ICON_COLOR_DANGER, GL_ICON_COLOR_DEFAULT, GL_ICON_COLOR_DISABLED, GL_ICON_COLOR_INFO, GL_ICON_COLOR_LINK, GL_ICON_COLOR_STRONG, GL_ICON_COLOR_SUBTLE, GL_ICON_COLOR_SUCCESS, GL_ICON_COLOR_WARNING, 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_POPOVER_BACKGROUND_COLOR, GL_SKELETON_LOADER_BACKGROUND_COLOR, GL_SKELETON_LOADER_SHIMMER_COLOR, GL_STATUS_BRAND_BACKGROUND_COLOR_ACTIVE, GL_STATUS_BRAND_BACKGROUND_COLOR_DEFAULT, GL_STATUS_BRAND_BORDER_COLOR_HOVER, GL_STATUS_BRAND_ICON_COLOR_ACTIVE, GL_STATUS_BRAND_ICON_COLOR_DEFAULT, GL_STATUS_BRAND_ICON_COLOR_FOCUS, GL_STATUS_BRAND_ICON_COLOR_HOVER, GL_STATUS_BRAND_TEXT_COLOR_ACTIVE, GL_STATUS_BRAND_TEXT_COLOR_DEFAULT, GL_STATUS_BRAND_TEXT_COLOR_FOCUS, GL_STATUS_BRAND_TEXT_COLOR_HOVER, GL_STATUS_DANGER_BACKGROUND_COLOR_ACTIVE, GL_STATUS_DANGER_BACKGROUND_COLOR_DEFAULT, GL_STATUS_DANGER_BORDER_COLOR_HOVER, GL_STATUS_DANGER_ICON_COLOR_ACTIVE, GL_STATUS_DANGER_ICON_COLOR_DEFAULT, GL_STATUS_DANGER_ICON_COLOR_FOCUS, GL_STATUS_DANGER_ICON_COLOR_HOVER, GL_STATUS_DANGER_TEXT_COLOR_ACTIVE, GL_STATUS_DANGER_TEXT_COLOR_DEFAULT, GL_STATUS_DANGER_TEXT_COLOR_FOCUS, GL_STATUS_DANGER_TEXT_COLOR_HOVER, GL_STATUS_INFO_BACKGROUND_COLOR_ACTIVE, GL_STATUS_INFO_BACKGROUND_COLOR_DEFAULT, GL_STATUS_INFO_BORDER_COLOR_HOVER, GL_STATUS_INFO_ICON_COLOR_ACTIVE, GL_STATUS_INFO_ICON_COLOR_DEFAULT, GL_STATUS_INFO_ICON_COLOR_FOCUS, GL_STATUS_INFO_ICON_COLOR_HOVER, GL_STATUS_INFO_TEXT_COLOR_ACTIVE, GL_STATUS_INFO_TEXT_COLOR_DEFAULT, GL_STATUS_INFO_TEXT_COLOR_FOCUS, GL_STATUS_INFO_TEXT_COLOR_HOVER, GL_STATUS_MUTED_BACKGROUND_COLOR_ACTIVE, GL_STATUS_MUTED_BACKGROUND_COLOR_DEFAULT, GL_STATUS_MUTED_BORDER_COLOR_HOVER, GL_STATUS_MUTED_ICON_COLOR_ACTIVE, GL_STATUS_MUTED_ICON_COLOR_DEFAULT, GL_STATUS_MUTED_ICON_COLOR_FOCUS, GL_STATUS_MUTED_ICON_COLOR_HOVER, GL_STATUS_MUTED_TEXT_COLOR_ACTIVE, GL_STATUS_MUTED_TEXT_COLOR_DEFAULT, GL_STATUS_MUTED_TEXT_COLOR_FOCUS, GL_STATUS_MUTED_TEXT_COLOR_HOVER, GL_STATUS_NEUTRAL_BACKGROUND_COLOR_ACTIVE, GL_STATUS_NEUTRAL_BACKGROUND_COLOR_DEFAULT, GL_STATUS_NEUTRAL_BORDER_COLOR_HOVER, GL_STATUS_NEUTRAL_ICON_COLOR_ACTIVE, GL_STATUS_NEUTRAL_ICON_COLOR_DEFAULT, GL_STATUS_NEUTRAL_ICON_COLOR_FOCUS, GL_STATUS_NEUTRAL_ICON_COLOR_HOVER, GL_STATUS_NEUTRAL_TEXT_COLOR_ACTIVE, GL_STATUS_NEUTRAL_TEXT_COLOR_DEFAULT, GL_STATUS_NEUTRAL_TEXT_COLOR_FOCUS, GL_STATUS_NEUTRAL_TEXT_COLOR_HOVER, GL_STATUS_SUCCESS_BACKGROUND_COLOR_ACTIVE, GL_STATUS_SUCCESS_BACKGROUND_COLOR_DEFAULT, GL_STATUS_SUCCESS_BORDER_COLOR_HOVER, GL_STATUS_SUCCESS_ICON_COLOR_ACTIVE, GL_STATUS_SUCCESS_ICON_COLOR_DEFAULT, GL_STATUS_SUCCESS_ICON_COLOR_FOCUS, GL_STATUS_SUCCESS_ICON_COLOR_HOVER, GL_STATUS_SUCCESS_TEXT_COLOR_ACTIVE, GL_STATUS_SUCCESS_TEXT_COLOR_DEFAULT, GL_STATUS_SUCCESS_TEXT_COLOR_FOCUS, GL_STATUS_SUCCESS_TEXT_COLOR_HOVER, GL_STATUS_WARNING_BACKGROUND_COLOR_ACTIVE, GL_STATUS_WARNING_BACKGROUND_COLOR_DEFAULT, GL_STATUS_WARNING_BORDER_COLOR_HOVER, GL_STATUS_WARNING_ICON_COLOR_ACTIVE, GL_STATUS_WARNING_ICON_COLOR_DEFAULT, GL_STATUS_WARNING_ICON_COLOR_FOCUS, GL_STATUS_WARNING_ICON_COLOR_HOVER, GL_STATUS_WARNING_TEXT_COLOR_ACTIVE, GL_STATUS_WARNING_TEXT_COLOR_DEFAULT, GL_STATUS_WARNING_TEXT_COLOR_FOCUS, GL_STATUS_WARNING_TEXT_COLOR_HOVER, 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 };
610
+ 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_ACTION_BACKGROUND_COLOR_DISABLED, GL_ACTION_BORDER_COLOR_DISABLED, GL_ACTION_CONFIRM_BACKGROUND_COLOR_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_HOVER, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_HOVER, GL_ACTION_CONFIRM_BACKGROUND_COLOR_STRONG_SELECTED, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_ACTIVE, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_DEFAULT, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_FOCUS, GL_ACTION_CONFIRM_BACKGROUND_COLOR_SUBTLE_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_ACTIVE, GL_ACTION_CONFIRM_BORDER_COLOR_DEFAULT, GL_ACTION_CONFIRM_BORDER_COLOR_FOCUS, GL_ACTION_CONFIRM_BORDER_COLOR_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_ACTIVE, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_DEFAULT, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_FOCUS, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_HOVER, GL_ACTION_CONFIRM_BORDER_COLOR_STRONG_SELECTED, GL_ACTION_CONFIRM_ICON_COLOR_ACTIVE, GL_ACTION_CONFIRM_ICON_COLOR_DEFAULT, GL_ACTION_CONFIRM_ICON_COLOR_FOCUS, GL_ACTION_CONFIRM_ICON_COLOR_HOVER, GL_ACTION_CONFIRM_ICON_COLOR_STRONG, GL_ACTION_CONFIRM_TEXT_COLOR_ACTIVE, GL_ACTION_CONFIRM_TEXT_COLOR_DEFAULT, GL_ACTION_CONFIRM_TEXT_COLOR_FOCUS, GL_ACTION_CONFIRM_TEXT_COLOR_HOVER, GL_ACTION_CONFIRM_TEXT_COLOR_STRONG, GL_ACTION_ICON_COLOR_DISABLED, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_HOVER, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_HOVER, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_ACTIVE, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_DEFAULT, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_FOCUS, GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_HOVER, GL_ACTION_NEUTRAL_BORDER_COLOR_ACTIVE, GL_ACTION_NEUTRAL_BORDER_COLOR_DEFAULT, GL_ACTION_NEUTRAL_BORDER_COLOR_FOCUS, GL_ACTION_NEUTRAL_BORDER_COLOR_HOVER, GL_ACTION_NEUTRAL_BORDER_COLOR_SELECTED, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_ACTIVE, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_DEFAULT, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_FOCUS, GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_HOVER, GL_ACTION_NEUTRAL_ICON_COLOR_ACTIVE, GL_ACTION_NEUTRAL_ICON_COLOR_DEFAULT, GL_ACTION_NEUTRAL_ICON_COLOR_FOCUS, GL_ACTION_NEUTRAL_ICON_COLOR_HOVER, GL_ACTION_NEUTRAL_ICON_COLOR_STRONG, GL_ACTION_NEUTRAL_TEXT_COLOR_ACTIVE, GL_ACTION_NEUTRAL_TEXT_COLOR_DEFAULT, GL_ACTION_NEUTRAL_TEXT_COLOR_FOCUS, GL_ACTION_NEUTRAL_TEXT_COLOR_HOVER, GL_ACTION_NEUTRAL_TEXT_COLOR_STRONG, GL_ACTION_TEXT_COLOR_DISABLED, GL_AVATAR_BORDER_COLOR_DEFAULT, GL_AVATAR_BORDER_COLOR_HOVER, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_BLUE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_GREEN, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_NEUTRAL, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_ORANGE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_PURPLE, GL_AVATAR_FALLBACK_BACKGROUND_COLOR_RED, GL_BACKGROUND_COLOR_DEFAULT, GL_BACKGROUND_COLOR_DISABLED, GL_BACKGROUND_COLOR_OVERLAY, GL_BACKGROUND_COLOR_STRONG, GL_BACKGROUND_COLOR_SUBTLE, GL_BANNER_INTRO_BORDER_COLOR, GL_BANNER_PROMO_BACKGROUND_COLOR, GL_BORDER_COLOR_DEFAULT, GL_BORDER_COLOR_STRONG, GL_BORDER_COLOR_SUBTLE, GL_BORDER_COLOR_TRANSPARENT, GL_BREADCRUMB_SEPARATOR_COLOR, GL_COLOR_ALPHA_0, GL_COLOR_ALPHA_DARK_16, GL_COLOR_ALPHA_DARK_2, GL_COLOR_ALPHA_DARK_24, GL_COLOR_ALPHA_DARK_4, GL_COLOR_ALPHA_DARK_6, GL_COLOR_ALPHA_DARK_8, GL_COLOR_ALPHA_LIGHT_16, GL_COLOR_ALPHA_LIGHT_2, GL_COLOR_ALPHA_LIGHT_24, GL_COLOR_ALPHA_LIGHT_36, GL_COLOR_ALPHA_LIGHT_4, GL_COLOR_ALPHA_LIGHT_6, GL_COLOR_ALPHA_LIGHT_8, 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_COLOR_THEME_BLUE_10, GL_COLOR_THEME_BLUE_100, GL_COLOR_THEME_BLUE_200, GL_COLOR_THEME_BLUE_300, GL_COLOR_THEME_BLUE_400, GL_COLOR_THEME_BLUE_50, GL_COLOR_THEME_BLUE_500, GL_COLOR_THEME_BLUE_600, GL_COLOR_THEME_BLUE_700, GL_COLOR_THEME_BLUE_800, GL_COLOR_THEME_BLUE_900, GL_COLOR_THEME_BLUE_950, GL_COLOR_THEME_GREEN_10, GL_COLOR_THEME_GREEN_100, GL_COLOR_THEME_GREEN_200, GL_COLOR_THEME_GREEN_300, GL_COLOR_THEME_GREEN_400, GL_COLOR_THEME_GREEN_50, GL_COLOR_THEME_GREEN_500, GL_COLOR_THEME_GREEN_600, GL_COLOR_THEME_GREEN_700, GL_COLOR_THEME_GREEN_800, GL_COLOR_THEME_GREEN_900, GL_COLOR_THEME_GREEN_950, GL_COLOR_THEME_INDIGO_10, GL_COLOR_THEME_INDIGO_100, GL_COLOR_THEME_INDIGO_200, GL_COLOR_THEME_INDIGO_300, GL_COLOR_THEME_INDIGO_400, GL_COLOR_THEME_INDIGO_50, GL_COLOR_THEME_INDIGO_500, GL_COLOR_THEME_INDIGO_600, GL_COLOR_THEME_INDIGO_700, GL_COLOR_THEME_INDIGO_800, GL_COLOR_THEME_INDIGO_900, GL_COLOR_THEME_INDIGO_950, GL_COLOR_THEME_LIGHT_BLUE_10, GL_COLOR_THEME_LIGHT_BLUE_100, GL_COLOR_THEME_LIGHT_BLUE_200, GL_COLOR_THEME_LIGHT_BLUE_300, GL_COLOR_THEME_LIGHT_BLUE_400, GL_COLOR_THEME_LIGHT_BLUE_50, GL_COLOR_THEME_LIGHT_BLUE_500, GL_COLOR_THEME_LIGHT_BLUE_600, GL_COLOR_THEME_LIGHT_BLUE_700, GL_COLOR_THEME_LIGHT_BLUE_800, GL_COLOR_THEME_LIGHT_BLUE_900, GL_COLOR_THEME_LIGHT_BLUE_950, GL_COLOR_THEME_LIGHT_RED_10, GL_COLOR_THEME_LIGHT_RED_100, GL_COLOR_THEME_LIGHT_RED_200, GL_COLOR_THEME_LIGHT_RED_300, GL_COLOR_THEME_LIGHT_RED_400, GL_COLOR_THEME_LIGHT_RED_50, GL_COLOR_THEME_LIGHT_RED_500, GL_COLOR_THEME_LIGHT_RED_600, GL_COLOR_THEME_LIGHT_RED_700, GL_COLOR_THEME_LIGHT_RED_800, GL_COLOR_THEME_LIGHT_RED_900, GL_COLOR_THEME_LIGHT_RED_950, GL_COLOR_THEME_RED_10, GL_COLOR_THEME_RED_100, GL_COLOR_THEME_RED_200, GL_COLOR_THEME_RED_300, GL_COLOR_THEME_RED_400, GL_COLOR_THEME_RED_50, GL_COLOR_THEME_RED_500, GL_COLOR_THEME_RED_600, GL_COLOR_THEME_RED_700, GL_COLOR_THEME_RED_800, GL_COLOR_THEME_RED_900, GL_COLOR_THEME_RED_950, GL_CONTROL_BACKGROUND_COLOR_DEFAULT, GL_CONTROL_BACKGROUND_COLOR_DISABLED, GL_CONTROL_BACKGROUND_COLOR_SELECTED_DEFAULT, GL_CONTROL_BACKGROUND_COLOR_SELECTED_FOCUS, GL_CONTROL_BACKGROUND_COLOR_SELECTED_HOVER, GL_CONTROL_BORDER_COLOR_DEFAULT, GL_CONTROL_BORDER_COLOR_DISABLED, GL_CONTROL_BORDER_COLOR_ERROR, GL_CONTROL_BORDER_COLOR_FOCUS, GL_CONTROL_BORDER_COLOR_HOVER, GL_CONTROL_INDICATOR_COLOR_DISABLED, GL_CONTROL_INDICATOR_COLOR_SELECTED, GL_CONTROL_PLACEHOLDER_COLOR, GL_CONTROL_TEXT_COLOR_ERROR, GL_CONTROL_TEXT_COLOR_VALID, GL_FEEDBACK_BACKGROUND_COLOR_STRONG, GL_FEEDBACK_DANGER_BACKGROUND_COLOR, GL_FEEDBACK_DANGER_ICON_COLOR, GL_FEEDBACK_ICON_COLOR_STRONG, GL_FEEDBACK_INFO_BACKGROUND_COLOR, GL_FEEDBACK_INFO_ICON_COLOR, GL_FEEDBACK_LINK_COLOR_STRONG, GL_FEEDBACK_NEUTRAL_BACKGROUND_COLOR, GL_FEEDBACK_NEUTRAL_ICON_COLOR, GL_FEEDBACK_SUCCESS_BACKGROUND_COLOR, GL_FEEDBACK_SUCCESS_ICON_COLOR, GL_FEEDBACK_TEXT_COLOR_STRONG, GL_FEEDBACK_WARNING_BACKGROUND_COLOR, GL_FEEDBACK_WARNING_ICON_COLOR, GL_FOCUS_RING_INNER_COLOR, GL_FOCUS_RING_OUTER_COLOR, GL_ICON_COLOR_DANGER, GL_ICON_COLOR_DEFAULT, GL_ICON_COLOR_DISABLED, GL_ICON_COLOR_INFO, GL_ICON_COLOR_LINK, GL_ICON_COLOR_STRONG, GL_ICON_COLOR_SUBTLE, GL_ICON_COLOR_SUCCESS, GL_ICON_COLOR_WARNING, 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_POPOVER_BACKGROUND_COLOR, GL_SKELETON_LOADER_BACKGROUND_COLOR, GL_SKELETON_LOADER_SHIMMER_COLOR, GL_STATUS_BRAND_BACKGROUND_COLOR_ACTIVE, GL_STATUS_BRAND_BACKGROUND_COLOR_DEFAULT, GL_STATUS_BRAND_BORDER_COLOR_HOVER, GL_STATUS_BRAND_ICON_COLOR_ACTIVE, GL_STATUS_BRAND_ICON_COLOR_DEFAULT, GL_STATUS_BRAND_ICON_COLOR_FOCUS, GL_STATUS_BRAND_ICON_COLOR_HOVER, GL_STATUS_BRAND_TEXT_COLOR_ACTIVE, GL_STATUS_BRAND_TEXT_COLOR_DEFAULT, GL_STATUS_BRAND_TEXT_COLOR_FOCUS, GL_STATUS_BRAND_TEXT_COLOR_HOVER, GL_STATUS_DANGER_BACKGROUND_COLOR_ACTIVE, GL_STATUS_DANGER_BACKGROUND_COLOR_DEFAULT, GL_STATUS_DANGER_BORDER_COLOR_HOVER, GL_STATUS_DANGER_ICON_COLOR_ACTIVE, GL_STATUS_DANGER_ICON_COLOR_DEFAULT, GL_STATUS_DANGER_ICON_COLOR_FOCUS, GL_STATUS_DANGER_ICON_COLOR_HOVER, GL_STATUS_DANGER_TEXT_COLOR_ACTIVE, GL_STATUS_DANGER_TEXT_COLOR_DEFAULT, GL_STATUS_DANGER_TEXT_COLOR_FOCUS, GL_STATUS_DANGER_TEXT_COLOR_HOVER, GL_STATUS_INFO_BACKGROUND_COLOR_ACTIVE, GL_STATUS_INFO_BACKGROUND_COLOR_DEFAULT, GL_STATUS_INFO_BORDER_COLOR_HOVER, GL_STATUS_INFO_ICON_COLOR_ACTIVE, GL_STATUS_INFO_ICON_COLOR_DEFAULT, GL_STATUS_INFO_ICON_COLOR_FOCUS, GL_STATUS_INFO_ICON_COLOR_HOVER, GL_STATUS_INFO_TEXT_COLOR_ACTIVE, GL_STATUS_INFO_TEXT_COLOR_DEFAULT, GL_STATUS_INFO_TEXT_COLOR_FOCUS, GL_STATUS_INFO_TEXT_COLOR_HOVER, GL_STATUS_MUTED_BACKGROUND_COLOR_ACTIVE, GL_STATUS_MUTED_BACKGROUND_COLOR_DEFAULT, GL_STATUS_MUTED_BORDER_COLOR_HOVER, GL_STATUS_MUTED_ICON_COLOR_ACTIVE, GL_STATUS_MUTED_ICON_COLOR_DEFAULT, GL_STATUS_MUTED_ICON_COLOR_FOCUS, GL_STATUS_MUTED_ICON_COLOR_HOVER, GL_STATUS_MUTED_TEXT_COLOR_ACTIVE, GL_STATUS_MUTED_TEXT_COLOR_DEFAULT, GL_STATUS_MUTED_TEXT_COLOR_FOCUS, GL_STATUS_MUTED_TEXT_COLOR_HOVER, GL_STATUS_NEUTRAL_BACKGROUND_COLOR_ACTIVE, GL_STATUS_NEUTRAL_BACKGROUND_COLOR_DEFAULT, GL_STATUS_NEUTRAL_BORDER_COLOR_HOVER, GL_STATUS_NEUTRAL_ICON_COLOR_ACTIVE, GL_STATUS_NEUTRAL_ICON_COLOR_DEFAULT, GL_STATUS_NEUTRAL_ICON_COLOR_FOCUS, GL_STATUS_NEUTRAL_ICON_COLOR_HOVER, GL_STATUS_NEUTRAL_TEXT_COLOR_ACTIVE, GL_STATUS_NEUTRAL_TEXT_COLOR_DEFAULT, GL_STATUS_NEUTRAL_TEXT_COLOR_FOCUS, GL_STATUS_NEUTRAL_TEXT_COLOR_HOVER, GL_STATUS_SUCCESS_BACKGROUND_COLOR_ACTIVE, GL_STATUS_SUCCESS_BACKGROUND_COLOR_DEFAULT, GL_STATUS_SUCCESS_BORDER_COLOR_HOVER, GL_STATUS_SUCCESS_ICON_COLOR_ACTIVE, GL_STATUS_SUCCESS_ICON_COLOR_DEFAULT, GL_STATUS_SUCCESS_ICON_COLOR_FOCUS, GL_STATUS_SUCCESS_ICON_COLOR_HOVER, GL_STATUS_SUCCESS_TEXT_COLOR_ACTIVE, GL_STATUS_SUCCESS_TEXT_COLOR_DEFAULT, GL_STATUS_SUCCESS_TEXT_COLOR_FOCUS, GL_STATUS_SUCCESS_TEXT_COLOR_HOVER, GL_STATUS_WARNING_BACKGROUND_COLOR_ACTIVE, GL_STATUS_WARNING_BACKGROUND_COLOR_DEFAULT, GL_STATUS_WARNING_BORDER_COLOR_HOVER, GL_STATUS_WARNING_ICON_COLOR_ACTIVE, GL_STATUS_WARNING_ICON_COLOR_DEFAULT, GL_STATUS_WARNING_ICON_COLOR_FOCUS, GL_STATUS_WARNING_ICON_COLOR_HOVER, GL_STATUS_WARNING_TEXT_COLOR_ACTIVE, GL_STATUS_WARNING_TEXT_COLOR_DEFAULT, GL_STATUS_WARNING_TEXT_COLOR_FOCUS, GL_STATUS_WARNING_TEXT_COLOR_HOVER, 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 };
@@ -534,6 +534,7 @@
534
534
  --gl-border-color-strong: var(--gl-color-neutral-400); /* Used for a distinct border that emphasizes an edge or boundaries. */
535
535
  --gl-border-color-subtle: var(--gl-color-neutral-50); /* Used for a border that has a little more definition, or is used in combination with a subtle background. */
536
536
  --gl-border-color-default: var(--gl-color-neutral-100); /* Used for the default border color. */
537
+ --gl-background-color-overlay: var(--gl-color-alpha-dark-24); /* Used for an overlay that covers other content. */
537
538
  --gl-background-color-disabled: var(--gl-color-neutral-10); /* Used to identify a disabled section. */
538
539
  --gl-background-color-strong: var(--gl-color-neutral-50); /* Used to make the background easily stand out from the default. */
539
540
  --gl-background-color-subtle: var(--gl-color-neutral-10); /* Used to slightly differentiate the background from the default. */
@@ -534,6 +534,7 @@
534
534
  --gl-border-color-strong: var(--gl-color-neutral-400); /* Used for a distinct border that emphasizes an edge or boundaries. */
535
535
  --gl-border-color-subtle: var(--gl-color-neutral-900); /* Used for a border that has a little more definition, or is used in combination with a subtle background. */
536
536
  --gl-border-color-default: var(--gl-color-neutral-800); /* Used for the default border color. */
537
+ --gl-background-color-overlay: rgba(0,0,0,0.64); /* Used for an overlay that covers other content. */
537
538
  --gl-background-color-disabled: var(--gl-color-neutral-900); /* Used to identify a disabled section. */
538
539
  --gl-background-color-strong: var(--gl-color-neutral-800); /* Used to make the background easily stand out from the default. */
539
540
  --gl-background-color-subtle: var(--gl-color-neutral-900); /* Used to slightly differentiate the background from the default. */
@@ -74,6 +74,7 @@ export const GL_BACKGROUND_COLOR_DEFAULT = '#1f1e24'; // Used for the default ba
74
74
  export const GL_BACKGROUND_COLOR_SUBTLE = '#333238'; // Used to slightly differentiate the background from the default.
75
75
  export const GL_BACKGROUND_COLOR_STRONG = '#434248'; // Used to make the background easily stand out from the default.
76
76
  export const GL_BACKGROUND_COLOR_DISABLED = '#333238'; // Used to identify a disabled section.
77
+ export const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(0,0,0,0.64)'; // Used for an overlay that covers other content.
77
78
  export const GL_BORDER_COLOR_DEFAULT = '#434248'; // Used for the default border color.
78
79
  export const GL_BORDER_COLOR_SUBTLE = '#333238'; // Used for a border that has a little more definition, or is used in combination with a subtle background.
79
80
  export const GL_BORDER_COLOR_STRONG = '#89888d'; // Used for a distinct border that emphasizes an edge or boundaries.
@@ -74,6 +74,7 @@ export const GL_BACKGROUND_COLOR_DEFAULT = '#fff'; // Used for the default backg
74
74
  export const GL_BACKGROUND_COLOR_SUBTLE = '#fbfafd'; // Used to slightly differentiate the background from the default.
75
75
  export const GL_BACKGROUND_COLOR_STRONG = '#ececef'; // Used to make the background easily stand out from the default.
76
76
  export const GL_BACKGROUND_COLOR_DISABLED = '#fbfafd'; // Used to identify a disabled section.
77
+ export const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(31, 30, 36, 0.24)'; // Used for an overlay that covers other content.
77
78
  export const GL_BORDER_COLOR_DEFAULT = '#dcdcde'; // Used for the default border color.
78
79
  export const GL_BORDER_COLOR_SUBTLE = '#ececef'; // Used for a border that has a little more definition, or is used in combination with a subtle background.
79
80
  export const GL_BORDER_COLOR_STRONG = '#89888d'; // Used for a distinct border that emphasizes an edge or boundaries.
@@ -1775,6 +1775,28 @@
1775
1775
  "color",
1776
1776
  "disabled"
1777
1777
  ]
1778
+ },
1779
+ "overlay": {
1780
+ "value": "rgba(0,0,0,0.64)",
1781
+ "$type": "color",
1782
+ "comment": "Used for an overlay that covers other content.",
1783
+ "filePath": "src/tokens/background.tokens.json",
1784
+ "isSource": true,
1785
+ "original": {
1786
+ "value": {
1787
+ "default": "{color.alpha.dark.24}",
1788
+ "dark": "rgba(0,0,0,0.64)"
1789
+ },
1790
+ "$type": "color",
1791
+ "comment": "Used for an overlay that covers other content."
1792
+ },
1793
+ "name": "BACKGROUND_COLOR_OVERLAY",
1794
+ "attributes": {},
1795
+ "path": [
1796
+ "background",
1797
+ "color",
1798
+ "overlay"
1799
+ ]
1778
1800
  }
1779
1801
  }
1780
1802
  },
@@ -1775,6 +1775,28 @@
1775
1775
  "color",
1776
1776
  "disabled"
1777
1777
  ]
1778
+ },
1779
+ "overlay": {
1780
+ "value": "rgba(31, 30, 36, 0.24)",
1781
+ "$type": "color",
1782
+ "comment": "Used for an overlay that covers other content.",
1783
+ "filePath": "src/tokens/background.tokens.json",
1784
+ "isSource": true,
1785
+ "original": {
1786
+ "value": {
1787
+ "default": "{color.alpha.dark.24}",
1788
+ "dark": "rgba(0,0,0,0.64)"
1789
+ },
1790
+ "$type": "color",
1791
+ "comment": "Used for an overlay that covers other content."
1792
+ },
1793
+ "name": "BACKGROUND_COLOR_OVERLAY",
1794
+ "attributes": {},
1795
+ "path": [
1796
+ "background",
1797
+ "color",
1798
+ "overlay"
1799
+ ]
1778
1800
  }
1779
1801
  }
1780
1802
  },
@@ -532,6 +532,7 @@ $gl-border-color-transparent: $gl-color-alpha-0; // Used when a border needs to
532
532
  $gl-border-color-strong: $gl-color-neutral-400; // Used for a distinct border that emphasizes an edge or boundaries.
533
533
  $gl-border-color-subtle: $gl-color-neutral-900; // Used for a border that has a little more definition, or is used in combination with a subtle background.
534
534
  $gl-border-color-default: $gl-color-neutral-800; // Used for the default border color.
535
+ $gl-background-color-overlay: rgba(0,0,0,0.64); // Used for an overlay that covers other content.
535
536
  $gl-background-color-disabled: $gl-color-neutral-900; // Used to identify a disabled section.
536
537
  $gl-background-color-strong: $gl-color-neutral-800; // Used to make the background easily stand out from the default.
537
538
  $gl-background-color-subtle: $gl-color-neutral-900; // Used to slightly differentiate the background from the default.
@@ -532,6 +532,7 @@ $gl-border-color-transparent: $gl-color-alpha-0; // Used when a border needs to
532
532
  $gl-border-color-strong: $gl-color-neutral-400; // Used for a distinct border that emphasizes an edge or boundaries.
533
533
  $gl-border-color-subtle: $gl-color-neutral-50; // Used for a border that has a little more definition, or is used in combination with a subtle background.
534
534
  $gl-border-color-default: $gl-color-neutral-100; // Used for the default border color.
535
+ $gl-background-color-overlay: $gl-color-alpha-dark-24; // Used for an overlay that covers other content.
535
536
  $gl-background-color-disabled: $gl-color-neutral-10; // Used to identify a disabled section.
536
537
  $gl-background-color-strong: $gl-color-neutral-50; // Used to make the background easily stand out from the default.
537
538
  $gl-background-color-subtle: $gl-color-neutral-10; // Used to slightly differentiate the background from the default.
@@ -74,6 +74,7 @@ $gl-background-color-default: var(--gl-background-color-default);
74
74
  $gl-background-color-subtle: var(--gl-background-color-subtle);
75
75
  $gl-background-color-strong: var(--gl-background-color-strong);
76
76
  $gl-background-color-disabled: var(--gl-background-color-disabled);
77
+ $gl-background-color-overlay: var(--gl-background-color-overlay);
77
78
  $gl-border-color-default: var(--gl-border-color-default);
78
79
  $gl-border-color-subtle: var(--gl-border-color-subtle);
79
80
  $gl-border-color-strong: var(--gl-border-color-strong);
@@ -223,6 +223,8 @@ const backgroundColors = {
223
223
  'var(--gl-background-color-strong, var(--gl-color-neutral-50, #ececef))',
224
224
  disabled:
225
225
  'var(--gl-background-color-disabled, var(--gl-color-neutral-10, #fbfafd))',
226
+ overlay:
227
+ 'var(--gl-background-color-overlay, var(--gl-color-alpha-dark-24, rgba(31, 30, 36, 0.24)))',
226
228
  };
227
229
  const borderColors = {
228
230
  default:
@@ -1,5 +1,11 @@
1
+ import escape from 'lodash/escape';
1
2
  import { i18n } from '../config';
2
3
 
4
+ const defaultPluralHandler = (n, singleValue, pluralValue) => {
5
+ const value = n === 1 ? singleValue : pluralValue;
6
+ return value.replace(/%d/g, n);
7
+ };
8
+
3
9
  /**
4
10
  * Mark a label as translatable.
5
11
  *
@@ -12,4 +18,46 @@ const translate = (key, defaultValue) => {
12
18
  return (_i18n$key = i18n[key]) !== null && _i18n$key !== void 0 ? _i18n$key : defaultValue;
13
19
  };
14
20
 
15
- export { translate };
21
+ /**
22
+ * Marks a label as translatable and pluralized.
23
+ *
24
+ * @param {*} key Translation key to be leveraged by the consumer to provide a generic translation at configuration time.
25
+ * @param {*} singularValue The singular value to be relied on if the consumer doesn't have translation capabilities.
26
+ * @param {*} pluralValue The plural value to be relied on if the consumer doesn't have translation capabilities.
27
+ * @returns {function} A function that takes a number and returns the pluralized translated label.
28
+ */
29
+ const translatePlural = (key, singularValue, pluralValue) => {
30
+ if (i18n[key]) {
31
+ return i18n[key];
32
+ }
33
+ return x => defaultPluralHandler(x, singularValue, pluralValue);
34
+ };
35
+
36
+ /**
37
+ * Very limited implementation of sprintf supporting only named parameters.
38
+ * Copied from the GitLab repo: https://gitlab.com/gitlab-org/gitlab/-/blob/0dff8b02accb3dccbf6cd31236834c37013aad59/app/assets/javascripts/locale/sprintf.js.
39
+ * @param {string} input - (translated) text with parameters (e.g. '%{num_users} users use us')
40
+ * @param {Object.<string, string|number>} [parameters] - object mapping parameter names to values (e.g. { num_users: 5 })
41
+ * @param {boolean} [escapeParameters=true] - whether parameter values should be escaped (see https://lodash.com/docs/4.17.15#escape)
42
+ * @returns {string} the text with parameters replaces (e.g. '5 users use us')
43
+ * @see https://ruby-doc.org/core-2.3.3/Kernel.html#method-i-sprintf
44
+ * @see https://gitlab.com/gitlab-org/gitlab-foss/issues/37992
45
+ */
46
+ function sprintf(input, parameters) {
47
+ let escapeParameters = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
48
+ let output = input;
49
+ output = output.replace(/%+/g, '%');
50
+ if (parameters) {
51
+ const mappedParameters = new Map(Object.entries(parameters));
52
+ mappedParameters.forEach((key, parameterName) => {
53
+ const parameterValue = mappedParameters.get(parameterName);
54
+ const escapedParameterValue = escapeParameters ? escape(parameterValue) : parameterValue;
55
+ // Pass the param value as a function to ignore special replacement patterns like $` and $'.
56
+ // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace#syntax
57
+ output = output.replace(new RegExp(`%{${parameterName}}`, 'g'), () => escapedParameterValue);
58
+ });
59
+ }
60
+ return output;
61
+ }
62
+
63
+ export { sprintf, translate, translatePlural };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gitlab/ui",
3
- "version": "85.10.0",
3
+ "version": "85.12.0",
4
4
  "description": "GitLab UI Components",
5
5
  "license": "MIT",
6
6
  "main": "dist/index.js",
@@ -167,8 +167,8 @@
167
167
  "module-alias": "^2.2.2",
168
168
  "npm-run-all": "^4.1.5",
169
169
  "pikaday": "^1.8.0",
170
- "playwright": "^1.44.1",
171
- "playwright-core": "^1.44.1",
170
+ "playwright": "^1.45.0",
171
+ "playwright-core": "^1.45.0",
172
172
  "plop": "^2.5.4",
173
173
  "postcss": "8.4.28",
174
174
  "postcss-loader": "^7.0.2",
@@ -39,6 +39,8 @@ body.modal-open {
39
39
  @include gl-rounded-base;
40
40
  @include gl-border-0;
41
41
  box-shadow: $modal-box-shadow;
42
+ background-color: var(--gl-background-color-default);
43
+ color: var(--gl-text-color-default);
42
44
 
43
45
  > :first-child {
44
46
  @include gl-rounded-top-left-base;
@@ -52,19 +54,18 @@ body.modal-open {
52
54
  }
53
55
 
54
56
  .modal-header {
55
- @include gl-bg-white;
56
57
  @include gl-pb-3;
57
58
  @include gl-border-none;
58
59
 
59
60
  .modal-title {
60
61
  @include gl-heading-scale-500;
62
+ color: var(--gl-text-color-heading);
61
63
  }
62
64
  }
63
65
 
64
66
  .modal-body {
65
67
  min-height: $modal-body-height;
66
68
  line-height: $modal-body-line-height;
67
- @include gl-bg-white;
68
69
  position: relative;
69
70
  @include gl-p-5;
70
71
  @include gl-py-3;
@@ -112,8 +113,9 @@ body.modal-open {
112
113
  }
113
114
  }
114
115
 
115
- .modal-backdrop {
116
- @include gl-opacity-5;
116
+ ~ .modal-backdrop {
117
+ background-color: var(--gl-background-color-overlay);
118
+ opacity: 1;
117
119
  }
118
120
 
119
121
  @include media-breakpoint-up(sm) {
@@ -26,7 +26,7 @@ import GlLoadingIcon from '../../loading_icon/loading_icon.vue';
26
26
  import GlIntersectionObserver from '../../../utilities/intersection_observer/intersection_observer.vue';
27
27
  import GlSearchBoxByType from '../../search_box_by_type/search_box_by_type.vue';
28
28
  import GlBaseDropdown from '../base_dropdown/base_dropdown.vue';
29
- import { translate } from '../../../../utils/i18n';
29
+ import { translatePlural } from '../../../../utils/i18n';
30
30
  import GlListboxItem from './listbox_item.vue';
31
31
  import GlListboxSearchInput from './listbox_search_input.vue';
32
32
  import GlListboxGroup from './listbox_group.vue';
@@ -343,13 +343,11 @@ export default {
343
343
  srOnlyResultsLabel: {
344
344
  type: Function,
345
345
  required: false,
346
- default: (count) => {
347
- const fn = translate('GlCollapsibleListbox.srOnlyResultsLabel', 'Results count');
348
- if (typeof fn === 'function') {
349
- return fn(count);
350
- }
351
- return `${count} result${count > 1 ? 's' : ''}`;
352
- },
346
+ default: translatePlural(
347
+ 'GlCollapsibleListbox.srOnlyResultsLabel',
348
+ '%d result',
349
+ '%d results'
350
+ ),
353
351
  },
354
352
  },
355
353
  data() {
@@ -5,6 +5,7 @@ import isFunction from 'lodash/isFunction';
5
5
  import range from 'lodash/range';
6
6
  import { GlBreakpointInstance, breakpoints } from '../../../utils/breakpoints';
7
7
  import { alignOptions, resizeDebounceTime } from '../../../utils/constants';
8
+ import { sprintf, translate } from '../../../utils/i18n';
8
9
  import GlIcon from '../icon/icon.vue';
9
10
  import GlLink from '../link/link.vue';
10
11
 
@@ -145,9 +146,10 @@ export default {
145
146
  * aria-label getter for numbered page items, defaults to "Go to page <page_number>"
146
147
  */
147
148
  labelPage: {
148
- type: Function,
149
+ // note: `Function` support is for legacy reasons
150
+ type: [Function, String],
149
151
  required: false,
150
- default: (page) => `Go to page ${page}`,
152
+ default: translate('GlPagination.labelPage', 'Go to page %{page}'),
151
153
  },
152
154
  /**
153
155
  * Controls the component\'s horizontal alignment, value should be one of "left", "center", "right" or "fill"
@@ -263,10 +265,14 @@ export default {
263
265
  return this.pageIsDisabled(this.value + 1);
264
266
  },
265
267
  prevPageAriaLabel() {
266
- return this.prevPageIsDisabled ? false : this.labelPrevPage || this.labelPage(this.value - 1);
268
+ return this.prevPageIsDisabled
269
+ ? false
270
+ : this.labelPrevPage || this.labelForPage(this.value - 1);
267
271
  },
268
272
  nextPageAriaLabel() {
269
- return this.nextPageIsDisabled ? false : this.labelNextPage || this.labelPage(this.value + 1);
273
+ return this.nextPageIsDisabled
274
+ ? false
275
+ : this.labelNextPage || this.labelForPage(this.value + 1);
270
276
  },
271
277
  prevPageHref() {
272
278
  if (this.prevPageIsDisabled) return false;
@@ -286,6 +292,13 @@ export default {
286
292
  window.removeEventListener('resize', debounce(this.setBreakpoint, resizeDebounceTime));
287
293
  },
288
294
  methods: {
295
+ labelForPage(page) {
296
+ if (isFunction(this.labelPage)) {
297
+ return this.labelPage(page);
298
+ }
299
+
300
+ return sprintf(this.labelPage, { page });
301
+ },
289
302
  setBreakpoint() {
290
303
  this.breakpoint = GlBreakpointInstance.getBreakpointSize();
291
304
  },
@@ -299,7 +312,7 @@ export default {
299
312
  },
300
313
  getPageItem(page, label = null) {
301
314
  const commonAttrs = {
302
- 'aria-label': label || this.labelPage(page),
315
+ 'aria-label': label || this.labelForPage(page),
303
316
  href: '#',
304
317
  class: [],
305
318
  };
@@ -32,6 +32,14 @@
32
32
  },
33
33
  "$type": "color",
34
34
  "$description": "Used to identify a disabled section."
35
+ },
36
+ "overlay": {
37
+ "$value": {
38
+ "default": "{color.alpha.dark.24}",
39
+ "dark": "rgba(0,0,0,0.64)"
40
+ },
41
+ "$type": "color",
42
+ "$description": "Used for an overlay that covers other content."
35
43
  }
36
44
  }
37
45
  }
@@ -534,6 +534,7 @@
534
534
  --gl-border-color-strong: var(--gl-color-neutral-400); /* Used for a distinct border that emphasizes an edge or boundaries. */
535
535
  --gl-border-color-subtle: var(--gl-color-neutral-50); /* Used for a border that has a little more definition, or is used in combination with a subtle background. */
536
536
  --gl-border-color-default: var(--gl-color-neutral-100); /* Used for the default border color. */
537
+ --gl-background-color-overlay: var(--gl-color-alpha-dark-24); /* Used for an overlay that covers other content. */
537
538
  --gl-background-color-disabled: var(--gl-color-neutral-10); /* Used to identify a disabled section. */
538
539
  --gl-background-color-strong: var(--gl-color-neutral-50); /* Used to make the background easily stand out from the default. */
539
540
  --gl-background-color-subtle: var(--gl-color-neutral-10); /* Used to slightly differentiate the background from the default. */
@@ -534,6 +534,7 @@
534
534
  --gl-border-color-strong: var(--gl-color-neutral-400); /* Used for a distinct border that emphasizes an edge or boundaries. */
535
535
  --gl-border-color-subtle: var(--gl-color-neutral-900); /* Used for a border that has a little more definition, or is used in combination with a subtle background. */
536
536
  --gl-border-color-default: var(--gl-color-neutral-800); /* Used for the default border color. */
537
+ --gl-background-color-overlay: rgba(0,0,0,0.64); /* Used for an overlay that covers other content. */
537
538
  --gl-background-color-disabled: var(--gl-color-neutral-900); /* Used to identify a disabled section. */
538
539
  --gl-background-color-strong: var(--gl-color-neutral-800); /* Used to make the background easily stand out from the default. */
539
540
  --gl-background-color-subtle: var(--gl-color-neutral-900); /* Used to slightly differentiate the background from the default. */
@@ -74,6 +74,7 @@ export const GL_BACKGROUND_COLOR_DEFAULT = '#1f1e24'; // Used for the default ba
74
74
  export const GL_BACKGROUND_COLOR_SUBTLE = '#333238'; // Used to slightly differentiate the background from the default.
75
75
  export const GL_BACKGROUND_COLOR_STRONG = '#434248'; // Used to make the background easily stand out from the default.
76
76
  export const GL_BACKGROUND_COLOR_DISABLED = '#333238'; // Used to identify a disabled section.
77
+ export const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(0,0,0,0.64)'; // Used for an overlay that covers other content.
77
78
  export const GL_BORDER_COLOR_DEFAULT = '#434248'; // Used for the default border color.
78
79
  export const GL_BORDER_COLOR_SUBTLE = '#333238'; // Used for a border that has a little more definition, or is used in combination with a subtle background.
79
80
  export const GL_BORDER_COLOR_STRONG = '#89888d'; // Used for a distinct border that emphasizes an edge or boundaries.
@@ -74,6 +74,7 @@ export const GL_BACKGROUND_COLOR_DEFAULT = '#fff'; // Used for the default backg
74
74
  export const GL_BACKGROUND_COLOR_SUBTLE = '#fbfafd'; // Used to slightly differentiate the background from the default.
75
75
  export const GL_BACKGROUND_COLOR_STRONG = '#ececef'; // Used to make the background easily stand out from the default.
76
76
  export const GL_BACKGROUND_COLOR_DISABLED = '#fbfafd'; // Used to identify a disabled section.
77
+ export const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(31, 30, 36, 0.24)'; // Used for an overlay that covers other content.
77
78
  export const GL_BORDER_COLOR_DEFAULT = '#dcdcde'; // Used for the default border color.
78
79
  export const GL_BORDER_COLOR_SUBTLE = '#ececef'; // Used for a border that has a little more definition, or is used in combination with a subtle background.
79
80
  export const GL_BORDER_COLOR_STRONG = '#89888d'; // Used for a distinct border that emphasizes an edge or boundaries.
@@ -1775,6 +1775,28 @@
1775
1775
  "color",
1776
1776
  "disabled"
1777
1777
  ]
1778
+ },
1779
+ "overlay": {
1780
+ "value": "rgba(0,0,0,0.64)",
1781
+ "$type": "color",
1782
+ "comment": "Used for an overlay that covers other content.",
1783
+ "filePath": "src/tokens/background.tokens.json",
1784
+ "isSource": true,
1785
+ "original": {
1786
+ "value": {
1787
+ "default": "{color.alpha.dark.24}",
1788
+ "dark": "rgba(0,0,0,0.64)"
1789
+ },
1790
+ "$type": "color",
1791
+ "comment": "Used for an overlay that covers other content."
1792
+ },
1793
+ "name": "BACKGROUND_COLOR_OVERLAY",
1794
+ "attributes": {},
1795
+ "path": [
1796
+ "background",
1797
+ "color",
1798
+ "overlay"
1799
+ ]
1778
1800
  }
1779
1801
  }
1780
1802
  },
@@ -1775,6 +1775,28 @@
1775
1775
  "color",
1776
1776
  "disabled"
1777
1777
  ]
1778
+ },
1779
+ "overlay": {
1780
+ "value": "rgba(31, 30, 36, 0.24)",
1781
+ "$type": "color",
1782
+ "comment": "Used for an overlay that covers other content.",
1783
+ "filePath": "src/tokens/background.tokens.json",
1784
+ "isSource": true,
1785
+ "original": {
1786
+ "value": {
1787
+ "default": "{color.alpha.dark.24}",
1788
+ "dark": "rgba(0,0,0,0.64)"
1789
+ },
1790
+ "$type": "color",
1791
+ "comment": "Used for an overlay that covers other content."
1792
+ },
1793
+ "name": "BACKGROUND_COLOR_OVERLAY",
1794
+ "attributes": {},
1795
+ "path": [
1796
+ "background",
1797
+ "color",
1798
+ "overlay"
1799
+ ]
1778
1800
  }
1779
1801
  }
1780
1802
  },