Add keyboard navigator widget example. Resolve #112

Author: amio

README.md

@@ -30,7 +30,7 @@ All attributes are optional.
 - `widgets` {Array of ReactClass} Indicator and switcher could be various,
   so it's not builtin. Here's some example custom widgets
   ([dots indicator](src/indicator-dots.js),
-  [prev/next buttons](src/buttons.js)):
+  [prev/next buttons](src/buttons.js), [keyboard navigation](src/keyboard-navigator)):
 
   ```javascript
   import Carousel from 're-carousel'

src/keyboard-navigator.js

@@ -0,0 +1,26 @@
+import React from 'react'
+
+export default class KeyboardNavigator extends React.Component {
+  onKeydown = event => {
+    const { prevHandler, nextHandler } = this.props
+    switch (event.key) {
+      case 'j':
+        prevHandler()
+        break;
+      case 'k':
+        nextHandler()
+        break
+    }
+  }
+
+  componentDidMount () {
+    const { index, total, loop, prevHandler, nextHandler } = props
+    window.addEventListener('keydown', this.onKeydown)
+  }
+
+  componentWillUnmount () {
+    window.removeEventListener('keydown', this.onKeydown)
+  }
+
+  render () { return null }
+}