@angular/material 22.2.0-next.0 → 22.2.0-next.1

package/prebuilt-themes/pink-bluegrey.css

@@ -637,7 +637,6 @@ html {
   --mat-slide-toggle-disabled-track-opacity: 0.12;
   --mat-slide-toggle-disabled-unselected-handle-opacity: 0.38;
   --mat-slide-toggle-disabled-unselected-icon-opacity: 0.38;
-  --mat-slide-toggle-disabled-unselected-track-outline-color: transparent;
   --mat-slide-toggle-disabled-unselected-track-outline-width: 1px;
   --mat-slide-toggle-handle-height: 20px;
   --mat-slide-toggle-handle-shape: 10px;
@@ -652,11 +651,9 @@ html {
   --mat-slide-toggle-selected-icon-size: 18px;
   --mat-slide-toggle-selected-pressed-handle-horizontal-margin: 0;
   --mat-slide-toggle-selected-pressed-state-layer-opacity: 0.12;
-  --mat-slide-toggle-selected-track-outline-color: transparent;
   --mat-slide-toggle-selected-track-outline-width: 1px;
   --mat-slide-toggle-selected-with-icon-handle-horizontal-margin: 0;
   --mat-slide-toggle-track-height: 14px;
-  --mat-slide-toggle-track-outline-color: transparent;
   --mat-slide-toggle-track-outline-width: 1px;
   --mat-slide-toggle-track-shape: 7px;
   --mat-slide-toggle-track-width: 36px;
@@ -688,6 +685,9 @@ html {
   --mat-slide-toggle-selected-hover-track-color: #d81b60;
   --mat-slide-toggle-selected-pressed-track-color: #d81b60;
   --mat-slide-toggle-selected-track-color: #d81b60;
+  --mat-slide-toggle-disabled-unselected-track-outline-color: transparent;
+  --mat-slide-toggle-selected-track-outline-color: transparent;
+  --mat-slide-toggle-track-outline-color: transparent;
   --mat-slide-toggle-disabled-label-text-color: color-mix(in srgb, white 38%, transparent);
   --mat-slide-toggle-disabled-handle-elevation-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
   --mat-slide-toggle-disabled-selected-handle-color: white;
@@ -835,7 +835,6 @@ html {
 html {
   --mat-slider-active-track-height: 6px;
   --mat-slider-active-track-shape: 9999px;
-  --mat-slider-handle-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
   --mat-slider-handle-height: 20px;
   --mat-slider-handle-shape: 50%;
   --mat-slider-handle-width: 20px;
@@ -867,6 +866,7 @@ html {
   --mat-slider-ripple-color: #c2185b;
   --mat-slider-with-tick-marks-active-container-color: white;
   --mat-slider-with-tick-marks-inactive-container-color: #c2185b;
+  --mat-slider-handle-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
   --mat-slider-disabled-active-track-color: white;
   --mat-slider-disabled-handle-color: white;
   --mat-slider-disabled-inactive-track-color: white;
@@ -942,17 +942,12 @@ html {
 }
 
 html {
-  --mat-list-active-indicator-color: transparent;
   --mat-list-active-indicator-shape: 4px;
   --mat-list-list-item-container-shape: 0;
   --mat-list-list-item-leading-avatar-shape: 50%;
-  --mat-list-list-item-container-color: transparent;
-  --mat-list-list-item-selected-container-color: transparent;
-  --mat-list-list-item-leading-avatar-color: transparent;
   --mat-list-list-item-leading-icon-size: 24px;
   --mat-list-list-item-leading-avatar-size: 40px;
   --mat-list-list-item-trailing-icon-size: 24px;
-  --mat-list-list-item-disabled-state-layer-color: transparent;
   --mat-list-list-item-disabled-state-layer-opacity: 0;
   --mat-list-list-item-disabled-label-text-opacity: 0.38;
   --mat-list-list-item-disabled-leading-icon-opacity: 0.38;
@@ -960,6 +955,11 @@ html {
 }
 
 html {
+  --mat-list-active-indicator-color: transparent;
+  --mat-list-list-item-container-color: transparent;
+  --mat-list-list-item-selected-container-color: transparent;
+  --mat-list-list-item-leading-avatar-color: transparent;
+  --mat-list-list-item-disabled-state-layer-color: transparent;
   --mat-list-list-item-label-text-color: white;
   --mat-list-list-item-supporting-text-color: rgba(255, 255, 255, 0.7);
   --mat-list-list-item-leading-icon-color: rgba(255, 255, 255, 0.7);
@@ -1597,12 +1597,18 @@ html {
 }
 
 html {
-  --mat-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
   --mat-fab-container-shape: 50%;
   --mat-fab-touch-target-size: 48px;
-  --mat-fab-extended-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
   --mat-fab-extended-container-height: 48px;
   --mat-fab-extended-container-shape: 24px;
+  --mat-fab-small-container-shape: 50%;
+  --mat-fab-small-touch-target-size: 48px;
+}
+
+html {
+  --mat-fab-container-color: #424242;
+  --mat-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
+  --mat-fab-extended-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
   --mat-fab-extended-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-extended-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-extended-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
@@ -1610,15 +1616,9 @@ html {
   --mat-fab-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
   --mat-fab-small-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
-  --mat-fab-small-container-shape: 50%;
-  --mat-fab-small-touch-target-size: 48px;
   --mat-fab-small-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-small-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-small-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
-}
-
-html {
-  --mat-fab-container-color: #424242;
   --mat-fab-disabled-state-container-color: color-mix(in srgb, white 12%, transparent);
   --mat-fab-disabled-state-foreground-color: color-mix(in srgb, white 38%, transparent);
   --mat-fab-disabled-state-layer-color: rgba(255, 255, 255, 0.7);
@@ -1996,12 +1996,12 @@ html {
 
 html {
   --mat-expansion-container-shape: 4px;
-  --mat-expansion-container-elevation-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
   --mat-expansion-legacy-header-indicator-display: inline-block;
   --mat-expansion-header-indicator-display: none;
 }
 
 html {
+  --mat-expansion-container-elevation-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
   --mat-expansion-container-background-color: #424242;
   --mat-expansion-container-text-color: white;
   --mat-expansion-actions-divider-color: rgba(255, 255, 255, 0.12);
@@ -2054,11 +2054,11 @@ html {
 
 html {
   --mat-sidenav-container-shape: 0;
-  --mat-sidenav-container-elevation-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
   --mat-sidenav-container-width: auto;
 }
 
 html {
+  --mat-sidenav-container-elevation-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
   --mat-sidenav-container-divider-color: rgba(255, 255, 255, 0.12);
   --mat-sidenav-container-background-color: #424242;
   --mat-sidenav-container-text-color: white;
@@ -2179,10 +2179,10 @@ html {
 
 html {
   --mat-timepicker-container-shape: 4px;
-  --mat-timepicker-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
 }
 
 html {
+  --mat-timepicker-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-timepicker-container-background-color: #424242;
 }
 

package/prebuilt-themes/purple-green.css

@@ -637,7 +637,6 @@ html {
   --mat-slide-toggle-disabled-track-opacity: 0.12;
   --mat-slide-toggle-disabled-unselected-handle-opacity: 0.38;
   --mat-slide-toggle-disabled-unselected-icon-opacity: 0.38;
-  --mat-slide-toggle-disabled-unselected-track-outline-color: transparent;
   --mat-slide-toggle-disabled-unselected-track-outline-width: 1px;
   --mat-slide-toggle-handle-height: 20px;
   --mat-slide-toggle-handle-shape: 10px;
@@ -652,11 +651,9 @@ html {
   --mat-slide-toggle-selected-icon-size: 18px;
   --mat-slide-toggle-selected-pressed-handle-horizontal-margin: 0;
   --mat-slide-toggle-selected-pressed-state-layer-opacity: 0.12;
-  --mat-slide-toggle-selected-track-outline-color: transparent;
   --mat-slide-toggle-selected-track-outline-width: 1px;
   --mat-slide-toggle-selected-with-icon-handle-horizontal-margin: 0;
   --mat-slide-toggle-track-height: 14px;
-  --mat-slide-toggle-track-outline-color: transparent;
   --mat-slide-toggle-track-outline-width: 1px;
   --mat-slide-toggle-track-shape: 7px;
   --mat-slide-toggle-track-width: 36px;
@@ -688,6 +685,9 @@ html {
   --mat-slide-toggle-selected-hover-track-color: #8e24aa;
   --mat-slide-toggle-selected-pressed-track-color: #8e24aa;
   --mat-slide-toggle-selected-track-color: #8e24aa;
+  --mat-slide-toggle-disabled-unselected-track-outline-color: transparent;
+  --mat-slide-toggle-selected-track-outline-color: transparent;
+  --mat-slide-toggle-track-outline-color: transparent;
   --mat-slide-toggle-disabled-label-text-color: color-mix(in srgb, white 38%, transparent);
   --mat-slide-toggle-disabled-handle-elevation-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
   --mat-slide-toggle-disabled-selected-handle-color: white;
@@ -835,7 +835,6 @@ html {
 html {
   --mat-slider-active-track-height: 6px;
   --mat-slider-active-track-shape: 9999px;
-  --mat-slider-handle-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
   --mat-slider-handle-height: 20px;
   --mat-slider-handle-shape: 50%;
   --mat-slider-handle-width: 20px;
@@ -867,6 +866,7 @@ html {
   --mat-slider-ripple-color: #7b1fa2;
   --mat-slider-with-tick-marks-active-container-color: white;
   --mat-slider-with-tick-marks-inactive-container-color: #7b1fa2;
+  --mat-slider-handle-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
   --mat-slider-disabled-active-track-color: white;
   --mat-slider-disabled-handle-color: white;
   --mat-slider-disabled-inactive-track-color: white;
@@ -942,17 +942,12 @@ html {
 }
 
 html {
-  --mat-list-active-indicator-color: transparent;
   --mat-list-active-indicator-shape: 4px;
   --mat-list-list-item-container-shape: 0;
   --mat-list-list-item-leading-avatar-shape: 50%;
-  --mat-list-list-item-container-color: transparent;
-  --mat-list-list-item-selected-container-color: transparent;
-  --mat-list-list-item-leading-avatar-color: transparent;
   --mat-list-list-item-leading-icon-size: 24px;
   --mat-list-list-item-leading-avatar-size: 40px;
   --mat-list-list-item-trailing-icon-size: 24px;
-  --mat-list-list-item-disabled-state-layer-color: transparent;
   --mat-list-list-item-disabled-state-layer-opacity: 0;
   --mat-list-list-item-disabled-label-text-opacity: 0.38;
   --mat-list-list-item-disabled-leading-icon-opacity: 0.38;
@@ -960,6 +955,11 @@ html {
 }
 
 html {
+  --mat-list-active-indicator-color: transparent;
+  --mat-list-list-item-container-color: transparent;
+  --mat-list-list-item-selected-container-color: transparent;
+  --mat-list-list-item-leading-avatar-color: transparent;
+  --mat-list-list-item-disabled-state-layer-color: transparent;
   --mat-list-list-item-label-text-color: white;
   --mat-list-list-item-supporting-text-color: rgba(255, 255, 255, 0.7);
   --mat-list-list-item-leading-icon-color: rgba(255, 255, 255, 0.7);
@@ -1597,12 +1597,18 @@ html {
 }
 
 html {
-  --mat-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
   --mat-fab-container-shape: 50%;
   --mat-fab-touch-target-size: 48px;
-  --mat-fab-extended-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
   --mat-fab-extended-container-height: 48px;
   --mat-fab-extended-container-shape: 24px;
+  --mat-fab-small-container-shape: 50%;
+  --mat-fab-small-touch-target-size: 48px;
+}
+
+html {
+  --mat-fab-container-color: #424242;
+  --mat-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
+  --mat-fab-extended-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
   --mat-fab-extended-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-extended-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-extended-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
@@ -1610,15 +1616,9 @@ html {
   --mat-fab-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
   --mat-fab-small-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
-  --mat-fab-small-container-shape: 50%;
-  --mat-fab-small-touch-target-size: 48px;
   --mat-fab-small-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-small-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-fab-small-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
-}
-
-html {
-  --mat-fab-container-color: #424242;
   --mat-fab-disabled-state-container-color: color-mix(in srgb, white 12%, transparent);
   --mat-fab-disabled-state-foreground-color: color-mix(in srgb, white 38%, transparent);
   --mat-fab-disabled-state-layer-color: rgba(255, 255, 255, 0.7);
@@ -1996,12 +1996,12 @@ html {
 
 html {
   --mat-expansion-container-shape: 4px;
-  --mat-expansion-container-elevation-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
   --mat-expansion-legacy-header-indicator-display: inline-block;
   --mat-expansion-header-indicator-display: none;
 }
 
 html {
+  --mat-expansion-container-elevation-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
   --mat-expansion-container-background-color: #424242;
   --mat-expansion-container-text-color: white;
   --mat-expansion-actions-divider-color: rgba(255, 255, 255, 0.12);
@@ -2054,11 +2054,11 @@ html {
 
 html {
   --mat-sidenav-container-shape: 0;
-  --mat-sidenav-container-elevation-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
   --mat-sidenav-container-width: auto;
 }
 
 html {
+  --mat-sidenav-container-elevation-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
   --mat-sidenav-container-divider-color: rgba(255, 255, 255, 0.12);
   --mat-sidenav-container-background-color: #424242;
   --mat-sidenav-container-text-color: white;
@@ -2179,10 +2179,10 @@ html {
 
 html {
   --mat-timepicker-container-shape: 4px;
-  --mat-timepicker-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
 }
 
 html {
+  --mat-timepicker-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
   --mat-timepicker-container-background-color: #424242;
 }
 

package/schematics/ng-add/index.js

@@ -19,7 +19,7 @@ const package_config_1 = require("./package-config");
  * Note that the fallback version range does not use caret, but tilde because that is
  * the default for Angular framework dependencies in CLI projects.
  */
-const fallbackMaterialVersionRange = `~22.2.0-next.0`;
+const fallbackMaterialVersionRange = `~22.2.0-next.1`;
 /**
  * Schematic factory entry-point for the `ng-add` schematic. The ng-add schematic will be
  * automatically executed if developers run `ng add @angular/material`.

package/sidenav/_m2-sidenav.scss

@@ -31,10 +31,10 @@
   @return (
     base: (
       sidenav-container-shape: 0,
-      sidenav-container-elevation-shadow: elevation.get-box-shadow(16),
       sidenav-container-width: auto,
     ),
     color: (
+      sidenav-container-elevation-shadow: elevation.get-box-shadow(16),
       sidenav-container-divider-color: map.get($system, outline),
       sidenav-container-background-color: map.get($system, surface),
       sidenav-container-text-color: map.get($system, on-surface),

package/sidenav/_m3-sidenav.scss

@@ -9,11 +9,11 @@
   @return (
     base: (
       sidenav-container-shape: map.get($system, corner-large),
-      sidenav-container-elevation-shadow: none,
       sidenav-container-width: 360px,
-      sidenav-container-divider-color: transparent,
     ),
     color: (
+      sidenav-container-elevation-shadow: none,
+      sidenav-container-divider-color: transparent,
       sidenav-container-background-color: map.get($system, surface),
       sidenav-container-text-color: map.get($system, on-surface-variant),
       sidenav-content-background-color: map.get($system, background),

package/slide-toggle/_m2-slide-toggle.scss

@@ -28,7 +28,6 @@
       slide-toggle-disabled-track-opacity: 0.12,
       slide-toggle-disabled-unselected-handle-opacity: 0.38,
       slide-toggle-disabled-unselected-icon-opacity: 0.38,
-      slide-toggle-disabled-unselected-track-outline-color: transparent,
       slide-toggle-disabled-unselected-track-outline-width: 1px,
       slide-toggle-handle-height: 20px,
       slide-toggle-handle-shape: 10px,
@@ -44,11 +43,9 @@
       slide-toggle-selected-pressed-handle-horizontal-margin: 0,
       slide-toggle-selected-pressed-state-layer-opacity:
           map.get($system, pressed-state-layer-opacity),
-      slide-toggle-selected-track-outline-color: transparent,
       slide-toggle-selected-track-outline-width: 1px,
       slide-toggle-selected-with-icon-handle-horizontal-margin: 0,
       slide-toggle-track-height: 14px,
-      slide-toggle-track-outline-color: transparent,
       slide-toggle-track-outline-width: 1px,
       slide-toggle-track-shape: 7px,
       slide-toggle-track-width: 36px,
@@ -68,6 +65,9 @@
       slide-toggle-touch-target-size: 48px,
     ),
     color: map.merge(private-get-color-palette-color-tokens($theme, primary), (
+      slide-toggle-disabled-unselected-track-outline-color: transparent,
+      slide-toggle-selected-track-outline-color: transparent,
+      slide-toggle-track-outline-color: transparent,
       slide-toggle-disabled-label-text-color:
           m3-utils.color-with-opacity(map.get($system, on-surface), 38%),
       slide-toggle-disabled-handle-elevation-shadow: elevation.get-box-shadow(0),

package/slide-toggle/_m3-slide-toggle.scss

@@ -42,7 +42,6 @@
       slide-toggle-selected-handle-size: 24px,
       slide-toggle-selected-icon-size: 16px,
       slide-toggle-selected-pressed-handle-horizontal-margin: 0 22px,
-      slide-toggle-selected-track-outline-color: transparent,
       slide-toggle-selected-track-outline-width: 2px,
       slide-toggle-selected-with-icon-handle-horizontal-margin: 0 24px,
       slide-toggle-state-layer-size: 40px,
@@ -63,6 +62,7 @@
       slide-toggle-touch-target-size: 48px,
     ),
     color: (
+      slide-toggle-selected-track-outline-color: transparent,
       slide-toggle-disabled-label-text-color: map.get($system, on-surface),
       slide-toggle-disabled-selected-handle-color: map.get($system, surface),
       slide-toggle-disabled-selected-icon-color: map.get($system, on-surface),

package/slider/_m2-slider.scss

@@ -10,7 +10,6 @@
     base: (
       slider-active-track-height: 6px,
       slider-active-track-shape: 9999px,
-      slider-handle-elevation: elevation.get-box-shadow(1),
       slider-handle-height: 20px,
       slider-handle-shape: 50%,
       slider-handle-width: 20px,
@@ -31,6 +30,7 @@
       slider-value-indicator-transform-origin: bottom,
     ),
     color: map.merge(private-get-color-palette-color-tokens($theme, primary), (
+      slider-handle-elevation: elevation.get-box-shadow(1),
       slider-disabled-active-track-color: map.get($system, on-surface),
       slider-disabled-handle-color: map.get($system, on-surface),
       slider-disabled-inactive-track-color: map.get($system, on-surface),

package/slider/_m3-slider.scss

@@ -15,6 +15,10 @@
 
   @return (
     base: (
+      slider-active-track-shape: map.get($system, corner-full),
+      slider-handle-shape: map.get($system, corner-full),
+      slider-inactive-track-shape: map.get($system, corner-full),
+      slider-with-tick-marks-container-shape: map.get($system, corner-full),
       slider-value-indicator-opacity: 1,
       slider-value-indicator-padding: 0,
       slider-value-indicator-width: $indicator-size,
@@ -35,7 +39,6 @@
     ),
     color: (
       slider-active-track-color: map.get($system, primary),
-      slider-active-track-shape: map.get($system, corner-full),
       slider-disabled-active-track-color: map.get($system, on-surface),
       slider-disabled-handle-color: map.get($system, on-surface),
       slider-disabled-inactive-track-color: map.get($system, on-surface),
@@ -43,17 +46,14 @@
       slider-focus-state-layer-color: m3-utils.color-with-opacity(map.get($system, primary), 20%),
       slider-handle-color: map.get($system, primary),
       slider-handle-elevation: elevation.get-box-shadow(map.get($system, level1)),
-      slider-handle-shape: map.get($system, corner-full),
       slider-hover-handle-color: map.get($system, primary),
       slider-hover-state-layer-color: m3-utils.color-with-opacity(map.get($system, primary), 5%),
       slider-inactive-track-color: map.get($system, surface-variant),
-      slider-inactive-track-shape: map.get($system, corner-full),
       slider-label-container-color: map.get($system, primary),
       slider-label-label-text-color: map.get($system, on-primary),
       slider-ripple-color: map.get($system, primary),
       slider-with-overlap-handle-outline-color: map.get($system, on-primary),
       slider-with-tick-marks-active-container-color: map.get($system, on-primary),
-      slider-with-tick-marks-container-shape: map.get($system, corner-full),
       slider-with-tick-marks-disabled-container-color: map.get($system, on-surface),
       slider-with-tick-marks-inactive-container-color: map.get($system, on-surface-variant),
     ),

package/stepper/_m3-stepper.scss

@@ -17,11 +17,11 @@ $prefix: (mat, stepper);
 
   @return (
     base: (
-      stepper-header-error-state-icon-background-color: transparent,
       stepper-header-focus-state-layer-shape: map.get($system, corner-medium),
       stepper-header-hover-state-layer-shape: map.get($system, corner-medium),
     ),
     color: (
+      stepper-header-error-state-icon-background-color: transparent,
       stepper-container-color: map.get($system, surface),
       stepper-header-done-state-icon-background-color: map.get($system, primary),
       stepper-header-done-state-icon-foreground-color: map.get($system, on-primary),

package/timepicker/_m2-timepicker.scss

@@ -8,9 +8,9 @@
   @return (
     base: (
       timepicker-container-shape: 4px,
-      timepicker-container-elevation-shadow: elevation.get-box-shadow(8),
     ),
     color: (
+      timepicker-container-elevation-shadow: elevation.get-box-shadow(8),
       timepicker-container-background-color: map.get($system, surface)
     ),
     typography: (),

package/types/autocomplete-testing.d.ts

@@ -1,5 +1,5 @@
 import { BaseHarnessFilters, ComponentHarness, ComponentHarnessConstructor, HarnessPredicate } from '@angular/cdk/testing';
-import { OptionHarnessFilters, MatOptionHarness } from './_option-harness-chunk.js';
+import { OptionHarnessFilters, MatOptionHarness } from './core-testing.js';
 import { OptgroupHarnessFilters, MatOptgroupHarness } from './core-testing.js';
 
 /** A set of criteria that can be used to filter a list of `MatAutocompleteHarness` instances. */

package/types/autocomplete.d.ts

@@ -2,9 +2,10 @@ import * as i0 from '@angular/core';
 import { InjectionToken, AfterContentInit, OnDestroy, TemplateRef, ElementRef, QueryList, EventEmitter, AfterViewInit, OnChanges, SimpleChanges } from '@angular/core';
 import * as i2 from '@angular/cdk/overlay';
 import { ScrollStrategy } from '@angular/cdk/overlay';
-import { MatOptionModule } from './_option-module-chunk.js';
-import { ThemePalette } from './_palette-chunk.js';
-import { MatOption, MatOptgroup, MatOptionSelectionChange } from './_option-chunk.js';
+import { MatOptionModule } from './core.js';
+import { ThemePalette } from './core.js';
+import { MatOption, MatOptgroup } from './_option-chunk.js';
+import { MatOptionSelectionChange } from './core.js';
 import { ActiveDescendantKeyManager } from '@angular/cdk/a11y';
 import { ControlValueAccessor } from '@angular/forms';
 import { Observable } from 'rxjs';

package/types/badge-testing.d.ts

@@ -1,5 +1,5 @@
 import { BaseHarnessFilters, ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
-import { MatBadgePosition, MatBadgeSize } from './_badge-chunk.js';
+import { MatBadgePosition, MatBadgeSize } from './badge.js';
 import '@angular/core';
 import './_palette-chunk.js';
 

package/types/button-toggle-testing.d.ts

@@ -1,5 +1,5 @@
 import { BaseHarnessFilters, ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
-import { MatButtonToggleAppearance } from './_button-toggle-chunk.js';
+import { MatButtonToggleAppearance } from './button-toggle.js';
 import '@angular/cdk/bidi';
 import '@angular/core';
 import '@angular/forms';

package/types/button-toggle.d.ts

@@ -1,7 +1,7 @@
 import { MatButtonToggleGroup, MatButtonToggle } from './_button-toggle-chunk.js';
 export { MAT_BUTTON_TOGGLE_DEFAULT_OPTIONS, MAT_BUTTON_TOGGLE_GROUP, MAT_BUTTON_TOGGLE_GROUP_VALUE_ACCESSOR, MatButtonToggleAppearance, MatButtonToggleChange, MatButtonToggleDefaultOptions, ToggleType } from './_button-toggle-chunk.js';
 import * as i0 from '@angular/core';
-import { MatRippleModule } from './_ripple-module-chunk.js';
+import { MatRippleModule } from './core.js';
 import * as i2 from '@angular/cdk/bidi';
 import '@angular/forms';
 import './_ripple-chunk.js';

package/types/button.d.ts

@@ -1,9 +1,9 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, AfterViewInit, OnDestroy, ElementRef, NgZone } from '@angular/core';
 import { FocusOrigin } from '@angular/cdk/a11y';
-import { ThemePalette } from './_palette-chunk.js';
-import { MatRippleLoader } from './_ripple-loader-chunk.js';
-import { MatRippleModule } from './_ripple-module-chunk.js';
+import { ThemePalette } from './core.js';
+import { MatRippleLoader } from './core.js';
+import { MatRippleModule } from './core.js';
 import * as i2 from '@angular/cdk/bidi';
 import './_ripple-chunk.js';
 import '@angular/cdk/platform';

package/types/checkbox.d.ts

@@ -2,7 +2,7 @@ import { FocusableOption } from '@angular/cdk/a11y';
 import * as i0 from '@angular/core';
 import { AfterViewInit, OnChanges, ElementRef, EventEmitter, SimpleChanges, InjectionToken } from '@angular/core';
 import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors } from '@angular/forms';
-import { ThemePalette } from './_palette-chunk.js';
+import { ThemePalette } from './core.js';
 import * as i2 from '@angular/cdk/bidi';
 
 /**

package/types/chips.d.ts

@@ -3,9 +3,9 @@ import { ElementRef, OnInit, AfterViewInit, AfterContentInit, DoCheck, OnDestroy
 import { Subject, Observable } from 'rxjs';
 import { FocusKeyManager } from '@angular/cdk/a11y';
 import { ControlValueAccessor, NgControl } from '@angular/forms';
-import { ErrorStateMatcher } from './_error-options-chunk.js';
-import { MatFormFieldControl } from './_form-field-control-chunk.js';
-import { MatRippleModule } from './_ripple-module-chunk.js';
+import { ErrorStateMatcher } from './core.js';
+import { MatFormFieldControl } from './form-field.js';
+import { MatRippleModule } from './core.js';
 import { ModifierKey } from '@angular/cdk/keycodes';
 import * as i2 from '@angular/cdk/bidi';
 import '@angular/forms/signals';

package/types/datepicker.d.ts

@@ -8,13 +8,13 @@ import { FocusOrigin } from '@angular/cdk/a11y';
 import * as i2$1 from '@angular/cdk/portal';
 import { ComponentType, Portal, TemplatePortal } from '@angular/cdk/portal';
 import { Observable, Subject } from 'rxjs';
-import { DateAdapter } from './_date-adapter-chunk.js';
-import { ThemePalette } from './_palette-chunk.js';
+import { DateAdapter } from './core.js';
+import { ThemePalette } from './core.js';
 import { ControlValueAccessor, Validator, ValidatorFn, AbstractControl, ValidationErrors, NgForm, FormGroupDirective, NgControl } from '@angular/forms';
-import { MatFormFieldControl } from './_form-field-control-chunk.js';
+import { MatFormFieldControl } from './form-field.js';
 import * as i2$2 from '@angular/cdk/bidi';
 import { Directionality } from '@angular/cdk/bidi';
-import { ErrorStateMatcher } from './_error-options-chunk.js';
+import { ErrorStateMatcher } from './core.js';
 import * as i1$1 from '@angular/cdk/scrolling';
 import './_ripple-loader-chunk.js';
 import './_ripple-module-chunk.js';

package/types/dialog-testing.d.ts

@@ -1,6 +1,6 @@
 import * as _angular_cdk_testing from '@angular/cdk/testing';
 import { BaseHarnessFilters, ContentContainerComponentHarness, ComponentHarnessConstructor, HarnessPredicate } from '@angular/cdk/testing';
-import { DialogRole, MatDialog, MatDialogConfig, MatDialogRef } from './_dialog-chunk.js';
+import { DialogRole, MatDialog, MatDialogConfig, MatDialogRef } from './dialog.js';
 import { ComponentType } from '@angular/cdk/overlay';
 import { OnDestroy } from '@angular/core';
 import '@angular/cdk/bidi';

package/types/form-field-testing.d.ts

@@ -1,8 +1,8 @@
 import { MatFormFieldControlHarness } from './_form-field-control-harness-chunk.js';
 import { BaseHarnessFilters, ComponentHarness, ComponentHarnessConstructor, HarnessPredicate } from '@angular/cdk/testing';
-import { MatInputHarness } from './_input-harness-chunk.js';
+import { MatInputHarness } from './input-testing.js';
 import { MatSelectHarness } from './select-testing.js';
-import { MatDatepickerInputHarness, MatDateRangeInputHarness } from './_date-range-input-harness-chunk.js';
+import { MatDatepickerInputHarness, MatDateRangeInputHarness } from './datepicker-testing.js';
 import '@angular/material/form-field/testing/control';
 import '@angular/material/core/testing';
 

package/types/grid-list.d.ts

@@ -1,6 +1,7 @@
 import * as i0 from '@angular/core';
 import { AfterContentInit, QueryList, OnInit, AfterContentChecked } from '@angular/core';
-import { MatLine, MatLineModule } from './_line-chunk.js';
+import { MatLine } from './_line-chunk.js';
+import { MatLineModule } from './core.js';
 import { NumberInput } from '@angular/cdk/coercion';
 import * as i2 from '@angular/cdk/bidi';
 

package/types/icon-testing.d.ts

@@ -2,7 +2,7 @@ import { BaseHarnessFilters, ComponentHarness, HarnessPredicate } from '@angular
 import * as i0 from '@angular/core';
 import { OnDestroy } from '@angular/core';
 import { Observable } from 'rxjs';
-import { MatIconRegistry } from './_icon-registry-chunk.js';
+import { MatIconRegistry } from './icon.js';
 import '@angular/common/http';
 import '@angular/platform-browser';
 

package/types/input-testing.d.ts

@@ -1,6 +1,6 @@
 export { InputHarnessFilters, MatInputHarness } from './_input-harness-chunk.js';
 import { BaseHarnessFilters, ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
-import { MatFormFieldControlHarnessBase } from './_form-field-control-harness-chunk.js';
+import { MatFormFieldControlHarnessBase } from './form-field-testing-control.js';
 import { MatFormFieldControlHarnessFilters } from '@angular/material/form-field/testing/control';
 
 /** A set of criteria that can be used to filter a list of `MatNativeSelectHarness` instances. */

package/types/input.d.ts

@@ -4,11 +4,11 @@ import * as i0 from '@angular/core';
 import { InjectionToken, OnChanges, OnDestroy, AfterViewInit, DoCheck, ElementRef, WritableSignal } from '@angular/core';
 import { NgControl } from '@angular/forms';
 import { Subject } from 'rxjs';
-import { ErrorStateMatcher } from './_error-options-chunk.js';
+import { ErrorStateMatcher } from './core.js';
 import { MatFormField } from './_form-field-chunk.js';
 export { MatError, MatHint, MatPrefix, MatSuffix } from './_form-field-chunk.js';
-import { MatFormFieldControl } from './_form-field-control-chunk.js';
-import { MatFormFieldModule } from './_form-field-module-chunk.js';
+import { MatFormFieldControl } from './form-field.js';
+import { MatFormFieldModule } from './form-field.js';
 export { MatLabel } from './_form-field-module-chunk.js';
 import * as i3 from '@angular/cdk/text-field';
 import * as i2 from '@angular/cdk/bidi';