From d2eca9fcde54045b6a53617228e821c531519a93 Mon Sep 17 00:00:00 2001 From: Roman Hotsiy Date: Fri, 6 May 2016 00:48:41 +0300 Subject: [PATCH] updated angular to rc + refactor --- build/tasks/build.js | 1 + lib/components/ApiInfo/api-info.js | 2 +- lib/components/ApiInfo/api-info.scss | 2 +- lib/components/ApiInfo/api-info.spec.js | 7 +-- lib/components/ApiLogo/api-logo.js | 2 +- lib/components/ApiLogo/api-logo.scss | 2 +- lib/components/ApiLogo/api-logo.spec.js | 7 +-- .../JsonSchema/json-schema-common.scss | 2 +- lib/components/JsonSchema/json-schema-lazy.js | 4 +- .../JsonSchema/json-schema-lazy.spec.js | 6 ++- lib/components/JsonSchema/json-schema.js | 8 +-- lib/components/JsonSchema/json-schema.spec.js | 5 +- lib/components/Method/method.html | 2 +- lib/components/Method/method.js | 26 +++++---- lib/components/Method/method.scss | 4 +- lib/components/Method/method.spec.js | 7 +-- lib/components/MethodsList/methods-list.js | 8 +-- lib/components/MethodsList/methods-list.scss | 4 +- .../MethodsList/methods-list.spec.js | 5 +- lib/components/ParamsList/params-list.js | 7 ++- lib/components/ParamsList/params-list.scss | 2 +- lib/components/Redoc/redoc.js | 40 ++++++++------ lib/components/Redoc/redoc.scss | 2 +- lib/components/Redoc/redoc.spec.js | 5 +- .../RequestSamples/request-samples.html | 6 +-- .../RequestSamples/request-samples.js | 47 ++++++++-------- .../RequestSamples/request-samples.scss | 2 +- .../ResponsesList/responses-list.js | 7 ++- .../ResponsesList/responses-list.scss | 2 +- .../ResponsesSamples/responses-samples.js | 13 ++--- .../ResponsesSamples/responses-samples.scss | 2 +- lib/components/SchemaSample/schema-sample.js | 8 +-- .../SchemaSample/schema-sample.scss | 2 +- lib/components/SideMenu/side-menu.html | 4 +- lib/components/SideMenu/side-menu.js | 20 +++---- lib/components/SideMenu/side-menu.scss | 2 +- lib/components/SideMenu/side-menu.spec.js | 5 +- lib/components/base.js | 6 +-- lib/components/index.js | 53 +++++-------------- lib/events.js | 10 ---- lib/services/events.service.js | 10 ++++ lib/services/index.js | 3 ++ .../components/DropDown/drop-down.js} | 2 +- .../components/DropDown/drop-down.scss} | 0 .../StickySidebar/sticky-sidebar.js | 2 +- .../StickySidebar/sticky-sidebar.spec.js | 6 +-- .../components/Tabs/tabs.js | 2 +- .../components/Tabs/tabs.scss | 0 .../components/Tabs/tabs.spec.js | 2 +- .../components/Zippy/zippy.html | 0 .../components/Zippy/zippy.js | 6 +-- .../components/Zippy/zippy.scss | 0 .../components/Zippy/zippy.spec.js | 4 +- lib/shared/components/index.js | 5 ++ .../styles/_share-link.scss | 0 lib/{common => shared}/styles/_variables.scss | 0 package.json | 3 ++ system.config.js | 1 - tests/helpers.js | 2 +- 59 files changed, 204 insertions(+), 193 deletions(-) delete mode 100644 lib/events.js create mode 100644 lib/services/events.service.js create mode 100644 lib/services/index.js rename lib/{common/components/DropDown/dropdown.js => shared/components/DropDown/drop-down.js} (92%) rename lib/{common/components/DropDown/dropdown.scss => shared/components/DropDown/drop-down.scss} (100%) rename lib/{common => shared}/components/StickySidebar/sticky-sidebar.js (97%) rename lib/{common => shared}/components/StickySidebar/sticky-sidebar.spec.js (90%) rename lib/{common => shared}/components/Tabs/tabs.js (96%) rename lib/{common => shared}/components/Tabs/tabs.scss (100%) rename lib/{common => shared}/components/Tabs/tabs.spec.js (98%) rename lib/{common => shared}/components/Zippy/zippy.html (100%) rename lib/{common => shared}/components/Zippy/zippy.js (79%) rename lib/{common => shared}/components/Zippy/zippy.scss (100%) rename lib/{common => shared}/components/Zippy/zippy.spec.js (96%) create mode 100644 lib/shared/components/index.js rename lib/{common => shared}/styles/_share-link.scss (100%) rename lib/{common => shared}/styles/_variables.scss (100%) diff --git a/build/tasks/build.js b/build/tasks/build.js index 69fc44a9..5361d12c 100644 --- a/build/tasks/build.js +++ b/build/tasks/build.js @@ -41,6 +41,7 @@ gulp.task('inlineTemplates', ['sass'], function() { var JS_DEV_DEPS = [ 'lib/utils/browser-update.js', 'node_modules/zone.js/dist/zone.js', + 'node_modules/zone.js/dist/long-stack-trace-zone.js', 'node_modules/reflect-metadata/Reflect.js', 'node_modules/babel-polyfill/dist/polyfill.js' ]; diff --git a/lib/components/ApiInfo/api-info.js b/lib/components/ApiInfo/api-info.js index 8fd9391c..336bbaf5 100644 --- a/lib/components/ApiInfo/api-info.js +++ b/lib/components/ApiInfo/api-info.js @@ -9,7 +9,7 @@ import OptionsManager from '../../options'; templateUrl: './lib/components/ApiInfo/api-info.html' }) @Reflect.metadata('parameters', [[SchemaManager], [OptionsManager]]) -export default class ApiInfo extends BaseComponent { +export class ApiInfo extends BaseComponent { constructor(schemaMgr, optionsMgr) { super(schemaMgr); this.optionsMgr = optionsMgr; diff --git a/lib/components/ApiInfo/api-info.scss b/lib/components/ApiInfo/api-info.scss index b7e81ba2..762471b9 100644 --- a/lib/components/ApiInfo/api-info.scss +++ b/lib/components/ApiInfo/api-info.scss @@ -1,4 +1,4 @@ -@import '../../common/styles/variables'; +@import '../../shared/styles/variables'; .api-info-header { font-weight: normal; diff --git a/lib/components/ApiInfo/api-info.spec.js b/lib/components/ApiInfo/api-info.spec.js index 6909a088..d34fdae9 100644 --- a/lib/components/ApiInfo/api-info.spec.js +++ b/lib/components/ApiInfo/api-info.spec.js @@ -4,13 +4,14 @@ import { getChildDebugElement } from 'tests/helpers'; import {Component, provide} from '@angular/core'; import { - TestComponentBuilder, - async, inject, + async, beforeEach, beforeEachProviders, it -} from '@angular/testing'; +} from '@angular/core/testing'; + +import { TestComponentBuilder } from '@angular/compiler/testing'; import ApiInfo from 'lib/components/ApiInfo/api-info'; import SchemaManager from 'lib/utils/SchemaManager'; diff --git a/lib/components/ApiLogo/api-logo.js b/lib/components/ApiLogo/api-logo.js index 46db79dd..dcf5a0bc 100644 --- a/lib/components/ApiLogo/api-logo.js +++ b/lib/components/ApiLogo/api-logo.js @@ -7,7 +7,7 @@ import {RedocComponent, BaseComponent} from '../base'; styleUrls: ['./lib/components/ApiLogo/api-logo.css'], templateUrl: './lib/components/ApiLogo/api-logo.html' }) -export default class ApiLogo extends BaseComponent { +export class ApiLogo extends BaseComponent { constructor(schemaMgr) { super(schemaMgr); } diff --git a/lib/components/ApiLogo/api-logo.scss b/lib/components/ApiLogo/api-logo.scss index 1e16b41e..7f78e62b 100644 --- a/lib/components/ApiLogo/api-logo.scss +++ b/lib/components/ApiLogo/api-logo.scss @@ -1,4 +1,4 @@ -@import '../../common/styles/variables'; +@import '../../shared/styles/variables'; img { max-height: 150px; diff --git a/lib/components/ApiLogo/api-logo.spec.js b/lib/components/ApiLogo/api-logo.spec.js index dfb3a4c6..dec6e5a3 100644 --- a/lib/components/ApiLogo/api-logo.spec.js +++ b/lib/components/ApiLogo/api-logo.spec.js @@ -4,13 +4,14 @@ import { getChildDebugElement } from 'tests/helpers'; import {Component, provide} from '@angular/core'; import { - TestComponentBuilder, - async, inject, + async, beforeEach, beforeEachProviders, it -} from '@angular/testing'; +} from '@angular/core/testing'; + +import { TestComponentBuilder } from '@angular/compiler/testing'; import ApiLogo from 'lib/components/ApiLogo/api-logo'; import SchemaManager from 'lib/utils/SchemaManager'; diff --git a/lib/components/JsonSchema/json-schema-common.scss b/lib/components/JsonSchema/json-schema-common.scss index 4b2d2953..ddcb9656 100644 --- a/lib/components/JsonSchema/json-schema-common.scss +++ b/lib/components/JsonSchema/json-schema-common.scss @@ -1,4 +1,4 @@ -@import '../../common/styles/variables'; +@import '../../shared/styles/variables'; $lines-width: 1px; $bullet-size: 1px; $cell-spacing: 25px; diff --git a/lib/components/JsonSchema/json-schema-lazy.js b/lib/components/JsonSchema/json-schema-lazy.js index dd5a4b46..5f3e1cf7 100644 --- a/lib/components/JsonSchema/json-schema-lazy.js +++ b/lib/components/JsonSchema/json-schema-lazy.js @@ -4,7 +4,7 @@ import {Component, ElementRef, ViewContainerRef} from '@angular/core'; import {CORE_DIRECTIVES} from '@angular/common'; import {DynamicComponentLoader} from '@angular/core'; -import JsonSchema from './json-schema'; +import {JsonSchema} from './json-schema'; import OptionsManager from '../../options'; import SchemaManager from '../../utils/SchemaManager'; @@ -19,7 +19,7 @@ var cache = {}; directives: [CORE_DIRECTIVES] }) @Reflect.metadata('parameters', [[SchemaManager], [ViewContainerRef], [ElementRef], [DynamicComponentLoader], [OptionsManager]]) -export default class JsonSchemaLazy { +export class JsonSchemaLazy { constructor(schemaMgr, viewRef, elementRef, dcl, optionsMgr) { this.viewRef = viewRef; diff --git a/lib/components/JsonSchema/json-schema-lazy.spec.js b/lib/components/JsonSchema/json-schema-lazy.spec.js index e8744b7e..9b4332af 100644 --- a/lib/components/JsonSchema/json-schema-lazy.spec.js +++ b/lib/components/JsonSchema/json-schema-lazy.spec.js @@ -6,12 +6,14 @@ import {DynamicComponentLoader} from '@angular/core'; import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_adapter'; import { - TestComponentBuilder, inject, beforeEach, beforeEachProviders, it -} from '@angular/testing'; +} from '@angular/core/testing'; + +import { TestComponentBuilder } from '@angular/compiler/testing'; + import JsonSchemaLazy from 'lib/components/JsonSchema/json-schema-lazy'; import SchemaManager from 'lib/utils/SchemaManager'; diff --git a/lib/components/JsonSchema/json-schema.js b/lib/components/JsonSchema/json-schema.js index 7445e7d3..3059e845 100644 --- a/lib/components/JsonSchema/json-schema.js +++ b/lib/components/JsonSchema/json-schema.js @@ -1,9 +1,9 @@ 'use strict'; -import {ElementRef} from '@angular/core'; +import { ElementRef } from '@angular/core'; -import {RedocComponent, BaseComponent, SchemaManager} from '../base'; -import {DropDown} from '../../common/components/DropDown/dropdown'; +import { RedocComponent, BaseComponent, SchemaManager } from '../base'; +import { DropDown } from '../..//shared/components/index'; import JsonPointer from '../../utils/JsonPointer'; @RedocComponent({ @@ -14,7 +14,7 @@ import JsonPointer from '../../utils/JsonPointer'; inputs: ['isArray', 'final', 'nestOdd', 'childFor', 'skipReadOnly'] }) @Reflect.metadata('parameters', [[SchemaManager], [ElementRef]]) -export default class JsonSchema extends BaseComponent { +export class JsonSchema extends BaseComponent { constructor(schemaMgr, elementRef) { super(schemaMgr); this.$element = elementRef.nativeElement; diff --git a/lib/components/JsonSchema/json-schema.spec.js b/lib/components/JsonSchema/json-schema.spec.js index 6c7f2a3c..a27840f2 100644 --- a/lib/components/JsonSchema/json-schema.spec.js +++ b/lib/components/JsonSchema/json-schema.spec.js @@ -5,12 +5,13 @@ import {Component, provide} from '@angular/core'; import OptionsManager from 'lib/options'; import { - TestComponentBuilder, inject, beforeEach, beforeEachProviders, it -} from '@angular/testing'; +} from '@angular/core/testing'; + +import { TestComponentBuilder } from '@angular/compiler/testing'; import JsonSchema from 'lib/components/JsonSchema/json-schema'; import SchemaManager from 'lib/utils/SchemaManager'; diff --git a/lib/components/Method/method.html b/lib/components/Method/method.html index f3453aff..3cd33f02 100644 --- a/lib/components/Method/method.html +++ b/lib/components/Method/method.html @@ -20,7 +20,7 @@

- +
diff --git a/lib/components/Method/method.js b/lib/components/Method/method.js index 89757c5f..d2ac94fa 100644 --- a/lib/components/Method/method.js +++ b/lib/components/Method/method.js @@ -1,22 +1,30 @@ 'use strict'; -import {JsonPointer} from '../../utils/JsonPointer'; -import {RedocComponent, BaseComponent} from '../base'; +import { forwardRef } from '@angular/core'; +import { JsonPointer } from '../../utils/JsonPointer'; +import { RedocComponent, BaseComponent } from '../base'; -import ParamsList from '../ParamsList/params-list'; -import ResponsesList from '../ResponsesList/responses-list'; -import ResponsesSamples from '../ResponsesSamples/responses-samples'; -import SchemaSample from '../SchemaSample/schema-sample'; -import RequestSamples from '../RequestSamples/request-samples'; +import { + ParamsList, + ResponsesList, + ResponsesSamples, + SchemaSample, + RequestSamples +} from '../index'; @RedocComponent({ selector: 'method', templateUrl: './lib/components/Method/method.html', styleUrls: ['./lib/components/Method/method.css'], - directives: [ParamsList, ResponsesList, ResponsesSamples, SchemaSample, RequestSamples], + directives: [ + forwardRef(() => ParamsList), + forwardRef(() => ResponsesList), + forwardRef(() => ResponsesSamples), + forwardRef(() => SchemaSample), + forwardRef(() => RequestSamples)], inputs: ['tag'] }) -export default class Method extends BaseComponent { +export class Method extends BaseComponent { constructor(schemaMgr) { super(schemaMgr); } diff --git a/lib/components/Method/method.scss b/lib/components/Method/method.scss index f3cec22a..ea625f20 100644 --- a/lib/components/Method/method.scss +++ b/lib/components/Method/method.scss @@ -1,5 +1,5 @@ -@import '../../common/styles/variables'; -@import '../../common/styles/share-link'; +@import '../../shared/styles/variables'; +@import '../../shared/styles/share-link'; :host { padding-bottom: 100px; diff --git a/lib/components/Method/method.spec.js b/lib/components/Method/method.spec.js index b36b93e5..44756606 100644 --- a/lib/components/Method/method.spec.js +++ b/lib/components/Method/method.spec.js @@ -5,13 +5,14 @@ import {Component, provide} from '@angular/core'; import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_adapter'; import { - TestComponentBuilder, - async, inject, + async, beforeEach, beforeEachProviders, it -} from '@angular/testing'; +} from '@angular/core/testing'; + +import { TestComponentBuilder } from '@angular/compiler/testing'; import Method from 'lib/components/Method/method'; import SchemaManager from 'lib/utils/SchemaManager'; diff --git a/lib/components/MethodsList/methods-list.js b/lib/components/MethodsList/methods-list.js index 32998a4f..169e5a61 100644 --- a/lib/components/MethodsList/methods-list.js +++ b/lib/components/MethodsList/methods-list.js @@ -1,8 +1,8 @@ 'use strict'; -import {RedocComponent, BaseComponent} from '../base'; -import Method from '../Method/method'; -import {EncodeURIComponentPipe} from '../../utils/pipes'; +import { RedocComponent, BaseComponent } from '../base'; +import { Method } from '../index'; +import { EncodeURIComponentPipe } from '../../utils/pipes'; @RedocComponent({ selector: 'methods-list', @@ -11,7 +11,7 @@ import {EncodeURIComponentPipe} from '../../utils/pipes'; directives: [Method], pipes: [EncodeURIComponentPipe] }) -export default class MethodsList extends BaseComponent { +export class MethodsList extends BaseComponent { constructor(schemaMgr) { super(schemaMgr); diff --git a/lib/components/MethodsList/methods-list.scss b/lib/components/MethodsList/methods-list.scss index c4d64f39..ff1465c3 100644 --- a/lib/components/MethodsList/methods-list.scss +++ b/lib/components/MethodsList/methods-list.scss @@ -1,5 +1,5 @@ -@import '../../common/styles/variables'; -@import '../../common/styles/share-link'; +@import '../../shared/styles/variables'; +@import '../../shared/styles/share-link'; .tag-info { padding: 40px; diff --git a/lib/components/MethodsList/methods-list.spec.js b/lib/components/MethodsList/methods-list.spec.js index 71ae31ea..87119c21 100644 --- a/lib/components/MethodsList/methods-list.spec.js +++ b/lib/components/MethodsList/methods-list.spec.js @@ -6,13 +6,14 @@ import OptionsManager from 'lib/options'; import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_adapter'; import { - TestComponentBuilder, inject, async, beforeEach, beforeEachProviders, it -} from '@angular/testing'; +} from '@angular/core/testing'; + +import { TestComponentBuilder } from '@angular/compiler/testing'; import MethodsList from 'lib/components/MethodsList/methods-list'; import SchemaManager from 'lib/utils/SchemaManager'; diff --git a/lib/components/ParamsList/params-list.js b/lib/components/ParamsList/params-list.js index e664af1b..1aef52a4 100644 --- a/lib/components/ParamsList/params-list.js +++ b/lib/components/ParamsList/params-list.js @@ -1,8 +1,7 @@ 'use strict'; -import {RedocComponent, BaseComponent} from '../base'; -import JsonSchema from '../JsonSchema/json-schema'; -import JsonSchemaLazy from '../JsonSchema/json-schema-lazy'; +import { RedocComponent, BaseComponent } from '../base'; +import { JsonSchema, JsonSchemaLazy } from '../index'; function safePush(obj, prop, item) { if (!obj[prop]) obj[prop] = []; @@ -15,7 +14,7 @@ function safePush(obj, prop, item) { styleUrls: ['./lib/components/ParamsList/params-list.css'], directives: [JsonSchema, JsonSchemaLazy] }) -export default class ParamsList extends BaseComponent { +export class ParamsList extends BaseComponent { constructor(schemaMgr) { super(schemaMgr); } diff --git a/lib/components/ParamsList/params-list.scss b/lib/components/ParamsList/params-list.scss index 211c04b4..f7b63f46 100644 --- a/lib/components/ParamsList/params-list.scss +++ b/lib/components/ParamsList/params-list.scss @@ -1,4 +1,4 @@ -@import '../../common/styles/variables'; +@import '../../shared/styles/variables'; $hint-color: #999999; diff --git a/lib/components/Redoc/redoc.js b/lib/components/Redoc/redoc.js index 139c995b..fdb36d27 100644 --- a/lib/components/Redoc/redoc.js +++ b/lib/components/Redoc/redoc.js @@ -1,20 +1,25 @@ 'use strict'; -import {ChangeDetectionStrategy, provide, enableProdMode} from '@angular/core'; +import {provide, enableProdMode} from '@angular/core'; import {ElementRef} from '@angular/core'; import {bootstrap} from '@angular/platform-browser-dynamic'; import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_adapter'; + import detectScollParent from 'scrollparent'; + import {RedocComponent, BaseComponent} from '../base'; import SchemaManager from '../../utils/SchemaManager'; -import ApiInfo from '../ApiInfo/api-info'; -import ApiLogo from '../ApiLogo/api-logo'; -import MethodsList from '../MethodsList/methods-list'; -import SideMenu from '../SideMenu/side-menu'; -import StickySidebar from '../../common/components/StickySidebar/sticky-sidebar'; +import { + ApiInfo, + ApiLogo, + MethodsList, + SideMenu +} from '../index'; +import { StickySidebar } from '../../shared/components/index'; + import OptionsManager from '../../options'; -import {redocEvents} from '../../events'; +import { RedocEventsService } from '../../services/index'; import './redoc-loading-styles.css!css'; @@ -25,23 +30,30 @@ var _modeLocked = false; selector: 'redoc', providers: [ SchemaManager, - BrowserDomAdapter + BrowserDomAdapter, + RedocEventsService ], templateUrl: './lib/components/Redoc/redoc.html', styleUrls: ['./lib/components/Redoc/redoc.css'], - directives: [ApiInfo, ApiLogo, MethodsList, SideMenu, StickySidebar], - changeDetection: ChangeDetectionStrategy.Default + directives: [ApiInfo, ApiLogo, MethodsList, SideMenu, StickySidebar] }) @Reflect.metadata('parameters', [ - [SchemaManager], [OptionsManager], [ElementRef]]) -export default class Redoc extends BaseComponent { - constructor(schemaMgr, optionsMgr, elementRef) { + [SchemaManager], [OptionsManager], [ElementRef], [RedocEventsService]]) +export class Redoc extends BaseComponent { + constructor(schemaMgr, optionsMgr, elementRef, events) { super(schemaMgr); this.element = elementRef.nativeElement; //parse options (top level component doesn't support inputs) optionsMgr.parseOptions( this.element ); optionsMgr.options.$scrollParent = detectScollParent( this.element ); this.options = optionsMgr.options; + this.events = events; + } + + ngAfterViewInit() { + setTimeout( () => { + this.events.bootstrapped.next(); + }); } static showLoadingAnimation() { @@ -82,8 +94,6 @@ export default class Redoc extends BaseComponent { (appRef) => { Redoc.hideLoadingAnimation(); Redoc.appRef = appRef; - // setTimeout to allow cached elements to init - setTimeout(() => redocEvents.bootstrapped.next()); console.log('ReDoc bootstrapped!'); }, error => { diff --git a/lib/components/Redoc/redoc.scss b/lib/components/Redoc/redoc.scss index a446e4f8..048e4060 100644 --- a/lib/components/Redoc/redoc.scss +++ b/lib/components/Redoc/redoc.scss @@ -1,4 +1,4 @@ -@import '../../common/styles/variables'; +@import '../../shared/styles/variables'; :host { display: block; diff --git a/lib/components/Redoc/redoc.spec.js b/lib/components/Redoc/redoc.spec.js index 032ab8f0..7bf7cb92 100644 --- a/lib/components/Redoc/redoc.spec.js +++ b/lib/components/Redoc/redoc.spec.js @@ -5,13 +5,14 @@ import {Component, ViewMetadata, provide} from '@angular/core'; import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_adapter'; import { - TestComponentBuilder, inject, async, beforeEach, beforeEachProviders, it -} from '@angular/testing'; +} from '@angular/core/testing'; + +import { TestComponentBuilder } from '@angular/compiler/testing'; import Redoc from 'lib/components/Redoc/redoc'; import SchemaManager from 'lib/utils/SchemaManager'; diff --git a/lib/components/RequestSamples/request-samples.html b/lib/components/RequestSamples/request-samples.html index 78bb0657..a11d9b1f 100644 --- a/lib/components/RequestSamples/request-samples.html +++ b/lib/components/RequestSamples/request-samples.html @@ -1,8 +1,8 @@ -
Request samples
- +
Request samples
+ - + 

diff --git a/lib/components/RequestSamples/request-samples.js b/lib/components/RequestSamples/request-samples.js
index ec8a542a..c8c65408 100644
--- a/lib/components/RequestSamples/request-samples.js
+++ b/lib/components/RequestSamples/request-samples.js
@@ -1,49 +1,50 @@
 'use strict';
 
-import {ViewChildren, QueryList, ChangeDetectorRef, ChangeDetectionStrategy} from '@angular/core';
+import { forwardRef, ViewChildren, QueryList } from '@angular/core';
 
-import {RedocComponent, BaseComponent, SchemaManager} from '../base';
+import { RedocComponent, BaseComponent, SchemaManager } from '../base';
 import JsonPointer from '../../utils/JsonPointer';
-import {Tabs, Tab} from '../../common/components/Tabs/tabs';
-import SchemaSample from '../SchemaSample/schema-sample';
-import {PrismPipe} from '../../utils/pipes';
-import {redocEvents} from '../../events';
+import { Tabs, Tab } from '../..//shared/components/index';
+import { SchemaSample } from '../index';
+import { PrismPipe } from '../../utils/pipes';
+import { RedocEventsService } from '../../services/index';
 
 @RedocComponent({
   selector: 'request-samples',
   templateUrl: './lib/components/RequestSamples/request-samples.html',
   styleUrls: ['./lib/components/RequestSamples/request-samples.css'],
-  directives: [SchemaSample, Tabs, Tab],
-  inputs: ['bodySchemaPtr'],
-  pipes: [PrismPipe],
-  changeDetection: ChangeDetectionStrategy.OnPush
+  directives: [forwardRef(() =>SchemaSample), Tabs, Tab],
+  inputs: ['schemaPointer'],
+  pipes: [PrismPipe]
 })
-@Reflect.metadata('parameters', [[SchemaManager], [new ViewChildren(Tabs), QueryList], [ChangeDetectorRef]])
-export default class RequestSamples extends BaseComponent {
-  constructor(schemaMgr, tabs, changeDetector) {
+@Reflect.metadata('parameters', [[SchemaManager], [RedocEventsService], [new ViewChildren(Tabs), QueryList]])
+export class RequestSamples extends BaseComponent {
+  constructor(schemaMgr, events, childQuery) {
     super(schemaMgr);
-    tabs.changes.subscribe(_ => {
-      this.tabs = tabs.first;
-      this.subscribeForEvents(_);
+    childQuery.changes.subscribe(() => {
+      this.childTabs = childQuery.first;
     });
-    this.changeDetector = changeDetector;
+    this.events = events;
+  }
+
+  init() {
+    this.subscribeForEvents();
   }
 
   changeLangNotify(lang) {
-    redocEvents.samplesLanguageChanged.next(lang);
+    this.events.samplesLanguageChanged.next(lang);
   }
 
   subscribeForEvents() {
-    if (!this.tabs) return;
-    redocEvents.samplesLanguageChanged.subscribe((sampleLang) => {
-      this.tabs.selectyByTitle(sampleLang);
-      this.changeDetector.markForCheck();
+    this.events.samplesLanguageChanged.subscribe((sampleLang) => {
+      if (!this.childTabs) return;
+      this.childTabs.selectyByTitle(sampleLang);
     });
   }
 
   prepareModel() {
     this.data = {};
-    this.data.bodySchemaPtr = JsonPointer.join(this.bodySchemaPtr, 'schema');
+    this.data.schemaPointer = JsonPointer.join(this.schemaPointer, 'schema');
     this.data.samples = this.componentSchema['x-code-samples'] || [];
   }
 }
diff --git a/lib/components/RequestSamples/request-samples.scss b/lib/components/RequestSamples/request-samples.scss
index 333d0420..84569503 100644
--- a/lib/components/RequestSamples/request-samples.scss
+++ b/lib/components/RequestSamples/request-samples.scss
@@ -1,4 +1,4 @@
-@import '../../common/styles/variables';
+@import '../../shared/styles/variables';
 
 header {
     font-family: $headers-font;
diff --git a/lib/components/ResponsesList/responses-list.js b/lib/components/ResponsesList/responses-list.js
index 6c85d901..2ff52f59 100644
--- a/lib/components/ResponsesList/responses-list.js
+++ b/lib/components/ResponsesList/responses-list.js
@@ -2,9 +2,8 @@
 
 import {RedocComponent, BaseComponent, SchemaManager} from '../base';
 import JsonPointer from '../../utils/JsonPointer';
-import JsonSchema from '../JsonSchema/json-schema';
-import JsonSchemaLazy from '../JsonSchema/json-schema-lazy';
-import Zippy from '../../common/components/Zippy/zippy';
+import { JsonSchema, JsonSchemaLazy } from '../index';
+import {Zippy} from '../../shared/components/index';
 import {statusCodeType} from '../../utils/helpers';
 import OptionsManager from '../../options';
 
@@ -19,7 +18,7 @@ function isNumeric(n) {
   directives: [JsonSchema, Zippy, JsonSchemaLazy]
 })
 @Reflect.metadata('parameters', [[SchemaManager], [OptionsManager]])
-export default class ResponsesList extends BaseComponent {
+export class ResponsesList extends BaseComponent {
   constructor(schemaMgr, optionsMgr) {
     super(schemaMgr);
     this.options = optionsMgr.options;
diff --git a/lib/components/ResponsesList/responses-list.scss b/lib/components/ResponsesList/responses-list.scss
index d9212b11..c63354c9 100644
--- a/lib/components/ResponsesList/responses-list.scss
+++ b/lib/components/ResponsesList/responses-list.scss
@@ -1,4 +1,4 @@
-@import '../../common/styles/variables';
+@import '../../shared/styles/variables';
 
 .responses-list-header {
   font-size: 18px;
diff --git a/lib/components/ResponsesSamples/responses-samples.js b/lib/components/ResponsesSamples/responses-samples.js
index db573f84..3515f5e9 100644
--- a/lib/components/ResponsesSamples/responses-samples.js
+++ b/lib/components/ResponsesSamples/responses-samples.js
@@ -1,10 +1,11 @@
 'use strict';
 
-import {RedocComponent, BaseComponent} from '../base';
+import { forwardRef } from '@angular/core';
+import { RedocComponent, BaseComponent } from '../base';
 import JsonPointer from '../../utils/JsonPointer';
-import {Tabs, Tab} from '../../common/components/Tabs/tabs';
-import SchemaSample from '../SchemaSample/schema-sample';
-import {statusCodeType} from '../../utils/helpers';
+import { Tabs, Tab } from '../../shared/components/index';
+import { SchemaSample } from '../index';
+import { statusCodeType } from '../../utils/helpers';
 
 
 function isNumeric(n) {
@@ -20,9 +21,9 @@ function hasExample(response) {
   selector: 'responses-samples',
   templateUrl: './lib/components/ResponsesSamples/responses-samples.html',
   styleUrls: ['./lib/components/ResponsesSamples/responses-samples.css'],
-  directives: [SchemaSample, Tabs, Tab]
+  directives: [forwardRef( ()=> SchemaSample), Tabs, Tab]
 })
-export default class ResponsesSamples extends BaseComponent {
+export class ResponsesSamples extends BaseComponent {
   constructor(schemaMgr) {
     super(schemaMgr);
   }
diff --git a/lib/components/ResponsesSamples/responses-samples.scss b/lib/components/ResponsesSamples/responses-samples.scss
index cb9ab0cd..1334dd8d 100644
--- a/lib/components/ResponsesSamples/responses-samples.scss
+++ b/lib/components/ResponsesSamples/responses-samples.scss
@@ -1,4 +1,4 @@
-@import '../../common/styles/variables';
+@import '../../shared/styles/variables';
 
 tab, tabs {
     display: block;
diff --git a/lib/components/SchemaSample/schema-sample.js b/lib/components/SchemaSample/schema-sample.js
index 21f5f09f..0c350ba1 100644
--- a/lib/components/SchemaSample/schema-sample.js
+++ b/lib/components/SchemaSample/schema-sample.js
@@ -1,11 +1,11 @@
 'use strict';
 
-import {ElementRef} from '@angular/core';
+import { ElementRef } from '@angular/core';
 
 import SchemaSampler from 'json-schema-instantiator';
 
-import {JsonFormatter} from '../../utils/JsonFormatterPipe';
-import {RedocComponent, BaseComponent, SchemaManager} from '../base';
+import { RedocComponent, BaseComponent, SchemaManager } from '../base';
+import { JsonFormatter } from '../../utils/JsonFormatterPipe';
 
 @RedocComponent({
   selector: 'schema-sample',
@@ -14,7 +14,7 @@ import {RedocComponent, BaseComponent, SchemaManager} from '../base';
   styleUrls: ['./lib/components/SchemaSample/schema-sample.css']
 })
 @Reflect.metadata('parameters', [[SchemaManager], [ElementRef]])
-export default class SchemaSample extends BaseComponent {
+export class SchemaSample extends BaseComponent {
   constructor(schemaMgr, elementRef) {
     super(schemaMgr);
     this.element = elementRef.nativeElement;
diff --git a/lib/components/SchemaSample/schema-sample.scss b/lib/components/SchemaSample/schema-sample.scss
index 13463cca..ef191331 100644
--- a/lib/components/SchemaSample/schema-sample.scss
+++ b/lib/components/SchemaSample/schema-sample.scss
@@ -1,4 +1,4 @@
-@import '../../common/styles/variables';
+@import '../../shared/styles/variables';
 
 pre {
   background-color: transparent;
diff --git a/lib/components/SideMenu/side-menu.html b/lib/components/SideMenu/side-menu.html
index 429f7db7..a947fcc1 100644
--- a/lib/components/SideMenu/side-menu.html
+++ b/lib/components/SideMenu/side-menu.html
@@ -1,11 +1,11 @@
-

+

    API Reference: 
   
      {{activeCatCaption}} 
     {{activeItemCaption}}
   
 

-

+

   
 API reference 

   

 
diff --git a/lib/components/SideMenu/side-menu.js b/lib/components/SideMenu/side-menu.js
index 5ab3ebaf..a4bf4fb1 100644
--- a/lib/components/SideMenu/side-menu.js
+++ b/lib/components/SideMenu/side-menu.js
@@ -1,11 +1,11 @@
 'use strict';
 
-import {ElementRef} from '@angular/core';
-import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_adapter';
-import {global} from '@angular/core/src/facade/lang';
+import { ElementRef } from '@angular/core';
+import { BrowserDomAdapter } from '@angular/platform-browser/src/browser/browser_adapter';
+import { global } from '@angular/core/src/facade/lang';
 
-import {RedocComponent, BaseComponent, SchemaManager} from '../base';
-import {redocEvents} from '../../events';
+import { RedocComponent, BaseComponent, SchemaManager } from '../base';
+import { RedocEventsService } from '../../services/index';
 import OptionsManager from '../../options';
 
 const CHANGE = {
@@ -26,9 +26,9 @@ const INVIEW_POSITION = {
   styleUrls: ['./lib/components/SideMenu/side-menu.css']
 })
 @Reflect.metadata('parameters', [[SchemaManager], [ElementRef],
-  [BrowserDomAdapter],  [OptionsManager]])
-export default class SideMenu extends BaseComponent {
-  constructor(schemaMgr, elementRef, dom, optionsMgr) {
+  [BrowserDomAdapter], [OptionsManager], [RedocEventsService]])
+export class SideMenu extends BaseComponent {
+  constructor(schemaMgr, elementRef, dom, optionsMgr, events) {
     super(schemaMgr);
     this.$element = elementRef.nativeElement;
     this.dom = dom;
@@ -39,14 +39,14 @@ export default class SideMenu extends BaseComponent {
     this.activeMethodIdx = -1;
     this.prevOffsetY = null;
 
-    redocEvents.bootstrapped.subscribe(() => this.hashScroll());
+    this.events = events;
 
     this.activeCatCaption = '';
     this.activeItemCaption = '';
   }
 
-
   init() {
+    this.events.bootstrapped.subscribe(() => this.hashScroll());
     this.bindEvents();
     this.$mobileNav = this.dom.querySelector(this.$element, '.mobile-nav');
     this.$resourcesNav = this.dom.querySelector(this.$element, '#resources-nav');
diff --git a/lib/components/SideMenu/side-menu.scss b/lib/components/SideMenu/side-menu.scss
index d2c7ac3e..47c026b6 100644
--- a/lib/components/SideMenu/side-menu.scss
+++ b/lib/components/SideMenu/side-menu.scss
@@ -1,4 +1,4 @@
-@import '../../common/styles/variables';
+@import '../../shared/styles/variables';
 $mobile-menu-compact-breakpoint: 550px;
 
 .menu-header {
diff --git a/lib/components/SideMenu/side-menu.spec.js b/lib/components/SideMenu/side-menu.spec.js
index 04762365..dfeecdd7 100644
--- a/lib/components/SideMenu/side-menu.spec.js
+++ b/lib/components/SideMenu/side-menu.spec.js
@@ -6,13 +6,14 @@ import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_a
 import OptionsManager from 'lib/options';
 
 import {
-  TestComponentBuilder,
   inject,
   async,
   beforeEach,
   beforeEachProviders,
   it
-} from '@angular/testing';
+} from '@angular/core/testing';
+
+import { TestComponentBuilder } from '@angular/compiler/testing';
 
 import {redocEvents} from 'lib/events';
 import MethodsList from 'lib/components/MethodsList/methods-list';
diff --git a/lib/components/base.js b/lib/components/base.js
index c3ee656f..97a1e77c 100644
--- a/lib/components/base.js
+++ b/lib/components/base.js
@@ -1,9 +1,9 @@
 'use strict';
-import {Component, ChangeDetectionStrategy} from '@angular/core';
-import {CORE_DIRECTIVES, JsonPipe, AsyncPipe} from '@angular/common';
+import { Component, ChangeDetectionStrategy } from '@angular/core';
+import { CORE_DIRECTIVES, JsonPipe, AsyncPipe } from '@angular/common';
 import SchemaManager from '../utils/SchemaManager';
 import JsonPointer from '../utils/JsonPointer';
-import {MarkedPipe, JsonPointerEscapePipe} from '../utils/pipes';
+import { MarkedPipe, JsonPointerEscapePipe } from '../utils/pipes';
 
 export { SchemaManager };
 
diff --git a/lib/components/index.js b/lib/components/index.js
index d46dead8..941ae2a4 100644
--- a/lib/components/index.js
+++ b/lib/components/index.js
@@ -1,42 +1,15 @@
 'use strict';
 
-import ApiInfo from './ApiInfo/api-info';
-import ApiLogo from './ApiLogo/api-logo';
-import Method from './Method/method.js';
-import MethodsList from './MethodsList/methods-list';
-import ParamsList from './ParamsList/params-list';
-import Redoc from './Redoc/redoc';
-import ResponsesList from './ResponsesList/responses-list';
-import ResponsesSamples from './ResponsesSamples/responses-samples';
-import SchemaSample from './SchemaSample/schema-sample';
-import SideMenu from './SideMenu/side-menu';
-import JsonSchema from './JsonSchema/json-schema';
-
-const REDOC_COMPONENTS = [
-  ApiInfo,
-  ApiLogo,
-  JsonSchema,
-  Method,
-  MethodsList,
-  ParamsList,
-  Redoc,
-  ResponsesList,
-  ResponsesSamples,
-  SchemaSample,
-  SideMenu
-];
-
-export {
-  ApiInfo,
-  ApiLogo,
-  JsonSchema,
-  Method,
-  MethodsList,
-  ParamsList,
-  Redoc,
-  ResponsesList,
-  ResponsesSamples,
-  SchemaSample,
-  SideMenu,
-  REDOC_COMPONENTS
-};
+export * from './ApiInfo/api-info';
+export * from './ApiLogo/api-logo';
+export * from './JsonSchema/json-schema';
+export * from './JsonSchema/json-schema-lazy';
+export * from './ParamsList/params-list';
+export * from './RequestSamples/request-samples';
+export * from './ResponsesList/responses-list';
+export * from './ResponsesSamples/responses-samples';
+export * from './SchemaSample/schema-sample';
+export * from './SideMenu/side-menu';
+export * from './Method/method';
+export * from './MethodsList/methods-list';
+export * from './Redoc/redoc';
diff --git a/lib/events.js b/lib/events.js
deleted file mode 100644
index 2dcac54f..00000000
--- a/lib/events.js
+++ /dev/null
@@ -1,10 +0,0 @@
-'use strict';
-
-import {EventEmitter} from '@angular/core';
-
-var bootsrEmmiter = new EventEmitter();
-var langChanged = new EventEmitter();
-export var redocEvents = {
-  bootstrapped: bootsrEmmiter,
-  samplesLanguageChanged: langChanged
-};
diff --git a/lib/services/events.service.js b/lib/services/events.service.js
new file mode 100644
index 00000000..4886b703
--- /dev/null
+++ b/lib/services/events.service.js
@@ -0,0 +1,10 @@
+'use strict';
+
+import {EventEmitter} from '@angular/core';
+
+export class RedocEventsService {
+  constructor() {
+    this.bootstrapped = new EventEmitter();
+    this.samplesLanguageChanged = new EventEmitter();
+  }
+}
diff --git a/lib/services/index.js b/lib/services/index.js
new file mode 100644
index 00000000..29de613a
--- /dev/null
+++ b/lib/services/index.js
@@ -0,0 +1,3 @@
+'use strict';
+
+export * from './events.service.js';
diff --git a/lib/common/components/DropDown/dropdown.js b/lib/shared/components/DropDown/drop-down.js
similarity index 92%
rename from lib/common/components/DropDown/dropdown.js
rename to lib/shared/components/DropDown/drop-down.js
index 1375b643..349dd0a3 100644
--- a/lib/common/components/DropDown/dropdown.js
+++ b/lib/shared/components/DropDown/drop-down.js
@@ -14,7 +14,7 @@ import 'Robdel12/DropKick/build/css/dropkick.css!css';
     
   `,
   directives: [CORE_DIRECTIVES],
-  styleUrls: ['./lib/common/components/DropDown/dropdown.css']
+  styleUrls: ['./lib/shared/components/DropDown/drop-down.css']
 })
 @Reflect.metadata('parameters', [[ElementRef]])
 export class DropDown {
diff --git a/lib/common/components/DropDown/dropdown.scss b/lib/shared/components/DropDown/drop-down.scss
similarity index 100%
rename from lib/common/components/DropDown/dropdown.scss
rename to lib/shared/components/DropDown/drop-down.scss
diff --git a/lib/common/components/StickySidebar/sticky-sidebar.js b/lib/shared/components/StickySidebar/sticky-sidebar.js
similarity index 97%
rename from lib/common/components/StickySidebar/sticky-sidebar.js
rename to lib/shared/components/StickySidebar/sticky-sidebar.js
index 65919173..6aa8a274 100644
--- a/lib/common/components/StickySidebar/sticky-sidebar.js
+++ b/lib/shared/components/StickySidebar/sticky-sidebar.js
@@ -8,7 +8,7 @@ import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_a
   inputs: ['scrollParent', 'scrollYOffset']
 })
 @Reflect.metadata('parameters', [[ElementRef], [BrowserDomAdapter]])
-export default class StickySidebar {
+export class StickySidebar {
   constructor(elementRef, dom) {
     this.$element = elementRef.nativeElement;
     this.dom = dom;
diff --git a/lib/common/components/StickySidebar/sticky-sidebar.spec.js b/lib/shared/components/StickySidebar/sticky-sidebar.spec.js
similarity index 90%
rename from lib/common/components/StickySidebar/sticky-sidebar.spec.js
rename to lib/shared/components/StickySidebar/sticky-sidebar.spec.js
index 50cf4a36..50185457 100644
--- a/lib/common/components/StickySidebar/sticky-sidebar.spec.js
+++ b/lib/shared/components/StickySidebar/sticky-sidebar.spec.js
@@ -1,8 +1,8 @@
 'use strict';
 
 import { getChildDebugElementByType } from 'tests/helpers';
-import {Component, provide} from '@angular/core';
-import {BrowserDomAdapter} from '@angular/platform-browser/src/browser/browser_adapter';
+import { Component, provide } from '@angular/core';
+import { BrowserDomAdapter } from '@angular/platform-browser/src/browser/browser_adapter';
 
 import {
   TestComponentBuilder,
@@ -12,7 +12,7 @@ import {
   it
 } from '@angular/testing';
 
-import StickySidebar from 'lib/common/components/StickySidebar/sticky-sidebar';
+import { StickySidebar } from 'lib/shared/components/index';
 
 describe('Common components', () => {
   describe('StickySidebar Component', () => {
diff --git a/lib/common/components/Tabs/tabs.js b/lib/shared/components/Tabs/tabs.js
similarity index 96%
rename from lib/common/components/Tabs/tabs.js
rename to lib/shared/components/Tabs/tabs.js
index e620f926..ed6094de 100644
--- a/lib/common/components/Tabs/tabs.js
+++ b/lib/shared/components/Tabs/tabs.js
@@ -14,7 +14,7 @@ import {CORE_DIRECTIVES} from '@angular/common';
     
   `,
   directives: [CORE_DIRECTIVES],
-  styleUrls: ['./lib/common/components/Tabs/tabs.css']
+  styleUrls: ['./lib/shared/components/Tabs/tabs.css']
 })
 export class Tabs {
   constructor() {
diff --git a/lib/common/components/Tabs/tabs.scss b/lib/shared/components/Tabs/tabs.scss
similarity index 100%
rename from lib/common/components/Tabs/tabs.scss
rename to lib/shared/components/Tabs/tabs.scss
diff --git a/lib/common/components/Tabs/tabs.spec.js b/lib/shared/components/Tabs/tabs.spec.js
similarity index 98%
rename from lib/common/components/Tabs/tabs.spec.js
rename to lib/shared/components/Tabs/tabs.spec.js
index 65f080c2..86915b21 100644
--- a/lib/common/components/Tabs/tabs.spec.js
+++ b/lib/shared/components/Tabs/tabs.spec.js
@@ -10,7 +10,7 @@ import {
   it
 } from '@angular/testing';
 
-import {Tabs, Tab} from 'lib/common/components/Tabs/tabs';
+import {Tabs, Tab} from 'lib/shared/components/index';
 
 describe('Common components', () => {
   describe('Tabs Component', () => {
diff --git a/lib/common/components/Zippy/zippy.html b/lib/shared/components/Zippy/zippy.html
similarity index 100%
rename from lib/common/components/Zippy/zippy.html
rename to lib/shared/components/Zippy/zippy.html
diff --git a/lib/common/components/Zippy/zippy.js b/lib/shared/components/Zippy/zippy.js
similarity index 79%
rename from lib/common/components/Zippy/zippy.js
rename to lib/shared/components/Zippy/zippy.js
index f6cd5519..9fdc2a65 100644
--- a/lib/common/components/Zippy/zippy.js
+++ b/lib/shared/components/Zippy/zippy.js
@@ -7,11 +7,11 @@ import {CORE_DIRECTIVES} from '@angular/common';
   selector: 'zippy',
   events: ['open', 'close'],
   inputs: ['title', 'visible', 'type', 'empty'],
-  templateUrl: './lib/common/components/Zippy/zippy.html',
-  styleUrls: ['./lib/common/components/Zippy/zippy.css'],
+  templateUrl: './lib/shared/components/Zippy/zippy.html',
+  styleUrls: ['./lib/shared/components/Zippy/zippy.css'],
   directives: [CORE_DIRECTIVES]
 })
-export default class Zippy {
+export class Zippy {
 
   constructor() {
     this.type = 'general';
diff --git a/lib/common/components/Zippy/zippy.scss b/lib/shared/components/Zippy/zippy.scss
similarity index 100%
rename from lib/common/components/Zippy/zippy.scss
rename to lib/shared/components/Zippy/zippy.scss
diff --git a/lib/common/components/Zippy/zippy.spec.js b/lib/shared/components/Zippy/zippy.spec.js
similarity index 96%
rename from lib/common/components/Zippy/zippy.spec.js
rename to lib/shared/components/Zippy/zippy.spec.js
index e277eb68..d461a80f 100644
--- a/lib/common/components/Zippy/zippy.spec.js
+++ b/lib/shared/components/Zippy/zippy.spec.js
@@ -1,8 +1,8 @@
 'use strict';
 
 import { getChildDebugElement, mouseclick } from 'tests/helpers';
-import {Component} from '@angular/core';
 
+import { Component } from '@angular/core';
 import {
   TestComponentBuilder,
   inject,
@@ -10,7 +10,7 @@ import {
   it
 } from '@angular/testing';
 
-import Zippy from 'lib/common/components/Zippy/zippy';
+import { Zippy } from 'lib/shared/components/index';
 
 describe('Common components', () => {
   describe('Zippy Component', () => {
diff --git a/lib/shared/components/index.js b/lib/shared/components/index.js
new file mode 100644
index 00000000..6d37711d
--- /dev/null
+++ b/lib/shared/components/index.js
@@ -0,0 +1,5 @@
+'use strict';
+export * from './DropDown/drop-down';
+export * from './StickySidebar/sticky-sidebar';
+export * from './Tabs/tabs';
+export * from './Zippy/zippy';
diff --git a/lib/common/styles/_share-link.scss b/lib/shared/styles/_share-link.scss
similarity index 100%
rename from lib/common/styles/_share-link.scss
rename to lib/shared/styles/_share-link.scss
diff --git a/lib/common/styles/_variables.scss b/lib/shared/styles/_variables.scss
similarity index 100%
rename from lib/common/styles/_variables.scss
rename to lib/shared/styles/_variables.scss
diff --git a/package.json b/package.json
index df404abb..eaa30ff4 100644
--- a/package.json
+++ b/package.json
@@ -69,6 +69,9 @@
         "map": {
           "http": "npm:stream-http@2.3.0"
         }
+      },
+      "npm:@angular/core@2.0.0-rc.1": {
+        "format": "esm"
       }
     }
   },
diff --git a/system.config.js b/system.config.js
index fae45007..6a373a24 100644
--- a/system.config.js
+++ b/system.config.js
@@ -149,7 +149,6 @@ System.config({
       "process": "github:jspm/nodelibs-process@0.1.2"
     },
     "npm:@angular/core@2.0.0-rc.1": {
-      "process": "github:jspm/nodelibs-process@0.1.2",
       "rxjs": "npm:rxjs@5.0.0-beta.6",
       "zone.js": "npm:zone.js@0.6.12"
     },
diff --git a/tests/helpers.js b/tests/helpers.js
index 90f2bc14..3d702a42 100644
--- a/tests/helpers.js
+++ b/tests/helpers.js
@@ -1,6 +1,6 @@
 'use strict';
 
-import {By} from 'angular2/platform/browser';
+import {By} from '@angular/platform-browser';
 
 /** Gets a child DebugElement by tag name. */
 export function getChildDebugElement(parent, tagName) {