feat(cdk): move overlay into cdk (#6100)

Author: jelbourn

scripts/closure-compiler/build-devapp-bundle.sh

@@ -24,7 +24,7 @@ $(npm bin)/ngc -p scripts/closure-compiler/tsconfig-rxjs.json
 rxjsSourceFiles=$(find dist/packages/rxjs -name '*.js');
 
 # List of entry points in the CDK package. Exclude "testing" since it's not an entry point.
-cdkEntryPoints=($(find src/cdk/* -type d ! -name testing -exec basename {} \;))
+cdkEntryPoints=($(find src/cdk -maxdepth 1 -mindepth 1 -type d -not -name testing -exec basename {} \;))
 
 # Due a Closure Compiler issue https://github.com/google/closure-compiler/issues/2247
 # we need to add exports to the different RxJS ES2015 files.

src/lib/core/overlay/_overlay.scss renamed to src/cdk/overlay/_overlay.scss

@@ -1,4 +1,16 @@
-@import '../style/variables';
+// We want overlays to always appear over user content, so set a baseline
+// very high z-index for the overlay container, which is where we create the new
+// stacking context for all overlays.
+$cdk-z-index-overlay-container: 1000;
+$cdk-z-index-overlay: 1000;
+$cdk-z-index-overlay-backdrop: 1000;
+
+// Background color for all of the backdrops
+$cdk-overlay-dark-backdrop-background: rgba(0, 0, 0, 0.6);
+
+// Default backdrop animation is based on the Material Design swift-ease-out.
+$backdrop-animation-duration: 400ms !default;
+$backdrop-animation-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;
 
 
 @mixin cdk-overlay() {
@@ -48,10 +60,7 @@
     z-index: $cdk-z-index-overlay-backdrop;
     pointer-events: auto;
     -webkit-tap-highlight-color: transparent;
-
-    // TODO(jelbourn): figure out if there are actually spec'ed colors for both light and dark
-    // themes here. Currently using the values from AngularJS Material.
-    transition: opacity $swift-ease-out-duration $swift-ease-out-timing-function;
+    transition: opacity $backdrop-animation-duration $backdrop-animation-timing-function;
     opacity: 0;
 
     &.cdk-overlay-backdrop-showing {

src/lib/core/overlay/fullscreen-overlay-container.ts renamed to src/cdk/overlay/fullscreen-overlay-container.ts

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright Google Inc. 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
+ */
+
+export * from './public_api';

src/lib/core/overlay/generic-component-type.ts renamed to src/cdk/overlay/generic-component-type.ts

@@ -1,13 +1,13 @@
-import {ComponentFixture, TestBed, async} from '@angular/core/testing';
 import {Component, ViewChild} from '@angular/core';
 import {By} from '@angular/platform-browser';
+import {ComponentFixture, TestBed, async} from '@angular/core/testing';
+import {Directionality} from '@angular/cdk/bidi';
+import {dispatchKeyboardEvent} from '@angular/cdk/testing';
+import {ESCAPE} from '@angular/cdk/keycodes';
 import {ConnectedOverlayDirective, OverlayModule, OverlayOrigin} from './index';
 import {OverlayContainer} from './overlay-container';
 import {ConnectedPositionStrategy} from './position/connected-position-strategy';
 import {ConnectedOverlayPositionChange} from './position/connected-position';
-import {Directionality} from '../bidi/index';
-import {dispatchKeyboardEvent} from '@angular/cdk/testing';
-import {ESCAPE} from '../keyboard/keycodes';
 
 
 describe('Overlay directives', () => {

src/cdk/overlay/index.ts

@@ -7,37 +7,37 @@
  */
 
 import {
-    Directive,
-    EventEmitter,
-    TemplateRef,
-    ViewContainerRef,
-    Optional,
-    Input,
-    OnDestroy,
-    Output,
-    ElementRef,
-    Renderer2,
-    OnChanges,
-    SimpleChanges,
-    InjectionToken,
-    Inject,
+  Directive,
+  ElementRef,
+  EventEmitter,
+  Inject,
+  InjectionToken,
+  Input,
+  OnChanges,
+  OnDestroy,
+  Optional,
+  Output,
+  Renderer2,
+  SimpleChanges,
+  TemplateRef,
+  ViewContainerRef,
 } from '@angular/core';
+import {Direction, Directionality} from '@angular/cdk/bidi';
+import {coerceBooleanProperty} from '@angular/cdk/coercion';
+import {ESCAPE} from '@angular/cdk/keycodes';
+import {TemplatePortal} from '@angular/cdk/portal';
 import {Overlay} from './overlay';
 import {OverlayRef} from './overlay-ref';
-import {TemplatePortal} from '../portal/portal';
 import {OverlayState} from './overlay-state';
 import {
-    ConnectionPositionPair,
-    // This import is only used to define a generic type. The current TypeScript version incorrectly
-    // considers such imports as unused (https://github.com/Microsoft/TypeScript/issues/14953)
-    // tslint:disable-next-line:no-unused-variable
-    ConnectedOverlayPositionChange
+  // This import is only used to define a generic type. The current TypeScript version incorrectly
+  // considers such imports as unused (https://github.com/Microsoft/TypeScript/issues/14953)
+  // tslint:disable-next-line:no-unused-variable
+  ConnectedOverlayPositionChange,
+  ConnectionPositionPair,
 } from './position/connected-position';
 import {ConnectedPositionStrategy} from './position/connected-position-strategy';
-import {Directionality, Direction} from '../bidi/index';
-import {coerceBooleanProperty} from '@angular/cdk/coercion';
-import {ScrollStrategy, RepositionScrollStrategy} from './scroll/index';
-import {ESCAPE} from '../keyboard/keycodes';
+import {RepositionScrollStrategy, ScrollStrategy} from './scroll/index';
 import {Subscription} from 'rxjs/Subscription';
 
 
@@ -56,7 +56,8 @@ export const MD_CONNECTED_OVERLAY_SCROLL_STRATEGY =
     new InjectionToken<() => ScrollStrategy>('md-connected-overlay-scroll-strategy');
 
 /** @docs-private */
-export function MD_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay: Overlay) {
+export function MD_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay: Overlay):
+    () => RepositionScrollStrategy {
   return () => overlay.scrollStrategies.reposition();
 }
 

src/lib/core/overlay/overlay-container.ts renamed to src/cdk/overlay/overlay-container.ts

@@ -0,0 +1,3 @@
+@import './overlay';
+
+@include cdk-overlay();

src/lib/core/overlay/overlay-directives.spec.ts renamed to src/cdk/overlay/overlay-directives.spec.ts

@@ -7,7 +7,7 @@
  */
 
 import {NgZone} from '@angular/core';
-import {PortalHost, Portal} from '../portal/portal';
+import {PortalHost, Portal} from '@angular/cdk/portal';
 import {OverlayState} from './overlay-state';
 import {Observable} from 'rxjs/Observable';
 import {Subject} from 'rxjs/Subject';

src/lib/core/overlay/overlay-directives.ts renamed to src/cdk/overlay/overlay-directives.ts

@@ -7,7 +7,7 @@
  */
 
 import {PositionStrategy} from './position/position-strategy';
-import {Direction} from '../bidi/index';
+import {Direction} from '@angular/cdk/bidi';
 import {ScrollStrategy} from './scroll/scroll-strategy';
 import {NoopScrollStrategy} from './scroll/noop-scroll-strategy';
 

src/cdk/overlay/overlay-prebuilt.scss

@@ -1,13 +1,17 @@
-import {inject, TestBed, async, ComponentFixture} from '@angular/core/testing';
-import {NgModule, Component, ViewChild, ViewContainerRef} from '@angular/core';
-import {TemplatePortalDirective, PortalModule} from '../portal/portal-directives';
-import {TemplatePortal, ComponentPortal} from '../portal/portal';
+import {async, ComponentFixture, inject, TestBed} from '@angular/core/testing';
+import {Component, NgModule, ViewChild, ViewContainerRef} from '@angular/core';
 import {
+  ComponentPortal,
+  PortalModule,
+  TemplatePortal,
+  TemplatePortalDirective
+} from '@angular/cdk/portal';
+import {
+  Overlay,
+  OverlayContainer,
   OverlayModule,
   OverlayRef,
   OverlayState,
-  OverlayContainer,
-  Overlay,
   PositionStrategy,
   ScrollStrategy,
 } from './index';

src/lib/core/overlay/overlay-ref.ts renamed to src/cdk/overlay/overlay-ref.ts

@@ -13,8 +13,8 @@ import {
   Injector,
   NgZone,
 } from '@angular/core';
+import {DomPortalHost} from '@angular/cdk/portal';
 import {OverlayState} from './overlay-state';
-import {DomPortalHost} from '../portal/dom-portal-host';
 import {OverlayRef} from './overlay-ref';
 import {OverlayPositionBuilder} from './position/overlay-position-builder';
 import {OverlayContainer} from './overlay-container';

src/lib/core/overlay/overlay-state.ts renamed to src/cdk/overlay/overlay-state.ts

@@ -6,9 +6,9 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import {ElementRef, Injectable} from '@angular/core';
 import {ViewportRuler} from './viewport-ruler';
 import {ConnectedPositionStrategy} from './connected-position-strategy';
-import {ElementRef, Injectable} from '@angular/core';
 import {GlobalPositionStrategy} from './global-position-strategy';
 import {OverlayConnectionPosition, OriginConnectionPosition} from './connected-position';
 

src/lib/core/overlay/overlay.spec.ts renamed to src/cdk/overlay/overlay.spec.ts

@@ -1,6 +1,6 @@
-import {ViewportRuler, VIEWPORT_RULER_PROVIDER} from './viewport-ruler';
 import {TestBed, inject} from '@angular/core/testing';
 import {ScrollDispatchModule} from '../scroll/index';
+import {ViewportRuler, VIEWPORT_RULER_PROVIDER} from './viewport-ruler';
 
 
 // For all tests, we assume the browser window is 1024x786 (outerWidth x outerHeight).

src/lib/core/overlay/overlay.ts renamed to src/cdk/overlay/overlay.ts

@@ -0,0 +1,55 @@
+/**
+ * @license
+ * Copyright Google Inc. 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 {NgModule, Provider} from '@angular/core';
+import {PortalModule} from '@angular/cdk/portal';
+import {Overlay} from './overlay';
+import {ScrollDispatchModule} from './scroll/index';
+import {
+  ConnectedOverlayDirective,
+  OverlayOrigin,
+  MD_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER,
+} from './overlay-directives';
+import {OverlayPositionBuilder} from './position/overlay-position-builder';
+import {VIEWPORT_RULER_PROVIDER} from './position/viewport-ruler';
+import {OVERLAY_CONTAINER_PROVIDER} from './overlay-container';
+
+
+export const OVERLAY_PROVIDERS: Provider[] = [
+  Overlay,
+  OverlayPositionBuilder,
+  VIEWPORT_RULER_PROVIDER,
+  OVERLAY_CONTAINER_PROVIDER,
+  MD_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER,
+];
+
+@NgModule({
+  imports: [PortalModule, ScrollDispatchModule],
+  exports: [ConnectedOverlayDirective, OverlayOrigin, ScrollDispatchModule],
+  declarations: [ConnectedOverlayDirective, OverlayOrigin],
+  providers: [OVERLAY_PROVIDERS],
+})
+export class OverlayModule {}
+
+
+export {Overlay} from './overlay';
+export {OverlayContainer} from './overlay-container';
+export {FullscreenOverlayContainer} from './fullscreen-overlay-container';
+export {OverlayRef} from './overlay-ref';
+export {OverlayState} from './overlay-state';
+export {ConnectedOverlayDirective, OverlayOrigin} from './overlay-directives';
+export {ViewportRuler} from './position/viewport-ruler';
+export {ComponentType} from '@angular/cdk/portal';
+
+export * from './position/connected-position';
+export * from './scroll/index';
+
+// Export pre-defined position strategies and interface to build custom ones.
+export {PositionStrategy} from './position/position-strategy';
+export {GlobalPositionStrategy} from './position/global-position-strategy';
+export {ConnectedPositionStrategy} from './position/connected-position-strategy';
+export {VIEWPORT_RULER_PROVIDER} from './position/viewport-ruler';

src/lib/core/overlay/position/connected-position-strategy.spec.ts renamed to src/cdk/overlay/position/connected-position-strategy.spec.ts

@@ -1,16 +1,15 @@
 import {NgModule, Component} from '@angular/core';
 import {inject, TestBed, async} from '@angular/core/testing';
+import {ComponentPortal, PortalModule} from '@angular/cdk/portal';
+import {Platform} from '@angular/cdk/platform';
 import {
-  ComponentPortal,
   OverlayModule,
-  PortalModule,
-  Platform,
   ViewportRuler,
   OverlayState,
   Overlay,
   OverlayRef,
   OverlayContainer,
-} from '../../core';
+} from '../index';
 
 
 describe('BlockScrollStrategy', () => {

src/lib/core/overlay/position/connected-position-strategy.ts renamed to src/cdk/overlay/position/connected-position-strategy.ts

@@ -1,16 +1,15 @@
 import {inject, TestBed, async} from '@angular/core/testing';
 import {NgModule, Component} from '@angular/core';
 import {Subject} from 'rxjs/Subject';
+import {ComponentPortal, PortalModule} from '@angular/cdk/portal';
 import {
-  PortalModule,
-  ComponentPortal,
   Overlay,
   OverlayState,
   OverlayRef,
   OverlayModule,
   ScrollDispatcher,
   OverlayContainer,
-} from '../../core';
+} from '../index';
 
 
 describe('CloseScrollStrategy', () => {

src/lib/core/overlay/position/connected-position.ts renamed to src/cdk/overlay/position/connected-position.ts

@@ -7,9 +7,9 @@
  */
 
 import {NgModule} from '@angular/core';
+import {PlatformModule} from '@angular/cdk/platform';
 import {SCROLL_DISPATCHER_PROVIDER} from './scroll-dispatcher';
 import {Scrollable} from './scrollable';
-import {PlatformModule} from '../../platform/index';
 import {ScrollStrategyOptions} from './scroll-strategy-options';
 
 export {Scrollable} from './scrollable';

src/lib/core/overlay/position/global-position-strategy.spec.ts renamed to src/cdk/overlay/position/global-position-strategy.spec.ts

@@ -1,16 +1,15 @@
-import {inject, TestBed, async} from '@angular/core/testing';
-import {NgModule, Component} from '@angular/core';
+import {async, inject, TestBed} from '@angular/core/testing';
+import {Component, NgModule} from '@angular/core';
 import {Subject} from 'rxjs/Subject';
+import {ComponentPortal, PortalModule} from '@angular/cdk/portal';
 import {
-  PortalModule,
-  ComponentPortal,
   Overlay,
-  OverlayState,
-  OverlayRef,
-  OverlayModule,
   OverlayContainer,
+  OverlayModule,
+  OverlayRef,
+  OverlayState,
   ScrollDispatcher,
-} from '../../core';
+} from '../index';
 
 
 describe('RepositionScrollStrategy', () => {

src/lib/core/overlay/position/global-position-strategy.ts renamed to src/cdk/overlay/position/global-position-strategy.ts

@@ -1,7 +1,7 @@
 import {inject, TestBed, async, fakeAsync, ComponentFixture, tick} from '@angular/core/testing';
 import {NgModule, Component, ViewChild, ElementRef} from '@angular/core';
-import {OverlayModule, Scrollable, ScrollDispatcher} from '../index';
 import {dispatchFakeEvent} from '@angular/cdk/testing';
+import {OverlayModule, Scrollable, ScrollDispatcher} from '../index';
 
 describe('Scroll Dispatcher', () => {
 

src/lib/core/overlay/position/overlay-position-builder.ts renamed to src/cdk/overlay/position/overlay-position-builder.ts

@@ -7,7 +7,7 @@
  */
 
 import {ElementRef, Injectable, NgZone, Optional, SkipSelf} from '@angular/core';
-import {Platform} from '../../platform/index';
+import {Platform} from '@angular/cdk/platform';
 import {Scrollable} from './scrollable';
 import {Subject} from 'rxjs/Subject';
 import {Subscription} from 'rxjs/Subscription';

src/lib/core/overlay/position/position-strategy.ts renamed to src/cdk/overlay/position/position-strategy.ts

@@ -0,0 +1,13 @@
+{
+  "extends": "../tsconfig-build",
+  "files": [
+    "public_api.ts"
+  ],
+  "angularCompilerOptions": {
+    "annotateForClosureCompiler": true,
+    "strictMetadataEmit": true,
+    "flatModuleOutFile": "index.js",
+    "flatModuleId": "@angular/cdk/overlay",
+    "skipTemplateCodegen": true
+  }
+}

src/lib/core/overlay/position/viewport-ruler.spec.ts renamed to src/cdk/overlay/position/viewport-ruler.spec.ts

@@ -35,7 +35,7 @@ export function throwPortalHostAlreadyDisposedError() {
  * @docs-private
  */
 export function throwUnknownPortalTypeError() {
-  throw Error('Attempting to attach an unknown Portal type. BasePortalHost accepts either' +
+  throw Error('Attempting to attach an unknown Portal type. BasePortalHost accepts either ' +
                   'a ComponentPortal or a TemplatePortal.');
 }
 

src/lib/core/overlay/position/viewport-ruler.ts renamed to src/cdk/overlay/position/viewport-ruler.ts

@@ -10,3 +10,4 @@ export * from './dispatch-events';
 export * from './event-objects';
 export * from './type-in-element';
 export * from './wrapped-error-message';
+export * from './fake-viewport-ruler';

src/cdk/overlay/public_api.ts

@@ -32,6 +32,7 @@ System.config({
     '@angular/cdk/coercion': 'dist/bundles/cdk-coercion.umd.js',
     '@angular/cdk/keycodes': 'dist/bundles/cdk-keycodes.umd.js',
     '@angular/cdk/observers': 'dist/bundles/cdk-observers.umd.js',
+    '@angular/cdk/overlay': 'dist/bundles/cdk-overlay-content.umd.js',
     '@angular/cdk/platform': 'dist/bundles/cdk-platform.umd.js',
     '@angular/cdk/portal': 'dist/bundles/cdk-portal.umd.js',
     '@angular/cdk/rxjs': 'dist/bundles/cdk-rxjs.umd.js',