<Form/> can save in localstorage

components/form.cjsx

@@ -2,16 +2,18 @@
 @todo
 ###
 
-Style     = require './style/form'
-Button    = require "./button"
-Input     = require "./input"
+Style         = require './style/form'
+Autocomplete  = require "./autocomplete"
+Button        = require "./button"
+Input         = require "./input"
 
 module.exports = React.createClass
 
   # -- States & Properties
   propTypes:
     attributes        : React.PropTypes.array
-    storage           : React.PropTypes.bool
+    storage           : React.PropTypes.string
+    className         : React.PropTypes.string
     # -- Events
     onSubmit          : React.PropTypes.func
     onError           : React.PropTypes.func
@@ -20,10 +22,9 @@ module.exports = React.createClass
 
   getDefaultProps: ->
     attributes        : []
-    storage           : false
 
   getInitialState: ->
-    attributes        : @props.attributes
+    attributes        : if @props.storage then do @storage else @props.attributes
 
   # -- Events
   onSubmit: (event) ->
@@ -39,6 +40,7 @@ module.exports = React.createClass
       break
 
     @props.onChange? event, @
+    @storage value if @props.storage
     if is_valid
       @refs.submit?.getDOMNode().removeAttribute "disabled"
       @props.onValid? event, @
@@ -48,13 +50,14 @@ module.exports = React.createClass
 
   # -- Render
   render: ->
-    <form data-component-form
-          onSubmit={@onSubmit}
-          onChange={@onChange}>
+    <form data-component-form className={@props.className}
+          onSubmit={@onSubmit} onChange={@onChange}>
       {
         for attribute, index in @props.attributes
           if attribute.type is "submit"
             <Button {...attribute} type="square" ref="submit" onClick={@onSubmit}/>
+          else if attribute.type is "autocomplete"
+            <Autocomplete {...attribute} onChange={@onChange}/>
           else
             <Input {...attribute} />
       }
@@ -62,6 +65,17 @@ module.exports = React.createClass
     </form>
 
   # -- Extends
+  storage: (value) ->
+    key = "react-toolbox-form-#{@props.storage}"
+    if value
+      store = {}
+      store[attr.ref] = value[attr.ref] for attr in @props.attributes when attr.storage
+      window.localStorage.setItem key, JSON.stringify store
+    else
+      store = JSON.parse window.localStorage.getItem key or {}
+      input.value = store?[input.ref] or input.value for input in @props.attributes
+      @props.attributes
+
   getValue: ->
     value = {}
     value[ref] = el.getValue() for ref, el of @refs when el.getValue?