Skip to content

Commit

Permalink
feat(cdk): move overlay into cdk (#6100)
Browse files Browse the repository at this point in the history
  • Loading branch information
jelbourn authored and mmalerba committed Aug 11, 2017
1 parent 0754320 commit 4d82f83
Show file tree
Hide file tree
Showing 110 changed files with 554 additions and 535 deletions.
2 changes: 1 addition & 1 deletion scripts/closure-compiler/build-devapp-bundle.sh
Expand Up @@ -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.
Expand Down
@@ -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() {
Expand Down Expand Up @@ -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 {
Expand Down
File renamed without changes.
9 changes: 9 additions & 0 deletions src/cdk/overlay/index.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';
File renamed without changes.
@@ -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', () => {
Expand Down
Expand Up @@ -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';


Expand All @@ -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();
}

Expand Down
3 changes: 3 additions & 0 deletions src/cdk/overlay/overlay-prebuilt.scss
@@ -0,0 +1,3 @@
@import './overlay';

@include cdk-overlay();
Expand Up @@ -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';
Expand Down
Expand Up @@ -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';

Expand Down
@@ -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';
Expand Down
Expand Up @@ -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';
Expand Down
Expand Up @@ -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';

Expand Down
@@ -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).
Expand Down
File renamed without changes.
55 changes: 55 additions & 0 deletions src/cdk/overlay/public_api.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';
@@ -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', () => {
Expand Down
@@ -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', () => {
Expand Down
Expand Up @@ -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';
Expand Down
@@ -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', () => {
Expand Down
@@ -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', () => {

Expand Down
Expand Up @@ -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';
Expand Down
File renamed without changes.
File renamed without changes.
File renamed without changes.
13 changes: 13 additions & 0 deletions src/cdk/overlay/tsconfig-build.json
@@ -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
}
}
2 changes: 1 addition & 1 deletion src/cdk/portal/portal-errors.ts
Expand Up @@ -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.');
}

Expand Down
File renamed without changes.
1 change: 1 addition & 0 deletions src/cdk/testing/public_api.ts
Expand Up @@ -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';
1 change: 1 addition & 0 deletions src/demo-app/system-config.ts
Expand Up @@ -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',
Expand Down

0 comments on commit 4d82f83

Please sign in to comment.