@angular/material 14.0.0-next.1 → 14.0.0-next.12

package/core/common-behaviors/error-state.d.ts

@@ -11,8 +11,6 @@ import { ErrorStateMatcher } from '../error/error-options';
 import { AbstractConstructor, Constructor } from './constructor';
 /** @docs-private */
 export interface CanUpdateErrorState {
-    /** Emits whenever the component state changes. */
-    readonly stateChanges: Subject<void>;
     /** Updates the error state based on the provided error state matcher. */
     updateErrorState(): void;
     /** Whether the component is in an error state. */
@@ -27,6 +25,7 @@ export interface HasErrorState {
     _parentForm: NgForm;
     _defaultErrorStateMatcher: ErrorStateMatcher;
     ngControl: NgControl;
+    stateChanges: Subject<void>;
 }
 /**
  * Mixin to augment a directive with updateErrorState method.

package/core/datetime/index.d.ts

@@ -1,12 +1,11 @@
 import * as i0 from "@angular/core";
-import * as i1 from "@angular/cdk/platform";
 export * from './date-adapter';
 export * from './date-formats';
 export * from './native-date-adapter';
 export * from './native-date-formats';
 export declare class NativeDateModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<NativeDateModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<NativeDateModule, never, [typeof i1.PlatformModule], never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<NativeDateModule, never, never, never>;
     static ɵinj: i0.ɵɵInjectorDeclaration<NativeDateModule>;
 }
 export declare class MatNativeDateModule {

package/core/line/line.d.ts

@@ -15,7 +15,7 @@ import * as i1 from "../common-behaviors/common-module";
  */
 export declare class MatLine {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatLine, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatLine, "[mat-line], [matLine]", never, {}, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatLine, "[mat-line], [matLine]", never, {}, {}, never, never, false>;
 }
 /**
  * Helper that takes a query list of lines and sets the correct class on the host.

package/core/option/optgroup.d.ts

@@ -22,7 +22,7 @@ export declare class _MatOptgroupBase extends _MatOptgroupMixinBase implements C
     _inert: boolean;
     constructor(parent?: MatOptionParentComponent);
     static ɵfac: i0.ɵɵFactoryDeclaration<_MatOptgroupBase, [{ optional: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<_MatOptgroupBase, never, never, { "label": "label"; }, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<_MatOptgroupBase, never, never, { "label": "label"; }, {}, never, never, false>;
 }
 /**
  * Injection token that can be used to reference instances of `MatOptgroup`. It serves as
@@ -35,6 +35,6 @@ export declare const MAT_OPTGROUP: InjectionToken<MatOptgroup>;
  */
 export declare class MatOptgroup extends _MatOptgroupBase {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatOptgroup, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatOptgroup, "mat-optgroup", ["matOptgroup"], { "disabled": "disabled"; }, {}, never, ["*", "mat-option, ng-container"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatOptgroup, "mat-optgroup", ["matOptgroup"], { "disabled": "disabled"; }, {}, never, ["*", "mat-option, ng-container"], false>;
 }
 export {};

package/core/option/option.d.ts

@@ -106,7 +106,7 @@ export declare class _MatOptionBase<T = any> implements FocusableOption, AfterVi
     /** Emits the selection change event. */
     private _emitSelectionChangeEvent;
     static ɵfac: i0.ɵɵFactoryDeclaration<_MatOptionBase<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<_MatOptionBase<any>, never, never, { "value": "value"; "id": "id"; "disabled": "disabled"; }, { "onSelectionChange": "onSelectionChange"; }, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<_MatOptionBase<any>, never, never, { "value": "value"; "id": "id"; "disabled": "disabled"; }, { "onSelectionChange": "onSelectionChange"; }, never, never, false>;
 }
 /**
  * Single option inside of a `<mat-select>` element.
@@ -114,7 +114,7 @@ export declare class _MatOptionBase<T = any> implements FocusableOption, AfterVi
 export declare class MatOption<T = any> extends _MatOptionBase<T> {
     constructor(element: ElementRef<HTMLElement>, changeDetectorRef: ChangeDetectorRef, parent: MatOptionParentComponent, group: MatOptgroup);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatOption<any>, [null, null, { optional: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatOption<any>, "mat-option", ["matOption"], {}, {}, never, ["*"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatOption<any>, "mat-option", ["matOption"], {}, {}, never, ["*"], false>;
 }
 /**
  * Counts the amount of option group labels that precede the specified option.

package/core/ripple/_ripple.scss

@@ -1,4 +1,4 @@
-@use '../../../cdk/a11y';
+@use '@angular/cdk';
 
 @mixin ripple() {
   // The host element of an mat-ripple directive should always have a position of "absolute" or
@@ -36,7 +36,7 @@
     transform: scale3d(0, 0, 0);
 
     // In high contrast mode the ripple is opaque, causing it to obstruct the content.
-    @include a11y.high-contrast(active, off) {
+    @include cdk.high-contrast(active, off) {
       display: none;
     }
   }

package/core/ripple/index.d.ts

@@ -1,12 +1,11 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./ripple";
 import * as i2 from "../common-behaviors/common-module";
-import * as i3 from "@angular/cdk/platform";
 export * from './ripple';
 export * from './ripple-ref';
 export * from './ripple-renderer';
 export declare class MatRippleModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MatRippleModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MatRippleModule, [typeof i1.MatRipple], [typeof i2.MatCommonModule, typeof i3.PlatformModule], [typeof i1.MatRipple, typeof i2.MatCommonModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MatRippleModule, [typeof i1.MatRipple], [typeof i2.MatCommonModule], [typeof i1.MatRipple, typeof i2.MatCommonModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MatRippleModule>;
 }

package/core/ripple/ripple-ref.d.ts

@@ -39,6 +39,7 @@ export declare class RippleRef {
     element: HTMLElement;
     /** Ripple configuration used for the ripple. */
     config: RippleConfig;
+    _animationForciblyDisabledThroughCss: boolean;
     /** Current state of the ripple. */
     state: RippleState;
     constructor(_renderer: {
@@ -47,7 +48,7 @@ export declare class RippleRef {
     /** Reference to the ripple HTML element. */
     element: HTMLElement, 
     /** Ripple configuration used for the ripple. */
-    config: RippleConfig);
+    config: RippleConfig, _animationForciblyDisabledThroughCss?: boolean);
     /** Fades out the ripple element. */
     fadeOut(): void;
 }

package/core/ripple/ripple-renderer.d.ts

@@ -43,7 +43,12 @@ export declare class RippleRenderer implements EventListenerObject {
     private _triggerElement;
     /** Whether the pointer is currently down or not. */
     private _isPointerDown;
-    /** Set of currently active ripple references. */
+    /**
+     * Map of currently active ripple references.
+     * The ripple reference is mapped to its element event listeners.
+     * The reason why `| null` is used is that event listeners are added only
+     * when the condition is truthy (see the `_startFadeOutTransition` method).
+     */
     private _activeRipples;
     /** Latest non-persistent ripple that was triggered. */
     private _mostRecentTransientRipple;
@@ -77,16 +82,24 @@ export declare class RippleRenderer implements EventListenerObject {
      * @docs-private
      */
     handleEvent(event: Event): void;
+    /** Method that will be called if the fade-in or fade-in transition completed. */
+    private _finishRippleTransition;
+    /**
+     * Starts the fade-out transition of the given ripple if it's not persistent and the pointer
+     * is not held down anymore.
+     */
+    private _startFadeOutTransition;
+    /** Destroys the given ripple by removing it from the DOM and updating its state. */
+    private _destroyRipple;
     /** Function being called whenever the trigger is being pressed using mouse. */
     private _onMousedown;
     /** Function being called whenever the trigger is being pressed using touch. */
     private _onTouchStart;
     /** Function being called whenever the trigger is being released. */
     private _onPointerUp;
-    /** Runs a timeout outside of the Angular zone to avoid triggering the change detection. */
-    private _runTimeoutOutsideZone;
     /** Registers event listeners for a given list of events. */
     private _registerEvents;
+    private _getActiveRipples;
     /** Removes previously registered event listeners from the trigger element. */
     _removeTriggerEvents(): void;
 }

package/core/ripple/ripple.d.ts

@@ -109,5 +109,5 @@ export declare class MatRipple implements OnInit, OnDestroy, RippleTarget {
      */
     launch(x: number, y: number, config?: RippleConfig): RippleRef;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatRipple, [null, null, null, { optional: true; }, { optional: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatRipple, "[mat-ripple], [matRipple]", ["matRipple"], { "color": "matRippleColor"; "unbounded": "matRippleUnbounded"; "centered": "matRippleCentered"; "radius": "matRippleRadius"; "animation": "matRippleAnimation"; "disabled": "matRippleDisabled"; "trigger": "matRippleTrigger"; }, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatRipple, "[mat-ripple], [matRipple]", ["matRipple"], { "color": "matRippleColor"; "unbounded": "matRippleUnbounded"; "centered": "matRippleCentered"; "radius": "matRippleRadius"; "animation": "matRippleAnimation"; "disabled": "matRippleDisabled"; "trigger": "matRippleTrigger"; }, {}, never, never, false>;
 }

package/core/selection/pseudo-checkbox/pseudo-checkbox.d.ts

@@ -25,5 +25,5 @@ export declare class MatPseudoCheckbox {
     disabled: boolean;
     constructor(_animationMode?: string | undefined);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatPseudoCheckbox, [{ optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatPseudoCheckbox, "mat-pseudo-checkbox", never, { "state": "state"; "disabled": "disabled"; }, {}, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatPseudoCheckbox, "mat-pseudo-checkbox", never, { "state": "state"; "disabled": "disabled"; }, {}, never, never, false>;
 }

package/core/style/_menu-common.scss

@@ -1,4 +1,5 @@
-@use '../../../cdk/a11y';
+@use '@angular/cdk';
+
 @use './list-common';
 @use './layout-common';
 
@@ -84,7 +85,7 @@ $icon-margin: 16px !default;
   }
 
   // Fix for Chromium-based browsers blending in the `currentColor` with the background.
-  @include a11y.high-contrast(active, off) {
+  @include cdk.high-contrast(active, off) {
     fill: CanvasText;
   }
 }

package/core/style/_vendor-prefixes.scss

@@ -1,7 +1,6 @@
 // stylelint-disable material/no-prefixes
 @mixin user-select($value) {
   -webkit-user-select: $value;
-  -moz-user-select: $value;
   user-select: $value;
 }
 
@@ -25,27 +24,12 @@
   }
 }
 
-@mixin cursor-grab {
-  cursor: -webkit-grab;
-  cursor: grab;
-}
-
-@mixin cursor-grabbing {
-  cursor: -webkit-grabbing;
-  cursor: grabbing;
-}
-
 @mixin backface-visibility($value) {
   -webkit-backface-visibility: $value;
   backface-visibility: $value;
 }
 
-@mixin position-sticky($important: false) {
-  position: -webkit-sticky #{if($important, '!important', '')};
-  position: sticky #{if($important, '!important', '')};
-}
-
-@mixin private-color-adjust($value) {
+@mixin color-adjust($value) {
   -webkit-print-color-adjust: $value;
   color-adjust: $value;
 }

package/core/theming/_theming.scss

@@ -74,7 +74,7 @@ $_emitted-density: () !default;
 
 /// Gets a color from a theme palette (the output of mat-palette).
 /// The hue can be one of the standard values (500, A400, etc.), one of the three preconfigured
-/// hues (default, lighter, darker), or any of the aforementioned prefixed with "-contrast".
+/// hues (default, lighter, darker), or any of the aforementioned suffixed with "-contrast".
 ///
 /// @param {Map} $palette The palette from which to extract a color.
 /// @param {String | Number} $hue The hue from the palette to use. If this is a value between 0
@@ -437,3 +437,12 @@ $_emitted-density: () !default;
     color: $theme-or-color-config
   ));
 }
+
+
+// Approximates an rgba color into a solid hex color, given a background color.
+@function private-rgba-to-hex($color, $background-color) {
+  // We convert the rgba color into a solid one by taking the opacity from the rgba
+  // value and using it to determine the percentage of the background to put
+  // into foreground when mixing the colors together.
+  @return mix($background-color, rgba($color, 1), (1 - opacity($color)) * 100%);
+}

package/core/typography/_typography.scss

@@ -8,7 +8,7 @@
 /// @param {String | Number} $font-weight The font-weight for this level.
 /// @param {String} $font-family The font-family for this level.
 /// @param {String} $letter-spacing The letter-spacing for this level.
-/// @returns {Map} A map representing the definition of this typpographic level.
+/// @returns {Map} A map representing the definition of this typographic level.
 @function define-typography-level(
   $font-size,
   $line-height: $font-size,
@@ -183,22 +183,41 @@
 @mixin typography-hierarchy($config-or-theme, $selector: '.mat-typography') {
   $config: private-typography-to-2014-config(theming.get-typography-config($config-or-theme));
 
-  .mat-h1, .mat-headline, #{$selector} h1 {
+  // Note that it seems redundant to prefix the class rules with the `$selector`, however it's
+  // necessary if we want to allow people to overwrite the tag selectors. This is due to
+  // selectors like `#{$selector} h1` being more specific than ones like `.mat-title`.
+  .mat-h1,
+  .mat-headline,
+  #{$selector} .mat-h1,
+  #{$selector} .mat-headline,
+  #{$selector} h1 {
     @include typography-utils.typography-level($config, headline);
     margin: 0 0 16px;
   }
 
-  .mat-h2, .mat-title, #{$selector} h2 {
+  .mat-h2,
+  .mat-title,
+  #{$selector} .mat-h2,
+  #{$selector} .mat-title,
+  #{$selector} h2 {
     @include typography-utils.typography-level($config, title);
     margin: 0 0 16px;
   }
 
-  .mat-h3, .mat-subheading-2, #{$selector} h3 {
+  .mat-h3,
+  .mat-subheading-2,
+  #{$selector} .mat-h3,
+  #{$selector} .mat-subheading-2,
+  #{$selector} h3 {
     @include typography-utils.typography-level($config, subheading-2);
     margin: 0 0 16px;
   }
 
