@angular/material 18.1.0-next.1 → 18.1.0-next.3

package/core/tokens/_m3-tokens.scss

@@ -135,6 +135,7 @@ $_cached-token-slots: null;
   );
 
   $type: map.get($theme, _mat-theming-internals-do-not-access, theme-type);
+  $system-variables-prefix: map.get($theme, system-variables-prefix) or sys;
   $primary: map.merge(map.get($palettes, primary), $base-palettes);
   $tertiary: map.merge(map.get($palettes, tertiary), $base-palettes);
   $error: map.get($palettes, error);
@@ -148,7 +149,7 @@ $_cached-token-slots: null;
     mdc-tokens.md-sys-color-values-light($ref));
 
   @each $name, $value in $sys-colors {
-    --sys-#{$name}: #{map.get($overrides, $name) or $value};
+    --#{$system-variables-prefix}-#{$name}: #{map.get($overrides, $name) or $value};
   }
 }
 
@@ -159,7 +160,7 @@ $_cached-token-slots: null;
   $bold: map.get($font-definition, bold);
   $medium: map.get($font-definition, medium);
   $regular: map.get($font-definition, regular);
-
+  $system-variables-prefix: map.get($theme, system-variables-prefix) or sys;
   $ref: (
     md-ref-typeface: _generate-ref-typeface-tokens($brand, $plain, $bold, $medium, $regular)
   );
@@ -167,168 +168,180 @@ $_cached-token-slots: null;
   $sys-typescale: mdc-tokens.md-sys-typescale-values($ref);
 
   @each $name, $value in $sys-typescale {
-    --sys-#{$name}: #{map.get($overrides, $name) or $value};
+    --#{$system-variables-prefix}-#{$name}: #{map.get($overrides, $name) or $value};
   }
 }
 
