CHANGELOG.md

+## [87.2.1](https://gitlab.com/gitlab-org/gitlab-ui/compare/v87.2.0...v87.2.1) (2024-07-28)
+
+
+### Bug Fixes
+
+* action-neutral-foreground design token description ([55de73f](https://gitlab.com/gitlab-org/gitlab-ui/commit/55de73f3848651e7561718eab29036f3f0253338))
+
 # [87.2.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v87.1.2...v87.2.0) (2024-07-26)
 
 

package.json

 {
   "name": "@gitlab/ui",
-  "version": "87.2.0",
+  "version": "87.2.1",
   "description": "GitLab UI Components",
   "license": "MIT",
   "main": "dist/index.js",

src/tokens/action.tokens.json

@@ -41,7 +41,7 @@
               "dark": "{color.neutral.50}"
             },
             "$type": "color",
-            "$description": "Used for the foreground of outlined and borderless neutral actions."
+            "$description": "Used for the foreground of a neutral action in the default state."
           },
           "hover": {
             "$value": "{action.neutral.foreground.color.default}",

src/tokens/build/css/tokens.css

@@ -595,7 +595,7 @@
   --gl-action-confirm-foreground-color-default: var(--gl-color-blue-500); /* Used for the foreground of a confirm (positive) action in the default state. */
   --gl-action-neutral-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a neutral action in the default state. */
   --gl-action-neutral-background-color-focus: var(--gl-action-neutral-background-color-hover); /* Used for the background of a neutral action in the focus state. */
-  --gl-action-neutral-foreground-color-default: var(--gl-color-neutral-900); /* Used for the foreground of outlined and borderless neutral actions. */
+  --gl-action-neutral-foreground-color-default: var(--gl-color-neutral-900); /* Used for the foreground of a neutral action in the default state. */
   --gl-action-disabled-border-color: var(--gl-color-neutral-100); /* Used for the border of a disabled action. */
   --gl-action-disabled-background-color: var(--gl-color-neutral-50); /* Used for the background of a disabled action. */
   --gl-action-disabled-foreground-color: var(--gl-color-neutral-400); /* Used for the foreground of a disabled action. */

src/tokens/build/css/tokens.dark.css

@@ -595,7 +595,7 @@
   --gl-action-confirm-foreground-color-default: var(--gl-color-blue-400); /* Used for the foreground of a confirm (positive) action in the default state. */
   --gl-action-neutral-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a neutral action in the default state. */
   --gl-action-neutral-background-color-focus: var(--gl-action-neutral-background-color-hover); /* Used for the background of a neutral action in the focus state. */
-  --gl-action-neutral-foreground-color-default: var(--gl-color-neutral-50); /* Used for the foreground of outlined and borderless neutral actions. */
+  --gl-action-neutral-foreground-color-default: var(--gl-color-neutral-50); /* Used for the foreground of a neutral action in the default state. */
   --gl-action-disabled-border-color: var(--gl-color-neutral-800); /* Used for the border of a disabled action. */
   --gl-action-disabled-background-color: var(--gl-color-neutral-900); /* Used for the background of a disabled action. */
   --gl-action-disabled-foreground-color: var(--gl-color-neutral-500); /* Used for the foreground of a disabled action. */

src/tokens/build/js/tokens.dark.js

@@ -6,7 +6,7 @@
 export const GL_ACTION_DISABLED_FOREGROUND_COLOR = '#737278'; // Used for the foreground of a disabled action.
 export const GL_ACTION_DISABLED_BACKGROUND_COLOR = '#28272d'; // Used for the background of a disabled action.
 export const GL_ACTION_DISABLED_BORDER_COLOR = '#3a383f'; // Used for the border of a disabled action.
-export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_DEFAULT = '#ececef'; // Used for the foreground of outlined and borderless neutral actions.
+export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_DEFAULT = '#ececef'; // Used for the foreground of a neutral action in the default state.
 export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_HOVER = '#ececef'; // Used for the foreground of a neutral action in the hover state.
 export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_FOCUS = '#ececef'; // Used for the foreground of a neutral action in the focus state.
 export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_ACTIVE = '#ececef'; // Used for the foreground of a neutral action in the active state.

src/tokens/build/js/tokens.js

@@ -6,7 +6,7 @@
 export const GL_ACTION_DISABLED_FOREGROUND_COLOR = '#89888d'; // Used for the foreground of a disabled action.
 export const GL_ACTION_DISABLED_BACKGROUND_COLOR = '#ececef'; // Used for the background of a disabled action.
 export const GL_ACTION_DISABLED_BORDER_COLOR = '#dcdcde'; // Used for the border of a disabled action.
-export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_DEFAULT = '#28272d'; // Used for the foreground of outlined and borderless neutral actions.
+export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_DEFAULT = '#28272d'; // Used for the foreground of a neutral action in the default state.
 export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_HOVER = '#28272d'; // Used for the foreground of a neutral action in the hover state.
 export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_FOCUS = '#28272d'; // Used for the foreground of a neutral action in the focus state.
 export const GL_ACTION_NEUTRAL_FOREGROUND_COLOR_ACTIVE = '#28272d'; // Used for the foreground of a neutral action in the active state.

src/tokens/build/json/tokens.dark.json

@@ -83,7 +83,7 @@
           "default": {
             "value": "#ececef",
             "$type": "color",
-            "comment": "Used for the foreground of outlined and borderless neutral actions.",
+            "comment": "Used for the foreground of a neutral action in the default state.",
             "filePath": "src/tokens/action.tokens.json",
             "isSource": true,
             "original": {
@@ -92,7 +92,7 @@
                 "dark": "{color.neutral.50}"
               },
               "$type": "color",
-              "comment": "Used for the foreground of outlined and borderless neutral actions."
+              "comment": "Used for the foreground of a neutral action in the default state."
             },
             "name": "ACTION_NEUTRAL_FOREGROUND_COLOR_DEFAULT",
             "attributes": {},

src/tokens/build/json/tokens.json

@@ -83,7 +83,7 @@
           "default": {
             "value": "#28272d",
             "$type": "color",
-            "comment": "Used for the foreground of outlined and borderless neutral actions.",
+            "comment": "Used for the foreground of a neutral action in the default state.",
             "filePath": "src/tokens/action.tokens.json",
             "isSource": true,
             "original": {
@@ -92,7 +92,7 @@
                 "dark": "{color.neutral.50}"
               },
               "$type": "color",
-              "comment": "Used for the foreground of outlined and borderless neutral actions."
+              "comment": "Used for the foreground of a neutral action in the default state."
             },
             "name": "ACTION_NEUTRAL_FOREGROUND_COLOR_DEFAULT",
             "attributes": {},

src/tokens/build/scss/_tokens.dark.scss

@@ -593,7 +593,7 @@ $gl-action-confirm-foreground-color-hover: $gl-color-blue-200; // Used for the f
 $gl-action-confirm-foreground-color-default: $gl-color-blue-400; // Used for the foreground of a confirm (positive) action in the default state.
 $gl-action-neutral-border-color-default: $gl-color-alpha-0; // Used for the border of a neutral action in the default state.
 $gl-action-neutral-background-color-focus: $gl-action-neutral-background-color-hover; // Used for the background of a neutral action in the focus state.
-$gl-action-neutral-foreground-color-default: $gl-color-neutral-50; // Used for the foreground of outlined and borderless neutral actions.
+$gl-action-neutral-foreground-color-default: $gl-color-neutral-50; // Used for the foreground of a neutral action in the default state.
 $gl-action-disabled-border-color: $gl-color-neutral-800; // Used for the border of a disabled action.
 $gl-action-disabled-background-color: $gl-color-neutral-900; // Used for the background of a disabled action.
 $gl-action-disabled-foreground-color: $gl-color-neutral-500; // Used for the foreground of a disabled action.

src/tokens/build/scss/_tokens.scss

@@ -593,7 +593,7 @@ $gl-action-confirm-foreground-color-hover: $gl-color-blue-700; // Used for the f
 $gl-action-confirm-foreground-color-default: $gl-color-blue-500; // Used for the foreground of a confirm (positive) action in the default state.
 $gl-action-neutral-border-color-default: $gl-color-alpha-0; // Used for the border of a neutral action in the default state.
 $gl-action-neutral-background-color-focus: $gl-action-neutral-background-color-hover; // Used for the background of a neutral action in the focus state.
-$gl-action-neutral-foreground-color-default: $gl-color-neutral-900; // Used for the foreground of outlined and borderless neutral actions.
+$gl-action-neutral-foreground-color-default: $gl-color-neutral-900; // Used for the foreground of a neutral action in the default state.
 $gl-action-disabled-border-color: $gl-color-neutral-100; // Used for the border of a disabled action.
 $gl-action-disabled-background-color: $gl-color-neutral-50; // Used for the background of a disabled action.
 $gl-action-disabled-foreground-color: $gl-color-neutral-400; // Used for the foreground of a disabled action.