fix(material/dialog): provide defaults for dialog animation

src/material/dialog/dialog-animations.ts

@@ -17,6 +17,14 @@ import {
   group,
 } from '@angular/animations';
 
+/**
+ * Default parameters for the animation for backwards compatibility.
+ * @docs-private
+ */
+export const defaultParams = {
+  params: {enterAnimationDuration: '150ms', exitAnimationDuration: '75ms'},
+};
+
 /**
  * Animations used by MatDialog.
  * @docs-private
@@ -40,13 +48,15 @@ export const matDialogAnimations: {
         ),
         query('@*', animateChild(), {optional: true}),
       ]),
+      defaultParams,
     ),
     transition(
       '* => void, * => exit',
       group([
         animate('{{exitAnimationDuration}} cubic-bezier(0.4, 0.0, 0.2, 1)', style({opacity: 0})),
         query('@*', animateChild(), {optional: true}),
       ]),
+      defaultParams,
     ),
   ]),
 };

src/material/dialog/dialog-config.ts

@@ -9,6 +9,7 @@
 import {ViewContainerRef, ComponentFactoryResolver} from '@angular/core';
 import {Direction} from '@angular/cdk/bidi';
 import {ScrollStrategy} from '@angular/cdk/overlay';
+import {defaultParams} from './dialog-animations';
 
 /** Options for where to set focus to automatically on dialog open */
 export type AutoFocusTarget = 'dialog' | 'first-tabbable' | 'first-heading';
@@ -127,10 +128,10 @@ export class MatDialogConfig<D = any> {
   componentFactoryResolver?: ComponentFactoryResolver;
 
   /** Duration of the enter animation. Has to be a valid CSS value (e.g. 100ms). */
-  enterAnimationDuration?: string = '150ms';
+  enterAnimationDuration?: string = defaultParams.params.enterAnimationDuration;
 
   /** Duration of the exit animation. Has to be a valid CSS value (e.g. 50ms). */
-  exitAnimationDuration?: string = '75ms';
+  exitAnimationDuration?: string = defaultParams.params.exitAnimationDuration;
 
   // TODO(jelbourn): add configuration for lifecycle hooks, ARIA labelling.
 }

src/material/dialog/dialog-container.ts

@@ -38,7 +38,7 @@ import {
   ViewChild,
   ViewEncapsulation,
 } from '@angular/core';
-import {matDialogAnimations} from './dialog-animations';
+import {matDialogAnimations, defaultParams} from './dialog-animations';
 import {MatDialogConfig} from './dialog-config';
 
 /** Event that captures the state of dialog container animations. */
@@ -365,8 +365,10 @@ export class MatDialogContainer extends _MatDialogContainerBase {
     return {
       value: this._state,
       params: {
-        enterAnimationDuration: this._config.enterAnimationDuration || '150ms',
-        exitAnimationDuration: this._config.exitAnimationDuration || '75ms',
+        enterAnimationDuration:
+          this._config.enterAnimationDuration || defaultParams.params.enterAnimationDuration,
+        exitAnimationDuration:
+          this._config.exitAnimationDuration || defaultParams.params.exitAnimationDuration,
       },
     };
   }

src/material/dialog/public-api.ts

@@ -12,4 +12,4 @@ export * from './dialog-container';
 export * from './dialog-content-directives';
 export * from './dialog-config';
 export * from './dialog-ref';
-export * from './dialog-animations';
+export {matDialogAnimations} from './dialog-animations';