Squashed commit of the following:

commit 615c4eb Merge: 48912d6 26a0c85 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 10 10:27:00 2015 +0100 Merge pull request mui#2091 from callemall/oliviertassinari-patch-1 [eslint] Use the latest version commit 48912d6 Merge: 6f28ad0 5b4c559 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 10 10:16:55 2015 +0100 Merge pull request mui#2116 from subjectix/fix-dialog-raw-code Fixed raw code of dialog's open prop commit 5b4c559 Author: Ali Taheri <[email protected]> Date: Tue Nov 10 10:37:26 2015 +0330 Fixed raw code of dialog's open prop commit 6f28ad0 Author: Shaurya Arora <[email protected]> Date: Mon Nov 9 18:30:22 2015 -0600 v0.13.2 release commit fd088e1 Merge: d328658 4145d8f Author: Shaurya Arora <[email protected]> Date: Mon Nov 9 17:42:57 2015 -0600 Merge pull request mui#2113 from shaurya947/master Add import statements to every component's doc page commit 4145d8f Author: Shaurya Arora <[email protected]> Date: Mon Nov 9 17:32:18 2015 -0600 Add import statements to every component's doc page commit d328658 Merge: abfd6ae a8066d1 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 10 00:16:14 2015 +0100 Merge pull request mui#2112 from callemall/oliviertassinari-patch-3 [npm] Add private: true commit a8066d1 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 10 00:12:13 2015 +0100 Update package.json Add private to the docs package.json. Will prevent this warning to be displayed `npm WARN package.json [email protected] No license field.` and accidental publish. commit abfd6ae Merge: 7233878 ed062ff Author: Olivier Tassinari <[email protected]> Date: Tue Nov 10 00:06:28 2015 +0100 Merge pull request mui#2111 from luisrudge/remove-peer-dependencies [npm] moving some peer dependencies to dependencies commit ed062ff Author: Luis Rudge <[email protected]> Date: Mon Nov 9 20:30:29 2015 -0200 moving some peer dependencies to dependencies commit 7233878 Merge: 49feb2e 915c1eb Author: Shaurya Arora <[email protected]> Date: Mon Nov 9 15:52:36 2015 -0600 Merge pull request mui#2105 from oliviertassinari/open [Dialog] Use open instead of isOpen commit 915c1eb Author: Olivier Tassinari <[email protected]> Date: Mon Nov 9 19:07:13 2015 +0100 [Dialog] Use open instead of isOpen commit 49feb2e Merge: bb57b9f 6aff277 Author: Olivier Tassinari <[email protected]> Date: Mon Nov 9 13:05:23 2015 +0100 Merge pull request mui#2044 from CalebEverett/master [LeftNav] Open or close if docked prop changes when window resizes commit bb57b9f Merge: e439aaa bc7ceac Author: Olivier Tassinari <[email protected]> Date: Mon Nov 9 13:00:34 2015 +0100 Merge pull request mui#2045 from rhythnic/master [Badge] Add a new component commit bc7ceac Author: Nick Baroni <[email protected]> Date: Tue Nov 3 17:49:19 2015 +0900 Added badge component. commit e439aaa Merge: c78b437 22e3b4c Author: Olivier Tassinari <[email protected]> Date: Mon Nov 9 11:37:23 2015 +0100 Merge pull request mui#2097 from callemall/oliviertassinari-patch-2 [README] Use master branch for the travis build status commit 22e3b4c Author: Olivier Tassinari <[email protected]> Date: Mon Nov 9 11:12:46 2015 +0100 [README] Use master branch for the travis build status commit 6aff277 Author: Caleb Everett <[email protected]> Date: Wed Nov 4 12:20:53 2015 -0800 set LeftNav docked in componentWillReceiveProps commit 26a0c85 Author: Olivier Tassinari <[email protected]> Date: Sun Nov 8 15:51:53 2015 +0100 [eslint] Use the latest version commit c78b437 Merge: df5f6ed 0dc2e4a Author: Olivier Tassinari <[email protected]> Date: Sun Nov 8 13:29:41 2015 +0100 Merge pull request mui#2083 from subjectix/dialog-style-prop [doc] Add style property commit df5f6ed Merge: b4f8f8a 230bfcf Author: Olivier Tassinari <[email protected]> Date: Sun Nov 8 12:22:30 2015 +0100 Merge pull request mui#2084 from oliviertassinari/npm [npm] Separate the lint and the build commit 230bfcf Author: Olivier Tassinari <[email protected]> Date: Sat Nov 7 12:54:20 2015 +0100 [npm] Separate the lint and the build commit 0dc2e4a Author: Ali Taheri <[email protected]> Date: Tue Oct 6 15:54:45 2015 +0330 Added undocumented style property to the components that use it commit b4f8f8a Merge: 780d9a5 34e26fb Author: Olivier Tassinari <[email protected]> Date: Sat Nov 7 04:03:50 2015 +0100 Merge pull request mui#2078 from EnzoMartin/patch-1 Fix label display with Chrome autocomplete commit 780d9a5 Merge: 4ab4d19 dfa9216 Author: Olivier Tassinari <[email protected]> Date: Sat Nov 7 02:44:05 2015 +0100 Merge pull request mui#2073 from quangbuule/patch-1 [TextField] Fix isValid function commit 34e26fb Author: Enzo Martin <[email protected]> Date: Fri Nov 6 19:12:22 2015 +0100 Fix label display with Chrome autocomplete commit 4ab4d19 Merge: 47bf496 9fc0926 Author: Olivier Tassinari <[email protected]> Date: Fri Nov 6 18:01:53 2015 +0100 Merge pull request mui#2070 from mbrookes/patch-1 [Doc] Add missing Textfield docs commit 9fc0926 Author: Matt Brookes <[email protected]> Date: Fri Nov 6 16:34:44 2015 +0000 Correct prop name! commit dfa9216 Author: Quangbuu Le <[email protected]> Date: Fri Nov 6 11:29:25 2015 +0700 Update text-field.jsx The isValid function return not correct, this caused re-rendering the whole TextField when value prop received. commit 0904107 Author: Matt Brookes <[email protected]> Date: Thu Nov 5 23:08:41 2015 +0000 Missing Textfield docs. commit 47bf496 Merge: 7df3a99 2b1e062 Author: Olivier Tassinari <[email protected]> Date: Thu Nov 5 15:22:32 2015 +0100 Merge pull request mui#2063 from pandaiolo/node-props Changing propType from string to node on components commit 2b1e062 Author: Pandaiolo <[email protected]> Date: Thu Nov 5 14:30:04 2015 +0100 [docs] Changing propType from string to node on components commit 98532fd Author: Pandaiolo <[email protected]> Date: Thu Nov 5 12:53:38 2015 +0100 Changing propType from string to node on components commit 7df3a99 Merge: 789eaee 2019ad9 Author: Olivier Tassinari <[email protected]> Date: Thu Nov 5 11:36:11 2015 +0100 Merge pull request mui#2062 from pinturic/patch-1 [LeftNav] Fix resize when using children commit 2019ad9 Author: pinturic <[email protected]> Date: Thu Nov 5 11:28:04 2015 +0100 Update left-nav.jsx cleaned _updateMenuHeight variables declaration commit b6cca6f Author: pinturic <[email protected]> Date: Thu Nov 5 11:14:27 2015 +0100 Update left-nav.jsx Menu can be null if the MenuItems are inlined commit 789eaee Merge: 8f5510a 308a7a2 Author: Olivier Tassinari <[email protected]> Date: Wed Nov 4 23:56:20 2015 +0100 Merge pull request mui#2016 from KapJI/theme-fix [Theme] Fix Slider and Toggle colors commit 8f5510a Merge: dfb8363 801e05a Author: Olivier Tassinari <[email protected]> Date: Wed Nov 4 23:13:54 2015 +0100 Merge pull request mui#1996 from JorgenEvens/feature/dialog-show-prop [Dialog] Allow open state of dialog to be controlled through the show prop commit 801e05a Author: Jorgen Evens <[email protected]> Date: Thu Oct 29 20:26:37 2015 +0100 [Dialog] Re-enable legacy API with deprecation warnings. commit 8050f49 Author: Jorgen Evens <[email protected]> Date: Tue Oct 27 22:48:45 2015 +0100 [Dialog] Switch from imperative control to props. - Remove .dismiss() and .show() - Remove onShow and onDismiss callback - Added onRequestClose callback - Removed modal property - Updated docs - Add default values for defaultIsOpen and isOpen. commit dfb8363 Merge: aef950e 045b630 Author: Olivier Tassinari <[email protected]> Date: Wed Nov 4 18:43:13 2015 +0100 Merge pull request mui#2054 from cannium/master [TableBody] Table click away should also trigger onRowSelection commit 045b630 Author: Can Zhang <[email protected]> Date: Wed Nov 4 10:36:22 2015 +0800 Table click away should also trigger onRowSelection commit aef950e Merge: d3ee052 e7d6660 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 3 19:33:29 2015 +0100 Merge pull request mui#2051 from chrismcv/auto-prefix-null [AutoPrefix] add null support commit d3ee052 Merge: 67cca09 d14c413 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 3 19:16:40 2015 +0100 Merge pull request mui#2049 from Dashlane/fix/typo-textfield-doc [Doc] Fix typo in TextField doc commit d14c413 Author: Thomas Guillory <[email protected]> Date: Tue Nov 3 10:50:59 2015 +0100 Fix typo in TextField doc There is a typo in TextField element documentation: the "Style Hint Text" example is not using the right property of `styles` object. commit e7d6660 Author: Chris McVittie <[email protected]> Date: Tue Nov 3 16:25:52 2015 +0000 auto prefix null support commit 67cca09 Merge: 5821f0a dfb0acb Author: Olivier Tassinari <[email protected]> Date: Tue Nov 3 17:04:18 2015 +0100 Merge pull request mui#1720 from NatalieT/ipad-fix [TextField fix ipad enhanced textarea commit dfb0acb Author: Natalie Fitzsimons <[email protected]> Date: Tue Nov 3 15:23:00 2015 +0000 ipad cursor in extra field fix commit 5821f0a Merge: c8e622e 50a0942 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 3 14:47:55 2015 +0100 Merge pull request mui#2042 from chrismcv/r2l Render to Layer component commit 50a0942 Author: Chris McVittie <[email protected]> Date: Mon Nov 2 20:35:40 2015 +0000 Render to Layer component (+ squashed fixes) commit c8e622e Merge: 08a7c6b 3983146 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 3 12:07:44 2015 +0100 Merge pull request mui#2014 from oliviertassinari/button-label-position [Button] Fix and add missing labelPosition commit 08a7c6b Merge: 076c4af bfa7336 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 3 12:06:52 2015 +0100 Merge pull request mui#2024 from oliviertassinari/snackbar-fix-hide-show [Snackbar] Assert that displayed data changed before hide/show commit 076c4af Merge: ac357ec 7677be5 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 3 11:58:29 2015 +0100 Merge pull request mui#2047 from oliviertassinari/fix-progress [CircularProgress] Fix transition commit 7677be5 Author: Olivier Tassinari <[email protected]> Date: Tue Nov 3 11:50:19 2015 +0100 [CircularProgress] clean up commit 3f6d31a Author: Chris McVittie <[email protected]> Date: Mon Nov 2 19:45:57 2015 +0000 fix circular progress issue commit ac357ec Merge: 68baf9b b12bcdd Author: Olivier Tassinari <[email protected]> Date: Sun Nov 1 20:15:40 2015 +0100 Merge pull request mui#2007 from Cavitt/universal-rendering Universal Rendering Support commit b12bcdd Author: Cavitt <[email protected]> Date: Thu Oct 29 06:01:27 2015 -0500 Implemented inline-style-prefixer User agent based prefixing for client and server side rendering. When rendering server-side define `navigator.userAgent` after receiving request headers but before rendering styles. A warning will be shown when attempting to use server-side rendering without defining a user agent. Client side rendering should automatically work as all modern browsers provide user agent via the navigator property. commit 68baf9b Merge: edaf30f b13fe11 Author: Olivier Tassinari <[email protected]> Date: Sun Nov 1 16:49:36 2015 +0100 Merge pull request mui#2025 from CameronFletcher92/timepicker-fix Added keys to timepicker buttons, fixed mui#1964 commit edaf30f Merge: c66ff3d f25ef9e Author: Olivier Tassinari <[email protected]> Date: Sun Nov 1 16:46:11 2015 +0100 Merge pull request mui#2030 from CameronFletcher92/tableheader-fix [Table] Added key to selectall column in TableHeader. Addresses mui#2028 commit f25ef9e Author: Cameron Fletcher <[email protected]> Date: Sun Nov 1 15:06:04 2015 +1000 removed console log commit 0b57d95 Author: Cameron Fletcher <[email protected]> Date: Sun Nov 1 15:02:18 2015 +1000 [Table] Added key to selectall column in TableHeader. Addresses mui#2028 commit c66ff3d Merge: 0d86eea 80141f6 Author: Olivier Tassinari <[email protected]> Date: Sun Nov 1 00:51:10 2015 +0100 Merge pull request mui#2021 from callemall/oliviertassinari-patch-1 [Overlay] Fix server side rendering commit b13fe11 Author: Cameron Fletcher <[email protected]> Date: Sun Nov 1 00:24:16 2015 +1000 changed timepicker button keys to AM/PM commit e3920ac Author: Cameron Fletcher <[email protected]> Date: Sun Nov 1 00:14:17 2015 +1000 Added keys to timepicker buttons, fixed mui#1964 commit bfa7336 Author: Olivier Tassinari <[email protected]> Date: Sat Oct 31 12:28:17 2015 +0100 [Snackbar] Assert that displayed data changed before hide/show commit 0d86eea Merge: 6141e2b 176762e Author: Olivier Tassinari <[email protected]> Date: Sat Oct 31 12:22:26 2015 +0100 Merge pull request mui#2022 from oliviertassinari/fix-test-date-picker [DatePicker] Fix tests for the 31 of October commit 176762e Author: Olivier Tassinari <[email protected]> Date: Sat Oct 31 12:03:05 2015 +0100 [DatePicker] Fix tests for the 31 of October This is a temporary fix. There is an edge case with the test. Calling addMonths with 31 of October return 1 of December, while we expect November. commit 80141f6 Author: Olivier Tassinari <[email protected]> Date: Sat Oct 31 11:16:39 2015 +0100 [Overlay] Fix server side rendering The componentDidMount method is not called when rendering server side commit 6141e2b Merge: fd346dd 3f8825f Author: Olivier Tassinari <[email protected]> Date: Sat Oct 31 11:11:49 2015 +0100 Merge pull request mui#1609 from umidbekkarimov/master [Table] onRowSelection return 'none' string on unselect all commit 3983146 Author: Olivier Tassinari <[email protected]> Date: Fri Oct 30 13:39:33 2015 +0100 [Button] Fix and add missing labelPosition commit fd346dd Merge: 9be7261 a3e9cad Author: Shaurya Arora <[email protected]> Date: Fri Oct 30 17:03:23 2015 -0500 Merge pull request mui#1589 from KapJI/slider-minvalue [Slider] Remove redundant 'defaultValue'. Fix bug when 'min' is greater than zero. commit 308a7a2 Author: Ruslan Sayfutdinov <[email protected]> Date: Fri Oct 30 20:54:27 2015 +0300 Fix Slider and Toggle colors commit a3e9cad Author: Ruslan Sayfutdinov <[email protected]> Date: Fri Oct 30 19:35:44 2015 +0300 [Slider] Return 'defaultValue' back commit 9be7261 Merge: 3304889 f69ad2d Author: Olivier Tassinari <[email protected]> Date: Thu Oct 29 22:34:34 2015 +0100 Merge pull request mui#1907 from oliviertassinari/tabs-swipeable [Docs] Add an example of tabs with a slide effect commit f69ad2d Author: Olivier Tassinari <[email protected]> Date: Sat Oct 17 01:05:22 2015 +0200 [Docs] Add an example of tabs with a slide effect This a classical use case for tabs on android. commit 3304889 Author: Shaurya Arora <[email protected]> Date: Thu Oct 29 16:08:34 2015 -0500 V0.13.1 release commit 02959ea Merge: eb3d232 8aaa223 Author: Olivier Tassinari <[email protected]> Date: Thu Oct 29 10:51:14 2015 +0100 Merge pull request mui#1988 from igorbt/gridlist-docs-fix [GridList] docs fix - add back code examples commit 8aaa223 Author: igorbt <[email protected]> Date: Wed Oct 28 06:28:43 2015 +0200 fixed warning about keys and style commit 6e93319 Author: igorbt <[email protected]> Date: Thu Oct 22 07:33:24 2015 +0300 adding back grid-list code examples commit 28a0477 Author: Ruslan Sayfutdinov <[email protected]> Date: Fri Sep 4 18:48:19 2015 +0300 Fix value update while dragging commit 29964f5 Author: Ruslan Sayfutdinov <[email protected]> Date: Fri Sep 4 00:39:48 2015 +0300 Remove redundant 'defaultValue'. Fix bug when 'min' greater than zero. commit 3f8825f Author: Umidbek Karimov <[email protected]> Date: Tue Sep 8 18:02:54 2015 +0500 Update table.jsx [Table] onRowSelection return 'none' string on unselect all
tyfoo · Nov 10, 2015 · 12aba3e · 12aba3e
1 parent 876e230
commit 12aba3e
Show file tree

