@angular/cdk 7.1.1 → 7.3.0

package/esm5/observers.es5.js

@@ -5,7 +5,7 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
-import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
+import { coerceBooleanProperty, coerceNumberProperty, coerceElement } from '@angular/cdk/coercion';
 import { Directive, ElementRef, EventEmitter, Injectable, Input, NgModule, NgZone, Output, defineInjectable, inject } from '@angular/core';
 import { Observable, Subject } from 'rxjs';
 import { debounceTime } from 'rxjs/operators';
@@ -70,8 +70,8 @@ var ContentObserver = /** @class */ (function () {
     function (elementOrRef) {
         var _this = this;
         /** @type {?} */
-        var element = elementOrRef instanceof ElementRef ? elementOrRef.nativeElement : elementOrRef;
-        return Observable.create(function (observer) {
+        var element = coerceElement(elementOrRef);
+        return new Observable(function (observer) {
             /** @type {?} */
             var stream = _this._observeElement(element);
             /** @type {?} */

package/esm5/observers.es5.js.map

@@ -1 +1 @@
-{"version":3,"file":"observers.es5.js","sources":["../../../src/cdk/observers/observe-content.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 {coerceBooleanProperty, coerceNumberProperty} from '@angular/cdk/coercion';\nimport {\n  AfterContentInit,\n  Directive,\n  ElementRef,\n  EventEmitter,\n  Injectable,\n  Input,\n  NgModule,\n  NgZone,\n  OnDestroy,\n  Output,\n} from '@angular/core';\nimport {Observable, Subject, Subscription, Observer} from 'rxjs';\nimport {debounceTime} from 'rxjs/operators';\n\n/**\n * Factory that creates a new MutationObserver and allows us to stub it out in unit tests.\n * @docs-private\n */\n@Injectable({providedIn: 'root'})\nexport class MutationObserverFactory {\n  create(callback: MutationCallback): MutationObserver | null {\n    return typeof MutationObserver === 'undefined' ? null : new MutationObserver(callback);\n  }\n}\n\n\n/** An injectable service that allows watching elements for changes to their content. */\n@Injectable({providedIn: 'root'})\nexport class ContentObserver implements OnDestroy {\n  /** Keeps track of the existing MutationObservers so they can be reused. */\n  private _observedElements = new Map<Element, {\n    observer: MutationObserver | null,\n    stream: Subject<MutationRecord[]>,\n    count: number\n  }>();\n\n  constructor(private _mutationObserverFactory: MutationObserverFactory) {}\n\n  ngOnDestroy() {\n    this._observedElements.forEach((_, element) => this._cleanupObserver(element));\n  }\n\n  /**\n   * Observe content changes on an element.\n   * @param element The element to observe for content changes.\n   */\n  observe(element: Element): Observable<MutationRecord[]>;\n\n  /**\n   * Observe content changes on an element.\n   * @param element The element to observe for content changes.\n   */\n  observe(element: ElementRef<Element>): Observable<MutationRecord[]>;\n\n  observe(elementOrRef: Element | ElementRef<Element>): Observable<MutationRecord[]> {\n    const element = elementOrRef instanceof ElementRef ? elementOrRef.nativeElement : elementOrRef;\n\n    return Observable.create((observer: Observer<MutationRecord[]>) => {\n      const stream = this._observeElement(element);\n      const subscription = stream.subscribe(observer);\n\n      return () => {\n        subscription.unsubscribe();\n        this._unobserveElement(element);\n      };\n    });\n  }\n\n  /**\n   * Observes the given element by using the existing MutationObserver if available, or creating a\n   * new one if not.\n   */\n  private _observeElement(element: Element): Subject<MutationRecord[]> {\n    if (!this._observedElements.has(element)) {\n      const stream = new Subject<MutationRecord[]>();\n      const observer = this._mutationObserverFactory.create(mutations => stream.next(mutations));\n      if (observer) {\n        observer.observe(element, {\n          characterData: true,\n          childList: true,\n          subtree: true\n        });\n      }\n      this._observedElements.set(element, {observer, stream, count: 1});\n    } else {\n      this._observedElements.get(element)!.count++;\n    }\n    return this._observedElements.get(element)!.stream;\n  }\n\n  /**\n   * Un-observes the given element and cleans up the underlying MutationObserver if nobody else is\n   * observing this element.\n   */\n  private _unobserveElement(element: Element) {\n    if (this._observedElements.has(element)) {\n      this._observedElements.get(element)!.count--;\n      if (!this._observedElements.get(element)!.count) {\n        this._cleanupObserver(element);\n      }\n    }\n  }\n\n  /** Clean up the underlying MutationObserver for the specified element. */\n  private _cleanupObserver(element: Element) {\n    if (this._observedElements.has(element)) {\n      const {observer, stream} = this._observedElements.get(element)!;\n      if (observer) {\n        observer.disconnect();\n      }\n      stream.complete();\n      this._observedElements.delete(element);\n    }\n  }\n}\n\n\n/**\n * Directive that triggers a callback whenever the content of\n * its associated element has changed.\n */\n@Directive({\n  selector: '[cdkObserveContent]',\n  exportAs: 'cdkObserveContent',\n})\nexport class CdkObserveContent implements AfterContentInit, OnDestroy {\n  /** Event emitted for each change in the element's content. */\n  @Output('cdkObserveContent') event = new EventEmitter<MutationRecord[]>();\n\n  /**\n   * Whether observing content is disabled. This option can be used\n   * to disconnect the underlying MutationObserver until it is needed.\n   */\n  @Input('cdkObserveContentDisabled')\n  get disabled() { return this._disabled; }\n  set disabled(value: any) {\n    this._disabled = coerceBooleanProperty(value);\n    this._disabled ? this._unsubscribe() : this._subscribe();\n  }\n  private _disabled = false;\n\n  /** Debounce interval for emitting the changes. */\n  @Input()\n  get debounce(): number { return this._debounce; }\n  set debounce(value: number) {\n    this._debounce = coerceNumberProperty(value);\n    this._subscribe();\n  }\n  private _debounce: number;\n\n  private _currentSubscription: Subscription | null = null;\n\n  constructor(private _contentObserver: ContentObserver,\n              private _elementRef: ElementRef<HTMLElement>,\n              private _ngZone: NgZone) {}\n\n  ngAfterContentInit() {\n    if (!this._currentSubscription && !this.disabled) {\n      this._subscribe();\n    }\n  }\n\n  ngOnDestroy() {\n    this._unsubscribe();\n  }\n\n  private _subscribe() {\n    this._unsubscribe();\n    const stream = this._contentObserver.observe(this._elementRef);\n\n    // TODO(mmalerba): We shouldn't be emitting on this @Output() outside the zone.\n    // Consider brining it back inside the zone next time we're making breaking changes.\n    // Bringing it back inside can cause things like infinite change detection loops and changed\n    // after checked errors if people's code isn't handling it properly.\n    this._ngZone.runOutsideAngular(() => {\n      this._currentSubscription =\n          (this.debounce ? stream.pipe(debounceTime(this.debounce)) : stream).subscribe(this.event);\n    });\n  }\n\n  private _unsubscribe() {\n    if (this._currentSubscription) {\n      this._currentSubscription.unsubscribe();\n    }\n  }\n}\n\n\n@NgModule({\n  exports: [CdkObserveContent],\n  declarations: [CdkObserveContent],\n  providers: [MutationObserverFactory]\n})\nexport class ObserversModule {}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"observers.es5.js","sources":["../../../src/cdk/observers/observe-content.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 {coerceBooleanProperty, coerceNumberProperty, coerceElement} from '@angular/cdk/coercion';\nimport {\n  AfterContentInit,\n  Directive,\n  ElementRef,\n  EventEmitter,\n  Injectable,\n  Input,\n  NgModule,\n  NgZone,\n  OnDestroy,\n  Output,\n} from '@angular/core';\nimport {Observable, Subject, Subscription, Observer} from 'rxjs';\nimport {debounceTime} from 'rxjs/operators';\n\n/**\n * Factory that creates a new MutationObserver and allows us to stub it out in unit tests.\n * @docs-private\n */\n@Injectable({providedIn: 'root'})\nexport class MutationObserverFactory {\n  create(callback: MutationCallback): MutationObserver | null {\n    return typeof MutationObserver === 'undefined' ? null : new MutationObserver(callback);\n  }\n}\n\n\n/** An injectable service that allows watching elements for changes to their content. */\n@Injectable({providedIn: 'root'})\nexport class ContentObserver implements OnDestroy {\n  /** Keeps track of the existing MutationObservers so they can be reused. */\n  private _observedElements = new Map<Element, {\n    observer: MutationObserver | null,\n    stream: Subject<MutationRecord[]>,\n    count: number\n  }>();\n\n  constructor(private _mutationObserverFactory: MutationObserverFactory) {}\n\n  ngOnDestroy() {\n    this._observedElements.forEach((_, element) => this._cleanupObserver(element));\n  }\n\n  /**\n   * Observe content changes on an element.\n   * @param element The element to observe for content changes.\n   */\n  observe(element: Element): Observable<MutationRecord[]>;\n\n  /**\n   * Observe content changes on an element.\n   * @param element The element to observe for content changes.\n   */\n  observe(element: ElementRef<Element>): Observable<MutationRecord[]>;\n\n  observe(elementOrRef: Element | ElementRef<Element>): Observable<MutationRecord[]> {\n    const element = coerceElement(elementOrRef);\n\n    return new Observable((observer: Observer<MutationRecord[]>) => {\n      const stream = this._observeElement(element);\n      const subscription = stream.subscribe(observer);\n\n      return () => {\n        subscription.unsubscribe();\n        this._unobserveElement(element);\n      };\n    });\n  }\n\n  /**\n   * Observes the given element by using the existing MutationObserver if available, or creating a\n   * new one if not.\n   */\n  private _observeElement(element: Element): Subject<MutationRecord[]> {\n    if (!this._observedElements.has(element)) {\n      const stream = new Subject<MutationRecord[]>();\n      const observer = this._mutationObserverFactory.create(mutations => stream.next(mutations));\n      if (observer) {\n        observer.observe(element, {\n          characterData: true,\n          childList: true,\n          subtree: true\n        });\n      }\n      this._observedElements.set(element, {observer, stream, count: 1});\n    } else {\n      this._observedElements.get(element)!.count++;\n    }\n    return this._observedElements.get(element)!.stream;\n  }\n\n  /**\n   * Un-observes the given element and cleans up the underlying MutationObserver if nobody else is\n   * observing this element.\n   */\n  private _unobserveElement(element: Element) {\n    if (this._observedElements.has(element)) {\n      this._observedElements.get(element)!.count--;\n      if (!this._observedElements.get(element)!.count) {\n        this._cleanupObserver(element);\n      }\n    }\n  }\n\n  /** Clean up the underlying MutationObserver for the specified element. */\n  private _cleanupObserver(element: Element) {\n    if (this._observedElements.has(element)) {\n      const {observer, stream} = this._observedElements.get(element)!;\n      if (observer) {\n        observer.disconnect();\n      }\n      stream.complete();\n      this._observedElements.delete(element);\n    }\n  }\n}\n\n\n/**\n * Directive that triggers a callback whenever the content of\n * its associated element has changed.\n */\n@Directive({\n  selector: '[cdkObserveContent]',\n  exportAs: 'cdkObserveContent',\n})\nexport class CdkObserveContent implements AfterContentInit, OnDestroy {\n  /** Event emitted for each change in the element's content. */\n  @Output('cdkObserveContent') event = new EventEmitter<MutationRecord[]>();\n\n  /**\n   * Whether observing content is disabled. This option can be used\n   * to disconnect the underlying MutationObserver until it is needed.\n   */\n  @Input('cdkObserveContentDisabled')\n  get disabled() { return this._disabled; }\n  set disabled(value: any) {\n    this._disabled = coerceBooleanProperty(value);\n    this._disabled ? this._unsubscribe() : this._subscribe();\n  }\n  private _disabled = false;\n\n  /** Debounce interval for emitting the changes. */\n  @Input()\n  get debounce(): number { return this._debounce; }\n  set debounce(value: number) {\n    this._debounce = coerceNumberProperty(value);\n    this._subscribe();\n  }\n  private _debounce: number;\n\n  private _currentSubscription: Subscription | null = null;\n\n  constructor(private _contentObserver: ContentObserver,\n              private _elementRef: ElementRef<HTMLElement>,\n              private _ngZone: NgZone) {}\n\n  ngAfterContentInit() {\n    if (!this._currentSubscription && !this.disabled) {\n      this._subscribe();\n    }\n  }\n\n  ngOnDestroy() {\n    this._unsubscribe();\n  }\n\n  private _subscribe() {\n    this._unsubscribe();\n    const stream = this._contentObserver.observe(this._elementRef);\n\n    // TODO(mmalerba): We shouldn't be emitting on this @Output() outside the zone.\n    // Consider brining it back inside the zone next time we're making breaking changes.\n    // Bringing it back inside can cause things like infinite change detection loops and changed\n    // after checked errors if people's code isn't handling it properly.\n    this._ngZone.runOutsideAngular(() => {\n      this._currentSubscription =\n          (this.debounce ? stream.pipe(debounceTime(this.debounce)) : stream).subscribe(this.event);\n    });\n  }\n\n  private _unsubscribe() {\n    if (this._currentSubscription) {\n      this._currentSubscription.unsubscribe();\n    }\n  }\n}\n\n\n@NgModule({\n  exports: [CdkObserveContent],\n  declarations: [CdkObserveContent],\n  providers: [MutationObserverFactory]\n})\nexport class ObserversModule {}\n"],"names":[],"mappings":"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"}

package/esm5/overlay.es5.js

@@ -916,7 +916,7 @@ OverlayRef = /** @class */ (function () {
         this._attachments = new Subject();
         this._detachments = new Subject();
         this._locationChanges = Subscription.EMPTY;
-        this._keydownEventsObservable = Observable.create(function (observer) {
+        this._keydownEventsObservable = new Observable(function (observer) {
             /** @type {?} */
             var subscription = _this._keydownEvents.subscribe(observer);
             _this._keydownEventSubscriptions++;
@@ -1184,13 +1184,13 @@ OverlayRef = /** @class */ (function () {
     function () {
         return this._keydownEventsObservable;
     };
-    /** Gets the the current overlay configuration, which is immutable. */
+    /** Gets the current overlay configuration, which is immutable. */
     /**
-     * Gets the the current overlay configuration, which is immutable.
+     * Gets the current overlay configuration, which is immutable.
      * @return {?}
      */
     OverlayRef.prototype.getConfig = /**
-     * Gets the the current overlay configuration, which is immutable.
+     * Gets the current overlay configuration, which is immutable.
      * @return {?}
      */
     function () {
@@ -1264,6 +1264,38 @@ OverlayRef = /** @class */ (function () {
         this._config = __assign({}, this._config, { direction: dir });
         this._updateElementDirection();
     };
+    /** Add a CSS class or an array of classes to the overlay pane. */
+    /**
+     * Add a CSS class or an array of classes to the overlay pane.
+     * @param {?} classes
+     * @return {?}
+     */
+    OverlayRef.prototype.addPanelClass = /**
+     * Add a CSS class or an array of classes to the overlay pane.
+     * @param {?} classes
+     * @return {?}
+     */
+    function (classes) {
+        if (this._pane) {
+            this._toggleClasses(this._pane, classes, true);
+        }
+    };
+    /** Remove a CSS class or an array of classes from the overlay pane. */
+    /**
+     * Remove a CSS class or an array of classes from the overlay pane.
+     * @param {?} classes
+     * @return {?}
+     */
+    OverlayRef.prototype.removePanelClass = /**
+     * Remove a CSS class or an array of classes from the overlay pane.
+     * @param {?} classes
+     * @return {?}
+     */
+    function (classes) {
+        if (this._pane) {
+            this._toggleClasses(this._pane, classes, false);
+        }
+    };
     /**
      * Returns the layout direction of the overlay panel.
      */
@@ -1614,7 +1646,7 @@ FlexibleConnectedPositionStrategy = /** @class */ (function () {
         /**
          * Observable sequence of position changes.
          */
-        this.positionChanges = Observable.create(function (observer) {
+        this.positionChanges = new Observable(function (observer) {
             /** @type {?} */
             var subscription = _this._positionChanges.subscribe(observer);
             _this._positionChangeSubscriptions++;
@@ -1734,7 +1766,7 @@ FlexibleConnectedPositionStrategy = /** @class */ (function () {
         // the overlay relative to the origin.
         // We use the viewport rect to determine whether a position would go off-screen.
         this._viewportRect = this._getNarrowedViewportRect();
-        this._originRect = this._origin.getBoundingClientRect();
+        this._originRect = this._getOriginRect();
         this._overlayRect = this._pane.getBoundingClientRect();
         /** @type {?} */
         var originRect = this._originRect;
@@ -1890,7 +1922,7 @@ FlexibleConnectedPositionStrategy = /** @class */ (function () {
      */
     function () {
         if (!this._isDisposed && (!this._platform || this._platform.isBrowser)) {
-            this._originRect = this._origin.getBoundingClientRect();
+            this._originRect = this._getOriginRect();
             this._overlayRect = this._pane.getBoundingClientRect();
             this._viewportRect = this._getNarrowedViewportRect();
             /** @type {?} */
@@ -2062,25 +2094,34 @@ FlexibleConnectedPositionStrategy = /** @class */ (function () {
         return (/** @type {?} */ (this));
     };
     /**
-     * Sets the origin element, relative to which to position the overlay.
-     * @param origin Reference to the new origin element.
+     * Sets the origin, relative to which to position the overlay.
+     * Using an element origin is useful for building components that need to be positioned
+     * relatively to a trigger (e.g. dropdown menus or tooltips), whereas using a point can be
+     * used for cases like contextual menus which open relative to the user's pointer.
+     * @param origin Reference to the new origin.
      */
     /**
-     * Sets the origin element, relative to which to position the overlay.
+     * Sets the origin, relative to which to position the overlay.
+     * Using an element origin is useful for building components that need to be positioned
+     * relatively to a trigger (e.g. dropdown menus or tooltips), whereas using a point can be
+     * used for cases like contextual menus which open relative to the user's pointer.
      * @template THIS
      * @this {THIS}
-     * @param {?} origin Reference to the new origin element.
+     * @param {?} origin Reference to the new origin.
      * @return {THIS}
      */
     FlexibleConnectedPositionStrategy.prototype.setOrigin = /**
-     * Sets the origin element, relative to which to position the overlay.
+     * Sets the origin, relative to which to position the overlay.
+     * Using an element origin is useful for building components that need to be positioned
+     * relatively to a trigger (e.g. dropdown menus or tooltips), whereas using a point can be
+     * used for cases like contextual menus which open relative to the user's pointer.
      * @template THIS
      * @this {THIS}
-     * @param {?} origin Reference to the new origin element.
+     * @param {?} origin Reference to the new origin.
      * @return {THIS}
      */
     function (origin) {
-        (/** @type {?} */ (this))._origin = origin instanceof ElementRef ? origin.nativeElement : origin;
+        (/** @type {?} */ (this))._origin = origin;
         return (/** @type {?} */ (this));
     };
     /**
@@ -2548,7 +2589,7 @@ FlexibleConnectedPositionStrategy = /** @class */ (function () {
         if (position.overlayY === 'top') {
             // Overlay is opening "downward" and thus is bound by the bottom viewport edge.
             top = origin.y;
-            height = viewport.bottom - origin.y;
+            height = viewport.height - top + this._viewportMargin;
         }
         else if (position.overlayY === 'bottom') {
             // Overlay is opening "upward" and thus is bound by the top viewport edge. We need to add
@@ -2727,6 +2768,7 @@ FlexibleConnectedPositionStrategy = /** @class */ (function () {
             bottom: '',
             right: '',
             position: '',
+            transform: '',
         })));
     };
     /** Sets positioning styles to the overlay element. */
@@ -2907,7 +2949,7 @@ FlexibleConnectedPositionStrategy = /** @class */ (function () {
     function () {
         // Note: needs fresh rects since the position could've changed.
         /** @type {?} */
-        var originBounds = this._origin.getBoundingClientRect();
+        var originBounds = this._getOriginRect();
         /** @type {?} */
         var overlayBounds = this._pane.getBoundingClientRect();
         // TODO(jelbourn): instead of needing all of the client rects for these scrolling containers
@@ -3097,6 +3139,36 @@ FlexibleConnectedPositionStrategy = /** @class */ (function () {
             this._appliedPanelClasses = [];
         }
     };
+    /** Returns the ClientRect of the current origin. */
+    /**
+     * Returns the ClientRect of the current origin.
+     * @private
+     * @return {?}
+     */
+    FlexibleConnectedPositionStrategy.prototype._getOriginRect = /**
+     * Returns the ClientRect of the current origin.
+     * @private
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
+        var origin = this._origin;
+        if (origin instanceof ElementRef) {
+            return origin.nativeElement.getBoundingClientRect();
+        }
+        if (origin instanceof HTMLElement) {
+            return origin.getBoundingClientRect();
+        }
+        // If the origin is a point, return a client rect as if it was a 0x0 element at the point.
+        return {
+            top: origin.y,
+            bottom: origin.y,
+            left: origin.x,
+            right: origin.x,
+            height: 0,
+            width: 0
+        };
+    };
     return FlexibleConnectedPositionStrategy;
 }());
 /**
@@ -3908,20 +3980,20 @@ var OverlayPositionBuilder = /** @class */ (function () {
     };
     /**
      * Creates a flexible position strategy.
-     * @param elementRef
+     * @param origin Origin relative to which to position the overlay.
      */
     /**
      * Creates a flexible position strategy.
-     * @param {?} elementRef
+     * @param {?} origin Origin relative to which to position the overlay.
      * @return {?}
      */
     OverlayPositionBuilder.prototype.flexibleConnectedTo = /**
      * Creates a flexible position strategy.
-     * @param {?} elementRef
+     * @param {?} origin Origin relative to which to position the overlay.
      * @return {?}
      */
-    function (elementRef) {
-        return new FlexibleConnectedPositionStrategy(elementRef, this._viewportRuler, this._document, this._platform, this._overlayContainer);
+    function (origin) {
+        return new FlexibleConnectedPositionStrategy(origin, this._viewportRuler, this._document, this._platform, this._overlayContainer);
     };
     OverlayPositionBuilder.decorators = [
         { type: Injectable, args: [{ providedIn: 'root' },] },
@@ -4359,7 +4431,10 @@ var CdkConnectedOverlay = /** @class */ (function () {
      * @return {?}
      */
     function () {
-        this._destroyOverlay();
+        if (this._overlayRef) {
+            this._overlayRef.dispose();
+        }
+        this._backdropSubscription.unsubscribe();
     };
     /**
      * @param {?} changes
@@ -4372,6 +4447,12 @@ var CdkConnectedOverlay = /** @class */ (function () {
     function (changes) {
         if (this._position) {
             this._updatePositionStrategy(this._position);
+            this._overlayRef.updateSize({
+                width: this.width,
+                minWidth: this.minWidth,
+                height: this.height,
+                minHeight: this.minHeight,
+            });
             if (changes['origin'] && this.open) {
                 this._position.apply();
             }
@@ -4515,12 +4596,7 @@ var CdkConnectedOverlay = /** @class */ (function () {
         }
         else {
             // Update the overlay size, in case the directive's inputs have changed
-            this._overlayRef.updateSize({
-                width: this.width,
-                minWidth: this.minWidth,
-                height: this.height,
-                minHeight: this.minHeight,
-            });
+            this._overlayRef.getConfig().hasBackdrop = this.hasBackdrop;
         }
         if (!this._overlayRef.hasAttached()) {
             this._overlayRef.attach(this._templatePortal);
@@ -4531,6 +4607,9 @@ var CdkConnectedOverlay = /** @class */ (function () {
                 _this.backdropClick.emit(event);
             });
         }
+        else {
+            this._backdropSubscription.unsubscribe();
+        }
     };
     /** Detaches the overlay and unsubscribes to backdrop clicks if backdrop exists */
     /**
@@ -4550,23 +4629,6 @@ var CdkConnectedOverlay = /** @class */ (function () {
         }
         this._backdropSubscription.unsubscribe();
     };
-    /** Destroys the overlay created by this directive. */
-    /**
-     * Destroys the overlay created by this directive.
-     * @private
-     * @return {?}
-     */
-    CdkConnectedOverlay.prototype._destroyOverlay = /**
-     * Destroys the overlay created by this directive.
-     * @private
-     * @return {?}
-     */
-    function () {
-        if (this._overlayRef) {
-            this._overlayRef.dispose();
-        }
-        this._backdropSubscription.unsubscribe();
-    };
     CdkConnectedOverlay.decorators = [
         { type: Directive, args: [{
                     selector: '[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]',