From 167fdf745ce2a257cd614396141d282ea0db296e Mon Sep 17 00:00:00 2001
From: Andrew Seguin <andrewjs@google.com>
Date: Wed, 14 Mar 2018 13:24:27 -0700
Subject: [PATCH] feat(elements): rename API to createCustomElement (#22413)

PR Close #22413
---
 aio/src/app/custom-elements/elements-loader.ts            | 8 ++++----
 packages/elements/public_api.ts                           | 2 +-
 ...ng-element-constructor.ts => create-custom-element.ts} | 4 ++--
 ...-constructor_spec.ts => create-custom-element_spec.ts} | 8 ++++----
 tools/public_api_guard/elements/elements.d.ts             | 2 +-
 5 files changed, 12 insertions(+), 12 deletions(-)
 rename packages/elements/src/{ng-element-constructor.ts => create-custom-element.ts} (98%)
 rename packages/elements/test/{ng-element-constructor_spec.ts => create-custom-element_spec.ts} (94%)

diff --git a/aio/src/app/custom-elements/elements-loader.ts b/aio/src/app/custom-elements/elements-loader.ts
index fa61c70a44..da32cf0137 100644
--- a/aio/src/app/custom-elements/elements-loader.ts
+++ b/aio/src/app/custom-elements/elements-loader.ts
@@ -8,7 +8,7 @@ import { ELEMENT_MODULE_PATHS_TOKEN } from './element-registry';
 import { of } from 'rxjs/observable/of';
 import { Observable } from 'rxjs/Observable';
 import { fromPromise } from 'rxjs/observable/fromPromise';
-import { createNgElementConstructor } from '@angular/elements';
+import { createCustomElement } from '@angular/elements';
 
 @Injectable()
 export class ElementsLoader {
@@ -44,10 +44,10 @@ export class ElementsLoader {
 
       const elementModuleRef = elementModuleFactory.create(this.moduleRef.injector);
       const CustomElementComponent = elementModuleRef.instance.customElementComponent;
-      const NgElement =
-          createNgElementConstructor(CustomElementComponent, {injector: elementModuleRef.injector});
+      const CustomElement =
+          createCustomElement(CustomElementComponent, {injector: elementModuleRef.injector});
 
-      customElements!.define(selector, NgElement);
+      customElements!.define(selector, CustomElement);
       this.elementsToLoad.delete(selector);
 
       return customElements.whenDefined(selector);
diff --git a/packages/elements/public_api.ts b/packages/elements/public_api.ts
index afbb057fa5..75428f059f 100644
--- a/packages/elements/public_api.ts
+++ b/packages/elements/public_api.ts
@@ -12,7 +12,7 @@
  * Entry point for all public APIs of the `elements` package.
  */
 export {NgElementStrategy, NgElementStrategyEvent, NgElementStrategyFactory} from './src/element-strategy';
-export {NgElement, NgElementConfig, NgElementConstructor, WithProperties, createNgElementConstructor} from './src/ng-element-constructor';
+export {NgElement, NgElementConfig, NgElementConstructor, WithProperties, createCustomElement} from './src/create-custom-element';
 export {VERSION} from './src/version';
 
 // This file only reexports content of the `src` folder. Keep it that way.
diff --git a/packages/elements/src/ng-element-constructor.ts b/packages/elements/src/create-custom-element.ts
similarity index 98%
rename from packages/elements/src/ng-element-constructor.ts
rename to packages/elements/src/create-custom-element.ts
index 0d003d0429..1e03bbec3f 100644
--- a/packages/elements/src/ng-element-constructor.ts
+++ b/packages/elements/src/create-custom-element.ts
@@ -71,13 +71,13 @@ export interface NgElementConfig {
  * @description Builds a class that encapsulates the functionality of the provided component and
  * uses the config's information to provide more context to the class. Takes the component factory's
  * inputs and outputs to convert them to the proper custom element API and add hooks to input
- * changes. Passes the config's injector to each created instance (may be overriden with the
+ * changes. Passes the config's injector to each created instance (may be overridden with the
  * static property to affect all newly created instances, or as a constructor argument for
  * one-off creations).
  *
  * @experimental
  */
-export function createNgElementConstructor<P>(
+export function createCustomElement<P>(
     component: Type<any>, config: NgElementConfig): NgElementConstructor<P> {
   const inputs = getComponentInputs(component, config.injector);
 
diff --git a/packages/elements/test/ng-element-constructor_spec.ts b/packages/elements/test/create-custom-element_spec.ts
similarity index 94%
rename from packages/elements/test/ng-element-constructor_spec.ts
rename to packages/elements/test/create-custom-element_spec.ts
index 40cfed3751..b983f6acbb 100644
--- a/packages/elements/test/ng-element-constructor_spec.ts
+++ b/packages/elements/test/create-custom-element_spec.ts
@@ -12,7 +12,7 @@ import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
 import {Subject} from 'rxjs/Subject';
 
 import {NgElementStrategy, NgElementStrategyEvent, NgElementStrategyFactory} from '../src/element-strategy';
-import {NgElementConstructor, createNgElementConstructor} from '../src/ng-element-constructor';
+import {NgElementConstructor, createCustomElement} from '../src/create-custom-element';
 
 type WithFooBar = {
   fooFoo: string,
@@ -20,7 +20,7 @@ type WithFooBar = {
 };
 
 if (typeof customElements !== 'undefined') {
-  describe('createNgElementConstructor', () => {
+  describe('createCustomElement', () => {
     let NgElementCtor: NgElementConstructor<WithFooBar>;
     let strategy: TestStrategy;
     let strategyFactory: TestStrategyFactory;
@@ -35,7 +35,7 @@ if (typeof customElements !== 'undefined') {
             strategyFactory = new TestStrategyFactory();
             strategy = strategyFactory.testStrategy;
 
-            NgElementCtor = createNgElementConstructor(TestComponent, {injector, strategyFactory});
+            NgElementCtor = createCustomElement(TestComponent, {injector, strategyFactory});
 
             // The `@webcomponents/custom-elements/src/native-shim.js` polyfill allows us to create
             // new instances of the NgElement which extends HTMLElement, as long as we define it.
@@ -101,7 +101,7 @@ if (typeof customElements !== 'undefined') {
       beforeAll(() => {
         strategyFactory = new TestStrategyFactory();
         strategy = strategyFactory.testStrategy;
-        NgElementCtorWithChangedAttr = createNgElementConstructor(TestComponent, {
+        NgElementCtorWithChangedAttr = createCustomElement(TestComponent, {
           injector,
           strategyFactory,
           attributeToPropertyInputs: {'attr-1': 'fooFoo', 'attr-2': 'barbar'}
diff --git a/tools/public_api_guard/elements/elements.d.ts b/tools/public_api_guard/elements/elements.d.ts
index aa3e0a56f9..748c2d3175 100644
--- a/tools/public_api_guard/elements/elements.d.ts
+++ b/tools/public_api_guard/elements/elements.d.ts
@@ -1,5 +1,5 @@
 /** @experimental */
-export declare function createNgElementConstructor<P>(component: Type<any>, config: NgElementConfig): NgElementConstructor<P>;
+export declare function createCustomElement<P>(component: Type<any>, config: NgElementConfig): NgElementConstructor<P>;
 
 /** @experimental */
 export declare abstract class NgElement extends HTMLElement {