Merge branch 'master' into theiliad-README-codesandbox

Author: zvonimirfras

.storybook/addons.js

@@ -1,4 +1,22 @@
-import '@storybook/addon-actions/register';
-import '@storybook/addon-links/register';
-import '@storybook/addon-notes/register';
-import '@storybook/addon-knobs/register'
+import "core-js/es6/symbol";
+import "core-js/es6/object";
+import "core-js/es6/function";
+import "core-js/es6/parse-int";
+import "core-js/es6/parse-float";
+import "core-js/es6/number";
+import "core-js/es6/math";
+import "core-js/es6/string";
+import "core-js/es6/date";
+import "core-js/es6/array";
+import "core-js/es6/regexp";
+import "core-js/es6/map";
+import "core-js/es6/set";
+import "core-js/es6/reflect";
+
+import "core-js/es7/reflect";
+import "zone.js/dist/zone";
+
+import "@storybook/addon-actions/register";
+import "@storybook/addon-links/register";
+import "@storybook/addon-notes/register";
+import "@storybook/addon-knobs/register";

.storybook/bootstrap.module.ts

@@ -1,16 +1,6 @@
 import { NgModule } from "@angular/core";
-import { TranslateModule, TranslateService } from "@ngx-translate/core";
-const en = require("./../src/i18n/en.json");
 
 @NgModule({
-	imports: [
-		TranslateModule.forRoot()
-	]
 })
 export class BootstrapModule {
-	constructor(private translateService: TranslateService) {
-		this.translateService.setDefaultLang("en");
-		this.translateService.use("en");
-		this.translateService.setTranslation("en", en);
-	}
 }

.storybook/config.js

@@ -1,3 +1,21 @@
+import "core-js/es6/symbol";
+import "core-js/es6/object";
+import "core-js/es6/function";
+import "core-js/es6/parse-int";
+import "core-js/es6/parse-float";
+import "core-js/es6/number";
+import "core-js/es6/math";
+import "core-js/es6/string";
+import "core-js/es6/date";
+import "core-js/es6/array";
+import "core-js/es6/regexp";
+import "core-js/es6/map";
+import "core-js/es6/set";
+import "core-js/es6/reflect";
+
+import "core-js/es7/reflect";
+import "zone.js/dist/zone";
+
 import { configure } from "@storybook/angular";
 
 // load global styles