-  .mat-h4, .mat-subheading-1, #{$selector} h4 {
+  .mat-h4,
+  .mat-subheading-1,
+  #{$selector} .mat-h4,
+  #{$selector} .mat-subheading-1,
+  #{$selector} h4 {
     @include typography-utils.typography-level($config, subheading-1);
     margin: 0 0 16px;
   }
@@ -206,7 +225,9 @@
   // Note: the spec doesn't have anything that would correspond to h5 and h6, but we add these for
   // consistency. The font sizes come from the Chrome user agent styles which have h5 at 0.83em
   // and h6 at 0.67em.
-  .mat-h5, #{$selector} h5 {
+  .mat-h5,
+  #{$selector} .mat-h5,
+  #{$selector} h5 {
     @include typography-utils.font-shorthand(
        // calc is used here to support css variables
       calc(#{typography-utils.font-size($config, body-1)} * 0.83),
@@ -218,7 +239,9 @@
     margin: 0 0 12px;
   }
 
-  .mat-h6, #{$selector} h6 {
+  .mat-h6,
+  #{$selector} .mat-h6,
+  #{$selector} h6 {
     @include typography-utils.font-shorthand(
        // calc is used here to support css variables
       calc(#{typography-utils.font-size($config, body-1)} * 0.67),
@@ -230,11 +253,18 @@
     margin: 0 0 12px;
   }
 
-  .mat-body-strong, .mat-body-2 {
+  .mat-body-strong,
+  .mat-body-2,
+  #{$selector} .mat-body-strong,
+  #{$selector} .mat-body-2 {
     @include typography-utils.typography-level($config, body-2);
   }
 
-  .mat-body, .mat-body-1, #{$selector} {
+  .mat-body,
+  .mat-body-1,
+  #{$selector} .mat-body,
+  #{$selector} .mat-body-1,
+  #{$selector} {
     @include typography-utils.typography-level($config, body-1);
 
     p {
@@ -242,26 +272,33 @@
     }
   }
 
-  .mat-small, .mat-caption {
+  .mat-small,
+  .mat-caption,
+  #{$selector} .mat-small,
+  #{$selector} .mat-caption {
     @include typography-utils.typography-level($config, caption);
   }
 
-  .mat-display-4, #{$selector} .mat-display-4 {
+  .mat-display-4,
+  #{$selector} .mat-display-4 {
     @include typography-utils.typography-level($config, display-4);
     margin: 0 0 56px;
   }
 
