@gitlab/ui 101.0.0 → 101.0.1

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

@@ -881,8 +881,8 @@ const T_WHITE_A_06 = 'rgba(255, 255, 255, 0.06)'; // Use color.alpha.light.6 ins
 const T_WHITE_A_08 = 'rgba(255, 255, 255, 0.08)'; // Use color.alpha.light.8 instead.
 const GL_FEEDBACK_STRONG_BACKGROUND_COLOR = '#3a383f'; // Used for a background associated with strong feedback like a tooltip or toast message.
 const GL_FEEDBACK_STRONG_TEXT_COLOR = '#fff'; // Used for text on a strong feedback background.
-const GL_FEEDBACK_STRONG_ICON_COLOR = '#28272d'; // Used for an icon on a strong feedback background.
-const GL_FEEDBACK_STRONG_LINK_COLOR = '#0b5cad'; // Used for a link on a strong feedback background.
+const GL_FEEDBACK_STRONG_ICON_COLOR = '#fff'; // Used for an icon on a strong feedback background.
+const GL_FEEDBACK_STRONG_LINK_COLOR = '#63a6e9'; // Used for a link on a strong feedback background.
 const GL_FEEDBACK_NEUTRAL_BACKGROUND_COLOR = '#28272d'; // Used for the background of a neutral feedback item when there isn't a specific meaning or urgency.
 const GL_FEEDBACK_NEUTRAL_TEXT_COLOR = '#bfbfc3'; // Used for the text of a neutral feedback item when there isn't a specific meaning or urgency.
 const GL_FEEDBACK_NEUTRAL_ICON_COLOR = '#a4a3a8'; // Used for the icon of a neutral feedback item when there isn't a specific meaning or urgency.

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

@@ -476,8 +476,8 @@
   --gl-feedback-neutral-icon-color: var(--gl-color-neutral-300); /* Used for the icon of a neutral feedback item when there isn't a specific meaning or urgency. */
   --gl-feedback-neutral-text-color: var(--gl-color-neutral-200); /* Used for the text of a neutral feedback item when there isn't a specific meaning or urgency. */
   --gl-feedback-neutral-background-color: var(--gl-color-neutral-900); /* Used for the background of a neutral feedback item when there isn't a specific meaning or urgency. */
-  --gl-feedback-strong-link-color: var(--gl-color-blue-700); /* Used for a link on a strong feedback background. */
-  --gl-feedback-strong-icon-color: var(--gl-color-neutral-900); /* Used for an icon on a strong feedback background. */
+  --gl-feedback-strong-link-color: var(--gl-color-blue-300); /* Used for a link on a strong feedback background. */
+  --gl-feedback-strong-icon-color: var(--gl-color-neutral-0); /* Used for an icon on a strong feedback background. */
   --gl-feedback-strong-text-color: var(--gl-color-neutral-0); /* Used for text on a strong feedback background. */
   --gl-feedback-strong-background-color: var(--gl-color-neutral-800); /* Used for a background associated with strong feedback like a tooltip or toast message. */
   --gl-control-indicator-color-disabled: var(--gl-color-neutral-400); /* Used for disabled checkbox and radio button state indicators. */

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

@@ -881,8 +881,8 @@ export const T_WHITE_A_06 = 'rgba(255, 255, 255, 0.06)'; // Use color.alpha.ligh
 export const T_WHITE_A_08 = 'rgba(255, 255, 255, 0.08)'; // Use color.alpha.light.8 instead.
 export const GL_FEEDBACK_STRONG_BACKGROUND_COLOR = '#3a383f'; // Used for a background associated with strong feedback like a tooltip or toast message.
 export const GL_FEEDBACK_STRONG_TEXT_COLOR = '#fff'; // Used for text on a strong feedback background.
