feat(list): Rename deprecated MDC list class names.

PiperOrigin-RevId: 362182613

packages/mdc-data-table/_data-table-pagination.scss

@@ -93,7 +93,7 @@
       data-table-theme.$pagination-rows-per-page-select-height,
       $query: $query
     );
-    .mdc-list-item {
+    .mdc-deprecated-list-item {
       @include list-theme.deprecated-single-line-height(
         data-table-theme.$pagination-rows-per-page-select-height,
         $query: $query

packages/mdc-dialog/_mixins.scss

@@ -272,19 +272,19 @@
   }
 
   // stylelint-disable-next-line plugin/selector-bem-pattern
-  .mdc-dialog__content .mdc-list:first-child:last-child {
+  .mdc-dialog__content .mdc-deprecated-list:first-child:last-child {
     @include feature-targeting.targets($feat-structure) {
-      // Override default .mdc-list padding for content consisting exclusively of a MDC List
+      // Override default .mdc-deprecated-list padding for content consisting exclusively of a MDC List
       padding: 6px 0 0; // Top padding balances with title height
     }
   }
 
   // stylelint-disable-next-line plugin/selector-bem-pattern, selector-max-specificity
   .mdc-dialog--scrollable
     .mdc-dialog__content
-    .mdc-list:first-child:last-child {
+    .mdc-deprecated-list:first-child:last-child {
     @include feature-targeting.targets($feat-structure) {
-      // Override default .mdc-list padding for content consisting exclusively of a MDC List
+      // Override default .mdc-deprecated-list padding for content consisting exclusively of a MDC List
       padding: 0;
     }
   }

packages/mdc-drawer/_mixins.scss

@@ -283,7 +283,7 @@
 }
 
 @mixin activated-overlay-color($color, $query: feature-targeting.all()) {
-  :not(.mdc-list--non-interactive) > .mdc-list-item {
+  :not(.mdc-deprecated-list--non-interactive) > .mdc-deprecated-list-item {
     @include ripple-theme.states-activated($color, $query: $query);
   }
 }
@@ -384,7 +384,7 @@
     variables.$item-active-icon-ink-opacity
   );
 
-  .mdc-list-item--activated {
+  .mdc-deprecated-list-item--activated {
     @include list-mixins.deprecated-item-graphic-ink-color(
       $value,
       $query: $query
@@ -398,7 +398,7 @@
     variables.$item-active-text-ink-opacity
   );
 
-  .mdc-list-item--activated {
+  .mdc-deprecated-list-item--activated {
     @include list-mixins.deprecated-item-primary-text-ink-color(
       $value,
       $query: $query
@@ -412,7 +412,7 @@
     variables.$item-inactive-text-ink-opacity
   );
 
-  .mdc-list-item {
+  .mdc-deprecated-list-item {
     @include list-mixins.deprecated-item-primary-text-ink-color(
       $value,
       $query: $query
@@ -468,7 +468,7 @@
   $feat-structure: feature-targeting.create-target($query, structure);
 
   // postcss-bem-linter: ignore
-  .mdc-list-item {
+  .mdc-deprecated-list-item {
     @include typography.typography(subtitle2, $query: $query);
 
     @include feature-targeting.targets($feat-structure) {
@@ -480,21 +480,21 @@
   }
 
   // postcss-bem-linter: ignore
-  .mdc-list-item:nth-child(1) {
+  .mdc-deprecated-list-item:nth-child(1) {
     @include feature-targeting.targets($feat-structure) {
       margin-top: 2px;
     }
   }
 
   // postcss-bem-linter: ignore
-  .mdc-list-item:nth-last-child(1) {
+  .mdc-deprecated-list-item:nth-last-child(1) {
     @include feature-targeting.targets($feat-structure) {
       margin-bottom: 0;
     }
   }
 
   // postcss-bem-linter: ignore
-  .mdc-list-group__subheader {
+  .mdc-deprecated-list-group__subheader {
     @include typography.typography(body2, $query: $query);
     @include typography.text-baseline($top: 24px, $query: $query);
 
@@ -505,16 +505,16 @@
   }
 
   // postcss-bem-linter: ignore
-  .mdc-list-divider {
+  .mdc-deprecated-list-divider {
     @include feature-targeting.targets($feat-structure) {
       margin: 3px 0 4px;
     }
   }
 
   // Prevents list item children from being included in the click target.
   // postcss-bem-linter: ignore
-  .mdc-list-item__text,
-  .mdc-list-item__graphic {
+  .mdc-deprecated-list-item__text,
+  .mdc-deprecated-list-item__graphic {
     @include feature-targeting.targets($feat-structure) {
       pointer-events: none;
     }

packages/mdc-list/_evolution-mixins.scss

@@ -1,3 +1,7 @@
+// Selector '.mdc-*' should only be used in this project.
+// stylelint-disable selector-class-pattern --
+// NOTE: this is the implementation of the aforementioned classes.
+
 @use 'sass:list';
 @use 'sass:map';
 @use '@material/theme/theme';
@@ -89,13 +93,10 @@
 
     // For components using aria-activedescendant, the focus pseudoclass is
     // never applied and use `.mdc-ripple-upgraded--background-focused` instead.
-    // stylelint-disable selector-class-pattern --
-    // NOTE: Selector '.mdc-*' should only be used in this project.
     &:not(.mdc-evolution-list-item--selected):focus::before, // lint-disable-focus-psuedo-selector
     &.mdc-ripple-upgraded--background-focused::before {
       @include dom-mixins.transparent-border($query: $query);
     }
-    // stylelint-enable selector-class-pattern
 
     &.mdc-evolution-list-item--selected::before {
       @include dom-mixins.transparent-border(
@@ -411,7 +412,7 @@
   .mdc-evolution-list-group {
     @include feature-targeting.targets($feat-structure) {
       // Cancel top/bottom padding on individual lists within group
-      .mdc-list {
+      .mdc-deprecated-list {
         padding: 0;
       }
     }
@@ -839,7 +840,7 @@
 @mixin group-subheader-ink-color($color, $query: feature-targeting.all()) {
   $feat-color: feature-targeting.create-target($query, color);
 
-  .mdc-list-group__subheader {
+  .mdc-deprecated-list-group__subheader {
     @include feature-targeting.targets($feat-color) {
       @include theme.property(color, $color);
     }

packages/mdc-menu/_mixins.scss

@@ -55,7 +55,7 @@
     );
     @include min-width(variables.$min-width, $query: $query);
     // Include mdc-list selector to ensure list-inside-menu overrides default list styles
-    .mdc-list {
+    .mdc-deprecated-list {
       @include list-mixins.deprecated-item-primary-text-ink-color(
         variables.$ink-color,
         $query
@@ -64,27 +64,27 @@
       @include elevation-mixins.overlay-dimensions(100%, $query: $query);
     }
 
-    .mdc-list-divider {
+    .mdc-deprecated-list-divider {
       @include feature-targeting.targets($feat-structure) {
         margin: 8px 0;
       }
     }
 
-    .mdc-list-item {
+    .mdc-deprecated-list-item {
       @include feature-targeting.targets($feat-structure) {
         user-select: none;
       }
     }
 
-    .mdc-list-item--disabled {
+    .mdc-deprecated-list-item--disabled {
       @include feature-targeting.targets($feat-structure) {
         cursor: auto;
       }
     }
 
     //stylelint-disable selector-no-qualifying-type
-    a.mdc-list-item .mdc-list-item__text,
-    a.mdc-list-item .mdc-list-item__graphic {
+    a.mdc-deprecated-list-item .mdc-deprecated-list-item__text,
+    a.mdc-deprecated-list-item .mdc-deprecated-list-item__graphic {
       @include feature-targeting.targets($feat-structure) {
         pointer-events: none;
       }
@@ -99,7 +99,7 @@
       fill: currentColor;
     }
 
-    .mdc-list-item {
+    .mdc-deprecated-list-item {
       @include feature-targeting.targets($feat-structure) {
         @include rtl-mixins.reflexive-property(
           padding,

packages/mdc-menu/constants.ts

@@ -31,7 +31,7 @@ const strings = {
   ARIA_CHECKED_ATTR: 'aria-checked',
   ARIA_DISABLED_ATTR: 'aria-disabled',
   CHECKBOX_SELECTOR: 'input[type="checkbox"]',
-  LIST_SELECTOR: '.mdc-list',
+  LIST_SELECTOR: '.mdc-list,.mdc-deprecated-list',
   SELECTED_EVENT: 'MDCMenu:selected',
 };
 

packages/mdc-select/_select-ripple.scss

@@ -20,6 +20,10 @@
 // THE SOFTWARE.
 //
 
+// Selector '.mdc-*' should only be used in this project.
+// stylelint-disable selector-class-pattern --
+// NOTE: this is the implementation of the aforementioned classes.
+
 @use '@material/feature-targeting/feature-targeting';
 @use '@material/list/mixins' as list-mixins;
 @use '@material/ripple/ripple';
@@ -55,7 +59,7 @@
     }
   }
 
-  .mdc-select__menu .mdc-list .mdc-list-item--selected {
+  .mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected {
     @include list-mixins.deprecated-ripple-states(on-surface, $query: $query);
   }
 }

packages/mdc-select/_select-theme.scss

@@ -20,6 +20,10 @@
 // THE SOFTWARE.
 //
 
+// Selector '.mdc-*' should only be used in this project.
+// stylelint-disable selector-class-pattern --
+// NOTE: this is the implementation of the aforementioned classes.
+
 @use 'sass:color';
 @use 'sass:list';
 @use 'sass:meta';
@@ -683,7 +687,7 @@ $error-color: error !default;
       );
     }
 
-    .mdc-list-item__graphic {
+    .mdc-deprecated-list-item__graphic {
       width: select-icon-theme.$dense-icon-size;
       height: select-icon-theme.$dense-icon-size;
     }
@@ -794,7 +798,7 @@ $error-color: error !default;
   }
 
   @if $new-height < $height {
-    .mdc-list-item__graphic {
+    .mdc-deprecated-list-item__graphic {
       width: select-icon-theme.$dense-icon-size;
       height: select-icon-theme.$dense-icon-size;
     }

packages/mdc-select/_select.scss

@@ -20,6 +20,10 @@
 // THE SOFTWARE.
 //
 
+// Selector '.mdc-*' should only be used in this project.
+// stylelint-disable selector-class-pattern --
+// NOTE: this is the implementation of the aforementioned classes.
+
 @use '@material/dom/mixins' as dom-mixins;
 @use '@material/feature-targeting/feature-targeting';
 @use '@material/floating-label/mixins' as floating-label-mixins;
@@ -210,7 +214,7 @@
     @include _option-side-padding(12px, $query: $query);
   }
 
-  .mdc-select__menu .mdc-list {
+  .mdc-select__menu .mdc-deprecated-list {
     @include select-icon-theme.icon-horizontal-margins(0, 0, $query: $query);
     @include list-mixins.deprecated-item-selected-text-color(
       on-surface,
@@ -319,7 +323,7 @@
 @mixin _option-side-padding($side-padding, $query: feature-targeting.all()) {
   $feat-structure: feature-targeting.create-target($query, structure);
 
-  .mdc-select__menu .mdc-list-item {
+  .mdc-select__menu .mdc-deprecated-list-item {
     @include feature-targeting.targets($feat-structure) {
       @include rtl-mixins.reflexive-property(
         padding,
@@ -340,7 +344,7 @@
 ) {
   $feat-structure: feature-targeting.create-target($query, structure);
 
-  .mdc-select__menu .mdc-list-item__graphic {
+  .mdc-select__menu .mdc-deprecated-list-item__graphic {
     @include feature-targeting.targets($feat-structure) {
       @include rtl-mixins.reflexive-box(margin, right, $margin-right);
     }