rc-tabs - npm Package Compare versions

Comparing version 5.3.3 to 5.4.0

HISTORY.md

 # History
 ----
+## 5.4.0 / 2015-10-20
 
+- support add/tabBarExtraContent
+- only support react 0.14+
+- remove bootstrap css
+
 ## 5.3.0 / 2015-07-23
@@ -5,0 +10,0 @@

lib/InkBarMixin.js

@@ -7,19 +7,13 @@ 'use strict';
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
 var _utils = require('./utils');
 
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
 function _componentDidUpdate(component) {
   var refs = component.refs;
-  var containerNode = _react2['default'].findDOMNode(refs.nav);
+  var containerNode = refs.nav;
   var containerOffset = (0, _utils.offset)(containerNode);
-  var inkBarNode = _react2['default'].findDOMNode(refs.inkBar);
+  var inkBarNode = refs.inkBar;
   var activeTab = refs.activeTab;
   var tabPosition = component.props.tabPosition;
   if (activeTab) {
-    var tabNode = _react2['default'].findDOMNode(activeTab);
+    var tabNode = activeTab;
     var tabOffset = (0, _utils.offset)(tabNode);
@@ -26,0 +20,0 @@ if (tabPosition === 'top' || tabPosition === 'bottom') {

lib/Nav.js

@@ -25,4 +25,5 @@ 'use strict';
   propTypes: {
-    tabPosition: _react2['default'].PropTypes.string,
-    onTabClick: _react2['default'].PropTypes.func
+    tabPosition: _react.PropTypes.string,
+    tabBarExtraContent: _react.PropTypes.any,
+    onTabClick: _react.PropTypes.func
   },
@@ -49,5 +50,5 @@
     }
-    var navNode = _react2['default'].findDOMNode(this.refs.nav);
+    var navNode = this.refs.nav;
     var navNodeWH = this.getOffsetWH(navNode);
-    var navWrapNode = _react2['default'].findDOMNode(this.refs.navWrap);
+    var navWrapNode = this.refs.navWrap;
     var navWrapNodeWH = this.getOffsetWH(navWrapNode);
@@ -115,4 +116,4 @@ var state = this.state;
         _react2['default'].createElement(
-          'a',
-          null,
+          'div',
+          { className: prefixCls + '-tab-inner' },
           child.props.tab
@@ -186,18 +187,23 @@ )
       'div',
-      { className: prefixCls + '-nav-container ' + (showNextPrev ? prefixCls + '-nav-container-scrolling' : ''),
-        style: props.style,
-        ref: 'container' },
-      prevButton,
-      nextButton,
+      { className: prefixCls + '-tabs-bar' },
+      this.props.tabBarExtraContent,
       _react2['default'].createElement(
         'div',
-        { className: prefixCls + '-nav-wrap', ref: 'navWrap' },
+        { className: prefixCls + '-nav-container ' + (showNextPrev ? prefixCls + '-nav-container-scrolling' : ''),
+          style: props.style,
+          ref: 'container' },
+        prevButton,
+        nextButton,
         _react2['default'].createElement(
           'div',
-          { className: prefixCls + '-nav-scroll' },
+          { className: prefixCls + '-nav-wrap', ref: 'navWrap' },
           _react2['default'].createElement(
             'div',
-            { className: prefixCls + '-nav', ref: 'nav', style: navOffset },
-            _react2['default'].createElement('div', { className: inkBarClass, ref: 'inkBar' }),
-            tabs
+            { className: prefixCls + '-nav-scroll' },
+            _react2['default'].createElement(
+              'div',
+              { className: prefixCls + '-nav', ref: 'nav', style: navOffset },
+              _react2['default'].createElement('div', { className: inkBarClass, ref: 'inkBar' }),
+              tabs
+            )
           )
@@ -216,3 +222,3 @@ )
   prev: function prev() {
-    var navWrapNode = _react2['default'].findDOMNode(this.refs.navWrap);
+    var navWrapNode = this.refs.navWrap;
     var navWrapNodeWH = this.getOffsetWH(navWrapNode);
@@ -225,3 +231,3 @@ var state = this.state;
   next: function next() {
-    var navWrapNode = _react2['default'].findDOMNode(this.refs.navWrap);
+    var navWrapNode = this.refs.navWrap;
     var navWrapNodeWH = this.getOffsetWH(navWrapNode);
@@ -228,0 +234,0 @@ var state = this.state;

lib/Tabs.js

@@ -13,2 +13,6 @@ 'use strict';
 
+var _reactDom = require('react-dom');
+
+var _reactDom2 = _interopRequireDefault(_reactDom);
+
 var _KeyCode = require('./KeyCode');
@@ -32,2 +36,12 @@
 
+function getDefaultActiveKey(props) {
+  var activeKey = undefined;
+  _react2['default'].Children.forEach(props.children, function (child) {
+    if (!activeKey && !child.props.disabled) {
+      activeKey = child.key;
+    }
+  });
+  return activeKey;
+}
+
 var Tabs = _react2['default'].createClass({
@@ -37,6 +51,7 @@ displayName: 'Tabs',
   propTypes: {
-    onTabClick: _react2['default'].PropTypes.func,
-    onChange: _react2['default'].PropTypes.func,
-    children: _react2['default'].PropTypes.any,
-    animation: _react2['default'].PropTypes.string
+    onTabClick: _react.PropTypes.func,
+    onChange: _react.PropTypes.func,
+    children: _react.PropTypes.any,
+    tabBarExtraContent: _react.PropTypes.any,
+    animation: _react.PropTypes.string
   },
@@ -52,7 +67,3 @@
     } else {
-      _react2['default'].Children.forEach(props.children, function (child) {
-        if (!activeKey && !child.props.disabled) {
-          activeKey = child.key;
-        }
-      });
+      activeKey = getDefaultActiveKey(props);
     }
@@ -67,2 +78,3 @@ // cache panels
       prefixCls: 'rc-tabs',
+      tabBarExtraContent: null,
       onChange: noop,
@@ -78,5 +90,17 @@ tabPosition: 'top',
   componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
+    var newActiveKey = this.state.activeKey;
     if ('activeKey' in nextProps) {
-      this.setActiveKey(nextProps.activeKey);
+      newActiveKey = nextProps.activeKey;
     }
+    var found = undefined;
+    _react2['default'].Children.forEach(nextProps.children, function (child) {
+      if (child.key === newActiveKey) {
+        found = true;
+      }
+    });
+    if (found) {
+      this.setActiveKey(newActiveKey);
+    } else {
+      this.setActiveKey(getDefaultActiveKey(nextProps));
+    }
   },
@@ -97,3 +121,3 @@
   onKeyDown: function onKeyDown(e) {
-    if (e.target !== _react2['default'].findDOMNode(this)) {
+    if (e.target !== _reactDom2['default'].findDOMNode(this)) {
       return;
@@ -215,2 +239,3 @@ }
       key: 'nav',
+      tabBarExtraContent: this.props.tabBarExtraContent,
       tabPosition: tabPosition,
@@ -217,0 +242,0 @@ style: props.navStyle,

package.json

 {
   "name": "rc-tabs",
-  "version": "5.3.3",
+  "version": "5.4.0",
   "description": "tabs ui component for react",
@@ -31,9 +31,9 @@ "keywords": [
     "gh-pages": "rc-tools run gh-pages",
-    "start": "node --harmony node_modules/.bin/rc-server",
+    "start": "rc-server",
     "pub": "rc-tools run pub",
     "lint": "rc-tools run lint",
     "karma": "rc-tools run karma",
-    "saucelabs": "node --harmony node_modules/.bin/rc-tools run saucelabs",
-    "browser-test": "node --harmony node_modules/.bin/rc-tools run browser-test",
-    "browser-test-cover": "node --harmony node_modules/.bin/rc-tools run browser-test-cover"
+    "saucelabs": "rc-tools run saucelabs",
+    "browser-test": "rc-tools run browser-test",
+    "browser-test-cover": "rc-tools run browser-test-cover"
   },
@@ -45,3 +45,5 @@ "devDependencies": {
     "rc-tools": "4.x",
-    "react": "0.13.x"
+    "react": "~0.14.0",
+    "react-addons-test-utils": "^0.14.0",
+    "react-dom": "^0.14.0"
   },
@@ -48,0 +50,0 @@ "precommit": [

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

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

Worsened metrics

Total package byte prevSize

39770

decreased by-6.12%

Dev dependency count

7

increased by40%

Number of package files

11

decreased by-8.33%

Lines of code

1129

decreased by-8.8%

No dependency changes