Enable App component to hold refs

components/app/index.jsx

@@ -1,29 +1,24 @@
 import React from 'react';
 import style from './style';
 
-const App = (props) => {
-  let className = style.root;
-  if (props.className) {
-    className += ` ${props.className}`;
+class App extends React.Component {
+  static propTypes = {
+    className: React.PropTypes.string
+  };
+
+  static defaultProps = {
+    className: ''
+  };
+
+  render () {
+    let className = style.root;
+    if (this.props.className) className += ` ${this.props.className}`;
+    return (
+      <div data-react-toolbox='app' className={className}>
+        {this.props.children}
+      </div>
+    );
   }
-
-  return (
-    <div
-      className={className}
-      data-react-toolbox='app'
-      id='react-toolbox-app'
-    >
-      {props.children}
-    </div>
-  );
-};
-
-App.propTypes = {
-  className: React.PropTypes.string
-};
-
-App.defaultProps = {
-  className: ''
-};
+}
 
 export default App;

components/overlay/index.jsx

@@ -15,7 +15,7 @@ class Overlay extends React.Component {
   };
 
   componentDidMount () {
-    this.app = document.getElementById('react-toolbox-app') || document.body;
+    this.app = document.querySelector('[data-react-toolbox="app"]') || document.body;
     this.node = document.createElement('div');
     this.node.setAttribute('data-react-toolbox', 'overlay');
     this.app.appendChild(this.node);