react-bootstrap - npm Package Compare versions

Comparing version 0.12.0 to 0.13.0

Accordion.js

@@ -1,3 +0,1 @@
-/** @jsx React.DOM */
-
 var React = require('react');
@@ -8,4 +6,4 @@ var PanelGroup = require('./PanelGroup');
   render: function () {
-    return this.transferPropsTo(
-      PanelGroup( {accordion:true}, 
+    return (
+      React.createElement(PanelGroup, React.__spread({},  this.props, {accordion: true}), 
         this.props.children
@@ -12,0 +10,0 @@ )

Affix.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var AffixMixin = require('./AffixMixin');
@@ -16,4 +15,4 @@ var domUtils = require('./utils/domUtils');
     var holderStyle = {top: this.state.affixPositionTop};
-    return this.transferPropsTo(
-      React.DOM.div( {className:this.state.affixClass, style:holderStyle}, 
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, this.state.affixClass), style: holderStyle}), 
         this.props.children
@@ -20,0 +19,0 @@ )

Alert.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -25,8 +24,8 @@ var BootstrapMixin = require('./BootstrapMixin');
     return (
-      React.DOM.button(
-        {type:"button",
-        className:"close",
-        onClick:this.props.onDismiss,
-        'aria-hidden':"true"}, 
-        " × "
+      React.createElement("button", {
+        type: "button", 
+        className: "close", 
+        onClick: this.props.onDismiss, 
+        'aria-hidden': "true"}, 
+        "×"
       )
@@ -42,5 +41,5 @@ );
 
-    return this.transferPropsTo(
-      React.DOM.div( {className:classSet(classes)}, 
-        isDismissable ? this.renderDismissButton() : null,
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
+        isDismissable ? this.renderDismissButton() : null, 
         this.props.children
@@ -47,0 +46,0 @@ )

Badge.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
@@ -9,3 +8,3 @@ var classSet = require('./utils/classSet');
   propTypes: {
-    pullRight: React.PropTypes.bool,
+    pullRight: React.PropTypes.bool
   },
@@ -16,6 +15,9 @@
       'pull-right': this.props.pullRight,
-      'badge': ValidComponentChildren.hasValidComponent(this.props.children)
+      'badge': (ValidComponentChildren.hasValidComponent(this.props.children)
+        || (typeof this.props.children === 'string'))
     };
-    return this.transferPropsTo(
-      React.DOM.span( {className:classSet(classes)}, 
+    return (
+      React.createElement("span", React.__spread({}, 
+        this.props, 
+        {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -22,0 +24,0 @@ )

Button.js

@@ -1,7 +0,5 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
 var BootstrapMixin = require('./BootstrapMixin');
-var CustomPropTypes = require('./utils/CustomPropTypes');
 
@@ -17,3 +15,3 @@ var Button = React.createClass({displayName: 'Button',
     navDropdown: React.PropTypes.bool,
-    componentClass: CustomPropTypes.componentClass
+    componentClass: React.PropTypes.node
   },
@@ -47,11 +45,13 @@
   renderAnchor: function (classes) {
-    var component = this.props.componentClass || React.DOM.a;
+
+    var Component = this.props.componentClass || 'a';
     var href = this.props.href || '#';
     classes['disabled'] = this.props.disabled;
 
-    return this.transferPropsTo(
-      component(
-        {href:href,
-        className:classSet(classes),
-        role:"button"}, 
+    return (
+      React.createElement(Component, React.__spread({}, 
+        this.props, 
+        {href: href, 
+        className: joinClasses(this.props.className, classSet(classes)), 
+        role: "button"}), 
         this.props.children
@@ -63,7 +63,8 @@ )
   renderButton: function (classes) {
-    var component = this.props.componentClass || React.DOM.button;
+    var Component = this.props.componentClass || 'button';
 
-    return this.transferPropsTo(
-      component(
-        {className:classSet(classes)}, 
+    return (
+      React.createElement(Component, React.__spread({}, 
+        this.props, 
+        {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -80,3 +81,3 @@ )
     return (
-      React.DOM.li( {className:classSet(liClasses)}, 
+      React.createElement("li", {className: classSet(liClasses)}, 
         this.renderAnchor(classes)
@@ -83,0 +84,0 @@ )

ButtonGroup.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -28,5 +27,6 @@ var BootstrapMixin = require('./BootstrapMixin');
 
-    return this.transferPropsTo(
-      React.DOM.div(
-        {className:classSet(classes)}, 
+    return (
+      React.createElement("div", React.__spread({}, 
+        this.props, 
+        {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -33,0 +33,0 @@ )

ButtonToolbar.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -20,6 +19,7 @@ var BootstrapMixin = require('./BootstrapMixin');
 
-    return this.transferPropsTo(
-      React.DOM.div(
-        {role:"toolbar",
-        className:classSet(classes)}, 
+    return (
+      React.createElement("div", React.__spread({}, 
+        this.props, 
+        {role: "toolbar", 
+        className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -26,0 +26,0 @@ )

Carousel.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -145,11 +144,12 @@ var cloneWithProps = require('./utils/cloneWithProps');
 
-    return this.transferPropsTo(
-      React.DOM.div(
-        {className:classSet(classes),
-        onMouseOver:this.handleMouseOver,
-        onMouseOut:this.handleMouseOut}, 
-        this.props.indicators ? this.renderIndicators() : null,
-        React.DOM.div( {className:"carousel-inner", ref:"inner"}, 
+    return (
+      React.createElement("div", React.__spread({}, 
+        this.props, 
+        {className: joinClasses(this.props.className, classSet(classes)), 
+        onMouseOver: this.handleMouseOver, 
+        onMouseOut: this.handleMouseOut}), 
+        this.props.indicators ? this.renderIndicators() : null, 
+        React.createElement("div", {className: "carousel-inner", ref: "inner"}, 
           ValidComponentChildren.map(this.props.children, this.renderItem)
-        ),
+        ), 
         this.props.controls ? this.renderControls() : null
@@ -162,4 +162,4 @@ )
     return (
-      React.DOM.a( {className:"left carousel-control", href:"#prev", key:0, onClick:this.prev}, 
-        React.DOM.span( {className:"glyphicon glyphicon-chevron-left"} )
+      React.createElement("a", {className: "left carousel-control", href: "#prev", key: 0, onClick: this.prev}, 
+        React.createElement("span", {className: "glyphicon glyphicon-chevron-left"})
       )
@@ -171,4 +171,4 @@ );
     return (
-      React.DOM.a( {className:"right carousel-control", href:"#next", key:1, onClick:this.next}, 
-        React.DOM.span( {className:"glyphicon glyphicon-chevron-right"})
+      React.createElement("a", {className: "right carousel-control", href: "#next", key: 1, onClick: this.next}, 
+        React.createElement("span", {className: "glyphicon glyphicon-chevron-right"})
       )
@@ -200,6 +200,6 @@ );
     return (
-      React.DOM.li(
-        {key:index,
-        className:className,
-        onClick:this.handleSelect.bind(this, index, null)} )
+      React.createElement("li", {
+        key: index, 
+        className: className, 
+        onClick: this.handleSelect.bind(this, index, null)})
     );
@@ -222,3 +222,3 @@ },
     return (
-      React.DOM.ol( {className:"carousel-indicators"}, 
+      React.createElement("ol", {className: "carousel-indicators"}, 
         indicators
@@ -256,5 +256,4 @@ )
           active: isActive,
-          ref: child.props.ref,
-          key: child.props.key != null ?
-            child.props.key : index,
+          ref: child.ref,
+          key: child.key ? child.key : index,
           index: index,
@@ -261,0 +260,0 @@ animateOut: isPreviousActive,

CarouselItem.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -12,3 +11,3 @@ var TransitionEvents = require('./utils/TransitionEvents');
     active: React.PropTypes.bool,
-    caption: React.PropTypes.renderable
+    caption: React.PropTypes.node
   },
@@ -78,5 +77,5 @@
 
-    return this.transferPropsTo(
-      React.DOM.div( {className:classSet(classes)}, 
-        this.props.children,
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
+        this.props.children, 
         this.props.caption ? this.renderCaption() : null
@@ -89,3 +88,3 @@ )
     return (
-      React.DOM.div( {className:"carousel-caption"}, 
+      React.createElement("div", {className: "carousel-caption"}, 
         this.props.caption
@@ -92,0 +91,0 @@ )

Col.js

@@ -1,6 +0,4 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
-var CustomPropTypes = require('./utils/CustomPropTypes');
 var constants = require('./constants');
@@ -27,3 +25,3 @@
     lgPull: React.PropTypes.number,
-    componentClass: CustomPropTypes.componentClass.isRequired
+    componentClass: React.PropTypes.node.isRequired
   },
@@ -33,3 +31,3 @@
     return {
-      componentClass: React.DOM.div
+      componentClass: 'div'
     };
@@ -39,3 +37,3 @@ },
   render: function () {
-    var componentClass = this.props.componentClass;
+    var ComponentClass = this.props.componentClass;
     var classes = {};
@@ -71,4 +69,4 @@
 
-    return this.transferPropsTo(
-      componentClass( {className:classSet(classes)}, 
+    return (
+      React.createElement(ComponentClass, React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -75,0 +73,0 @@ )

CollapsableMixin.js

@@ -50,3 +50,3 @@ var React = require('react');
     if (node) {
-      TransitionEvents.addEndEventListener(
+      TransitionEvents.removeEndEventListener(
         node,
@@ -72,11 +72,6 @@ this.handleTransitionEnd
     this._removeEndTransitionListener();
-    if (node && nextProps.expanded !== this.props.expanded && this.props.expanded) {
-      node.style[dimension] = this.getCollapsableDimensionValue() + 'px';
-    }
   },
 
   componentDidUpdate: function (prevProps, prevState) {
-    if (this.state.collapsing !== prevState.collapsing) {
-      this._afterRender();
-    }
+    this._afterRender();
   },
@@ -94,13 +89,8 @@
   _updateDimensionAfterRender: function () {
-    var dimension = (typeof this.getCollapsableDimension === 'function') ?
-      this.getCollapsableDimension() : 'height';
     var node = this.getCollapsableDOMNode();
-
     if (node) {
-        if(this.isExpanded() && !this.state.collapsing) {
-            node.style[dimension] = 'auto';
-        } else {
-            node.style[dimension] = this.isExpanded() ?
-              this.getCollapsableDimensionValue() + 'px' : '0px';
-        }
+        var dimension = (typeof this.getCollapsableDimension === 'function') ?
+            this.getCollapsableDimension() : 'height';
+        node.style[dimension] = this.isExpanded() ?
+            this.getCollapsableDimensionValue() + 'px' : '0px';
     }
@@ -133,2 +123,2 @@ },
 
-module.exports = CollapsableMixin;
+module.exports = CollapsableMixin;

DropdownButton.js

@@ -1,6 +0,6 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var createChainedFunction = require('./utils/createChainedFunction');
@@ -21,3 +21,3 @@ var BootstrapMixin = require('./BootstrapMixin');
     dropup:    React.PropTypes.bool,
-    title:     React.PropTypes.renderable,
+    title:     React.PropTypes.node,
     href:      React.PropTypes.string,
@@ -36,20 +36,21 @@ onClick:   React.PropTypes.func,
     return this[renderMethod]([
-      this.transferPropsTo(Button(
-        {ref:"dropdownButton",
-        className:className,
-        onClick:this.handleDropdownClick,
-        key:0,
-        navDropdown:this.props.navItem,
-        navItem:null,
-        title:null,
-        pullRight:null,
-        dropup:null}, 
-        this.props.title,' ',
-        React.DOM.span( {className:"caret"} )
-      )),
-      DropdownMenu(
-        {ref:"menu",
-        'aria-labelledby':this.props.id,
-        pullRight:this.props.pullRight,
-        key:1}, 
+      React.createElement(Button, React.__spread({}, 
+        this.props, 
+        {ref: "dropdownButton", 
+        className: joinClasses(this.props.className, className), 
+        onClick: this.handleDropdownClick, 
+        key: 0, 
+        navDropdown: this.props.navItem, 
+        navItem: null, 
+        title: null, 
+        pullRight: null, 
+        dropup: null}), 
+        this.props.title, ' ', 
+        React.createElement("span", {className: "caret"})
+      ),
+      React.createElement(DropdownMenu, {
+        ref: "menu", 
+        'aria-labelledby': this.props.id, 
+        pullRight: this.props.pullRight, 
+        key: 1}, 
         ValidComponentChildren.map(this.props.children, this.renderMenuItem)
@@ -67,5 +68,5 @@ )
     return (
-      ButtonGroup(
-        {bsSize:this.props.bsSize,
-        className:classSet(groupClasses)}, 
+      React.createElement(ButtonGroup, {
+        bsSize: this.props.bsSize, 
+        className: classSet(groupClasses)}, 
         children
@@ -84,3 +85,3 @@ )
     return (
-      React.DOM.li( {className:classSet(classes)}, 
+      React.createElement("li", {className: classSet(classes)}, 
         children
@@ -91,3 +92,3 @@ )
 
-  renderMenuItem: function (child) {
+  renderMenuItem: function (child, index) {
     // Only handle the option selection if an onSelect prop has been set on the
@@ -106,4 +107,4 @@ // component or it's child, this allows a user not to pass an onSelect
         // Force special props to be transferred
-        key: child.props.key,
-        ref: child.props.ref
+        key: child.key ? child.key : index,
+        ref: child.ref
       }
@@ -110,0 +111,0 @@ );

DropdownMenu.js

@@ -1,6 +0,6 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var createChainedFunction = require('./utils/createChainedFunction');
@@ -21,6 +21,7 @@ var ValidComponentChildren = require('./utils/ValidComponentChildren');
 
-    return this.transferPropsTo(
-        React.DOM.ul(
-          {className:classSet(classes),
-          role:"menu"}, 
+    return (
+        React.createElement("ul", React.__spread({}, 
+          this.props, 
+          {className: joinClasses(this.props.className, classSet(classes)), 
+          role: "menu"}), 
           ValidComponentChildren.map(this.props.children, this.renderMenuItem)
@@ -31,3 +32,3 @@ )
 
-  renderMenuItem: function (child) {
+  renderMenuItem: function (child, index) {
     return cloneWithProps(
@@ -40,4 +41,4 @@ child,
         // Force special props to be transferred
-        key: child.props.key,
-        ref: child.props.ref
+        key: child.key ? child.key : index,
+        ref: child.ref
       }
@@ -44,0 +45,0 @@ );

FadeMixin.js

@@ -1,4 +0,17 @@
-var React = require('react');
+/*global document */
+// TODO: listen for onTransitionEnd to remove el
+function getElementsAndSelf (root, classes){
+  var els = root.querySelectorAll('.' + classes.join('.'));
 
-// TODO: listen for onTransitionEnd to remove el
+  els = [].map.call(els, function(e){ return e; });
+
+  for(var i = 0; i < classes.length; i++){
+    if( !root.className.match(new RegExp('\\b' +  classes[i] + '\\b'))){
+      return els;
+    }
+  }
+  els.unshift(root);
+  return els;
+}
+
 module.exports = {
@@ -9,5 +22,6 @@ _fadeIn: function () {
     if (this.isMounted()) {
-      els = this.getDOMNode().querySelectorAll('.fade');
+      els = getElementsAndSelf(this.getDOMNode(), ['fade']);
+
       if (els.length) {
-        Array.prototype.forEach.call(els, function (el) {
+        els.forEach(function (el) {
           el.className += ' in';
@@ -20,6 +34,6 @@ });
   _fadeOut: function () {
-    var els = this._fadeOutEl.querySelectorAll('.fade.in');
+    var els = getElementsAndSelf(this._fadeOutEl, ['fade', 'in']);
 
     if (els.length) {
-      Array.prototype.forEach.call(els, function (el) {
+      els.forEach(function (el) {
         el.className = el.className.replace(/\bin\b/, '');
@@ -46,6 +60,8 @@ });
   componentWillUnmount: function () {
-    var els = this.getDOMNode().querySelectorAll('.fade');
+    var els = getElementsAndSelf(this.getDOMNode(), ['fade']),
+        container = (this.props.container && this.props.container.getDOMNode()) || document.body;
+
     if (els.length) {
       this._fadeOutEl = document.createElement('div');
-      document.body.appendChild(this._fadeOutEl);
+      container.appendChild(this._fadeOutEl);
       this._fadeOutEl.appendChild(this.getDOMNode().cloneNode(true));
@@ -52,0 +68,0 @@ // Firefox needs delay for transition to be triggered

Glyphicon.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -26,4 +25,4 @@ var BootstrapMixin = require('./BootstrapMixin');
 
-    return this.transferPropsTo(
-      React.DOM.span( {className:classSet(classes)}, 
+    return (
+      React.createElement("span", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -30,0 +29,0 @@ )

Grid.js

@@ -1,11 +0,8 @@
-/** @jsx React.DOM */
-
 var React = require('react');
-var CustomPropTypes = require('./utils/CustomPropTypes');
+var joinClasses = require('./utils/joinClasses');
 
-
 var Grid = React.createClass({displayName: 'Grid',
   propTypes: {
     fluid: React.PropTypes.bool,
-    componentClass: CustomPropTypes.componentClass.isRequired
+    componentClass: React.PropTypes.node.isRequired
   },
@@ -15,3 +12,3 @@
     return {
-      componentClass: React.DOM.div
+      componentClass: 'div'
     };
@@ -21,6 +18,9 @@ },
   render: function () {
-    var componentClass = this.props.componentClass;
+    var ComponentClass = this.props.componentClass;
+    var className = this.props.fluid ? 'container-fluid' : 'container';
 
-    return this.transferPropsTo(
-      componentClass( {className:this.props.fluid ? 'container-fluid' : 'container'}, 
+    return (
+      React.createElement(ComponentClass, React.__spread({}, 
+        this.props, 
+        {className: joinClasses(this.props.className, className)}), 
         this.props.children
@@ -27,0 +27,0 @@ )

Input.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -10,6 +9,8 @@ var Button = require('./Button');
     type: React.PropTypes.string,
-    label: React.PropTypes.renderable,
-    help: React.PropTypes.renderable,
-    addonBefore: React.PropTypes.renderable,
-    addonAfter: React.PropTypes.renderable,
+    label: React.PropTypes.node,
+    help: React.PropTypes.node,
+    addonBefore: React.PropTypes.node,
+    addonAfter: React.PropTypes.node,
+    buttonBefore: React.PropTypes.node,
+    buttonAfter: React.PropTypes.node,
     bsStyle: function(props) {
@@ -27,3 +28,4 @@ if (props.type === 'submit') {
     wrapperClassName: React.PropTypes.string,
-    labelClassName: React.PropTypes.string
+    labelClassName: React.PropTypes.string,
+    disabled: React.PropTypes.bool
   },
@@ -55,2 +57,6 @@
 
+  isFile: function () {
+    return this.props.type === 'file';
+  },
+
   renderInput: function () {
@@ -66,3 +72,3 @@ var input = null;
         input = (
-          React.DOM.select( {className:"form-control", ref:"input", key:"input"}, 
+          React.createElement("select", React.__spread({},  this.props, {className: joinClasses(this.props.className, 'form-control'), ref: "input", key: "input"}), 
             this.props.children
@@ -73,7 +79,7 @@ )
       case 'textarea':
-        input = React.DOM.textarea( {className:"form-control", ref:"input", key:"input"} );
+        input = React.createElement("textarea", React.__spread({},  this.props, {className: joinClasses(this.props.className, 'form-control'), ref: "input", key: "input"}));
         break;
       case 'static':
         input = (
-          React.DOM.p( {className:"form-control-static", ref:"input",  key:"input"}, 
+          React.createElement("p", React.__spread({},  this.props, {className: joinClasses(this.props.className, 'form-control-static'), ref: "input", key: "input"}), 
             this.props.value
@@ -84,12 +90,12 @@ )
       case 'submit':
-        input = this.transferPropsTo(
-          Button( {componentClass:React.DOM.input} )
+        input = (
+          React.createElement(Button, React.__spread({},  this.props, {componentClass: "input", ref: "input", key: "input"}))
         );
         break;
       default:
-        var className = this.isCheckboxOrRadio() ? '' : 'form-control';
-        input = React.DOM.input( {className:className, ref:"input", key:"input"} );
+        var className = this.isCheckboxOrRadio() || this.isFile() ? '' : 'form-control';
+        input = React.createElement("input", React.__spread({},  this.props, {className: joinClasses(this.props.className, className), ref: "input", key: "input"}));
     }
 
-    return this.transferPropsTo(input);
+    return input;
   },
@@ -99,3 +105,3 @@
     var addonBefore = this.props.addonBefore ? (
-      React.DOM.span( {className:"input-group-addon", key:"addonBefore"}, 
+      React.createElement("span", {className: "input-group-addon", key: "addonBefore"}, 
         this.props.addonBefore
@@ -106,3 +112,3 @@ )
     var addonAfter = this.props.addonAfter ? (
-      React.DOM.span( {className:"input-group-addon", key:"addonAfter"}, 
+      React.createElement("span", {className: "input-group-addon", key: "addonAfter"}, 
         this.props.addonAfter
@@ -112,8 +118,22 @@ )
 
-    return addonBefore || addonAfter ? (
-      React.DOM.div( {className:"input-group", key:"input-group"}, 
-        addonBefore,
-        children,
-        addonAfter
+    var buttonBefore = this.props.buttonBefore ? (
+      React.createElement("span", {className: "input-group-btn"}, 
+        this.props.buttonBefore
       )
+    ) : null;
+
+    var buttonAfter = this.props.buttonAfter ? (
+      React.createElement("span", {className: "input-group-btn"}, 
+        this.props.buttonAfter
+      )
+    ) : null;
+
+    return addonBefore || addonAfter || buttonBefore || buttonAfter ? (
+      React.createElement("div", {className: "input-group", key: "input-group"}, 
+        addonBefore, 
+        buttonBefore, 
+        children, 
+        addonAfter, 
+        buttonAfter
+      )
     ) : children;
@@ -132,3 +152,3 @@ },
     return this.props.hasFeedback ? (
-      React.DOM.span( {className:classSet(classes), key:"icon"} )
+      React.createElement("span", {className: classSet(classes), key: "icon"})
     ) : null;
@@ -139,3 +159,3 @@ },
     return this.props.help ? (
-      React.DOM.span( {className:"help-block", key:"help"}, 
+      React.createElement("span", {className: "help-block", key: "help"}, 
         this.props.help
@@ -153,3 +173,3 @@ )
     return (
-      React.DOM.div( {className:classSet(classes), key:"checkboxRadioWrapper"}, 
+      React.createElement("div", {className: classSet(classes), key: "checkboxRadioWrapper"}, 
         children
@@ -162,3 +182,3 @@ )
     return this.props.wrapperClassName ? (
-      React.DOM.div( {className:this.props.wrapperClassName, key:"wrapper"}, 
+      React.createElement("div", {className: this.props.wrapperClassName, key: "wrapper"}, 
         children
@@ -176,4 +196,4 @@ )
     return this.props.label ? (
-      React.DOM.label( {htmlFor:this.props.id, className:classSet(classes), key:"label"}, 
-        children,
+      React.createElement("label", {htmlFor: this.props.id, className: classSet(classes), key: "label"}, 
+        children, 
         this.props.label
@@ -195,3 +215,3 @@ )
     return (
-      React.DOM.div( {className:classSet(classes)}, 
+      React.createElement("div", {className: classSet(classes)}, 
         children
@@ -198,0 +218,0 @@ )

Interpolate.js

@@ -5,4 +5,4 @@ // https://www.npmjs.org/package/react-interpolate-component
 var React = require('react');
-var merge = require('./utils/merge');
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
+var assign = require('./utils/Object.assign');
 
@@ -19,10 +19,12 @@ var REGEXP = /\%\((.+?)\)s/;
   getDefaultProps: function() {
-    return { component: React.DOM.span };
+    return { component: 'span' };
   },
 
   render: function() {
-    var format = ValidComponentChildren.hasValidComponent(this.props.children) ? this.props.children : this.props.format;
+    var format = (ValidComponentChildren.hasValidComponent(this.props.children) ||
+        (typeof this.props.children === 'string')) ?
+        this.props.children : this.props.format;
     var parent = this.props.component;
     var unsafe = this.props.unsafe === true;
-    var props = merge(this.props);
+    var props = assign({}, this.props);
 
@@ -45,3 +47,3 @@ delete props.children;
 
-        if (React.isValidComponent(html)) {
+        if (React.isValidElement(html)) {
           throw new Error('cannot interpolate a React component into unsafe text');
@@ -57,5 +59,5 @@ }
 
-      return parent(props);
+      return React.createElement(parent, props);
     } else {
-      var args = format.split(REGEXP).reduce(function(memo, match, index) {
+      var kids = format.split(REGEXP).reduce(function(memo, match, index) {
         var child;
@@ -77,5 +79,5 @@
         return memo;
-      }, [props]);
+      }, []);
 
-      return parent.apply(null, args);
+      return React.createElement(parent, props, kids);
     }
@@ -82,0 +84,0 @@ }

Jumbotron.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 
@@ -8,4 +7,4 @@ var Jumbotron = React.createClass({displayName: 'Jumbotron',
   render: function () {
-    return this.transferPropsTo(
-      React.DOM.div( {className:"jumbotron"}, 
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, 'jumbotron')}), 
         this.props.children
@@ -12,0 +11,0 @@ )

Label.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -20,4 +19,4 @@ var BootstrapMixin = require('./BootstrapMixin');
 
-    return this.transferPropsTo(
-      React.DOM.span( {className:classSet(classes)}, 
+    return (
+      React.createElement("span", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -24,0 +23,0 @@ )

ListGroup.js

@@ -1,6 +0,5 @@
-/** @jsx React.DOM */
-
 var React = require('react');
 var classSet = require('./utils/classSet');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
@@ -16,3 +15,3 @@ var createChainedFunction = require('./utils/createChainedFunction');
     return (
-      React.DOM.div( {className:"list-group"}, 
+      React.createElement("div", {className: "list-group"}, 
         ValidComponentChildren.map(this.props.children, this.renderListItem)
@@ -23,7 +22,7 @@ )
 
-  renderListItem: function (child) {
+  renderListItem: function (child, index) {
     return cloneWithProps(child, {
       onClick: createChainedFunction(child.props.onClick, this.props.onClick),
-      ref: child.props.ref,
-      key: child.props.key
+      ref: child.ref,
+      key: child.key ? child.key : index
     });
@@ -30,0 +29,0 @@ }

ListGroupItem.js

@@ -1,7 +0,7 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var BootstrapMixin = require('./BootstrapMixin');
 var classSet = require('./utils/classSet');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
@@ -16,4 +16,5 @@
     disabled: React.PropTypes.any,
-    header: React.PropTypes.renderable,
-    onClick: React.PropTypes.func
+    header: React.PropTypes.node,
+    onClick: React.PropTypes.func,
+    eventKey: React.PropTypes.any
   },
@@ -41,4 +42,4 @@
   renderSpan: function (classes) {
-    return this.transferPropsTo(
-      React.DOM.span( {className:classSet(classes)}, 
+    return (
+      React.createElement("span", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.header ? this.renderStructuredContent() : this.props.children
@@ -50,6 +51,7 @@ )
   renderAnchor: function (classes) {
-    return this.transferPropsTo(
-      React.DOM.a(
-        {className:classSet(classes),
-        onClick:this.handleClick}, 
+    return (
+      React.createElement("a", React.__spread({}, 
+        this.props, 
+        {className: joinClasses(this.props.className, classSet(classes)), 
+        onClick: this.handleClick}), 
         this.props.header ? this.renderStructuredContent() : this.props.children
@@ -62,3 +64,3 @@ )
     var header;
-    if (React.isValidComponent(this.props.header)) {
+    if (React.isValidElement(this.props.header)) {
       header = cloneWithProps(this.props.header, {
@@ -69,3 +71,3 @@ className: 'list-group-item-heading'
       header = (
-        React.DOM.h4( {className:"list-group-item-heading"}, 
+        React.createElement("h4", {className: "list-group-item-heading"}, 
           this.props.header
@@ -77,3 +79,3 @@ )
     var content = (
-      React.DOM.p( {className:"list-group-item-text"}, 
+      React.createElement("p", {className: "list-group-item-text"}, 
         this.props.children
@@ -92,3 +94,3 @@ )
       e.preventDefault();
-      this.props.onClick(this.props.key, this.props.href);
+      this.props.onClick(this.props.eventKey, this.props.href);
     }
@@ -95,0 +97,0 @@ }

MenuItem.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -8,7 +7,8 @@
   propTypes: {
-    header:   React.PropTypes.bool,
-    divider:  React.PropTypes.bool,
-    href:     React.PropTypes.string,
-    title:    React.PropTypes.string,
-    onSelect: React.PropTypes.func
+    header:    React.PropTypes.bool,
+    divider:   React.PropTypes.bool,
+    href:      React.PropTypes.string,
+    title:     React.PropTypes.string,
+    onSelect:  React.PropTypes.func,
+    eventKey: React.PropTypes.any
   },
@@ -25,3 +25,3 @@
       e.preventDefault();
-      this.props.onSelect(this.props.key);
+      this.props.onSelect(this.props.eventKey);
     }
@@ -32,3 +32,3 @@ },
     return (
-      React.DOM.a( {onClick:this.handleClick, href:this.props.href, title:this.props.title, tabIndex:"-1"}, 
+      React.createElement("a", {onClick: this.handleClick, href: this.props.href, title: this.props.title, tabIndex: "-1"}, 
         this.props.children
@@ -52,4 +52,5 @@ )
 
-    return this.transferPropsTo(
-      React.DOM.li( {role:"presentation", title:null, href:null, className:classSet(classes)}, 
+    return (
+      React.createElement("li", React.__spread({},  this.props, {role: "presentation", title: null, href: null, 
+        className: joinClasses(this.props.className, classSet(classes))}), 
         children
@@ -56,0 +57,0 @@ )

Modal.js

@@ -1,5 +0,5 @@
-/** @jsx React.DOM */
 /* global document:false */
 
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -20,3 +20,3 @@ var BootstrapMixin = require('./BootstrapMixin');
   propTypes: {
-    title: React.PropTypes.renderable,
+    title: React.PropTypes.node,
     backdrop: React.PropTypes.oneOf(['static', true, false]),
@@ -51,14 +51,15 @@ keyboard: React.PropTypes.bool,
 
-    var modal = this.transferPropsTo(
-      React.DOM.div(
-        {title:null,
-        tabIndex:"-1",
-        role:"dialog",
-        style:modalStyle,
-        className:classSet(classes),
-        onClick:this.props.backdrop === true ? this.handleBackdropClick : null,
-        ref:"modal"}, 
-        React.DOM.div( {className:classSet(dialogClasses)}, 
-          React.DOM.div( {className:"modal-content"}, 
-            this.props.title ? this.renderHeader() : null,
+    var modal = (
+      React.createElement("div", React.__spread({}, 
+        this.props, 
+        {title: null, 
+        tabIndex: "-1", 
+        role: "dialog", 
+        style: modalStyle, 
+        className: joinClasses(this.props.className, classSet(classes)), 
+        onClick: this.props.backdrop === true ? this.handleBackdropClick : null, 
+        ref: "modal"}), 
+        React.createElement("div", {className: classSet(dialogClasses)}, 
+          React.createElement("div", {className: "modal-content"}, 
+            this.props.title ? this.renderHeader() : null, 
             this.props.children
@@ -86,4 +87,4 @@ )
     return (
-      React.DOM.div(null, 
-        React.DOM.div( {className:classSet(classes), ref:"backdrop", onClick:onClick} ),
+      React.createElement("div", null, 
+        React.createElement("div", {className: classSet(classes), ref: "backdrop", onClick: onClick}), 
         modal
@@ -98,3 +99,3 @@ )
       closeButton = (
-          React.DOM.button( {type:"button", className:"close", 'aria-hidden':"true", onClick:this.props.onRequestHide}, "×")
+          React.createElement("button", {type: "button", className: "close", 'aria-hidden': "true", onClick: this.props.onRequestHide}, "×")
         );
@@ -104,4 +105,4 @@ }
     return (
-      React.DOM.div( {className:"modal-header"}, 
-        closeButton,
+      React.createElement("div", {className: "modal-header"}, 
+        closeButton, 
         this.renderTitle()
@@ -114,4 +115,4 @@ )
     return (
-      React.isValidComponent(this.props.title) ?
-        this.props.title : React.DOM.h4( {className:"modal-title"}, this.props.title)
+      React.isValidElement(this.props.title) ?
+        this.props.title : React.createElement("h4", {className: "modal-title"}, this.props.title)
     );
@@ -118,0 +119,0 @@ },

ModalTrigger.js

@@ -1,6 +0,5 @@
-/** @jsx React.DOM */
-
 var React = require('react');
 var OverlayMixin = require('./OverlayMixin');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var createChainedFunction = require('./utils/createChainedFunction');
@@ -12,3 +11,3 @@
   propTypes: {
-    modal: React.PropTypes.renderable.isRequired
+    modal: React.PropTypes.node.isRequired
   },
@@ -42,3 +41,3 @@
     if (!this.state.isOverlayShown) {
-      return React.DOM.span(null );
+      return React.createElement("span", null);
     }
@@ -45,0 +44,0 @@

Nav.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var BootstrapMixin = require('./BootstrapMixin');
@@ -9,2 +8,3 @@ var CollapsableMixin = require('./CollapsableMixin');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
@@ -24,3 +24,5 @@ var createChainedFunction = require('./utils/createChainedFunction');
     expanded: React.PropTypes.bool,
-    navbar: React.PropTypes.bool
+    navbar: React.PropTypes.bool,
+    eventKey: React.PropTypes.any,
+    right: React.PropTypes.bool
   },
@@ -52,7 +54,7 @@
     if (this.props.navbar && !this.props.collapsable) {
-      return this.transferPropsTo(this.renderUl());
+      return (this.renderUl());
     }
 
-    return this.transferPropsTo(
-      React.DOM.nav( {className:classSet(classes)}, 
+    return (
+      React.createElement("nav", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
         this.renderUl()
@@ -70,5 +72,6 @@ )
     classes['pull-right'] = this.props.pullRight;
+    classes['navbar-right'] = this.props.right;
 
     return (
-      React.DOM.ul( {className:classSet(classes), ref:"ul"}, 
+      React.createElement("ul", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes)), ref: "ul"}), 
         ValidComponentChildren.map(this.props.children, this.renderNavItem)
@@ -84,3 +87,3 @@ )
     if (this.props.activeKey != null) {
-      if (child.props.key === this.props.activeKey) {
+      if (child.props.eventKey == this.props.activeKey) {
         return true;
@@ -98,3 +101,3 @@ }
 
-  renderNavItem: function (child) {
+  renderNavItem: function (child, index) {
     return cloneWithProps(
@@ -107,4 +110,4 @@ child,
         onSelect: createChainedFunction(child.props.onSelect, this.props.onSelect),
-        ref: child.props.ref,
-        key: child.props.key,
+        ref: child.ref,
+        key: child.key ? child.key : index,
         navItem: true
@@ -111,0 +114,0 @@ }

Navbar.js

@@ -1,8 +0,7 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var BootstrapMixin = require('./BootstrapMixin');
-var CustomPropTypes = require('./utils/CustomPropTypes');
 var classSet = require('./utils/classSet');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
@@ -23,5 +22,5 @@ var createChainedFunction = require('./utils/createChainedFunction');
     role: React.PropTypes.string,
-    componentClass: CustomPropTypes.componentClass.isRequired,
-    brand: React.PropTypes.renderable,
-    toggleButton: React.PropTypes.renderable,
+    componentClass: React.PropTypes.node.isRequired,
+    brand: React.PropTypes.node,
+    toggleButton: React.PropTypes.node,
     onToggle: React.PropTypes.func,
@@ -37,3 +36,3 @@ navExpanded: React.PropTypes.bool,
       role: 'navigation',
-      componentClass: React.DOM.nav
+      componentClass: 'Nav'
     };
@@ -61,8 +60,8 @@ },
     this.setState({
-      navOpen: !this.state.navOpen
+      navExpanded: !this.state.navExpanded
     });
   },
 
-  isNavOpen: function () {
-    return this.props.navOpen != null ? this.props.navOpen : this.state.navOpen;
+  isNavExpanded: function () {
+    return this.props.navExpanded != null ? this.props.navExpanded : this.state.navExpanded;
   },
@@ -72,3 +71,3 @@
     var classes = this.getBsClassSet();
-    var componentClass = this.props.componentClass;
+    var ComponentClass = this.props.componentClass;
 
@@ -80,6 +79,6 @@ classes['navbar-fixed-top'] = this.props.fixedTop;
 
-    return this.transferPropsTo(
-      componentClass( {className:classSet(classes)}, 
-        React.DOM.div( {className:this.props.fluid ? 'container-fluid' : 'container'}, 
-          (this.props.brand || this.props.toggleButton || this.props.toggleNavKey) ? this.renderHeader() : null,
+    return (
+      React.createElement(ComponentClass, React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
+        React.createElement("div", {className: this.props.fluid ? 'container-fluid' : 'container'}, 
+          (this.props.brand || this.props.toggleButton || this.props.toggleNavKey) ? this.renderHeader() : null, 
           ValidComponentChildren.map(this.props.children, this.renderChild)
@@ -91,9 +90,9 @@ )
 
-  renderChild: function (child) {
+  renderChild: function (child, index) {
     return cloneWithProps(child, {
       navbar: true,
-      collapsable: this.props.toggleNavKey != null && this.props.toggleNavKey === child.props.key,
-      expanded: this.props.toggleNavKey != null && this.props.toggleNavKey === child.props.key && this.isNavOpen(),
-      key: child.props.key,
-      ref: child.props.ref
+      collapsable: this.props.toggleNavKey != null && this.props.toggleNavKey === child.props.eventKey,
+      expanded: this.props.toggleNavKey != null && this.props.toggleNavKey === child.props.eventKey && this.isNavExpanded(),
+      key: child.key ? child.key : index,
+      ref: child.ref
     });
@@ -106,11 +105,11 @@ },
     if (this.props.brand) {
-      brand = React.isValidComponent(this.props.brand) ?
+      brand = React.isValidElement(this.props.brand) ?
         cloneWithProps(this.props.brand, {
           className: 'navbar-brand'
-        }) : React.DOM.span( {className:"navbar-brand"}, this.props.brand);
+        }) : React.createElement("span", {className: "navbar-brand"}, this.props.brand);
     }
 
     return (
-      React.DOM.div( {className:"navbar-header"}, 
-        brand,
+      React.createElement("div", {className: "navbar-header"}, 
+        brand, 
         (this.props.toggleButton || this.props.toggleNavKey != null) ? this.renderToggleButton() : null
@@ -124,3 +123,3 @@ )
 
-    if (React.isValidComponent(this.props.toggleButton)) {
+    if (React.isValidElement(this.props.toggleButton)) {
       return cloneWithProps(this.props.toggleButton, {
@@ -134,10 +133,10 @@ className: 'navbar-toggle',
       this.props.toggleButton : [
-        React.DOM.span( {className:"sr-only", key:0}, "Toggle navigation"),
-        React.DOM.span( {className:"icon-bar", key:1}),
-        React.DOM.span( {className:"icon-bar", key:2}),
-        React.DOM.span( {className:"icon-bar", key:3})
+        React.createElement("span", {className: "sr-only", key: 0}, "Toggle navigation"),
+        React.createElement("span", {className: "icon-bar", key: 1}),
+        React.createElement("span", {className: "icon-bar", key: 2}),
+        React.createElement("span", {className: "icon-bar", key: 3})
     ];
 
     return (
-      React.DOM.button( {className:"navbar-toggle", type:"button", onClick:this.handleToggle}, 
+      React.createElement("button", {className: "navbar-toggle", type: "button", onClick: this.handleToggle}, 
         children
@@ -144,0 +143,0 @@ )

NavItem.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -15,3 +14,4 @@ var BootstrapMixin = require('./BootstrapMixin');
     href: React.PropTypes.string,
-    title: React.PropTypes.string
+    title: React.PropTypes.string,
+    eventKey: React.PropTypes.any
   },
@@ -26,15 +26,22 @@
   render: function () {
-    var classes = {
-      'active': this.props.active,
-      'disabled': this.props.disabled
-    };
+    var $__0= 
+        
+        
+        
+        
+        
+           this.props,disabled=$__0.disabled,active=$__0.active,href=$__0.href,title=$__0.title,children=$__0.children,props=(function(source, exclusion) {var rest = {};var hasOwn = Object.prototype.hasOwnProperty;if (source == null) {throw new TypeError();}for (var key in source) {if (hasOwn.call(source, key) && !hasOwn.call(exclusion, key)) {rest[key] = source[key];}}return rest;})($__0,{disabled:1,active:1,href:1,title:1,children:1}),
+        classes = {
+          'active': active,
+          'disabled': disabled
+        };
 
-    return this.transferPropsTo(
-      React.DOM.li( {className:classSet(classes)}, 
-        React.DOM.a(
-          {href:this.props.href,
-          title:this.props.title,
-          onClick:this.handleClick,
-          ref:"anchor"}, 
-          this.props.children
+    return (
+      React.createElement("li", React.__spread({},  props, {className: joinClasses(props.className, classSet(classes))}), 
+        React.createElement("a", {
+          href: href, 
+          title: title, 
+          onClick: this.handleClick, 
+          ref: "anchor"}, 
+          children 
         )
@@ -50,3 +57,3 @@ )
       if (!this.props.disabled) {
-        this.props.onSelect(this.props.key,this.props.href);
+        this.props.onSelect(this.props.eventKey, this.props.href);
       }
@@ -53,0 +60,0 @@ }

OverlayMixin.js

@@ -53,3 +53,3 @@ var React = require('react');
     // Save reference to help testing
-    this._overlayInstance = React.renderComponent(this.renderOverlay(), this._overlayTarget);
+    this._overlayInstance = React.render(this.renderOverlay(), this._overlayTarget);
   },
@@ -56,0 +56,0 @@

OverlayTrigger.js

@@ -1,3 +0,1 @@
-/** @jsx React.DOM */
-
 var React = require('react');
@@ -7,4 +5,5 @@ var OverlayMixin = require('./OverlayMixin');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var createChainedFunction = require('./utils/createChainedFunction');
-var merge = require('./utils/merge');
+var assign = require('./utils/Object.assign');
 
@@ -38,3 +37,3 @@ /**
     defaultOverlayShown: React.PropTypes.bool,
-    overlay: React.PropTypes.renderable.isRequired
+    overlay: React.PropTypes.node.isRequired
   },
@@ -79,3 +78,3 @@
     if (!this.state.isOverlayShown) {
-      return React.DOM.span(null );
+      return React.createElement("span", null);
     }
@@ -220,3 +219,3 @@
 
-    return merge(offset, {
+    return assign({}, offset, {
       height: node.offsetHeight,
@@ -223,0 +222,0 @@ width: node.offsetWidth

package.json

 {
   "name": "react-bootstrap",
-  "version": "0.12.0",
+  "version": "0.13.0",
   "description": "Bootstrap 3 components build with React",
+  "homepage": "http://react-bootstrap.github.io/",
   "main": "main.js",
   "keywords": [
     "react",
+    "ecosystem-react",
     "react-component",
@@ -21,4 +23,4 @@ "bootstrap"
   "peerDependencies": {
-    "react": ">=0.9"
+    "react": ">=0.12"
   }
 }

PageHeader.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 
@@ -8,5 +7,5 @@ var PageHeader = React.createClass({displayName: 'PageHeader',
   render: function () {
-    return this.transferPropsTo(
-      React.DOM.div( {className:"page-header"}, 
-        React.DOM.h1(null, this.props.children)
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, 'page-header')}), 
+        React.createElement("h1", null, this.props.children)
       )
@@ -13,0 +12,0 @@ );

PageItem.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -12,3 +11,4 @@
     next: React.PropTypes.bool,
-    onSelect: React.PropTypes.func
+    onSelect: React.PropTypes.func,
+    eventKey: React.PropTypes.any
   },
@@ -29,10 +29,11 @@
 
-    return this.transferPropsTo(
-      React.DOM.li(
-        {className:classSet(classes)}, 
-        React.DOM.a(
-          {href:this.props.href,
-          title:this.props.title,
-          onClick:this.handleSelect,
-          ref:"anchor"}, 
+    return (
+      React.createElement("li", React.__spread({}, 
+        this.props, 
+        {className: joinClasses(this.props.className, classSet(classes))}), 
+        React.createElement("a", {
+          href: this.props.href, 
+          title: this.props.title, 
+          onClick: this.handleSelect, 
+          ref: "anchor"}, 
           this.props.children
@@ -49,3 +50,3 @@ )
       if (!this.props.disabled) {
-        this.props.onSelect(this.props.key, this.props.href);
+        this.props.onSelect(this.props.eventKey, this.props.href);
       }
@@ -52,0 +53,0 @@ }

Pager.js

@@ -1,5 +0,5 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
@@ -15,5 +15,6 @@ var createChainedFunction = require('./utils/createChainedFunction');
   render: function () {
-    return this.transferPropsTo(
-      React.DOM.ul(
-        {className:"pager"}, 
+    return (
+      React.createElement("ul", React.__spread({}, 
+        this.props, 
+        {className: joinClasses(this.props.className, 'pager')}), 
         ValidComponentChildren.map(this.props.children, this.renderPageItem)
@@ -24,3 +25,3 @@ )
 
-  renderPageItem: function (child) {
+  renderPageItem: function (child, index) {
     return cloneWithProps(
@@ -30,4 +31,4 @@ child,
         onSelect: createChainedFunction(child.props.onSelect, this.props.onSelect),
-        ref: child.props.ref,
-        key: child.props.key
+        ref: child.ref,
+        key: child.key ? child.key : index
       }
@@ -34,0 +35,0 @@ );

Panel.js

@@ -1,6 +0,6 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var BootstrapMixin = require('./BootstrapMixin');
@@ -14,4 +14,5 @@ var CollapsableMixin = require('./CollapsableMixin');
     onSelect: React.PropTypes.func,
-    header: React.PropTypes.renderable,
-    footer: React.PropTypes.renderable
+    header: React.PropTypes.node,
+    footer: React.PropTypes.node,
+    eventKey: React.PropTypes.any
   },
@@ -29,3 +30,3 @@
       this._isChanging = true;
-      this.props.onSelect(this.props.key);
+      this.props.onSelect(this.props.eventKey);
       this._isChanging = false;
@@ -61,6 +62,7 @@ }
 
-    return this.transferPropsTo(
-      React.DOM.div( {className:classSet(classes), id:this.props.collapsable ? null : this.props.id, onSelect:null}, 
-        this.renderHeading(),
-        this.props.collapsable ? this.renderCollapsableBody() : this.renderBody(),
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes)), 
+        id: this.props.collapsable ? null : this.props.id, onSelect: null}), 
+        this.renderHeading(), 
+        this.props.collapsable ? this.renderCollapsableBody() : this.renderBody(), 
         this.renderFooter()
@@ -73,3 +75,3 @@ )
     return (
-      React.DOM.div( {className:classSet(this.getCollapsableClassSet('panel-collapse')), id:this.props.id, ref:"panel"}, 
+      React.createElement("div", {className: classSet(this.getCollapsableClassSet('panel-collapse')), id: this.props.id, ref: "panel"}, 
         this.renderBody()
@@ -82,3 +84,3 @@ )
     return (
-      React.DOM.div( {className:"panel-body", ref:"body"}, 
+      React.createElement("div", {className: "panel-body", ref: "body"}, 
         this.props.children
@@ -96,3 +98,3 @@ )
 
-    if (!React.isValidComponent(header) || Array.isArray(header)) {
+    if (!React.isValidElement(header) || Array.isArray(header)) {
       header = this.props.collapsable ?
@@ -112,3 +114,3 @@ this.renderCollapsableTitle(header) : header;
     return (
-      React.DOM.div( {className:"panel-heading"}, 
+      React.createElement("div", {className: "panel-heading"}, 
         header
@@ -121,6 +123,6 @@ )
     return (
-      React.DOM.a(
-        {href:'#' + (this.props.id || ''),
-        className:this.isExpanded() ? null : 'collapsed',
-        onClick:this.handleSelect}, 
+      React.createElement("a", {
+        href: '#' + (this.props.id || ''), 
+        className: this.isExpanded() ? null : 'collapsed', 
+        onClick: this.handleSelect}, 
         header
@@ -133,3 +135,3 @@ )
     return (
-      React.DOM.h4( {className:"panel-title"}, 
+      React.createElement("h4", {className: "panel-title"}, 
         this.renderAnchor(header)
@@ -146,3 +148,3 @@ )
     return (
-      React.DOM.div( {className:"panel-footer"}, 
+      React.createElement("div", {className: "panel-footer"}, 
         this.props.footer
@@ -149,0 +151,0 @@ )

PanelGroup.js

@@ -1,6 +0,6 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var BootstrapMixin = require('./BootstrapMixin');
@@ -34,4 +34,5 @@ var ValidComponentChildren = require('./utils/ValidComponentChildren');
   render: function () {
-    return this.transferPropsTo(
-      React.DOM.div( {className:classSet(this.getBsClassSet()), onSelect:null}, 
+    var classes = this.getBsClassSet();
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes)), onSelect: null}), 
         ValidComponentChildren.map(this.props.children, this.renderPanel)
@@ -42,3 +43,3 @@ )
 
-  renderPanel: function (child) {
+  renderPanel: function (child, index) {
     var activeKey =
@@ -49,4 +50,4 @@ this.props.activeKey != null ? this.props.activeKey : this.state.activeKey;
       bsStyle: child.props.bsStyle || this.props.bsStyle,
-      key: child.props.key,
-      ref: child.props.ref
+      key: child.key ? child.key : index,
+      ref: child.ref
     };
@@ -56,3 +57,3 @@
       props.collapsable = true;
-      props.expanded = (child.props.key === activeKey);
+      props.expanded = (child.props.eventKey === activeKey);
       props.onSelect = this.handleSelect;
@@ -59,0 +60,0 @@ }

Popover.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -17,3 +16,3 @@ var BootstrapMixin = require('./BootstrapMixin');
     arrowOffsetTop: React.PropTypes.number,
-    title: React.PropTypes.renderable
+    title: React.PropTypes.node
   },
@@ -42,7 +41,7 @@
 
-    return this.transferPropsTo(
-      React.DOM.div( {className:classSet(classes), style:style, title:null}, 
-        React.DOM.div( {className:"arrow", style:arrowStyle} ),
-        this.props.title ? this.renderTitle() : null,
-        React.DOM.div( {className:"popover-content"}, 
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes)), style: style, title: null}), 
+        React.createElement("div", {className: "arrow", style: arrowStyle}), 
+        this.props.title ? this.renderTitle() : null, 
+        React.createElement("div", {className: "popover-content"}, 
           this.props.children
@@ -56,3 +55,3 @@ )
     return (
-      React.DOM.h3( {className:"popover-title"}, this.props.title)
+      React.createElement("h3", {className: "popover-title"}, this.props.title)
     );
@@ -59,0 +58,0 @@ }

ProgressBar.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var Interpolate = require('./Interpolate');
@@ -8,2 +7,3 @@ var BootstrapMixin = require('./BootstrapMixin');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
@@ -17,3 +17,3 @@
     max: React.PropTypes.number,
-    label: React.PropTypes.renderable,
+    label: React.PropTypes.node,
     srOnly: React.PropTypes.bool,
@@ -52,4 +52,4 @@ striped: React.PropTypes.bool,
       if (!this.props.isChild) {
-        return this.transferPropsTo(
-          React.DOM.div( {className:classSet(classes)}, 
+        return (
+          React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
             this.renderProgressBar()
@@ -59,3 +59,3 @@ )
       } else {
-        return this.transferPropsTo(
+        return (
           this.renderProgressBar()
@@ -65,4 +65,4 @@ );
     } else {
-      return this.transferPropsTo(
-        React.DOM.div( {className:classSet(classes)}, 
+      return (
+        React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
           ValidComponentChildren.map(this.props.children, this.renderChildBar)
@@ -74,7 +74,7 @@ )
 
-  renderChildBar: function (child) {
+  renderChildBar: function (child, index) {
     return cloneWithProps(child, {
       isChild: true,
-      key: child.props.key,
-      ref: child.props.ref
+      key: child.key ? child.key : index,
+      ref: child.ref
     });
@@ -102,8 +102,10 @@ },
 
+    var classes = this.getBsClassSet();
+
     return (
-      React.DOM.div( {className:classSet(this.getBsClassSet()), role:"progressbar",
-        style:{width: percentage + '%'},
-        'aria-valuenow':this.props.now,
-        'aria-valuemin':this.props.min,
-        'aria-valuemax':this.props.max}, 
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes)), role: "progressbar", 
+        style: {width: percentage + '%'}, 
+        'aria-valuenow': this.props.now, 
+        'aria-valuemin': this.props.min, 
+        'aria-valuemax': this.props.max}), 
         label
@@ -118,8 +120,8 @@ )
     return (
-      InterpolateClass(
-        {now:this.props.now,
-        min:this.props.min,
-        max:this.props.max,
-        percent:percentage,
-        bsStyle:this.props.bsStyle}, 
+      React.createElement(InterpolateClass, {
+        now: this.props.now, 
+        min: this.props.min, 
+        max: this.props.max, 
+        percent: percentage, 
+        bsStyle: this.props.bsStyle}, 
         this.props.label
@@ -132,3 +134,3 @@ )
     return (
-      React.DOM.span( {className:"sr-only"}, 
+      React.createElement("span", {className: "sr-only"}, 
         label
@@ -135,0 +137,0 @@ )

Row.js

@@ -1,10 +0,7 @@
-/** @jsx React.DOM */
-
 var React = require('react');
-var CustomPropTypes = require('./utils/CustomPropTypes');
+var joinClasses = require('./utils/joinClasses');
 
-
 var Row = React.createClass({displayName: 'Row',
   propTypes: {
-    componentClass: CustomPropTypes.componentClass.isRequired
+    componentClass: React.PropTypes.node.isRequired
   },
@@ -14,3 +11,3 @@
     return {
-      componentClass: React.DOM.div
+      componentClass: 'div'
     };
@@ -20,6 +17,6 @@ },
   render: function () {
-    var componentClass = this.props.componentClass;
+    var ComponentClass = this.props.componentClass;
 
-    return this.transferPropsTo(
-      componentClass( {className:"row"}, 
+    return (
+      React.createElement(ComponentClass, React.__spread({},  this.props, {className: joinClasses(this.props.className, 'row')}), 
         this.props.children
@@ -26,0 +23,0 @@ )

SplitButton.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -16,5 +15,5 @@ var BootstrapMixin = require('./BootstrapMixin');
     pullRight:     React.PropTypes.bool,
-    title:         React.PropTypes.renderable,
+    title:         React.PropTypes.node,
     href:          React.PropTypes.string,
-    dropdownTitle: React.PropTypes.renderable,
+    dropdownTitle: React.PropTypes.node,
     onClick:       React.PropTypes.func,
@@ -37,8 +36,9 @@ onSelect:      React.PropTypes.func,
 
-    var button = this.transferPropsTo(
-      Button(
-        {ref:"button",
-        onClick:this.handleButtonClick,
-        title:null,
-        id:null}, 
+    var button = (
+      React.createElement(Button, React.__spread({}, 
+        this.props, 
+        {ref: "button", 
+        onClick: this.handleButtonClick, 
+        title: null, 
+        id: null}), 
         this.props.title
@@ -48,11 +48,12 @@ )
 
-    var dropdownButton = this.transferPropsTo(
-      Button(
-        {ref:"dropdownButton",
-        className:"dropdown-toggle",
-        onClick:this.handleDropdownClick,
-        title:null,
-        id:null}, 
-        React.DOM.span( {className:"sr-only"}, this.props.dropdownTitle),
-        React.DOM.span( {className:"caret"} )
+    var dropdownButton = (
+      React.createElement(Button, React.__spread({}, 
+        this.props, 
+        {ref: "dropdownButton", 
+        className: joinClasses(this.props.className, 'dropdown-toggle'), 
+        onClick: this.handleDropdownClick, 
+        title: null, 
+        id: null}), 
+        React.createElement("span", {className: "sr-only"}, this.props.dropdownTitle), 
+        React.createElement("span", {className: "caret"})
       )
@@ -62,13 +63,13 @@ );
     return (
-      ButtonGroup(
-        {bsSize:this.props.bsSize,
-        className:classSet(groupClasses),
-        id:this.props.id}, 
-        button,
-        dropdownButton,
-        DropdownMenu(
-          {ref:"menu",
-          onSelect:this.handleOptionSelect,
-          'aria-labelledby':this.props.id,
-          pullRight:this.props.pullRight}, 
+      React.createElement(ButtonGroup, {
+        bsSize: this.props.bsSize, 
+        className: classSet(groupClasses), 
+        id: this.props.id}, 
+        button, 
+        dropdownButton, 
+        React.createElement(DropdownMenu, {
+          ref: "menu", 
+          onSelect: this.handleOptionSelect, 
+          'aria-labelledby': this.props.id, 
+          pullRight: this.props.pullRight}, 
           this.props.children
@@ -75,0 +76,0 @@ )

SubNav.js

@@ -1,6 +0,6 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
@@ -20,3 +20,3 @@ var createChainedFunction = require('./utils/createChainedFunction');
     title: React.PropTypes.string,
-    text: React.PropTypes.renderable
+    text: React.PropTypes.node
   },
@@ -35,3 +35,3 @@
       if (!this.props.disabled) {
-        this.props.onSelect(this.props.key, this.props.href);
+        this.props.onSelect(this.props.eventKey, this.props.href);
       }
@@ -50,3 +50,3 @@ }
 
-    if (this.props.activeKey != null && this.props.activeKey === child.props.key) {
+    if (this.props.activeKey != null && this.props.activeKey === child.props.eventKey) {
       return true;
@@ -83,3 +83,3 @@ }
     if (this.props.activeKey != null) {
-      if (child.props.key === this.props.activeKey) {
+      if (child.props.eventKey == this.props.activeKey) {
         return true;
@@ -103,12 +103,12 @@ }
 
-    return this.transferPropsTo(
-      React.DOM.li( {className:classSet(classes)}, 
-        React.DOM.a(
-          {href:this.props.href,
-          title:this.props.title,
-          onClick:this.handleClick,
-          ref:"anchor"}, 
+    return (
+      React.createElement("li", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
+        React.createElement("a", {
+          href: this.props.href, 
+          title: this.props.title, 
+          onClick: this.handleClick, 
+          ref: "anchor"}, 
           this.props.text
-        ),
-        React.DOM.ul( {className:"nav"}, 
+        ), 
+        React.createElement("ul", {className: "nav"}, 
           ValidComponentChildren.map(this.props.children, this.renderNavItem)
@@ -120,3 +120,3 @@ )
 
-  renderNavItem: function (child) {
+  renderNavItem: function (child, index) {
     return cloneWithProps(
@@ -127,4 +127,4 @@ child,
         onSelect: createChainedFunction(child.props.onSelect, this.props.onSelect),
-        ref: child.props.ref,
-        key: child.props.key
+        ref: child.ref,
+        key: child.key ? child.key : index
       }
@@ -131,0 +131,0 @@ );

TabbedArea.js

@@ -1,6 +0,5 @@
-/** @jsx React.DOM */
-
 var React = require('react');
 var BootstrapMixin = require('./BootstrapMixin');
 var cloneWithProps = require('./utils/cloneWithProps');
+
 var ValidComponentChildren = require('./utils/ValidComponentChildren');
@@ -15,3 +14,3 @@ var Nav = require('./Nav');
     if (defaultActiveKey == null) {
-      defaultActiveKey = child.props.key;
+      defaultActiveKey = child.props.eventKey;
     }
@@ -74,4 +73,4 @@ });
 
-    var nav = this.transferPropsTo(
-      Nav( {activeKey:activeKey, onSelect:this.handleSelect, ref:"tabs"}, 
+    var nav = (
+      React.createElement(Nav, React.__spread({},  this.props, {activeKey: activeKey, onSelect: this.handleSelect, ref: "tabs"}), 
         ValidComponentChildren.map(this.props.children, renderTabIfSet, this)
@@ -82,5 +81,5 @@ )
     return (
-      React.DOM.div(null, 
-        nav,
-        React.DOM.div( {id:this.props.id, className:"tab-content", ref:"panes"}, 
+      React.createElement("div", null, 
+        nav, 
+        React.createElement("div", {id: this.props.id, className: "tab-content", ref: "panes"}, 
           ValidComponentChildren.map(this.props.children, this.renderPane)
@@ -96,3 +95,3 @@ )
 
-  renderPane: function (child) {
+  renderPane: function (child, index) {
     var activeKey = this.getActiveKey();
@@ -103,9 +102,9 @@
         {
-          active: (child.props.key === activeKey &&
+          active: (child.props.eventKey === activeKey &&
             (this.state.previousActiveKey == null || !this.props.animation)),
-          ref: child.props.ref,
-          key: child.props.key,
+          ref: child.ref,
+          key: child.key ? child.key : index,
           animation: this.props.animation,
           onAnimateOutEnd: (this.state.previousActiveKey != null &&
-            child.props.key === this.state.previousActiveKey) ? this.handlePaneAnimateOutEnd: null
+            child.props.eventKey === this.state.previousActiveKey) ? this.handlePaneAnimateOutEnd: null
         }
@@ -116,7 +115,7 @@ );
   renderTab: function (child) {
-    var key = child.props.key;
+    var key = child.props.eventKey;
     return (
-      NavItem(
-        {ref:'tab' + key,
-        key:key}, 
+      React.createElement(NavItem, {
+        ref: 'tab' + key, 
+        eventKey: key}, 
         child.props.tab
@@ -123,0 +122,0 @@ )

Table.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -23,4 +22,4 @@
     };
-    var table = this.transferPropsTo(
-      React.DOM.table( {className:classSet(classes)}, 
+    var table = (
+      React.createElement("table", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -31,3 +30,3 @@ )
     return this.props.responsive ? (
-      React.DOM.div( {className:"table-responsive"}, 
+      React.createElement("div", {className: "table-responsive"}, 
         table
@@ -34,0 +33,0 @@ )

TabPane.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -75,4 +74,4 @@ var TransitionEvents = require('./utils/TransitionEvents');
 
-    return this.transferPropsTo(
-      React.DOM.div( {className:classSet(classes)}, 
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -79,0 +78,0 @@ )

Tooltip.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -39,6 +38,6 @@ var BootstrapMixin = require('./BootstrapMixin');
 
-    return this.transferPropsTo(
-        React.DOM.div( {className:classSet(classes), style:style}, 
-          React.DOM.div( {className:"tooltip-arrow", style:arrowStyle} ),
-          React.DOM.div( {className:"tooltip-inner"}, 
+    return (
+        React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes)), style: style}), 
+          React.createElement("div", {className: "tooltip-arrow", style: arrowStyle}), 
+          React.createElement("div", {className: "tooltip-inner"}, 
             this.props.children
@@ -45,0 +44,0 @@ )

utils/classSet.js

 /**
- * React classSet
+ * Copyright 2013-2014, Facebook, Inc.
+ * All rights reserved.
  *
- * Copyright 2013-2014 Facebook, Inc.
- * @licence https://github.com/facebook/react/blob/0.11-stable/LICENSE
+ * This file contains an unmodified version of:
+ * https://github.com/facebook/react/blob/v0.12.0/src/vendor/stubs/cx.js
  *
- * This file is unmodified from:
- *  https://github.com/facebook/react/blob/0.11-stable/src/vendor/stubs/cx.js
- *
+ * This source code is licensed under the BSD-style license found here:
+ * https://github.com/facebook/react/blob/v0.12.0/LICENSE
+ * An additional grant of patent rights can be found here:
+ * https://github.com/facebook/react/blob/v0.12.0/PATENTS
  */
@@ -11,0 +13,0 @@

utils/cloneWithProps.js

 /**
- * React cloneWithProps
+ * Copyright 2013-2014, Facebook, Inc.
+ * All rights reserved.
  *
- * Copyright 2013-2014 Facebook, Inc.
- * @licence https://github.com/facebook/react/blob/0.11-stable/LICENSE
- *
  * This file contains modified versions of:
- *  https://github.com/facebook/react/blob/0.11-stable/src/utils/cloneWithProps.js
- *  https://github.com/facebook/react/blob/0.11-stable/src/core/ReactPropTransferer.js
- *  https://github.com/facebook/react/blob/0.11-stable/src/utils/joinClasses.js
+ * https://github.com/facebook/react/blob/v0.12.0/src/utils/cloneWithProps.js
+ * https://github.com/facebook/react/blob/v0.12.0/src/core/ReactPropTransferer.js
  *
+ * This source code is licensed under the BSD-style license found here:
+ * https://github.com/facebook/react/blob/v0.12.0/LICENSE
+ * An additional grant of patent rights can be found here:
+ * https://github.com/facebook/react/blob/v0.12.0/PATENTS
+ *
  * TODO: This should be replaced as soon as cloneWithProps is available via
  *  the core React package or a separate package.
  *  @see https://github.com/facebook/react/issues/1906
- *
  */
 
 var React = require('react');
-var merge = require('./merge');
+var joinClasses = require('./joinClasses');
+var assign = require("./Object.assign");
 
 /**
- * Combines multiple className strings into one.
- * http://jsperf.com/joinclasses-args-vs-array
- *
- * @param {...?string} classes
- * @return {string}
- */
-function joinClasses(className/*, ... */) {
-  if (!className) {
-    className = '';
-  }
-  var nextClass;
-  var argLength = arguments.length;
-  if (argLength > 1) {
-    for (var ii = 1; ii < argLength; ii++) {
-      nextClass = arguments[ii];
-      nextClass && (className += ' ' + nextClass);
-    }
-  }
-  return className;
-}
-
-/**
  * Creates a transfer strategy that will merge prop values using the supplied
@@ -64,3 +44,3 @@ * `mergeStrategy`. If a prop was previously unset, this just sets it.
   // get overridden. Flip the order here.
-  return merge(b, a);
+  return assign({}, b, a);
 });
@@ -85,10 +65,2 @@
   /**
-   * Never transfer the `key` prop.
-   */
-  key: emptyFunction,
-  /**
-   * Never transfer the `ref` prop.
-   */
-  ref: emptyFunction,
-  /**
    * Transfer the `style` prop (which is an object) by merging them.
@@ -132,5 +104,6 @@ */
 function mergeProps(oldProps, newProps) {
-  return transferInto(merge(oldProps), newProps);
+  return transferInto(assign({}, oldProps), newProps);
 }
 
+
 var ReactPropTransferer = {
@@ -160,14 +133,15 @@ mergeProps: mergeProps
 
-  // Huge hack to support both the 0.10 API and the new way of doing things
-  // TODO: remove when support for 0.10 is no longer needed
-  if (React.version.indexOf('0.10.') === 0) {
-    return child.constructor.ConvenienceConstructor(newProps);
+  if (React.version.substr(0, 4) === '0.12'){
+    var mockLegacyFactory = function(){};
+    mockLegacyFactory.isReactLegacyFactory = true;
+    mockLegacyFactory.type = child.type;
+
+    return React.createElement(mockLegacyFactory, newProps);
   }
 
-
   // The current API doesn't retain _owner and _context, which is why this
-  // doesn't use ReactDescriptor.cloneAndReplaceProps.
-  return child.constructor(newProps);
+  // doesn't use ReactElement.cloneAndReplaceProps.
+  return React.createElement(child.type, newProps);
 }
 
 module.exports = cloneWithProps;

utils/CustomPropTypes.js

@@ -7,12 +7,2 @@ var React = require('react');
   /**
-   * Checks whether a prop is a valid React class
-   *
-   * @param props
-   * @param propName
-   * @param componentName
-   * @returns {Error|undefined}
-   */
-  componentClass: createComponentClassChecker(),
-
-  /**
    * Checks whether a prop provides a DOM element
@@ -59,15 +49,2 @@ *
 
-function createComponentClassChecker() {
-  function validate(props, propName, componentName) {
-    if (!React.isValidClass(props[propName])) {
-      return new Error(
-        'Invalid prop `' + propName + '` supplied to ' +
-          '`' + componentName + '`, expected a valid React class.'
-      );
-    }
-  }
-
-  return createChainableTypeChecker(validate);
-}
-
 function createMountableChecker() {
@@ -74,0 +51,0 @@ function validate(props, propName, componentName) {

utils/EventListener.js

 /**
- * React EventListener.listen
- *
  * Copyright 2013-2014 Facebook, Inc.
- * @licence https://github.com/facebook/react/blob/0.11-stable/LICENSE
  *
  * This file contains a modified version of:
- *  https://github.com/facebook/react/blob/0.11-stable/src/vendor/stubs/EventListener.js
+ * https://github.com/facebook/react/blob/v0.12.0/src/vendor/stubs/EventListener.js
  *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
  * TODO: remove in favour of solution provided by:
@@ -11,0 +20,0 @@ *  https://github.com/facebook/react/issues/285

utils/TransitionEvents.js

 /**
- * React TransitionEvents
+ * Copyright 2013-2014, Facebook, Inc.
+ * All rights reserved.
  *
- * Copyright 2013-2014 Facebook, Inc.
- * @licence https://github.com/facebook/react/blob/0.11-stable/LICENSE
- *
  * This file contains a modified version of:
- *  https://github.com/facebook/react/blob/0.11-stable/src/addons/transitions/ReactTransitionEvents.js
+ * https://github.com/facebook/react/blob/v0.12.0/src/addons/transitions/ReactTransitionEvents.js
  *
+ * This source code is licensed under the BSD-style license found here:
+ * https://github.com/facebook/react/blob/v0.12.0/LICENSE
+ * An additional grant of patent rights can be found here:
+ * https://github.com/facebook/react/blob/v0.12.0/PATENTS
  */
@@ -11,0 +13,0 @@

utils/ValidComponentChildren.js

@@ -19,3 +19,3 @@ var React = require('react');
   return React.Children.map(children, function (child) {
-    if (React.isValidComponent(child)) {
+    if (React.isValidElement(child)) {
       var lastIndex = index;
@@ -45,3 +45,3 @@ index++;
   return React.Children.forEach(children, function (child) {
-    if (React.isValidComponent(child)) {
+    if (React.isValidElement(child)) {
       func.call(context, child, index);
@@ -63,3 +63,3 @@ index++;
   React.Children.forEach(children, function (child) {
-    if (React.isValidComponent(child)) { count++; }
+    if (React.isValidElement(child)) { count++; }
   });
@@ -80,3 +80,3 @@
   React.Children.forEach(children, function (child) {
-    if (!hasValid && React.isValidComponent(child)) {
+    if (!hasValid && React.isValidElement(child)) {
       hasValid = true;
@@ -83,0 +83,0 @@ }

Well.js

@@ -1,4 +0,3 @@
-/** @jsx React.DOM */
-
 var React = require('react');
+var joinClasses = require('./utils/joinClasses');
 var classSet = require('./utils/classSet');
@@ -19,4 +18,4 @@ var BootstrapMixin = require('./BootstrapMixin');
 
-    return this.transferPropsTo(
-      React.DOM.div( {className:classSet(classes)}, 
+    return (
+      React.createElement("div", React.__spread({},  this.props, {className: joinClasses(this.props.className, classSet(classes))}), 
         this.props.children
@@ -23,0 +22,0 @@ )

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

130781

increased by6.37%

Number of package files

64

increased by1.59%

Lines of code

4131

increased by1.35%

Number of low quality alerts

1

decreased by-50%

Worsened metrics

Number of low license alerts

1

increased byInfinity%

Number of medium maintenance alerts

1

increased byInfinity%

No dependency changes