@carbon/ibm-products 2.43.2-canary.3 → 2.43.2-canary.300

package/scss/components/HTTPErrors/_http-errors.scss

@@ -13,6 +13,9 @@
 @use '../../global/styles/project-settings' as c4p-settings;
 
 $block-class: #{c4p-settings.$pkg-prefix}--http-errors;
+$block-class-404: #{c4p-settings.$pkg-prefix}--http-errors-404;
+$block-class-403: #{c4p-settings.$pkg-prefix}--http-errors-403;
+$block-class-other: #{c4p-settings.$pkg-prefix}--http-errors-other;
 
 .#{$block-class} .#{$block-class}__content {
   position: fixed;
@@ -66,3 +69,77 @@ $block-class: #{c4p-settings.$pkg-prefix}--http-errors;
     transform: scale(1.5);
   }
 }
+/* stylelint-disable carbon/theme-token-use */
+
+.#{$block-class-404}__prefix-cls-1 {
+  fill: none;
+}
+.#{$block-class-404}__prefix-cls-67 {
+  fill: #697077;
+}
+.#{$block-class-404}__prefix-cls-68 {
+  fill: #282828;
+}
+.#{$block-class-404}__prefix-cls-69 {
+  fill: #51565c;
+}
+.#{$block-class-404}__prefix-cls-70 {
+  fill: #002b50;
+}
+.#{$block-class-404}__prefix-cls-71 {
+  fill: #413d3d;
+}
+.#{$block-class-404}__prefix-cls-72 {
+  fill: #908b8b;
+}
+.#{$block-class-404}__prefix-cls-75 {
+  fill: #a4a4a5;
+}
+.#{$block-class-404}__prefix-cls-76 {
+  opacity: 0.15;
+}
+.#{$block-class-403}__prefix-cls-1 {
+  fill: none;
+}
+.#{$block-class-403}__prefix-cls-80 {
+  mix-blend-mode: multiply;
+  opacity: 0.25;
+}
+.#{$block-class-403}__prefix-cls-75 {
+  fill: #595655;
+}
+.#{$block-class-403}__prefix-cls-76 {
+  opacity: 0.15;
+}
+.#{$block-class-403}__prefix-cls-77 {
+  fill: #373d42;
+}
+.#{$block-class-403}__prefix-cls-78 {
+  fill: #002b50;
+}
+.#{$block-class-403}__prefix-cls-81 {
+  fill: #2b2828;
+}
+.#{$block-class-other}__prefix-cls-1 {
+  fill: none;
+}
+.#{$block-class-other}__prefix-cls-69 {
+  fill: #697077;
+}
+.#{$block-class-other}__prefix-cls-70 {
+  fill: #282828;
+}
+.#{$block-class-other}__prefix-cls-71 {
+  fill: #51565c;
+}
+.#{$block-class-other}__prefix-cls-72 {
+  fill: #e0dbda;
+}
+.#{$block-class-other}__prefix-cls-73 {
+  fill: #003d73;
+}
+.#{$block-class-other}__prefix-cls-75 {
+  opacity: 0.15;
+}
+
+/* stylelint-enable */

package/scss/components/OptionsTile/_options-tile.scss

@@ -163,18 +163,18 @@ $block-class: #{c4p-settings.$pkg-prefix}--options-tile;
   overflow: hidden;
 }
 
-.#{$block-class}:not(.#{$block-class}--closing)
-  > details[open]
-  .#{$block-class}__summary,
+.#{$block-class}__summary.#{$block-class}__summary--open:not(
+    .#{$block-class}__summary--closing
+  ),
 .#{$block-class}__summary--hidden {
   height: 0;
   margin-top: 0;
   opacity: 0;
 }
 
-.#{$block-class}:not(.#{$block-class}--closing)
-  > details[open]
-  .#{$block-class}__chevron {
+.#{$block-class}__chevron.#{$block-class}__chevron--open:not(
+    .#{$block-class}__chevron--closing
+  ) {
   transform: rotate(180deg);
 }
 

package/scss/components/SidePanel/_side-panel.scss

@@ -109,7 +109,8 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
     left: 0;
     border-right: 1px solid $border-subtle-02;
   }
-  &.#{$block-class}.#{$block-class}--has-slug {
+  &.#{$block-class}.#{$block-class}--has-slug,
+  &.#{$block-class}.#{$block-class}--has-ai-label {
     border-color: transparent;
     box-shadow: inset 0 -80px 70px -65px $ai-inner-shadow,
       0 4px 10px 2px $ai-drop-shadow;