-  .mat-display-3, #{$selector} .mat-display-3 {
+  .mat-display-3,
+  #{$selector} .mat-display-3 {
     @include typography-utils.typography-level($config, display-3);
     margin: 0 0 64px;
   }
 
-  .mat-display-2, #{$selector} .mat-display-2 {
+  .mat-display-2,
+  #{$selector} .mat-display-2 {
     @include typography-utils.typography-level($config, display-2);
     margin: 0 0 64px;
   }
 
-  .mat-display-1, #{$selector} .mat-display-1 {
+  .mat-display-1,
+  #{$selector} .mat-display-1 {
     @include typography-utils.typography-level($config, display-1);
     margin: 0 0 64px;
   }

package/datepicker/calendar-body.d.ts

@@ -5,7 +5,7 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
-import { ElementRef, EventEmitter, NgZone, OnChanges, SimpleChanges, OnDestroy } from '@angular/core';
+import { ElementRef, EventEmitter, NgZone, OnChanges, SimpleChanges, OnDestroy, AfterViewChecked } from '@angular/core';
 import * as i0 from "@angular/core";
 /** Extra CSS classes that can be associated with a calendar cell. */
 export declare type MatCalendarCellCssClasses = string | string[] | Set<string> | {
@@ -36,7 +36,7 @@ export interface MatCalendarUserEvent<D> {
  * An internal component used to display calendar data in a table.
  * @docs-private
  */
-export declare class MatCalendarBody implements OnChanges, OnDestroy {
+export declare class MatCalendarBody implements OnChanges, OnDestroy, AfterViewChecked {
     private _elementRef;
     private _ngZone;
     /**
@@ -44,6 +44,10 @@ export declare class MatCalendarBody implements OnChanges, OnDestroy {
      * We need a flag like this, because some browsers fire focus events asynchronously.
      */
     private _skipNextFocus;
+    /**
+     * Used to focus the active cell after change detection has run.
+     */
+    private _focusActiveCellAfterViewChecked;
     /** The label for the table. (e.g. "Jan 2017"). */
     label: string;
     /** The cells to display in the table. */
@@ -60,6 +64,7 @@ export declare class MatCalendarBody implements OnChanges, OnDestroy {
     numCols: number;
     /** The cell number of the active cell in the table. */
     activeCell: number;
+    ngAfterViewChecked(): void;
     /** Whether a range is being selected. */
     isRange: boolean;
     /**
@@ -79,6 +84,7 @@ export declare class MatCalendarBody implements OnChanges, OnDestroy {
     readonly selectedValueChange: EventEmitter<MatCalendarUserEvent<number>>;
     /** Emits when the preview has changed as a result of a user action. */
     readonly previewChange: EventEmitter<MatCalendarUserEvent<MatCalendarCell<any> | null>>;
+    readonly activeDateChange: EventEmitter<MatCalendarUserEvent<number>>;
     /** The number of blank cells to put at the beginning for the first row. */
     _firstRowOffset: number;
     /** Padding for the individual date cells. */
@@ -88,14 +94,38 @@ export declare class MatCalendarBody implements OnChanges, OnDestroy {
     constructor(_elementRef: ElementRef<HTMLElement>, _ngZone: NgZone);
     /** Called when a cell is clicked. */
     _cellClicked(cell: MatCalendarCell, event: MouseEvent): void;
+    _emitActiveDateChange(cell: MatCalendarCell, event: FocusEvent): void;
     /** Returns whether a cell should be marked as selected. */
     _isSelected(value: number): boolean;
     ngOnChanges(changes: SimpleChanges): void;
     ngOnDestroy(): void;
     /** Returns whether a cell is active. */
     _isActiveCell(rowIndex: number, colIndex: number): boolean;
-    /** Focuses the active cell after the microtask queue is empty. */
+    /**
+     * Focuses the active cell after the microtask queue is empty.
+     *
+     * Adding a 0ms setTimeout seems to fix Voiceover losing focus when pressing PageUp/PageDown
+     * (issue #24330).
+     *
+     * Determined a 0ms by gradually increasing duration from 0 and testing two use cases with screen
+     * reader enabled:
+     *
+     * 1. Pressing PageUp/PageDown repeatedly with pausing between each key press.
+     * 2. Pressing and holding the PageDown key with repeated keys enabled.
+     *
+     * Test 1 worked roughly 95-99% of the time with 0ms and got a little bit better as the duration
+     * increased. Test 2 got slightly better until the duration was long enough to interfere with
+     * repeated keys. If the repeated key speed was faster than the timeout duration, then pressing
+     * and holding pagedown caused the entire page to scroll.
+     *
+     * Since repeated key speed can verify across machines, determined that any duration could
+     * potentially interfere with repeated keys. 0ms would be best because it almost entirely
+     * eliminates the focus being lost in Voiceover (#24330) without causing unintended side effects.
+     * Adding delay also complicates writing tests.
+     */
     _focusActiveCell(movePreview?: boolean): void;
+    /** Focuses the active cell after change detection has run and the microtask queue is empty. */
+    _scheduleFocusActiveCellAfterViewChecked(): void;
     /** Gets whether a value is the start of the main range. */
     _isRangeStart(value: number): boolean;
     /** Gets whether a value is the end of the main range. */
@@ -142,5 +172,5 @@ export declare class MatCalendarBody implements OnChanges, OnDestroy {
     /** Finds the MatCalendarCell that corresponds to a DOM node. */
     private _getCellFromElement;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCalendarBody, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatCalendarBody, "[mat-calendar-body]", ["matCalendarBody"], { "label": "label"; "rows": "rows"; "todayValue": "todayValue"; "startValue": "startValue"; "endValue": "endValue"; "labelMinRequiredCells": "labelMinRequiredCells"; "numCols": "numCols"; "activeCell": "activeCell"; "isRange": "isRange"; "cellAspectRatio": "cellAspectRatio"; "comparisonStart": "comparisonStart"; "comparisonEnd": "comparisonEnd"; "previewStart": "previewStart"; "previewEnd": "previewEnd"; }, { "selectedValueChange": "selectedValueChange"; "previewChange": "previewChange"; }, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatCalendarBody, "[mat-calendar-body]", ["matCalendarBody"], { "label": "label"; "rows": "rows"; "todayValue": "todayValue"; "startValue": "startValue"; "endValue": "endValue"; "labelMinRequiredCells": "labelMinRequiredCells"; "numCols": "numCols"; "activeCell": "activeCell"; "isRange": "isRange"; "cellAspectRatio": "cellAspectRatio"; "comparisonStart": "comparisonStart"; "comparisonEnd": "comparisonEnd"; "previewStart": "previewStart"; "previewEnd": "previewEnd"; }, { "selectedValueChange": "selectedValueChange"; "previewChange": "previewChange"; "activeDateChange": "activeDateChange"; }, never, never, false>;
 }

package/datepicker/calendar.d.ts

@@ -49,7 +49,7 @@ export declare class MatCalendarHeader<D> {
     /** Whether the two dates represent the same view in the current view mode (month or year). */
     private _isSameView;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCalendarHeader<any>, [null, null, { optional: true; }, { optional: true; }, null]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatCalendarHeader<any>, "mat-calendar-header", ["matCalendarHeader"], {}, {}, never, ["*"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatCalendarHeader<any>, "mat-calendar-header", ["matCalendarHeader"], {}, {}, never, ["*"], false>;
 }
 /** A calendar that is used as part of the datepicker. */
 export declare class MatCalendar<D> implements AfterContentInit, AfterViewChecked, OnDestroy, OnChanges {
@@ -152,5 +152,5 @@ export declare class MatCalendar<D> implements AfterContentInit, AfterViewChecke
     /** Returns the component instance that corresponds to the current calendar view. */
     private _getCurrentViewComponent;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatCalendar<any>, [null, { optional: true; }, { optional: true; }, null]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatCalendar<any>, "mat-calendar", ["matCalendar"], { "headerComponent": "headerComponent"; "startAt": "startAt"; "startView": "startView"; "selected": "selected"; "minDate": "minDate"; "maxDate": "maxDate"; "dateFilter": "dateFilter"; "dateClass": "dateClass"; "comparisonStart": "comparisonStart"; "comparisonEnd": "comparisonEnd"; }, { "selectedChange": "selectedChange"; "yearSelected": "yearSelected"; "monthSelected": "monthSelected"; "viewChanged": "viewChanged"; "_userSelection": "_userSelection"; }, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatCalendar<any>, "mat-calendar", ["matCalendar"], { "headerComponent": "headerComponent"; "startAt": "startAt"; "startView": "startView"; "selected": "selected"; "minDate": "minDate"; "maxDate": "maxDate"; "dateFilter": "dateFilter"; "dateClass": "dateClass"; "comparisonStart": "comparisonStart"; "comparisonEnd": "comparisonEnd"; }, { "selectedChange": "selectedChange"; "yearSelected": "yearSelected"; "monthSelected": "monthSelected"; "viewChanged": "viewChanged"; "_userSelection": "_userSelection"; }, never, never, false>;
 }

package/datepicker/date-range-input-parts.d.ts

@@ -41,7 +41,10 @@ declare abstract class MatDateRangeInputPartBase<D> extends MatDatepickerInputBa
     private _injector;
     _parentForm: NgForm;
     _parentFormGroup: FormGroupDirective;
-    /** @docs-private */
+    /**
+     * Form control bound to this input part.
+     * @docs-private
+     */
     ngControl: NgControl;
     /** @docs-private */
     abstract updateErrorState(): void;
@@ -71,7 +74,7 @@ declare abstract class MatDateRangeInputPartBase<D> extends MatDatepickerInputBa
     protected _shouldHandleChangeEvent({ source }: DateSelectionModelChange<DateRange<D>>): boolean;
     protected _assignValueProgrammatically(value: D | null): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDateRangeInputPartBase<any>, [null, null, null, null, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDateRangeInputPartBase<any>, never, never, {}, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDateRangeInputPartBase<any>, never, never, {}, {}, never, never, false>;
 }
 declare const _MatDateRangeInputBase: import("@angular/material/core")._Constructor<CanUpdateErrorState> & import("@angular/material/core")._AbstractConstructor<CanUpdateErrorState> & typeof MatDateRangeInputPartBase;
 /** Input for entering the start date in a `mat-date-range-input`. */
@@ -87,7 +90,7 @@ export declare class MatStartDate<D> extends _MatDateRangeInputBase<D> implement
     /** Gets the value that should be used when mirroring the input's size. */
     getMirrorValue(): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatStartDate<any>, [null, null, null, null, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatStartDate<any>, "input[matStartDate]", never, { "errorStateMatcher": "errorStateMatcher"; }, { "dateChange": "dateChange"; "dateInput": "dateInput"; }, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatStartDate<any>, "input[matStartDate]", never, { "errorStateMatcher": "errorStateMatcher"; }, { "dateChange": "dateChange"; "dateInput": "dateInput"; }, never, never, false>;
 }
 /** Input for entering the end date in a `mat-date-range-input`. */
 export declare class MatEndDate<D> extends _MatDateRangeInputBase<D> implements CanUpdateErrorState {
@@ -100,6 +103,6 @@ export declare class MatEndDate<D> extends _MatDateRangeInputBase<D> implements
     protected _assignValueToModel(value: D | null): void;
     _onKeydown(event: KeyboardEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatEndDate<any>, [null, null, null, null, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatEndDate<any>, "input[matEndDate]", never, { "errorStateMatcher": "errorStateMatcher"; }, { "dateChange": "dateChange"; "dateInput": "dateInput"; }, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatEndDate<any>, "input[matEndDate]", never, { "errorStateMatcher": "errorStateMatcher"; }, { "dateChange": "dateChange"; "dateInput": "dateInput"; }, never, never, false>;
 }
 export {};

package/datepicker/date-range-input.d.ts

@@ -129,5 +129,5 @@ export declare class MatDateRangeInput<D> implements MatFormFieldControl<DateRan
     /** Registers the current date selection model with the start/end inputs. */
     private _registerModel;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDateRangeInput<any>, [null, null, { optional: true; self: true; }, { optional: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatDateRangeInput<any>, "mat-date-range-input", ["matDateRangeInput"], { "rangePicker": "rangePicker"; "required": "required"; "dateFilter": "dateFilter"; "min": "min"; "max": "max"; "disabled": "disabled"; "separator": "separator"; "comparisonStart": "comparisonStart"; "comparisonEnd": "comparisonEnd"; }, {}, ["_startInput", "_endInput"], ["input[matStartDate]", "input[matEndDate]"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatDateRangeInput<any>, "mat-date-range-input", ["matDateRangeInput"], { "rangePicker": "rangePicker"; "required": "required"; "dateFilter": "dateFilter"; "min": "min"; "max": "max"; "disabled": "disabled"; "separator": "separator"; "comparisonStart": "comparisonStart"; "comparisonEnd": "comparisonEnd"; }, {}, ["_startInput", "_endInput"], ["input[matStartDate]", "input[matEndDate]"], false>;
 }

package/datepicker/date-range-picker.d.ts

@@ -13,5 +13,5 @@ export interface MatDateRangePickerInput<D> extends MatDatepickerControl<D> {
 export declare class MatDateRangePicker<D> extends MatDatepickerBase<MatDateRangePickerInput<D>, DateRange<D>, D> {
     protected _forwardContentValues(instance: MatDatepickerContent<DateRange<D>, D>): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDateRangePicker<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatDateRangePicker<any>, "mat-date-range-picker", ["matDateRangePicker"], {}, {}, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatDateRangePicker<any>, "mat-date-range-picker", ["matDateRangePicker"], {}, {}, never, never, false>;
 }

package/datepicker/datepicker-actions.d.ts

@@ -14,14 +14,14 @@ export declare class MatDatepickerApply {
     constructor(_datepicker: MatDatepickerBase<MatDatepickerControl<unknown>, unknown>);
     _applySelection(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDatepickerApply, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerApply, "[matDatepickerApply], [matDateRangePickerApply]", never, {}, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerApply, "[matDatepickerApply], [matDateRangePickerApply]", never, {}, {}, never, never, false>;
 }
 /** Button that will close the datepicker and discard the current selection. */
 export declare class MatDatepickerCancel {
     _datepicker: MatDatepickerBase<MatDatepickerControl<unknown>, unknown>;
     constructor(_datepicker: MatDatepickerBase<MatDatepickerControl<unknown>, unknown>);
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDatepickerCancel, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerCancel, "[matDatepickerCancel], [matDateRangePickerCancel]", never, {}, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerCancel, "[matDatepickerCancel], [matDateRangePickerCancel]", never, {}, {}, never, never, false>;
 }
 /**
  * Container that can be used to project a row of action buttons
@@ -36,5 +36,5 @@ export declare class MatDatepickerActions implements AfterViewInit, OnDestroy {
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDatepickerActions, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatDatepickerActions, "mat-datepicker-actions, mat-date-range-picker-actions", never, {}, {}, never, ["*"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatDatepickerActions, "mat-datepicker-actions, mat-date-range-picker-actions", never, {}, {}, never, ["*"], false>;
 }

package/datepicker/datepicker-base.d.ts

@@ -73,6 +73,8 @@ export declare class MatDatepickerContent<S, D = ExtractDateTypeFromSelection<S>
     _closeButtonFocused: boolean;
     /** Portal with projected action buttons. */
     _actionsPortal: TemplatePortal | null;
+    /** Id of the label for the `role="dialog"` element. */
+    _dialogLabelId: string | null;
     constructor(elementRef: ElementRef, _changeDetectorRef: ChangeDetectorRef, _globalModel: MatDateSelectionModel<S, D>, _dateAdapter: DateAdapter<D>, _rangeSelectionStrategy: MatDateRangeSelectionStrategy<D>, intl: MatDatepickerIntl);
     ngOnInit(): void;
     ngAfterViewInit(): void;
@@ -83,7 +85,7 @@ export declare class MatDatepickerContent<S, D = ExtractDateTypeFromSelection<S>
     /** Applies the current pending selection to the global model. */
     _applyPendingSelection(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDatepickerContent<any, any>, [null, null, null, null, { optional: true; }, null]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MatDatepickerContent<any, any>, "mat-datepicker-content", ["matDatepickerContent"], { "color": "color"; }, {}, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MatDatepickerContent<any, any>, "mat-datepicker-content", ["matDatepickerContent"], { "color": "color"; }, {}, never, never, false>;
 }
 /** Form control that can be associated with a datepicker. */
 export interface MatDatepickerControl<D> {
@@ -265,6 +267,6 @@ export declare abstract class MatDatepickerBase<C extends MatDatepickerControl<D
     /** Gets an observable that will emit when the overlay is supposed to be closed. */
     private _getCloseStream;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDatepickerBase<any, any, any>, [null, null, null, null, { optional: true; }, { optional: true; }, null]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerBase<any, any, any>, never, never, { "calendarHeaderComponent": "calendarHeaderComponent"; "startAt": "startAt"; "startView": "startView"; "color": "color"; "touchUi": "touchUi"; "disabled": "disabled"; "xPosition": "xPosition"; "yPosition": "yPosition"; "restoreFocus": "restoreFocus"; "dateClass": "dateClass"; "panelClass": "panelClass"; "opened": "opened"; }, { "yearSelected": "yearSelected"; "monthSelected": "monthSelected"; "viewChanged": "viewChanged"; "openedStream": "opened"; "closedStream": "closed"; }, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerBase<any, any, any>, never, never, { "calendarHeaderComponent": "calendarHeaderComponent"; "startAt": "startAt"; "startView": "startView"; "color": "color"; "touchUi": "touchUi"; "disabled": "disabled"; "xPosition": "xPosition"; "yPosition": "yPosition"; "restoreFocus": "restoreFocus"; "dateClass": "dateClass"; "panelClass": "panelClass"; "opened": "opened"; }, { "yearSelected": "yearSelected"; "monthSelected": "monthSelected"; "viewChanged": "viewChanged"; "openedStream": "opened"; "closedStream": "closed"; }, never, never, false>;
 }
 export {};

package/datepicker/datepicker-input-base.d.ts

@@ -127,7 +127,7 @@ export declare abstract class MatDatepickerInputBase<S, D = ExtractDateTypeFromS
     /** Gets whether a value matches the current date filter. */
     _matchesFilter(value: D | null): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDatepickerInputBase<any, any>, [null, { optional: true; }, { optional: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerInputBase<any, any>, never, never, { "value": "value"; "disabled": "disabled"; }, { "dateChange": "dateChange"; "dateInput": "dateInput"; }, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatDatepickerInputBase<any, any>, never, never, { "value": "value"; "disabled": "disabled"; }, { "dateChange": "dateChange"; "dateInput": "dateInput"; }, never, never, false>;
 }
 /**
  * Checks whether the `SimpleChanges` object from an `ngOnChanges`