Add documentation for time picker

components/time_picker/index.cjsx

@@ -3,20 +3,18 @@ Input      = require '../input'
 TimeDialog = require './dialog'
 
 module.exports = React.createClass
-  displayName     : 'TimePicker'
+  displayName : 'TimePicker'
 
   # -- States & Properties
   propTypes:
-    className     : React.PropTypes.string
-    format        : React.PropTypes.oneOf(['24hr', 'ampm'])
-    value         : React.PropTypes.object
+    format    : React.PropTypes.oneOf(['24hr', 'ampm'])
+    value     : React.PropTypes.object
 
   getDefaultProps: ->
-    className     : ''
-    format        : '24hr'
+    format    : '24hr'
 
   getInitialState: ->
-    value         : @props.value
+    value     : @props.value
 
   # -- Events
   onTimeSelected: (time) ->
@@ -44,6 +42,10 @@ module.exports = React.createClass
     mins  = "0" + mins  if (mins.length < 2)
     return hours + ":" + mins
 
+  # -- Public methods
+  getValue: ->
+    @state.value
+
   # -- Render
   render: ->
     <div>

components/time_picker/time_picker.md

@@ -0,0 +1,28 @@
+# TimePicker
+
+```javascript
+var TimePicker = require('react-toolbox/components/time_picker');
+
+var time = new Date();
+time.setHours(17);
+time.setMinutes(28);
+
+// Initialized time picker with AM-PM format
+<TimePicker format="ampm" value={time} />
+```
+
+## Properties
+
+| Name          | Type    | Default         | Description|
+| ------------- |:-------:|:--------------- |:---------- |
+| **format**    | String  | `24hr`          | Format to display the clock. It can be *24hr* or *ampm*.|
+| **value**     | Date    | `new Date()`    | Datetime object with currrent time by default |
+
+## Methods
+
+#### getValue
+Returns the value of the picker.
+
+```
+input_instance.getValue();
+```

spec/components/pickers.cjsx

@@ -5,7 +5,12 @@ module.exports = React.createClass
   displayName: 'PickersTest'
 
   render: ->
+    time = new Date(1995,11,17);
+    time.setHours(17)
+    time.setMinutes(28)
+
     <section>
       <DatePicker />
+      <TimePicker value={time} />
       <TimePicker format="ampm" />
     </section>