Avoid contents wrapping

This changes the API so that there must only be a single child
element under HotKeys.

No tabIndex manipulation unless used explicitly.

examples/master/index.js

@@ -51,7 +51,9 @@ const App = React.createClass({
           </ul>
         </div>
         <HotKeys handlers={handlers} className={'viewport ' + (this.state && this.state.konamiTime ? 'konamiTime' : '')}>
-          {Array.apply(null, new Array(10)).map((e, i) => <Node key={i} />)}
+          <div>
+            {Array.apply(null, new Array(10)).map((e, i) => <Node key={i} />)}
+          </div>
         </HotKeys>
       </div>
     );
@@ -111,7 +113,9 @@ const Node = React.createClass({
     //   or focused programattically
     return (
       <HotKeys tabIndex="0" handlers={handlers} className="node" style={style}>
-        Node
+        <div>
+          Node
+        </div>
       </HotKeys>
     );
   }

lib/HotKeys.js

@@ -163,11 +163,23 @@ const HotKeys = React.createClass({
   render() {
     const {children, keyMap, handlers, focused, attach, ...props} = this.props;
 
-    return (
-      <FocusTrap {...props} onFocus={this.onFocus} onBlur={this.onBlur}>
-        {children}
-      </FocusTrap>
-    );
+    const child = React.Children.only(children);
+    const childProps = child.props;
+
+    props.onFocus = (...args) => {
+        if (childProps.onFocus) {
+            childProps.onFocus(...args);
+        }
+        this.onFocus(...args);
+    };
+    props.onBlur = (...args) => {
+        if (childProps.onBlur) {
+            childProps.onBlur(...args);
+        }
+        this.onBlur(...args);
+    };
+
+    return React.cloneElement(child, props);
   }
 
 });