refactor: rename all OverlayState references to match the new naming (#7367)

Renames all of the "state" references in the overlays to refer to a "config" instead. This makes everything consistent with the recent rename of OverlayState to OverlayConfig.

BREAKING CHANGE: The `OverlayRef.getState` method has been renamed to `OverlayRef.getConfig`.

src/cdk/overlay/overlay-config.ts

@@ -50,9 +50,9 @@ export class OverlayConfig {
   /** The direction of the text in the overlay panel. */
   direction?: Direction = 'ltr';
 
-  constructor(state?: OverlayConfig) {
-    if (state) {
-      Object.keys(state).forEach(key => this[key] = state[key]);
+  constructor(config?: OverlayConfig) {
+    if (config) {
+      Object.keys(config).forEach(key => this[key] = config[key]);
     }
   }
 }

src/cdk/overlay/overlay-directives.spec.ts

@@ -76,7 +76,7 @@ describe('Overlay directives', () => {
     let overlayDirective = testComponent.connectedOverlayDirective;
 
     let strategy =
-        <ConnectedPositionStrategy> overlayDirective.overlayRef.getState().positionStrategy;
+        <ConnectedPositionStrategy> overlayDirective.overlayRef.getConfig().positionStrategy;
     expect(strategy instanceof ConnectedPositionStrategy).toBe(true);
 
     let positions = strategy.positions;

src/cdk/overlay/overlay-directives.ts

@@ -337,7 +337,7 @@ export class ConnectedOverlayDirective implements OnDestroy, OnChanges {
     }
 
     this._position.withDirection(this.dir);
-    this._overlayRef.getState().direction = this.dir;
+    this._overlayRef.getConfig().direction = this.dir;
     this._initEscapeListener();
 
     if (!this._overlayRef.hasAttached()) {

src/cdk/overlay/overlay-ref.ts

@@ -26,11 +26,11 @@ export class OverlayRef implements PortalHost {
   constructor(
       private _portalHost: PortalHost,
       private _pane: HTMLElement,
-      private _state: OverlayConfig,
+      private _config: OverlayConfig,
       private _ngZone: NgZone) {
 
-    if (_state.scrollStrategy) {
-      _state.scrollStrategy.attach(this);
+    if (_config.scrollStrategy) {
+      _config.scrollStrategy.attach(this);
     }
   }
 
@@ -47,33 +47,33 @@ export class OverlayRef implements PortalHost {
   attach(portal: Portal<any>): any {
     let attachResult = this._portalHost.attach(portal);
 
-    if (this._state.positionStrategy) {
-      this._state.positionStrategy.attach(this);
+    if (this._config.positionStrategy) {
+      this._config.positionStrategy.attach(this);
     }
 
-    // Update the pane element with the given state configuration.
+    // Update the pane element with the given configuration.
     this._updateStackingOrder();
     this.updateSize();
     this.updateDirection();
     this.updatePosition();
 
-    if (this._state.scrollStrategy) {
-      this._state.scrollStrategy.enable();
+    if (this._config.scrollStrategy) {
+      this._config.scrollStrategy.enable();
     }
 
     // Enable pointer events for the overlay pane element.
     this._togglePointerEvents(true);
 
-    if (this._state.hasBackdrop) {
+    if (this._config.hasBackdrop) {
       this._attachBackdrop();
     }
 
-    if (this._state.panelClass) {
+    if (this._config.panelClass) {
       // We can't do a spread here, because IE doesn't support setting multiple classes.
-      if (Array.isArray(this._state.panelClass)) {
-        this._state.panelClass.forEach(cls => this._pane.classList.add(cls));
+      if (Array.isArray(this._config.panelClass)) {
+        this._config.panelClass.forEach(cls => this._pane.classList.add(cls));
       } else {
-        this._pane.classList.add(this._state.panelClass);
+        this._pane.classList.add(this._config.panelClass);
       }
     }
 
@@ -95,8 +95,8 @@ export class OverlayRef implements PortalHost {
     // pointer events therefore. Depends on the position strategy and the applied pane boundaries.
     this._togglePointerEvents(false);
 
-    if (this._state.scrollStrategy) {
-      this._state.scrollStrategy.disable();
+    if (this._config.scrollStrategy) {
+      this._config.scrollStrategy.disable();
     }
 
     let detachmentResult = this._portalHost.detach();
@@ -111,12 +111,12 @@ export class OverlayRef implements PortalHost {
    * Cleans up the overlay from the DOM.
    */
   dispose(): void {
-    if (this._state.positionStrategy) {
-      this._state.positionStrategy.dispose();
+    if (this._config.positionStrategy) {
+      this._config.positionStrategy.dispose();
     }
 
-    if (this._state.scrollStrategy) {
-      this._state.scrollStrategy.disable();
+    if (this._config.scrollStrategy) {
+      this._config.scrollStrategy.disable();
     }
 
     this.detachBackdrop();
@@ -152,48 +152,48 @@ export class OverlayRef implements PortalHost {
   }
 
   /**
-   * Gets the current state config of the overlay.
+   * Gets the current config of the overlay.
    */
-  getState(): OverlayConfig {
-    return this._state;
+  getConfig(): OverlayConfig {
+    return this._config;
   }
 
   /** Updates the position of the overlay based on the position strategy. */
   updatePosition() {
-    if (this._state.positionStrategy) {
-      this._state.positionStrategy.apply();
+    if (this._config.positionStrategy) {
+      this._config.positionStrategy.apply();
     }
   }
 
   /** Updates the text direction of the overlay panel. */
   private updateDirection() {
-    this._pane.setAttribute('dir', this._state.direction!);
+    this._pane.setAttribute('dir', this._config.direction!);
   }
 
   /** Updates the size of the overlay based on the overlay config. */
   updateSize() {
-    if (this._state.width || this._state.width === 0) {
-      this._pane.style.width = formatCssUnit(this._state.width);
+    if (this._config.width || this._config.width === 0) {
+      this._pane.style.width = formatCssUnit(this._config.width);
     }
 
-    if (this._state.height || this._state.height === 0) {
-      this._pane.style.height = formatCssUnit(this._state.height);
+    if (this._config.height || this._config.height === 0) {
+      this._pane.style.height = formatCssUnit(this._config.height);
     }
 
-    if (this._state.minWidth || this._state.minWidth === 0) {
-      this._pane.style.minWidth = formatCssUnit(this._state.minWidth);
+    if (this._config.minWidth || this._config.minWidth === 0) {
+      this._pane.style.minWidth = formatCssUnit(this._config.minWidth);
     }
 
-    if (this._state.minHeight || this._state.minHeight === 0) {
-      this._pane.style.minHeight = formatCssUnit(this._state.minHeight);
+    if (this._config.minHeight || this._config.minHeight === 0) {
+      this._pane.style.minHeight = formatCssUnit(this._config.minHeight);
     }
 
-    if (this._state.maxWidth || this._state.maxWidth === 0) {
-      this._pane.style.maxWidth = formatCssUnit(this._state.maxWidth);
+    if (this._config.maxWidth || this._config.maxWidth === 0) {
+      this._pane.style.maxWidth = formatCssUnit(this._config.maxWidth);
     }
 
-    if (this._state.maxHeight || this._state.maxHeight === 0) {
-      this._pane.style.maxHeight = formatCssUnit(this._state.maxHeight);
+    if (this._config.maxHeight || this._config.maxHeight === 0) {
+      this._pane.style.maxHeight = formatCssUnit(this._config.maxHeight);
     }
   }
 
@@ -207,8 +207,8 @@ export class OverlayRef implements PortalHost {
     this._backdropElement = document.createElement('div');
     this._backdropElement.classList.add('cdk-overlay-backdrop');
 
-    if (this._state.backdropClass) {
-      this._backdropElement.classList.add(this._state.backdropClass);
+    if (this._config.backdropClass) {
+      this._backdropElement.classList.add(this._config.backdropClass);
     }
 
     // Insert the backdrop before the pane in the DOM order,
@@ -261,8 +261,8 @@ export class OverlayRef implements PortalHost {
 
       backdropToDetach.classList.remove('cdk-overlay-backdrop-showing');
 
-      if (this._state.backdropClass) {
-        backdropToDetach.classList.remove(this._state.backdropClass);
+      if (this._config.backdropClass) {
+        backdropToDetach.classList.remove(this._config.backdropClass);
       }
 
       backdropToDetach.addEventListener('transitionend', finishDetach);

src/cdk/overlay/overlay.spec.ts

@@ -133,9 +133,9 @@ describe('Overlay', () => {
   });
 
   it('should set the direction', () => {
-    const state = new OverlayConfig({direction: 'rtl'});
+    const config = new OverlayConfig({direction: 'rtl'});
 
-    overlay.create(state).attach(componentPortal);
+    overlay.create(config).attach(componentPortal);
 
     const pane = overlayContainerElement.children[0] as HTMLElement;
     expect(pane.getAttribute('dir')).toEqual('rtl');
@@ -152,8 +152,8 @@ describe('Overlay', () => {
   });
 
   it('should emit the attachment event after everything is added to the DOM', () => {
-    let state = new OverlayConfig({hasBackdrop: true});
-    let overlayRef = overlay.create(state);
+    let config = new OverlayConfig({hasBackdrop: true});
+    let overlayRef = overlay.create(config);
 
     overlayRef.attachments().subscribe(() => {
       expect(overlayContainerElement.querySelector('pizza'))
@@ -220,99 +220,99 @@ describe('Overlay', () => {
   });
 
   describe('positioning', () => {
-    let state: OverlayConfig;
+    let config: OverlayConfig;
 
     beforeEach(() => {
-      state = new OverlayConfig();
+      config = new OverlayConfig();
     });
 
     it('should apply the positioning strategy', () => {
-      state.positionStrategy = new FakePositionStrategy();
+      config.positionStrategy = new FakePositionStrategy();
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
 
       expect(overlayContainerElement.querySelectorAll('.fake-positioned').length).toBe(1);
     });
   });
 
   describe('size', () => {
-    let state: OverlayConfig;
+    let config: OverlayConfig;
 
     beforeEach(() => {
-      state = new OverlayConfig();
+      config = new OverlayConfig();
     });
 
     it('should apply the width set in the config', () => {
-      state.width = 500;
+      config.width = 500;
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
       const pane = overlayContainerElement.children[0] as HTMLElement;
       expect(pane.style.width).toEqual('500px');
     });
 
     it('should support using other units if a string width is provided', () => {
-      state.width = '200%';
+      config.width = '200%';
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
       const pane = overlayContainerElement.children[0] as HTMLElement;
       expect(pane.style.width).toEqual('200%');
     });
 
     it('should apply the height set in the config', () => {
-      state.height = 500;
+      config.height = 500;
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
       const pane = overlayContainerElement.children[0] as HTMLElement;
       expect(pane.style.height).toEqual('500px');
     });
 
     it('should support using other units if a string height is provided', () => {
-      state.height = '100vh';
+      config.height = '100vh';
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
       const pane = overlayContainerElement.children[0] as HTMLElement;
       expect(pane.style.height).toEqual('100vh');
     });
 
     it('should apply the min width set in the config', () => {
-      state.minWidth = 200;
+      config.minWidth = 200;
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
       const pane = overlayContainerElement.children[0] as HTMLElement;
       expect(pane.style.minWidth).toEqual('200px');
     });
 
 
     it('should apply the min height set in the config', () => {
-      state.minHeight = 500;
+      config.minHeight = 500;
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
       const pane = overlayContainerElement.children[0] as HTMLElement;
       expect(pane.style.minHeight).toEqual('500px');
     });
 
     it('should apply the max width set in the config', () => {
-      state.maxWidth = 200;
+      config.maxWidth = 200;
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
       const pane = overlayContainerElement.children[0] as HTMLElement;
       expect(pane.style.maxWidth).toEqual('200px');
     });
 
 
     it('should apply the max height set in the config', () => {
-      state.maxHeight = 500;
+      config.maxHeight = 500;
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
       const pane = overlayContainerElement.children[0] as HTMLElement;
       expect(pane.style.maxHeight).toEqual('500px');
     });
 
     it('should support zero widths and heights', () => {
-      state.width = 0;
-      state.height = 0;
+      config.width = 0;
+      config.height = 0;
 
-      overlay.create(state).attach(componentPortal);
+      overlay.create(config).attach(componentPortal);
       const pane = overlayContainerElement.children[0] as HTMLElement;
       expect(pane.style.width).toEqual('0px');
       expect(pane.style.height).toEqual('0px');

src/cdk/overlay/overlay.ts

@@ -24,8 +24,8 @@ import {ScrollStrategyOptions} from './scroll/index';
 /** Next overlay unique ID. */
 let nextUniqueId = 0;
 
-/** The default state for newly created overlays. */
-let defaultState = new OverlayConfig();
+/** The default config for newly created overlays. */
+let defaultConfig = new OverlayConfig();
 
 
 /**
@@ -48,13 +48,13 @@ export class Overlay {
 
   /**
    * Creates an overlay.
-   * @param state State to apply to the overlay.
+   * @param config Config to apply to the overlay.
    * @returns Reference to the created overlay.
    */
-  create(state: OverlayConfig = defaultState): OverlayRef {
+  create(config: OverlayConfig = defaultConfig): OverlayRef {
     const pane = this._createPaneElement();
     const portalHost = this._createPortalHost(pane);
-    return new OverlayRef(portalHost, pane, state, this._ngZone);
+    return new OverlayRef(portalHost, pane, config, this._ngZone);
   }
 
   /**

src/lib/autocomplete/autocomplete-trigger.ts

@@ -440,7 +440,7 @@ export class MatAutocompleteTrigger implements ControlValueAccessor, OnDestroy {
       this._overlayRef = this._overlay.create(this._getOverlayConfig());
     } else {
       /** Update the panel width, in case the host width has changed */
-      this._overlayRef.getState().width = this._getHostWidth();
+      this._overlayRef.getConfig().width = this._getHostWidth();
       this._overlayRef.updateSize();
     }
 

src/lib/datepicker/datepicker.ts

@@ -332,7 +332,7 @@ export class MatDatepicker<D> implements OnDestroy {
 
   /** Create the popup. */
   private _createPopup(): void {
-    const overlayState = new OverlayConfig({
+    const overlayConfig = new OverlayConfig({
       positionStrategy: this._createPopupPositionStrategy(),
       hasBackdrop: true,
       backdropClass: 'mat-overlay-transparent-backdrop',
@@ -340,7 +340,7 @@ export class MatDatepicker<D> implements OnDestroy {
       scrollStrategy: this._scrollStrategy()
     });
 
-    this._popupRef = this._overlay.create(overlayState);
+    this._popupRef = this._overlay.create(overlayConfig);
   }
 
   /** Create the popup PositionStrategy. */

src/lib/dialog/dialog-ref.ts

@@ -157,6 +157,6 @@ export class MatDialogRef<T> {
 
   /** Fetches the position strategy object from the overlay ref. */
   private _getPositionStrategy(): GlobalPositionStrategy {
-    return this._overlayRef.getState().positionStrategy as GlobalPositionStrategy;
+    return this._overlayRef.getConfig().positionStrategy as GlobalPositionStrategy;
   }
 }

src/lib/dialog/dialog.ts

@@ -173,16 +173,16 @@ export class MatDialog {
    * @returns A promise resolving to the OverlayRef for the created overlay.
    */
   private _createOverlay(config: MatDialogConfig): OverlayRef {
-    const overlayState = this._getOverlayState(config);
-    return this._overlay.create(overlayState);
+    const overlayConfig = this._getOverlayConfig(config);
+    return this._overlay.create(overlayConfig);
   }
 
   /**
-   * Creates an overlay state from a dialog config.
+   * Creates an overlay config from a dialog config.
    * @param dialogConfig The dialog configuration.
    * @returns The overlay configuration.
    */
-  private _getOverlayState(dialogConfig: MatDialogConfig): OverlayConfig {
+  private _getOverlayConfig(dialogConfig: MatDialogConfig): OverlayConfig {
     const state = new OverlayConfig({
       positionStrategy: this._overlay.position().global(),
       scrollStrategy: this._scrollStrategy(),

src/lib/snack-bar/snack-bar.ts

@@ -152,8 +152,8 @@ export class MatSnackBar {
    * @param config The user-specified snack bar config.
    */
   private _createOverlay(config: MatSnackBarConfig): OverlayRef {
-    const state = new OverlayConfig();
-    state.direction = config.direction;
+    const overlayConfig = new OverlayConfig();
+    overlayConfig.direction = config.direction;
 
     let positionStrategy = this._overlay.position().global();
     // Set horizontal position.
@@ -177,8 +177,8 @@ export class MatSnackBar {
       positionStrategy.bottom('0');
     }
 
-    state.positionStrategy = positionStrategy;
-    return this._overlay.create(state);
+    overlayConfig.positionStrategy = positionStrategy;
+    return this._overlay.create(overlayConfig);
   }
 
   /**