@angular/material-experimental 13.2.3 → 13.2.6

package/fesm2020/mdc-tooltip.mjs

@@ -1,8 +1,9 @@
 import * as i0 from '@angular/core';
-import { Directive, Inject, Optional, Component, ViewEncapsulation, ChangeDetectionStrategy, NgModule } from '@angular/core';
+import { Directive, Inject, Optional, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, NgModule } from '@angular/core';
 import * as i5 from '@angular/common';
 import { DOCUMENT, CommonModule } from '@angular/common';
 import * as i2 from '@angular/cdk/platform';
+import { ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations';
 import * as i3 from '@angular/cdk/a11y';
 import { A11yModule } from '@angular/cdk/a11y';
 import * as i4 from '@angular/cdk/bidi';
@@ -15,29 +16,6 @@ import { trigger, state, style, transition, animate } from '@angular/animations'
 import { CdkScrollableModule } from '@angular/cdk/scrolling';
 import { MatCommonModule } from '@angular/material-experimental/mdc-core';
 
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * Animations used by MatTooltip.
- * @docs-private
- */
-const matTooltipAnimations = {
-    /** Animation that transitions a tooltip in and out. */
-    tooltipState: trigger('state', [
-        // TODO(crisbeto): these values are based on MDC's CSS.
-        // We should be able to use their styles directly once we land #19432.
-        state('initial, void, hidden', style({ opacity: 0, transform: 'scale(0.8)' })),
-        state('visible', style({ transform: 'scale(1)' })),
-        transition('* => visible', animate('150ms cubic-bezier(0, 0, 0.2, 1)')),
-        transition('* => hidden', animate('75ms cubic-bezier(0.4, 0, 1, 1)')),
-    ]),
-};
-
 /**
  * @license
  * Copyright Google LLC All Rights Reserved.
@@ -112,14 +90,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0", ngImpor
  * @docs-private
  */
 class TooltipComponent extends _TooltipComponentBase {
-    constructor(changeDetectorRef, _elementRef) {
-        super(changeDetectorRef);
+    constructor(changeDetectorRef, _elementRef, animationMode) {
+        super(changeDetectorRef, animationMode);
         this._elementRef = _elementRef;
         /* Whether the tooltip text overflows to multiple lines */
         this._isMultiline = false;
+        this._showAnimation = 'mat-mdc-tooltip-show';
+        this._hideAnimation = 'mat-mdc-tooltip-hide';
     }
     _onShow() {
         this._isMultiline = this._isTooltipMultiline();
+        this._markForCheck();
     }
     /** Whether the tooltip text has overflown to the next line */
     _isTooltipMultiline() {
@@ -127,17 +108,53 @@ class TooltipComponent extends _TooltipComponentBase {
         return rect.height > numbers.MIN_HEIGHT && rect.width >= numbers.MAX_WIDTH;
     }
 }
-TooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0", ngImport: i0, type: TooltipComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-TooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.0", type: TooltipComponent, selector: "mat-tooltip-component", host: { attributes: { "aria-hidden": "true" }, properties: { "style.zoom": "_visibility === \"visible\" ? 1 : null" } }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"mdc-tooltip mdc-tooltip--shown mat-mdc-tooltip\"\n  [ngClass]=\"tooltipClass\"\n  [class.mdc-tooltip--multiline]=\"_isMultiline\"\n  [@state]=\"_visibility\"\n  (@state.start)=\"_animationStart()\"\n  (@state.done)=\"_animationDone($event)\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">{{message}}</div>\n</div>\n", styles: [".mdc-tooltip__surface{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-tooltip__surface{word-break:break-all;word-break:var(--mdc-tooltip-word-break, normal);overflow-wrap:anywhere}.mdc-tooltip{z-index:9}.mdc-tooltip{position:fixed;display:none}.mdc-tooltip-wrapper--rich{position:relative}.mdc-tooltip--shown,.mdc-tooltip--showing,.mdc-tooltip--hide{display:inline-flex}.mdc-tooltip--shown.mdc-tooltip--rich,.mdc-tooltip--showing.mdc-tooltip--rich,.mdc-tooltip--hide.mdc-tooltip--rich{display:inline-block;left:-320px;position:absolute}.mdc-tooltip__surface{line-height:16px;padding:4px 8px;min-width:40px;max-width:200px;min-height:24px;max-height:40vh;box-sizing:border-box;overflow:hidden;text-align:center}.mdc-tooltip__surface::before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}@media screen and (forced-colors: active){.mdc-tooltip__surface::before{border-color:CanvasText}}.mdc-tooltip--rich .mdc-tooltip__surface{align-items:flex-start;border-radius:4px;display:flex;flex-direction:column;line-height:20px;min-height:24px;min-width:40px;max-width:320px;position:relative}.mdc-tooltip--rich .mdc-tooltip__surface .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip--multiline .mdc-tooltip__surface{text-align:left}[dir=rtl] .mdc-tooltip--multiline .mdc-tooltip__surface,.mdc-tooltip--multiline .mdc-tooltip__surface[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__title{display:block;margin-top:0;line-height:20px;margin:0 8px}.mdc-tooltip__surface .mdc-tooltip__title::before{display:inline-block;width:0;height:24px;content:\"\";vertical-align:0}.mdc-tooltip__surface .mdc-tooltip__content{max-width:calc(100% - 2 * 8px);margin:8px;text-align:left}[dir=rtl] .mdc-tooltip__surface .mdc-tooltip__content,.mdc-tooltip__surface .mdc-tooltip__content[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__content-link{text-decoration:none}.mdc-tooltip--rich-actions{z-index:1}.mdc-tooltip__surface-animation{opacity:0;transform:scale(0.8);will-change:transform,opacity}.mdc-tooltip--shown .mdc-tooltip__surface-animation{transform:scale(1);opacity:1}.mdc-tooltip--hide .mdc-tooltip__surface-animation{transform:scale(1)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{position:absolute;height:24px;width:24px;transform:rotate(35deg) skewY(20deg) scaleX(0.9396926208)}.mdc-tooltip__caret-surface-top .mdc-elevation-overlay,.mdc-tooltip__caret-surface-bottom .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip__caret-surface-bottom{outline:1px solid transparent;z-index:-1}@media screen and (forced-colors: active){.mdc-tooltip__caret-surface-bottom{outline-color:CanvasText}}.mat-mdc-tooltip{position:static;pointer-events:none !important}\n"], directives: [{ type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [matTooltipAnimations.tooltipState], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+TooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0", ngImport: i0, type: TooltipComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+TooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.0", type: TooltipComponent, selector: "mat-tooltip-component", host: { attributes: { "aria-hidden": "true" }, listeners: { "mouseleave": "_handleMouseLeave($event)" }, properties: { "style.zoom": "isVisible() ? 1 : null" } }, viewQueries: [{ propertyName: "_tooltip", first: true, predicate: ["tooltip"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div\n  #tooltip\n  class=\"mdc-tooltip mdc-tooltip--shown mat-mdc-tooltip\"\n  [ngClass]=\"tooltipClass\"\n  (animationend)=\"_handleAnimationEnd($event)\"\n  [class.mdc-tooltip--multiline]=\"_isMultiline\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">{{message}}</div>\n</div>\n", styles: [".mdc-tooltip__surface{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-tooltip__surface{word-break:break-all;word-break:var(--mdc-tooltip-word-break, normal);overflow-wrap:anywhere}.mdc-tooltip{z-index:9}.mdc-tooltip{position:fixed;display:none}.mdc-tooltip-wrapper--rich{position:relative}.mdc-tooltip--shown,.mdc-tooltip--showing,.mdc-tooltip--hide{display:inline-flex}.mdc-tooltip--shown.mdc-tooltip--rich,.mdc-tooltip--showing.mdc-tooltip--rich,.mdc-tooltip--hide.mdc-tooltip--rich{display:inline-block;left:-320px;position:absolute}.mdc-tooltip__surface{line-height:16px;padding:4px 8px;min-width:40px;max-width:200px;min-height:24px;max-height:40vh;box-sizing:border-box;overflow:hidden;text-align:center}.mdc-tooltip__surface::before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}@media screen and (forced-colors: active){.mdc-tooltip__surface::before{border-color:CanvasText}}.mdc-tooltip--rich .mdc-tooltip__surface{align-items:flex-start;border-radius:4px;display:flex;flex-direction:column;line-height:20px;min-height:24px;min-width:40px;max-width:320px;position:relative}.mdc-tooltip--rich .mdc-tooltip__surface .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip--multiline .mdc-tooltip__surface{text-align:left}[dir=rtl] .mdc-tooltip--multiline .mdc-tooltip__surface,.mdc-tooltip--multiline .mdc-tooltip__surface[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__title{display:block;margin-top:0;line-height:20px;margin:0 8px}.mdc-tooltip__surface .mdc-tooltip__title::before{display:inline-block;width:0;height:24px;content:\"\";vertical-align:0}.mdc-tooltip__surface .mdc-tooltip__content{max-width:calc(100% - 2 * 8px);margin:8px;text-align:left}[dir=rtl] .mdc-tooltip__surface .mdc-tooltip__content,.mdc-tooltip__surface .mdc-tooltip__content[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__content-link{text-decoration:none}.mdc-tooltip--rich-actions{z-index:1}.mdc-tooltip__surface-animation{opacity:0;transform:scale(0.8);will-change:transform,opacity}.mdc-tooltip--shown .mdc-tooltip__surface-animation{transform:scale(1);opacity:1}.mdc-tooltip--hide .mdc-tooltip__surface-animation{transform:scale(1)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{position:absolute;height:24px;width:24px;transform:rotate(35deg) skewY(20deg) scaleX(0.9396926208)}.mdc-tooltip__caret-surface-top .mdc-elevation-overlay,.mdc-tooltip__caret-surface-bottom .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip__caret-surface-bottom{outline:1px solid transparent;z-index:-1}@media screen and (forced-colors: active){.mdc-tooltip__caret-surface-bottom{outline-color:CanvasText}}.mat-mdc-tooltip{position:relative;transform:scale(0)}.mat-mdc-tooltip::before{content:\"\";top:-8px;right:-8px;bottom:-8px;left:-8px;z-index:-1;position:absolute}.mat-mdc-tooltip._mat-animation-noopable{animation:none;transform:scale(1)}.mat-mdc-tooltip-panel-non-interactive{pointer-events:none}@keyframes mat-mdc-tooltip-show{0%{opacity:0;transform:scale(0.8)}100%{opacity:1;transform:scale(1)}}@keyframes mat-mdc-tooltip-hide{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(0.8)}}.mat-mdc-tooltip-show{animation:mat-mdc-tooltip-show 150ms cubic-bezier(0, 0, 0.2, 1) forwards}.mat-mdc-tooltip-hide{animation:mat-mdc-tooltip-hide 75ms cubic-bezier(0.4, 0, 1, 1) forwards}\n"], directives: [{ type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0", ngImport: i0, type: TooltipComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mat-tooltip-component', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [matTooltipAnimations.tooltipState], host: {
+            args: [{ selector: 'mat-tooltip-component', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         // Forces the element to have a layout in IE and Edge. This fixes issues where the element
                         // won't be rendered if the animations are disabled or there is no web animations polyfill.
-                        '[style.zoom]': '_visibility === "visible" ? 1 : null',
+                        '[style.zoom]': 'isVisible() ? 1 : null',
+                        '(mouseleave)': '_handleMouseLeave($event)',
                         'aria-hidden': 'true',
-                    }, template: "<div\n  class=\"mdc-tooltip mdc-tooltip--shown mat-mdc-tooltip\"\n  [ngClass]=\"tooltipClass\"\n  [class.mdc-tooltip--multiline]=\"_isMultiline\"\n  [@state]=\"_visibility\"\n  (@state.start)=\"_animationStart()\"\n  (@state.done)=\"_animationDone($event)\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">{{message}}</div>\n</div>\n", styles: [".mdc-tooltip__surface{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-tooltip__surface{word-break:break-all;word-break:var(--mdc-tooltip-word-break, normal);overflow-wrap:anywhere}.mdc-tooltip{z-index:9}.mdc-tooltip{position:fixed;display:none}.mdc-tooltip-wrapper--rich{position:relative}.mdc-tooltip--shown,.mdc-tooltip--showing,.mdc-tooltip--hide{display:inline-flex}.mdc-tooltip--shown.mdc-tooltip--rich,.mdc-tooltip--showing.mdc-tooltip--rich,.mdc-tooltip--hide.mdc-tooltip--rich{display:inline-block;left:-320px;position:absolute}.mdc-tooltip__surface{line-height:16px;padding:4px 8px;min-width:40px;max-width:200px;min-height:24px;max-height:40vh;box-sizing:border-box;overflow:hidden;text-align:center}.mdc-tooltip__surface::before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}@media screen and (forced-colors: active){.mdc-tooltip__surface::before{border-color:CanvasText}}.mdc-tooltip--rich .mdc-tooltip__surface{align-items:flex-start;border-radius:4px;display:flex;flex-direction:column;line-height:20px;min-height:24px;min-width:40px;max-width:320px;position:relative}.mdc-tooltip--rich .mdc-tooltip__surface .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip--multiline .mdc-tooltip__surface{text-align:left}[dir=rtl] .mdc-tooltip--multiline .mdc-tooltip__surface,.mdc-tooltip--multiline .mdc-tooltip__surface[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__title{display:block;margin-top:0;line-height:20px;margin:0 8px}.mdc-tooltip__surface .mdc-tooltip__title::before{display:inline-block;width:0;height:24px;content:\"\";vertical-align:0}.mdc-tooltip__surface .mdc-tooltip__content{max-width:calc(100% - 2 * 8px);margin:8px;text-align:left}[dir=rtl] .mdc-tooltip__surface .mdc-tooltip__content,.mdc-tooltip__surface .mdc-tooltip__content[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__content-link{text-decoration:none}.mdc-tooltip--rich-actions{z-index:1}.mdc-tooltip__surface-animation{opacity:0;transform:scale(0.8);will-change:transform,opacity}.mdc-tooltip--shown .mdc-tooltip__surface-animation{transform:scale(1);opacity:1}.mdc-tooltip--hide .mdc-tooltip__surface-animation{transform:scale(1)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{position:absolute;height:24px;width:24px;transform:rotate(35deg) skewY(20deg) scaleX(0.9396926208)}.mdc-tooltip__caret-surface-top .mdc-elevation-overlay,.mdc-tooltip__caret-surface-bottom .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip__caret-surface-bottom{outline:1px solid transparent;z-index:-1}@media screen and (forced-colors: active){.mdc-tooltip__caret-surface-bottom{outline-color:CanvasText}}.mat-mdc-tooltip{position:static;pointer-events:none !important}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; } });
+                    }, template: "<div\n  #tooltip\n  class=\"mdc-tooltip mdc-tooltip--shown mat-mdc-tooltip\"\n  [ngClass]=\"tooltipClass\"\n  (animationend)=\"_handleAnimationEnd($event)\"\n  [class.mdc-tooltip--multiline]=\"_isMultiline\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">{{message}}</div>\n</div>\n", styles: [".mdc-tooltip__surface{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-tooltip__surface{word-break:break-all;word-break:var(--mdc-tooltip-word-break, normal);overflow-wrap:anywhere}.mdc-tooltip{z-index:9}.mdc-tooltip{position:fixed;display:none}.mdc-tooltip-wrapper--rich{position:relative}.mdc-tooltip--shown,.mdc-tooltip--showing,.mdc-tooltip--hide{display:inline-flex}.mdc-tooltip--shown.mdc-tooltip--rich,.mdc-tooltip--showing.mdc-tooltip--rich,.mdc-tooltip--hide.mdc-tooltip--rich{display:inline-block;left:-320px;position:absolute}.mdc-tooltip__surface{line-height:16px;padding:4px 8px;min-width:40px;max-width:200px;min-height:24px;max-height:40vh;box-sizing:border-box;overflow:hidden;text-align:center}.mdc-tooltip__surface::before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}@media screen and (forced-colors: active){.mdc-tooltip__surface::before{border-color:CanvasText}}.mdc-tooltip--rich .mdc-tooltip__surface{align-items:flex-start;border-radius:4px;display:flex;flex-direction:column;line-height:20px;min-height:24px;min-width:40px;max-width:320px;position:relative}.mdc-tooltip--rich .mdc-tooltip__surface .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip--multiline .mdc-tooltip__surface{text-align:left}[dir=rtl] .mdc-tooltip--multiline .mdc-tooltip__surface,.mdc-tooltip--multiline .mdc-tooltip__surface[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__title{display:block;margin-top:0;line-height:20px;margin:0 8px}.mdc-tooltip__surface .mdc-tooltip__title::before{display:inline-block;width:0;height:24px;content:\"\";vertical-align:0}.mdc-tooltip__surface .mdc-tooltip__content{max-width:calc(100% - 2 * 8px);margin:8px;text-align:left}[dir=rtl] .mdc-tooltip__surface .mdc-tooltip__content,.mdc-tooltip__surface .mdc-tooltip__content[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__content-link{text-decoration:none}.mdc-tooltip--rich-actions{z-index:1}.mdc-tooltip__surface-animation{opacity:0;transform:scale(0.8);will-change:transform,opacity}.mdc-tooltip--shown .mdc-tooltip__surface-animation{transform:scale(1);opacity:1}.mdc-tooltip--hide .mdc-tooltip__surface-animation{transform:scale(1)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{position:absolute;height:24px;width:24px;transform:rotate(35deg) skewY(20deg) scaleX(0.9396926208)}.mdc-tooltip__caret-surface-top .mdc-elevation-overlay,.mdc-tooltip__caret-surface-bottom .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip__caret-surface-bottom{outline:1px solid transparent;z-index:-1}@media screen and (forced-colors: active){.mdc-tooltip__caret-surface-bottom{outline-color:CanvasText}}.mat-mdc-tooltip{position:relative;transform:scale(0)}.mat-mdc-tooltip::before{content:\"\";top:-8px;right:-8px;bottom:-8px;left:-8px;z-index:-1;position:absolute}.mat-mdc-tooltip._mat-animation-noopable{animation:none;transform:scale(1)}.mat-mdc-tooltip-panel-non-interactive{pointer-events:none}@keyframes mat-mdc-tooltip-show{0%{opacity:0;transform:scale(0.8)}100%{opacity:1;transform:scale(1)}}@keyframes mat-mdc-tooltip-hide{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(0.8)}}.mat-mdc-tooltip-show{animation:mat-mdc-tooltip-show 150ms cubic-bezier(0, 0, 0.2, 1) forwards}.mat-mdc-tooltip-hide{animation:mat-mdc-tooltip-hide 75ms cubic-bezier(0.4, 0, 1, 1) forwards}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [ANIMATION_MODULE_TYPE]
+                }] }]; }, propDecorators: { _tooltip: [{
+                type: ViewChild,
+                args: ['tooltip', {
+                        // Use a static query here since we interact directly with
+                        // the DOM which can happen before `ngAfterViewInit`.
+                        static: true,
+                    }]
+            }] } });
+
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+/**
+ * Animations used by MatTooltip.
+ * @docs-private
+ */
+const matTooltipAnimations = {
+    /** Animation that transitions a tooltip in and out. */
+    tooltipState: trigger('state', [
+        // TODO(crisbeto): these values are based on MDC's CSS.
+        // We should be able to use their styles directly once we land #19432.
+        state('initial, void, hidden', style({ opacity: 0, transform: 'scale(0.8)' })),
+        state('visible', style({ transform: 'scale(1)' })),
+        transition('* => visible', animate('150ms cubic-bezier(0, 0, 0.2, 1)')),
+        transition('* => hidden', animate('75ms cubic-bezier(0.4, 0, 1, 1)')),
+    ]),
+};
 
 /**
  * @license

package/fesm2020/mdc-tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mdc-tooltip.mjs","sources":["../../../../../../src/material-experimental/mdc-tooltip/tooltip-animations.ts","../../../../../../src/material-experimental/mdc-tooltip/tooltip.ts","../../../../../../src/material-experimental/mdc-tooltip/tooltip.html","../../../../../../src/material-experimental/mdc-tooltip/module.ts","../../../../../../src/material-experimental/mdc-tooltip/public-api.ts","../../../../../../src/material-experimental/mdc-tooltip/index.ts","../../../../../../src/material-experimental/mdc-tooltip/mdc-tooltip_public_index.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {\n  animate,\n  AnimationTriggerMetadata,\n  state,\n  style,\n  transition,\n  trigger,\n} from '@angular/animations';\n\n/**\n * Animations used by MatTooltip.\n * @docs-private\n */\nexport const matTooltipAnimations: {\n  readonly tooltipState: AnimationTriggerMetadata;\n} = {\n  /** Animation that transitions a tooltip in and out. */\n  tooltipState: trigger('state', [\n    // TODO(crisbeto): these values are based on MDC's CSS.\n    // We should be able to use their styles directly once we land #19432.\n    state('initial, void, hidden', style({opacity: 0, transform: 'scale(0.8)'})),\n    state('visible', style({transform: 'scale(1)'})),\n    transition('* => visible', animate('150ms cubic-bezier(0, 0, 0.2, 1)')),\n    transition('* => hidden', animate('75ms cubic-bezier(0.4, 0, 1, 1)')),\n  ]),\n};\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  Directive,\n  ElementRef,\n  Inject,\n  NgZone,\n  Optional,\n  ViewContainerRef,\n  ViewEncapsulation,\n} from '@angular/core';\nimport {DOCUMENT} from '@angular/common';\nimport {Platform} from '@angular/cdk/platform';\nimport {AriaDescriber, FocusMonitor} from '@angular/cdk/a11y';\nimport {Directionality} from '@angular/cdk/bidi';\nimport {ConnectedPosition, Overlay, ScrollDispatcher} from '@angular/cdk/overlay';\nimport {\n  MatTooltipDefaultOptions,\n  MAT_TOOLTIP_DEFAULT_OPTIONS,\n  MAT_TOOLTIP_SCROLL_STRATEGY,\n  _MatTooltipBase,\n  _TooltipComponentBase,\n} from '@angular/material/tooltip';\nimport {numbers} from '@material/tooltip';\nimport {matTooltipAnimations} from './tooltip-animations';\n\n/**\n * CSS class that will be attached to the overlay panel.\n * @deprecated\n * @breaking-change 13.0.0 remove this variable\n */\nexport const TOOLTIP_PANEL_CLASS = 'mat-mdc-tooltip-panel';\n\n/**\n * Directive that attaches a material design tooltip to the host element. Animates the showing and\n * hiding of a tooltip provided position (defaults to below the element).\n *\n * https://material.io/design/components/tooltips.html\n */\n@Directive({\n  selector: '[matTooltip]',\n  exportAs: 'matTooltip',\n  host: {\n    'class': 'mat-mdc-tooltip-trigger',\n  },\n})\nexport class MatTooltip extends _MatTooltipBase<TooltipComponent> {\n  protected override readonly _tooltipComponent = TooltipComponent;\n  protected override readonly _cssClassPrefix = 'mat-mdc';\n\n  constructor(\n    overlay: Overlay,\n    elementRef: ElementRef<HTMLElement>,\n    scrollDispatcher: ScrollDispatcher,\n    viewContainerRef: ViewContainerRef,\n    ngZone: NgZone,\n    platform: Platform,\n    ariaDescriber: AriaDescriber,\n    focusMonitor: FocusMonitor,\n    @Inject(MAT_TOOLTIP_SCROLL_STRATEGY) scrollStrategy: any,\n    @Optional() dir: Directionality,\n    @Optional() @Inject(MAT_TOOLTIP_DEFAULT_OPTIONS) defaultOptions: MatTooltipDefaultOptions,\n    @Inject(DOCUMENT) _document: any,\n  ) {\n    super(\n      overlay,\n      elementRef,\n      scrollDispatcher,\n      viewContainerRef,\n      ngZone,\n      platform,\n      ariaDescriber,\n      focusMonitor,\n      scrollStrategy,\n      dir,\n      defaultOptions,\n      _document,\n    );\n    this._viewportMargin = numbers.MIN_VIEWPORT_TOOLTIP_THRESHOLD;\n  }\n\n  protected override _addOffset(position: ConnectedPosition): ConnectedPosition {\n    const offset = numbers.UNBOUNDED_ANCHOR_GAP;\n    const isLtr = !this._dir || this._dir.value == 'ltr';\n\n    if (position.originY === 'top') {\n      position.offsetY = -offset;\n    } else if (position.originY === 'bottom') {\n      position.offsetY = offset;\n    } else if (position.originX === 'start') {\n      position.offsetX = isLtr ? -offset : offset;\n    } else if (position.originX === 'end') {\n      position.offsetX = isLtr ? offset : -offset;\n    }\n\n    return position;\n  }\n}\n\n/**\n * Internal component that wraps the tooltip's content.\n * @docs-private\n */\n@Component({\n  selector: 'mat-tooltip-component',\n  templateUrl: 'tooltip.html',\n  styleUrls: ['tooltip.css'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  animations: [matTooltipAnimations.tooltipState],\n  host: {\n    // Forces the element to have a layout in IE and Edge. This fixes issues where the element\n    // won't be rendered if the animations are disabled or there is no web animations polyfill.\n    '[style.zoom]': '_visibility === \"visible\" ? 1 : null',\n    'aria-hidden': 'true',\n  },\n})\nexport class TooltipComponent extends _TooltipComponentBase {\n  /* Whether the tooltip text overflows to multiple lines */\n  _isMultiline: boolean = false;\n\n  constructor(changeDetectorRef: ChangeDetectorRef, private _elementRef: ElementRef) {\n    super(changeDetectorRef);\n  }\n\n  protected override _onShow(): void {\n    this._isMultiline = this._isTooltipMultiline();\n  }\n\n  /** Whether the tooltip text has overflown to the next line */\n  private _isTooltipMultiline() {\n    const rect = this._elementRef.nativeElement.getBoundingClientRect();\n    return rect.height > numbers.MIN_HEIGHT && rect.width >= numbers.MAX_WIDTH;\n  }\n}\n","<div\n  class=\"mdc-tooltip mdc-tooltip--shown mat-mdc-tooltip\"\n  [ngClass]=\"tooltipClass\"\n  [class.mdc-tooltip--multiline]=\"_isMultiline\"\n  [@state]=\"_visibility\"\n  (@state.start)=\"_animationStart()\"\n  (@state.done)=\"_animationDone($event)\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">{{message}}</div>\n</div>\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {NgModule} from '@angular/core';\nimport {CommonModule} from '@angular/common';\nimport {A11yModule} from '@angular/cdk/a11y';\nimport {OverlayModule} from '@angular/cdk/overlay';\nimport {CdkScrollableModule} from '@angular/cdk/scrolling';\nimport {MatCommonModule} from '@angular/material-experimental/mdc-core';\nimport {MAT_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER} from '@angular/material/tooltip';\nimport {MatTooltip, TooltipComponent} from './tooltip';\n\n@NgModule({\n  imports: [A11yModule, CommonModule, OverlayModule, MatCommonModule],\n  exports: [MatTooltip, TooltipComponent, MatCommonModule, CdkScrollableModule],\n  declarations: [MatTooltip, TooltipComponent],\n  providers: [MAT_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER],\n})\nexport class MatTooltipModule {}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './tooltip';\nexport * from './tooltip-animations';\nexport * from './module';\n\nexport {\n  getMatTooltipInvalidPositionError,\n  MAT_TOOLTIP_SCROLL_STRATEGY_FACTORY,\n  MAT_TOOLTIP_DEFAULT_OPTIONS_FACTORY,\n  TooltipPosition,\n  TooltipTouchGestures,\n  TooltipVisibility,\n  SCROLL_THROTTLE_MS,\n  MAT_TOOLTIP_SCROLL_STRATEGY,\n  MAT_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER,\n  MatTooltipDefaultOptions,\n  MAT_TOOLTIP_DEFAULT_OPTIONS,\n} from '@angular/material/tooltip';\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './public-api';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"mdc-tooltip.mjs","sources":["../../../../../../src/material-experimental/mdc-tooltip/tooltip.ts","../../../../../../src/material-experimental/mdc-tooltip/tooltip.html","../../../../../../src/material-experimental/mdc-tooltip/tooltip-animations.ts","../../../../../../src/material-experimental/mdc-tooltip/module.ts","../../../../../../src/material-experimental/mdc-tooltip/public-api.ts","../../../../../../src/material-experimental/mdc-tooltip/index.ts","../../../../../../src/material-experimental/mdc-tooltip/mdc-tooltip_public_index.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  Directive,\n  ElementRef,\n  Inject,\n  NgZone,\n  Optional,\n  ViewChild,\n  ViewContainerRef,\n  ViewEncapsulation,\n} from '@angular/core';\nimport {DOCUMENT} from '@angular/common';\nimport {Platform} from '@angular/cdk/platform';\nimport {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations';\nimport {AriaDescriber, FocusMonitor} from '@angular/cdk/a11y';\nimport {Directionality} from '@angular/cdk/bidi';\nimport {ConnectedPosition, Overlay, ScrollDispatcher} from '@angular/cdk/overlay';\nimport {\n  MatTooltipDefaultOptions,\n  MAT_TOOLTIP_DEFAULT_OPTIONS,\n  MAT_TOOLTIP_SCROLL_STRATEGY,\n  _MatTooltipBase,\n  _TooltipComponentBase,\n} from '@angular/material/tooltip';\nimport {numbers} from '@material/tooltip';\n\n/**\n * CSS class that will be attached to the overlay panel.\n * @deprecated\n * @breaking-change 13.0.0 remove this variable\n */\nexport const TOOLTIP_PANEL_CLASS = 'mat-mdc-tooltip-panel';\n\n/**\n * Directive that attaches a material design tooltip to the host element. Animates the showing and\n * hiding of a tooltip provided position (defaults to below the element).\n *\n * https://material.io/design/components/tooltips.html\n */\n@Directive({\n  selector: '[matTooltip]',\n  exportAs: 'matTooltip',\n  host: {\n    'class': 'mat-mdc-tooltip-trigger',\n  },\n})\nexport class MatTooltip extends _MatTooltipBase<TooltipComponent> {\n  protected override readonly _tooltipComponent = TooltipComponent;\n  protected override readonly _cssClassPrefix = 'mat-mdc';\n\n  constructor(\n    overlay: Overlay,\n    elementRef: ElementRef<HTMLElement>,\n    scrollDispatcher: ScrollDispatcher,\n    viewContainerRef: ViewContainerRef,\n    ngZone: NgZone,\n    platform: Platform,\n    ariaDescriber: AriaDescriber,\n    focusMonitor: FocusMonitor,\n    @Inject(MAT_TOOLTIP_SCROLL_STRATEGY) scrollStrategy: any,\n    @Optional() dir: Directionality,\n    @Optional() @Inject(MAT_TOOLTIP_DEFAULT_OPTIONS) defaultOptions: MatTooltipDefaultOptions,\n    @Inject(DOCUMENT) _document: any,\n  ) {\n    super(\n      overlay,\n      elementRef,\n      scrollDispatcher,\n      viewContainerRef,\n      ngZone,\n      platform,\n      ariaDescriber,\n      focusMonitor,\n      scrollStrategy,\n      dir,\n      defaultOptions,\n      _document,\n    );\n    this._viewportMargin = numbers.MIN_VIEWPORT_TOOLTIP_THRESHOLD;\n  }\n\n  protected override _addOffset(position: ConnectedPosition): ConnectedPosition {\n    const offset = numbers.UNBOUNDED_ANCHOR_GAP;\n    const isLtr = !this._dir || this._dir.value == 'ltr';\n\n    if (position.originY === 'top') {\n      position.offsetY = -offset;\n    } else if (position.originY === 'bottom') {\n      position.offsetY = offset;\n    } else if (position.originX === 'start') {\n      position.offsetX = isLtr ? -offset : offset;\n    } else if (position.originX === 'end') {\n      position.offsetX = isLtr ? offset : -offset;\n    }\n\n    return position;\n  }\n}\n\n/**\n * Internal component that wraps the tooltip's content.\n * @docs-private\n */\n@Component({\n  selector: 'mat-tooltip-component',\n  templateUrl: 'tooltip.html',\n  styleUrls: ['tooltip.css'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    // Forces the element to have a layout in IE and Edge. This fixes issues where the element\n    // won't be rendered if the animations are disabled or there is no web animations polyfill.\n    '[style.zoom]': 'isVisible() ? 1 : null',\n    '(mouseleave)': '_handleMouseLeave($event)',\n    'aria-hidden': 'true',\n  },\n})\nexport class TooltipComponent extends _TooltipComponentBase {\n  /* Whether the tooltip text overflows to multiple lines */\n  _isMultiline = false;\n\n  /** Reference to the internal tooltip element. */\n  @ViewChild('tooltip', {\n    // Use a static query here since we interact directly with\n    // the DOM which can happen before `ngAfterViewInit`.\n    static: true,\n  })\n  _tooltip: ElementRef<HTMLElement>;\n  _showAnimation = 'mat-mdc-tooltip-show';\n  _hideAnimation = 'mat-mdc-tooltip-hide';\n\n  constructor(\n    changeDetectorRef: ChangeDetectorRef,\n    private _elementRef: ElementRef<HTMLElement>,\n    @Optional() @Inject(ANIMATION_MODULE_TYPE) animationMode?: string,\n  ) {\n    super(changeDetectorRef, animationMode);\n  }\n\n  protected override _onShow(): void {\n    this._isMultiline = this._isTooltipMultiline();\n    this._markForCheck();\n  }\n\n  /** Whether the tooltip text has overflown to the next line */\n  private _isTooltipMultiline() {\n    const rect = this._elementRef.nativeElement.getBoundingClientRect();\n    return rect.height > numbers.MIN_HEIGHT && rect.width >= numbers.MAX_WIDTH;\n  }\n}\n","<div\n  #tooltip\n  class=\"mdc-tooltip mdc-tooltip--shown mat-mdc-tooltip\"\n  [ngClass]=\"tooltipClass\"\n  (animationend)=\"_handleAnimationEnd($event)\"\n  [class.mdc-tooltip--multiline]=\"_isMultiline\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">{{message}}</div>\n</div>\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {\n  animate,\n  AnimationTriggerMetadata,\n  state,\n  style,\n  transition,\n  trigger,\n} from '@angular/animations';\n\n/**\n * Animations used by MatTooltip.\n * @docs-private\n */\nexport const matTooltipAnimations: {\n  readonly tooltipState: AnimationTriggerMetadata;\n} = {\n  /** Animation that transitions a tooltip in and out. */\n  tooltipState: trigger('state', [\n    // TODO(crisbeto): these values are based on MDC's CSS.\n    // We should be able to use their styles directly once we land #19432.\n    state('initial, void, hidden', style({opacity: 0, transform: 'scale(0.8)'})),\n    state('visible', style({transform: 'scale(1)'})),\n    transition('* => visible', animate('150ms cubic-bezier(0, 0, 0.2, 1)')),\n    transition('* => hidden', animate('75ms cubic-bezier(0.4, 0, 1, 1)')),\n  ]),\n};\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {NgModule} from '@angular/core';\nimport {CommonModule} from '@angular/common';\nimport {A11yModule} from '@angular/cdk/a11y';\nimport {OverlayModule} from '@angular/cdk/overlay';\nimport {CdkScrollableModule} from '@angular/cdk/scrolling';\nimport {MatCommonModule} from '@angular/material-experimental/mdc-core';\nimport {MAT_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER} from '@angular/material/tooltip';\nimport {MatTooltip, TooltipComponent} from './tooltip';\n\n@NgModule({\n  imports: [A11yModule, CommonModule, OverlayModule, MatCommonModule],\n  exports: [MatTooltip, TooltipComponent, MatCommonModule, CdkScrollableModule],\n  declarations: [MatTooltip, TooltipComponent],\n  providers: [MAT_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER],\n})\nexport class MatTooltipModule {}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './tooltip';\nexport * from './tooltip-animations';\nexport * from './module';\n\nexport {\n  getMatTooltipInvalidPositionError,\n  MAT_TOOLTIP_SCROLL_STRATEGY_FACTORY,\n  MAT_TOOLTIP_DEFAULT_OPTIONS_FACTORY,\n  TooltipPosition,\n  TooltipTouchGestures,\n  TooltipVisibility,\n  SCROLL_THROTTLE_MS,\n  MAT_TOOLTIP_SCROLL_STRATEGY,\n  MAT_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER,\n  MatTooltipDefaultOptions,\n  MAT_TOOLTIP_DEFAULT_OPTIONS,\n} from '@angular/material/tooltip';\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './public-api';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/mdc-button/_button-theme.scss

@@ -196,8 +196,11 @@
   .mat-mdc-raised-button,
   .mat-mdc-unelevated-button,
   .mat-mdc-outlined-button {
-    @include mdc-button-theme.density($density-scale, $query: mdc-helpers.$mat-base-styles-query);
-    @include button-theme-private.touch-target-density($density-scale);
+    // Use `mat-mdc-button-base` to increase the specificity over the button's structural styles.
+    &.mat-mdc-button-base {
+      @include mdc-button-theme.density($density-scale, $query: mdc-helpers.$mat-base-styles-query);
+      @include button-theme-private.touch-target-density($density-scale);
+    }
   }
 }
 

package/mdc-button/_icon-button-theme.scss

@@ -49,7 +49,8 @@
 
 @mixin density($config-or-theme) {
   $density-scale: theming.get-density-config($config-or-theme);
-  .mat-mdc-icon-button {
+    // Use `mat-mdc-button-base` to increase the specificity over the button's structural styles.
+  .mat-mdc-icon-button.mat-mdc-button-base {
     @include mdc-icon-button.density($density-scale, $query: mdc-helpers.$mat-base-styles-query);
     @include button-theme-private.touch-target-density($density-scale);
   }

package/mdc-chips/testing/public-api.d.ts

@@ -5,6 +5,7 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
+export * from './chip-avatar-harness';
 export * from './chip-harness';
 export * from './chip-harness-filters';
 export * from './chip-input-harness';

package/mdc-dialog/dialog.d.ts

@@ -34,7 +34,12 @@ export declare class MatDialog extends _MatDialogBase<MatDialogContainer> {
      * @deprecated `_location` parameter to be removed.
      * @breaking-change 10.0.0
      */
-    location: Location, defaultOptions: MatDialogConfig, scrollStrategy: any, parentDialog: MatDialog, overlayContainer: OverlayContainer, animationMode?: 'NoopAnimations' | 'BrowserAnimations');
+    location: Location, defaultOptions: MatDialogConfig, scrollStrategy: any, parentDialog: MatDialog, overlayContainer: OverlayContainer, 
+    /**
+     * @deprecated No longer used. To be removed.
+     * @breaking-change 14.0.0
+     */
+    animationMode?: 'NoopAnimations' | 'BrowserAnimations');
     static ɵfac: i0.ɵɵFactoryDeclaration<MatDialog, [null, null, { optional: true; }, { optional: true; }, null, { optional: true; skipSelf: true; }, null, { optional: true; }]>;
     static ɵprov: i0.ɵɵInjectableDeclaration<MatDialog>;
 }

package/mdc-dialog/testing/dialog-opener.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import { ComponentType } from '@angular/cdk/overlay';
+import { _MatTestDialogOpenerBase } from '@angular/material/dialog/testing';
+import { MatDialog, MatDialogContainer, MatDialogConfig } from '@angular/material-experimental/mdc-dialog';
+/** Test component that immediately opens a dialog when bootstrapped. */
+export declare class MatTestDialogOpener<T = unknown, R = unknown> extends _MatTestDialogOpenerBase<MatDialogContainer, T, R> {
+    constructor(dialog: MatDialog);
+    /** Static method that prepares this class to open the provided component. */
+    static withComponent<T = unknown, R = unknown>(component: ComponentType<T>, config?: MatDialogConfig): ComponentType<MatTestDialogOpener<T, R>>;
+}
+export declare class MatTestDialogOpenerModule {
+}

package/mdc-dialog/testing/public-api.d.ts

@@ -7,3 +7,4 @@
  */
 export { DialogHarnessFilters } from '@angular/material/dialog/testing';
 export { MatDialogHarness, MatDialogSection } from './dialog-harness';
+export * from './dialog-opener';

package/mdc-form-field/_form-field-density.scss

@@ -77,7 +77,7 @@
   // on whether a textarea is used. This is not possible in our implementation of the
   // form-field because we do not know what type of form-field control is set up. Hence
   // we always use a fixed position for the label. This does not have any implications.
-  .mat-mdc-form-field .mat-mdc-text-field-wrapper .mdc-floating-label {
+  .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-floating-label {
     top: math.div($height, 2);
   }
 
@@ -107,7 +107,7 @@
     // Update the spacing for filled form fields to account for the hidden floating label.
     @include _infix-vertical-spacing-filled(
           $no-label-padding, $no-label-padding);
-    .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mdc-floating-label {
+    .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
         display: none;
     }
   }

package/mdc-form-field/_form-field-high-contrast.scss

@@ -4,11 +4,20 @@
   $focus-indicator-width: 3px;
   $focus-indicator-style: dashed;
 
-  // The outline of the `fill` appearance is achieved through a background color
-  // which won't be visible in high contrast mode. Add an outline to replace it.
-  .mat-form-field-appearance-fill .mat-mdc-text-field-wrapper {
-    @include a11y.high-contrast(active, off) {
-      outline: solid 1px;
+  .mat-form-field-appearance-fill {
+    // The outline of the `fill` appearance is achieved through a background color
+    // which won't be visible in high contrast mode. Add an outline to replace it.
+    .mat-mdc-text-field-wrapper {
+      @include a11y.high-contrast(active, off) {
+        outline: solid 1px;
+      }
+    }
+
+    // Use GreyText for the disabled outline color which will account for the user's configuration.
+    &.mat-form-field-disabled .mat-mdc-text-field-wrapper {
+      @include a11y.high-contrast(active, off) {
+        outline-color: GrayText;
+      }
     }
   }
 

package/mdc-form-field/_form-field-theme.scss

@@ -76,7 +76,7 @@
     // shows `body1` for text fields though, so we manually override the typography.
     // Note: Form controls inherit the typography from the parent form field.
     .mat-mdc-form-field,
-    .mat-mdc-form-field .mdc-floating-label {
+    .mat-mdc-floating-label {
       @include mdc-typography.typography(body1, $query: mdc-helpers.$mat-typography-styles-query);
     }
 

package/mdc-form-field/_mdc-text-field-structure-overrides.scss

@@ -20,7 +20,7 @@
   // In order to ensure proper alignment of the floating label, we reset its line-height.
   // The line-height is not important as the element is absolutely positioned and only has one line
   // of text.
-  .mat-mdc-form-field .mdc-floating-label.mdc-floating-label {
+  .mat-mdc-form-field .mat-mdc-floating-label.mdc-floating-label {
     line-height: normal;
   }
 
@@ -95,7 +95,7 @@
   // the notched outline container, and already applies a specific horizontal spacing which
   // we do not want to overwrite. *Note*: We need to have increased specificity for this
   // override because the `right` property will be set with higher specificity in RTL mode.
-  .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mdc-floating-label {
+  .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-floating-label {
     left: auto;
     right: auto;
   }

package/mdc-form-field/directives/floating-label.d.ts

@@ -24,13 +24,11 @@ export declare class MatFormFieldFloatingLabel {
     private _elementRef;
     /** Whether the label is floating. */
     floating: boolean;
-    /** Whether the label is required. */
-    required: boolean;
     constructor(_elementRef: ElementRef);
     /** Gets the width of the label. Used for the outline notch. */
     getWidth(): number;
     /** Gets the HTML element for the floating label. */
     get element(): HTMLElement;
     static ɵfac: i0.ɵɵFactoryDeclaration<MatFormFieldFloatingLabel, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatFormFieldFloatingLabel, "label[matFormFieldFloatingLabel]", never, { "floating": "floating"; "required": "required"; }, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MatFormFieldFloatingLabel, "label[matFormFieldFloatingLabel]", never, { "floating": "floating"; }, {}, never>;
 }

package/mdc-helpers/_mdc-helpers.scss

@@ -1,6 +1,5 @@
 // TODO(mmalerba): this file should be split into separate cohesive partials for things like
-//  "theming", "typography", "core". Currently splitting it is difficult because of our brittle
-//  gulp-based release build process. We can update this when we switch to bazel.
+//  "theming", "typography", "core".
 
 @use '@material/feature-targeting' as mdc-feature-targeting;
 @use '@material/typography' as mdc-typography;

package/mdc-list/_list-theme.scss

@@ -4,6 +4,7 @@
 @use './list-option-theme';
 @use '../mdc-helpers/mdc-helpers';
 @use '../../material/core/typography/typography';
+@use '../../material/core/typography/typography-utils';
 @use '../../material/core/theming/theming';
 
 
@@ -55,6 +56,14 @@
     @include mdc-list.without-ripple($query: mdc-helpers.$mat-typography-styles-query);
     @include list-option-theme.private-list-option-typography-styles();
   }
+
+  // According to the public spec this should be subtitle-1.
+  // However, body-1 and subtitle-1 are nearly identical in the public spec,
+  // and the Google-specific spec states that it should be body-1.
+  // For consistency, we use body-1 for both public and Google internal.
+  .mat-mdc-list-item .mdc-list-item__primary-text {
+    @include typography-utils.typography-level($config, body-1);
+  }
 }
 
 @mixin theme($theme-or-color-config) {

package/mdc-select/_select-theme.scss

@@ -71,7 +71,7 @@
       @include mdc-list.list-base(mdc-helpers.$mat-typography-styles-query);
     }
 
-    .mat-mdc-select-value {
+    .mat-mdc-select {
       @include mdc-typography.typography(body1, $query: mdc-helpers.$mat-typography-styles-query);
     }
   }

package/mdc-table/_table-theme.scss

@@ -15,8 +15,6 @@
   $orig-row-hover-fill-color: mdc-data-table-theme.$row-hover-fill-color;
   $orig-header-row-text-color: mdc-data-table-theme.$header-row-text-color;
   $orig-row-text-color: mdc-data-table-theme.$row-text-color;
-  $orig-sort-icon-color: mdc-data-table-theme.$sort-icon-color;
-  $orig-sort-icon-active-color: mdc-data-table-theme.$sort-icon-active-color;
   $orig-stroke-color: mdc-data-table-theme.$stroke-color;
 
   @include mdc-helpers.mat-using-mdc-theme($config) {
@@ -25,12 +23,9 @@
     mdc-data-table-theme.$row-hover-fill-color: rgba(mdc-theme-color.prop-value(on-surface), 0.04);
     mdc-data-table-theme.$header-row-text-color: rgba(mdc-theme-color.prop-value(on-surface), 0.87);
     mdc-data-table-theme.$row-text-color: rgba(mdc-theme-color.prop-value(on-surface), 0.87);
-    mdc-data-table-theme.$sort-icon-color: rgba(mdc-theme-color.prop-value(on-surface), 0.6);
-    mdc-data-table-theme.$sort-icon-active-color:
-        rgba(mdc-theme-color.prop-value(on-surface), 0.87);
     mdc-data-table-theme.$stroke-color: rgba(mdc-theme-color.prop-value(on-surface), 0.12);
 
-    @include mdc-data-table.core-styles($query: mdc-helpers.$mat-theme-styles-query);
+    @include mdc-data-table.table-styles($query: mdc-helpers.$mat-theme-styles-query);
   }
 
   // Restore original values of MDC global variables.
@@ -39,8 +34,6 @@
   mdc-data-table-theme.$row-hover-fill-color: $orig-row-hover-fill-color;
   mdc-data-table-theme.$header-row-text-color: $orig-header-row-text-color;
   mdc-data-table-theme.$row-text-color: $orig-row-text-color;
-  mdc-data-table-theme.$sort-icon-color: $orig-sort-icon-color;
-  mdc-data-table-theme.$sort-icon-active-color: $orig-sort-icon-active-color;
   mdc-data-table-theme.$stroke-color: $orig-stroke-color;
 
   .mat-mdc-table {
@@ -53,7 +46,7 @@
   $config: typography.private-typography-to-2018-config(
       theming.get-typography-config($config-or-theme));
   @include mdc-helpers.mat-using-mdc-typography($config) {
-    @include mdc-data-table.core-styles($query: mdc-helpers.$mat-typography-styles-query);
+    @include mdc-data-table.table-styles($query: mdc-helpers.$mat-typography-styles-query);
   }
 }
 

package/mdc-tabs/_tabs-common.scss

@@ -104,6 +104,15 @@ $mat-tab-animation-duration: 500ms !default;
     z-index: 2;
     -webkit-tap-highlight-color: transparent;
     touch-action: none;
+    box-sizing: content-box;
+    background: none;
+    border: none;
+    outline: 0;
+    padding: 0;
+
+    &::-moz-focus-inner {
+      border: 0;
+    }
 
     .mat-ripple-element {
       opacity: map.get(mdc-ripple.$dark-ink-opacities, press);