[added] Supporting custom className

reactjs · Nov 12, 2014 · b15aa82 · b15aa82
1 parent b7a38de
commit b15aa82
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/lib/components/ModalPortal.js b/lib/components/ModalPortal.js
@@ -2,6 +2,7 @@ var React = require('react');
 var div = React.DOM.div;
 var focusManager = require('../helpers/focusManager');
 var scopeTab = require('../helpers/scopeTab');
+var cx = require('react/lib/cx');
 
 // so that our CSS is statically analyzable
 var CLASS_NAMES = {
@@ -147,7 +148,7 @@ var ModalPortal = module.exports = React.createClass({
       },
         div({
           ref: "content",
-          className: this.buildClassName('content'),
+          className: cx(this.buildClassName('content'), this.props.className),
           tabIndex: "-1",
           onClick: stopPropagation,
           onKeyDown: this.handleKeyDown

diff --git a/specs/Modal.spec.js b/specs/Modal.spec.js
@@ -98,6 +98,12 @@ describe('Modal', function () {
     });
   });
 
+  it('supports custom className', function() {
+    var modal = renderModal({isOpen: true, className: 'myClass'});
+    equal(modal.portal.refs.content.getDOMNode().className.contains('myClass'), true);
+    unmountModal();
+  });
+
   it('adds --after-open for animations', function() {
     var modal = renderModal({isOpen: true});
     var overlay = document.querySelector('.ReactModal__Overlay');