Add documentation

README.md

@@ -9,9 +9,15 @@ A collection of [Preact] Components that encapsulate Google's [Material Design L
 >
 > **Using TypeScript?** [preact-mdl-example](https://github.com/tbekolay/preact-mdl-example) is an instant full project setup.
 
+
+## [Documentation](docs.md)
+
+
 ## Installation
 
-      $ npm install --save material-design-lite preact-mdl
+```sh
+npm install --save material-design-lite preact-mdl
+```
 
 ## What does it look like?
 
@@ -26,6 +32,10 @@ _Here's some live-action demos:_
 <img src="https://i.imgur.com/I6RDmBm.gif" width="122" />
 <img src="https://i.gyazo.com/70724d88b290ff47c793cf6f9ddc13f1.gif" width="107" />
 
+
+---
+
+
 ## Usage
 
 * Add MDL stylesheets to your html
@@ -64,9 +74,7 @@ export default class MyButton extends Component {
 
 ```
 
-## Documentation
-
-Documentation is on it's way!
+## Demos
 
 For now, browse these Open Source projects using `preact-mdl`:
 

docs.md

@@ -0,0 +1,261 @@
+<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
+
+### Table of Contents
+
+-   [Icon](#icon)
+-   [Button](#button)
+-   [Card](#card)
+-   [Dialog](#dialog)
+-   [Layout](#layout)
+-   [Layout](#layout-1)
+-   [LayoutHeader](#layoutheader)
+-   [LayoutTab](#layouttab)
+-   [LayoutTabPanel](#layouttabpanel)
+-   [Navigation](#navigation)
+-   [Grid](#grid)
+-   [Progress](#progress)
+-   [Spinner](#spinner)
+-   [Menu](#menu)
+-   [MenuItem](#menuitem)
+-   [Slider](#slider)
+-   [Snackbar](#snackbar)
+-   [CheckBox](#checkbox)
+-   [Radio](#radio)
+-   [IconToggle](#icontoggle)
+-   [Switch](#switch)
+-   [Table](#table)
+-   [TableCell](#tablecell)
+-   [ListItem](#listitem)
+-   [TextField](#textfield)
+-   [Tooltip](#tooltip)
+
+## Icon
+
+**Extends MaterialComponent**
+
+Material Icon
+
+## Button
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `primary`  = false
+-   `accent`  = false
+-   `colored`  = false
+-   `raised`  = false
+-   `icon`  = false
+-   `fab`  = false
+-   `mini-fab`  = false
+-   `disabled`  = false
+
+## Card
+
+**Extends MaterialComponent**
+
+Cards
+
+## Dialog
+
+**Extends MaterialComponent**
+
+Dialogs
+
+## Layout
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `fixed-header`  = false
+-   `fixed-drawer`  = false
+-   `overlay-drawer-button`  = false
+-   `fixed-tabs`  = false
+
+## Layout
+
+**Extends MaterialComponent**
+
+Layouts
+
+## LayoutHeader
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `waterfall`  = false
+-   `scroll`  = false
+
+## LayoutTab
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `active`  
+
+## LayoutTabPanel
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `active`  
+
+## Navigation
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `large-screen-only`  = false
+
+## Grid
+
+**Extends MaterialComponent**
+
+Responsive Grid
+
+**Parameters**
+
+-   `no-spacing`  = false
+
+## Progress
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `indeterminate`  = false
+
+## Spinner
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `active`  = false
+-   `single-color`  = false
+
+## Menu
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `bottom-left`  = true
+-   `bottom-right`  = false
+-   `top-left`  = false
+-   `top-right`  = false
+
+## MenuItem
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `disabled`  = false
+
+## Slider
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `min`  = 0
+-   `max`  = 100
+-   `value`  = 0
+-   `tabindex`  = 0
+-   `disabled`  = false
+
+## Snackbar
+
+**Extends MaterialComponent**
+
+Snackbar
+
+## CheckBox
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `checked`  = false
+-   `disabled`  = false
+
+## Radio
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `name`  (required)
+-   `value`  (required)
+-   `checked`  = false
+-   `disabled`  = false
+
+## IconToggle
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `checked`  = false
+-   `disabled`  = false
+
+## Switch
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `checked`  = false
+-   `disabled`  = false
+
+## Table
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `selectable`  = false
+
+## TableCell
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `non-numeric`  = false
+
+## ListItem
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `two-line`  = false
+-   `three-line`  = false
+
+## TextField
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `floating-label`  = false
+-   `multiline`  = false
+-   `expandable`  = false
+-   `errorMessage`  = null
+-   `icon`  (used with expandable)
+
+## Tooltip
+
+**Extends MaterialComponent**
+
+**Parameters**
+
+-   `for`  [id]
+-   `large`  = false

package.json

@@ -7,13 +7,14 @@
   "minified:main": "dist/preact-mdl.min.js",
   "scripts": {
     "copy-typescript-definition": "copyfiles -f src/index.d.ts dist",
-    "build": "npm-run-all transpile copy-typescript-definition minify size",
+    "build": "npm-run-all transpile copy-typescript-definition minify size docs",
     "transpile": "rollup -c rollup.config.js",
     "minify": "uglifyjs $npm_package_main -cm -o $npm_package_minified_main -p relative --in-source-map ${npm_package_main}.map --source-map ${npm_package_minified_main}.map",
     "size": "echo \"gzip size: $(gzip-size $npm_package_minified_main | pretty-bytes)\"",
     "test": "npm-run-all lint build test:karma",
     "lint": "eslint {src,test}",
     "test:karma": "karma start --single-run",
+    "docs": "documentation build -f md -o docs.md --infer-private=\"^(component|js|nodeName|render|mdlRender|propClassMapping|ripple|constructor|handle.*|options)$\" --markdown-toc src/index.js",
     "prepublish": "npm-run-all build test",
     "release": "npm run -s build && git commit -am $npm_package_version && git tag $npm_package_version && git push && git push --tags && npm publish"
   },
@@ -50,6 +51,7 @@
     "babel-preset-stage-0": "^6.5.0",
     "chai": "^3.5.0",
     "copyfiles": "^1.0.0",
+    "documentation": "^4.0.0-beta.18",
     "eslint": "^2.2.0",
     "eslint-plugin-react": "^4.3.0",
     "gzip-size-cli": "^1.0.0",