feature(top app bar): create new top app bar component (material-components#13)

Author: Matty Goo

.babelrc

@@ -1,5 +1,10 @@
 {
   "presets": [
-    "es2015"
-  ]
+    "es2015",
+    "react"
+  ],
+  "plugins": [
+    "transform-class-properties",
+    "transform-object-rest-spread"
+  ],
 }

.eslintignore

@@ -0,0 +1 @@
+**/node_modules

.eslintrc.yml

@@ -1,13 +1,14 @@
-extends: 
+extends:
   - google
   - plugin:react/recommended
 parser: babel-eslint
-plugins: 
+plugins:
   - react
-rules: 
+rules:
   strict: 0
   require-jsdoc: off
   valid-jsdoc: off
   switch-colon-spacing: 0
   max-len: [error, 120]
   indent:  [error, 2, {"SwitchCase":1}]
+  no-invalid-this: off

.gitignore

@@ -5,4 +5,5 @@ node_modules
 *.iml
 *.snapshot.png
 *.diff.png
-key.json
+key.json
+*.golden.png

.travis.yml

@@ -13,8 +13,13 @@ matrix:
   include:
     - node_js: 8
       env: TEST_SUITE=unit
-      install: npm i
-      script: npm run test:unit-ci
+      install:
+        - npm i
+        - npm i -g codecov
+      script:
+        - npm run test:unit-ci
+      after_success:
+        - codecov
 
     - node_js: 8
       env: TEST_SUITE=lint
@@ -24,7 +29,7 @@ matrix:
     - node_js: 8
       env: TEST_SUITE=screenshots
       install: npm i
-      script: 
+      script:
         - ./test/screenshot/start.sh
-        - sleep 10s
+        - sleep 60s
         - npm run test:image-diff

README.md

@@ -1,2 +1,5 @@
+[![Build Status](https://img.shields.io/travis/material-components/material-components-web-react/master.svg)](https://travis-ci.org/material-components/material-components-web-react/)
+[![codecov](https://codecov.io/gh/material-components/material-components-web-react/branch/master/graph/badge.svg)](https://codecov.io/gh/material-components/material-components-web-react)
+
 # material-components-web-react
 Material Components for React (MDC React)

docs/guidelines.md

@@ -0,0 +1,25 @@
+# General Guidelines
+
+## Integrating with Components
+
+Some of our components accept a `React.Component` as a prop. If you decide to build a component, it will more than likely need some additional feature or attributes added to operate correctly.
+
+### Classnames
+
+Pass the prop `className` to the className prop on the parent element. As an example please see the [MaterialIcon Component](../packages/material-icon/index.js) or the example below:
+
+
+```js
+class Dog extends React.Component {
+  render() {
+    const {className = ''} = this.props;
+    const allClasses = `${className} dog-class`;
+
+    return (
+      <div className={allClasses}>
+        Woof
+      </div>
+    );
+  }
+};
+```

lerna.json

@@ -0,0 +1,12 @@
+{
+  "lerna": "2.9.0",
+  "command": {
+    "bootstrap": {
+      "npmClientArgs": ["--no-package-lock"]
+    }
+  },
+  "packages": [
+    "packages/*"
+  ],
+  "version": "0.0.0"
+}