-@function _get-sys-color($type, $ref) {
+@function create-map($keys, $prefix) {
+  $result: ();
+  @each $key in $keys {
+    $result: map-merge($result, ($key: var(--#{$prefix}-#{$key})));
+  }
+  @return $result;
+}
+
+@function _get-sys-color($type, $ref, $prefix) {
   $mdc-sys-color: if($type == dark,
     mdc-tokens.md-sys-color-values-dark($ref),
     mdc-tokens.md-sys-color-values-light($ref));
 
   @if (sass-utils.$use-system-color-variables) {
-    @return (
-      'background': var(--sys-background),
-      'error': var(--sys-error),
-      'error-container': var(--sys-error-container),
-      'inverse-on-surface': var(--sys-inverse-on-surface),
-      'inverse-primary': var(--sys-inverse-primary),
-      'inverse-surface': var(--sys-inverse-surface),
-      'on-background': var(--sys-on-background),
-      'on-error': var(--sys-on-error),
-      'on-error-container': var(--sys-on-error-container),
-      'on-primary': var(--sys-on-primary),
-      'on-primary-container': var(--sys-on-primary-container),
-      'on-primary-fixed': var(--sys-on-primary-fixed),
-      'on-primary-fixed-variant': var(--sys-on-primary-fixed-variant),
-      'on-secondary': var(--sys-on-secondary),
-      'on-secondary-container': var(--sys-on-secondary-container),
-      'on-secondary-fixed': var(--sys-on-secondary-fixed),
-      'on-secondary-fixed-variant': var(--sys-on-secondary-fixed-variant),
-      'on-surface': var(--sys-on-surface),
-      'on-surface-variant': var(--sys-on-surface-variant),
-      'on-tertiary': var(--sys-on-tertiary),
-      'on-tertiary-container': var(--sys-on-tertiary-container),
-      'on-tertiary-fixed': var(--sys-on-tertiary-fixed),
-      'on-tertiary-fixed-variant': var(--sys-on-tertiary-fixed-variant),
-      'outline': var(--sys-outline),
-      'outline-variant': var(--sys-outline-variant),
-      'primary': var(--sys-primary),
-      'primary-container': var(--sys-primary-container),
-      'primary-fixed': var(--sys-primary-fixed),
-      'primary-fixed-dim': var(--sys-primary-fixed-dim),
-      'scrim': var(--sys-scrim),
-      'secondary': var(--sys-secondary),
-      'secondary-container': var(--sys-secondary-container),
-      'secondary-fixed': var(--sys-secondary-fixed),
-      'secondary-fixed-dim': var(--sys-secondary-fixed-dim),
-      'shadow': map.get($mdc-sys-color, shadow),
-      'surface': var(--sys-surface),
-      'surface-bright': var(--sys-surface-bright),
-      'surface-container': var(--sys-surface-container),
-      'surface-container-high': var(--sys-surface-container-high),
-      'surface-container-highest': var(--sys-surface-container-highest),
-      'surface-container-low': var(--sys-surface-container-low),
-      'surface-container-lowest': var(--sys-surface-container-lowest),
-      'surface-dim': var(--sys-surface-dim),
-      'surface-tint': var(--sys-surface-tint),
-      'surface-variant': var(--sys-surface-variant),
-      'tertiary': var(--sys-tertiary),
-      'tertiary-container': var(--sys-tertiary-container),
-      'tertiary-fixed': var(--sys-tertiary-fixed),
-      'tertiary-fixed-dim': var(--sys-tertiary-fixed-dim),
+    $keys: (
+            'background',
+            'error',
+            'error-container',
+            'inverse-on-surface',
+            'inverse-primary',
+            'inverse-surface',
+            'on-background',
+            'on-error',
+            'on-error-container',
+            'on-primary',
+            'on-primary-container',
+            'on-primary-fixed',
+            'on-primary-fixed-variant',
+            'on-secondary',
+            'on-secondary-container',
+            'on-secondary-fixed',
+            'on-secondary-fixed-variant',
+            'on-surface',
+            'on-surface-variant',
+            'on-tertiary',
+            'on-tertiary-container',
+            'on-tertiary-fixed',
+            'on-tertiary-fixed-variant',
+            'outline',
+            'outline-variant',
+            'primary',
+            'primary-container',
+            'primary-fixed',
+            'primary-fixed-dim',
+            'scrim',
+            'secondary',
+            'secondary-container',
+            'secondary-fixed',
+            'secondary-fixed-dim',
+            'surface',
+            'surface-bright',
+            'surface-container',
+            'surface-container-high',
+            'surface-container-highest',
+            'surface-container-low',
+            'surface-container-lowest',
+            'surface-dim',
+            'surface-tint',
+            'surface-variant',
+            'tertiary',
+            'tertiary-container',
+            'tertiary-fixed',
+            'tertiary-fixed-dim'
     );
+    @return map-merge(create-map($keys, $prefix), (
+            shadow: map.get($mdc-sys-color, shadow)
+    ));
   }
 
   @return $mdc-sys-color;
 }
 
-@function _get-sys-typeface($ref) {
+@function _get-sys-typeface($ref, $prefix) {
   @if (sass-utils.$use-system-typography-variables) {
-    @return (
-      'body-large': var(--sys-body-large),
-      'body-large-font': var(--sys-body-large-font),
-      'body-large-line-height': var(--sys-body-large-line-height),
-      'body-large-size': var(--sys-body-large-size),
-      'body-large-tracking': var(--sys-body-large-tracking),
-      'body-large-weight': var(--sys-body-large-weight),
-      'body-medium': var(--sys-body-medium),
-      'body-medium-font': var(--sys-body-medium-font),
-      'body-medium-line-height': var(--sys-body-medium-line-height),
-      'body-medium-size': var(--sys-body-medium-size),
-      'body-medium-tracking': var(--sys-body-medium-tracking),
-      'body-medium-weight': var(--sys-body-medium-weight),
-      'body-small': var(--sys-body-small),
-      'body-small-font': var(--sys-body-small-font),
-      'body-small-line-height': var(--sys-body-small-line-height),
-      'body-small-size': var(--sys-body-small-size),
-      'body-small-tracking': var(--sys-body-small-tracking),
-      'body-small-weight': var(--sys-body-small-weight),
-      'display-large': var(--sys-display-large),
-      'display-large-font': var(--sys-display-large-font),
-      'display-large-line-height': var(--sys-display-large-line-height),
-      'display-large-size': var(--sys-display-large-size),
-      'display-large-tracking': var(--sys-display-large-tracking),
-      'display-large-weight': var(--sys-display-large-weight),
-      'display-medium': var(--sys-display-medium),
-      'display-medium-font': var(--sys-display-medium-font),
-      'display-medium-line-height': var(--sys-display-medium-line-height),
-      'display-medium-size': var(--sys-display-medium-size),
-      'display-medium-tracking': var(--sys-display-medium-tracking),
-      'display-medium-weight': var(--sys-display-medium-weight),
-      'display-small': var(--sys-display-small),
-      'display-small-font': var(--sys-display-small-font),
-      'display-small-line-height': var(--sys-display-small-line-height),
-      'display-small-size': var(--sys-display-small-size),
-      'display-small-tracking': var(--sys-display-small-tracking),
-      'display-small-weight': var(--sys-display-small-weight),
-      'headline-large': var(--sys-headline-large),
-      'headline-large-font': var(--sys-headline-large-font),
-      'headline-large-line-height': var(--sys-headline-large-line-height),
-      'headline-large-size': var(--sys-headline-large-size),
-      'headline-large-tracking': var(--sys-headline-large-tracking),
-      'headline-large-weight': var(--sys-headline-large-weight),
-      'headline-medium': var(--sys-headline-medium),
-      'headline-medium-font': var(--sys-headline-medium-font),
-      'headline-medium-line-height': var(--sys-headline-medium-line-height),
-      'headline-medium-size': var(--sys-headline-medium-size),
-      'headline-medium-tracking': var(--sys-headline-medium-tracking),
-      'headline-medium-weight': var(--sys-headline-medium-weight),
-      'headline-small': var(--sys-headline-small),
-      'headline-small-font': var(--sys-headline-small-font),
-      'headline-small-line-height': var(--sys-headline-small-line-height),
-      'headline-small-size': var(--sys-headline-small-size),
-      'headline-small-tracking': var(--sys-headline-small-tracking),
-      'headline-small-weight': var(--sys-headline-small-weight),
-      'label-large': var(--sys-label-large),
-      'label-large-font': var(--sys-label-large-font),
-      'label-large-line-height': var(--sys-label-large-line-height),
-      'label-large-size': var(--sys-label-large-size),
-      'label-large-tracking': var(--sys-label-large-tracking),
-      'label-large-weight': var(--sys-label-large-weight),
-      'label-large-weight-prominent': var(--sys-label-large-weight-prominent),
-      'label-medium': var(--sys-label-medium),
-      'label-medium-font': var(--sys-label-medium-font),
-      'label-medium-line-height': var(--sys-label-medium-line-height),
-      'label-medium-size': var(--sys-label-medium-size),
-      'label-medium-tracking': var(--sys-label-medium-tracking),
-      'label-medium-weight': var(--sys-label-medium-weight),
-      'label-medium-weight-prominent': var(--sys-label-medium-weight-prominent),
-      'label-small': var(--sys-label-small),
-      'label-small-font': var(--sys-label-small-font),
-      'label-small-line-height': var(--sys-label-small-line-height),
-      'label-small-size': var(--sys-label-small-size),
-      'label-small-tracking': var(--sys-label-small-tracking),
-      'label-small-weight': var(--sys-label-small-weight),
-      'title-large': var(--sys-title-large),
-      'title-large-font': var(--sys-title-large-font),
-      'title-large-line-height': var(--sys-title-large-line-height),
-      'title-large-size': var(--sys-title-large-size),
-      'title-large-tracking': var(--sys-title-large-tracking),
-      'title-large-weight': var(--sys-title-large-weight),
-      'title-medium': var(--sys-title-medium),
-      'title-medium-font': var(--sys-title-medium-font),
-      'title-medium-line-height': var(--sys-title-medium-line-height),
-      'title-medium-size': var(--sys-title-medium-size),
-      'title-medium-tracking': var(--sys-title-medium-tracking),
-      'title-medium-weight': var(--sys-title-medium-weight),
-      'title-small': var(--sys-title-small),
-      'title-small-font': var(--sys-title-small-font),
-      'title-small-line-height': var(--sys-title-small-line-height),
-      'title-small-size': var(--sys-title-small-size),
-      'title-small-tracking': var(--sys-title-small-tracking),
-      'title-small-weight': var(--sys-title-small-weight),
+    $keys: (
+            'body-large',
+            'body-large-font',
+            'body-large-line-height',
+            'body-large-size',
+            'body-large-tracking',
+            'body-large-weight',
+            'body-medium',
+            'body-medium-font',
+            'body-medium-line-height',
+            'body-medium-size',
+            'body-medium-tracking',
+            'body-medium-weight',
+            'body-small',
+            'body-small-font',
+            'body-small-line-height',
+            'body-small-size',
+            'body-small-tracking',
+            'body-small-weight',
+            'display-large',
+            'display-large-font',
+            'display-large-line-height',
+            'display-large-size',
+            'display-large-tracking',
+            'display-large-weight',
+            'display-medium',
+            'display-medium-font',
+            'display-medium-line-height',
+            'display-medium-size',
+            'display-medium-tracking',
+            'display-medium-weight',
+            'display-small',
+            'display-small-font',
+            'display-small-line-height',
+            'display-small-size',
+            'display-small-tracking',
+            'display-small-weight',
+            'headline-large',
+            'headline-large-font',
+            'headline-large-line-height',
+            'headline-large-size',
+            'headline-large-tracking',
+            'headline-large-weight',
+            'headline-medium',
+            'headline-medium-font',
+            'headline-medium-line-height',
+            'headline-medium-size',
+            'headline-medium-tracking',
+            'headline-medium-weight',
+            'headline-small',
+            'headline-small-font',
+            'headline-small-line-height',
+            'headline-small-size',
+            'headline-small-tracking',
+            'headline-small-weight',
+            'label-large',
+            'label-large-font',
+            'label-large-line-height',
+            'label-large-size',
+            'label-large-tracking',
+            'label-large-weight',
+            'label-large-weight-prominent',
+            'label-medium',
+            'label-medium-font',
+            'label-medium-line-height',
+            'label-medium-size',
+            'label-medium-tracking',
+            'label-medium-weight',
+            'label-medium-weight-prominent',
+            'label-small',
+            'label-small-font',
+            'label-small-line-height',
+            'label-small-size',
+            'label-small-tracking',
+            'label-small-weight',
+            'title-large',
+            'title-large-font',
+            'title-large-line-height',
+            'title-large-size',
+            'title-large-tracking',
+            'title-large-weight',
+            'title-medium',
+            'title-medium-font',
+            'title-medium-line-height',
+            'title-medium-size',
+            'title-medium-tracking',
+            'title-medium-weight',
+            'title-small',
+            'title-small-font',
+            'title-small-line-height',
+            'title-small-size',
+            'title-small-tracking',
+            'title-small-weight'
     );
+
+    @return create-map($keys, $prefix);
   }
   @return mdc-tokens.md-sys-typescale-values($ref);
 }
@@ -338,13 +351,14 @@ $_cached-token-slots: null;
 /// @param {Map} $primary The primary palette
 /// @param {Map} $tertiary The tertiary palette
 /// @param {Map} $error The error palette
+/// @param {String} $system-variables-prefix The prefix of system tokens
 /// @return {Map} A map of namespaced color tokens
-@function generate-color-tokens($type, $primary, $tertiary, $error) {
+@function generate-color-tokens($type, $primary, $tertiary, $error, $system-variables-prefix) {
   $ref: (
     md-ref-palette: _generate-ref-palette-tokens($primary, $tertiary, $error)
   );
 
-  $sys-color: _get-sys-color($type, $ref);
+  $sys-color: _get-sys-color($type, $ref, $system-variables-prefix);
 
   @return _generate-tokens(map.merge($ref, (
     md-sys-color: $sys-color,
@@ -365,12 +379,14 @@ $_cached-token-slots: null;
 /// @param {String|Number} $bold The bold font-weight
 /// @param {String|Number} $medium The medium font-weight
 /// @param {String|Number} $regular The regular font-weight
+/// @param {String} $system-variables-prefix The prefix of system tokens
 /// @return {Map} A map of namespaced typography tokens
-@function generate-typography-tokens($brand, $plain, $bold, $medium, $regular) {
+@function generate-typography-tokens($brand, $plain, $bold, $medium, $regular,
+$system-variables-prefix) {
   $ref: (
     md-ref-typeface: _generate-ref-typeface-tokens($brand, $plain, $bold, $medium, $regular)
   );
-  $sys-typeface: _get-sys-typeface($ref);
+  $sys-typeface: _get-sys-typeface($ref, $system-variables-prefix);
   @return _generate-tokens((
     md-sys-typescale: $sys-typeface
   ));

package/core/tokens/m2/mat/_app.scss

@@ -1,6 +1,9 @@
+@use '@material/elevation/elevation-theme' as mdc-elevation;
+@use 'sass:map';
 @use '../../token-utils';
 @use '../../../theming/inspection';
 @use '../../../style/sass-utils';
+@use '../../../style/elevation';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
 $prefix: (mat, app);
@@ -13,10 +16,19 @@ $prefix: (mat, app);
 
 // Tokens that can be configured through Angular Material's color theming API.
 @function get-color-tokens($theme) {
-  @return (
+  $tokens: (
     background-color: inspection.get-theme-color($theme, background, background),
     text-color: inspection.get-theme-color($theme, foreground, text),
   );
+
+  @for $zValue from 0 through 24 {
+    $elevation-color: inspection.get-theme-color($theme, foreground, elevation);
+    $shadow: mdc-elevation.elevation-box-shadow($zValue,
+      if($elevation-color == null, elevation.$color, $elevation-color));
+    $tokens: map.set($tokens, 'elevation-shadow-level-#{$zValue}', $shadow);
+  }
+
+  @return $tokens;
 }
 
 // Tokens that can be configured through Angular Material's typography theming API.

package/core/tokens/m2/mat/_menu.scss

@@ -18,6 +18,9 @@ $prefix: (mat, menu);
     item-trailing-spacing: 16px,
     item-with-icon-leading-spacing: 16px,
     item-with-icon-trailing-spacing: 16px,
+    // Note that this uses a value, rather than a computed box-shadow, because we use
+    // the value at runtime to determine which shadow to set based on the menu's depth.
+    base-elevation-level: 8,
   );
 }
 

package/core/tokens/m2/mat/_paginator.scss

@@ -69,6 +69,7 @@ $prefix: (mat, paginator);
     container-size: map.get($size-scale, $density-scale),
     form-field-container-height: $form-field-height,
     form-field-container-vertical-padding: $form-field-vertical-padding,
+    touch-target-display: if($density-scale < -2, none, block),
   );
 }
 

package/core/tokens/m3/mat/_app.scss

@@ -1,4 +1,5 @@
 @use 'sass:map';
+@use '@material/elevation' as mdc-elevation;
 @use '../../token-utils';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
@@ -10,10 +11,18 @@ $prefix: (mat, app);
 /// @param {Map} $token-slots Possible token slots
 /// @return {Map} A set of custom tokens for the app
 @function get-tokens($systems, $exclude-hardcoded, $token-slots) {
+  $shadow-color: map.get($systems, md-sys-color, shadow);
   $tokens: (
     background-color: map.get($systems, md-sys-color, background),
     text-color: map.get($systems, md-sys-color, on-background),
   );
 
+  @if ($shadow-color) {
+    @for $zValue from 0 through 24 {
+      $shadow: mdc-elevation.elevation-box-shadow($zValue, $shadow-color);
+      $tokens: map.set($tokens, 'elevation-shadow-level-#{$zValue}', $shadow);
+    }
+  }
+
   @return token-utils.namespace-tokens($prefix, $tokens, $token-slots);
 }

package/core/tokens/m3/mat/_divider.scss

@@ -12,7 +12,7 @@ $prefix: (mat, divider);
 @function get-tokens($systems, $exclude-hardcoded, $token-slots) {
   $tokens: (
     width: token-utils.hardcode(1px, $exclude-hardcoded),
-    color: map.get($systems, md-sys-color, outline-variant),
+    color: map.get($systems, md-sys-color, outline),
   );
 
   @return token-utils.namespace-tokens($prefix, $tokens, $token-slots);

package/core/tokens/m3/mat/_expansion.scss

@@ -20,7 +20,7 @@ $prefix: (mat, expansion);
       header-indicator-display: token-utils.hardcode(inline-block, $exclude-hardcoded),
       container-background-color: map.get($systems, md-sys-color, surface),
       container-text-color: map.get($systems, md-sys-color, on-surface),
-      actions-divider-color: map.get($systems, md-sys-color, outline-variant),
+      actions-divider-color: map.get($systems, md-sys-color, outline),
       header-hover-state-layer-color: sass-utils.safe-color-change(
         map.get($systems, md-sys-color, on-surface),
         $alpha: map.get($systems, md-sys-state, hover-state-layer-opacity)

package/core/tokens/m3/mat/_menu.scss

@@ -35,6 +35,9 @@ $prefix: (mat, menu);
       item-with-icon-leading-spacing: token-utils.hardcode(12px, $exclude-hardcoded),
       item-with-icon-trailing-spacing: token-utils.hardcode(12px, $exclude-hardcoded),
       container-color: map.get($systems, md-sys-color, surface-container),
+      // Note that this uses a value, rather than a computed box-shadow, because we use
+      // the value at runtime to determine which shadow to set based on the menu's depth.
+      base-elevation-level: token-utils.hardcode(2, $exclude-hardcoded),
     )
   );
 

package/core/tokens/m3/mat/_stepper.scss

@@ -14,7 +14,7 @@ $prefix: (mat, stepper);
   $tokens: (
     (
       container-color: map.get($systems, md-sys-color, surface),
-      line-color: map.get($systems, md-sys-color, outline-variant),
+      line-color: map.get($systems, md-sys-color, outline),
       header-hover-state-layer-color: sass-utils.safe-color-change(
         map.get($systems, md-sys-color, inverse-surface),
         $alpha: map.get($systems, md-sys-state, hover-state-layer-opacity)

package/core/tokens/m3/mat/_table.scss

@@ -20,7 +20,7 @@ $prefix: (mat, table);
       background-color: map.get($systems, md-sys-color, surface),
       header-headline-color: map.get($systems, md-sys-color, on-surface),
       row-item-label-text-color: map.get($systems, md-sys-color, on-surface),
-      row-item-outline-color: map.get($systems, md-sys-color, outline-variant),
+      row-item-outline-color: map.get($systems, md-sys-color, outline),
     ),
   );
 

package/datepicker/index.d.ts

@@ -40,6 +40,7 @@ import { OnInit } from '@angular/core';
 import { Overlay } from '@angular/cdk/overlay';
 import { Portal } from '@angular/cdk/portal';
 import { ScrollStrategy } from '@angular/cdk/overlay';
+import { Signal } from '@angular/core';
 import { SimpleChanges } from '@angular/core';
 import { Subject } from 'rxjs';
 import { TemplatePortal } from '@angular/cdk/portal';
@@ -49,6 +50,7 @@ import { ValidationErrors } from '@angular/forms';
 import { Validator } from '@angular/forms';
 import { ValidatorFn } from '@angular/forms';
 import { ViewContainerRef } from '@angular/core';
+import { WritableSignal } from '@angular/core';
 
 /** Function that can be used to filter out dates from a calendar. */
 export declare type DateFilterFn<D> = (date: D | null) => boolean;
@@ -696,7 +698,11 @@ declare abstract class MatDatepickerBase<C extends MatDatepickerControl<D>, S, D
     private _startAt;
     /** The view that the calendar should start in. */
     startView: 'month' | 'year' | 'multi-year';
-    /** Color palette to use on the datepicker's calendar. */
+    /**
+     * Color palette to use on the datepicker's calendar. This API is supported in M2 themes only, it
+     * has no effect in M3 themes. For information on applying color variants in M3, see
+     * https://material.angular.io/guide/theming#using-component-color-variants
+     */
     get color(): ThemePalette;
     set color(value: ThemePalette);
     _color: ThemePalette;
@@ -769,6 +775,7 @@ declare abstract class MatDatepickerBase<C extends MatDatepickerControl<D>, S, D
     /** Emits when the datepicker's state changes. */
     readonly stateChanges: Subject<void>;
     private _injector;
+    private readonly _changeDetectorRef;
     constructor(_overlay: Overlay, 
     /**
      * @deprecated parameter is unused and will be removed
@@ -854,7 +861,13 @@ export declare class MatDatepickerContent<S, D = ExtractDateTypeFromSelection<S>
     private _model;
     /** Reference to the internal calendar component. */
     _calendar: MatCalendar<D>;
-    /** Palette color of the internal calendar. */
+    /**
+     * Theme color of the internal calendar. This API is supported in M2 themes
+     * only, it has no effect in M3 themes.
+     *
+     * For information on applying color variants in M3, see
+     * https://material.angular.io/guide/theming#using-component-color-variants.
+     */
     color: ThemePalette;
     /** Reference to the datepicker that created the overlay. */
     datepicker: MatDatepickerBase<any, S, D>;
@@ -922,9 +935,12 @@ export declare interface MatDatepickerControl<D> {
 export declare class MatDatepickerInput<D> extends MatDatepickerInputBase<D | null, D> implements MatDatepickerControl<D | null>, OnDestroy {
     private _formField?;
     private _closedSubscription;
+    private _openedSubscription;
     /** The datepicker that this input is associated with. */
     set matDatepicker(datepicker: MatDatepickerPanel<MatDatepickerControl<D>, D | null, D>);
     _datepicker: MatDatepickerPanel<MatDatepickerControl<D>, D | null, D>;
+    /** The id of the panel owned by this input. */
+    protected _ariaOwns: WritableSignal<string | null>;
     /** The minimum valid date. */
     get min(): D | null;
     set min(value: D | null);
@@ -1144,7 +1160,11 @@ export declare class MatDatepickerModule {
 export declare interface MatDatepickerPanel<C extends MatDatepickerControl<D>, S, D = ExtractDateTypeFromSelection<S>> {
     /** Stream that emits whenever the date picker is closed. */
     closedStream: EventEmitter<void>;
-    /** Color palette to use on the datepicker's calendar. */
+    /**
+     * Color palette to use on the datepicker's calendar. This API is supported in M2 themes only, it
+     * has no effect in M3 themes. For information on applying color variants in M3, see
+     * https://material.angular.io/guide/theming#using-component-color-variants
+     */
     color: ThemePalette;
     /** The input element the datepicker is associated with. */
     datepickerInput: C;
@@ -1207,6 +1227,7 @@ export declare class MatDateRangeInput<D> implements MatFormFieldControl<DateRan
     private _dateAdapter;
     private _formField?;
     private _closedSubscription;
+    private _openedSubscription;
     /** Current value of the range input. */
     get value(): DateRange<D> | null;
     /** Unique ID for the group. */
@@ -1227,6 +1248,8 @@ export declare class MatDateRangeInput<D> implements MatFormFieldControl<DateRan
     get rangePicker(): MatDatepickerPanel<MatDatepickerControl<D>, DateRange<D>, D>;
     set rangePicker(rangePicker: MatDatepickerPanel<MatDatepickerControl<D>, DateRange<D>, D>);
     private _rangePicker;
+    /** The id of the panel owned by this input. */
+    _ariaOwns: WritableSignal<string | null>;
     /** Whether the input is required. */
     get required(): boolean;
     set required(value: boolean);
@@ -1336,6 +1359,7 @@ declare interface MatDateRangeInputParent<D> {
         opened: boolean;
         id: string;
     };
+    _ariaOwns?: Signal<string | null>;
     _startInput: MatDateRangeInputPartBase<D>;
     _endInput: MatDateRangeInputPartBase<D>;
     _groupDisabled: boolean;

package/dialog/index.d.ts

@@ -350,7 +350,6 @@ export declare class MatDialogContainer extends CdkDialogContainer<MatDialogConf
     private _exitAnimationDuration;
     /** Current timer for dialog animations. */
     private _animationTimer;
-    private _isDestroyed;
     constructor(elementRef: ElementRef, focusTrapFactory: FocusTrapFactory, _document: any, dialogConfig: MatDialogConfig, interactivityChecker: InteractivityChecker, ngZone: NgZone, overlayRef: OverlayRef, _animationMode?: string | undefined, focusMonitor?: FocusMonitor);
     protected _contentAttached(): void;
     /** Starts the dialog open animation if enabled. */

package/dialog/testing/index.d.ts

@@ -73,6 +73,7 @@ export declare class MatTestDialogOpener<T = unknown, R = unknown> implements On
     /** Data passed to the `MatDialog` close method. */
     closedResult: R | undefined;
     private readonly _afterClosedSubscription;
+    private readonly _ngZone;
     /** Static method that prepares this class to open the provided component. */
     static withComponent<T = unknown, R = unknown>(component: ComponentType<T>, config?: MatDialogConfig): ComponentType<MatTestDialogOpener<T, R>>;
     constructor(dialog: MatDialog);