From 6416babbb01f9336071b3d8960c038e0a90a6e17 Mon Sep 17 00:00:00 2001 From: mbehrlich Date: Thu, 8 Aug 2019 15:49:05 -0700 Subject: [PATCH] feat(google-maps): add google-map component skeleton (#16623) --- .github/CODEOWNERS | 2 + package.json | 1 + packages.bzl | 7 +++ src/dev-app/BUILD.bazel | 4 +- src/dev-app/dev-app/dev-app-layout.ts | 1 + src/dev-app/dev-app/routes.ts | 1 + .../google-map/google-map-demo-module.ts | 28 ++++++++++ src/dev-app/google-map/google-map-demo.html | 1 + src/dev-app/google-map/google-map-demo.ts | 27 ++++++++++ src/dev-app/system-config.ts | 3 ++ src/dev-app/tsconfig-aot.json | 1 + src/dev-app/tsconfig-build.json | 1 + src/dev-app/tsconfig.json | 1 + src/google-maps/BUILD.bazel | 33 ++++++++++++ src/google-maps/README.md | 0 src/google-maps/google-map/BUILD.bazel | 51 +++++++++++++++++++ .../google-map/google-map-module.ts | 16 ++++++ src/google-maps/google-map/google-map.md | 0 src/google-maps/google-map/google-map.spec.ts | 44 ++++++++++++++++ src/google-maps/google-map/google-map.ts | 44 ++++++++++++++++ src/google-maps/google-map/index.ts | 9 ++++ src/google-maps/google-map/public-api.ts | 10 ++++ .../google-map/testing/BUILD.bazel | 13 +++++ .../testing/fake-google-map-utils.ts | 28 ++++++++++ .../google-map/tsconfig-build.json | 15 ++++++ src/google-maps/index.ts | 9 ++++ src/google-maps/package.json | 31 +++++++++++ src/google-maps/public-api.ts | 9 ++++ src/google-maps/tsconfig-build.json | 34 +++++++++++++ src/google-maps/tsconfig-tests.json | 36 +++++++++++++ src/google-maps/tsconfig.json | 18 +++++++ src/google-maps/typings.d.ts | 1 + tools/gulp/gulpfile.ts | 2 + tools/gulp/packages.ts | 5 +- tools/gulp/tasks/aot.ts | 1 + tools/gulp/tasks/development.ts | 9 ++++ tools/gulp/tasks/unit-test.ts | 3 +- tools/gulp/tasks/universal.ts | 2 + tools/package-tools/build-release.ts | 1 + tools/package-tools/rollup-globals.ts | 10 ++++ .../release-output/release-packages.ts | 3 +- yarn.lock | 5 ++ 42 files changed, 515 insertions(+), 5 deletions(-) create mode 100644 src/dev-app/google-map/google-map-demo-module.ts create mode 100644 src/dev-app/google-map/google-map-demo.html create mode 100644 src/dev-app/google-map/google-map-demo.ts create mode 100644 src/google-maps/BUILD.bazel create mode 100644 src/google-maps/README.md create mode 100644 src/google-maps/google-map/BUILD.bazel create mode 100644 src/google-maps/google-map/google-map-module.ts create mode 100644 src/google-maps/google-map/google-map.md create mode 100644 src/google-maps/google-map/google-map.spec.ts create mode 100644 src/google-maps/google-map/google-map.ts create mode 100644 src/google-maps/google-map/index.ts create mode 100644 src/google-maps/google-map/public-api.ts create mode 100644 src/google-maps/google-map/testing/BUILD.bazel create mode 100644 src/google-maps/google-map/testing/fake-google-map-utils.ts create mode 100644 src/google-maps/google-map/tsconfig-build.json create mode 100644 src/google-maps/index.ts create mode 100644 src/google-maps/package.json create mode 100644 src/google-maps/public-api.ts create mode 100644 src/google-maps/tsconfig-build.json create mode 100644 src/google-maps/tsconfig-tests.json create mode 100644 src/google-maps/tsconfig.json create mode 100644 src/google-maps/typings.d.ts diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS index addc84d69d93..0e7fc85358c9 100644 --- a/.github/CODEOWNERS +++ b/.github/CODEOWNERS @@ -58,6 +58,7 @@ /src/material/core/util/** @jelbourn # Miscellaneous components +/src/google-maps/** @mbehrlich /src/youtube-player/** @nathantate # CDK @@ -141,6 +142,7 @@ /src/dev-app/expansion/** @josephperrott /src/dev-app/focus-origin/** @mmalerba /src/dev-app/gestures/** @jelbourn +/src/dev-app/google-map/** @mbehrlich /src/dev-app/grid-list/** @jelbourn /src/dev-app/icon/** @jelbourn /src/dev-app/input/** @mmalerba diff --git a/package.json b/package.json index 0bd3c84e6cc5..364eec848884 100644 --- a/package.json +++ b/package.json @@ -46,6 +46,7 @@ "@angular/elements": "^8.1.0", "@angular/forms": "^8.1.0", "@angular/platform-browser": "^8.1.0", + "@types/googlemaps": "^3.37.0", "@types/youtube": "^0.0.38", "@webcomponents/custom-elements": "^1.1.0", "core-js": "^2.6.1", diff --git a/packages.bzl b/packages.bzl index 07192fe4fb37..05d1a51fa0f5 100644 --- a/packages.bzl +++ b/packages.bzl @@ -80,6 +80,12 @@ MATERIAL_SCSS_LIBS = [ for p in MATERIAL_PACKAGES ] +GOOGLE_MAPS_PACKAGES = [ + "google-map", +] + +GOOGLE_MAPS_TARGETS = ["//src/google-maps"] + ["//src/google-maps/%s" % p for p in GOOGLE_MAPS_PACKAGES] + MATERIAL_EXPERIMENTAL_PACKAGES = [ "mdc-button", "mdc-card", @@ -122,6 +128,7 @@ ROLLUP_GLOBALS = { "@angular/material": "ng.material", "@angular/material-experimental": "ng.materialExperimental", "@angular/youtube-player": "ng.youtubePlayer", + "@angular/google-maps": "ng.googleMaps", } # Rollup globals for cdk subpackages in the form of, e.g., {"@angular/cdk/table": "ng.cdk.table"} diff --git a/src/dev-app/BUILD.bazel b/src/dev-app/BUILD.bazel index 6e10a221a7be..82dc87e4dfec 100644 --- a/src/dev-app/BUILD.bazel +++ b/src/dev-app/BUILD.bazel @@ -1,7 +1,7 @@ package(default_visibility = ["//visibility:public"]) load("@io_bazel_rules_sass//:defs.bzl", "sass_binary") -load("//:packages.bzl", "CDK_EXPERIMENTAL_TARGETS", "CDK_TARGETS", "MATERIAL_EXPERIMENTAL_SCSS_LIBS", "MATERIAL_EXPERIMENTAL_TARGETS", "MATERIAL_TARGETS") +load("//:packages.bzl", "CDK_EXPERIMENTAL_TARGETS", "CDK_TARGETS", "GOOGLE_MAPS_TARGETS", "MATERIAL_EXPERIMENTAL_SCSS_LIBS", "MATERIAL_EXPERIMENTAL_TARGETS", "MATERIAL_TARGETS") load("//tools:defaults.bzl", "ng_module") load("//tools:sass_generate_binaries.bzl", "sass_generate_binaries") @@ -50,7 +50,7 @@ ng_module( "//src/material-experimental/mdc-slide-toggle", "//src/material-experimental/mdc-tabs", "//src/material-examples:examples", - ] + CDK_TARGETS + CDK_EXPERIMENTAL_TARGETS + MATERIAL_TARGETS + MATERIAL_EXPERIMENTAL_TARGETS, + ] + CDK_TARGETS + CDK_EXPERIMENTAL_TARGETS + MATERIAL_TARGETS + MATERIAL_EXPERIMENTAL_TARGETS + GOOGLE_MAPS_TARGETS, ) sass_binary( diff --git a/src/dev-app/dev-app/dev-app-layout.ts b/src/dev-app/dev-app/dev-app-layout.ts index 8e8c76864cdf..b5551a06c087 100644 --- a/src/dev-app/dev-app/dev-app-layout.ts +++ b/src/dev-app/dev-app/dev-app-layout.ts @@ -41,6 +41,7 @@ export class DevAppLayout { {name: 'Expansion Panel', route: '/expansion'}, {name: 'Focus Origin', route: '/focus-origin'}, {name: 'Gestures', route: '/gestures'}, + {name: 'Google Map', route: '/google-map'}, {name: 'Grid List', route: '/grid-list'}, {name: 'Icon', route: '/icon'}, {name: 'Input', route: '/input'}, diff --git a/src/dev-app/dev-app/routes.ts b/src/dev-app/dev-app/routes.ts index 30647e711954..fa69bc52d078 100644 --- a/src/dev-app/dev-app/routes.ts +++ b/src/dev-app/dev-app/routes.ts @@ -40,6 +40,7 @@ export const DEV_APP_ROUTES: Routes = [ loadChildren: 'focus-origin/focus-origin-demo-module#FocusOriginDemoModule' }, {path: 'gestures', loadChildren: 'gestures/gestures-demo-module#GesturesDemoModule'}, + {path: 'google-map', loadChildren: 'google-map/google-map-demo-module#GoogleMapDemoModule'}, {path: 'grid-list', loadChildren: 'grid-list/grid-list-demo-module#GridListDemoModule'}, {path: 'icon', loadChildren: 'icon/icon-demo-module#IconDemoModule'}, {path: 'input', loadChildren: 'input/input-demo-module#InputDemoModule'}, diff --git a/src/dev-app/google-map/google-map-demo-module.ts b/src/dev-app/google-map/google-map-demo-module.ts new file mode 100644 index 000000000000..5473fb36884c --- /dev/null +++ b/src/dev-app/google-map/google-map-demo-module.ts @@ -0,0 +1,28 @@ +/** + * @license + * Copyright Google LLC 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 {CommonModule} from '@angular/common'; +import {HttpClientJsonpModule, HttpClientModule} from '@angular/common/http'; +import {NgModule} from '@angular/core'; +import {GoogleMapModule} from '@angular/google-maps/google-map'; +import {RouterModule} from '@angular/router'; + +import {GoogleMapDemo} from './google-map-demo'; + +@NgModule({ + imports: [ + CommonModule, + GoogleMapModule, + HttpClientJsonpModule, + HttpClientModule, + RouterModule.forChild([{path: '', component: GoogleMapDemo}]), + ], + declarations: [GoogleMapDemo], +}) +export class GoogleMapDemoModule { +} diff --git a/src/dev-app/google-map/google-map-demo.html b/src/dev-app/google-map/google-map-demo.html new file mode 100644 index 000000000000..5306f88e4231 --- /dev/null +++ b/src/dev-app/google-map/google-map-demo.html @@ -0,0 +1 @@ + diff --git a/src/dev-app/google-map/google-map-demo.ts b/src/dev-app/google-map/google-map-demo.ts new file mode 100644 index 000000000000..46f1f8dfd61b --- /dev/null +++ b/src/dev-app/google-map/google-map-demo.ts @@ -0,0 +1,27 @@ +/** + * @license + * Copyright Google LLC 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 {Component} from '@angular/core'; +import {HttpClient} from '@angular/common/http'; + +/** Demo Component for @angular/google-maps/map */ +@Component({ + moduleId: module.id, + selector: 'google-map-demo', + templateUrl: 'google-map-demo.html', +}) +export class GoogleMapDemo { + isReady = false; + + constructor(httpClient: HttpClient) { + httpClient.jsonp('https://maps.googleapis.com/maps/api/js?', 'callback') + .subscribe(() => { + this.isReady = true; + }); + } +} diff --git a/src/dev-app/system-config.ts b/src/dev-app/system-config.ts index dc48a9cef3b5..7f72ccaa2e79 100644 --- a/src/dev-app/system-config.ts +++ b/src/dev-app/system-config.ts @@ -153,6 +153,9 @@ System.config({ 'dist/packages/material-experimental/mdc-helpers/index.js', '@angular/material-experimental/popover-edit': 'dist/packages/material-experimental/popover-edit/index.js', + + '@angular/google-maps/google-map': + 'dist/packages/google-maps/google-map/index.js', }, packages: { // Set the default extension for the root package, because otherwise the dev-app can't diff --git a/src/dev-app/tsconfig-aot.json b/src/dev-app/tsconfig-aot.json index 8a77a4133581..241372773c2f 100644 --- a/src/dev-app/tsconfig-aot.json +++ b/src/dev-app/tsconfig-aot.json @@ -28,6 +28,7 @@ "@angular/cdk-experimental/*": ["../../dist/releases/cdk-experimental/*"], "@angular/cdk-experimental": ["../../dist/releases/cdk-experimental"], "@angular/material-moment-adapter": ["../../dist/releases/material-moment-adapter"], + "@angular/google-maps/*": ["../../dist/releases/google-maps/*"], "@angular/material-examples": ["../../dist/releases/material-examples"] } }, diff --git a/src/dev-app/tsconfig-build.json b/src/dev-app/tsconfig-build.json index 65e321f9847f..1554986cc8c3 100644 --- a/src/dev-app/tsconfig-build.json +++ b/src/dev-app/tsconfig-build.json @@ -35,6 +35,7 @@ "@angular/cdk-experimental/*": ["../../dist/packages/cdk-experimental/*"], "@angular/cdk-experimental": ["../../dist/packages/cdk-experimental"], "@angular/material-moment-adapter": ["../../dist/packages/material-moment-adapter"], + "@angular/google-maps/*": ["../../dist/packages/google-maps/*"], "@angular/material-examples": ["../../dist/packages/material-examples"] } }, diff --git a/src/dev-app/tsconfig.json b/src/dev-app/tsconfig.json index db38073c8275..74ead8d0563b 100644 --- a/src/dev-app/tsconfig.json +++ b/src/dev-app/tsconfig.json @@ -14,6 +14,7 @@ "@angular/cdk-experimental/*": ["../cdk-experimental/*"], "@angular/cdk-experimental": ["../cdk-experimental"], "@angular/material-moment-adapter": ["../material-moment-adapter/public-api.ts"], + "@angular/google-maps/*": ["../google-maps/*"], "@angular/material-examples": ["../../dist/packages/material-examples"] } }, diff --git a/src/google-maps/BUILD.bazel b/src/google-maps/BUILD.bazel new file mode 100644 index 000000000000..c1dcec127f86 --- /dev/null +++ b/src/google-maps/BUILD.bazel @@ -0,0 +1,33 @@ +package(default_visibility = ["//visibility:public"]) + +load("//:packages.bzl", "GOOGLE_MAPS_PACKAGES", "GOOGLE_MAPS_TARGETS", "ROLLUP_GLOBALS") +load("//tools:defaults.bzl", "ng_module", "ng_package") + +# Root "@angular/google-maps" entry-point that does not re-export individual entry-points. +ng_module( + name = "google-maps", + srcs = glob( + ["*.ts"], + exclude = ["**/*.spec.ts"], + ), + module_name = "@angular/google-maps", + deps = ["//src/google-maps/%s" % p for p in GOOGLE_MAPS_PACKAGES] + [ + "@npm//@angular/core", + "@npm//@types/googlemaps", + ], +) + +filegroup( + name = "overviews", + srcs = ["//src/google-maps/%s:overview" % name for name in GOOGLE_MAPS_PACKAGES], +) + +# Creates the @angular/google-maps package published to npm +ng_package( + name = "npm_package", + srcs = ["package.json"], + entry_point = ":public-api.ts", + entry_point_name = "google-maps", + globals = ROLLUP_GLOBALS, + deps = GOOGLE_MAPS_TARGETS, +) diff --git a/src/google-maps/README.md b/src/google-maps/README.md new file mode 100644 index 000000000000..e69de29bb2d1 diff --git a/src/google-maps/google-map/BUILD.bazel b/src/google-maps/google-map/BUILD.bazel new file mode 100644 index 000000000000..29bfa1e34ca7 --- /dev/null +++ b/src/google-maps/google-map/BUILD.bazel @@ -0,0 +1,51 @@ +package(default_visibility = ["//visibility:public"]) + +load( + "//tools:defaults.bzl", + "markdown_to_html", + "ng_module", + "ng_test_library", + "ng_web_test_suite", +) + +ng_module( + name = "google-map", + srcs = glob( + ["**/*.ts"], + exclude = ["**/*.spec.ts"], + ), + module_name = "@angular/google-maps/google-map", + deps = [ + "@npm//@angular/core", + "@npm//@types/googlemaps", + "@npm//rxjs", + ], +) + +ng_test_library( + name = "unit_test_sources", + srcs = glob( + ["**/*.spec.ts"], + exclude = ["**/*.e2e.spec.ts"], + ), + deps = [ + ":google-map", + "//src/google-maps/google-map/testing", + "@npm//@angular/platform-browser", + ], +) + +ng_web_test_suite( + name = "unit_tests", + deps = [":unit_test_sources"], +) + +markdown_to_html( + name = "overview", + srcs = [":google-map.md"], +) + +filegroup( + name = "source-files", + srcs = glob(["**/*.ts"]), +) diff --git a/src/google-maps/google-map/google-map-module.ts b/src/google-maps/google-map/google-map-module.ts new file mode 100644 index 000000000000..3d4c69dc21e9 --- /dev/null +++ b/src/google-maps/google-map/google-map-module.ts @@ -0,0 +1,16 @@ +/** + * @license + * Copyright Google LLC 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} from '@angular/core'; + import {GoogleMap} from './google-map'; + + @NgModule({ + exports: [GoogleMap], + declarations: [GoogleMap], + }) + export class GoogleMapModule {} diff --git a/src/google-maps/google-map/google-map.md b/src/google-maps/google-map/google-map.md new file mode 100644 index 000000000000..e69de29bb2d1 diff --git a/src/google-maps/google-map/google-map.spec.ts b/src/google-maps/google-map/google-map.spec.ts new file mode 100644 index 000000000000..a20311b9c18e --- /dev/null +++ b/src/google-maps/google-map/google-map.spec.ts @@ -0,0 +1,44 @@ +import {Component} from '@angular/core'; +import {async, TestBed} from '@angular/core/testing'; +import {By} from '@angular/platform-browser'; + +import {createMapConstructorSpy, createMapSpy} from './testing/fake-google-map-utils'; +import {GoogleMapModule} from './index'; + +const DEFAULT_OPTIONS: google.maps.MapOptions = { + center: {lat: 37.421995, lng: -122.084092}, + zoom: 17, +}; + +describe('GoogleMap', () => { + let mapConstructorSpy: jasmine.Spy; + let mapSpy: jasmine.SpyObj; + + beforeEach(async(() => { + mapSpy = createMapSpy(DEFAULT_OPTIONS); + mapConstructorSpy = createMapConstructorSpy(mapSpy); + + TestBed.configureTestingModule({ + imports: [GoogleMapModule], + declarations: [TestApp], + }); + })); + + beforeEach(() => { + TestBed.compileComponents(); + }); + + it('initializes a Google map', () => { + const fixture = TestBed.createComponent(TestApp); + const container = fixture.debugElement.query(By.css('div')); + fixture.detectChanges(); + + expect(mapConstructorSpy).toHaveBeenCalledWith(container.nativeElement, DEFAULT_OPTIONS); + }); +}); + +@Component({ + selector: 'test-app', + template: ``, +}) +class TestApp {} diff --git a/src/google-maps/google-map/google-map.ts b/src/google-maps/google-map/google-map.ts new file mode 100644 index 000000000000..d0afa36f69fe --- /dev/null +++ b/src/google-maps/google-map/google-map.ts @@ -0,0 +1,44 @@ +import { + ChangeDetectionStrategy, + Component, + ElementRef, + Input, + OnInit, +} from '@angular/core'; +import {ReplaySubject} from 'rxjs'; + +/** + * Angular component that renders a Google Map via the Google Maps JavaScript + * API. + * @see https://developers.google.com/maps/documentation/javascript/reference/ + */ +@Component({ + selector: 'google-map', + changeDetection: ChangeDetectionStrategy.OnPush, + template: '
', +}) +export class GoogleMap implements OnInit { + // Arbitrarily chosen default size + @Input() height = '500px'; + @Input() width = '500px'; + + // TODO(mbehrlich): add options, handlers, properties, and methods. + + private readonly _map$ = new ReplaySubject(1); + + constructor(private readonly _elementRef: ElementRef) {} + + ngOnInit() { + // default options set to the Googleplex + const options: google.maps.MapOptions = { + center: {lat: 37.421995, lng: -122.084092}, + zoom: 17, + }; + + const mapEl = this._elementRef.nativeElement.querySelector('.map-container'); + mapEl.style.height = this.height; + mapEl.style.width = this.width; + const map = new google.maps.Map(mapEl, options); + this._map$.next(map); + } +} diff --git a/src/google-maps/google-map/index.ts b/src/google-maps/google-map/index.ts new file mode 100644 index 000000000000..676ca90f1ffa --- /dev/null +++ b/src/google-maps/google-map/index.ts @@ -0,0 +1,9 @@ +/** + * @license + * Copyright Google LLC 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'; diff --git a/src/google-maps/google-map/public-api.ts b/src/google-maps/google-map/public-api.ts new file mode 100644 index 000000000000..8e9058eaa1d7 --- /dev/null +++ b/src/google-maps/google-map/public-api.ts @@ -0,0 +1,10 @@ +/** + * @license + * Copyright Google LLC 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 './google-map-module'; +export * from './google-map'; diff --git a/src/google-maps/google-map/testing/BUILD.bazel b/src/google-maps/google-map/testing/BUILD.bazel new file mode 100644 index 000000000000..b86e83bc7f72 --- /dev/null +++ b/src/google-maps/google-map/testing/BUILD.bazel @@ -0,0 +1,13 @@ +package(default_visibility = ["//visibility:public"]) + +load("//tools:defaults.bzl", "ts_library") + +ts_library( + name = "testing", + testonly = 1, + srcs = glob(["**/*.ts"]), + deps = [ + "@npm//@types/googlemaps", + "@npm//@types/jasmine", + ], +) diff --git a/src/google-maps/google-map/testing/fake-google-map-utils.ts b/src/google-maps/google-map/testing/fake-google-map-utils.ts new file mode 100644 index 000000000000..b57979d9d285 --- /dev/null +++ b/src/google-maps/google-map/testing/fake-google-map-utils.ts @@ -0,0 +1,28 @@ +declare global { + interface Window { + google?: { + maps: { + Map: jasmine.Spy; + }; + }; + } +} + +/** Creates a jasmine.SpyObj for a google.maps.Map. */ +export function createMapSpy(options: google.maps.MapOptions): jasmine.SpyObj { + return jasmine.createSpyObj('Map', ['getDiv']); +} + +/** Creates a jasmine.Spy to watch for the constructor of a google.maps.Map. */ +export function createMapConstructorSpy(mapSpy: jasmine.SpyObj): jasmine.Spy { + const mapConstructorSpy = + jasmine.createSpy('Map constructor', (_el: Element, _options: google.maps.MapOptions) => { + return mapSpy; + }); + window.google = { + maps: { + 'Map': mapConstructorSpy, + } + }; + return mapConstructorSpy; +} diff --git a/src/google-maps/google-map/tsconfig-build.json b/src/google-maps/google-map/tsconfig-build.json new file mode 100644 index 000000000000..5204b9ba30de --- /dev/null +++ b/src/google-maps/google-map/tsconfig-build.json @@ -0,0 +1,15 @@ +{ + "extends": "../tsconfig-build", + "files": [ + "public-api.ts", + "../typings.d.ts" + ], + "angularCompilerOptions": { + "annotateForClosureCompiler": true, + "strictMetadataEmit": true, + "flatModuleOutFile": "index.js", + "flatModuleId": "@angular/google-maps/google-map", + "skipTemplateCodegen": true, + "fullTemplateTypeCheck": true + } +} diff --git a/src/google-maps/index.ts b/src/google-maps/index.ts new file mode 100644 index 000000000000..676ca90f1ffa --- /dev/null +++ b/src/google-maps/index.ts @@ -0,0 +1,9 @@ +/** + * @license + * Copyright Google LLC 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'; diff --git a/src/google-maps/package.json b/src/google-maps/package.json new file mode 100644 index 000000000000..19378e0c9ef4 --- /dev/null +++ b/src/google-maps/package.json @@ -0,0 +1,31 @@ +{ + "name": "@angular/google-maps", + "version": "0.0.0-PLACEHOLDER", + "description": "Angular Google Maps", + "main": "./bundles/google-maps.umd.js", + "module": "./esm5/google-maps.es5.js", + "es2015": "./esm2015/google-maps.js", + "typings": "./google-maps.d.ts", + "repository": { + "type": "git", + "url": "https://github.com/angular/components.git" + }, + "keywords": [ + "angular", + "components", + "google-maps" + ], + "license": "MIT", + "bugs": { + "url": "https://github.com/angular/components/issues" + }, + "homepage": "https://github.com/angular/components/tree/master/src/google-maps#readme", + "dependencies": { + "@types/googlemaps": "^3.37.0" + }, + "peerDependencies": { + "@angular/core": "0.0.0-NG", + "@angular/common": "0.0.0-NG" + }, + "sideEffects": false +} diff --git a/src/google-maps/public-api.ts b/src/google-maps/public-api.ts new file mode 100644 index 000000000000..9d11682064d7 --- /dev/null +++ b/src/google-maps/public-api.ts @@ -0,0 +1,9 @@ +/** + * @license + * Copyright Google LLC 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 '@angular/google-maps/google-map'; diff --git a/src/google-maps/tsconfig-build.json b/src/google-maps/tsconfig-build.json new file mode 100644 index 000000000000..7b8486eb9abc --- /dev/null +++ b/src/google-maps/tsconfig-build.json @@ -0,0 +1,34 @@ +// TypeScript config file that is used to compile the Google Maps package through Gulp. As the +// long term goal is to switch to Bazel, and we already want to run tests with Bazel, we need to +// ensure the TypeScript build options are the same for Gulp and Bazel. We achieve this by +// extending the generic Bazel build tsconfig which will be used for each entry-point. +{ + "extends": "../bazel-tsconfig-build.json", + "compilerOptions": { + "baseUrl": ".", + "outDir": "../../dist/packages/google-maps", + "rootDir": ".", + "rootDirs": [ + ".", + "../../dist/packages/google-maps" + ], + "paths": { + "@angular/google-maps/*": ["../../dist/packages/google-maps/*"] + }, + "types": [ + "googlemaps" + ] + }, + "files": [ + "public-api.ts", + "typings.d.ts" + ], + "angularCompilerOptions": { + "annotateForClosureCompiler": true, + "strictMetadataEmit": true, + "flatModuleOutFile": "index.js", + "flatModuleId": "@angular/google-maps", + "skipTemplateCodegen": true, + "fullTemplateTypeCheck": true + } +} diff --git a/src/google-maps/tsconfig-tests.json b/src/google-maps/tsconfig-tests.json new file mode 100644 index 000000000000..713d01322f47 --- /dev/null +++ b/src/google-maps/tsconfig-tests.json @@ -0,0 +1,36 @@ +// TypeScript config file that extends the default tsconfig file for the library. This config is +// used to compile the tests for Karma. Since the code will run inside of the browser, the target +// needs to be ES5. The format needs to be CommonJS since Karma only supports that module format. +{ + "extends": "./tsconfig-build", + "compilerOptions": { + "importHelpers": false, + "module": "commonjs", + "target": "es5", + "types": [ + "jasmine", + "googlemaps" + ], + "paths": { + "@angular/google-maps/*": ["./*"] + } + }, + "angularCompilerOptions": { + "strictMetadataEmit": true, + "skipTemplateCodegen": true, + "emitDecoratorMetadata": true, + "fullTemplateTypeCheck": true, + // Unset options inherited from tsconfig-build + "annotateForClosureCompiler": false, + "flatModuleOutFile": null, + "flatModuleId": null + }, + "include": [ + "**/*.spec.ts", + "index.ts" + ], + "exclude": [ + "**/schematics/**/*.ts", + "**/*.e2e.spec.ts" + ] +} diff --git a/src/google-maps/tsconfig.json b/src/google-maps/tsconfig.json new file mode 100644 index 000000000000..b654928fc517 --- /dev/null +++ b/src/google-maps/tsconfig.json @@ -0,0 +1,18 @@ +// Configuration for IDEs only. +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "rootDir": "..", + "baseUrl": ".", + "paths": { + "@angular/google-maps": ["./*"] + }, + "types": [ + "jasmine", + "googlemaps" + ] + }, + "include": [ + "./**/*.ts" + ] +} diff --git a/src/google-maps/typings.d.ts b/src/google-maps/typings.d.ts new file mode 100644 index 000000000000..ce4ae9b66cf0 --- /dev/null +++ b/src/google-maps/typings.d.ts @@ -0,0 +1 @@ +declare var module: {id: string}; diff --git a/tools/gulp/gulpfile.ts b/tools/gulp/gulpfile.ts index 0ea915c77660..91d8d1e240d6 100644 --- a/tools/gulp/gulpfile.ts +++ b/tools/gulp/gulpfile.ts @@ -5,6 +5,7 @@ import { cdkExperimentalPackage, cdkPackage, examplesPackage, + googleMapsPackage, materialExperimentalPackage, materialPackage, momentAdapterPackage, @@ -18,6 +19,7 @@ createPackageBuildTasks(materialExperimentalPackage); createPackageBuildTasks(examplesPackage, ['build-examples-module']); createPackageBuildTasks(momentAdapterPackage); createPackageBuildTasks(youTubePlayerPackage); +createPackageBuildTasks(googleMapsPackage); import './tasks/aot'; import './tasks/breaking-changes'; diff --git a/tools/gulp/packages.ts b/tools/gulp/packages.ts index d5ce1fc59550..501a6726974b 100644 --- a/tools/gulp/packages.ts +++ b/tools/gulp/packages.ts @@ -3,6 +3,7 @@ import {BuildPackage} from 'material2-build-tools'; export const cdkPackage = new BuildPackage('cdk'); export const materialPackage = new BuildPackage('material', [cdkPackage]); export const youTubePlayerPackage = new BuildPackage('youtube-player'); +export const googleMapsPackage = new BuildPackage('google-maps'); export const cdkExperimentalPackage = new BuildPackage('cdk-experimental', [cdkPackage]); export const materialExperimentalPackage = new BuildPackage('material-experimental', [cdkPackage, cdkExperimentalPackage, materialPackage]); @@ -12,7 +13,8 @@ export const examplesPackage = new BuildPackage('material-examples', [ cdkExperimentalPackage, materialPackage, materialExperimentalPackage, - momentAdapterPackage + momentAdapterPackage, + googleMapsPackage, ]); // The material package re-exports its secondary entry-points at the root so that all of the @@ -37,5 +39,6 @@ export const allBuildPackages = [ cdkExperimentalPackage, materialExperimentalPackage, momentAdapterPackage, + googleMapsPackage, examplesPackage ]; diff --git a/tools/gulp/tasks/aot.ts b/tools/gulp/tasks/aot.ts index c0f508392d55..2410663363b7 100644 --- a/tools/gulp/tasks/aot.ts +++ b/tools/gulp/tasks/aot.ts @@ -36,6 +36,7 @@ task('build-aot:release-packages', sequenceTask( 'cdk-experimental:build-release', 'material-experimental:build-release', 'material-moment-adapter:build-release', + 'google-maps:build-release', 'material-examples:build-release', ], )); diff --git a/tools/gulp/tasks/development.ts b/tools/gulp/tasks/development.ts index 5fa800bfde18..31f368889ad5 100644 --- a/tools/gulp/tasks/development.ts +++ b/tools/gulp/tasks/development.ts @@ -14,6 +14,7 @@ import { cdkExperimentalPackage, materialPackage, momentAdapterPackage, + googleMapsPackage, examplesPackage, youTubePlayerPackage, } from '../packages'; @@ -67,6 +68,7 @@ task('build:devapp', sequenceTask( 'material-experimental:build-no-bundles', 'youtube-player:build-no-bundles', 'material-moment-adapter:build-no-bundles', + 'google-maps:build-no-bundles', 'build-examples-module', // The examples module needs to be manually built before building examples package because // when using the `no-bundles` task, the package-specific pre-build tasks won't be executed. @@ -107,6 +109,9 @@ task('stage-deploy:devapp', ['build:devapp'], () => { join(deployOutputDir, 'dist/packages/material-examples')); copyFiles(momentAdapterPackage.outputDir, '**/*.+(js|map)', join(deployOutputDir, 'dist/packages/material-moment-adapter')); + copyFiles( + googleMapsPackage.outputDir, '**/*.+(js|map)', + join(deployOutputDir, 'dist/packages/google-maps')); }); /** @@ -176,6 +181,10 @@ task(':watch:devapp', () => { watchFilesAndReload(join(cdkExperimentalPackage.sourceDir, '**/*'), ['cdk-experimental:build-no-bundles']); + // Google Maps package watchers + watchFilesAndReload(join(googleMapsPackage.sourceDir, '**/*'), + ['google-maps:build-no-bundles']); + // Example package watchers. watchFilesAndReload(join(examplesPackage.sourceDir, '**/*'), ['material-examples:build-no-bundles']); diff --git a/tools/gulp/tasks/unit-test.ts b/tools/gulp/tasks/unit-test.ts index bdf4f6c6f10c..f426d85fb737 100644 --- a/tools/gulp/tasks/unit-test.ts +++ b/tools/gulp/tasks/unit-test.ts @@ -20,7 +20,8 @@ task(':test:build', sequenceTask( 'cdk-experimental:build-no-bundles', 'material-experimental:build-no-bundles', 'youtube-player:build-no-bundles', - 'material-moment-adapter:build-no-bundles' + 'material-moment-adapter:build-no-bundles', + 'google-maps:build-no-bundles', )); /** diff --git a/tools/gulp/tasks/universal.ts b/tools/gulp/tasks/universal.ts index 1456810c1271..7610d92d5d6c 100644 --- a/tools/gulp/tasks/universal.ts +++ b/tools/gulp/tasks/universal.ts @@ -42,6 +42,7 @@ task( 'cdk-experimental:build-release', 'material-experimental:build-release', 'youtube-player:build-release', + 'google-maps:build-release', ], ['universal:copy-release', 'universal:copy-files'], ['universal:build-app-ts', 'universal:build-app-scss'], @@ -68,4 +69,5 @@ task('universal:copy-release', () => { copySync(join(releasesDir, 'cdk-experimental'), join(outDir, 'cdk-experimental')); copySync(join(releasesDir, 'material-experimental'), join(outDir, 'material-experimental')); copySync(join(releasesDir, 'youtube-player'), join(outDir, 'youtube-player')); + copySync(join(releasesDir, 'google-maps'), join(outDir, 'google-maps')); }); diff --git a/tools/package-tools/build-release.ts b/tools/package-tools/build-release.ts index 270a3bbe8f71..a64951b88ae9 100644 --- a/tools/package-tools/build-release.ts +++ b/tools/package-tools/build-release.ts @@ -137,6 +137,7 @@ const packageDirs: string[] = [ 'material-experimental', 'youtube-player', 'cdk-experimental', + 'google-maps', ]; /** diff --git a/tools/package-tools/rollup-globals.ts b/tools/package-tools/rollup-globals.ts index 4ad801be6195..5636b5524605 100644 --- a/tools/package-tools/rollup-globals.ts +++ b/tools/package-tools/rollup-globals.ts @@ -22,6 +22,10 @@ const cdkSecondaryEntryPoints = getSubdirectoryNames(join(buildConfig.packagesDi /** List of potential secondary entry-points for the material package. */ const matSecondaryEntryPoints = getSubdirectoryNames(join(buildConfig.packagesDir, 'material')); +/** List of potential secondary entry-points for the google-maps package. */ +const googleMapsSecondaryEntryPoints = + getSubdirectoryNames(join(buildConfig.packagesDir, 'google-maps')); + /** List of potential secondary entry-points for the cdk-experimental package. */ const cdkExperimentalSecondaryEntryPoints = getSubdirectoryNames(join(buildConfig.packagesDir, 'cdk-experimental')); @@ -40,6 +44,10 @@ const rollupCdkEntryPoints = generateRollupEntryPoints('cdk', cdkSecondaryEntryP /** Object with all material entry points in the format of Rollup globals. */ const rollupMatEntryPoints = generateRollupEntryPoints('material', matSecondaryEntryPoints); +/** Object with all google-maps entry points in the format of Rollup globals. */ +const rollupGoogleMapsEntryPoints = + generateRollupEntryPoints('google-maps', googleMapsSecondaryEntryPoints); + /** Object with all material-experimental entry points in the format of Rollup globals. */ const rollupMaterialExperimentalEntryPoints = generateRollupEntryPoints('material-experimental', materialExperimentalSecondaryEntryPoints); @@ -115,6 +123,7 @@ export const rollupGlobals = { '@angular/material-moment-adapter': 'ng.materialMomentAdapter', // Miscellaneous components + '@angular/google-maps': 'ng.googleMaps', '@angular/youtube-player': 'ng.youtubePlayer', // Include secondary entry-points of the cdk and material packages @@ -123,6 +132,7 @@ export const rollupGlobals = { ...rollupCdkExperimentalEntryPoints, ...rollupMaterialExperimentalEntryPoints, ...rollupYouTubePlayerEntryPoints, + ...rollupGoogleMapsEntryPoints, '@angular/cdk/private/testing': 'ng.cdk.private.testing', '@angular/cdk/private/testing/e2e': 'ng.cdk.private.testing.e2e', diff --git a/tools/release/release-output/release-packages.ts b/tools/release/release-output/release-packages.ts index da4cba1fb603..3a5ddf737b0e 100644 --- a/tools/release/release-output/release-packages.ts +++ b/tools/release/release-output/release-packages.ts @@ -5,5 +5,6 @@ export const releasePackages = [ 'youtube-player', 'cdk-experimental', 'material-experimental', - 'material-moment-adapter' + 'material-moment-adapter', + 'google-maps', ]; diff --git a/yarn.lock b/yarn.lock index f385f4166555..2fd95ca2db7b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1213,6 +1213,11 @@ "@types/minimatch" "*" "@types/node" "*" +"@types/googlemaps@^3.37.0": + version "3.37.0" + resolved "https://registry.yarnpkg.com/@types/googlemaps/-/googlemaps-3.37.0.tgz#85596a2b93ded3850ac83ff575b66c34053c0ac8" + integrity sha512-kUF1DCVJISf6HZQdgROIs98C0MS40AK5KXxyOju5L1aifNXqMkN5siSGErHYxpEMkDcTA/hu6Dr22fZBTt2qRA== + "@types/gulp-util@^3.0.34": version "3.0.34" resolved "https://registry.yarnpkg.com/@types/gulp-util/-/gulp-util-3.0.34.tgz#d1291ebf706d93f46eb8df11344bbfd96247697e"