@@ -7,8 +25,12 @@ require("../src/index.stories");
 // automatically import all files ending in *.stories.ts
 const req = require.context("../src", true, /.stories.ts$/);
 function loadStories() {
-	req.keys().forEach(filename => {
-		if (!filename.includes("index")) { req(filename) }
+	req.keys()
+	.sort((path1, path2) => path1.split("/").slice(-1)[0] > path2.split("/").slice(-1)[0] ? 1 : -1)
+	.forEach(filename => {
+		if (!filename.includes("index")) {
+			req(filename);
+		}
 	});
 }
 

.storybook/manager-head.html

@@ -0,0 +1,9 @@
+<meta property="og:title" content="Carbon Components Angular">
+<meta property="og:description" content="An Angular implementation of the Carbon Design System for IBM.">
+<meta property="og:image" content="https://angular.carbondesignsystem.com/carbon.jpg">
+<meta property="og:url" content="https://angular.carbondesignsystem.com">
+
+<meta name="twitter:title" content="Carbon Components Angular">
+<meta name="twitter:description" content="An Angular implementation of the Carbon Design System for IBM.">
+<meta name="twitter:image" content="https://angular.carbondesignsystem.com/carbon.jpg">
+<meta name="twitter:card" content="summary_large_image">

.storybook/preview.scss

@@ -1,7 +1,7 @@
-@import "~carbon-components/scss/globals/scss/styles.scss";
+@import "~carbon-components/css/carbon-components.min.css";
 
 body {
-	margin: 20px;
+	padding: 20px;
 	// for tooltips/popovers ... can be on any chld element before the popover
 	// but body is most conveient
 	position: relative;

.storybook/public/carbon.jpg

@@ -5,7 +5,7 @@
 		"emitDecoratorMetadata": true,
 		"experimentalDecorators": true,
 		"lib": [
-			"es2015",
+			"es2016",
 			"dom"
 		],
 		"sourceMap": true,

.storybook/tsconfig.json

@@ -32,3 +32,5 @@ deploy:
     skip_cleanup: true
     true:
       branch: master
+notifications:
+  email: false

.travis.yml

@@ -20,7 +20,7 @@ Assuming we're starting with a new @angular/cli project:
 ```shell
 $ npx @angular/cli new my-project --style=scss
 $ cd my-project
-$ npm i --save-dev carbon-components-angular carbon-components @ngx-translate/core
+$ npm i --save-dev carbon-components-angular carbon-components
 ```
 
 Then we need to include carbon-components in `src/styles.scss`:
@@ -29,12 +29,13 @@ Then we need to include carbon-components in `src/styles.scss`:
 @import "~carbon-components/scss/globals/scss/styles.scss";
 ```
 
-And set up our translations in `src/app/app.module.ts`:
+> *Note:* For offline usage we'll need to set `$font-path: '~carbon-components/src/globals/fonts';` at the very top of our `src/styles.scss`. This will copy the fonts to our `dist` folder upon successful build. If you like the fonts to be a part of your `assets` folder and not pollute the `dist` folder then copy the fonts from `node_modules/carbon-components/src/globals/fonts` into our app's `src/assets/fonts` folder and add `$font-path: '/assets/fonts/';` at the very top of our `src/styles.scss`.
+
+Then set up our translations in `src/app/app.module.ts`:
 
 ```ts
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
-import { TranslateModule } from '@ngx-translate/core';
 
 import { AppComponent } from './app.component';
 
@@ -44,7 +45,6 @@ import { AppComponent } from './app.component';
   ],
   imports: [
 	BrowserModule,
-	TranslateModule.forRoot()
   ],
   providers: [],
   bootstrap: [AppComponent]
@@ -80,7 +80,7 @@ _Finally_ we can run `npm start` and start building out our application!
   - attach a screenshot (or a gif!) for design reference if needed
   - reference the related issue
   	- "closes #123" or "fixes #123" will close issue #123 once the PR is merged
-  	- "issue #123" just refences the issue. Only use this if you definitly need the issue to remain open.
+  	- "issue #123" just references the issue. Only use this if you definitely need the issue to remain open.
   - @mention any specific other developers that need to be aware of the changes
 - add the "needs review" label along with any other relevant labels
 - [link to code review checklist goes here](#)
@@ -97,11 +97,11 @@ _Finally_ we can run `npm start` and start building out our application!
   - screenshots if needed
   - relevant code snippets
   - links to application source code or running demo ([Codesandbox is awesome for this!](https://codesandbox.io/s/angular)) (including connection/authentication information)
-- add relevant labels (bug, accsibility, design, discussion, feature, etc)
+- add relevant labels (bug, accessibility, design, discussion, feature, etc)
 - if you have a fix to contribute, assign yourself, otherwise leave unassigned
 
 #### npm commands
-To keep our build dependancies local we use npm scripts to run our webpack, gulp, and general build tasks. You should never install webpack or gulp globally as that will likely conflict with our version. You should never need to modify the build process to add a component or story.
+To keep our build dependencies local we use npm scripts to run our webpack, gulp, and general build tasks. You should never install webpack or gulp globally as that will likely conflict with our version. You should never need to modify the build process to add a component or story.
 - `npm run storybook` to run storybook (port 6006)
 - `npm run build` to generate the dist
 - `docs:build` to build documentation
@@ -113,7 +113,9 @@ To keep our build dependancies local we use npm scripts to run our webpack, gulp
  - [Style guide (WIP)](https://github.com/IBM/carbon-components-angular/wiki/Style-guide)
  - [General component API guidelines (WIP)](https://github.com/IBM/carbon-components-angular/wiki/Component-API-guidelines)
  - [Angular style guide](https://angular.io/styleguide)
- - [I18N tooling](https://angular.io/docs/ts/latest/cookbook/i18n.html)
+ - I18N tooling
+	- [I18N guide](https://angular.io/guide/i18n)
+	- [ngx-translate](https://github.com/ngx-translate/core)
  - (Angular 2+ doesn't have anything like ngAria, instead here's [The A11Y Project](http://a11yproject.com/), [WAI-ARIA specs](https://www.w3.org/TR/wai-aria/), and [WAI-ARIA Authoring Practices](https://www.w3.org/TR/2016/WD-wai-aria-practices-1.1-20160317/))
  - [TypeScript docs](https://www.typescriptlang.org/docs/tutorial.html)