@@ -195,13 +196,15 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
 
   &.#{$block-class}:has(.#{$block-class}__action-toolbar),
   &.#{$block-class}--has-action-toolbar,
-  &.#{$block-class}--has-slug {
+  &.#{$block-class}--has-slug,
+  &.#{$block-class}--has-ai-label {
     --#{$block-class}--title-padding-right: #{$spacing-10};
   }
 
   &.#{$block-class}:has(.#{$block-class}__action-toolbar),
   &.#{$block-class}--has-action-toolbar {
-    &.#{$block-class}--has-slug {
+    &.#{$block-class}--has-slug,
+    &.#{$block-class}--has-ai-label {
       --#{$block-class}--title-padding-right: #{$spacing-11};
     }
   }
@@ -308,7 +311,8 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
     padding-top: $spacing-03;
   }
 
-  &.#{$block-class}--has-slug .#{$block-class}--scrolls {
+  &.#{$block-class}--has-slug .#{$block-class}--scrolls,
+  &.#{$block-class}--has-ai-label .#{$block-class}--scrolls {
     @include utilities.ai-popover-gradient('default', 0, 'layer');
 
     box-shadow: inset 0 -80px 70px -65px $ai-inner-shadow,
@@ -362,8 +366,9 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
     height: $spacing-08;
   }
 
-  .#{$block-class}__slug-and-close {
-    position: fixed;
+  .#{$block-class}__slug-and-close,
+  .#{$block-class}__ai-label-and-close {
+    position: absolute;
     z-index: 10; /* must be higher than title container border bottom */
     top: 0;
     right: 0;
@@ -413,6 +418,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
 .#{$block-class} .#{c4p-settings.$carbon-prefix}--text-area,
 .#{$block-class} .#{c4p-settings.$carbon-prefix}--search-input,
 .#{$block-class} .#{c4p-settings.$carbon-prefix}--select-input,
+.#{$block-class} .#{c4p-settings.$carbon-prefix}--multi-select,
 .#{$block-class} .#{c4p-settings.$carbon-prefix}--dropdown,
 .#{$block-class} .#{c4p-settings.$carbon-prefix}--dropdown-list,
 .#{$block-class} .#{c4p-settings.$carbon-prefix}--number input[type='number'],
@@ -463,7 +469,8 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
   inset: 0;
 }
 
-.#{$block-class}--has-slug + .#{$block-class}__overlay {
+.#{$block-class}--has-slug + .#{$block-class}__overlay,
+.#{$block-class}--has-ai-label + .#{$block-class}__overlay {
   /* stylelint-disable-next-line carbon/theme-token-use */
   background-color: $ai-overlay;
 }

package/scss/components/StatusIcon/_status-icon.scss

@@ -73,7 +73,7 @@ $themes: ('light', 'dark');
 
 $block-class: #{$pkg-prefix}--status-icon;
 
-@function --clr($name, $theme: light) {
+@function carbon-clr($name, $theme: light) {
   // stylelint-disable-next-line carbon/theme-token-use
   $color: map-get(map-get($colors, $name), $theme);
   @return $color;
@@ -125,13 +125,13 @@ $block-class: #{$pkg-prefix}--status-icon;
           // stylelint-disable-next-line carbon/motion-duration-use, carbon/motion-easing-use
           animation: rotating 8000ms infinite linear;
           // stylelint-disable-next-line carbon/theme-token-use
-          fill: --clr($icon, $theme);
+          fill: carbon-clr($icon, $theme);
         } @else if $icon == running {
           // stylelint-disable-next-line carbon/theme-token-use
-          fill: --clr($icon, $theme);
+          fill: carbon-clr($icon, $theme);
         } @else {
           // stylelint-disable-next-line carbon/theme-token-use
-          fill: --clr($icon, $theme);
+          fill: carbon-clr($icon, $theme);
           @media (prefers-reduced-motion) {
             .#{$block-class}--#{$theme}.#{$block-class}--#{$theme-key}-in-progress {
               animation: none;

package/scss/components/StringFormatter/_string-formatter.scss

@@ -79,7 +79,7 @@ $popover-block-class: #{c4p-settings.$carbon-prefix}--popover;
 .#{$block-class}
   .#{$popover-block-class}--top-right
   .#{$popover-block-class}-caret {
-  /* stylelint-disable-next-line declaration-no-important */
+  /* stylelint-disable-next-line */
   inset-block-start: -1px !important;
 }
 
@@ -92,6 +92,6 @@ $popover-block-class: #{c4p-settings.$carbon-prefix}--popover;
 .#{$block-class}
   .#{$popover-block-class}--bottom-right
   .#{$popover-block-class}-caret {
-  /* stylelint-disable-next-line declaration-no-important */
+  /* stylelint-disable-next-line */
   inset-block-end: -1px !important;
 }

package/scss/components/TagOverflow/_tag-overflow.scss

@@ -100,6 +100,8 @@ $block-class-modal: #{$block-class}-modal;
   }
 
   .#{$block-class-overflow}__trigger {