-export const GL_FEEDBACK_STRONG_ICON_COLOR = '#28272d'; // Used for an icon on a strong feedback background.
-export const GL_FEEDBACK_STRONG_LINK_COLOR = '#0b5cad'; // Used for a link on a strong feedback background.
+export const GL_FEEDBACK_STRONG_ICON_COLOR = '#fff'; // Used for an icon on a strong feedback background.
+export const GL_FEEDBACK_STRONG_LINK_COLOR = '#63a6e9'; // Used for a link on a strong feedback background.
 export const GL_FEEDBACK_NEUTRAL_BACKGROUND_COLOR = '#28272d'; // Used for the background of a neutral feedback item when there isn't a specific meaning or urgency.
 export const GL_FEEDBACK_NEUTRAL_TEXT_COLOR = '#bfbfc3'; // Used for the text of a neutral feedback item when there isn't a specific meaning or urgency.
 export const GL_FEEDBACK_NEUTRAL_ICON_COLOR = '#a4a3a8'; // Used for the icon of a neutral feedback item when there isn't a specific meaning or urgency.

package/dist/tokens/json/tokens.dark.json

@@ -20193,16 +20193,13 @@
       },
       "icon": {
         "color": {
-          "value": "#28272d",
+          "value": "#fff",
           "$type": "color",
           "comment": "Used for an icon on a strong feedback background.",
           "filePath": "src/tokens/feedback.tokens.json",
           "isSource": true,
           "original": {
-            "value": {
-              "default": "{color.neutral.0}",
-              "dark": "{color.neutral.900}"
-            },
+            "value": "{color.neutral.0}",
             "$type": "color",
             "comment": "Used for an icon on a strong feedback background."
           },
@@ -20218,16 +20215,13 @@
       },
       "link": {
         "color": {
-          "value": "#0b5cad",
+          "value": "#63a6e9",
           "$type": "color",
           "comment": "Used for a link on a strong feedback background.",
           "filePath": "src/tokens/feedback.tokens.json",
           "isSource": true,
           "original": {
-            "value": {
-              "default": "{color.blue.300}",
-              "dark": "{color.blue.700}"
-            },
+            "value": "{color.blue.300}",
             "$type": "color",
             "comment": "Used for a link on a strong feedback background."
           },

package/dist/tokens/json/tokens.json

@@ -20199,10 +20199,7 @@
           "filePath": "src/tokens/feedback.tokens.json",
           "isSource": true,
           "original": {
-            "value": {
-              "default": "{color.neutral.0}",
-              "dark": "{color.neutral.900}"
-            },
+            "value": "{color.neutral.0}",
             "$type": "color",
             "comment": "Used for an icon on a strong feedback background."
           },
@@ -20224,10 +20221,7 @@
           "filePath": "src/tokens/feedback.tokens.json",
           "isSource": true,
           "original": {
-            "value": {
-              "default": "{color.blue.300}",
-              "dark": "{color.blue.700}"
-            },
+            "value": "{color.blue.300}",
             "$type": "color",
             "comment": "Used for a link on a strong feedback background."
           },

package/dist/tokens/scss/_tokens.dark.scss

@@ -474,8 +474,8 @@ $gl-feedback-info-background-color: $gl-color-blue-950; // Used for the backgrou
 $gl-feedback-neutral-icon-color: $gl-color-neutral-300; // Used for the icon of a neutral feedback item when there isn't a specific meaning or urgency.
 $gl-feedback-neutral-text-color: $gl-color-neutral-200; // Used for the text of a neutral feedback item when there isn't a specific meaning or urgency.
 $gl-feedback-neutral-background-color: $gl-color-neutral-900; // Used for the background of a neutral feedback item when there isn't a specific meaning or urgency.
-$gl-feedback-strong-link-color: $gl-color-blue-700; // Used for a link on a strong feedback background.
-$gl-feedback-strong-icon-color: $gl-color-neutral-900; // Used for an icon on a strong feedback background.
+$gl-feedback-strong-link-color: $gl-color-blue-300; // Used for a link on a strong feedback background.
+$gl-feedback-strong-icon-color: $gl-color-neutral-0; // Used for an icon on a strong feedback background.
 $gl-feedback-strong-text-color: $gl-color-neutral-0; // Used for text on a strong feedback background.
 $gl-feedback-strong-background-color: $gl-color-neutral-800; // Used for a background associated with strong feedback like a tooltip or toast message.
 $gl-control-indicator-color-disabled: $gl-color-neutral-400; // Used for disabled checkbox and radio button state indicators.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gitlab/ui",
-  "version": "101.0.0",
+  "version": "101.0.1",
   "description": "GitLab UI Components",
   "license": "MIT",
   "main": "dist/index.js",

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

@@ -476,8 +476,8 @@
   --gl-feedback-neutral-icon-color: var(--gl-color-neutral-300); /* Used for the icon of a neutral feedback item when there isn't a specific meaning or urgency. */
   --gl-feedback-neutral-text-color: var(--gl-color-neutral-200); /* Used for the text of a neutral feedback item when there isn't a specific meaning or urgency. */
   --gl-feedback-neutral-background-color: var(--gl-color-neutral-900); /* Used for the background of a neutral feedback item when there isn't a specific meaning or urgency. */
-  --gl-feedback-strong-link-color: var(--gl-color-blue-700); /* Used for a link on a strong feedback background. */
-  --gl-feedback-strong-icon-color: var(--gl-color-neutral-900); /* Used for an icon on a strong feedback background. */
+  --gl-feedback-strong-link-color: var(--gl-color-blue-300); /* Used for a link on a strong feedback background. */
+  --gl-feedback-strong-icon-color: var(--gl-color-neutral-0); /* Used for an icon on a strong feedback background. */
   --gl-feedback-strong-text-color: var(--gl-color-neutral-0); /* Used for text on a strong feedback background. */
   --gl-feedback-strong-background-color: var(--gl-color-neutral-800); /* Used for a background associated with strong feedback like a tooltip or toast message. */
   --gl-control-indicator-color-disabled: var(--gl-color-neutral-400); /* Used for disabled checkbox and radio button state indicators. */

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

@@ -881,8 +881,8 @@ export const T_WHITE_A_06 = 'rgba(255, 255, 255, 0.06)'; // Use color.alpha.ligh
 export const T_WHITE_A_08 = 'rgba(255, 255, 255, 0.08)'; // Use color.alpha.light.8 instead.
 export const GL_FEEDBACK_STRONG_BACKGROUND_COLOR = '#3a383f'; // Used for a background associated with strong feedback like a tooltip or toast message.
 export const GL_FEEDBACK_STRONG_TEXT_COLOR = '#fff'; // Used for text on a strong feedback background.
-export const GL_FEEDBACK_STRONG_ICON_COLOR = '#28272d'; // Used for an icon on a strong feedback background.
-export const GL_FEEDBACK_STRONG_LINK_COLOR = '#0b5cad'; // Used for a link on a strong feedback background.
+export const GL_FEEDBACK_STRONG_ICON_COLOR = '#fff'; // Used for an icon on a strong feedback background.
+export const GL_FEEDBACK_STRONG_LINK_COLOR = '#63a6e9'; // Used for a link on a strong feedback background.
 export const GL_FEEDBACK_NEUTRAL_BACKGROUND_COLOR = '#28272d'; // Used for the background of a neutral feedback item when there isn't a specific meaning or urgency.
 export const GL_FEEDBACK_NEUTRAL_TEXT_COLOR = '#bfbfc3'; // Used for the text of a neutral feedback item when there isn't a specific meaning or urgency.
 export const GL_FEEDBACK_NEUTRAL_ICON_COLOR = '#a4a3a8'; // Used for the icon of a neutral feedback item when there isn't a specific meaning or urgency.

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

@@ -20193,16 +20193,13 @@
       },
       "icon": {
         "color": {
-          "value": "#28272d",
+          "value": "#fff",
           "$type": "color",
           "comment": "Used for an icon on a strong feedback background.",
           "filePath": "src/tokens/feedback.tokens.json",
           "isSource": true,
           "original": {
-            "value": {
-              "default": "{color.neutral.0}",
-              "dark": "{color.neutral.900}"
-            },
+            "value": "{color.neutral.0}",
             "$type": "color",
             "comment": "Used for an icon on a strong feedback background."
           },
@@ -20218,16 +20215,13 @@
       },
       "link": {
         "color": {
-          "value": "#0b5cad",
+          "value": "#63a6e9",
           "$type": "color",
           "comment": "Used for a link on a strong feedback background.",
           "filePath": "src/tokens/feedback.tokens.json",
           "isSource": true,
           "original": {
-            "value": {
-              "default": "{color.blue.300}",
-              "dark": "{color.blue.700}"
-            },
+            "value": "{color.blue.300}",
             "$type": "color",
             "comment": "Used for a link on a strong feedback background."
           },

package/src/tokens/build/json/tokens.json

@@ -20199,10 +20199,7 @@
           "filePath": "src/tokens/feedback.tokens.json",
           "isSource": true,
           "original": {
-            "value": {
-              "default": "{color.neutral.0}",
-              "dark": "{color.neutral.900}"
-            },
+            "value": "{color.neutral.0}",
             "$type": "color",
             "comment": "Used for an icon on a strong feedback background."
           },
@@ -20224,10 +20221,7 @@
           "filePath": "src/tokens/feedback.tokens.json",
           "isSource": true,
           "original": {
-            "value": {
-              "default": "{color.blue.300}",
-              "dark": "{color.blue.700}"
-            },
+            "value": "{color.blue.300}",
             "$type": "color",
             "comment": "Used for a link on a strong feedback background."
           },

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

@@ -474,8 +474,8 @@ $gl-feedback-info-background-color: $gl-color-blue-950; // Used for the backgrou
 $gl-feedback-neutral-icon-color: $gl-color-neutral-300; // Used for the icon of a neutral feedback item when there isn't a specific meaning or urgency.
 $gl-feedback-neutral-text-color: $gl-color-neutral-200; // Used for the text of a neutral feedback item when there isn't a specific meaning or urgency.
 $gl-feedback-neutral-background-color: $gl-color-neutral-900; // Used for the background of a neutral feedback item when there isn't a specific meaning or urgency.
-$gl-feedback-strong-link-color: $gl-color-blue-700; // Used for a link on a strong feedback background.
-$gl-feedback-strong-icon-color: $gl-color-neutral-900; // Used for an icon on a strong feedback background.
+$gl-feedback-strong-link-color: $gl-color-blue-300; // Used for a link on a strong feedback background.
+$gl-feedback-strong-icon-color: $gl-color-neutral-0; // Used for an icon on a strong feedback background.
 $gl-feedback-strong-text-color: $gl-color-neutral-0; // Used for text on a strong feedback background.
 $gl-feedback-strong-background-color: $gl-color-neutral-800; // Used for a background associated with strong feedback like a tooltip or toast message.
 $gl-control-indicator-color-disabled: $gl-color-neutral-400; // Used for disabled checkbox and radio button state indicators.

package/src/tokens/feedback.tokens.json

@@ -17,20 +17,14 @@
       },
       "icon": {
         "color": {
-          "$value": {
-            "default": "{color.neutral.0}",
-            "dark": "{color.neutral.900}"
-          },
+          "$value": "{color.neutral.0}",
           "$type": "color",
           "$description": "Used for an icon on a strong feedback background."
         }
       },
       "link": {
         "color": {
-          "$value": {
-            "default": "{color.blue.300}",
-            "dark": "{color.blue.700}"
-          },
+          "$value": "{color.blue.300}",
           "$type": "color",
           "$description": "Used for a link on a strong feedback background."
         }