@carbon/ibm-products 2.53.0-rc.0 → 2.54.0-rc.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "2.53.0-rc.0",
+  "version": "2.54.0-rc.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -81,7 +81,7 @@
     "fs-extra": "^11.2.0",
     "glob": "^10.3.10",
     "jest": "^29.7.0",
-    "jest-config-ibm-cloud-cognitive": "^1.12.0-rc.0",
+    "jest-config-ibm-cloud-cognitive": "^1.13.0-rc.0",
     "jest-environment-jsdom": "^29.7.0",
     "namor": "^1.1.2",
     "npm-check-updates": "^16.14.12",
@@ -95,8 +95,8 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.23.9",
-    "@carbon/feature-flags": "^0.23.1",
-    "@carbon/ibm-products-styles": "^2.49.0-rc.0",
+    "@carbon/feature-flags": "^0.24.0",
+    "@carbon/ibm-products-styles": "^2.50.0-rc.0",
     "@carbon/telemetry": "^0.1.0",
     "@dnd-kit/core": "^6.0.8",
     "@dnd-kit/modifiers": "^7.0.0",
@@ -111,14 +111,14 @@
     "react-window": "^1.8.10"
   },
   "peerDependencies": {
-    "@carbon/grid": "^11.28.1",
-    "@carbon/layout": "^11.27.1",
-    "@carbon/motion": "^11.23.1",
-    "@carbon/react": "^1.68.0",
-    "@carbon/themes": "^11.42.0",
-    "@carbon/type": "^11.32.1",
+    "@carbon/grid": "^11.29.0",
+    "@carbon/layout": "^11.28.0",
+    "@carbon/motion": "^11.24.0",
+    "@carbon/react": "^1.69.0",
+    "@carbon/themes": "^11.43.0",
+    "@carbon/type": "^11.33.0",
     "react": "^16.8.6 || ^17.0.1 || ^18.2.0",
     "react-dom": "^16.8.6 || ^17.0.1 || ^18.2.0"
   },
-  "gitHead": "847e38fa424e320632c444ac2e1e8f8ab4671ac9"
+  "gitHead": "9c7e0212c0dfbad56428a845289a5e5b19615db2"
 }

package/scss/components/EditFullPage/_index.scss

@@ -5,4 +5,4 @@
 // LICENSE file in the root directory of this source tree.
 //
 
-@import './edit-full-page';
+@use './edit-full-page';

package/scss/components/EditTearsheet/_index.scss

@@ -5,4 +5,4 @@
 // LICENSE file in the root directory of this source tree.
 //
 
-@import './edit-tearsheet';
+@use './edit-tearsheet';

package/scss/components/EditTearsheetNarrow/_index.scss

@@ -5,4 +5,4 @@
 // LICENSE file in the root directory of this source tree.
 //
 
-@import './edit-tearsheet-narrow';
+@use './edit-tearsheet-narrow';

package/scss/components/EditUpdateCards/_edit-update-cards.scss

@@ -8,16 +8,16 @@
 // Standard imports.
 
 // Other Carbon settings.
-// TODO: @import 'carbon-components/scss/globals/grid/grid'; if needed
+// TODO: @use 'carbon-components/scss/globals/grid/grid'; if needed
 @use '@carbon/colors/' as *;
 @use '@carbon/motion/' as *;
 @use '../../global/styles/project-settings' as c4p-settings;
 
 // EditUpdateCards uses the following Carbon components:
-// TODO: @import(s) of Carbon component styles used by EditUpdateCards
+// TODO: @use(s) of Carbon component styles used by EditUpdateCards
 
 // EditUpdateCards uses the following Carbon for IBM Products components:
-// TODO: @import(s) of IBM Products component styles used by EditUpdateCards
+// TODO: @use(s) of IBM Products component styles used by EditUpdateCards
 
 // Define all component styles in a mixin which is then exported using
 // the Carbon import-once mechanism.

package/scss/components/UserAvatar/_carbon-imports.scss

@@ -7,3 +7,4 @@
 
 // Import any Carbon component styles used from UserAvatar in this file.
 // UserAvatar uses the following Carbon components:
+@use '@carbon/react/scss/components/tooltip';

package/scss/components/UserAvatar/_user-avatar.scss

@@ -20,6 +20,7 @@
 
 // UserAvatar uses the following Carbon for IBM Products components:
 // TODO: @use(s) of IBM Products component styles used by UserAvatar
+@use '@carbon/react/scss/components/tooltip';
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 
@@ -61,6 +62,7 @@ $sizes: (
   &:focus-within .#{$block-class} {
     // stylelint-disable-next-line carbon/theme-token-use
     outline: 2px solid $focus;
+    outline-offset: 1px;
   }
 }
 
@@ -74,6 +76,7 @@ $sizes: (
   background-color: $color;
 }
 
+//this mixin allows you to set background color based on the lighter themes such as g10 and white
 @mixin setLightBg($order, $color) {
   :root .#{$block-class}--#{$order},
   .#{$carbon-prefix}--g10 .#{$block-class}--#{$order},
@@ -84,6 +87,7 @@ $sizes: (
   }
 }
 
+//this mixin allows you to set background color based on the darker themes such as g90 and g100
 @mixin setDarkBg($order, $color) {
   .#{$carbon-prefix}--g90 .#{$block-class}--#{$order},
   .#{$carbon-prefix}--g100 .#{$block-class}--#{$order},

package/telemetry.yml

@@ -80,6 +80,7 @@ collect:
         - disabledCell
         - disableSubmit
         - displayMetalPanel
+        - downloadLinkLabel
         - draggableClass
         - element
         - emptyStateAction
@@ -232,6 +233,7 @@ collect:
         - onNext
         - onOverflowClick
         - onOverflowTagChange
+        - onPrevious
         - onPrimaryButtonClick
         - onRemove
         - onRequestClose
@@ -575,14 +577,15 @@ collect:
         - modalDescription
         - modalSecondaryButtonText
         - modalTitle
+        - onClickInfluencerStep
         - secondaryTitle
         # CreateInfluencer
+        - onClickStep
         - stepData
         # CreateTearsheet
         - experimentalSecondarySubmitText
         # CreateTearsheetStep
         - experimentalSecondarySubmit
-        - onPrevious
         # CustomizeColumnsTearsheet
         - columnDefinitions
         - onSaveColumnPrefs
@@ -794,6 +797,7 @@ collect:
         - actionBarItems
         - actionBarMenuOptionsClass
         - actionBarOverflowAriaLabel
+        - breadcrumbLabel
         - breadcrumbOverflowAriaLabel
         - collapseHeader
         - collapseHeaderIconDescription