+    /* stylelint-disable-next-line declaration-no-important */
+    border: none !important;
     font-family: inherit;
   }
 
@@ -188,28 +190,8 @@ $block-class-modal: #{$block-class}-modal;
     margin-bottom: 0;
   }
 
-  &.#{$block-class-modal} .#{$block-class-modal}__fade {
-    position: relative;
-    margin-right: $spacing-05;
-    margin-left: $spacing-05;
-  }
-
-  .#{$block-class-modal}__body {
-    padding-bottom: $spacing-06;
-  }
-
   .#{$block-class-modal}__header {
     padding-right: 0;
     margin-right: $spacing-05;
   }
-
-  &.#{$block-class-modal} .#{$block-class-modal}__fade::after {
-    position: absolute;
-    top: calc(-1 * #{$spacing-11});
-    left: 0;
-    width: 100%;
-    height: $spacing-07;
-    background: linear-gradient(to bottom, transparent, $layer-01);
-    content: '';
-  }
 }

package/scss/components/TagSet/_tag-set.scss

@@ -90,30 +90,10 @@ $block-class-modal: #{$_block-class}-modal;
     margin-bottom: 0;
   }
 
-  &.#{$block-class-modal} .#{$block-class-modal}__fade {
-    position: relative;
-    margin-right: $spacing-05;
-    margin-left: $spacing-05;
-  }
-
-  .#{$block-class-modal}__body {
-    padding-bottom: $spacing-06;
-  }
-
   .#{$block-class-modal}__header {
     padding-right: 0;
     margin-right: $spacing-05;
   }
-
-  &.#{$block-class-modal} .#{$block-class-modal}__fade::after {
-    position: absolute;
-    top: calc(-1 * #{$spacing-11});
-    left: 0;
-    width: 100%;
-    height: $spacing-07;
-    background: linear-gradient(to bottom, transparent, $layer-01);
-    content: '';
-  }
 }
 
 @include block-wrap('#{$block-class-overflow}__tagset-popover') {
@@ -124,6 +104,8 @@ $block-class-modal: #{$_block-class}-modal;
   }
 
   .#{$block-class-overflow}__popover-trigger {
+    /* stylelint-disable-next-line declaration-no-important */
+    border: none !important;
     font-family: inherit;
   }
 

package/scss/components/Tearsheet/_tearsheet.scss

@@ -426,5 +426,7 @@ $motion-duration: $duration-moderate-02;
   &.#{$block-class}--has-slug:not(.#{$block-class}--has-close)
     .#{$carbon-prefix}--slug {
     inset-inline-end: 0;
+    margin-block: 6px;
+    margin-inline-end: 1rem;
   }
 }

package/scss/components/UserProfileImage/_user-profile-image.scss

