@carbon/styles 1.80.0 → 1.81.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/styles",
   "description": "Styles for the Carbon Design System",
-  "version": "1.80.0",
+  "version": "1.81.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -40,13 +40,13 @@
     }
   },
   "dependencies": {
-    "@carbon/colors": "^11.32.0",
+    "@carbon/colors": "^11.33.0",
     "@carbon/feature-flags": "^0.26.0",
-    "@carbon/grid": "^11.35.0",
-    "@carbon/layout": "^11.33.0",
-    "@carbon/motion": "^11.27.0",
-    "@carbon/themes": "^11.51.0",
-    "@carbon/type": "^11.39.0",
+    "@carbon/grid": "^11.36.0",
+    "@carbon/layout": "^11.34.0",
+    "@carbon/motion": "^11.28.0",
+    "@carbon/themes": "^11.52.0",
+    "@carbon/type": "^11.40.0",
     "@ibm/plex": "6.0.0-next.6",
     "@ibm/plex-mono": "0.0.3-alpha.0",
     "@ibm/plex-sans": "0.0.3-alpha.0",
@@ -75,5 +75,5 @@
     "scss/**/*.css",
     "css/**/*.css"
   ],
-  "gitHead": "01b2d2b1c2d901921c615dcbdb85e0a2340b67e6"
+  "gitHead": "ec31b96c91af8208499180eaeae89eb08b7ac8c8"
 }

package/scss/components/data-table/sort/_data-table-sort.scss

@@ -244,6 +244,13 @@
   }
 
   // AILabel styles
+  .#{$prefix}--table-sort__header .#{$prefix}--ai-label,
+  .#{$prefix}--table-sort__header .#{$prefix}--slug,
+  .#{$prefix}--table-sort__header
+    .#{$prefix}--table-header-label--decorator-inner {
+    display: none;
+  }
+
   .#{$prefix}--table-sort__header--slug .#{$prefix}--table-sort__icon,
   .#{$prefix}--table-sort__header--slug .#{$prefix}--table-sort__icon-unsorted,
   .#{$prefix}--table-sort__header--ai-label .#{$prefix}--table-sort__icon,
@@ -260,6 +267,7 @@
     .#{$prefix}--table-header-label--decorator-inner,
   .#{$prefix}--table-sort__header--ai-label
     .#{$prefix}--table-header-label--decorator-inner {
+    display: block;
     margin-inline-end: convert.to-rem(8px);
   }
 

package/scss/components/file-uploader/_file-uploader.scss

@@ -189,7 +189,11 @@
       .#{$prefix}--file-filename-tooltip {
         inline-size: -webkit-fill-available;
         padding-inline-start: $spacing-05;
-        @document url-prefix() {
+
+        /* This is for targeting styles specific to firefox */
+        /* https://sass-lang.com/documentation/breaking-changes/moz-document/ */
+        /* stylelint-disable-next-line at-rule-no-vendor-prefix */
+        @-moz-document url-prefix() {
           inline-size: -moz-available;
         }
       }
@@ -197,7 +201,11 @@
 
     .#{$prefix}--file-filename-tooltip {
       inline-size: -webkit-fill-available;
-      @document url-prefix() {
+
+      /* This is for targeting styles specific to firefox */
+      /* https://sass-lang.com/documentation/breaking-changes/moz-document/ */
+      /* stylelint-disable-next-line at-rule-no-vendor-prefix */
+      @-moz-document url-prefix() {
         inline-size: -moz-available;
       }
     }
@@ -217,7 +225,10 @@
       text-overflow: ellipsis;
       white-space: nowrap;
 
-      @document url-prefix() {
+      /* This is for targeting styles specific to firefox */
+      /* https://sass-lang.com/documentation/breaking-changes/moz-document/ */
+      /* stylelint-disable-next-line at-rule-no-vendor-prefix */
+      @-moz-document url-prefix() {
         inline-size: -moz-available;
       }
     }

package/scss/components/page-header/_page-header.scss

@@ -38,12 +38,19 @@
 
   .#{$prefix}--page-header__content__title-wrapper {
     @include breakpoint-down(md) {
+      display: flex;
       flex-direction: column;
+      grid-gap: $spacing-05;
     }
 
-    display: flex;
-    justify-content: space-between;
+    display: grid;
     gap: $spacing-05;
+    grid-template-columns: auto minmax(
+        var(--pageheader-title-grid-width, 0),
+        1fr
+      );
+    margin-block-end: 1rem;
+    min-block-size: convert.to-rem(40px);
   }
 
   .#{$prefix}--page-header__content__start {
@@ -56,6 +63,11 @@
     display: flex;
   }
 
+  .#{$prefix}--page-header__content__title-container
+    .#{$prefix}--definition-term {
+    border-block-end: none;
+  }
+
   .#{$prefix}--page-header__content__contextual-actions {
     display: flex;
   }
@@ -85,13 +97,23 @@
 
   .#{$prefix}--page-header__content__page-actions {
     display: flex;
-    gap: $spacing-05;
+    justify-content: right;
+
+    @include breakpoint-down('md') {
+      justify-content: left;
+      margin-block-start: 0;
+    }
+  }
+
+  .#{$prefix}--page-header__content__page-actions
+    .#{$prefix}--menu-button__trigger:not(.#{$prefix}--btn--ghost) {
+    min-inline-size: 0;
   }
 
   .#{$prefix}--page-header__content__subtitle {
     @include type-style('productive-heading-03');
 
-    margin-block-start: $spacing-05;
+    margin-block-end: $spacing-03;
   }
 
   .#{$prefix}--page-header__content__body {
@@ -108,10 +130,15 @@
     margin-block-start: $spacing-05;
   }
 
+  [data-hidden]:not([data-fixed]) {
+    display: none;
+  }
+
   .#{$prefix}--page-header__hero-image {
     display: flex;
     overflow: hidden;
     align-items: center;
+    justify-content: end;
     block-size: 100%;
   }
 

package/scss/components/progress-indicator/_progress-indicator.scss

@@ -80,6 +80,8 @@ $progress-indicator-bar-width: 1px inset transparent !default;
 
   .#{$prefix}--progress--space-equal .#{$prefix}--progress-text {
     overflow: hidden;
+    padding: $spacing-01;
+    margin: -$spacing-01;
   }
 
   .#{$prefix}--progress-label {

package/scss/components/text-input/_text-input.scss

@@ -172,6 +172,8 @@
   .#{$prefix}--btn.#{$prefix}--text-input--password__visibility__toggle.#{$prefix}--tooltip__trigger:focus
     svg {
     fill: $icon-primary;
+
+    @include high-contrast-mode('icon-fill');
   }
 
   .#{$prefix}--text-input--invalid,