speed increase if using classes

Author: zackify

build/simple-modal.js

@@ -44,13 +44,13 @@ var Modal = (function (_React$Component) {
     key: 'render',
     value: function render() {
       if (!this.props.show) return null;
-      var modalStyle = _extends({}, _styles2['default'].modal, this.props.style);
-      var containerStyle = _extends({}, _styles2['default'].container, this.props.containerStyle);
-
       //completely overwrite if they use a class
       if (this.props.className) {
         modalStyle = this.props.style;
         containerStyle = this.props.containerStyle;
+      } else {
+        var modalStyle = _extends({}, _styles2['default'].modal, this.props.style);
+        var containerStyle = _extends({}, _styles2['default'].container, this.props.containerStyle);
       }
 
       return _react2['default'].createElement(

dist/simple-react-modal.js

@@ -46,13 +46,13 @@ var Modal = (function (_React$Component) {
     key: 'render',
     value: function render() {
       if (!this.props.show) return null;
-      var modalStyle = _extends({}, _styles2['default'].modal, this.props.style);
-      var containerStyle = _extends({}, _styles2['default'].container, this.props.containerStyle);
-
       //completely overwrite if they use a class
       if (this.props.className) {
         modalStyle = this.props.style;
         containerStyle = this.props.containerStyle;
+      } else {
+        var modalStyle = _extends({}, _styles2['default'].modal, this.props.style);
+        var containerStyle = _extends({}, _styles2['default'].container, this.props.containerStyle);
       }
 
       return _react2['default'].createElement(

dist/simple-react-modal.min.js

@@ -25,8 +25,8 @@ export default class App extends React.Component{
         show={this.state.show}
         onClose={this.close.bind(this)}>
 
-        <a style={closeStyle} onClick={this.close.bind(this)}>X</a>
-        <div>hey</div>
+        <a key="close" style={closeStyle} onClick={this.close.bind(this)}>X</a>
+        <div key="content">hey</div>
 
         </Modal>
       </div>

example/src/example.js

@@ -1,7 +1,7 @@
 {
   "name": "simple-react-modal",
   "description": "The simplest modal",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "main": "./build/simple-modal.js",
   "directories": {
     "example": "example"

package.json

@@ -15,14 +15,15 @@ export default class Modal extends React.Component{
 
   render(){
     if(!this.props.show) return null
-    var modalStyle = Object.assign({},styles.modal,this.props.style)
-    var containerStyle = Object.assign({},styles.container,this.props.containerStyle)
-
     //completely overwrite if they use a class
     if(this.props.className){
       modalStyle = this.props.style
       containerStyle = this.props.containerStyle
     }
+    else{
+      var modalStyle = Object.assign({}, styles.modal ,this.props.style)
+      var containerStyle = Object.assign({},styles.container,this.props.containerStyle)
+    }
 
     return (
       <div {...this.props} style={modalStyle} onClick={this.hideOnOuterClick} data-modal="true">