@@ -44,7 +44,7 @@ $themes: (
 
 $theme-keys: map-keys($themes);
 
-@function --get-background-color($color, $key, $contrast-key) {
+@function carbon-get-background-color($color, $key, $contrast-key) {
   @return map-get(
     $carbon-colors,
     #{$color}#{map-get(map-get($themes, $key), #{$contrast-key}-contrast)}
@@ -59,7 +59,11 @@ $theme-keys: map-keys($themes);
     @each $contrast-key in $theme-keys {
       .#{$block-class}--#{$key}.#{$block-class}--#{$contrast-key}-#{$color} {
         // stylelint-disable-next-line carbon/theme-token-use
-        background-color: --get-background-color($color, $key, $contrast-key);
+        background-color: carbon-get-background-color(
+          $color,
+          $key,
+          $contrast-key
+        );
       }
     }
   }

package/scss/components/_index-released-only.scss

@@ -23,6 +23,7 @@
 @use './EmptyStates';
 @use './ExportModal';
 @use './ExpressiveCard';
+@use './FullPageError';
 @use './HTTPErrors';
 @use './ImportModal';
 @use './MultiAddSelect';

package/scss/config-dev.scss

@@ -1,3 +1,10 @@
+/**
+ * Copyright IBM Corp. 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
 @forward './global/styles/project-settings' with (
   $pkg-prefix: 'dev-prefix--c4p'
 );

package/scss/config.scss

@@ -1 +1,8 @@
+/**
+ * Copyright IBM Corp. 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
 @forward './global/styles/project-settings';

package/telemetry.yml

@@ -18,6 +18,7 @@ collect:
         - align
         - allPageRowsLabel
         - allRowsLabel
+        - allTagsModalAriaLabel
         - allTagsModalSearchLabel
         - allTagsModalSearchPlaceholderText
         - allTagsModalSearchThreshold
@@ -32,11 +33,13 @@ collect:
         - assistiveText
         - assistiveTextDisabledInstructionsLabel
         - assistiveTextInstructionsLabel
+        - autoAlign
         - backButtonText
         - backgroundColor
         - batchActionMenuButtonLabel
         - batchActions
         - body
+        - breadcrumbOverflowTooltipAlign
         - breadcrumbs
         - button
         - cancelButtonText
@@ -49,16 +52,18 @@ collect:
         - closeIconDescription
         - collapseButtonLabel
         - collapsible
+        - column
         - columnInputPlaceholder
         - columns
         - condition
-        - conditionBuilderRef
         - conditionState
         - config
         - containingElementRef
         - count
         - currentMatcher
         - currentStep
+        - CustomizeColumnsButton
+        - customizeColumnsProps
         - CustomizeColumnsTearsheet
         - customizeTearsheetHeadingLabel
         - data
@@ -69,6 +74,7 @@ collect:
         - defaultColumn
         - defaultEmptyRowCount
         - description
+        - disableColumnSwapping
         - disabled
         - disabledCell
         - disableSubmit
@@ -81,6 +87,7 @@ collect:
         - emptyStateSize
         - emptyStateTitle
         - emptyStateType
+        - enableSpacerColumn
         - error
         - errorCodeLabel
         - errorMessage
@@ -100,6 +107,8 @@ collect:
         - formDescription
         - formTitle
         - fullHeightDatagrid
+        - getActionsState
+        - getAsyncSubRows
         - getConditionState
         - getFilterFlyoutProps
         - getOptions
@@ -121,7 +130,9 @@ collect:
         - handleResize
         - hasActions
         - hasCloseIcon
+        - hasCustomRowHeader
         - hasFieldset
+        - headerActions
         - headerGroups
         - HeaderRow
         - headers
@@ -200,6 +211,7 @@ collect:
         - onActiveCellChange
         - onAllRowSelect
         - onApply
+        - onBlur
         - onCancel
         - onChange
         - onClick
@@ -212,8 +224,12 @@ collect:
         - onContextMenuLabel
         - onContextMenuValue
         - onDataUpdate
+        - onFocus
         - onMount
+        - onMouseEnter
+        - onMouseLeave
         - onNext
+        - onOverflowClick
         - onOverflowTagChange
         - onPrimaryButtonClick
         - onRemove
@@ -238,8 +254,10 @@ collect:
         - overflowActions
         - overflowAlign
         - overflowAriaLabel
+        - overflowAutoAlign
         - overflowClassName
         - overflowTags
+        - overflowTooltipAlign
         - overflowType
         - parentId
         - path
@@ -261,11 +279,15 @@ collect:
         - productive
         - radio
         - reactTableFiltersState
+        - readOnlyTable
         - renderIcon
+        - renderRowHeader
+        - renderRowHeaderDirection
         - resetToDefaultLabel
         - resizerAriaLabel
         - rightAlign
         - row
+        - rowActions
         - rows
         - rowSize
         - score
@@ -284,10 +306,12 @@ collect:
         - selectAllLabel
         - selectAllToggle
         - selected
+        - selectedHeaderReorderActive
         - selectedOption
         - selectionAreas
         - selectorPageContent
         - selectorPrimaryFocus
+        - selectorsFloatingMenus
         - sequence
         - setActiveCellCoordinates
         - setAllFilters
@@ -301,6 +325,7 @@ collect:
         - setMouseOverRowIndex
         - setMultiSelection
         - setPopoverOpen
+        - setSelectedHeaderReorderActive
         - setSelectionAreaData
         - setSelectionAreas
         - showAllTagsLabel
@@ -329,10 +354,13 @@ collect:
         - title
         - titleSize
         - toolbarBatchActions
+        - toolbarBatchActionsDisplayMin
         - tooltipAlignment
         - tooltipText
         - totalVisibleColumns
+        - translateWithId
         - translateWithIdBatchActions
+        - triggerButtonRef
         - truncate
         - truncateValue
         - type
@@ -366,6 +394,7 @@ collect:
         - version
         # ActionBar
         - overflowItems
+        - overflowMenuRef
         # Actions
         - searchText
         - setSearchText
@@ -452,8 +481,6 @@ collect:
         - tooltipDescription
         - total
         - trending
-        # BreadcrumbWithOverflow
-        - overflowTooltipAlign
         # ButtonMenu
         - menuAriaLabel
         # ButtonSetWithOverflow
@@ -520,19 +547,25 @@ collect:
         - enableSubGroup
         # ConditionBuilderButton
         - hideLabel
-        - onBlur
-        - onFocus
-        - onMouseEnter
-        - onMouseLeave
+        - isInvalid
         - tooltipAlign
+        - wrapperClassName
         - wrapperProps
-        # ConditionBuilderContent
-        - getActionsState
         # ConditionBuilderItem
         - popOverClassName
+        - renderChildren
+        # ConditionBuilderItemDate
+        - parentRef
+        # ConditionBuilderProvider
+        - actionState
+        - conditionBuilderRef
+        - rootState
+        - setActionState
+        - setRootState
         # ConditionConnector
         - operator
         # ConditionPreview
+        - colorIndex
         - previewType
         # CreateFullPage
         - breadcrumbsOverflowAriaLabel
@@ -544,7 +577,10 @@ collect:
         - secondaryTitle
         # CreateInfluencer
         - stepData
+        # CreateTearsheet
+        - experimentalSecondarySubmitText
         # CreateTearsheetStep
+        - experimentalSecondarySubmit
         - onPrevious
         # CustomizeColumnsTearsheet
         - columnDefinitions
@@ -552,6 +588,7 @@ collect:
         - primaryButtonTextLabel
         - secondaryButtonTextLabel
         # DataSpreadsheet
+        - onColDrag
         - spreadsheetAriaLabel
         # DataSpreadsheetBody
         - activeCellRef
@@ -563,6 +600,7 @@ collect:
         - setClickAndHoldActive
         - setColumnOrder
         - setContainerHasFocus
+        - setCurrentColumns
         - totalColumnsWidth
         # DataSpreadsheetHeader
         - headerCellHoldActive
@@ -748,7 +786,6 @@ collect:
         - warnText
         # OverflowCheckboxes
         - applyFilters
-        - column
         - components
         - filtersState
         - setFiltersState
@@ -757,7 +794,6 @@ collect:
         - actionBarMenuOptionsClass
         - actionBarOverflowAriaLabel
         - breadcrumbOverflowAriaLabel
-        - breadcrumbOverflowTooltipAlign
         - collapseHeader
         - collapseHeaderIconDescription
         - collapseTitle
@@ -779,6 +815,7 @@ collect:
         - inputInvalidText
         - inputLabelText
         - inputPlaceholderText
+        - primaryDangerDescription
         - resourceName
         - textConfirmation
         # RowSizeDropdown
@@ -814,13 +851,13 @@ collect:
         - sortItems
         - submitLabel
         - titleText
-        - translateWithId
         # SelectAllWithToggle
         - getToggleAllPageRowsSelectedProps
         - getToggleAllRowsSelectedProps
         - isAllRowsSelected
         # SidePanel
         - actionToolbarButtons
+        - aiLabel
         - animateTitle
         - condensedActions
         - includeOverlay
@@ -850,8 +887,6 @@ collect:
         - width
         # TagOverflow
         - tagComponent
-        # TearsheetShell
-        - headerActions
         # Toolbar
         - vertical
         # ToolbarButton
@@ -1010,6 +1045,9 @@ collect:
         # General - primaryButtonPlacement
         - bottom
         - top
+        # General - renderRowHeaderDirection
+        - left
+        - right
         # General - rowSize
         - lg
         - md
@@ -1076,9 +1114,13 @@ collect:
         - radio
         - selection
         - text
+        - textarea
         # General - updateMethod
         - batch
         - instant
+        # General - variant
+        - Hierarchical
+        - Non-Hierarchical
         # General - verticalPosition
         - lower
         - normal
@@ -1101,6 +1143,9 @@ collect:
         - floating
         - stacked
         - tooltip
+        # ConditionBlock - conjunction
+        - and
+        - or
         # ConditionPreview - previewType
         - condition
         - newGroup
@@ -1123,19 +1168,6 @@ collect:
         - text
         # PageHeader - fullWidthGrid
         - xl
-        # StringFormatter - tooltipDirection
-        - '"bottom-left"'
-        - '"bottom-right"'
-        - '"bottom"'
-        - '"left-bottom"'
-        - '"left-top"'
-        - '"left"'
-        - '"right-bottom"'
-        - '"right-top"'
-        - '"right"'
-        - '"top-left"'
-        - '"top-right"'
-        - '"top"'
   npm:
     dependencies: null
   js: