@carbon/ibm-products 2.83.0 → 2.84.0

package/scss/components/Datagrid/styles/_useInlineEdit.scss

@@ -1,15 +1,17 @@
 /**
- * Copyright IBM Corp. 2024
+ * Copyright IBM Corp. 2024, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
-@use '../../../global/styles/project-settings' as c4p-settings;
 @use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/components/button/tokens' as *;
+@use '@carbon/styles/scss/config' as carbon-config;
 @use '@carbon/type' as *;
+
+@use '../../../global/styles/project-settings' as c4p-settings;
 @use './variables';
 
 $row-heights: (
@@ -23,32 +25,32 @@ $row-heights: (
 @each $size, $size-value in $row-heights {
   .#{variables.$block-class}
     .#{variables.$block-class}__inline-edit--outer-cell-button--#{$size}
-    .#{c4p-settings.$carbon-prefix}--text-input,
+    .#{carbon-config.$prefix}--text-input,
   .#{variables.$block-class}
     .#{variables.$block-class}__inline-edit--outer-cell-button--#{$size}
-    .#{c4p-settings.$carbon-prefix}--number
+    .#{carbon-config.$prefix}--number
     input[type='number'],
   .#{variables.$block-class}
     .#{variables.$block-class}__inline-edit--outer-cell-button--#{$size}
     .#{variables.$block-class}__inline-edit--select
-    .#{c4p-settings.$carbon-prefix}--list-box.#{c4p-settings.$carbon-prefix}--dropdown,
+    .#{carbon-config.$prefix}--list-box.#{carbon-config.$prefix}--dropdown,
   .#{variables.$block-class}
     .#{variables.$block-class}__inline-edit--date.#{variables.$block-class}__inline-edit--date-#{$size}
-    .#{c4p-settings.$carbon-prefix}--date-picker__input {
+    .#{carbon-config.$prefix}--date-picker__input {
     block-size: $size-value;
   }
   .#{variables.$block-class}
     .#{variables.$block-class}__inline-edit--outer-cell-button--#{$size}
-    .#{c4p-settings.$carbon-prefix}--number__control-btn::before,
+    .#{carbon-config.$prefix}--number__control-btn::before,
   .#{variables.$block-class}
     .#{variables.$block-class}__inline-edit--outer-cell-button--#{$size}
-    .#{c4p-settings.$carbon-prefix}--number__control-btn::after {
+    .#{carbon-config.$prefix}--number__control-btn::after {
     block-size: calc(#{$size-value} - 0.25rem);
   }
   .#{variables.$block-class}
     .#{variables.$block-class}__inline-edit--outer-cell-button--#{$size}
     .#{variables.$block-class}__inline-edit--select
-    .#{c4p-settings.$carbon-prefix}--list-box {
+    .#{carbon-config.$prefix}--list-box {
     max-block-size: none;
   }
 }
@@ -80,7 +82,7 @@ $row-heights: (
 }
 
 .#{variables.$block-class}__inline-edit--outer-cell-checkbox-focus
-  .cds--checkbox-label::before {
+  .#{carbon-config.$prefix}--checkbox-label::before {
   outline: $spacing-01 solid $focus;
   outline-offset: 1px;
 }
@@ -196,9 +198,9 @@ $row-heights: (
 }
 
 .#{variables.$block-class}__inline-edit--outer-cell-button
-  .#{c4p-settings.$carbon-prefix}--text-input,
+  .#{carbon-config.$prefix}--text-input,
 .#{variables.$block-class}__inline-edit--outer-cell-button
-  .#{c4p-settings.$carbon-prefix}--number
+  .#{carbon-config.$prefix}--number
   input[type='number'] {
   block-size: $spacing-09;
 }
@@ -208,7 +210,7 @@ $row-heights: (
   inset-inline-end: $spacing-05;
 }
 
-.#{variables.$block-class}__table-with-inline-edit.#{c4p-settings.$carbon-prefix}--data-table
+.#{variables.$block-class}__table-with-inline-edit.#{carbon-config.$prefix}--data-table
   .#{variables.$block-class}__cell-inline-edit {
   position: relative;
   padding: 0;
@@ -216,7 +218,7 @@ $row-heights: (
     padding-inline-start: $spacing-05;
   }
 
-  .#{c4p-settings.$carbon-prefix}--number input[type='number'] {
+  .#{carbon-config.$prefix}--number input[type='number'] {
     min-inline-size: auto;
     padding-inline-end: $spacing-05;
   }
@@ -228,28 +230,28 @@ $row-heights: (
   padding-inline-start: $spacing-05;
 }
 
-.#{variables.$block-class}__inline-edit--select.#{c4p-settings.$carbon-prefix}--dropdown,
+.#{variables.$block-class}__inline-edit--select.#{carbon-config.$prefix}--dropdown,
 .#{variables.$block-class}__inline-edit--date
-  .#{c4p-settings.$carbon-prefix}--date-picker {
+  .#{carbon-config.$prefix}--date-picker {
   inline-size: inherit;
 }
 
-.#{variables.$block-class}__inline-edit--select.#{c4p-settings.$carbon-prefix}--dropdown,
+.#{variables.$block-class}__inline-edit--select.#{carbon-config.$prefix}--dropdown,
 .#{variables.$block-class}__inline-edit--date
-  .#{c4p-settings.$carbon-prefix}--date-picker.#{c4p-settings.$carbon-prefix}--date-picker--single
-  .#{c4p-settings.$carbon-prefix}--date-picker__input {
+  .#{carbon-config.$prefix}--date-picker.#{carbon-config.$prefix}--date-picker--single
+  .#{carbon-config.$prefix}--date-picker__input {
   block-size: $spacing-09; // default row height
   inline-size: 100%;
   max-block-size: none;
 }
 
 .#{variables.$block-class}__inline-edit--date
-  .#{c4p-settings.$carbon-prefix}--date-picker-container {
+  .#{carbon-config.$prefix}--date-picker-container {
   inline-size: inherit;
 }
 
-.#{variables.$block-class}__inline-edit--date.#{c4p-settings.$carbon-prefix}--date-picker.#{c4p-settings.$carbon-prefix}--date-picker--single
-  .#{c4p-settings.$carbon-prefix}--date-picker__input {
+.#{variables.$block-class}__inline-edit--date.#{carbon-config.$prefix}--date-picker.#{carbon-config.$prefix}--date-picker--single
+  .#{carbon-config.$prefix}--date-picker__input {
   overflow: hidden;
   inline-size: 100%;
   max-inline-size: none;
@@ -259,7 +261,7 @@ $row-heights: (
 }
 
 .#{variables.$block-class}
-  .#{c4p-settings.$carbon-prefix}--data-table
+  .#{carbon-config.$prefix}--data-table
   .#{variables.$block-class}__carbon-row-hover-active
   td {
   background-color: $layer-hover;
@@ -299,7 +301,7 @@ $row-heights: (
 
 .#{variables.$block-class}
   .#{variables.$block-class}__grid-container-active
-  .#{c4p-settings.$carbon-prefix}--data-table-content::before {
+  .#{carbon-config.$prefix}--data-table-content::before {
   position: absolute;
   z-index: 2;
   background-color: $link-inverse;
@@ -334,11 +336,11 @@ $row-heights: (
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
   [data-invalid]
-  ~ .#{c4p-settings.$carbon-prefix}--form-requirement,
+  ~ .#{carbon-config.$prefix}--form-requirement,
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
   [data-invalid]
-  .#{c4p-settings.$carbon-prefix}--form-requirement {
+  .#{carbon-config.$prefix}--form-requirement {
   position: absolute;
   z-index: 3;
   padding: $spacing-03 $spacing-06 $spacing-03 $spacing-03;
@@ -352,20 +354,20 @@ $row-heights: (
 
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--list-box[data-invalid]:focus-within
-  ~ .#{c4p-settings.$carbon-prefix}--form-requirement {
+  .#{carbon-config.$prefix}--list-box[data-invalid]:focus-within
+  ~ .#{carbon-config.$prefix}--form-requirement {
   outline: $spacing-01 solid $focus;
 }
 
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--list-box__invalid-icon,
+  .#{carbon-config.$prefix}--list-box__invalid-icon,
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--text-input__invalid-icon,
+  .#{carbon-config.$prefix}--text-input__invalid-icon,
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--number__invalid {
+  .#{carbon-config.$prefix}--number__invalid {
   z-index: 4;
   inset-block-start: calc(100% + #{$spacing-04} + #{$spacing-01});
   inset-inline-end: $spacing-03;
@@ -373,13 +375,13 @@ $row-heights: (
 
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--number__invalid {
+  .#{carbon-config.$prefix}--number__invalid {
   inset-block-start: calc(100% + #{$spacing-02} + #{$spacing-01});
 }
 
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--form-requirement::before {
+  .#{carbon-config.$prefix}--form-requirement::before {
   position: absolute;
   background-color: $layer-01;
   block-size: $spacing-01;
@@ -390,7 +392,7 @@ $row-heights: (
 }
 
 .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--form-requirement::after {
+  .#{carbon-config.$prefix}--form-requirement::after {
   position: absolute;
   background-color: $layer-accent-01;
   block-size: 1px;
@@ -402,11 +404,11 @@ $row-heights: (
 
 .#{variables.$block-class} tbody tr:hover {
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-    .#{c4p-settings.$carbon-prefix}--form-requirement::before {
+    .#{carbon-config.$prefix}--form-requirement::before {
     background-color: $layer-accent-01;
   }
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-    .#{c4p-settings.$carbon-prefix}--form-requirement::after {
+    .#{carbon-config.$prefix}--form-requirement::after {
     background-color: transparent;
   }
 }
@@ -414,32 +416,32 @@ $row-heights: (
 // Keep input focus states using $support-01 when inline edit cell is invalid
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--text-input:focus,
+  .#{carbon-config.$prefix}--text-input:focus,
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--number
+  .#{carbon-config.$prefix}--number
   input[type='number']:focus,
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--number
+  .#{carbon-config.$prefix}--number
   input[type='number']:focus
-  ~ .#{c4p-settings.$carbon-prefix}--number__controls
-  .#{c4p-settings.$carbon-prefix}--number__control-btn:hover,
+  ~ .#{carbon-config.$prefix}--number__controls
+  .#{carbon-config.$prefix}--number__control-btn:hover,
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--number__control-btn:focus {
+  .#{carbon-config.$prefix}--number__control-btn:focus {
   outline-color: $support-error;
 }
 
-.#{variables.$block-class} .#{c4p-settings.$carbon-prefix}--text-input:focus {
+.#{variables.$block-class} .#{carbon-config.$prefix}--text-input:focus {
   background: $field-01;
 }
 
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
-  .#{c4p-settings.$carbon-prefix}--number
+  .#{carbon-config.$prefix}--number
   input[type='number'][data-invalid]:focus
-  ~ .#{c4p-settings.$carbon-prefix}--number__controls
-  .#{c4p-settings.$carbon-prefix}--number__control-btn.up-icon::after {
+  ~ .#{carbon-config.$prefix}--number__controls
+  .#{carbon-config.$prefix}--number__control-btn.up-icon::after {
   background-color: $support-error;
 }

package/scss/components/Datagrid/styles/_useNestedRows.scss

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2024
+ * Copyright IBM Corp. 2024, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -7,12 +7,13 @@
 
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/spacing' as *;
-@use '../../../global/styles/project-settings' as c4p-settings;
+@use '@carbon/styles/scss/config' as carbon-config;
 @use '@carbon/styles/scss/motion' as *;
+
+@use '../../../global/styles/project-settings' as c4p-settings;
 @use './variables' as *;
 
-.#{c4p-settings.$carbon-prefix}--data-table
-  tr.#{$block-class}__carbon-nested-row {
+.#{carbon-config.$prefix}--data-table tr.#{$block-class}__carbon-nested-row {
   border-inline-start: 1px solid transparent;
 
   .#{$block-class}__cell {
@@ -58,35 +59,34 @@
   }
 }
 
-.#{c4p-settings.$carbon-prefix}--data-table
-  td.#{$block-class}__expandable-row-cell {
+.#{carbon-config.$prefix}--data-table td.#{$block-class}__expandable-row-cell {
   padding-inline-start: $spacing-03;
 }
 
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   td.#{$block-class}__expandable-row-cell
   + td,
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   .#{$block-class}__carbon-nested-row:not(
     .#{$block-class}__carbon-row-expandable
   )
   td.#{$block-class}__cell:nth-of-type(2),
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   .#{$block-class}__carbon-nested-row
   td.#{$block-class}__cell:nth-of-type(2)
   + td {
   position: relative;
 }
 
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   td.#{$block-class}__expandable-row-cell.#{$block-class}__expandable-row-cell--is-expanded
   + td::before,
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   .#{$block-class}__carbon-nested-row:not(
     .#{$block-class}__carbon-row-expandable
   ):not(.#{$block-class}__carbon-row-expandable--async)
   td.#{$block-class}__cell:nth-of-type(2)::before,
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   .#{$block-class}__carbon-nested-row
   td.#{$block-class}__expandable-row-cell
   + td::before {
@@ -101,19 +101,19 @@
   transition: background-color $duration-fast-01 motion(entrance, productive);
 }
 
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   tr:hover
   td.#{$block-class}__expandable-row-cell.#{$block-class}__expandable-row-cell--is-expanded
   + td::before,
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   .#{$block-class}__carbon-nested-row:hover
   td.#{$block-class}__expandable-row-cell
   + td::before,
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   .#{$block-class}__expandable-row--hover
   td.#{$block-class}__expandable-row-cell
   + td::before,
-.#{c4p-settings.$carbon-prefix}--data-table
+.#{carbon-config.$prefix}--data-table
   .#{$block-class}__carbon-nested-row:hover:not(
     .#{$block-class}__carbon-row-expandable
   )

package/scss/components/Datagrid/styles/_useNestedTable.scss

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2024
+ * Copyright IBM Corp. 2024, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -7,12 +7,14 @@
 
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/spacing' as *;
+@use '@carbon/styles/scss/config' as carbon-config;
+
 @use '../../../global/styles/project-settings' as c4p-settings;
 @use './variables';
 
 // used for tables within a expandable row
 .#{variables.$block-class}__expanded-row
-  .#{c4p-settings.$carbon-prefix}--data-table-container {
+  .#{carbon-config.$prefix}--data-table-container {
   border-inline-start: 2px solid $background-brand;
   inline-size: calc(100% - #{$spacing-07});
   margin-inline-start: $spacing-07;
@@ -28,7 +30,7 @@
 }
 
 .#{variables.$block-class}__expanded-row
-  .#{c4p-settings.$carbon-prefix}--data-table-container
+  .#{carbon-config.$prefix}--data-table-container
   th {
   background-color: $layer-accent-01;
   border-block-start-color: $layer-accent-01;

package/scss/components/Datagrid/styles/_useSelectAllToggle.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2021, 2023
+// Copyright IBM Corp. 2021, 2025
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -7,6 +7,8 @@
 
 @use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/theme' as *;
+@use '@carbon/styles/scss/config' as carbon-config;
+
 @use './variables';
 @use '../../../global/styles/project-settings' as c4p-settings;
 
@@ -32,6 +34,6 @@ th.#{variables.$block-class}__select-all-toggle-on.button {
   margin-inline-start: $spacing-01;
 }
 
-.#{variables.$block-class}__select-all-toggle-overflow.#{c4p-settings.$carbon-prefix}--overflow-menu-options--sm.#{c4p-settings.$carbon-prefix}--overflow-menu-options[data-floating-menu-direction='bottom']::after {
+.#{variables.$block-class}__select-all-toggle-overflow.#{carbon-config.$prefix}--overflow-menu-options--sm.#{carbon-config.$prefix}--overflow-menu-options[data-floating-menu-direction='bottom']::after {
   inline-size: $spacing-13;
 }

package/scss/components/Datagrid/styles/_useSortableColumns.scss

@@ -1,33 +1,35 @@
 /**
- * Copyright IBM Corp. 2020, 2023
+ * Copyright IBM Corp. 2020, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
 @use '@carbon/styles/scss/theme' as *;
-@use '../../../global/styles/project-settings' as c4p-settings;
+@use '@carbon/styles/scss/config' as carbon-config;
 @use '@carbon/styles/scss/spacing' as *;
+
+@use '../../../global/styles/project-settings' as c4p-settings;
 @use './variables' as *;
 
 .#{$block-class}__sortableColumn {
   /* stylelint-disable-next-line declaration-no-important */
   padding-inline: $spacing-05 !important;
 
-  .#{c4p-settings.$carbon-prefix}--table-header-label .header-title {
+  .#{carbon-config.$prefix}--table-header-label .header-title {
     display: inline-block;
     inline-size: auto;
   }
-  .#{c4p-settings.$carbon-prefix}--table-header-label {
+  .#{carbon-config.$prefix}--table-header-label {
     display: block;
     block-size: 100%;
     inline-size: 100%;
   }
-  .#{c4p-settings.$carbon-prefix}--table-header-label
-    .#{c4p-settings.$carbon-prefix}--table-sort:focus,
-  .#{c4p-settings.$carbon-prefix}--table-header-label
-    .#{c4p-settings.$carbon-prefix}--table-sort:active,
-  .#{c4p-settings.$carbon-prefix}--table-header-label
+  .#{carbon-config.$prefix}--table-header-label
+    .#{carbon-config.$prefix}--table-sort:focus,
+  .#{carbon-config.$prefix}--table-header-label
+    .#{carbon-config.$prefix}--table-sort:active,
+  .#{carbon-config.$prefix}--table-header-label
     button:focus
     .#{$block-class}__sortable-icon {
     /* stylelint-disable-next-line declaration-no-important */
@@ -36,17 +38,17 @@
     color: $text-primary !important;
   }
 
-  .#{c4p-settings.$carbon-prefix}--table-header-label
-    .#{c4p-settings.$carbon-prefix}--table-sort:focus,
-  .#{c4p-settings.$carbon-prefix}--table-header-label
-    .#{c4p-settings.$carbon-prefix}--table-sort:active {
+  .#{carbon-config.$prefix}--table-header-label
+    .#{carbon-config.$prefix}--table-sort:focus,
+  .#{carbon-config.$prefix}--table-header-label
+    .#{carbon-config.$prefix}--table-sort:active {
     + .#{$block-class}__resizer {
       z-index: -1;
     }
   }
 
-  .#{c4p-settings.$carbon-prefix}--table-header-label
-    .#{c4p-settings.$carbon-prefix}--table-sort {
+  .#{carbon-config.$prefix}--table-header-label
+    .#{carbon-config.$prefix}--table-sort {
     padding: 0 $spacing-05;
     border: none;
     /* stylelint-disable-next-line declaration-no-important */
@@ -57,15 +59,15 @@
     inline-size: 100%;
     min-inline-size: 100%;
   }
-  .#{c4p-settings.$carbon-prefix}--table-header-label
-    .#{c4p-settings.$carbon-prefix}--table-sort
+  .#{carbon-config.$prefix}--table-header-label
+    .#{carbon-config.$prefix}--table-sort
     .#{$block-class}__sortable-icon {
     fill: $text-primary;
     opacity: 0;
     visibility: hidden;
   }
 
-  .#{c4p-settings.$carbon-prefix}--table-sort.#{$block-class}--table-sort {
+  .#{carbon-config.$prefix}--table-sort.#{$block-class}--table-sort {
     align-items: inherit;
     margin: 0 calc(-1 * #{$spacing-05}); // fill width of parent table column header
     inline-size: calc(100% + #{$spacing-07}); // offset due to inner label
@@ -75,7 +77,7 @@
 .#{$block-class}__sortableColumn:hover,
 .#{$block-class}__sortableColumn:focus-within,
 .#{$block-class}__sortableColumn.#{$block-class}__isSorted {
-  .#{c4p-settings.$carbon-prefix}--table-header-label
+  .#{carbon-config.$prefix}--table-header-label
     .#{$block-class}__sortable-icon {
     opacity: 1;
     visibility: visible;

package/scss/components/Datagrid/styles/addons/_CustomizeColumnsTearsheet.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2022, 2022
+// Copyright IBM Corp. 2022, 2025
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -13,6 +13,7 @@
 @use '@carbon/type/scss/font-family';
 @use '@carbon/layout' as *;
 @use '@carbon/layout/scss/convert';
+@use '@carbon/styles/scss/config' as carbon-config;
 
 @use '../../../../global/styles/project-settings' as c4p-settings;
 @use '../variables';
@@ -31,7 +32,7 @@
   padding-inline-start: spacing.$spacing-09;
 }
 
-.#{c4p-settings.$carbon-prefix}--form-item.#{c4p-settings.$carbon-prefix}--checkbox-wrapper.#{variables.$block-class}__customize-columns-checkbox {
+.#{carbon-config.$prefix}--form-item.#{carbon-config.$prefix}--checkbox-wrapper.#{variables.$block-class}__customize-columns-checkbox {
   display: flex;
   flex: initial;
   align-items: center;
@@ -39,7 +40,7 @@
 }
 
 .#{variables.$block-class}__customize-columns-column-list
-  .#{variables.$block-class}__customize-columns-checkbox-wrapper.#{c4p-settings.$carbon-prefix}--form-item {
+  .#{variables.$block-class}__customize-columns-checkbox-wrapper.#{carbon-config.$prefix}--form-item {
   margin-block-end: 0;
 }
 
@@ -63,7 +64,7 @@
   inset-block-start: 0;
   padding-inline-start: spacing.$spacing-08;
 
-  .#{c4p-settings.$carbon-prefix}--checkbox-label-text {
+  .#{carbon-config.$prefix}--checkbox-label-text {
     @include font-family.font-weight('semibold');
   }
 }

package/scss/components/Datagrid/styles/addons/_FilterFlyout.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2022, 2024
+// Copyright IBM Corp. 2022, 2025
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -12,6 +12,7 @@
 @use '@carbon/styles/scss/spacing';
 @use '@carbon/styles/scss/type' as *;
 @use '@carbon/layout' as *;
+@use '@carbon/styles/scss/config' as carbon-config;
 
 @use '../../../../global/styles/project-settings' as c4p-settings;
 @use '../variables';
@@ -86,22 +87,21 @@ $action-set-height: to-rem(64px);
 }
 
 // Carbon overrides
-.#{variables.$block-class}-filter-flyout__trigger.#{c4p-settings.$carbon-prefix}--btn {
+.#{variables.$block-class}-filter-flyout__trigger.#{carbon-config.$prefix}--btn {
   display: flex;
   justify-content: center;
   block-size: 3rem;
   inline-size: 3rem;
 }
 
-.#{variables.$block-class}-filter-flyout__trigger--open.#{c4p-settings.$carbon-prefix}--btn.#{c4p-settings.$carbon-prefix}--btn--icon-only {
+.#{variables.$block-class}-filter-flyout__trigger--open.#{carbon-config.$prefix}--btn.#{carbon-config.$prefix}--btn--icon-only {
   position: relative;
   background-color: $layer-02;
   /* stylelint-disable-next-line -- to-rem carbon replacement for rem */
   box-shadow: 0 1px to-rem(8px) 0 rgba(0, 0, 0, 0.25);
 }
 
-.#{variables.$block-class}-filter-flyout
-  .#{c4p-settings.$carbon-prefix}--fieldset {
+.#{variables.$block-class}-filter-flyout .#{carbon-config.$prefix}--fieldset {
   margin-block-end: 0;
 }
 

package/scss/components/Datagrid/styles/addons/_FilterPanel.scss

@@ -1,16 +1,18 @@
 //
-// Copyright IBM Corp. 2022, 2024
+// Copyright IBM Corp. 2022, 2025
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
 //
 
-@use '../variables' as *;
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/layout/scss/convert' as *;
 @use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/type' as *;
 @use '@carbon/styles/scss/motion' as *;
+@use '@carbon/styles/scss/config' as carbon-config;
+
+@use '../variables' as *;
 @use '../../../../global/styles/project-settings' as c4p-settings;
 @use './animations' as *;
 
@@ -171,6 +173,7 @@ $block-class-component: #{$block-class}-filter-panel;
   margin-block-start: auto;
 
   opacity: 1;
+  /* stylelint-disable-next-line carbon/layout-use */
   transform: translateY(64px) translateZ(0);
 
   &.#{$block-class-component}__animationComplete {
@@ -183,28 +186,28 @@ $block-class-component: #{$block-class}-filter-panel;
 
 // Overrides
 .#{$block-class-component}__container
-  .#{c4p-settings.$carbon-prefix}--accordion__title {
+  .#{carbon-config.$prefix}--accordion__title {
   margin: 0;
 }
 
 .#{$block-class-component}__container
-  .#{c4p-settings.$carbon-prefix}--accordion__arrow {
+  .#{carbon-config.$prefix}--accordion__arrow {
   margin: $spacing-01 0 0;
 }
 
 .#{$block-class-component}__container
-  .#{c4p-settings.$carbon-prefix}--accordion__content {
+  .#{carbon-config.$prefix}--accordion__content {
   padding-inline: 0;
 }
 
 // Makes sure every child (filter) inside the accordion content has space in between
 .#{$block-class-component}__container
-  .#{c4p-settings.$carbon-prefix}--accordion__content
+  .#{carbon-config.$prefix}--accordion__content
   > *:not(:last-child) {
   margin-block-end: $spacing-05;
 }
 
-.#{c4p-settings.$carbon-prefix}--btn.#{$block-class-component}-open-button {
+.#{carbon-config.$prefix}--btn.#{$block-class-component}-open-button {
   display: flex;
   justify-content: center;
   block-size: 3rem;
@@ -213,6 +216,6 @@ $block-class-component: #{$block-class}-filter-panel;
   inline-size: 3rem;
 }
 
-.#{c4p-settings.$carbon-prefix}--btn.#{$block-class-component}__view-all-button {
+.#{carbon-config.$prefix}--btn.#{$block-class-component}__view-all-button {
   margin-inline-start: -$spacing-05;
 }