Hide file tree

Showing 113 changed files with 1,717 additions and 544 deletions.
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,6 @@
+{
+  "stage": 1,
+  "plugins": [
+    "dev-expression"
+  ]
+}
diff --git a/.travis.yml b/.travis.yml
@@ -2,3 +2,6 @@ language: node_js
 node_js:
   - "stable"
 sudo: false
+script:
+  - npm run lint
+  - npm test
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,44 @@
+## 0.13.2
+###### _Nov 9, 2015_
+
+##### General
+- Add tabs with slide effect (#1907)
+- Universal rendering support (#2007) (thanks @Cavitt)
+- Add labelPosition prop to buttons (#2014)
+- Add RenderToLayer component (#2042) (thanks @chrismcv)
+- Open state of of dialog now controlled through props (#1996)
+  - openImmediately, show(), dismiss() deprecated
+- Update TextField docs (#2070)
+- New Badge component (#2045) (thanks @rhythnic)
+- Add import statements to components' docs pages (#2113)
+
+##### Component Fixes / Enhancements
+- Fix server side rendering (#2021)
+- Add key to TableHeaderColumn for selectAll (#2030)
+- Fix Circular Progress transition (#2047)
+- Fix Snackbar getting stuck when receiving new props (#2024)
+- iPad enhanced textarea fix (#1720)
+- Table clickAway triggers onRowSelection (#2054)
+- Theme color fixes for Slider and Toggle (#2016)
+
+## 0.13.1
+###### _Oct 29, 2015_
+
+##### General
+- [SVGIcons] added index.js and index-generator script (#1959)
+- [TimePicker] openDialog() function (#1939) and autoOk prop (#1940) added
+- [DatePicker] i18n support added (#1658)
+- [LeftNav] supports nested children (w/o menuItems) (#1982)
+- [Snackbar] updated for new specification (#1668)
+- [Tabs] added tabTemplate prop (#1691)
+
+##### Component Fixes / Enhancements
+- [TextArea] height issue fixed (#1875)
+- [GridList] doc added (#1948) with code examples (#1988)
+- [TextField] fixed custom theme color hiding backgroundColor (#1989)
+- [TimePicker] added style and textFieldStyle props (#1949)
+- [Card] text color is now pulled from theme (#1995)
+
 ## 0.13.0
 ###### _Oct 21, 2015_
 

diff --git a/README.md b/README.md
@@ -1,4 +1,7 @@
-#[Material-UI](http://callemall.github.io/material-ui/) [![npm package](https://img.shields.io/npm/v/material-ui.svg?style=flat-square)](https://www.npmjs.org/package/material-ui) [![Build Status](https://img.shields.io/travis/callemall/material-ui.svg?style=flat-square)](https://travis-ci.org/callemall/material-ui) [![Gitter](https://img.shields.io/badge/gitter-join%20chat-f81a65.svg?style=flat-square)](https://gitter.im/callemall/material-ui?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
+#[Material-UI](http://callemall.github.io/material-ui/)
+[![npm package](https://img.shields.io/npm/v/material-ui.svg?style=flat-square)](https://www.npmjs.org/package/material-ui)
+[![Build Status](https://travis-ci.org/callemall/material-ui.svg?branch=master)](https://travis-ci.org/callemall/material-ui)
+[![Gitter](https://img.shields.io/badge/gitter-join%20chat-f81a65.svg?style=flat-square)](https://gitter.im/callemall/material-ui?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
 
 [![PeerDependencies](https://img.shields.io/david/peer/callemall/material-ui.svg?style=flat-square)](https://david-dm.org/callemall/material-ui#info=peerDependencies&view=list)
 [![Dependencies](https://img.shields.io/david/callemall/material-ui.svg?style=flat-square)](https://david-dm.org/callemall/material-ui)

diff --git a/docs/package.json b/docs/package.json
@@ -1,11 +1,12 @@
 {
   "name": "material-ui-docs",
-  "version": "0.13.0",
+  "version": "0.13.2",
   "description": "Documentation site for material-ui",
   "repository": {
     "type": "git",
     "url": "https://github.com/callemall/material-ui.git"
   },
+  "private": true,
   "scripts": {
     "prestart": "webpack-dev-server --config webpack-dev-server.config.js --progress --colors --inline",
     "start": "open http://localhost:3000",
@@ -15,13 +16,10 @@
   "dependencies": {
     "codemirror": "^5.5.0",
     "history": "^1.11.1",
-    "react-addons-create-fragment": "^0.14.0",
     "react-addons-perf": "^0.14.0",
-    "react-addons-pure-render-mixin": "^0.14.0",
-    "react-addons-transition-group": "^0.14.0",
-    "react-addons-update": "^0.14.0",
     "react-dom": "^0.14.0",
-    "react-tap-event-plugin": "^0.2.0"
+    "react-motion": "^0.3.1",
+    "react-swipeable-views": "^0.3.0"
   },
   "devDependencies": {
     "raw-loader": "^0.5.1",

diff --git a/docs/src/app/app-routes.jsx b/docs/src/app/app-routes.jsx
@@ -22,6 +22,7 @@ const InlineStyles = require('./components/pages/customization/inline-styles');
 const Components = require('./components/pages/components');
 const AppBar = require('./components/pages/components/app-bar');
 const Avatars = require('./components/pages/components/avatars');
+const Badge = require('./components/pages/components/badge');
 const Buttons = require('./components/pages/components/buttons');
 const Cards = require('./components/pages/components/cards');
 const DatePicker = require('./components/pages/components/date-picker');
@@ -77,6 +78,7 @@ const AppRoutes = (
     <Route path="components" component={Components}>
       <Route path="appbar" component={AppBar} />
       <Route path="avatars" component={Avatars} />
+      <Route path="badge" component={Badge} />
       <Route path="buttons" component={Buttons} />
       <Route path="cards" component={Cards} />
       <Route path="date-picker" component={DatePicker} />

diff --git a/docs/src/app/components/pages/components.jsx b/docs/src/app/components/pages/components.jsx
@@ -7,6 +7,7 @@ export default class Components extends React.Component {
     let menuItems = [
       { route: '/components/appbar', text: 'AppBar'},
       { route: '/components/avatars', text: 'Avatars'},
+      { route: '/components/badge', text: 'Badge'},
       { route: '/components/buttons', text: 'Buttons'},
       { route: '/components/cards', text: 'Cards'},
       { route: '/components/date-picker', text: 'Date Picker'},

diff --git a/docs/src/app/components/pages/components/app-bar.jsx b/docs/src/app/components/pages/components/app-bar.jsx
@@ -1,11 +1,12 @@
-let React = require('react');
-let { AppBar, DropDownMenu } = require('material-ui');
-let IconButton = require('icon-button');
-let NavigationClose = require('svg-icons/navigation/close');
-let FlatButton = require('flat-button');
-let ComponentDoc = require('../../component-doc');
-let CodeExample = require('../../code-example/code-example');
-let Code = require('app-bar-code');
+const React = require('react');
+const { AppBar, DropDownMenu, Paper } = require('material-ui');
+const IconButton = require('icon-button');
+const NavigationClose = require('svg-icons/navigation/close');
+const FlatButton = require('flat-button');
+const ComponentDoc = require('../../component-doc');
+const CodeExample = require('../../code-example/code-example');
+const CodeBlock = require('../../code-example/code-block');
+const Code = require('app-bar-code');
 const IconMenu = require('menus/icon-menu');
 const MenuItem = require('menus/menu-item');
 const MoreVertIcon = require('svg-icons/navigation/more-vert');
@@ -63,7 +64,7 @@ export default class AppBarPage extends React.Component {
             name: 'style',
             type: 'object',
             header: 'optional',
-            desc: 'Override the inline-styles of the app bars\'s root element.',
+            desc: 'Override the inline-styles of the app bar\'s root element.',
           },
           {
             name: 'showMenuIconButton',
@@ -113,6 +114,16 @@ export default class AppBarPage extends React.Component {
         name="AppBar"
         desc={this.desc}
         componentInfo={this.componentInfo}>
+
+        <Paper style = {{marginBottom: '22px'}}>
+          <CodeBlock>
+          {
+            '//Import statement:\nconst AppBar = require(\'material-ui/lib/app-bar\');\n\n' +
+            '//See material-ui/lib/index.js for more\n'
+          }
+          </CodeBlock>
+        </Paper>
+
         <CodeExample code={Code}>
           <AppBar
             title="Title"

diff --git a/docs/src/app/components/pages/components/avatars.jsx b/docs/src/app/components/pages/components/avatars.jsx
@@ -1,10 +1,11 @@
-let React = require('react');
-let { Avatar, FontIcon, List, ListItem, Styles } = require('material-ui');
-let ComponentDoc = require('../../component-doc');
-let FileFolder = require('svg-icons/file/folder');
-let { Colors } = Styles;
-let Code = require('avatars-code');
-let CodeExample = require('../../code-example/code-example');
+const React = require('react');
+const { Avatar, FontIcon, List, ListItem, Styles, Paper } = require('material-ui');
+const ComponentDoc = require('../../component-doc');
+const FileFolder = require('svg-icons/file/folder');
+const { Colors } = Styles;
+const Code = require('avatars-code');
+const CodeExample = require('../../code-example/code-example');
+const CodeBlock = require('../../code-example/code-block');
 
 
 export default class AvatarsPage extends React.Component {
@@ -70,6 +71,16 @@ export default class AvatarsPage extends React.Component {
         name="Avatars"
         desc={desc}
         componentInfo={componentInfo}>
+
+        <Paper style = {{marginBottom: '22px'}}>
+          <CodeBlock>
+          {
+            '//Import statement:\nconst Avatar = require(\'material-ui/lib/avatar\');\n\n' +
+            '//See material-ui/lib/index.js for more\n'
+          }
+          </CodeBlock>
+        </Paper>
+
         <CodeExample code={Code}>
           <List>
             <ListItem leftAvatar={imageAvatar} disabled={true}>Image Avatar</ListItem>

diff --git a/docs/src/app/components/pages/components/badge.jsx b/docs/src/app/components/pages/components/badge.jsx
@@ -0,0 +1,99 @@
+const React = require('react');
+const { FontIcon, IconButton, Badge, Paper } = require('material-ui');
+const ComponentDoc = require('../../component-doc');
+const Code = require('badge-code');
+const CodeExample = require('../../code-example/code-example');
+const NotificationsIcon = require('svg-icons/social/notifications');
+const ShoppingCartIcon = require('svg-icons/action/shopping-cart');
+const FolderIcon = require('svg-icons/file/folder-open');
+const UploadIcon = require('svg-icons/file/cloud-upload');
+const CodeBlock = require('../../code-example/code-block');
+
+export default class BadgePage extends React.Component {
+  constructor(props) {
+    super(props);
+
+    this.desc = 'This component generates a small badge to the top-right of it\'s child(ren)';
+
+    this.componentInfo = [
+      {
+        name: 'Props',
+        infoArray: [
+          {
+            name: 'badgeContent',
+            type: 'node',
+            header: 'required',
+            desc: 'This is the content rendered within the badge.',
+          },
+          {
+            name: 'primary',
+            type: 'bool',
+            header: 'default: false',
+            desc: 'If true, the badge will use the primary badge colors.',
+          },
+          {
+            name: 'secondary',
+            type: 'bool',
+            header: 'default: false',
+            desc: 'If true, the badge will use the secondary badge colors.',
+          },
+          {
+            name: 'style',
+            type: 'object',
+            header: 'optional',
+            desc: 'Override the inline-styles of the root element.',
+          },
+          {
+            name: 'badgeStyle',
+            type: 'object',
+            header: 'optional',
+            desc: 'Override the inline-styles of the badge element.',
+          },
+        ],
+      },
+    ];
+  }
+
+  render() {
+    return (
+      <ComponentDoc
+        name="Badge"
+        desc={this.desc}
+        componentInfo={this.componentInfo}>
+
+        <Paper style = {{marginBottom: '22px'}}>
+          <CodeBlock>
+          {
+            '//Import statement:\nconst Badge = require(\'material-ui/lib/badge\');\n\n' +
+            '//See material-ui/lib/index.js for more\n'
+          }
+          </CodeBlock>
+        </Paper>
+
+        <CodeExample code={Code}>
+
+          <Badge badgeContent={4} primary={true}>
+            <NotificationsIcon />
+          </Badge>
+
+          <Badge badgeContent={10} secondary={true} badgeStyle={{top:12, right:12}}>
+            <IconButton tooltip="Go To Cart">
+              <ShoppingCartIcon/>
+            </IconButton>
+          </Badge>
+
+          <Badge backgroundColor="#d8d8d8"
+                 badgeContent={<IconButton tooltip="Backup"><UploadIcon/></IconButton>}>
+            <FolderIcon />
+          </Badge>
+
+          <Badge badgeContent="&copy;" badgeStyle={{fontSize:20}}>
+            <h3>Company Name</h3>
+          </Badge>
+
+        </CodeExample>
+      </ComponentDoc>
+    );
+  }
+
+}