@angular/material 8.0.0 → 8.1.1

package/bundles/material.umd.js

@@ -6,10 +6,10 @@
  * found in the LICENSE file at https://angular.io/license
  */
 (function (global, factory) {
-	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/platform-browser'), require('@angular/cdk/bidi'), require('@angular/cdk/coercion'), require('rxjs'), require('@angular/cdk/platform'), require('rxjs/operators'), require('@angular/cdk/a11y'), require('@angular/platform-browser/animations'), require('@angular/cdk/keycodes'), require('@angular/common'), require('@angular/animations'), require('@angular/cdk/observers'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('@angular/cdk/scrolling'), require('@angular/forms'), require('@angular/cdk/layout'), require('@angular/cdk/collections'), require('@angular/cdk/text-field'), require('@angular/cdk/accordion'), require('@angular/common/http'), require('@angular/cdk/stepper'), require('@angular/cdk/table'), require('@angular/cdk/tree')) :
-	typeof define === 'function' && define.amd ? define('@angular/material', ['exports', '@angular/core', '@angular/platform-browser', '@angular/cdk/bidi', '@angular/cdk/coercion', 'rxjs', '@angular/cdk/platform', 'rxjs/operators', '@angular/cdk/a11y', '@angular/platform-browser/animations', '@angular/cdk/keycodes', '@angular/common', '@angular/animations', '@angular/cdk/observers', '@angular/cdk/overlay', '@angular/cdk/portal', '@angular/cdk/scrolling', '@angular/forms', '@angular/cdk/layout', '@angular/cdk/collections', '@angular/cdk/text-field', '@angular/cdk/accordion', '@angular/common/http', '@angular/cdk/stepper', '@angular/cdk/table', '@angular/cdk/tree'], factory) :
-	(factory((global.ng = global.ng || {}, global.ng.material = {}),global.ng.core,global.ng.platformBrowser,global.ng.cdk.bidi,global.ng.cdk.coercion,global.rxjs,global.ng.cdk.platform,global.rxjs.operators,global.ng.cdk.a11y,global.ng.platformBrowser.animations,global.ng.cdk.keycodes,global.ng.common,global.ng.animations,global.ng.cdk.observers,global.ng.cdk.overlay,global.ng.cdk.portal,global.ng.cdk.scrolling,global.ng.forms,global.ng.cdk.layout,global.ng.cdk.collections,global.ng.cdk.textField,global.ng.cdk.accordion,global.ng.common.http,global.ng.cdk.stepper,global.ng.cdk.table,global.ng.cdk.tree));
-}(this, (function (exports,core,platformBrowser,bidi,coercion,rxjs,platform,operators,a11y,animations,keycodes,common,animations$1,observers,overlay,portal,scrolling,forms,layout,collections,textField,accordion,http,stepper,table,tree) { 'use strict';
+	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/platform-browser'), require('@angular/cdk/bidi'), require('@angular/cdk'), require('@angular/cdk/coercion'), require('rxjs'), require('@angular/cdk/platform'), require('rxjs/operators'), require('@angular/cdk/a11y'), require('@angular/platform-browser/animations'), require('@angular/cdk/keycodes'), require('@angular/common'), require('@angular/animations'), require('@angular/cdk/observers'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('@angular/cdk/scrolling'), require('@angular/forms'), require('@angular/cdk/layout'), require('@angular/cdk/collections'), require('@angular/cdk/text-field'), require('@angular/cdk/accordion'), require('@angular/common/http'), require('@angular/cdk/stepper'), require('@angular/cdk/table'), require('@angular/cdk/tree')) :
+	typeof define === 'function' && define.amd ? define('@angular/material', ['exports', '@angular/core', '@angular/platform-browser', '@angular/cdk/bidi', '@angular/cdk', '@angular/cdk/coercion', 'rxjs', '@angular/cdk/platform', 'rxjs/operators', '@angular/cdk/a11y', '@angular/platform-browser/animations', '@angular/cdk/keycodes', '@angular/common', '@angular/animations', '@angular/cdk/observers', '@angular/cdk/overlay', '@angular/cdk/portal', '@angular/cdk/scrolling', '@angular/forms', '@angular/cdk/layout', '@angular/cdk/collections', '@angular/cdk/text-field', '@angular/cdk/accordion', '@angular/common/http', '@angular/cdk/stepper', '@angular/cdk/table', '@angular/cdk/tree'], factory) :
+	(factory((global.ng = global.ng || {}, global.ng.material = {}),global.ng.core,global.ng.platformBrowser,global.ng.cdk.bidi,global.ng.cdk,global.ng.cdk.coercion,global.rxjs,global.ng.cdk.platform,global.rxjs.operators,global.ng.cdk.a11y,global.ng.platformBrowser.animations,global.ng.cdk.keycodes,global.ng.common,global.ng.animations,global.ng.cdk.observers,global.ng.cdk.overlay,global.ng.cdk.portal,global.ng.cdk.scrolling,global.ng.forms,global.ng.cdk.layout,global.ng.cdk.collections,global.ng.cdk.textField,global.ng.cdk.accordion,global.ng.common.http,global.ng.cdk.stepper,global.ng.cdk.table,global.ng.cdk.tree));
+}(this, (function (exports,core,platformBrowser,bidi,cdk,coercion,rxjs,platform,operators,a11y,animations,keycodes,common,animations$1,observers,overlay,portal,scrolling,forms,layout,collections,textField,accordion,http,stepper,table,tree) { 'use strict';
 
 /*! *****************************************************************************
 Copyright (c) Microsoft Corporation. All rights reserved.
@@ -59,7 +59,7 @@ var __assign = function() {
  * Current version of Angular Material.
  * @type {?}
  */
-var VERSION = new core.Version('8.0.0');
+var VERSION$1 = new core.Version('8.1.1');
 
 /**
  * @fileoverview added by tsickle
@@ -94,6 +94,12 @@ var AnimationDurations = /** @class */ (function () {
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
+// Private version constant to circumvent test/build issues,
+// i.e. avoid core to depend on the @angular/material primary entry-point
+// Can be removed once the Material primary entry-point no longer
+// re-exports all secondary entry-points
+/** @type {?} */
+var VERSION$2 = new core.Version('8.1.1');
 /**
  * Injection token that configures whether the Material sanity checks are enabled.
  * @type {?}
@@ -138,6 +144,7 @@ var MatCommonModule = /** @class */ (function () {
         if (this._areChecksEnabled() && !this._hasDoneGlobalChecks) {
             this._checkDoctypeIsDefined();
             this._checkThemeIsPresent();
+            this._checkCdkVersionMatch();
             this._hasDoneGlobalChecks = true;
         }
     }
@@ -215,6 +222,24 @@ var MatCommonModule = /** @class */ (function () {
         }
         this._document.body.removeChild(testElement);
     };
+    /** Checks whether the material version matches the cdk version */
+    /**
+     * Checks whether the material version matches the cdk version
+     * @private
+     * @return {?}
+     */
+    MatCommonModule.prototype._checkCdkVersionMatch = /**
+     * Checks whether the material version matches the cdk version
+     * @private
+     * @return {?}
+     */
+    function () {
+        if (VERSION$2.full !== cdk.VERSION.full) {
+            console.warn('The Angular Material version (' + VERSION$2.full + ') does not match ' +
+                'the Angular CDK version (' + cdk.VERSION.full + ').\n' +
+                'Please ensure the versions of these two packages exactly match.');
+        }
+    };
     /** Checks whether HammerJS is available. */
     /**
      * Checks whether HammerJS is available.
@@ -3982,7 +4007,7 @@ var MatFormField = /** @class */ (function (_super) {
     MatFormField.decorators = [
         { type: core.Component, args: [{selector: 'mat-form-field',
                     exportAs: 'matFormField',
-                    template: "<div class=\"mat-form-field-wrapper\"><div class=\"mat-form-field-flex\" #connectionContainer (click)=\"_control.onContainerClick && _control.onContainerClick($event)\"><ng-container *ngIf=\"appearance == 'outline'\"><div class=\"mat-form-field-outline\"><div class=\"mat-form-field-outline-start\"></div><div class=\"mat-form-field-outline-gap\"></div><div class=\"mat-form-field-outline-end\"></div></div><div class=\"mat-form-field-outline mat-form-field-outline-thick\"><div class=\"mat-form-field-outline-start\"></div><div class=\"mat-form-field-outline-gap\"></div><div class=\"mat-form-field-outline-end\"></div></div></ng-container><div class=\"mat-form-field-prefix\" *ngIf=\"_prefixChildren.length\"><ng-content select=\"[matPrefix]\"></ng-content></div><div class=\"mat-form-field-infix\" #inputContainer><ng-content></ng-content><span class=\"mat-form-field-label-wrapper\"><label class=\"mat-form-field-label\" (cdkObserveContent)=\"updateOutlineGap()\" [cdkObserveContentDisabled]=\"appearance != 'outline'\" [id]=\"_labelId\" [attr.for]=\"_control.id\" [attr.aria-owns]=\"_control.id\" [class.mat-empty]=\"_control.empty && !_shouldAlwaysFloat\" [class.mat-form-field-empty]=\"_control.empty && !_shouldAlwaysFloat\" [class.mat-accent]=\"color == 'accent'\" [class.mat-warn]=\"color == 'warn'\" #label *ngIf=\"_hasFloatingLabel()\" [ngSwitch]=\"_hasLabel()\"><ng-container *ngSwitchCase=\"false\"><ng-content select=\"mat-placeholder\"></ng-content>{{_control.placeholder}}</ng-container><ng-content select=\"mat-label\" *ngSwitchCase=\"true\"></ng-content><span class=\"mat-placeholder-required mat-form-field-required-marker\" aria-hidden=\"true\" *ngIf=\"!hideRequiredMarker && _control.required && !_control.disabled\">&#32;*</span></label></span></div><div class=\"mat-form-field-suffix\" *ngIf=\"_suffixChildren.length\"><ng-content select=\"[matSuffix]\"></ng-content></div></div><div class=\"mat-form-field-underline\" #underline *ngIf=\"appearance != 'outline'\"><span class=\"mat-form-field-ripple\" [class.mat-accent]=\"color == 'accent'\" [class.mat-warn]=\"color == 'warn'\"></span></div><div class=\"mat-form-field-subscript-wrapper\" [ngSwitch]=\"_getDisplayedMessages()\"><div *ngSwitchCase=\"'error'\" [@transitionMessages]=\"_subscriptAnimationState\"><ng-content select=\"mat-error\"></ng-content></div><div class=\"mat-form-field-hint-wrapper\" *ngSwitchCase=\"'hint'\" [@transitionMessages]=\"_subscriptAnimationState\"><div *ngIf=\"hintLabel\" [id]=\"_hintLabelId\" class=\"mat-hint\">{{hintLabel}}</div><ng-content select=\"mat-hint:not([align='end'])\"></ng-content><div class=\"mat-form-field-hint-spacer\"></div><ng-content select=\"mat-hint[align='end']\"></ng-content></div></div></div>",
+                    template: "<div class=\"mat-form-field-wrapper\"><div class=\"mat-form-field-flex\" #connectionContainer (click)=\"_control.onContainerClick && _control.onContainerClick($event)\"><ng-container *ngIf=\"appearance == 'outline'\"><div class=\"mat-form-field-outline\"><div class=\"mat-form-field-outline-start\"></div><div class=\"mat-form-field-outline-gap\"></div><div class=\"mat-form-field-outline-end\"></div></div><div class=\"mat-form-field-outline mat-form-field-outline-thick\"><div class=\"mat-form-field-outline-start\"></div><div class=\"mat-form-field-outline-gap\"></div><div class=\"mat-form-field-outline-end\"></div></div></ng-container><div class=\"mat-form-field-prefix\" *ngIf=\"_prefixChildren.length\"><ng-content select=\"[matPrefix]\"></ng-content></div><div class=\"mat-form-field-infix\" #inputContainer><ng-content></ng-content><span class=\"mat-form-field-label-wrapper\"><label class=\"mat-form-field-label\" (cdkObserveContent)=\"updateOutlineGap()\" [cdkObserveContentDisabled]=\"appearance != 'outline'\" [id]=\"_labelId\" [attr.for]=\"_control.id\" [attr.aria-owns]=\"_control.id\" [class.mat-empty]=\"_control.empty && !_shouldAlwaysFloat\" [class.mat-form-field-empty]=\"_control.empty && !_shouldAlwaysFloat\" [class.mat-accent]=\"color == 'accent'\" [class.mat-warn]=\"color == 'warn'\" #label *ngIf=\"_hasFloatingLabel()\" [ngSwitch]=\"_hasLabel()\"><ng-container *ngSwitchCase=\"false\"><ng-content select=\"mat-placeholder\"></ng-content><span>{{_control.placeholder}}</span></ng-container><ng-content select=\"mat-label\" *ngSwitchCase=\"true\"></ng-content><span class=\"mat-placeholder-required mat-form-field-required-marker\" aria-hidden=\"true\" *ngIf=\"!hideRequiredMarker && _control.required && !_control.disabled\">&#32;*</span></label></span></div><div class=\"mat-form-field-suffix\" *ngIf=\"_suffixChildren.length\"><ng-content select=\"[matSuffix]\"></ng-content></div></div><div class=\"mat-form-field-underline\" #underline *ngIf=\"appearance != 'outline'\"><span class=\"mat-form-field-ripple\" [class.mat-accent]=\"color == 'accent'\" [class.mat-warn]=\"color == 'warn'\"></span></div><div class=\"mat-form-field-subscript-wrapper\" [ngSwitch]=\"_getDisplayedMessages()\"><div *ngSwitchCase=\"'error'\" [@transitionMessages]=\"_subscriptAnimationState\"><ng-content select=\"mat-error\"></ng-content></div><div class=\"mat-form-field-hint-wrapper\" *ngSwitchCase=\"'hint'\" [@transitionMessages]=\"_subscriptAnimationState\"><div *ngIf=\"hintLabel\" [id]=\"_hintLabelId\" class=\"mat-hint\">{{hintLabel}}</div><ng-content select=\"mat-hint:not([align='end'])\"></ng-content><div class=\"mat-form-field-hint-spacer\"></div><ng-content select=\"mat-hint[align='end']\"></ng-content></div></div></div>",
                     // MatInput is a directive and can't have styles, so we need to include its styles here
                     // in form-field-input.css. The MatInput styles are fairly minimal so it shouldn't be a
                     // big deal for people who aren't using MatInput.
@@ -5204,6 +5229,10 @@ var MatAutocompleteTrigger = /** @class */ (function () {
                 if (event.keyCode === keycodes.ESCAPE || (event.keyCode === keycodes.UP_ARROW && event.altKey)) {
                     _this._resetActiveItem();
                     _this._closeKeyEventStream.next();
+                    // We need to stop propagation, otherwise the event will eventually
+                    // reach the input itself and cause the overlay to be reopened.
+                    event.stopPropagation();
+                    event.preventDefault();
                 }
             }));
             if (this._viewportRuler) {
@@ -6333,6 +6362,7 @@ MatBottomSheetRef = /** @class */ (function () {
          * @return {?}
          */
         function () {
+            clearTimeout(_this._closeFallbackTimeout);
             _overlayRef.dispose();
         }));
         _overlayRef.detachments().pipe(operators.take(1)).subscribe((/**
@@ -6347,10 +6377,13 @@ MatBottomSheetRef = /** @class */ (function () {
          * @return {?}
          */
         function (event) { return event.keyCode === keycodes.ESCAPE; })))).subscribe((/**
+         * @param {?} event
          * @return {?}
          */
-        function () {
-            if (!_this.disableClose) {
+        function (event) {
+            if (!_this.disableClose &&
+                (event.type !== 'keydown' || !keycodes.hasModifierKey((/** @type {?} */ (event))))) {
+                event.preventDefault();
                 _this.dismiss();
             }
         }));
@@ -6378,9 +6411,23 @@ MatBottomSheetRef = /** @class */ (function () {
              * @return {?}
              */
             function (event) { return event.phaseName === 'start'; })), operators.take(1)).subscribe((/**
+             * @param {?} event
              * @return {?}
              */
-            function () { return _this._overlayRef.detachBackdrop(); }));
+            function (event) {
+                // The logic that disposes of the overlay depends on the exit animation completing, however
+                // it isn't guaranteed if the parent view is destroyed while it's running. Add a fallback
+                // timeout which will clean everything up if the animation hasn't fired within the specified
+                // amount of time plus 100ms. We don't need to run this outside the NgZone, because for the
+                // vast majority of cases the timeout will have been cleared before it has fired.
+                _this._closeFallbackTimeout = setTimeout((/**
+                 * @return {?}
+                 */
+                function () {
+                    _this._overlayRef.dispose();
+                }), event.totalTime + 100);
+                _this._overlayRef.detachBackdrop();
+            }));
             this._result = result;
             this.containerInstance.exit();
         }
@@ -6628,11 +6675,8 @@ var MatBottomSheet = /** @class */ (function () {
             hasBackdrop: config.hasBackdrop,
             disposeOnNavigation: config.closeOnNavigation,
             maxWidth: '100%',
-            scrollStrategy: this._overlay.scrollStrategies.block(),
-            positionStrategy: this._overlay.position()
-                .global()
-                .centerHorizontally()
-                .bottom('0')
+            scrollStrategy: config.scrollStrategy || this._overlay.scrollStrategies.block(),
+            positionStrategy: this._overlay.position().global().centerHorizontally().bottom('0')
         });
         if (config.backdropClass) {
             overlayConfig.backdropClass = config.backdropClass;
@@ -6763,7 +6807,7 @@ var MatButton = /** @class */ (function (_super) {
         for (var _i = 0, BUTTON_HOST_ATTRIBUTES_1 = BUTTON_HOST_ATTRIBUTES; _i < BUTTON_HOST_ATTRIBUTES_1.length; _i++) {
             var attr = BUTTON_HOST_ATTRIBUTES_1[_i];
             if (_this._hasHostAttributes(attr)) {
-                ((/** @type {?} */ (elementRef.nativeElement))).classList.add(attr);
+                ((/** @type {?} */ (_this._getHostElement()))).classList.add(attr);
             }
         }
         _this._focusMonitor.monitor(_this._elementRef, true);
@@ -7962,18 +8006,27 @@ var MatCardAvatar = /** @class */ (function () {
  * - mat-card-footer
  */
 var MatCard = /** @class */ (function () {
-    function MatCard() {
+    // @breaking-change 9.0.0 `_animationMode` parameter to be made required.
+    function MatCard(_animationMode) {
+        this._animationMode = _animationMode;
     }
     MatCard.decorators = [
         { type: core.Component, args: [{selector: 'mat-card',
                     exportAs: 'matCard',
                     template: "<ng-content></ng-content><ng-content select=\"mat-card-footer\"></ng-content>",
-                    styles: [".mat-card{transition:box-shadow 280ms cubic-bezier(.4,0,.2,1);display:block;position:relative;padding:16px;border-radius:4px}.mat-card .mat-divider-horizontal{position:absolute;left:0;width:100%}[dir=rtl] .mat-card .mat-divider-horizontal{left:auto;right:0}.mat-card .mat-divider-horizontal.mat-divider-inset{position:static;margin:0}[dir=rtl] .mat-card .mat-divider-horizontal.mat-divider-inset{margin-right:0}@media (-ms-high-contrast:active){.mat-card{outline:solid 1px}}.mat-card-actions,.mat-card-content,.mat-card-subtitle{display:block;margin-bottom:16px}.mat-card-title{display:block;margin-bottom:8px}.mat-card-actions{margin-left:-8px;margin-right:-8px;padding:8px 0}.mat-card-actions-align-end{display:flex;justify-content:flex-end}.mat-card-image{width:calc(100% + 32px);margin:0 -16px 16px -16px}.mat-card-footer{display:block;margin:0 -16px -16px -16px}.mat-card-actions .mat-button,.mat-card-actions .mat-raised-button{margin:0 8px}.mat-card-header{display:flex;flex-direction:row}.mat-card-header .mat-card-title{margin-bottom:12px}.mat-card-header-text{margin:0 16px}.mat-card-avatar{height:40px;width:40px;border-radius:50%;flex-shrink:0;object-fit:cover}.mat-card-title-group{display:flex;justify-content:space-between}.mat-card-sm-image{width:80px;height:80px}.mat-card-md-image{width:112px;height:112px}.mat-card-lg-image{width:152px;height:152px}.mat-card-xl-image{width:240px;height:240px;margin:-8px}.mat-card-title-group>.mat-card-xl-image{margin:-8px 0 8px}@media (max-width:599px){.mat-card-title-group{margin:0}.mat-card-xl-image{margin-left:0;margin-right:0}}.mat-card-content>:first-child,.mat-card>:first-child{margin-top:0}.mat-card-content>:last-child:not(.mat-card-footer),.mat-card>:last-child:not(.mat-card-footer){margin-bottom:0}.mat-card-image:first-child{margin-top:-16px;border-top-left-radius:inherit;border-top-right-radius:inherit}.mat-card>.mat-card-actions:last-child{margin-bottom:-8px;padding-bottom:0}.mat-card-actions .mat-button:first-child,.mat-card-actions .mat-raised-button:first-child{margin-left:0;margin-right:0}.mat-card-subtitle:not(:first-child),.mat-card-title:not(:first-child){margin-top:-4px}.mat-card-header .mat-card-subtitle:not(:first-child){margin-top:-8px}.mat-card>.mat-card-xl-image:first-child{margin-top:-8px}.mat-card>.mat-card-xl-image:last-child{margin-bottom:-8px}"],
+                    styles: [".mat-card{transition:box-shadow 280ms cubic-bezier(.4,0,.2,1);display:block;position:relative;padding:16px;border-radius:4px}._mat-animation-noopable.mat-card{transition:none;animation:none}.mat-card .mat-divider-horizontal{position:absolute;left:0;width:100%}[dir=rtl] .mat-card .mat-divider-horizontal{left:auto;right:0}.mat-card .mat-divider-horizontal.mat-divider-inset{position:static;margin:0}[dir=rtl] .mat-card .mat-divider-horizontal.mat-divider-inset{margin-right:0}@media (-ms-high-contrast:active){.mat-card{outline:solid 1px}}.mat-card-actions,.mat-card-content,.mat-card-subtitle{display:block;margin-bottom:16px}.mat-card-title{display:block;margin-bottom:8px}.mat-card-actions{margin-left:-8px;margin-right:-8px;padding:8px 0}.mat-card-actions-align-end{display:flex;justify-content:flex-end}.mat-card-image{width:calc(100% + 32px);margin:0 -16px 16px -16px}.mat-card-footer{display:block;margin:0 -16px -16px -16px}.mat-card-actions .mat-button,.mat-card-actions .mat-raised-button{margin:0 8px}.mat-card-header{display:flex;flex-direction:row}.mat-card-header .mat-card-title{margin-bottom:12px}.mat-card-header-text{margin:0 16px}.mat-card-avatar{height:40px;width:40px;border-radius:50%;flex-shrink:0;object-fit:cover}.mat-card-title-group{display:flex;justify-content:space-between}.mat-card-sm-image{width:80px;height:80px}.mat-card-md-image{width:112px;height:112px}.mat-card-lg-image{width:152px;height:152px}.mat-card-xl-image{width:240px;height:240px;margin:-8px}.mat-card-title-group>.mat-card-xl-image{margin:-8px 0 8px}@media (max-width:599px){.mat-card-title-group{margin:0}.mat-card-xl-image{margin-left:0;margin-right:0}}.mat-card-content>:first-child,.mat-card>:first-child{margin-top:0}.mat-card-content>:last-child:not(.mat-card-footer),.mat-card>:last-child:not(.mat-card-footer){margin-bottom:0}.mat-card-image:first-child{margin-top:-16px;border-top-left-radius:inherit;border-top-right-radius:inherit}.mat-card>.mat-card-actions:last-child{margin-bottom:-8px;padding-bottom:0}.mat-card-actions .mat-button:first-child,.mat-card-actions .mat-raised-button:first-child{margin-left:0;margin-right:0}.mat-card-subtitle:not(:first-child),.mat-card-title:not(:first-child){margin-top:-4px}.mat-card-header .mat-card-subtitle:not(:first-child){margin-top:-8px}.mat-card>.mat-card-xl-image:first-child{margin-top:-8px}.mat-card>.mat-card-xl-image:last-child{margin-bottom:-8px}"],
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
-                    host: { 'class': 'mat-card' }
+                    host: {
+                        'class': 'mat-card',
+                        '[class._mat-animation-noopable]': '_animationMode === "NoopAnimations"',
+                    }
                 },] },
     ];
+    /** @nocollapse */
+    MatCard.ctorParameters = function () { return [
+        { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] }
+    ]; };
     return MatCard;
 }());
 /**
@@ -8142,7 +8195,7 @@ var MatCheckbox = /** @class */ (function (_super) {
         _this._clickAction = _clickAction;
         _this._animationMode = _animationMode;
         /**
-         * Attached to the aria-label attribute of the host element. In most cases, arial-labelledby will
+         * Attached to the aria-label attribute of the host element. In most cases, aria-labelledby will
          * take precedence so this may be omitted.
          */
         _this.ariaLabel = '';
@@ -8640,7 +8693,7 @@ var MatCheckbox = /** @class */ (function (_super) {
     MatCheckbox.decorators = [
         { type: core.Component, args: [{selector: 'mat-checkbox',
                     template: "<label [attr.for]=\"inputId\" class=\"mat-checkbox-layout\" #label><div class=\"mat-checkbox-inner-container\" [class.mat-checkbox-inner-container-no-side-margin]=\"!checkboxLabel.textContent || !checkboxLabel.textContent.trim()\"><input #input class=\"mat-checkbox-input cdk-visually-hidden\" type=\"checkbox\" [id]=\"inputId\" [required]=\"required\" [checked]=\"checked\" [attr.value]=\"value\" [disabled]=\"disabled\" [attr.name]=\"name\" [tabIndex]=\"tabIndex\" [indeterminate]=\"indeterminate\" [attr.aria-label]=\"ariaLabel || null\" [attr.aria-labelledby]=\"ariaLabelledby\" [attr.aria-checked]=\"_getAriaChecked()\" (change)=\"_onInteractionEvent($event)\" (click)=\"_onInputClick($event)\"><div matRipple class=\"mat-checkbox-ripple\" [matRippleTrigger]=\"label\" [matRippleDisabled]=\"_isRippleDisabled()\" [matRippleRadius]=\"20\" [matRippleCentered]=\"true\" [matRippleAnimation]=\"{enterDuration: 150}\"><div class=\"mat-ripple-element mat-checkbox-persistent-ripple\"></div></div><div class=\"mat-checkbox-frame\"></div><div class=\"mat-checkbox-background\"><svg version=\"1.1\" focusable=\"false\" class=\"mat-checkbox-checkmark\" viewBox=\"0 0 24 24\" xml:space=\"preserve\"><path class=\"mat-checkbox-checkmark-path\" fill=\"none\" stroke=\"white\" d=\"M4.1,12.7 9,17.6 20.3,6.3\"/></svg><div class=\"mat-checkbox-mixedmark\"></div></div></div><span class=\"mat-checkbox-label\" #checkboxLabel (cdkObserveContent)=\"_onLabelTextChange()\"><span style=\"display:none\">&nbsp;</span><ng-content></ng-content></span></label>",
-                    styles: ["@keyframes mat-checkbox-fade-in-background{0%{opacity:0}50%{opacity:1}}@keyframes mat-checkbox-fade-out-background{0%,50%{opacity:1}100%{opacity:0}}@keyframes mat-checkbox-unchecked-checked-checkmark-path{0%,50%{stroke-dashoffset:22.91026}50%{animation-timing-function:cubic-bezier(0,0,.2,.1)}100%{stroke-dashoffset:0}}@keyframes mat-checkbox-unchecked-indeterminate-mixedmark{0%,68.2%{transform:scaleX(0)}68.2%{animation-timing-function:cubic-bezier(0,0,0,1)}100%{transform:scaleX(1)}}@keyframes mat-checkbox-checked-unchecked-checkmark-path{from{animation-timing-function:cubic-bezier(.4,0,1,1);stroke-dashoffset:0}to{stroke-dashoffset:-22.91026}}@keyframes mat-checkbox-checked-indeterminate-checkmark{from{animation-timing-function:cubic-bezier(0,0,.2,.1);opacity:1;transform:rotate(0)}to{opacity:0;transform:rotate(45deg)}}@keyframes mat-checkbox-indeterminate-checked-checkmark{from{animation-timing-function:cubic-bezier(.14,0,0,1);opacity:0;transform:rotate(45deg)}to{opacity:1;transform:rotate(360deg)}}@keyframes mat-checkbox-checked-indeterminate-mixedmark{from{animation-timing-function:cubic-bezier(0,0,.2,.1);opacity:0;transform:rotate(-45deg)}to{opacity:1;transform:rotate(0)}}@keyframes mat-checkbox-indeterminate-checked-mixedmark{from{animation-timing-function:cubic-bezier(.14,0,0,1);opacity:1;transform:rotate(0)}to{opacity:0;transform:rotate(315deg)}}@keyframes mat-checkbox-indeterminate-unchecked-mixedmark{0%{animation-timing-function:linear;opacity:1;transform:scaleX(1)}100%,32.8%{opacity:0;transform:scaleX(0)}}.mat-checkbox-background,.mat-checkbox-frame{top:0;left:0;right:0;bottom:0;position:absolute;border-radius:2px;box-sizing:border-box;pointer-events:none}.mat-checkbox{transition:background .4s cubic-bezier(.25,.8,.25,1),box-shadow 280ms cubic-bezier(.4,0,.2,1);cursor:pointer;-webkit-tap-highlight-color:transparent}._mat-animation-noopable.mat-checkbox{transition:none;animation:none}.mat-checkbox .mat-ripple-element:not(.mat-checkbox-persistent-ripple){opacity:.16}.mat-checkbox-layout{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:inherit;align-items:baseline;vertical-align:middle;display:inline-flex;white-space:nowrap}.mat-checkbox-label{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.mat-checkbox-inner-container{display:inline-block;height:16px;line-height:0;margin:auto;margin-right:8px;order:0;position:relative;vertical-align:middle;white-space:nowrap;width:16px;flex-shrink:0}[dir=rtl] .mat-checkbox-inner-container{margin-left:8px;margin-right:auto}.mat-checkbox-inner-container-no-side-margin{margin-left:0;margin-right:0}.mat-checkbox-frame{background-color:transparent;transition:border-color 90ms cubic-bezier(0,0,.2,.1);border-width:2px;border-style:solid}._mat-animation-noopable .mat-checkbox-frame{transition:none}@media (-ms-high-contrast:active){.mat-checkbox.cdk-keyboard-focused .mat-checkbox-frame{border-style:dotted}}.mat-checkbox-background{align-items:center;display:inline-flex;justify-content:center;transition:background-color 90ms cubic-bezier(0,0,.2,.1),opacity 90ms cubic-bezier(0,0,.2,.1)}._mat-animation-noopable .mat-checkbox-background{transition:none}.mat-checkbox-persistent-ripple{width:100%;height:100%;transform:none}.mat-checkbox-inner-container:hover .mat-checkbox-persistent-ripple{opacity:.04}.mat-checkbox.cdk-keyboard-focused .mat-checkbox-persistent-ripple{opacity:.12}.mat-checkbox-persistent-ripple,.mat-checkbox.mat-disabled .mat-checkbox-inner-container:hover .mat-checkbox-persistent-ripple{opacity:0}@media (hover:none){.mat-checkbox-inner-container:hover .mat-checkbox-persistent-ripple{display:none}}.mat-checkbox-checkmark{top:0;left:0;right:0;bottom:0;position:absolute;width:100%}.mat-checkbox-checkmark-path{stroke-dashoffset:22.91026;stroke-dasharray:22.91026;stroke-width:2.13333px}.mat-checkbox-mixedmark{width:calc(100% - 6px);height:2px;opacity:0;transform:scaleX(0) rotate(0);border-radius:2px}@media (-ms-high-contrast:active){.mat-checkbox-mixedmark{height:0;border-top:solid 2px;margin-top:2px}}.mat-checkbox-label-before .mat-checkbox-inner-container{order:1;margin-left:8px;margin-right:auto}[dir=rtl] .mat-checkbox-label-before .mat-checkbox-inner-container{margin-left:auto;margin-right:8px}.mat-checkbox-checked .mat-checkbox-checkmark{opacity:1}.mat-checkbox-checked .mat-checkbox-checkmark-path{stroke-dashoffset:0}.mat-checkbox-checked .mat-checkbox-mixedmark{transform:scaleX(1) rotate(-45deg)}.mat-checkbox-indeterminate .mat-checkbox-checkmark{opacity:0;transform:rotate(45deg)}.mat-checkbox-indeterminate .mat-checkbox-checkmark-path{stroke-dashoffset:0}.mat-checkbox-indeterminate .mat-checkbox-mixedmark{opacity:1;transform:scaleX(1) rotate(0)}.mat-checkbox-unchecked .mat-checkbox-background{background-color:transparent}.mat-checkbox-disabled{cursor:default}.mat-checkbox-anim-unchecked-checked .mat-checkbox-background{animation:180ms linear 0s mat-checkbox-fade-in-background}.mat-checkbox-anim-unchecked-checked .mat-checkbox-checkmark-path{animation:180ms linear 0s mat-checkbox-unchecked-checked-checkmark-path}.mat-checkbox-anim-unchecked-indeterminate .mat-checkbox-background{animation:180ms linear 0s mat-checkbox-fade-in-background}.mat-checkbox-anim-unchecked-indeterminate .mat-checkbox-mixedmark{animation:90ms linear 0s mat-checkbox-unchecked-indeterminate-mixedmark}.mat-checkbox-anim-checked-unchecked .mat-checkbox-background{animation:180ms linear 0s mat-checkbox-fade-out-background}.mat-checkbox-anim-checked-unchecked .mat-checkbox-checkmark-path{animation:90ms linear 0s mat-checkbox-checked-unchecked-checkmark-path}.mat-checkbox-anim-checked-indeterminate .mat-checkbox-checkmark{animation:90ms linear 0s mat-checkbox-checked-indeterminate-checkmark}.mat-checkbox-anim-checked-indeterminate .mat-checkbox-mixedmark{animation:90ms linear 0s mat-checkbox-checked-indeterminate-mixedmark}.mat-checkbox-anim-indeterminate-checked .mat-checkbox-checkmark{animation:.5s linear 0s mat-checkbox-indeterminate-checked-checkmark}.mat-checkbox-anim-indeterminate-checked .mat-checkbox-mixedmark{animation:.5s linear 0s mat-checkbox-indeterminate-checked-mixedmark}.mat-checkbox-anim-indeterminate-unchecked .mat-checkbox-background{animation:180ms linear 0s mat-checkbox-fade-out-background}.mat-checkbox-anim-indeterminate-unchecked .mat-checkbox-mixedmark{animation:.3s linear 0s mat-checkbox-indeterminate-unchecked-mixedmark}.mat-checkbox-input{bottom:0;left:50%}.mat-checkbox .mat-checkbox-ripple{position:absolute;left:calc(50% - 20px);top:calc(50% - 20px);height:40px;width:40px;z-index:1;pointer-events:none}"],
+                    styles: ["@keyframes mat-checkbox-fade-in-background{0%{opacity:0}50%{opacity:1}}@keyframes mat-checkbox-fade-out-background{0%,50%{opacity:1}100%{opacity:0}}@keyframes mat-checkbox-unchecked-checked-checkmark-path{0%,50%{stroke-dashoffset:22.91026}50%{animation-timing-function:cubic-bezier(0,0,.2,.1)}100%{stroke-dashoffset:0}}@keyframes mat-checkbox-unchecked-indeterminate-mixedmark{0%,68.2%{transform:scaleX(0)}68.2%{animation-timing-function:cubic-bezier(0,0,0,1)}100%{transform:scaleX(1)}}@keyframes mat-checkbox-checked-unchecked-checkmark-path{from{animation-timing-function:cubic-bezier(.4,0,1,1);stroke-dashoffset:0}to{stroke-dashoffset:-22.91026}}@keyframes mat-checkbox-checked-indeterminate-checkmark{from{animation-timing-function:cubic-bezier(0,0,.2,.1);opacity:1;transform:rotate(0)}to{opacity:0;transform:rotate(45deg)}}@keyframes mat-checkbox-indeterminate-checked-checkmark{from{animation-timing-function:cubic-bezier(.14,0,0,1);opacity:0;transform:rotate(45deg)}to{opacity:1;transform:rotate(360deg)}}@keyframes mat-checkbox-checked-indeterminate-mixedmark{from{animation-timing-function:cubic-bezier(0,0,.2,.1);opacity:0;transform:rotate(-45deg)}to{opacity:1;transform:rotate(0)}}@keyframes mat-checkbox-indeterminate-checked-mixedmark{from{animation-timing-function:cubic-bezier(.14,0,0,1);opacity:1;transform:rotate(0)}to{opacity:0;transform:rotate(315deg)}}@keyframes mat-checkbox-indeterminate-unchecked-mixedmark{0%{animation-timing-function:linear;opacity:1;transform:scaleX(1)}100%,32.8%{opacity:0;transform:scaleX(0)}}.mat-checkbox-background,.mat-checkbox-frame{top:0;left:0;right:0;bottom:0;position:absolute;border-radius:2px;box-sizing:border-box;pointer-events:none}.mat-checkbox{transition:background .4s cubic-bezier(.25,.8,.25,1),box-shadow 280ms cubic-bezier(.4,0,.2,1);cursor:pointer;-webkit-tap-highlight-color:transparent}._mat-animation-noopable.mat-checkbox{transition:none;animation:none}.mat-checkbox .mat-ripple-element:not(.mat-checkbox-persistent-ripple){opacity:.16}.mat-checkbox-layout{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:inherit;align-items:baseline;vertical-align:middle;display:inline-flex;white-space:nowrap}.mat-checkbox-label{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.mat-checkbox-inner-container{display:inline-block;height:16px;line-height:0;margin:auto;margin-right:8px;order:0;position:relative;vertical-align:middle;white-space:nowrap;width:16px;flex-shrink:0}[dir=rtl] .mat-checkbox-inner-container{margin-left:8px;margin-right:auto}.mat-checkbox-inner-container-no-side-margin{margin-left:0;margin-right:0}.mat-checkbox-frame{background-color:transparent;transition:border-color 90ms cubic-bezier(0,0,.2,.1);border-width:2px;border-style:solid}._mat-animation-noopable .mat-checkbox-frame{transition:none}@media (-ms-high-contrast:active){.mat-checkbox.cdk-keyboard-focused .mat-checkbox-frame{border-style:dotted}}.mat-checkbox-background{align-items:center;display:inline-flex;justify-content:center;transition:background-color 90ms cubic-bezier(0,0,.2,.1),opacity 90ms cubic-bezier(0,0,.2,.1)}._mat-animation-noopable .mat-checkbox-background{transition:none}.mat-checkbox-persistent-ripple{width:100%;height:100%;transform:none}.mat-checkbox-inner-container:hover .mat-checkbox-persistent-ripple{opacity:.04}.mat-checkbox.cdk-keyboard-focused .mat-checkbox-persistent-ripple{opacity:.12}.mat-checkbox-persistent-ripple,.mat-checkbox.mat-checkbox-disabled .mat-checkbox-inner-container:hover .mat-checkbox-persistent-ripple{opacity:0}@media (hover:none){.mat-checkbox-inner-container:hover .mat-checkbox-persistent-ripple{display:none}}.mat-checkbox-checkmark{top:0;left:0;right:0;bottom:0;position:absolute;width:100%}.mat-checkbox-checkmark-path{stroke-dashoffset:22.91026;stroke-dasharray:22.91026;stroke-width:2.13333px}.mat-checkbox-mixedmark{width:calc(100% - 6px);height:2px;opacity:0;transform:scaleX(0) rotate(0);border-radius:2px}@media (-ms-high-contrast:active){.mat-checkbox-mixedmark{height:0;border-top:solid 2px;margin-top:2px}}.mat-checkbox-label-before .mat-checkbox-inner-container{order:1;margin-left:8px;margin-right:auto}[dir=rtl] .mat-checkbox-label-before .mat-checkbox-inner-container{margin-left:auto;margin-right:8px}.mat-checkbox-checked .mat-checkbox-checkmark{opacity:1}.mat-checkbox-checked .mat-checkbox-checkmark-path{stroke-dashoffset:0}.mat-checkbox-checked .mat-checkbox-mixedmark{transform:scaleX(1) rotate(-45deg)}.mat-checkbox-indeterminate .mat-checkbox-checkmark{opacity:0;transform:rotate(45deg)}.mat-checkbox-indeterminate .mat-checkbox-checkmark-path{stroke-dashoffset:0}.mat-checkbox-indeterminate .mat-checkbox-mixedmark{opacity:1;transform:scaleX(1) rotate(0)}.mat-checkbox-unchecked .mat-checkbox-background{background-color:transparent}.mat-checkbox-disabled{cursor:default}.mat-checkbox-anim-unchecked-checked .mat-checkbox-background{animation:180ms linear 0s mat-checkbox-fade-in-background}.mat-checkbox-anim-unchecked-checked .mat-checkbox-checkmark-path{animation:180ms linear 0s mat-checkbox-unchecked-checked-checkmark-path}.mat-checkbox-anim-unchecked-indeterminate .mat-checkbox-background{animation:180ms linear 0s mat-checkbox-fade-in-background}.mat-checkbox-anim-unchecked-indeterminate .mat-checkbox-mixedmark{animation:90ms linear 0s mat-checkbox-unchecked-indeterminate-mixedmark}.mat-checkbox-anim-checked-unchecked .mat-checkbox-background{animation:180ms linear 0s mat-checkbox-fade-out-background}.mat-checkbox-anim-checked-unchecked .mat-checkbox-checkmark-path{animation:90ms linear 0s mat-checkbox-checked-unchecked-checkmark-path}.mat-checkbox-anim-checked-indeterminate .mat-checkbox-checkmark{animation:90ms linear 0s mat-checkbox-checked-indeterminate-checkmark}.mat-checkbox-anim-checked-indeterminate .mat-checkbox-mixedmark{animation:90ms linear 0s mat-checkbox-checked-indeterminate-mixedmark}.mat-checkbox-anim-indeterminate-checked .mat-checkbox-checkmark{animation:.5s linear 0s mat-checkbox-indeterminate-checked-checkmark}.mat-checkbox-anim-indeterminate-checked .mat-checkbox-mixedmark{animation:.5s linear 0s mat-checkbox-indeterminate-checked-mixedmark}.mat-checkbox-anim-indeterminate-unchecked .mat-checkbox-background{animation:180ms linear 0s mat-checkbox-fade-out-background}.mat-checkbox-anim-indeterminate-unchecked .mat-checkbox-mixedmark{animation:.3s linear 0s mat-checkbox-indeterminate-unchecked-mixedmark}.mat-checkbox-input{bottom:0;left:50%}.mat-checkbox .mat-checkbox-ripple{position:absolute;left:calc(50% - 20px);top:calc(50% - 20px);height:40px;width:40px;z-index:1;pointer-events:none}"],
                     exportAs: 'matCheckbox',
                     host: {
                         'class': 'mat-checkbox',
@@ -8825,7 +8878,9 @@ var MatChipTrailingIcon = /** @class */ (function () {
  */
 var MatChip = /** @class */ (function (_super) {
     __extends(MatChip, _super);
-    function MatChip(_elementRef, _ngZone, platform$$1, globalRippleOptions) {
+    function MatChip(_elementRef, _ngZone, platform$$1, globalRippleOptions, 
+    // @breaking-change 8.0.0 `animationMode` parameter to become required.
+    animationMode) {
         var _this = _super.call(this, _elementRef) || this;
         _this._elementRef = _elementRef;
         _this._ngZone = _ngZone;
@@ -8868,6 +8923,7 @@ var MatChip = /** @class */ (function (_super) {
         _this._chipRipple = new RippleRenderer(_this, _ngZone, _elementRef, platform$$1);
         _this._chipRipple.setupTriggerEvents(_elementRef.nativeElement);
         _this.rippleConfig = globalRippleOptions || {};
+        _this._animationsDisabled = animationMode === 'NoopAnimations';
         return _this;
     }
     Object.defineProperty(MatChip.prototype, "rippleDisabled", {
@@ -9230,6 +9286,7 @@ var MatChip = /** @class */ (function (_super) {
                         '[class.mat-chip-with-avatar]': 'avatar',
                         '[class.mat-chip-with-trailing-icon]': 'trailingIcon || removeIcon',
                         '[class.mat-chip-disabled]': 'disabled',
+                        '[class._mat-animation-noopable]': '_animationsDisabled',
                         '[attr.disabled]': 'disabled || null',
                         '[attr.aria-disabled]': 'disabled.toString()',
                         '[attr.aria-selected]': 'ariaSelected',
@@ -9245,7 +9302,8 @@ var MatChip = /** @class */ (function (_super) {
         { type: core.ElementRef },
         { type: core.NgZone },
         { type: platform.Platform },
-        { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [MAT_RIPPLE_GLOBAL_OPTIONS,] }] }
+        { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [MAT_RIPPLE_GLOBAL_OPTIONS,] }] },
+        { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] }
     ]; };
     MatChip.propDecorators = {
         avatar: [{ type: core.ContentChild, args: [MatChipAvatar, { static: false },] }],
@@ -10641,7 +10699,7 @@ var MatChipList = /** @class */ (function (_super) {
                         '[id]': '_uid',
                     },
                     providers: [{ provide: MatFormFieldControl, useExisting: MatChipList }],
-                    styles: [".mat-chip{position:relative;overflow:hidden;box-sizing:border-box;-webkit-tap-highlight-color:transparent;transform:translateZ(0)}.mat-standard-chip{transition:box-shadow 280ms cubic-bezier(.4,0,.2,1);display:inline-flex;padding:7px 12px;border-radius:16px;align-items:center;cursor:default;min-height:32px;height:1px}.mat-standard-chip .mat-chip-remove.mat-icon{width:18px;height:18px}.mat-standard-chip::after{top:0;left:0;right:0;bottom:0;position:absolute;border-radius:inherit;opacity:0;content:'';pointer-events:none;transition:opacity .2s cubic-bezier(.35,0,.25,1)}.mat-standard-chip:hover::after{opacity:.12}.mat-standard-chip:focus{outline:0}.mat-standard-chip:focus::after{opacity:.16}@media (-ms-high-contrast:active){.mat-standard-chip{outline:solid 1px}.mat-standard-chip:focus{outline:dotted 2px}}.mat-standard-chip.mat-chip-disabled::after{opacity:0}.mat-standard-chip.mat-chip-disabled .mat-chip-remove,.mat-standard-chip.mat-chip-disabled .mat-chip-trailing-icon{cursor:default}.mat-standard-chip.mat-chip-with-avatar,.mat-standard-chip.mat-chip-with-trailing-icon.mat-chip-with-avatar{padding-top:0;padding-bottom:0}.mat-standard-chip.mat-chip-with-trailing-icon.mat-chip-with-avatar{padding-right:8px;padding-left:0}[dir=rtl] .mat-standard-chip.mat-chip-with-trailing-icon.mat-chip-with-avatar{padding-left:8px;padding-right:0}.mat-standard-chip.mat-chip-with-trailing-icon{padding-top:7px;padding-bottom:7px;padding-right:8px;padding-left:12px}[dir=rtl] .mat-standard-chip.mat-chip-with-trailing-icon{padding-left:8px;padding-right:12px}.mat-standard-chip.mat-chip-with-avatar{padding-left:0;padding-right:12px}[dir=rtl] .mat-standard-chip.mat-chip-with-avatar{padding-right:0;padding-left:12px}.mat-standard-chip .mat-chip-avatar{width:24px;height:24px;margin-right:8px;margin-left:4px}[dir=rtl] .mat-standard-chip .mat-chip-avatar{margin-left:8px;margin-right:4px}.mat-standard-chip .mat-chip-remove,.mat-standard-chip .mat-chip-trailing-icon{width:18px;height:18px;cursor:pointer}.mat-standard-chip .mat-chip-remove,.mat-standard-chip .mat-chip-trailing-icon{margin-left:8px;margin-right:0}[dir=rtl] .mat-standard-chip .mat-chip-remove,[dir=rtl] .mat-standard-chip .mat-chip-trailing-icon{margin-right:8px;margin-left:0}.mat-chip-list-wrapper{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;margin:-4px}.mat-chip-list-wrapper .mat-standard-chip,.mat-chip-list-wrapper input.mat-input-element{margin:4px}.mat-chip-list-stacked .mat-chip-list-wrapper{flex-direction:column;align-items:flex-start}.mat-chip-list-stacked .mat-chip-list-wrapper .mat-standard-chip{width:100%}.mat-chip-avatar{border-radius:50%;justify-content:center;align-items:center;display:flex;overflow:hidden;object-fit:cover}input.mat-chip-input{width:150px;margin:4px;flex:1 0 150px}"],
+                    styles: [".mat-chip{position:relative;overflow:hidden;box-sizing:border-box;-webkit-tap-highlight-color:transparent;transform:translateZ(0)}.mat-standard-chip{transition:box-shadow 280ms cubic-bezier(.4,0,.2,1);display:inline-flex;padding:7px 12px;border-radius:16px;align-items:center;cursor:default;min-height:32px;height:1px}._mat-animation-noopable.mat-standard-chip{transition:none;animation:none}.mat-standard-chip .mat-chip-remove.mat-icon{width:18px;height:18px}.mat-standard-chip::after{top:0;left:0;right:0;bottom:0;position:absolute;border-radius:inherit;opacity:0;content:'';pointer-events:none;transition:opacity .2s cubic-bezier(.35,0,.25,1)}.mat-standard-chip:hover::after{opacity:.12}.mat-standard-chip:focus{outline:0}.mat-standard-chip:focus::after{opacity:.16}@media (-ms-high-contrast:active){.mat-standard-chip{outline:solid 1px}.mat-standard-chip:focus{outline:dotted 2px}}.mat-standard-chip.mat-chip-disabled::after{opacity:0}.mat-standard-chip.mat-chip-disabled .mat-chip-remove,.mat-standard-chip.mat-chip-disabled .mat-chip-trailing-icon{cursor:default}.mat-standard-chip.mat-chip-with-avatar,.mat-standard-chip.mat-chip-with-trailing-icon.mat-chip-with-avatar{padding-top:0;padding-bottom:0}.mat-standard-chip.mat-chip-with-trailing-icon.mat-chip-with-avatar{padding-right:8px;padding-left:0}[dir=rtl] .mat-standard-chip.mat-chip-with-trailing-icon.mat-chip-with-avatar{padding-left:8px;padding-right:0}.mat-standard-chip.mat-chip-with-trailing-icon{padding-top:7px;padding-bottom:7px;padding-right:8px;padding-left:12px}[dir=rtl] .mat-standard-chip.mat-chip-with-trailing-icon{padding-left:8px;padding-right:12px}.mat-standard-chip.mat-chip-with-avatar{padding-left:0;padding-right:12px}[dir=rtl] .mat-standard-chip.mat-chip-with-avatar{padding-right:0;padding-left:12px}.mat-standard-chip .mat-chip-avatar{width:24px;height:24px;margin-right:8px;margin-left:4px}[dir=rtl] .mat-standard-chip .mat-chip-avatar{margin-left:8px;margin-right:4px}.mat-standard-chip .mat-chip-remove,.mat-standard-chip .mat-chip-trailing-icon{width:18px;height:18px;cursor:pointer}.mat-standard-chip .mat-chip-remove,.mat-standard-chip .mat-chip-trailing-icon{margin-left:8px;margin-right:0}[dir=rtl] .mat-standard-chip .mat-chip-remove,[dir=rtl] .mat-standard-chip .mat-chip-trailing-icon{margin-right:8px;margin-left:0}.mat-chip-list-wrapper{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;margin:-4px}.mat-chip-list-wrapper .mat-standard-chip,.mat-chip-list-wrapper input.mat-input-element{margin:4px}.mat-chip-list-stacked .mat-chip-list-wrapper{flex-direction:column;align-items:flex-start}.mat-chip-list-stacked .mat-chip-list-wrapper .mat-standard-chip{width:100%}.mat-chip-avatar{border-radius:50%;justify-content:center;align-items:center;display:flex;overflow:hidden;object-fit:cover}input.mat-chip-input{width:150px;margin:4px;flex:1 0 150px}"],
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.OnPush
                 },] },
@@ -11183,15 +11241,29 @@ var MatDialogContainer = /** @class */ (function (_super) {
      * @return {?}
      */
     function () {
+        /** @type {?} */
+        var element = this._elementRef.nativeElement;
         if (!this._focusTrap) {
-            this._focusTrap = this._focusTrapFactory.create(this._elementRef.nativeElement);
+            this._focusTrap = this._focusTrapFactory.create(element);
         }
-        // If were to attempt to focus immediately, then the content of the dialog would not yet be
+        // If we were to attempt to focus immediately, then the content of the dialog would not yet be
         // ready in instances where change detection has to run first. To deal with this, we simply
         // wait for the microtask queue to be empty.
         if (this._config.autoFocus) {
             this._focusTrap.focusInitialElementWhenReady();
         }
+        else {
+            /** @type {?} */
+            var activeElement = this._document.activeElement;
+            // Otherwise ensure that focus is on the dialog container. It's possible that a different
+            // component tried to move focus while the open animation was running. See:
+            // https://github.com/angular/components/issues/16215. Note that we only want to do this
+            // if the focus isn't inside the dialog already, because it's possible that the consumer
+            // turned off `autoFocus` in order to move focus themselves.
+            if (activeElement !== element && !element.contains(activeElement)) {
+                element.focus();
+            }
+        }
     };
     /** Restores focus to the element that was focused before the dialog opened. */
     /**
@@ -11393,7 +11465,10 @@ MatDialogRef = /** @class */ (function () {
         function (event) { return event.phaseName === 'done' && event.toState === 'exit'; })), operators.take(1)).subscribe((/**
          * @return {?}
          */
-        function () { return _this._overlayRef.dispose(); }));
+        function () {
+            clearTimeout(_this._closeFallbackTimeout);
+            _this._overlayRef.dispose();
+        }));
         _overlayRef.detachments().subscribe((/**
          * @return {?}
          */
@@ -11410,11 +11485,17 @@ MatDialogRef = /** @class */ (function () {
          * @param {?} event
          * @return {?}
          */
-        function (event) { return event.keyCode === keycodes.ESCAPE && !_this.disableClose; })))
+        function (event) {
+            return event.keyCode === keycodes.ESCAPE && !_this.disableClose && !keycodes.hasModifierKey(event);
+        })))
             .subscribe((/**
+         * @param {?} event
          * @return {?}
          */
-        function () { return _this.close(); }));
+        function (event) {
+            event.preventDefault();
+            _this.close();
+        }));
     }
     /**
      * Close the dialog.
@@ -11440,12 +11521,24 @@ MatDialogRef = /** @class */ (function () {
          */
         function (event) { return event.phaseName === 'start'; })), operators.take(1))
             .subscribe((/**
+         * @param {?} event
          * @return {?}
          */
-        function () {
+        function (event) {
             _this._beforeClosed.next(dialogResult);
             _this._beforeClosed.complete();
             _this._overlayRef.detachBackdrop();
+            // The logic that disposes of the overlay depends on the exit animation completing, however
+            // it isn't guaranteed if the parent view is destroyed while it's running. Add a fallback
+            // timeout which will clean everything up if the animation hasn't fired within the specified
+            // amount of time plus 100ms. We don't need to run this outside the NgZone, because for the
+            // vast majority of cases the timeout will have been cleared before it has the chance to fire.
+            _this._closeFallbackTimeout = setTimeout((/**
+             * @return {?}
+             */
+            function () {
+                _this._overlayRef.dispose();
+            }), event.totalTime + 100);
         }));
         this._containerInstance._startExitAnimation();
     };
@@ -13905,8 +13998,7 @@ var MatMultiYearView = /** @class */ (function () {
             /** @type {?} */
             var validDate = this._getValidDateOrNull(this._dateAdapter.deserialize(value)) || this._dateAdapter.today();
             this._activeDate = this._dateAdapter.clampDate(validDate, this.minDate, this.maxDate);
-            if (Math.floor(this._dateAdapter.getYear(oldActiveDate) / yearsPerPage) !=
-                Math.floor(this._dateAdapter.getYear(this._activeDate) / yearsPerPage)) {
+            if (!isSameMultiYearView(this._dateAdapter, oldActiveDate, this._activeDate, this.minDate, this.maxDate)) {
                 this._init();
             }
         },
@@ -13986,13 +14078,18 @@ var MatMultiYearView = /** @class */ (function () {
     function () {
         var _this = this;
         this._todayYear = this._dateAdapter.getYear(this._dateAdapter.today());
+        // We want a range years such that we maximize the number of
+        // enabled dates visible at once. This prevents issues where the minimum year
+        // is the last item of a page OR the maximum year is the first item of a page.
+        // The offset from the active year to the "slot" for the starting year is the
+        // *actual* first rendered year in the multi-year view.
         /** @type {?} */
         var activeYear = this._dateAdapter.getYear(this._activeDate);
         /** @type {?} */
-        var activeOffset = activeYear % yearsPerPage;
+        var minYearOfPage = activeYear - getActiveOffset(this._dateAdapter, this.activeDate, this.minDate, this.maxDate);
         this._years = [];
         for (var i = 0, row = []; i < yearsPerPage; i++) {
-            row.push(activeYear - activeOffset + i);
+            row.push(minYearOfPage + i);
             if (row.length == yearsPerRow) {
                 this._years.push(row.map((/**
                  * @param {?} year
@@ -14035,12 +14132,6 @@ var MatMultiYearView = /** @class */ (function () {
      * @return {?}
      */
     function (event) {
-        // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
-        // disabled ones from being selected. This may not be ideal, we should look into whether
-        // navigation should skip over disabled dates, and if so, how to implement that efficiently.
-        // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
-        // disabled ones from being selected. This may not be ideal, we should look into whether
-        // navigation should skip over disabled dates, and if so, how to implement that efficiently.
         /** @type {?} */
         var oldActiveDate = this._activeDate;
         /** @type {?} */
@@ -14059,10 +14150,10 @@ var MatMultiYearView = /** @class */ (function () {
                 this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, yearsPerRow);
                 break;
             case keycodes.HOME:
-                this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, -this._dateAdapter.getYear(this._activeDate) % yearsPerPage);
+                this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, -getActiveOffset(this._dateAdapter, this.activeDate, this.minDate, this.maxDate));
                 break;
             case keycodes.END:
-                this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, yearsPerPage - this._dateAdapter.getYear(this._activeDate) % yearsPerPage - 1);
+                this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, yearsPerPage - getActiveOffset(this._dateAdapter, this.activeDate, this.minDate, this.maxDate) - 1);
                 break;
             case keycodes.PAGE_UP:
                 this.activeDate =
@@ -14094,7 +14185,7 @@ var MatMultiYearView = /** @class */ (function () {
      * @return {?}
      */
     function () {
-        return this._dateAdapter.getYear(this.activeDate) % yearsPerPage;
+        return getActiveOffset(this._dateAdapter, this.activeDate, this.minDate, this.maxDate);
     };
     /** Focuses the active cell after the microtask queue is empty. */
     /**
@@ -14218,6 +14309,72 @@ var MatMultiYearView = /** @class */ (function () {
     };
     return MatMultiYearView;
 }());
+/**
+ * @template D
+ * @param {?} dateAdapter
+ * @param {?} date1
+ * @param {?} date2
+ * @param {?} minDate
+ * @param {?} maxDate
+ * @return {?}
+ */
+function isSameMultiYearView(dateAdapter, date1, date2, minDate, maxDate) {
+    /** @type {?} */
+    var year1 = dateAdapter.getYear(date1);
+    /** @type {?} */
+    var year2 = dateAdapter.getYear(date2);
+    /** @type {?} */
+    var startingYear = getStartingYear(dateAdapter, minDate, maxDate);
+    return Math.floor((year1 - startingYear) / yearsPerPage) ===
+        Math.floor((year2 - startingYear) / yearsPerPage);
+}
+/**
+ * When the multi-year view is first opened, the active year will be in view.
+ * So we compute how many years are between the active year and the *slot* where our
+ * "startingYear" will render when paged into view.
+ * @template D
+ * @param {?} dateAdapter
+ * @param {?} activeDate
+ * @param {?} minDate
+ * @param {?} maxDate
+ * @return {?}
+ */
+function getActiveOffset(dateAdapter, activeDate, minDate, maxDate) {
+    /** @type {?} */
+    var activeYear = dateAdapter.getYear(activeDate);
+    return euclideanModulo((activeYear - getStartingYear(dateAdapter, minDate, maxDate)), yearsPerPage);
+}
+/**
+ * We pick a "starting" year such that either the maximum year would be at the end
+ * or the minimum year would be at the beginning of a page.
+ * @template D
+ * @param {?} dateAdapter
+ * @param {?} minDate
+ * @param {?} maxDate
+ * @return {?}
+ */
+function getStartingYear(dateAdapter, minDate, maxDate) {
+    /** @type {?} */
+    var startingYear = 0;
+    if (maxDate) {
+        /** @type {?} */
+        var maxYear = dateAdapter.getYear(maxDate);
+        startingYear = maxYear - yearsPerPage + 1;
+    }
+    else if (minDate) {
+        startingYear = dateAdapter.getYear(minDate);
+    }
+    return startingYear;
+}
+/**
+ * Gets remainder that is non-negative, even if first number is negative
+ * @param {?} a
+ * @param {?} b
+ * @return {?}
+ */
+function euclideanModulo(a, b) {
+    return (a % b + b) % b;
+}
 
 /**
  * @fileoverview added by tsickle
@@ -14692,13 +14849,16 @@ var MatCalendarHeader = /** @class */ (function () {
             if (this.calendar.currentView == 'year') {
                 return this._dateAdapter.getYearName(this.calendar.activeDate);
             }
+            // The offset from the active year to the "slot" for the starting year is the
+            // *actual* first rendered year in the multi-year view, and the last year is
+            // just yearsPerPage - 1 away.
             /** @type {?} */
             var activeYear = this._dateAdapter.getYear(this.calendar.activeDate);
             /** @type {?} */
-            var firstYearInView = this._dateAdapter.getYearName(this._dateAdapter.createDate(activeYear - activeYear % 24, 0, 1));
+            var minYearOfPage = activeYear - getActiveOffset(this._dateAdapter, this.calendar.activeDate, this.calendar.minDate, this.calendar.maxDate);
             /** @type {?} */
-            var lastYearInView = this._dateAdapter.getYearName(this._dateAdapter.createDate(activeYear + yearsPerPage - 1 - activeYear % 24, 0, 1));
-            return firstYearInView + " \u2013 " + lastYearInView;
+            var maxYearOfPage = minYearOfPage + yearsPerPage - 1;
+            return minYearOfPage + " \u2013 " + maxYearOfPage;
         },
         enumerable: true,
         configurable: true
@@ -14839,8 +14999,7 @@ var MatCalendarHeader = /** @class */ (function () {
             return this._dateAdapter.getYear(date1) == this._dateAdapter.getYear(date2);
         }
         // Otherwise we are in 'multi-year' view.
-        return Math.floor(this._dateAdapter.getYear(date1) / yearsPerPage) ==
-            Math.floor(this._dateAdapter.getYear(date2) / yearsPerPage);
+        return isSameMultiYearView(this._dateAdapter, date1, date2, this.calendar.minDate, this.calendar.maxDate);
     };
     MatCalendarHeader.decorators = [
         { type: core.Component, args: [{selector: 'mat-calendar-header',
@@ -15865,9 +16024,15 @@ var MatDatepicker = /** @class */ (function () {
             return event.keyCode === keycodes.ESCAPE ||
                 (_this._datepickerInput && event.altKey && event.keyCode === keycodes.UP_ARROW);
         })))).subscribe((/**
+         * @param {?} event
          * @return {?}
          */
-        function () { return _this.close(); }));
+        function (event) {
+            if (event) {
+                event.preventDefault();
+            }
+            _this.close();
+        }));
     };
     /** Create the popup PositionStrategy. */
     /**
@@ -17067,6 +17232,25 @@ var MatExpansionPanel = /** @class */ (function (_super) {
         enumerable: true,
         configurable: true
     });
+    Object.defineProperty(MatExpansionPanel.prototype, "togglePosition", {
+        /** Whether the toggle indicator should be hidden. */
+        get: /**
+         * Whether the toggle indicator should be hidden.
+         * @return {?}
+         */
+        function () {
+            return this._togglePosition || (this.accordion && this.accordion.togglePosition);
+        },
+        set: /**
+         * @param {?} value
+         * @return {?}
+         */
+        function (value) {
+            this._togglePosition = value;
+        },
+        enumerable: true,
+        configurable: true
+    });
     /** Determines whether the expansion panel should have spacing between it and its siblings. */
     /**
      * Determines whether the expansion panel should have spacing between it and its siblings.
@@ -17194,6 +17378,7 @@ var MatExpansionPanel = /** @class */ (function (_super) {
     ]; };
     MatExpansionPanel.propDecorators = {
         hideToggle: [{ type: core.Input }],
+        togglePosition: [{ type: core.Input }],
         afterExpand: [{ type: core.Output }],
         afterCollapse: [{ type: core.Output }],
         _lazyContent: [{ type: core.ContentChild, args: [MatExpansionPanelContent, { static: false },] }],
@@ -17232,13 +17417,17 @@ var MatExpansionPanelHeader = /** @class */ (function () {
         this._focusMonitor = _focusMonitor;
         this._changeDetectorRef = _changeDetectorRef;
         this._parentChangeSubscription = rxjs.Subscription.EMPTY;
+        /**
+         * Whether Angular animations in the panel header should be disabled.
+         */
+        this._animationsDisabled = true;
         /** @type {?} */
         var accordionHideToggleChange = panel.accordion ?
             panel.accordion._stateChanges.pipe(operators.filter((/**
              * @param {?} changes
              * @return {?}
              */
-            function (changes) { return !!changes['hideToggle']; }))) :
+            function (changes) { return !!(changes['hideToggle'] || changes['togglePosition']); }))) :
             rxjs.EMPTY;
         // Since the toggle state depends on an @Input on the panel, we
         // need to subscribe and trigger change detection manually.
@@ -17247,7 +17436,11 @@ var MatExpansionPanelHeader = /** @class */ (function () {
              * @param {?} changes
              * @return {?}
              */
-            function (changes) { return !!(changes['hideToggle'] || changes['disabled']); }))))
+            function (changes) {
+                return !!(changes['hideToggle'] ||
+                    changes['disabled'] ||
+                    changes['togglePosition']);
+            }))))
                 .subscribe((/**
              * @return {?}
              */
@@ -17276,6 +17469,23 @@ var MatExpansionPanelHeader = /** @class */ (function () {
             this.collapsedHeight = defaultOptions.collapsedHeight;
         }
     }
+    /**
+     * @return {?}
+     */
+    MatExpansionPanelHeader.prototype._animationStarted = /**
+     * @return {?}
+     */
+    function () {
+        // Currently the `expansionHeight` animation has a `void => collapsed` transition which is
+        // there to work around a bug in Angular (see #13088), however this introduces a different
+        // issue. The new transition will cause the header to animate in on init (see #16067), if the
+        // consumer has set a header height that is different from the default one. We work around it
+        // by disabling animations on the header and re-enabling them after the first animation has run.
+        // Note that Angular dispatches animation events even if animations are disabled. Ideally this
+        // wouldn't be necessary if we remove the `void => collapsed` transition, but we have to wait
+        // for https://github.com/angular/angular/issues/18847 to be resolved.
+        this._animationsDisabled = false;
+    };
     Object.defineProperty(MatExpansionPanelHeader.prototype, "disabled", {
         /**
          * Whether the associated panel is disabled. Implemented as a part of `FocusableOption`.
@@ -17340,6 +17550,18 @@ var MatExpansionPanelHeader = /** @class */ (function () {
     function () {
         return this.panel.id;
     };
+    /** Gets the toggle position for the header. */
+    /**
+     * Gets the toggle position for the header.
+     * @return {?}
+     */
+    MatExpansionPanelHeader.prototype._getTogglePosition = /**
+     * Gets the toggle position for the header.
+     * @return {?}
+     */
+    function () {
+        return this.panel.togglePosition;
+    };
     /** Gets whether the expand indicator should be shown. */
     /**
      * Gets whether the expand indicator should be shown.
@@ -17413,7 +17635,7 @@ var MatExpansionPanelHeader = /** @class */ (function () {
     };
     MatExpansionPanelHeader.decorators = [
         { type: core.Component, args: [{selector: 'mat-expansion-panel-header',
-                    styles: [".mat-expansion-panel-header{display:flex;flex-direction:row;align-items:center;padding:0 24px;border-radius:inherit}.mat-expansion-panel-header:focus,.mat-expansion-panel-header:hover{outline:0}.mat-expansion-panel-header.mat-expanded:focus,.mat-expansion-panel-header.mat-expanded:hover{background:inherit}.mat-expansion-panel-header:not([aria-disabled=true]){cursor:pointer}.mat-content{display:flex;flex:1;flex-direction:row;overflow:hidden}.mat-expansion-panel-header-description,.mat-expansion-panel-header-title{display:flex;flex-grow:1;margin-right:16px}[dir=rtl] .mat-expansion-panel-header-description,[dir=rtl] .mat-expansion-panel-header-title{margin-right:0;margin-left:16px}.mat-expansion-panel-header-description{flex-grow:2}.mat-expansion-indicator::after{border-style:solid;border-width:0 2px 2px 0;content:'';display:inline-block;padding:3px;transform:rotate(45deg);vertical-align:middle}"],
+                    styles: [".mat-expansion-panel-header{display:flex;flex-direction:row;align-items:center;padding:0 24px;border-radius:inherit}.mat-expansion-panel-header:focus,.mat-expansion-panel-header:hover{outline:0}.mat-expansion-panel-header.mat-expanded:focus,.mat-expansion-panel-header.mat-expanded:hover{background:inherit}.mat-expansion-panel-header:not([aria-disabled=true]){cursor:pointer}.mat-expansion-panel-header.mat-expansion-toggle-indicator-before{flex-direction:row-reverse}.mat-expansion-panel-header.mat-expansion-toggle-indicator-before .mat-expansion-indicator{margin:0 16px 0 0}[dir=rtl] .mat-expansion-panel-header.mat-expansion-toggle-indicator-before .mat-expansion-indicator{margin:0 0 0 16px}.mat-content{display:flex;flex:1;flex-direction:row;overflow:hidden}.mat-expansion-panel-header-description,.mat-expansion-panel-header-title{display:flex;flex-grow:1;margin-right:16px}[dir=rtl] .mat-expansion-panel-header-description,[dir=rtl] .mat-expansion-panel-header-title{margin-right:0;margin-left:16px}.mat-expansion-panel-header-description{flex-grow:2}.mat-expansion-indicator::after{border-style:solid;border-width:0 2px 2px 0;content:'';display:inline-block;padding:3px;transform:rotate(45deg);vertical-align:middle}"],
                     template: "<span class=\"mat-content\"><ng-content select=\"mat-panel-title\"></ng-content><ng-content select=\"mat-panel-description\"></ng-content><ng-content></ng-content></span><span [@indicatorRotate]=\"_getExpandedState()\" *ngIf=\"_showToggle()\" class=\"mat-expansion-indicator\"></span>",
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
@@ -17430,8 +17652,12 @@ var MatExpansionPanelHeader = /** @class */ (function () {
                         '[attr.aria-expanded]': '_isExpanded()',
                         '[attr.aria-disabled]': 'panel.disabled',
                         '[class.mat-expanded]': '_isExpanded()',
+                        '[class.mat-expansion-toggle-indicator-after]': "_getTogglePosition() === 'after'",
+                        '[class.mat-expansion-toggle-indicator-before]': "_getTogglePosition() === 'before'",
                         '(click)': '_toggle()',
                         '(keydown)': '_keydown($event)',
+                        '[@.disabled]': '_animationsDisabled',
+                        '(@expansionHeight.start)': '_animationStarted()',
                         '[@expansionHeight]': "{\n        value: _getExpandedState(),\n        params: {\n          collapsedHeight: collapsedHeight,\n          expandedHeight: expandedHeight\n        }\n    }",
                     },
                 },] },
@@ -17508,6 +17734,10 @@ var MatAccordion = /** @class */ (function (_super) {
          *     elevation.
          */
         _this.displayMode = 'default';
+        /**
+         * The position of the expansion indicator.
+         */
+        _this.togglePosition = 'after';
         return _this;
     }
     Object.defineProperty(MatAccordion.prototype, "hideToggle", {
@@ -17593,7 +17823,8 @@ var MatAccordion = /** @class */ (function (_super) {
     MatAccordion.propDecorators = {
         _headers: [{ type: core.ContentChildren, args: [MatExpansionPanelHeader, { descendants: true },] }],
         hideToggle: [{ type: core.Input }],
-        displayMode: [{ type: core.Input }]
+        displayMode: [{ type: core.Input }],
+        togglePosition: [{ type: core.Input }]
     };
     return MatAccordion;
 }(accordion.CdkAccordion));
@@ -20960,13 +21191,22 @@ var MatListOption = /** @class */ (function (_super) {
      */
     function () {
         var _this = this;
+        /** @type {?} */
+        var list = this.selectionList;
+        if (list._value && list._value.some((/**
+         * @param {?} value
+         * @return {?}
+         */
+        function (value) { return list.compareWith(value, _this._value); }))) {
+            this._setSelected(true);
+        }
+        /** @type {?} */
+        var wasSelected = this._selected;
         // List options that are selected at initialization can't be reported properly to the form
         // control. This is because it takes some time until the selection-list knows about all
         // available options. Also it can happen that the ControlValueAccessor has an initial value
         // that should be used instead. Deferring the value change report to the next tick ensures
         // that the form control value is not being overwritten.
-        /** @type {?} */
-        var wasSelected = this._selected;
         Promise.resolve().then((/**
          * @return {?}
          */
@@ -21174,8 +21414,8 @@ var MatListOption = /** @class */ (function (_super) {
                         // its theme. The accent theme palette is the default and doesn't need to be set.
                         '[class.mat-primary]': 'color === "primary"',
                         '[class.mat-warn]': 'color === "warn"',
-                        '[attr.aria-selected]': 'selected.toString()',
-                        '[attr.aria-disabled]': 'disabled.toString()',
+                        '[attr.aria-selected]': 'selected',
+                        '[attr.aria-disabled]': 'disabled',
                     },
                     template: "<div class=\"mat-list-item-content\" [class.mat-list-item-content-reverse]=\"checkboxPosition == 'after'\"><div mat-ripple class=\"mat-list-item-ripple\" [matRippleTrigger]=\"_getHostElement()\" [matRippleDisabled]=\"_isRippleDisabled()\"></div><mat-pseudo-checkbox [state]=\"selected ? 'checked' : 'unchecked'\" [disabled]=\"disabled\"></mat-pseudo-checkbox><div class=\"mat-list-text\" #text><ng-content></ng-content></div><ng-content select=\"[mat-list-avatar], [mat-list-icon], [matListAvatar], [matListIcon]\"></ng-content></div>",
                     encapsulation: core.ViewEncapsulation.None,
@@ -21224,6 +21464,17 @@ var MatSelectionList = /** @class */ (function (_super) {
          * Theme color of the selection list. This sets the checkbox color for all list options.
          */
         _this.color = 'accent';
+        /**
+         * Function used for comparing an option against the selected value when determining which
+         * options should appear as selected. The first argument is the value of an options. The second
+         * one is a value from the selected value. A boolean must be returned.
+         */
+        _this.compareWith = (/**
+         * @param {?} a1
+         * @param {?} a2
+         * @return {?}
+         */
+        function (a1, a2) { return a1 === a2; });
         _this._disabled = false;
         /**
          * The currently selected options.
@@ -21238,9 +21489,9 @@ var MatSelectionList = /** @class */ (function (_super) {
          */
         function (_) { });
         /**
-         * Subscription to sync value changes in the SelectionModel back to the SelectionList.
+         * Emits when the list has been destroyed.
          */
-        _this._modelChanges = rxjs.Subscription.EMPTY;
+        _this._destroyed = new rxjs.Subject();
         /**
          * View to model callback that should be called if the list or its options lost focus.
          */
@@ -21290,12 +21541,11 @@ var MatSelectionList = /** @class */ (function (_super) {
          */
         function () { return false; }))
             .withAllowedModifierKeys(['shiftKey']);
-        if (this._tempValues) {
-            this._setOptionsFromValues(this._tempValues);
-            this._tempValues = null;
+        if (this._value) {
+            this._setOptionsFromValues(this._value);
         }
         // Sync external changes to the model back to the options.
-        this._modelChanges = this.selectedOptions.onChange.subscribe((/**
+        this.selectedOptions.onChange.pipe(operators.takeUntil(this._destroyed)).subscribe((/**
          * @param {?} event
          * @return {?}
          */
@@ -21339,8 +21589,9 @@ var MatSelectionList = /** @class */ (function (_super) {
      * @return {?}
      */
     function () {
-        this._destroyed = true;
-        this._modelChanges.unsubscribe();
+        this._destroyed.next();
+        this._destroyed.complete();
+        this._isDestroyed = true;
     };
     /** Focuses the selection list. */
     /**
@@ -21487,8 +21738,11 @@ var MatSelectionList = /** @class */ (function (_super) {
         // Stop reporting value changes after the list has been destroyed. This avoids
         // cases where the list might wrongly reset its value once it is removed, but
         // the form control is still live.
-        if (this.options && !this._destroyed) {
-            this._onChange(this._getSelectedOptionValues());
+        if (this.options && !this._isDestroyed) {
+            /** @type {?} */
+            var value = this._getSelectedOptionValues();
+            this._onChange(value);
+            this._value = value;
         }
     };
     /** Emits a change event if the selected state of an option changed. */
@@ -21517,12 +21771,10 @@ var MatSelectionList = /** @class */ (function (_super) {
      * @return {?}
      */
     function (values) {
+        this._value = values;
         if (this.options) {
             this._setOptionsFromValues(values || []);
         }
-        else {
-            this._tempValues = values;
-        }
     };
     /** Implemented as a part of ControlValueAccessor. */
     /**
@@ -21599,10 +21851,7 @@ var MatSelectionList = /** @class */ (function (_super) {
             function (option) {
                 // Skip options that are already in the model. This allows us to handle cases
                 // where the same primitive value is selected multiple times.
-                if (option.selected) {
-                    return false;
-                }
-                return _this.compareWith ? _this.compareWith(option.value, value) : option.value === value;
+                return option.selected ? false : _this.compareWith(option.value, value);
             }));
             if (correspondingOption) {
                 correspondingOption._setSelected(true);
@@ -22313,13 +22562,9 @@ var _MatMenuBase = /** @class */ (function () {
         this._xPosition = this._defaultOptions.xPosition;
         this._yPosition = this._defaultOptions.yPosition;
         /**
-         * Menu items inside the current menu.
+         * Only the direct descendant menu items.
          */
-        this._items = [];
-        /**
-         * Emits whenever the amount of menu items changes.
-         */
-        this._itemChanges = new rxjs.Subject();
+        this._directDescendantItems = new core.QueryList();
         /**
          * Subscription to tab events on the menu panel
          */
@@ -22513,7 +22758,8 @@ var _MatMenuBase = /** @class */ (function () {
      */
     function () {
         var _this = this;
-        this._keyManager = new a11y.FocusKeyManager(this._items).withWrap().withTypeAhead();
+        this._updateDirectDescendants();
+        this._keyManager = new a11y.FocusKeyManager(this._directDescendantItems).withWrap().withTypeAhead();
         this._tabSubscription = this._keyManager.tabOut.subscribe((/**
          * @return {?}
          */
@@ -22526,6 +22772,7 @@ var _MatMenuBase = /** @class */ (function () {
      * @return {?}
      */
     function () {
+        this._directDescendantItems.destroy();
         this._tabSubscription.unsubscribe();
         this.closed.complete();
     };
@@ -22539,7 +22786,7 @@ var _MatMenuBase = /** @class */ (function () {
      * @return {?}
      */
     function () {
-        return this._itemChanges.pipe(operators.startWith(this._items), operators.switchMap((/**
+        return this._directDescendantItems.changes.pipe(operators.startWith(this._directDescendantItems), operators.switchMap((/**
          * @param {?} items
          * @return {?}
          */
@@ -22549,6 +22796,56 @@ var _MatMenuBase = /** @class */ (function () {
          */
         function (item) { return item._hovered; }))); })));
     };
+    /*
+     * Registers a menu item with the menu.
+     * @docs-private
+     * @deprecated No longer being used. To be removed.
+     * @breaking-change 9.0.0
+     */
+    /*
+       * Registers a menu item with the menu.
+       * @docs-private
+       * @deprecated No longer being used. To be removed.
+       * @breaking-change 9.0.0
+       */
+    /**
+     * @param {?} _item
+     * @return {?}
+     */
+    _MatMenuBase.prototype.addItem = /*
+       * Registers a menu item with the menu.
+       * @docs-private
+       * @deprecated No longer being used. To be removed.
+       * @breaking-change 9.0.0
+       */
+    /**
+     * @param {?} _item
+     * @return {?}
+     */
+    function (_item) { };
+    /**
+     * Removes an item from the menu.
+     * @docs-private
+     * @deprecated No longer being used. To be removed.
+     * @breaking-change 9.0.0
+     */
+    /**
+     * Removes an item from the menu.
+     * \@docs-private
+     * @deprecated No longer being used. To be removed.
+     * \@breaking-change 9.0.0
+     * @param {?} _item
+     * @return {?}
+     */
+    _MatMenuBase.prototype.removeItem = /**
+     * Removes an item from the menu.
+     * \@docs-private
+     * @deprecated No longer being used. To be removed.
+     * \@breaking-change 9.0.0
+     * @param {?} _item
+     * @return {?}
+     */
+    function (_item) { };
     /** Handle a keyboard event from the menu, delegating to the appropriate action. */
     /**
      * Handle a keyboard event from the menu, delegating to the appropriate action.
@@ -22567,7 +22864,10 @@ var _MatMenuBase = /** @class */ (function () {
         var manager = this._keyManager;
         switch (keyCode) {
             case keycodes.ESCAPE:
-                this.closed.emit('keydown');
+                if (!keycodes.hasModifierKey(event)) {
+                    event.preventDefault();
+                    this.closed.emit('keydown');
+                }
                 break;
             case keycodes.LEFT_ARROW:
                 if (this.parentMenu && this.direction === 'ltr') {
@@ -22672,57 +22972,6 @@ var _MatMenuBase = /** @class */ (function () {
             this._previousElevation = newElevation;
         }
     };
-    /**
-     * Registers a menu item with the menu.
-     * @docs-private
-     */
-    /**
-     * Registers a menu item with the menu.
-     * \@docs-private
-     * @param {?} item
-     * @return {?}
-     */
-    _MatMenuBase.prototype.addItem = /**
-     * Registers a menu item with the menu.
-     * \@docs-private
-     * @param {?} item
-     * @return {?}
-     */
-    function (item) {
-        // We register the items through this method, rather than picking them up through
-        // `ContentChildren`, because we need the items to be picked up by their closest
-        // `mat-menu` ancestor. If we used `@ContentChildren(MatMenuItem, {descendants: true})`,
-        // all descendant items will bleed into the top-level menu in the case where the consumer
-        // has `mat-menu` instances nested inside each other.
-        if (this._items.indexOf(item) === -1) {
-            this._items.push(item);
-            this._itemChanges.next(this._items);
-        }
-    };
-    /**
-     * Removes an item from the menu.
-     * @docs-private
-     */
-    /**
-     * Removes an item from the menu.
-     * \@docs-private
-     * @param {?} item
-     * @return {?}
-     */
-    _MatMenuBase.prototype.removeItem = /**
-     * Removes an item from the menu.
-     * \@docs-private
-     * @param {?} item
-     * @return {?}
-     */
-    function (item) {
-        /** @type {?} */
-        var index = this._items.indexOf(item);
-        if (this._items.indexOf(item) > -1) {
-            this._items.splice(index, 1);
-            this._itemChanges.next(this._items);
-        }
-    };
     /**
      * Adds classes to the menu panel based on its position. Can be used by
      * consumers to add specific styling based on the position.
@@ -22817,6 +23066,45 @@ var _MatMenuBase = /** @class */ (function () {
             event.element.scrollTop = 0;
         }
     };
+    /**
+     * Sets up a stream that will keep track of any newly-added menu items and will update the list
+     * of direct descendants. We collect the descendants this way, because `_allItems` can include
+     * items that are part of child menus, and using a custom way of registering items is unreliable
+     * when it comes to maintaining the item order.
+     */
+    /**
+     * Sets up a stream that will keep track of any newly-added menu items and will update the list
+     * of direct descendants. We collect the descendants this way, because `_allItems` can include
+     * items that are part of child menus, and using a custom way of registering items is unreliable
+     * when it comes to maintaining the item order.
+     * @private
+     * @return {?}
+     */
+    _MatMenuBase.prototype._updateDirectDescendants = /**
+     * Sets up a stream that will keep track of any newly-added menu items and will update the list
+     * of direct descendants. We collect the descendants this way, because `_allItems` can include
+     * items that are part of child menus, and using a custom way of registering items is unreliable
+     * when it comes to maintaining the item order.
+     * @private
+     * @return {?}
+     */
+    function () {
+        var _this = this;
+        this._allItems.changes
+            .pipe(operators.startWith(this._allItems))
+            .subscribe((/**
+         * @param {?} items
+         * @return {?}
+         */
+        function (items) {
+            _this._directDescendantItems.reset(items.filter((/**
+             * @param {?} item
+             * @return {?}
+             */
+            function (item) { return item._parentMenu === _this; })));
+            _this._directDescendantItems.notifyOnChanges();
+        }));
+    };
     /** @nocollapse */
     _MatMenuBase.ctorParameters = function () { return [
         { type: core.ElementRef },
@@ -22824,6 +23112,7 @@ var _MatMenuBase = /** @class */ (function () {
         { type: undefined, decorators: [{ type: core.Inject, args: [MAT_MENU_DEFAULT_OPTIONS,] }] }
     ]; };
     _MatMenuBase.propDecorators = {
+        _allItems: [{ type: core.ContentChildren, args: [MatMenuItem, { descendants: true },] }],
         backdropClass: [{ type: core.Input }],
         xPosition: [{ type: core.Input }],
         yPosition: [{ type: core.Input }],
@@ -22839,7 +23128,13 @@ var _MatMenuBase = /** @class */ (function () {
     };
     return _MatMenuBase;
 }());
-var MatMenu = /** @class */ (function (_super) {
+/**
+ * \@docs-private We show the "_MatMenu" class as "MatMenu" in the docs.
+ */
+var   /**
+ * \@docs-private We show the "_MatMenu" class as "MatMenu" in the docs.
+ */
+MatMenu = /** @class */ (function (_super) {
     __extends(MatMenu, _super);
     function MatMenu() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -22856,6 +23151,9 @@ var MatMenu = /** @class */ (function (_super) {
 // is used as a provider for DI and query purposes.
 // * _MatMenu - the actual menu component implementation with the Angular metadata that should
 // be tree shaken away for MDC.
+/**
+ * \@docs-public MatMenu
+ */
 var _MatMenu = /** @class */ (function (_super) {
     __extends(_MatMenu, _super);
     function _MatMenu(elementRef, ngZone, defaultOptions) {
@@ -23223,16 +23521,17 @@ var MatMenuTrigger = /** @class */ (function () {
                 function (event) { return event.toState === 'void'; })), operators.take(1), 
                 // Interrupt if the content got re-attached.
                 operators.takeUntil(menu.lazyContent._attached))
-                    .subscribe((/**
-                 * @return {?}
-                 */
-                function () { return (/** @type {?} */ (menu.lazyContent)).detach(); }), undefined, (/**
-                 * @return {?}
-                 */
-                function () {
+                    .subscribe({
+                    next: (/**
+                     * @return {?}
+                     */
+                    function () { return (/** @type {?} */ (menu.lazyContent)).detach(); }),
                     // No matter whether the content got re-attached, reset the menu.
-                    _this._resetMenu();
-                }));
+                    complete: (/**
+                     * @return {?}
+                     */
+                    function () { return _this._resetMenu(); })
+                });
             }
             else {
                 this._resetMenu();
@@ -26312,7 +26611,8 @@ var MatTooltip = /** @class */ (function () {
      * @return {?}
      */
     function (e) {
-        if (this._isTooltipVisible() && e.keyCode === keycodes.ESCAPE) {
+        if (this._isTooltipVisible() && e.keyCode === keycodes.ESCAPE && !keycodes.hasModifierKey(e)) {
+            e.preventDefault();
             e.stopPropagation();
             this.hide(0);
         }
@@ -27805,13 +28105,21 @@ var MatProgressSpinner = /** @class */ (function (_super) {
         var _this = _super.call(this, _elementRef) || this;
         _this._elementRef = _elementRef;
         _this._document = _document;
+        _this._diameter = BASE_SIZE;
         _this._value = 0;
         _this._fallbackAnimation = false;
-        _this._diameter = BASE_SIZE;
         /**
          * Mode of the progress circle
          */
         _this.mode = 'determinate';
+        /** @type {?} */
+        var trackedDiameters = MatProgressSpinner._diameters;
+        // The base size is already inserted via the component's structural styles. We still
+        // need to track it so we don't end up adding the same styles again.
+        if (!trackedDiameters.has(_document.head)) {
+            trackedDiameters.set(_document.head, new Set([BASE_SIZE]));
+        }
+        _this._styleRoot = _getShadowRoot(_elementRef.nativeElement, _document) || _document.head;
         _this._fallbackAnimation = platform$$1.EDGE || platform$$1.TRIDENT;
         _this._noopAnimations = animationMode === 'NoopAnimations' &&
             (!!defaults && !defaults._forceAnimations);
@@ -27843,8 +28151,14 @@ var MatProgressSpinner = /** @class */ (function (_super) {
          */
         function (size) {
             this._diameter = coercion.coerceNumberProperty(size);
-            if (!this._fallbackAnimation && !MatProgressSpinner._diameters.has(this._diameter)) {
-                this._attachStyleNode();
+            if (!this._fallbackAnimation) {
+                /** @type {?} */
+                var trackedDiameters = MatProgressSpinner._diameters;
+                /** @type {?} */
+                var diametersForElement = trackedDiameters.get(this._styleRoot);
+                if (!diametersForElement || !diametersForElement.has(this._diameter)) {
+                    this._attachStyleNode();
+                }
             }
         },
         enumerable: true,
@@ -27970,16 +28284,23 @@ var MatProgressSpinner = /** @class */ (function (_super) {
      */
     function () {
         /** @type {?} */
-        var styleTag = MatProgressSpinner._styleTag;
-        if (!styleTag) {
-            styleTag = this._document.createElement('style');
-            this._document.head.appendChild(styleTag);
-            MatProgressSpinner._styleTag = styleTag;
-        }
-        if (styleTag && styleTag.sheet) {
-            ((/** @type {?} */ (styleTag.sheet))).insertRule(this._getAnimationText(), 0);
+        var styleTag = this._document.createElement('style');
+        /** @type {?} */
+        var styleRoot = this._styleRoot;
+        /** @type {?} */
+        var currentDiameter = this._diameter;
+        /** @type {?} */
+        var diameters = MatProgressSpinner._diameters;
+        /** @type {?} */
+        var diametersForElement = diameters.get(styleRoot);
+        styleTag.setAttribute('mat-spinner-animation', currentDiameter + '');
+        styleTag.textContent = this._getAnimationText();
+        styleRoot.appendChild(styleTag);
+        if (!diametersForElement) {
+            diametersForElement = new Set();
+            diameters.set(styleRoot, diametersForElement);
         }
-        MatProgressSpinner._diameters.add(this.diameter);
+        diametersForElement.add(currentDiameter);
     };
     /** Generates animation styles adjusted for the spinner's diameter. */
     /**
@@ -28000,14 +28321,12 @@ var MatProgressSpinner = /** @class */ (function (_super) {
             .replace(/DIAMETER/g, "" + this.diameter);
     };
     /**
-     * Tracks diameters of existing instances to de-dupe generated styles (default d = 100)
-     */
-    MatProgressSpinner._diameters = new Set([BASE_SIZE]);
-    /**
-     * Used for storing all of the generated keyframe animations.
-     * \@dynamic
+     * Tracks diameters of existing instances to de-dupe generated styles (default d = 100).
+     * We need to keep track of which elements the diameters were attached to, because for
+     * elements in the Shadow DOM the style tags are attached to the shadow root, rather
+     * than the document head.
      */
-    MatProgressSpinner._styleTag = null;
+    MatProgressSpinner._diameters = new WeakMap();
     MatProgressSpinner.decorators = [
         { type: core.Component, args: [{selector: 'mat-progress-spinner',
                     exportAs: 'matProgressSpinner',
@@ -28085,6 +28404,31 @@ var MatSpinner = /** @class */ (function (_super) {
     ]; };
     return MatSpinner;
 }(MatProgressSpinner));
+/**
+ * Gets the shadow root of an element, if supported and the element is inside the Shadow DOM.
+ * @param {?} element
+ * @param {?} _document
+ * @return {?}
+ */
+function _getShadowRoot(element, _document) {
+    // TODO(crisbeto): see whether we should move this into the CDK
+    // feature detection utilities once #15616 gets merged in.
+    if (typeof window !== 'undefined') {
+        /** @type {?} */
+        var head = _document.head;
+        // Check whether the browser supports Shadow DOM.
+        if (head && (((/** @type {?} */ (head))).createShadowRoot || head.attachShadow)) {
+            /** @type {?} */
+            var rootNode = element.getRootNode ? element.getRootNode() : null;
+            // We need to take the `ShadowRoot` off of `window`, because the built-in types are
+            // incorrect. See https://github.com/Microsoft/TypeScript/issues/27929.
+            if (rootNode instanceof ((/** @type {?} */ (window))).ShadowRoot) {
+                return rootNode;
+            }
+        }
+    }
+    return null;
+}
 
 /**
  * @fileoverview added by tsickle
@@ -28114,6 +28458,19 @@ var MatProgressSpinnerModule = /** @class */ (function () {
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
+/** @type {?} */
+var MAT_RADIO_DEFAULT_OPTIONS = new core.InjectionToken('mat-radio-default-options', {
+    providedIn: 'root',
+    factory: MAT_RADIO_DEFAULT_OPTIONS_FACTORY
+});
+/**
+ * @return {?}
+ */
+function MAT_RADIO_DEFAULT_OPTIONS_FACTORY() {
+    return {
+        color: 'accent'
+    };
+}
 // Increasing integer for generating unique ids for radio components.
 /** @type {?} */
 var nextUniqueId$7 = 0;
@@ -28588,12 +28945,13 @@ var _MatRadioButtonMixinBase = mixinDisableRipple(mixinTabIndex(MatRadioButtonBa
  */
 var MatRadioButton = /** @class */ (function (_super) {
     __extends(MatRadioButton, _super);
-    function MatRadioButton(radioGroup, elementRef, _changeDetector, _focusMonitor, _radioDispatcher, _animationMode) {
+    function MatRadioButton(radioGroup, elementRef, _changeDetector, _focusMonitor, _radioDispatcher, _animationMode, _providerOverride) {
         var _this = _super.call(this, elementRef) || this;
         _this._changeDetector = _changeDetector;
         _this._focusMonitor = _focusMonitor;
         _this._radioDispatcher = _radioDispatcher;
         _this._animationMode = _animationMode;
+        _this._providerOverride = _providerOverride;
         _this._uniqueId = "mat-radio-" + ++nextUniqueId$7;
         /**
          * The unique ID for the radio button.
@@ -28767,7 +29125,9 @@ var MatRadioButton = /** @class */ (function (_super) {
          * @return {?}
          */
         function () {
-            return this._color || (this.radioGroup && this.radioGroup.color) || 'accent';
+            return this._color ||
+                (this.radioGroup && this.radioGroup.color) ||
+                this._providerOverride && this._providerOverride.color || 'accent';
         },
         set: /**
          * @param {?} newValue
@@ -28971,7 +29331,8 @@ var MatRadioButton = /** @class */ (function (_super) {
         { type: core.ChangeDetectorRef },
         { type: a11y.FocusMonitor },
         { type: collections.UniqueSelectionDispatcher },
-        { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] }
+        { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] },
+        { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [MAT_RADIO_DEFAULT_OPTIONS,] }] }
     ]; };
     MatRadioButton.propDecorators = {
         id: [{ type: core.Input }],
@@ -29204,7 +29565,9 @@ var MatDrawer = /** @class */ (function () {
              * @param {?} event
              * @return {?}
              */
-            function (event) { return event.keyCode === keycodes.ESCAPE && !_this.disableClose; })), operators.takeUntil(_this._destroyed)).subscribe((/**
+            function (event) {
+                return event.keyCode === keycodes.ESCAPE && !_this.disableClose && !keycodes.hasModifierKey(event);
+            })), operators.takeUntil(_this._destroyed)).subscribe((/**
              * @param {?} event
              * @return {?}
              */
@@ -29214,6 +29577,7 @@ var MatDrawer = /** @class */ (function () {
             function () {
                 _this.close();
                 event.stopPropagation();
+                event.preventDefault();
             })); }));
         }));
         // We need a Subject with distinctUntilChanged, because the `done` event
@@ -35601,10 +35965,11 @@ function _MAT_INK_BAR_POSITIONER_FACTORY() {
  * \@docs-private
  */
 var MatInkBar = /** @class */ (function () {
-    function MatInkBar(_elementRef, _ngZone, _inkBarPositioner) {
+    function MatInkBar(_elementRef, _ngZone, _inkBarPositioner, _animationMode) {
         this._elementRef = _elementRef;
         this._ngZone = _ngZone;
         this._inkBarPositioner = _inkBarPositioner;
+        this._animationMode = _animationMode;
     }
     /**
      * Calculates the styles from the provided element in order to align the ink-bar to that element.
@@ -35694,6 +36059,7 @@ var MatInkBar = /** @class */ (function () {
                     selector: 'mat-ink-bar',
                     host: {
                         'class': 'mat-ink-bar',
+                        '[class._mat-animation-noopable]': "_animationMode === 'NoopAnimations'",
                     },
                 },] },
     ];
@@ -35701,7 +36067,8 @@ var MatInkBar = /** @class */ (function () {
     MatInkBar.ctorParameters = function () { return [
         { type: core.ElementRef },
         { type: core.NgZone },
-        { type: undefined, decorators: [{ type: core.Inject, args: [_MAT_INK_BAR_POSITIONER,] }] }
+        { type: undefined, decorators: [{ type: core.Inject, args: [_MAT_INK_BAR_POSITIONER,] }] },
+        { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] }
     ]; };
     return MatInkBar;
 }());
@@ -36329,76 +36696,57 @@ var HEADER_SCROLL_DELAY = 650;
  * @type {?}
  */
 var HEADER_SCROLL_INTERVAL = 100;
-// Boilerplate for applying mixins to MatTabHeader.
-/**
- * \@docs-private
- */
-var 
-// Boilerplate for applying mixins to MatTabHeader.
-/**
- * \@docs-private
- */
-MatTabHeaderBase = /** @class */ (function () {
-    function MatTabHeaderBase() {
-    }
-    return MatTabHeaderBase;
-}());
-/** @type {?} */
-var _MatTabHeaderMixinBase = mixinDisableRipple(MatTabHeaderBase);
 /**
- * The header of the tab group which displays a list of all the tabs in the tab group. Includes
- * an ink bar that follows the currently selected tab. When the tabs list's width exceeds the
- * width of the header container, then arrows will be displayed to allow the user to scroll
- * left and right across the header.
- * \@docs-private
+ * Base class for a tab header that supported pagination.
+ * @abstract
  */
-var MatTabHeader = /** @class */ (function (_super) {
-    __extends(MatTabHeader, _super);
-    function MatTabHeader(_elementRef, _changeDetectorRef, _viewportRuler, _dir, _ngZone, _platform) {
-        var _this = _super.call(this) || this;
-        _this._elementRef = _elementRef;
-        _this._changeDetectorRef = _changeDetectorRef;
-        _this._viewportRuler = _viewportRuler;
-        _this._dir = _dir;
-        _this._ngZone = _ngZone;
-        _this._platform = _platform;
+var MatPaginatedTabHeader = /** @class */ (function () {
+    function MatPaginatedTabHeader(_elementRef, _changeDetectorRef, _viewportRuler, _dir, _ngZone, _platform, _animationMode) {
+        var _this = this;
+        this._elementRef = _elementRef;
+        this._changeDetectorRef = _changeDetectorRef;
+        this._viewportRuler = _viewportRuler;
+        this._dir = _dir;
+        this._ngZone = _ngZone;
+        this._platform = _platform;
+        this._animationMode = _animationMode;
         /**
          * The distance in pixels that the tab labels should be translated to the left.
          */
-        _this._scrollDistance = 0;
+        this._scrollDistance = 0;
         /**
          * Whether the header should scroll to the selected index after the view has been checked.
          */
-        _this._selectedIndexChanged = false;
+        this._selectedIndexChanged = false;
         /**
          * Emits when the component is destroyed.
          */
-        _this._destroyed = new rxjs.Subject();
+        this._destroyed = new rxjs.Subject();
         /**
          * Whether the controls for pagination should be displayed
          */
-        _this._showPaginationControls = false;
+        this._showPaginationControls = false;
         /**
          * Whether the tab list can be scrolled more towards the end of the tab label list.
          */
-        _this._disableScrollAfter = true;
+        this._disableScrollAfter = true;
         /**
          * Whether the tab list can be scrolled more towards the beginning of the tab label list.
          */
-        _this._disableScrollBefore = true;
+        this._disableScrollBefore = true;
         /**
          * Stream that will stop the automated scrolling.
          */
-        _this._stopScrolling = new rxjs.Subject();
-        _this._selectedIndex = 0;
+        this._stopScrolling = new rxjs.Subject();
+        this._selectedIndex = 0;
         /**
          * Event emitted when the option is selected.
          */
-        _this.selectFocusedIndex = new core.EventEmitter();
+        this.selectFocusedIndex = new core.EventEmitter();
         /**
          * Event emitted when a label is focused.
          */
-        _this.indexFocused = new core.EventEmitter();
+        this.indexFocused = new core.EventEmitter();
         // Bind the `mouseleave` event on the outside since it doesn't change anything in the view.
         _ngZone.runOutsideAngular((/**
          * @return {?}
@@ -36413,9 +36761,8 @@ var MatTabHeader = /** @class */ (function (_super) {
                 _this._stopInterval();
             }));
         }));
-        return _this;
     }
-    Object.defineProperty(MatTabHeader.prototype, "selectedIndex", {
+    Object.defineProperty(MatPaginatedTabHeader.prototype, "selectedIndex", {
         /** The index of the active tab. */
         get: /**
          * The index of the active tab.
@@ -36428,10 +36775,12 @@ var MatTabHeader = /** @class */ (function (_super) {
          */
         function (value) {
             value = coercion.coerceNumberProperty(value);
-            this._selectedIndexChanged = this._selectedIndex != value;
-            this._selectedIndex = value;
-            if (this._keyManager) {
-                this._keyManager.updateActiveItemIndex(value);
+            if (this._selectedIndex != value) {
+                this._selectedIndexChanged = true;
+                this._selectedIndex = value;
+                if (this._keyManager) {
+                    this._keyManager.updateActiveItemIndex(value);
+                }
             }
         },
         enumerable: true,
@@ -36440,76 +36789,33 @@ var MatTabHeader = /** @class */ (function (_super) {
     /**
      * @return {?}
      */
-    MatTabHeader.prototype.ngAfterContentChecked = /**
+    MatPaginatedTabHeader.prototype.ngAfterViewInit = /**
      * @return {?}
      */
     function () {
-        // If the number of tab labels have changed, check if scrolling should be enabled
-        if (this._tabLabelCount != this._labelWrappers.length) {
-            this.updatePagination();
-            this._tabLabelCount = this._labelWrappers.length;
-            this._changeDetectorRef.markForCheck();
-        }
-        // If the selected index has changed, scroll to the label and check if the scrolling controls
-        // should be disabled.
-        if (this._selectedIndexChanged) {
-            this._scrollToLabel(this._selectedIndex);
-            this._checkScrollingControls();
-            this._alignInkBarToSelectedTab();
-            this._selectedIndexChanged = false;
-            this._changeDetectorRef.markForCheck();
-        }
-        // If the scroll distance has been changed (tab selected, focused, scroll controls activated),
-        // then translate the header to reflect this.
-        if (this._scrollDistanceChanged) {
-            this._updateTabScrollPosition();
-            this._scrollDistanceChanged = false;
-            this._changeDetectorRef.markForCheck();
-        }
-    };
-    /** Handles keyboard events on the header. */
-    /**
-     * Handles keyboard events on the header.
-     * @param {?} event
-     * @return {?}
-     */
-    MatTabHeader.prototype._handleKeydown = /**
-     * Handles keyboard events on the header.
-     * @param {?} event
-     * @return {?}
-     */
-    function (event) {
-        // We don't handle any key bindings with a modifier key.
-        if (keycodes.hasModifierKey(event)) {
-            return;
-        }
-        switch (event.keyCode) {
-            case keycodes.HOME:
-                this._keyManager.setFirstItemActive();
-                event.preventDefault();
-                break;
-            case keycodes.END:
-                this._keyManager.setLastItemActive();
-                event.preventDefault();
-                break;
-            case keycodes.ENTER:
-            case keycodes.SPACE:
-                this.selectFocusedIndex.emit(this.focusIndex);
-                event.preventDefault();
-                break;
-            default:
-                this._keyManager.onKeydown(event);
-        }
+        var _this = this;
+        // We need to handle these events manually, because we want to bind passive event listeners.
+        rxjs.fromEvent(this._previousPaginator.nativeElement, 'touchstart', passiveEventListenerOptions$1)
+            .pipe(operators.takeUntil(this._destroyed))
+            .subscribe((/**
+         * @return {?}
+         */
+        function () {
+            _this._handlePaginatorPress('before');
+        }));
+        rxjs.fromEvent(this._nextPaginator.nativeElement, 'touchstart', passiveEventListenerOptions$1)
+            .pipe(operators.takeUntil(this._destroyed))
+            .subscribe((/**
+         * @return {?}
+         */
+        function () {
+            _this._handlePaginatorPress('after');
+        }));
     };
     /**
-     * Aligns the ink bar to the selected tab on load.
-     */
-    /**
-     * Aligns the ink bar to the selected tab on load.
      * @return {?}
      */
-    MatTabHeader.prototype.ngAfterContentInit = /**
-     * Aligns the ink bar to the selected tab on load.
+    MatPaginatedTabHeader.prototype.ngAfterContentInit = /**
      * @return {?}
      */
     function () {
@@ -36526,7 +36832,7 @@ var MatTabHeader = /** @class */ (function (_super) {
             _this.updatePagination();
             _this._alignInkBarToSelectedTab();
         });
-        this._keyManager = new a11y.FocusKeyManager(this._labelWrappers)
+        this._keyManager = new a11y.FocusKeyManager(this._items)
             .withHorizontalOrientation(this._getLayoutDirection())
             .withWrap();
         this._keyManager.updateActiveItem(0);
@@ -36535,7 +36841,7 @@ var MatTabHeader = /** @class */ (function (_super) {
         typeof requestAnimationFrame !== 'undefined' ? requestAnimationFrame(realign) : realign();
         // On dir change or window resize, realign the ink bar and update the orientation of
         // the key manager if the direction has changed.
-        rxjs.merge(dirChange, resize).pipe(operators.takeUntil(this._destroyed)).subscribe((/**
+        rxjs.merge(dirChange, resize, this._items.changes).pipe(operators.takeUntil(this._destroyed)).subscribe((/**
          * @return {?}
          */
         function () {
@@ -36557,33 +36863,37 @@ var MatTabHeader = /** @class */ (function (_super) {
     /**
      * @return {?}
      */
-    MatTabHeader.prototype.ngAfterViewInit = /**
+    MatPaginatedTabHeader.prototype.ngAfterContentChecked = /**
      * @return {?}
      */
     function () {
-        var _this = this;
-        // We need to handle these events manually, because we want to bind passive event listeners.
-        rxjs.fromEvent(this._previousPaginator.nativeElement, 'touchstart', passiveEventListenerOptions$1)
-            .pipe(operators.takeUntil(this._destroyed))
-            .subscribe((/**
-         * @return {?}
-         */
-        function () {
-            _this._handlePaginatorPress('before');
-        }));
-        rxjs.fromEvent(this._nextPaginator.nativeElement, 'touchstart', passiveEventListenerOptions$1)
-            .pipe(operators.takeUntil(this._destroyed))
-            .subscribe((/**
-         * @return {?}
-         */
-        function () {
-            _this._handlePaginatorPress('after');
-        }));
+        // If the number of tab labels have changed, check if scrolling should be enabled
+        if (this._tabLabelCount != this._items.length) {
+            this.updatePagination();
+            this._tabLabelCount = this._items.length;
+            this._changeDetectorRef.markForCheck();
+        }
+        // If the selected index has changed, scroll to the label and check if the scrolling controls
+        // should be disabled.
+        if (this._selectedIndexChanged) {
+            this._scrollToLabel(this._selectedIndex);
+            this._checkScrollingControls();
+            this._alignInkBarToSelectedTab();
+            this._selectedIndexChanged = false;
+            this._changeDetectorRef.markForCheck();
+        }
+        // If the scroll distance has been changed (tab selected, focused, scroll controls activated),
+        // then translate the header to reflect this.
+        if (this._scrollDistanceChanged) {
+            this._updateTabScrollPosition();
+            this._scrollDistanceChanged = false;
+            this._changeDetectorRef.markForCheck();
+        }
     };
     /**
      * @return {?}
      */
-    MatTabHeader.prototype.ngOnDestroy = /**
+    MatPaginatedTabHeader.prototype.ngOnDestroy = /**
      * @return {?}
      */
     function () {
@@ -36591,6 +36901,40 @@ var MatTabHeader = /** @class */ (function (_super) {
         this._destroyed.complete();
         this._stopScrolling.complete();
     };
+    /** Handles keyboard events on the header. */
+    /**
+     * Handles keyboard events on the header.
+     * @param {?} event
+     * @return {?}
+     */
+    MatPaginatedTabHeader.prototype._handleKeydown = /**
+     * Handles keyboard events on the header.
+     * @param {?} event
+     * @return {?}
+     */
+    function (event) {
+        // We don't handle any key bindings with a modifier key.
+        if (keycodes.hasModifierKey(event)) {
+            return;
+        }
+        switch (event.keyCode) {
+            case keycodes.HOME:
+                this._keyManager.setFirstItemActive();
+                event.preventDefault();
+                break;
+            case keycodes.END:
+                this._keyManager.setLastItemActive();
+                event.preventDefault();
+                break;
+            case keycodes.ENTER:
+            case keycodes.SPACE:
+                this.selectFocusedIndex.emit(this.focusIndex);
+                this._itemSelected(event);
+                break;
+            default:
+                this._keyManager.onKeydown(event);
+        }
+    };
     /**
      * Callback for when the MutationObserver detects that the content has changed.
      */
@@ -36598,7 +36942,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * Callback for when the MutationObserver detects that the content has changed.
      * @return {?}
      */
-    MatTabHeader.prototype._onContentChanges = /**
+    MatPaginatedTabHeader.prototype._onContentChanges = /**
      * Callback for when the MutationObserver detects that the content has changed.
      * @return {?}
      */
@@ -36610,7 +36954,7 @@ var MatTabHeader = /** @class */ (function (_super) {
         // will fire even if the text content didn't change which is inefficient and is prone
         // to infinite loops if a poorly constructed expression is passed in (see #14249).
         if (textContent !== this._currentTextContent) {
-            this._currentTextContent = textContent;
+            this._currentTextContent = textContent || '';
             // The content observer runs outside the `NgZone` by default, which
             // means that we need to bring the callback back in ourselves.
             this._ngZone.run((/**
@@ -36626,22 +36970,22 @@ var MatTabHeader = /** @class */ (function (_super) {
     /**
      * Updates the view whether pagination should be enabled or not.
      *
-     * WARNING: Calling this method can be very costly in terms of performance.  It should be called
+     * WARNING: Calling this method can be very costly in terms of performance. It should be called
      * as infrequently as possible from outside of the Tabs component as it causes a reflow of the
      * page.
      */
     /**
      * Updates the view whether pagination should be enabled or not.
      *
-     * WARNING: Calling this method can be very costly in terms of performance.  It should be called
+     * WARNING: Calling this method can be very costly in terms of performance. It should be called
      * as infrequently as possible from outside of the Tabs component as it causes a reflow of the
      * page.
      * @return {?}
      */
-    MatTabHeader.prototype.updatePagination = /**
+    MatPaginatedTabHeader.prototype.updatePagination = /**
      * Updates the view whether pagination should be enabled or not.
      *
-     * WARNING: Calling this method can be very costly in terms of performance.  It should be called
+     * WARNING: Calling this method can be very costly in terms of performance. It should be called
      * as infrequently as possible from outside of the Tabs component as it causes a reflow of the
      * page.
      * @return {?}
@@ -36651,7 +36995,7 @@ var MatTabHeader = /** @class */ (function (_super) {
         this._checkScrollingControls();
         this._updateTabScrollPosition();
     };
-    Object.defineProperty(MatTabHeader.prototype, "focusIndex", {
+    Object.defineProperty(MatPaginatedTabHeader.prototype, "focusIndex", {
         /** Tracks which element has focus; used for keyboard navigation */
         get: /**
          * Tracks which element has focus; used for keyboard navigation
@@ -36685,18 +37029,18 @@ var MatTabHeader = /** @class */ (function (_super) {
      * @param {?} index
      * @return {?}
      */
-    MatTabHeader.prototype._isValidIndex = /**
+    MatPaginatedTabHeader.prototype._isValidIndex = /**
      * Determines if an index is valid.  If the tabs are not ready yet, we assume that the user is
      * providing a valid index and return true.
      * @param {?} index
      * @return {?}
      */
     function (index) {
-        if (!this._labelWrappers) {
+        if (!this._items) {
             return true;
         }
         /** @type {?} */
-        var tab = this._labelWrappers ? this._labelWrappers.toArray()[index] : null;
+        var tab = this._items ? this._items.toArray()[index] : null;
         return !!tab && !tab.disabled;
     };
     /**
@@ -36709,7 +37053,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * @param {?} tabIndex
      * @return {?}
      */
-    MatTabHeader.prototype._setTabFocus = /**
+    MatPaginatedTabHeader.prototype._setTabFocus = /**
      * Sets focus on the HTML element for the label wrapper and scrolls it into the view if
      * scrolling is enabled.
      * @param {?} tabIndex
@@ -36719,8 +37063,8 @@ var MatTabHeader = /** @class */ (function (_super) {
         if (this._showPaginationControls) {
             this._scrollToLabel(tabIndex);
         }
-        if (this._labelWrappers && this._labelWrappers.length) {
-            this._labelWrappers.toArray()[tabIndex].focus();
+        if (this._items && this._items.length) {
+            this._items.toArray()[tabIndex].focus();
             // Do not let the browser manage scrolling to focus the element, this will be handled
             // by using translation. In LTR, the scroll left should be 0. In RTL, the scroll width
             // should be the full width minus the offset width.
@@ -36741,7 +37085,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * The layout direction of the containing app.
      * @return {?}
      */
-    MatTabHeader.prototype._getLayoutDirection = /**
+    MatPaginatedTabHeader.prototype._getLayoutDirection = /**
      * The layout direction of the containing app.
      * @return {?}
      */
@@ -36753,7 +37097,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * Performs the CSS transformation on the tab list that will cause the list to scroll.
      * @return {?}
      */
-    MatTabHeader.prototype._updateTabScrollPosition = /**
+    MatPaginatedTabHeader.prototype._updateTabScrollPosition = /**
      * Performs the CSS transformation on the tab list that will cause the list to scroll.
      * @return {?}
      */
@@ -36775,11 +37119,12 @@ var MatTabHeader = /** @class */ (function (_super) {
         // position to be thrown off in some cases. We have to reset it ourselves to ensure that
         // it doesn't get thrown off. Note that we scope it only to IE and Edge, because messing
         // with the scroll position throws off Chrome 71+ in RTL mode (see #14689).
-        if (platform$$1.TRIDENT || platform$$1.EDGE) {
+        // @breaking-change 9.0.0 Remove null check for `platform` after it can no longer be undefined.
+        if (platform$$1 && (platform$$1.TRIDENT || platform$$1.EDGE)) {
             this._tabListContainer.nativeElement.scrollLeft = 0;
         }
     };
-    Object.defineProperty(MatTabHeader.prototype, "scrollDistance", {
+    Object.defineProperty(MatPaginatedTabHeader.prototype, "scrollDistance", {
         /** Sets the distance in pixels that the tab header should be transformed in the X-axis. */
         get: /**
          * Sets the distance in pixels that the tab header should be transformed in the X-axis.
@@ -36814,7 +37159,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * @param {?} direction
      * @return {?}
      */
-    MatTabHeader.prototype._scrollHeader = /**
+    MatPaginatedTabHeader.prototype._scrollHeader = /**
      * Moves the tab list in the 'before' or 'after' direction (towards the beginning of the list or
      * the end of the list, respectively). The distance to scroll is computed to be a third of the
      * length of the tab list view window.
@@ -36838,7 +37183,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * @param {?} direction
      * @return {?}
      */
-    MatTabHeader.prototype._handlePaginatorClick = /**
+    MatPaginatedTabHeader.prototype._handlePaginatorClick = /**
      * Handles click events on the pagination arrows.
      * @param {?} direction
      * @return {?}
@@ -36861,7 +37206,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * @param {?} labelIndex
      * @return {?}
      */
-    MatTabHeader.prototype._scrollToLabel = /**
+    MatPaginatedTabHeader.prototype._scrollToLabel = /**
      * Moves the tab list such that the desired tab label (marked by index) is moved into view.
      *
      * This is an expensive call that forces a layout reflow to compute box and scroll metrics and
@@ -36871,24 +37216,25 @@ var MatTabHeader = /** @class */ (function (_super) {
      */
     function (labelIndex) {
         /** @type {?} */
-        var selectedLabel = this._labelWrappers ? this._labelWrappers.toArray()[labelIndex] : null;
+        var selectedLabel = this._items ? this._items.toArray()[labelIndex] : null;
         if (!selectedLabel) {
             return;
         }
         // The view length is the visible width of the tab labels.
         /** @type {?} */
         var viewLength = this._tabListContainer.nativeElement.offsetWidth;
+        var _a = selectedLabel.elementRef.nativeElement, offsetLeft = _a.offsetLeft, offsetWidth = _a.offsetWidth;
         /** @type {?} */
         var labelBeforePos;
         /** @type {?} */
         var labelAfterPos;
         if (this._getLayoutDirection() == 'ltr') {
-            labelBeforePos = selectedLabel.getOffsetLeft();
-            labelAfterPos = labelBeforePos + selectedLabel.getOffsetWidth();
+            labelBeforePos = offsetLeft;
+            labelAfterPos = labelBeforePos + offsetWidth;
         }
         else {
-            labelAfterPos = this._tabList.nativeElement.offsetWidth - selectedLabel.getOffsetLeft();
-            labelBeforePos = labelAfterPos - selectedLabel.getOffsetWidth();
+            labelAfterPos = this._tabList.nativeElement.offsetWidth - offsetLeft;
+            labelBeforePos = labelAfterPos - offsetWidth;
         }
         /** @type {?} */
         var beforeVisiblePos = this.scrollDistance;
@@ -36920,7 +37266,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * should be called sparingly.
      * @return {?}
      */
-    MatTabHeader.prototype._checkPaginationEnabled = /**
+    MatPaginatedTabHeader.prototype._checkPaginationEnabled = /**
      * Evaluate whether the pagination controls should be displayed. If the scroll width of the
      * tab list is wider than the size of the header container, then the pagination controls should
      * be shown.
@@ -36959,7 +37305,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * should be called sparingly.
      * @return {?}
      */
-    MatTabHeader.prototype._checkScrollingControls = /**
+    MatPaginatedTabHeader.prototype._checkScrollingControls = /**
      * Evaluate whether the before and after controls should be enabled or disabled.
      * If the header is at the beginning of the list (scroll distance is equal to 0) then disable the
      * before button. If the header is at the end of the list (scroll distance is equal to the
@@ -36990,7 +37336,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * should be called sparingly.
      * @return {?}
      */
-    MatTabHeader.prototype._getMaxScrollDistance = /**
+    MatPaginatedTabHeader.prototype._getMaxScrollDistance = /**
      * Determines what is the maximum length in pixels that can be set for the scroll distance. This
      * is equal to the difference in width between the tab list container and tab header container.
      *
@@ -37010,23 +37356,29 @@ var MatTabHeader = /** @class */ (function (_super) {
      * Tells the ink-bar to align itself to the current label wrapper
      * @return {?}
      */
-    MatTabHeader.prototype._alignInkBarToSelectedTab = /**
+    MatPaginatedTabHeader.prototype._alignInkBarToSelectedTab = /**
      * Tells the ink-bar to align itself to the current label wrapper
      * @return {?}
      */
     function () {
         /** @type {?} */
-        var selectedLabelWrapper = this._labelWrappers && this._labelWrappers.length ?
-            this._labelWrappers.toArray()[this.selectedIndex].elementRef.nativeElement :
-            null;
-        this._inkBar.alignToElement((/** @type {?} */ (selectedLabelWrapper)));
+        var selectedItem = this._items && this._items.length ?
+            this._items.toArray()[this.selectedIndex] : null;
+        /** @type {?} */
+        var selectedLabelWrapper = selectedItem ? selectedItem.elementRef.nativeElement : null;
+        if (selectedLabelWrapper) {
+            this._inkBar.alignToElement(selectedLabelWrapper);
+        }
+        else {
+            this._inkBar.hide();
+        }
     };
     /** Stops the currently-running paginator interval.  */
     /**
      * Stops the currently-running paginator interval.
      * @return {?}
      */
-    MatTabHeader.prototype._stopInterval = /**
+    MatPaginatedTabHeader.prototype._stopInterval = /**
      * Stops the currently-running paginator interval.
      * @return {?}
      */
@@ -37044,7 +37396,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * @param {?} direction In which direction the paginator should be scrolled.
      * @return {?}
      */
-    MatTabHeader.prototype._handlePaginatorPress = /**
+    MatPaginatedTabHeader.prototype._handlePaginatorPress = /**
      * Handles the user pressing down on one of the paginators.
      * Starts scrolling the header after a certain amount of time.
      * @param {?} direction In which direction the paginator should be scrolled.
@@ -37080,7 +37432,7 @@ var MatTabHeader = /** @class */ (function (_super) {
      * @param {?} position Position to which to scroll.
      * @return {?} Information on the current scroll distance and the maximum.
      */
-    MatTabHeader.prototype._scrollTo = /**
+    MatPaginatedTabHeader.prototype._scrollTo = /**
      * Scrolls the header to a given position.
      * @private
      * @param {?} position Position to which to scroll.
@@ -37096,11 +37448,73 @@ var MatTabHeader = /** @class */ (function (_super) {
         this._checkScrollingControls();
         return { maxScrollDistance: maxScrollDistance, distance: this._scrollDistance };
     };
+    /** @nocollapse */
+    MatPaginatedTabHeader.ctorParameters = function () { return [
+        { type: core.ElementRef },
+        { type: core.ChangeDetectorRef },
+        { type: scrolling.ViewportRuler },
+        { type: bidi.Directionality, decorators: [{ type: core.Optional }] },
+        { type: core.NgZone },
+        { type: platform.Platform },
+        { type: String }
+    ]; };
+    return MatPaginatedTabHeader;
+}());
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * The header of the tab group which displays a list of all the tabs in the tab group. Includes
+ * an ink bar that follows the currently selected tab. When the tabs list's width exceeds the
+ * width of the header container, then arrows will be displayed to allow the user to scroll
+ * left and right across the header.
+ * \@docs-private
+ */
+var MatTabHeader = /** @class */ (function (_super) {
+    __extends(MatTabHeader, _super);
+    function MatTabHeader(elementRef, changeDetectorRef, viewportRuler, dir, ngZone, platform$$1, 
+    // @breaking-change 9.0.0 `_animationMode` parameter to be made required.
+    animationMode) {
+        var _this = _super.call(this, elementRef, changeDetectorRef, viewportRuler, dir, ngZone, platform$$1, animationMode) || this;
+        _this._disableRipple = false;
+        return _this;
+    }
+    Object.defineProperty(MatTabHeader.prototype, "disableRipple", {
+        /** Whether the ripple effect is disabled or not. */
+        get: /**
+         * Whether the ripple effect is disabled or not.
+         * @return {?}
+         */
+        function () { return this._disableRipple; },
+        set: /**
+         * @param {?} value
+         * @return {?}
+         */
+        function (value) { this._disableRipple = coercion.coerceBooleanProperty(value); },
+        enumerable: true,
+        configurable: true
+    });
+    /**
+     * @protected
+     * @param {?} event
+     * @return {?}
+     */
+    MatTabHeader.prototype._itemSelected = /**
+     * @protected
+     * @param {?} event
+     * @return {?}
+     */
+    function (event) {
+        event.preventDefault();
+    };
     MatTabHeader.decorators = [
         { type: core.Component, args: [{selector: 'mat-tab-header',
-                    template: "<div class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\" #previousPaginator aria-hidden=\"true\" mat-ripple [matRippleDisabled]=\"_disableScrollBefore || disableRipple\" [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\" (click)=\"_handlePaginatorClick('before')\" (mousedown)=\"_handlePaginatorPress('before')\" (touchend)=\"_stopInterval()\"><div class=\"mat-tab-header-pagination-chevron\"></div></div><div class=\"mat-tab-label-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\"><div class=\"mat-tab-list\" #tabList role=\"tablist\" (cdkObserveContent)=\"_onContentChanges()\"><div class=\"mat-tab-labels\"><ng-content></ng-content></div><mat-ink-bar></mat-ink-bar></div></div><div class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\" #nextPaginator aria-hidden=\"true\" mat-ripple [matRippleDisabled]=\"_disableScrollAfter || disableRipple\" [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\" (mousedown)=\"_handlePaginatorPress('after')\" (click)=\"_handlePaginatorClick('after')\" (touchend)=\"_stopInterval()\"><div class=\"mat-tab-header-pagination-chevron\"></div></div>",
-                    styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:0}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}@media (-ms-high-contrast:active){.mat-tab-label:focus{outline:dotted 2px}}.mat-tab-label.mat-tab-disabled{cursor:default}@media (-ms-high-contrast:active){.mat-tab-label.mat-tab-disabled{opacity:.5}}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}@media (-ms-high-contrast:active){.mat-tab-label{opacity:1}}@media (max-width:599px){.mat-tab-label{min-width:72px}}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:.5s cubic-bezier(.35,0,.25,1)}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}@media (-ms-high-contrast:active){.mat-ink-bar{outline:solid 2px;height:0}}.mat-tab-header-pagination{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none}.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{display:flex}.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{padding-left:4px}.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-tab-header-pagination-after,.mat-tab-header-rtl .mat-tab-header-pagination-before{padding-right:4px}.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;content:'';height:8px;width:8px}.mat-tab-header-pagination-disabled{box-shadow:none;cursor:default}.mat-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}.mat-tab-list{flex-grow:1;position:relative;transition:transform .5s cubic-bezier(.35,0,.25,1)}.mat-tab-labels{display:flex}[mat-align-tabs=center] .mat-tab-labels{justify-content:center}[mat-align-tabs=end] .mat-tab-labels{justify-content:flex-end}"],
-                    inputs: ['disableRipple'],
+                    template: "<div class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\" #previousPaginator aria-hidden=\"true\" mat-ripple [matRippleDisabled]=\"_disableScrollBefore || disableRipple\" [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\" (click)=\"_handlePaginatorClick('before')\" (mousedown)=\"_handlePaginatorPress('before')\" (touchend)=\"_stopInterval()\"><div class=\"mat-tab-header-pagination-chevron\"></div></div><div class=\"mat-tab-label-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\"><div #tabList class=\"mat-tab-list\" [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\" role=\"tablist\" (cdkObserveContent)=\"_onContentChanges()\"><div class=\"mat-tab-labels\"><ng-content></ng-content></div><mat-ink-bar></mat-ink-bar></div></div><div class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\" #nextPaginator aria-hidden=\"true\" mat-ripple [matRippleDisabled]=\"_disableScrollAfter || disableRipple\" [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\" (mousedown)=\"_handlePaginatorPress('after')\" (click)=\"_handlePaginatorClick('after')\" (touchend)=\"_stopInterval()\"><div class=\"mat-tab-header-pagination-chevron\"></div></div>",
+                    styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-header-pagination{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none}.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{display:flex}.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{padding-left:4px}.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-tab-header-pagination-after,.mat-tab-header-rtl .mat-tab-header-pagination-before{padding-right:4px}.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;content:'';height:8px;width:8px}.mat-tab-header-pagination-disabled{box-shadow:none;cursor:default}.mat-tab-list{flex-grow:1;position:relative;transition:transform .5s cubic-bezier(.35,0,.25,1)}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:.5s cubic-bezier(.35,0,.25,1)}._mat-animation-noopable.mat-ink-bar{transition:none;animation:none}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}@media (-ms-high-contrast:active){.mat-ink-bar{outline:solid 2px;height:0}}.mat-tab-labels{display:flex}[mat-align-tabs=center] .mat-tab-labels{justify-content:center}[mat-align-tabs=end] .mat-tab-labels{justify-content:flex-end}.mat-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}._mat-animation-noopable.mat-tab-list{transition:none;animation:none}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:0}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}@media (-ms-high-contrast:active){.mat-tab-label:focus{outline:dotted 2px}}.mat-tab-label.mat-tab-disabled{cursor:default}@media (-ms-high-contrast:active){.mat-tab-label.mat-tab-disabled{opacity:.5}}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}@media (-ms-high-contrast:active){.mat-tab-label{opacity:1}}@media (max-width:599px){.mat-tab-label{min-width:72px}}"],
+                    inputs: ['selectedIndex'],
+                    outputs: ['selectFocusedIndex', 'indexFocused'],
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     host: {
@@ -37117,21 +37531,20 @@ var MatTabHeader = /** @class */ (function (_super) {
         { type: scrolling.ViewportRuler },
         { type: bidi.Directionality, decorators: [{ type: core.Optional }] },
         { type: core.NgZone },
-        { type: platform.Platform }
+        { type: platform.Platform },
+        { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] }
     ]; };
     MatTabHeader.propDecorators = {
-        _labelWrappers: [{ type: core.ContentChildren, args: [MatTabLabelWrapper,] }],
+        _items: [{ type: core.ContentChildren, args: [MatTabLabelWrapper,] }],
         _inkBar: [{ type: core.ViewChild, args: [MatInkBar, { static: true },] }],
         _tabListContainer: [{ type: core.ViewChild, args: ['tabListContainer', { static: true },] }],
         _tabList: [{ type: core.ViewChild, args: ['tabList', { static: true },] }],
         _nextPaginator: [{ type: core.ViewChild, args: ['nextPaginator', { static: false },] }],
         _previousPaginator: [{ type: core.ViewChild, args: ['previousPaginator', { static: false },] }],
-        selectedIndex: [{ type: core.Input }],
-        selectFocusedIndex: [{ type: core.Output }],
-        indexFocused: [{ type: core.Output }]
+        disableRipple: [{ type: core.Input }]
     };
     return MatTabHeader;
-}(_MatTabHeaderMixinBase));
+}(MatPaginatedTabHeader));
 
 /**
  * @fileoverview added by tsickle
@@ -37182,9 +37595,10 @@ var _MatTabGroupMixinBase = mixinColor(mixinDisableRipple(MatTabGroupBase), 'pri
  */
 var MatTabGroup = /** @class */ (function (_super) {
     __extends(MatTabGroup, _super);
-    function MatTabGroup(elementRef, _changeDetectorRef, defaultConfig) {
+    function MatTabGroup(elementRef, _changeDetectorRef, defaultConfig, _animationMode) {
         var _this = _super.call(this, elementRef) || this;
         _this._changeDetectorRef = _changeDetectorRef;
+        _this._animationMode = _animationMode;
         /**
          * The tab index that should be selected after the content has been checked.
          */
@@ -37630,8 +38044,8 @@ var MatTabGroup = /** @class */ (function (_super) {
     MatTabGroup.decorators = [
         { type: core.Component, args: [{selector: 'mat-tab-group',
                     exportAs: 'matTabGroup',
-                    template: "<mat-tab-header #tabHeader [selectedIndex]=\"selectedIndex\" [disableRipple]=\"disableRipple\" (indexFocused)=\"_focusChanged($event)\" (selectFocusedIndex)=\"selectedIndex = $event\"><div class=\"mat-tab-label\" role=\"tab\" matTabLabelWrapper mat-ripple cdkMonitorElementFocus *ngFor=\"let tab of _tabs; let i = index\" [id]=\"_getTabLabelId(i)\" [attr.tabIndex]=\"_getTabIndex(tab, i)\" [attr.aria-posinset]=\"i + 1\" [attr.aria-setsize]=\"_tabs.length\" [attr.aria-controls]=\"_getTabContentId(i)\" [attr.aria-selected]=\"selectedIndex == i\" [attr.aria-label]=\"tab.ariaLabel || null\" [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\" [class.mat-tab-label-active]=\"selectedIndex == i\" [disabled]=\"tab.disabled\" [matRippleDisabled]=\"tab.disabled || disableRipple\" (click)=\"_handleClick(tab, tabHeader, i)\"><div class=\"mat-tab-label-content\"><ng-template [ngIf]=\"tab.templateLabel\"><ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template></ng-template><ng-template [ngIf]=\"!tab.templateLabel\">{{tab.textLabel}}</ng-template></div></div></mat-tab-header><div class=\"mat-tab-body-wrapper\" #tabBodyWrapper><mat-tab-body role=\"tabpanel\" *ngFor=\"let tab of _tabs; let i = index\" [id]=\"_getTabContentId(i)\" [attr.aria-labelledby]=\"_getTabLabelId(i)\" [class.mat-tab-body-active]=\"selectedIndex == i\" [content]=\"tab.content\" [position]=\"tab.position\" [origin]=\"tab.origin\" [animationDuration]=\"animationDuration\" (_onCentered)=\"_removeTabBodyWrapperHeight()\" (_onCentering)=\"_setTabBodyWrapperHeight($event)\"></mat-tab-body></div>",
-                    styles: [".mat-tab-group{display:flex;flex-direction:column}.mat-tab-group.mat-tab-group-inverted-header{flex-direction:column-reverse}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:0}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}@media (-ms-high-contrast:active){.mat-tab-label:focus{outline:dotted 2px}}.mat-tab-label.mat-tab-disabled{cursor:default}@media (-ms-high-contrast:active){.mat-tab-label.mat-tab-disabled{opacity:.5}}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}@media (-ms-high-contrast:active){.mat-tab-label{opacity:1}}@media (max-width:599px){.mat-tab-label{padding:0 12px}}@media (max-width:959px){.mat-tab-label{padding:0 12px}}.mat-tab-group[mat-stretch-tabs]>.mat-tab-header .mat-tab-label{flex-basis:0;flex-grow:1}.mat-tab-body-wrapper{position:relative;overflow:hidden;display:flex;transition:height .5s cubic-bezier(.35,0,.25,1)}.mat-tab-body{top:0;left:0;right:0;bottom:0;position:absolute;display:block;overflow:hidden;flex-basis:100%}.mat-tab-body.mat-tab-body-active{position:relative;overflow-x:hidden;overflow-y:auto;z-index:1;flex-grow:1}.mat-tab-group.mat-tab-group-dynamic-height .mat-tab-body.mat-tab-body-active{overflow-y:hidden}"],
+                    template: "<mat-tab-header #tabHeader [selectedIndex]=\"selectedIndex\" [disableRipple]=\"disableRipple\" (indexFocused)=\"_focusChanged($event)\" (selectFocusedIndex)=\"selectedIndex = $event\"><div class=\"mat-tab-label\" role=\"tab\" matTabLabelWrapper mat-ripple cdkMonitorElementFocus *ngFor=\"let tab of _tabs; let i = index\" [id]=\"_getTabLabelId(i)\" [attr.tabIndex]=\"_getTabIndex(tab, i)\" [attr.aria-posinset]=\"i + 1\" [attr.aria-setsize]=\"_tabs.length\" [attr.aria-controls]=\"_getTabContentId(i)\" [attr.aria-selected]=\"selectedIndex == i\" [attr.aria-label]=\"tab.ariaLabel || null\" [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\" [class.mat-tab-label-active]=\"selectedIndex == i\" [disabled]=\"tab.disabled\" [matRippleDisabled]=\"tab.disabled || disableRipple\" (click)=\"_handleClick(tab, tabHeader, i)\"><div class=\"mat-tab-label-content\"><ng-template [ngIf]=\"tab.templateLabel\"><ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template></ng-template><ng-template [ngIf]=\"!tab.templateLabel\">{{tab.textLabel}}</ng-template></div></div></mat-tab-header><div class=\"mat-tab-body-wrapper\" [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\" #tabBodyWrapper><mat-tab-body role=\"tabpanel\" *ngFor=\"let tab of _tabs; let i = index\" [id]=\"_getTabContentId(i)\" [attr.aria-labelledby]=\"_getTabLabelId(i)\" [class.mat-tab-body-active]=\"selectedIndex == i\" [content]=\"tab.content\" [position]=\"tab.position\" [origin]=\"tab.origin\" [animationDuration]=\"animationDuration\" (_onCentered)=\"_removeTabBodyWrapperHeight()\" (_onCentering)=\"_setTabBodyWrapperHeight($event)\"></mat-tab-body></div>",
+                    styles: [".mat-tab-group{display:flex;flex-direction:column}.mat-tab-group.mat-tab-group-inverted-header{flex-direction:column-reverse}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:0}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}@media (-ms-high-contrast:active){.mat-tab-label:focus{outline:dotted 2px}}.mat-tab-label.mat-tab-disabled{cursor:default}@media (-ms-high-contrast:active){.mat-tab-label.mat-tab-disabled{opacity:.5}}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}@media (-ms-high-contrast:active){.mat-tab-label{opacity:1}}@media (max-width:599px){.mat-tab-label{padding:0 12px}}@media (max-width:959px){.mat-tab-label{padding:0 12px}}.mat-tab-group[mat-stretch-tabs]>.mat-tab-header .mat-tab-label{flex-basis:0;flex-grow:1}.mat-tab-body-wrapper{position:relative;overflow:hidden;display:flex;transition:height .5s cubic-bezier(.35,0,.25,1)}._mat-animation-noopable.mat-tab-body-wrapper{transition:none;animation:none}.mat-tab-body{top:0;left:0;right:0;bottom:0;position:absolute;display:block;overflow:hidden;flex-basis:100%}.mat-tab-body.mat-tab-body-active{position:relative;overflow-x:hidden;overflow-y:auto;z-index:1;flex-grow:1}.mat-tab-group.mat-tab-group-dynamic-height .mat-tab-body.mat-tab-body-active{overflow-y:hidden}"],
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     inputs: ['color', 'disableRipple'],
@@ -37646,7 +38060,8 @@ var MatTabGroup = /** @class */ (function (_super) {
     MatTabGroup.ctorParameters = function () { return [
         { type: core.ElementRef },
         { type: core.ChangeDetectorRef },
-        { type: undefined, decorators: [{ type: core.Inject, args: [MAT_TABS_CONFIG,] }, { type: core.Optional }] }
+        { type: undefined, decorators: [{ type: core.Inject, args: [MAT_TABS_CONFIG,] }, { type: core.Optional }] },
+        { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] }
     ]; };
     MatTabGroup.propDecorators = {
         _tabs: [{ type: core.ContentChildren, args: [MatTab,] }],
@@ -37669,39 +38084,23 @@ var MatTabGroup = /** @class */ (function (_super) {
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-// Boilerplate for applying mixins to MatTabNav.
-/**
- * \@docs-private
- */
-var 
-// Boilerplate for applying mixins to MatTabNav.
-/**
- * \@docs-private
- */
-MatTabNavBase = /** @class */ (function () {
-    function MatTabNavBase(_elementRef) {
-        this._elementRef = _elementRef;
-    }
-    return MatTabNavBase;
-}());
-/** @type {?} */
-var _MatTabNavMixinBase = mixinDisableRipple(mixinColor(MatTabNavBase, 'primary'));
 /**
  * Navigation component matching the styles of the tab group header.
  * Provides anchored navigation with animated ink bar.
  */
 var MatTabNav = /** @class */ (function (_super) {
     __extends(MatTabNav, _super);
-    function MatTabNav(elementRef, _dir, _ngZone, _changeDetectorRef, _viewportRuler) {
-        var _this = _super.call(this, elementRef) || this;
-        _this._dir = _dir;
-        _this._ngZone = _ngZone;
-        _this._changeDetectorRef = _changeDetectorRef;
-        _this._viewportRuler = _viewportRuler;
+    function MatTabNav(elementRef, dir, ngZone, changeDetectorRef, viewportRuler, 
+    /**
+     * @deprecated @breaking-change 9.0.0 `platform` parameter to become required.
+     */
+    platform$$1, animationMode) {
+        var _this = _super.call(this, elementRef, changeDetectorRef, viewportRuler, dir, ngZone, platform$$1, animationMode) || this;
+        _this._disableRipple = false;
         /**
-         * Subject that emits when the component has been destroyed.
+         * Theme color of the nav bar.
          */
-        _this._onDestroy = new rxjs.Subject();
+        _this.color = 'primary';
         return _this;
     }
     Object.defineProperty(MatTabNav.prototype, "backgroundColor", {
@@ -37717,117 +38116,99 @@ var MatTabNav = /** @class */ (function (_super) {
          */
         function (value) {
             /** @type {?} */
-            var nativeElement = this._elementRef.nativeElement;
-            nativeElement.classList.remove("mat-background-" + this.backgroundColor);
+            var classList = this._elementRef.nativeElement.classList;
+            classList.remove("mat-background-" + this.backgroundColor);
             if (value) {
-                nativeElement.classList.add("mat-background-" + value);
+                classList.add("mat-background-" + value);
             }
             this._backgroundColor = value;
         },
         enumerable: true,
         configurable: true
     });
-    /**
-     * Notifies the component that the active link has been changed.
-     * @breaking-change 8.0.0 `element` parameter to be removed.
-     */
-    /**
-     * Notifies the component that the active link has been changed.
-     * \@breaking-change 8.0.0 `element` parameter to be removed.
-     * @param {?} element
-     * @return {?}
-     */
-    MatTabNav.prototype.updateActiveLink = /**
-     * Notifies the component that the active link has been changed.
-     * \@breaking-change 8.0.0 `element` parameter to be removed.
-     * @param {?} element
-     * @return {?}
-     */
-    function (element) {
-        // Note: keeping the `element` for backwards-compat, but isn't being used for anything.
-        // @breaking-change 8.0.0
-        this._activeLinkChanged = !!element;
-        this._changeDetectorRef.markForCheck();
-    };
-    /**
-     * @return {?}
-     */
-    MatTabNav.prototype.ngAfterContentInit = /**
-     * @return {?}
-     */
-    function () {
-        var _this = this;
-        this._ngZone.runOutsideAngular((/**
+    Object.defineProperty(MatTabNav.prototype, "disableRipple", {
+        /** Whether the ripple effect is disabled or not. */
+        get: /**
+         * Whether the ripple effect is disabled or not.
          * @return {?}
          */
-        function () {
-            /** @type {?} */
-            var dirChange = _this._dir ? _this._dir.change : rxjs.of(null);
-            return rxjs.merge(dirChange, _this._viewportRuler.change(10))
-                .pipe(operators.takeUntil(_this._onDestroy))
-                .subscribe((/**
-             * @return {?}
-             */
-            function () { return _this._alignInkBar(); }));
-        }));
-    };
-    /** Checks if the active link has been changed and, if so, will update the ink bar. */
+        function () { return this._disableRipple; },
+        set: /**
+         * @param {?} value
+         * @return {?}
+         */
+        function (value) { this._disableRipple = coercion.coerceBooleanProperty(value); },
+        enumerable: true,
+        configurable: true
+    });
     /**
-     * Checks if the active link has been changed and, if so, will update the ink bar.
+     * @protected
      * @return {?}
      */
-    MatTabNav.prototype.ngAfterContentChecked = /**
-     * Checks if the active link has been changed and, if so, will update the ink bar.
+    MatTabNav.prototype._itemSelected = /**
+     * @protected
      * @return {?}
      */
     function () {
-        if (this._activeLinkChanged) {
-            /** @type {?} */
-            var activeTab = this._tabLinks.find((/**
-             * @param {?} tab
-             * @return {?}
-             */
-            function (tab) { return tab.active; }));
-            this._activeLinkElement = activeTab ? activeTab._elementRef : null;
-            this._alignInkBar();
-            this._activeLinkChanged = false;
-        }
+        // noop
     };
     /**
      * @return {?}
      */
-    MatTabNav.prototype.ngOnDestroy = /**
+    MatTabNav.prototype.ngAfterContentInit = /**
      * @return {?}
      */
     function () {
-        this._onDestroy.next();
-        this._onDestroy.complete();
+        this.updateActiveLink();
+        _super.prototype.ngAfterContentInit.call(this);
     };
-    /** Aligns the ink bar to the active link. */
     /**
-     * Aligns the ink bar to the active link.
+     * Notifies the component that the active link has been changed.
+     * @breaking-change 8.0.0 `element` parameter to be removed.
+     */
+    /**
+     * Notifies the component that the active link has been changed.
+     * \@breaking-change 8.0.0 `element` parameter to be removed.
+     * @param {?=} _element
      * @return {?}
      */
-    MatTabNav.prototype._alignInkBar = /**
-     * Aligns the ink bar to the active link.
+    MatTabNav.prototype.updateActiveLink = /**
+     * Notifies the component that the active link has been changed.
+     * \@breaking-change 8.0.0 `element` parameter to be removed.
+     * @param {?=} _element
      * @return {?}
      */
-    function () {
-        if (this._activeLinkElement) {
-            this._inkBar.show();
-            this._inkBar.alignToElement(this._activeLinkElement.nativeElement);
+    function (_element) {
+        if (!this._items) {
+            return;
         }
-        else {
-            this._inkBar.hide();
+        /** @type {?} */
+        var items = this._items.toArray();
+        for (var i = 0; i < items.length; i++) {
+            if (items[i].active) {
+                this.selectedIndex = i;
+                this._changeDetectorRef.markForCheck();
+                return;
+            }
         }
+        // The ink bar should hide itself if no items are active.
+        this.selectedIndex = -1;
+        this._inkBar.hide();
     };
     MatTabNav.decorators = [
         { type: core.Component, args: [{selector: '[mat-tab-nav-bar]',
                     exportAs: 'matTabNavBar, matTabNav',
-                    inputs: ['color', 'disableRipple'],
-                    template: "<div class=\"mat-tab-links\" (cdkObserveContent)=\"_alignInkBar()\"><ng-content></ng-content><mat-ink-bar></mat-ink-bar></div>",
-                    styles: [".mat-tab-nav-bar{overflow:hidden;position:relative;flex-shrink:0}.mat-tab-links{position:relative;display:flex}[mat-align-tabs=center] .mat-tab-links{justify-content:center}[mat-align-tabs=end] .mat-tab-links{justify-content:flex-end}.mat-tab-link{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;vertical-align:top;text-decoration:none;position:relative;overflow:hidden;-webkit-tap-highlight-color:transparent}.mat-tab-link:focus{outline:0}.mat-tab-link:focus:not(.mat-tab-disabled){opacity:1}@media (-ms-high-contrast:active){.mat-tab-link:focus{outline:dotted 2px}}.mat-tab-link.mat-tab-disabled{cursor:default}@media (-ms-high-contrast:active){.mat-tab-link.mat-tab-disabled{opacity:.5}}.mat-tab-link .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}@media (-ms-high-contrast:active){.mat-tab-link{opacity:1}}[mat-stretch-tabs] .mat-tab-link{flex-basis:0;flex-grow:1}.mat-tab-link.mat-tab-disabled{pointer-events:none}@media (max-width:599px){.mat-tab-link{min-width:72px}}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:.5s cubic-bezier(.35,0,.25,1)}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}@media (-ms-high-contrast:active){.mat-ink-bar{outline:solid 2px;height:0}}"],
-                    host: { 'class': 'mat-tab-nav-bar' },
+                    inputs: ['color'],
+                    template: "<div class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\" #previousPaginator aria-hidden=\"true\" mat-ripple [matRippleDisabled]=\"_disableScrollBefore || disableRipple\" [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\" (click)=\"_handlePaginatorClick('before')\" (mousedown)=\"_handlePaginatorPress('before')\" (touchend)=\"_stopInterval()\"><div class=\"mat-tab-header-pagination-chevron\"></div></div><div class=\"mat-tab-link-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\"><div class=\"mat-tab-list\" #tabList (cdkObserveContent)=\"_onContentChanges()\"><div class=\"mat-tab-links\"><ng-content></ng-content></div><mat-ink-bar></mat-ink-bar></div></div><div class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\" #nextPaginator aria-hidden=\"true\" mat-ripple [matRippleDisabled]=\"_disableScrollAfter || disableRipple\" [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\" (mousedown)=\"_handlePaginatorPress('after')\" (click)=\"_handlePaginatorClick('after')\" (touchend)=\"_stopInterval()\"><div class=\"mat-tab-header-pagination-chevron\"></div></div>",
+                    styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-header-pagination{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none}.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{display:flex}.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{padding-left:4px}.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-tab-header-pagination-after,.mat-tab-header-rtl .mat-tab-header-pagination-before{padding-right:4px}.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;content:'';height:8px;width:8px}.mat-tab-header-pagination-disabled{box-shadow:none;cursor:default}.mat-tab-list{flex-grow:1;position:relative;transition:transform .5s cubic-bezier(.35,0,.25,1)}.mat-tab-links{display:flex}[mat-align-tabs=center] .mat-tab-links{justify-content:center}[mat-align-tabs=end] .mat-tab-links{justify-content:flex-end}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:.5s cubic-bezier(.35,0,.25,1)}._mat-animation-noopable.mat-ink-bar{transition:none;animation:none}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}@media (-ms-high-contrast:active){.mat-ink-bar{outline:solid 2px;height:0}}.mat-tab-link-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}.mat-tab-link{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;vertical-align:top;text-decoration:none;position:relative;overflow:hidden;-webkit-tap-highlight-color:transparent}.mat-tab-link:focus{outline:0}.mat-tab-link:focus:not(.mat-tab-disabled){opacity:1}@media (-ms-high-contrast:active){.mat-tab-link:focus{outline:dotted 2px}}.mat-tab-link.mat-tab-disabled{cursor:default}@media (-ms-high-contrast:active){.mat-tab-link.mat-tab-disabled{opacity:.5}}.mat-tab-link .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}@media (-ms-high-contrast:active){.mat-tab-link{opacity:1}}[mat-stretch-tabs] .mat-tab-link{flex-basis:0;flex-grow:1}.mat-tab-link.mat-tab-disabled{pointer-events:none}@media (max-width:599px){.mat-tab-link{min-width:72px}}"],
+                    host: {
+                        'class': 'mat-tab-nav-bar mat-tab-header',
+                        '[class.mat-tab-header-pagination-controls-enabled]': '_showPaginationControls',
+                        '[class.mat-tab-header-rtl]': "_getLayoutDirection() == 'rtl'",
+                        '[class.mat-primary]': 'color !== "warn" && color !== "accent"',
+                        '[class.mat-accent]': 'color === "accent"',
+                        '[class.mat-warn]': 'color === "warn"',
+                    },
                     encapsulation: core.ViewEncapsulation.None,
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                 },] },
@@ -37838,18 +38219,26 @@ var MatTabNav = /** @class */ (function (_super) {
         { type: bidi.Directionality, decorators: [{ type: core.Optional }] },
         { type: core.NgZone },
         { type: core.ChangeDetectorRef },
-        { type: scrolling.ViewportRuler }
+        { type: scrolling.ViewportRuler },
+        { type: platform.Platform, decorators: [{ type: core.Optional }] },
+        { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] }
     ]; };
     MatTabNav.propDecorators = {
-        _inkBar: [{ type: core.ViewChild, args: [MatInkBar, { static: true },] }],
-        _tabLinks: [{ type: core.ContentChildren, args: [core.forwardRef((/**
+        _items: [{ type: core.ContentChildren, args: [core.forwardRef((/**
                      * @return {?}
                      */
                     function () { return MatTabLink; })), { descendants: true },] }],
-        backgroundColor: [{ type: core.Input }]
+        _inkBar: [{ type: core.ViewChild, args: [MatInkBar, { static: true },] }],
+        _tabListContainer: [{ type: core.ViewChild, args: ['tabListContainer', { static: true },] }],
+        _tabList: [{ type: core.ViewChild, args: ['tabList', { static: true },] }],
+        _nextPaginator: [{ type: core.ViewChild, args: ['nextPaginator', { static: false },] }],
+        _previousPaginator: [{ type: core.ViewChild, args: ['previousPaginator', { static: false },] }],
+        backgroundColor: [{ type: core.Input }],
+        disableRipple: [{ type: core.Input }],
+        color: [{ type: core.Input }]
     };
     return MatTabNav;
-}(_MatTabNavMixinBase));
+}(MatPaginatedTabHeader));
 // Boilerplate for applying mixins to MatTabLink.
 var 
 // Boilerplate for applying mixins to MatTabLink.
@@ -37865,20 +38254,23 @@ var _MatTabLinkMixinBase = mixinTabIndex(mixinDisableRipple(mixinDisabled(MatTab
  */
 var MatTabLink = /** @class */ (function (_super) {
     __extends(MatTabLink, _super);
-    function MatTabLink(_tabNavBar, _elementRef, ngZone, platform$$1, globalRippleOptions, tabIndex, _focusMonitor) {
+    function MatTabLink(_tabNavBar, elementRef, ngZone, platform$$1, globalRippleOptions, tabIndex, _focusMonitor, animationMode) {
         var _this = _super.call(this) || this;
         _this._tabNavBar = _tabNavBar;
-        _this._elementRef = _elementRef;
+        _this.elementRef = elementRef;
         _this._focusMonitor = _focusMonitor;
         /**
          * Whether the tab link is active or not.
          */
         _this._isActive = false;
-        _this._tabLinkRipple = new RippleRenderer(_this, ngZone, _elementRef, platform$$1);
-        _this._tabLinkRipple.setupTriggerEvents(_elementRef.nativeElement);
+        _this._tabLinkRipple = new RippleRenderer(_this, ngZone, elementRef, platform$$1);
+        _this._tabLinkRipple.setupTriggerEvents(elementRef.nativeElement);
         _this.rippleConfig = globalRippleOptions || {};
         _this.tabIndex = parseInt(tabIndex) || 0;
-        _focusMonitor.monitor(_elementRef);
+        if (animationMode === 'NoopAnimations') {
+            _this.rippleConfig.animation = { enterDuration: 0, exitDuration: 0 };
+        }
+        _focusMonitor.monitor(elementRef);
         return _this;
     }
     Object.defineProperty(MatTabLink.prototype, "active", {
@@ -37895,7 +38287,7 @@ var MatTabLink = /** @class */ (function (_super) {
         function (value) {
             if (value !== this._isActive) {
                 this._isActive = value;
-                this._tabNavBar.updateActiveLink(this._elementRef);
+                this._tabNavBar.updateActiveLink(this.elementRef);
             }
         },
         enumerable: true,
@@ -37918,6 +38310,15 @@ var MatTabLink = /** @class */ (function (_super) {
         enumerable: true,
         configurable: true
     });
+    /**
+     * @return {?}
+     */
+    MatTabLink.prototype.focus = /**
+     * @return {?}
+     */
+    function () {
+        this.elementRef.nativeElement.focus();
+    };
     /**
      * @return {?}
      */
@@ -37926,7 +38327,7 @@ var MatTabLink = /** @class */ (function (_super) {
      */
     function () {
         this._tabLinkRipple._removeTriggerEvents();
-        this._focusMonitor.stopMonitoring(this._elementRef);
+        this._focusMonitor.stopMonitoring(this.elementRef);
     };
     MatTabLink.decorators = [
         { type: core.Directive, args: [{
@@ -37936,7 +38337,7 @@ var MatTabLink = /** @class */ (function (_super) {
                     host: {
                         'class': 'mat-tab-link',
                         '[attr.aria-current]': 'active',
-                        '[attr.aria-disabled]': 'disabled.toString()',
+                        '[attr.aria-disabled]': 'disabled',
                         '[attr.tabIndex]': 'tabIndex',
                         '[class.mat-tab-disabled]': 'disabled',
                         '[class.mat-tab-label-active]': 'active',
@@ -37951,7 +38352,8 @@ var MatTabLink = /** @class */ (function (_super) {
         { type: platform.Platform },
         { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [MAT_RIPPLE_GLOBAL_OPTIONS,] }] },
         { type: String, decorators: [{ type: core.Attribute, args: ['tabindex',] }] },
-        { type: a11y.FocusMonitor }
+        { type: a11y.FocusMonitor },
+        { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] }
     ]; };
     MatTabLink.propDecorators = {
         active: [{ type: core.Input }]
@@ -38901,7 +39303,7 @@ exports.MatChipRemove = MatChipRemove;
 exports.MatChipInput = MatChipInput;
 exports.MAT_CHIPS_DEFAULT_OPTIONS = MAT_CHIPS_DEFAULT_OPTIONS;
 exports.ɵa1 = MATERIAL_SANITY_CHECKS_FACTORY;
-exports.VERSION = VERSION;
+exports.VERSION = VERSION$1;
 exports.AnimationCurves = AnimationCurves;
 exports.AnimationDurations = AnimationDurations;
 exports.MatCommonModule = MatCommonModule;
@@ -38958,6 +39360,9 @@ exports.SEP = SEP;
 exports.OCT = OCT;
 exports.NOV = NOV;
 exports.DEC = DEC;
+exports.MatMultiYearView = MatMultiYearView;
+exports.yearsPerPage = yearsPerPage;
+exports.yearsPerRow = yearsPerRow;
 exports.MatDatepickerModule = MatDatepickerModule;
 exports.MatCalendarHeader = MatCalendarHeader;
 exports.MatCalendar = MatCalendar;
@@ -38978,9 +39383,6 @@ exports.MatDatepickerToggleIcon = MatDatepickerToggleIcon;
 exports.MatDatepickerToggle = MatDatepickerToggle;
 exports.MatMonthView = MatMonthView;
 exports.MatYearView = MatYearView;
-exports.yearsPerPage = yearsPerPage;
-exports.yearsPerRow = yearsPerRow;
-exports.MatMultiYearView = MatMultiYearView;
 exports.MatDialogModule = MatDialogModule;
 exports.MAT_DIALOG_SCROLL_STRATEGY_FACTORY = MAT_DIALOG_SCROLL_STRATEGY_FACTORY;
 exports.MAT_DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY = MAT_DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY;
@@ -39026,7 +39428,7 @@ exports.MatPrefix = MatPrefix;
 exports.MatSuffix = MatSuffix;
 exports.MatLabel = MatLabel;
 exports.matFormFieldAnimations = matFormFieldAnimations;
-exports.ɵa11 = MAT_GRID_LIST;
+exports.ɵa4 = MAT_GRID_LIST;
 exports.MatGridListModule = MatGridListModule;
 exports.MatGridList = MatGridList;
 exports.MatGridTile = MatGridTile;
@@ -39061,9 +39463,9 @@ exports.MAT_SELECTION_LIST_VALUE_ACCESSOR = MAT_SELECTION_LIST_VALUE_ACCESSOR;
 exports.MatSelectionListChange = MatSelectionListChange;
 exports.MatListOption = MatListOption;
 exports.MatSelectionList = MatSelectionList;
-exports.ɵa24 = MAT_MENU_DEFAULT_OPTIONS_FACTORY;
-exports.ɵb24 = MAT_MENU_SCROLL_STRATEGY_FACTORY;
-exports.ɵc24 = MAT_MENU_SCROLL_STRATEGY_FACTORY_PROVIDER;
+exports.ɵa23 = MAT_MENU_DEFAULT_OPTIONS_FACTORY;
+exports.ɵb23 = MAT_MENU_SCROLL_STRATEGY_FACTORY;
+exports.ɵc23 = MAT_MENU_SCROLL_STRATEGY_FACTORY_PROVIDER;
 exports.MatMenu = MatMenu;
 exports.MAT_MENU_DEFAULT_OPTIONS = MAT_MENU_DEFAULT_OPTIONS;
 exports._MatMenu = _MatMenu;
@@ -39088,12 +39490,14 @@ exports.MatProgressBarModule = MatProgressBarModule;
 exports.MAT_PROGRESS_BAR_LOCATION_FACTORY = MAT_PROGRESS_BAR_LOCATION_FACTORY;
 exports.MAT_PROGRESS_BAR_LOCATION = MAT_PROGRESS_BAR_LOCATION;
 exports.MatProgressBar = MatProgressBar;
-exports.MatProgressSpinnerModule = MatProgressSpinnerModule;
-exports.MAT_PROGRESS_SPINNER_DEFAULT_OPTIONS_FACTORY = MAT_PROGRESS_SPINNER_DEFAULT_OPTIONS_FACTORY;
-exports.MAT_PROGRESS_SPINNER_DEFAULT_OPTIONS = MAT_PROGRESS_SPINNER_DEFAULT_OPTIONS;
 exports.MatProgressSpinner = MatProgressSpinner;
 exports.MatSpinner = MatSpinner;
+exports.MAT_PROGRESS_SPINNER_DEFAULT_OPTIONS = MAT_PROGRESS_SPINNER_DEFAULT_OPTIONS;
+exports.MAT_PROGRESS_SPINNER_DEFAULT_OPTIONS_FACTORY = MAT_PROGRESS_SPINNER_DEFAULT_OPTIONS_FACTORY;
+exports.MatProgressSpinnerModule = MatProgressSpinnerModule;
 exports.MatRadioModule = MatRadioModule;
+exports.MAT_RADIO_DEFAULT_OPTIONS_FACTORY = MAT_RADIO_DEFAULT_OPTIONS_FACTORY;
+exports.MAT_RADIO_DEFAULT_OPTIONS = MAT_RADIO_DEFAULT_OPTIONS;
 exports.MAT_RADIO_GROUP_CONTROL_VALUE_ACCESSOR = MAT_RADIO_GROUP_CONTROL_VALUE_ACCESSOR;
 exports.MatRadioChange = MatRadioChange;
 exports.MatRadioGroup = MatRadioGroup;
@@ -39181,7 +39585,8 @@ exports.MatFooterRow = MatFooterRow;
 exports.MatRow = MatRow;
 exports.MatTableDataSource = MatTableDataSource;
 exports.MatTextColumn = MatTextColumn;
-exports.ɵa22 = _MAT_INK_BAR_POSITIONER_FACTORY;
+exports.ɵa24 = _MAT_INK_BAR_POSITIONER_FACTORY;
+exports.ɵb24 = MatPaginatedTabHeader;
 exports.MatInkBar = MatInkBar;
 exports._MAT_INK_BAR_POSITIONER = _MAT_INK_BAR_POSITIONER;
 exports.MatTabBody = MatTabBody;