New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

rc-tabs

Package Overview
Dependencies
Maintainers
6
Versions
229
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

rc-tabs - npm Package Compare versions

Comparing version 10.0.0 to 10.1.0

1

es/index.js
import Tabs from './Tabs';
import TabPane from './TabPane';
import TabContent from './TabContent';
export default Tabs;
export { TabPane, TabContent };

66

es/InkTabBar.js

@@ -1,9 +0,23 @@

import _extends from 'babel-runtime/helpers/extends';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
/* eslint-disable react/prefer-stateless-function */
import React from 'react';
import PropTypes from 'prop-types';
import InkTabBarNode from './InkTabBarNode';

@@ -14,3 +28,3 @@ import TabBarTabsNode from './TabBarTabsNode';

var InkTabBar = function (_React$Component) {
var InkTabBar = /*#__PURE__*/function (_React$Component) {
_inherits(InkTabBar, _React$Component);

@@ -21,22 +35,22 @@

return _possibleConstructorReturn(this, (InkTabBar.__proto__ || Object.getPrototypeOf(InkTabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(InkTabBar).apply(this, arguments));
}
_createClass(InkTabBar, [{
key: 'render',
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
return React.createElement(
SaveRef,
null,
function (saveRef, getRef) {
return React.createElement(
TabBarRootNode,
_extends({ saveRef: saveRef }, _this2.props),
React.createElement(TabBarTabsNode, _extends({ onTabClick: _this2.props.onTabClick, saveRef: saveRef }, _this2.props)),
React.createElement(InkTabBarNode, _extends({ saveRef: saveRef, getRef: getRef }, _this2.props))
);
}
);
return React.createElement(SaveRef, null, function (saveRef, getRef) {
return React.createElement(TabBarRootNode, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), React.createElement(TabBarTabsNode, _extends({
onTabClick: _this.props.onTabClick,
saveRef: saveRef
}, _this.props)), React.createElement(InkTabBarNode, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props)));
});
}

@@ -48,11 +62,5 @@ }]);

export default InkTabBar;
InkTabBar.propTypes = {
onTabClick: PropTypes.func
};
export { InkTabBar as default };
InkTabBar.defaultProps = {
onTabClick: function onTabClick() {}
};

107

es/InkTabBarNode.js

@@ -1,8 +0,22 @@

import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';

@@ -17,3 +31,2 @@ import { setTransform, isTransform3dSupported, getLeft, getStyle, getTop, getActiveIndex } from './utils';

direction = _component$props.direction;
var rootNode = component.props.getRef('root');

@@ -26,2 +39,3 @@ var wrapNode = component.props.getRef('nav') || rootNode;

var activeIndex = getActiveIndex(panels, activeKey);
if (init) {

@@ -31,7 +45,7 @@ // prevent mount animation

}
if (activeTab) {
var tabNode = activeTab;
var transformSupported = isTransform3dSupported(inkBarNodeStyle);
var transformSupported = isTransform3dSupported(inkBarNodeStyle); // Reset current style
// Reset current style
setTransform(inkBarNodeStyle, '');

@@ -47,7 +61,6 @@ inkBarNodeStyle.width = '';

var left = getLeft(tabNode, wrapNode);
var width = tabNode.offsetWidth;
// If tabNode'width width equal to wrapNode'width when tabBarPosition is top or bottom
var width = tabNode.offsetWidth; // If tabNode'width width equal to wrapNode'width when tabBarPosition is top or bottom
// It means no css working, then ink bar should not have width until css is loaded
// Fix https://github.com/ant-design/ant-design/issues/7564
if (width === rootNode.offsetWidth) {

@@ -57,2 +70,3 @@ width = 0;

width = parseFloat(styles.inkBar.width, 10);
if (width) {

@@ -62,17 +76,22 @@ left += (tabNode.offsetWidth - width) / 2;

}
if (direction === 'rtl') {
left = getStyle(tabNode, 'margin-left') - left;
}
// use 3d gpu to optimize render
} // use 3d gpu to optimize render
if (transformSupported) {
setTransform(inkBarNodeStyle, 'translate3d(' + left + 'px,0,0)');
setTransform(inkBarNodeStyle, "translate3d(".concat(left, "px,0,0)"));
} else {
inkBarNodeStyle.left = left + 'px';
inkBarNodeStyle.left = "".concat(left, "px");
}
inkBarNodeStyle.width = width + 'px';
inkBarNodeStyle.width = "".concat(width, "px");
} else {
var top = getTop(tabNode, wrapNode, true);
var height = tabNode.offsetHeight;
if (styles.inkBar && styles.inkBar.height !== undefined) {
height = parseFloat(styles.inkBar.height, 10);
if (height) {

@@ -82,15 +101,18 @@ top += (tabNode.offsetHeight - height) / 2;

}
if (transformSupported) {
setTransform(inkBarNodeStyle, 'translate3d(0,' + top + 'px,0)');
setTransform(inkBarNodeStyle, "translate3d(0,".concat(top, "px,0)"));
inkBarNodeStyle.top = '0';
} else {
inkBarNodeStyle.top = top + 'px';
inkBarNodeStyle.top = "".concat(top, "px");
}
inkBarNodeStyle.height = height + 'px';
inkBarNodeStyle.height = "".concat(height, "px");
}
}
inkBarNodeStyle.display = activeIndex !== -1 ? 'block' : 'none';
}
var InkTabBarNode = function (_React$Component) {
var InkTabBarNode = /*#__PURE__*/function (_React$Component) {
_inherits(InkTabBarNode, _React$Component);

@@ -101,9 +123,9 @@

return _possibleConstructorReturn(this, (InkTabBarNode.__proto__ || Object.getPrototypeOf(InkTabBarNode)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(InkTabBarNode).apply(this, arguments));
}
_createClass(InkTabBarNode, [{
key: 'componentDidMount',
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
var _this = this;

@@ -117,7 +139,7 @@ // ref https://github.com/ant-design/ant-design/issues/8678

this.timeout = setTimeout(function () {
_componentDidUpdate(_this2, true);
_componentDidUpdate(_this, true);
}, 0);
}
}, {
key: 'componentDidUpdate',
key: "componentDidUpdate",
value: function componentDidUpdate() {

@@ -127,3 +149,3 @@ _componentDidUpdate(this);

}, {
key: 'componentWillUnmount',
key: "componentWillUnmount",
value: function componentWillUnmount() {

@@ -133,17 +155,16 @@ clearTimeout(this.timeout);

}, {
key: 'render',
key: "render",
value: function render() {
var _classnames;
var _props = this.props,
prefixCls = _props.prefixCls,
styles = _props.styles,
inkBarAnimated = _props.inkBarAnimated;
var className = prefixCls + '-ink-bar';
var classes = classnames((_classnames = {}, _defineProperty(_classnames, className, true), _defineProperty(_classnames, inkBarAnimated ? className + '-animated' : className + '-no-animated', true), _classnames));
return React.createElement('div', {
var _this$props = this.props,
prefixCls = _this$props.prefixCls,
styles = _this$props.styles,
inkBarAnimated = _this$props.inkBarAnimated;
var className = "".concat(prefixCls, "-ink-bar");
var classes = classnames((_classnames = {}, _defineProperty(_classnames, className, true), _defineProperty(_classnames, inkBarAnimated ? "".concat(className, "-animated") : "".concat(className, "-no-animated"), true), _classnames));
return React.createElement("div", {
style: styles.inkBar,
className: classes,
key: 'inkBar',
key: "inkBar",
ref: this.props.saveRef('inkBar')

@@ -157,13 +178,3 @@ });

export default InkTabBarNode;
InkTabBarNode.propTypes = {
prefixCls: PropTypes.string,
styles: PropTypes.object,
inkBarAnimated: PropTypes.bool,
saveRef: PropTypes.func,
direction: PropTypes.string
};
export { InkTabBarNode as default };
InkTabBarNode.defaultProps = {

@@ -170,0 +181,0 @@ prefixCls: '',

13

es/KeyCode.js

@@ -5,11 +5,17 @@ export default {

*/
LEFT: 37, // also NUM_WEST
LEFT: 37,
// also NUM_WEST
/**
* UP
*/
UP: 38, // also NUM_NORTH
UP: 38,
// also NUM_NORTH
/**
* RIGHT
*/
RIGHT: 39, // also NUM_EAST
RIGHT: 39,
// also NUM_EAST
/**

@@ -19,2 +25,3 @@ * DOWN

DOWN: 40 // also NUM_SOUTH
};

53

es/SaveRef.js

@@ -1,25 +0,42 @@

import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import PropTypes from 'prop-types';
var SaveRef = function (_React$Component) {
var SaveRef = /*#__PURE__*/function (_React$Component) {
_inherits(SaveRef, _React$Component);
function SaveRef() {
var _ref;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
_classCallCheck(this, SaveRef);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = SaveRef.__proto__ || Object.getPrototypeOf(SaveRef)).call.apply(_ref, [this].concat(args))), _this), _this.getRef = function (name) {
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(SaveRef)).call.apply(_getPrototypeOf2, [this].concat(args)));
_this.getRef = function (name) {
return _this[name];
}, _this.saveRef = function (name) {
};
_this.saveRef = function (name) {
return function (node) {

@@ -30,7 +47,9 @@ if (node) {

};
}, _temp), _possibleConstructorReturn(_this, _ret);
};
return _this;
}
_createClass(SaveRef, [{
key: 'render',
key: "render",
value: function render() {

@@ -44,9 +63,3 @@ return this.props.children(this.saveRef, this.getRef);

export default SaveRef;
SaveRef.propTypes = {
children: PropTypes.func
};
export { SaveRef as default };
SaveRef.defaultProps = {

@@ -53,0 +66,0 @@ children: function children() {

81

es/ScrollableInkTabBar.js

@@ -1,10 +0,27 @@

import _extends from 'babel-runtime/helpers/extends';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
/* eslint-disable react/prefer-stateless-function */
import React from 'react';
import PropTypes from 'prop-types';
import InkTabBarNode from './InkTabBarNode';

@@ -16,3 +33,3 @@ import TabBarTabsNode from './TabBarTabsNode';

var ScrollableInkTabBar = function (_React$Component) {
var ScrollableInkTabBar = /*#__PURE__*/function (_React$Component) {
_inherits(ScrollableInkTabBar, _React$Component);

@@ -23,28 +40,27 @@

return _possibleConstructorReturn(this, (ScrollableInkTabBar.__proto__ || Object.getPrototypeOf(ScrollableInkTabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(ScrollableInkTabBar).apply(this, arguments));
}
_createClass(ScrollableInkTabBar, [{
key: 'render',
key: "render",
value: function render() {
var _props = this.props,
renderTabBarNode = _props.children,
restProps = _objectWithoutProperties(_props, ['children']);
var _this$props = this.props,
renderTabBarNode = _this$props.children,
restProps = _objectWithoutProperties(_this$props, ["children"]);
return React.createElement(
SaveRef,
null,
function (saveRef, getRef) {
return React.createElement(
TabBarRootNode,
_extends({ saveRef: saveRef }, restProps),
React.createElement(
ScrollableTabBarNode,
_extends({ saveRef: saveRef, getRef: getRef }, restProps),
React.createElement(TabBarTabsNode, _extends({ saveRef: saveRef, renderTabBarNode: renderTabBarNode }, restProps)),
React.createElement(InkTabBarNode, _extends({ saveRef: saveRef, getRef: getRef }, restProps))
)
);
}
);
return React.createElement(SaveRef, null, function (saveRef, getRef) {
return React.createElement(TabBarRootNode, _extends({
saveRef: saveRef,
getRef: getRef
}, restProps), React.createElement(ScrollableTabBarNode, _extends({
saveRef: saveRef,
getRef: getRef
}, restProps), React.createElement(TabBarTabsNode, _extends({
saveRef: saveRef,
renderTabBarNode: renderTabBarNode
}, restProps)), React.createElement(InkTabBarNode, _extends({
saveRef: saveRef,
getRef: getRef
}, restProps))));
});
}

@@ -56,7 +72,2 @@ }]);

export default ScrollableInkTabBar;
ScrollableInkTabBar.propTypes = {
children: PropTypes.func
};
export { ScrollableInkTabBar as default };

61

es/ScrollableTabBar.js

@@ -1,6 +0,21 @@

import _extends from 'babel-runtime/helpers/extends';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
/* eslint-disable react/prefer-stateless-function */

@@ -13,3 +28,3 @@ import React from 'react';

var ScrollableTabBar = function (_React$Component) {
var ScrollableTabBar = /*#__PURE__*/function (_React$Component) {
_inherits(ScrollableTabBar, _React$Component);

@@ -20,25 +35,21 @@

return _possibleConstructorReturn(this, (ScrollableTabBar.__proto__ || Object.getPrototypeOf(ScrollableTabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(ScrollableTabBar).apply(this, arguments));
}
_createClass(ScrollableTabBar, [{
key: 'render',
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
return React.createElement(
SaveRef,
null,
function (saveRef, getRef) {
return React.createElement(
TabBarRootNode,
_extends({ saveRef: saveRef }, _this2.props),
React.createElement(
ScrollableTabBarNode,
_extends({ saveRef: saveRef, getRef: getRef }, _this2.props),
React.createElement(TabBarTabsNode, _extends({ saveRef: saveRef }, _this2.props))
)
);
}
);
return React.createElement(SaveRef, null, function (saveRef, getRef) {
return React.createElement(TabBarRootNode, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), React.createElement(ScrollableTabBarNode, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), React.createElement(TabBarTabsNode, _extends({
saveRef: saveRef
}, _this.props))));
});
}

@@ -50,2 +61,2 @@ }]);

export default ScrollableTabBar;
export { ScrollableTabBar as default };

250

es/ScrollableTabBarNode.js

@@ -1,8 +0,22 @@

import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';

@@ -13,9 +27,11 @@ import debounce from 'lodash/debounce';

var ScrollableTabBarNode = function (_React$Component) {
var ScrollableTabBarNode = /*#__PURE__*/function (_React$Component) {
_inherits(ScrollableTabBarNode, _React$Component);
function ScrollableTabBarNode(props) {
var _this;
_classCallCheck(this, ScrollableTabBarNode);
var _this = _possibleConstructorReturn(this, (ScrollableTabBarNode.__proto__ || Object.getPrototypeOf(ScrollableTabBarNode)).call(this, props));
_this = _possibleConstructorReturn(this, _getPrototypeOf(ScrollableTabBarNode).call(this, props));

@@ -26,3 +42,5 @@ _this.prevTransitionEnd = function (e) {

}
var container = _this.props.getRef('container');
_this.scrollToActiveTab({

@@ -36,10 +54,14 @@ target: container,

var activeTab = _this.props.getRef('activeTab');
var navWrap = _this.props.getRef('navWrap');
if (e && e.target !== e.currentTarget || !activeTab) {
return;
}
} // when not scrollable or enter scrollable first time, don't emit scrolling
// when not scrollable or enter scrollable first time, don't emit scrolling
var needToSroll = _this.isNextPrevShown() && _this.lastNextPrevShown;
_this.lastNextPrevShown = _this.isNextPrevShown();
if (!needToSroll) {

@@ -50,12 +72,19 @@ return;

var activeTabWH = _this.getScrollWH(activeTab);
var navWrapNodeWH = _this.getOffsetWH(navWrap);
var offset = _this.offset;
var _assertThisInitialize = _assertThisInitialized(_this),
offset = _assertThisInitialize.offset;
var wrapOffset = _this.getOffsetLT(navWrap);
var activeTabOffset = _this.getOffsetLT(activeTab);
if (wrapOffset > activeTabOffset) {
offset += wrapOffset - activeTabOffset;
_this.setOffset(offset);
} else if (wrapOffset + navWrapNodeWH < activeTabOffset + activeTabWH) {
offset -= activeTabOffset + activeTabWH - (wrapOffset + navWrapNodeWH);
_this.setOffset(offset);

@@ -67,6 +96,10 @@ }

_this.props.onPrevClick(e);
var navWrapNode = _this.props.getRef('navWrap');
var navWrapNodeWH = _this.getOffsetWH(navWrapNode);
var offset = _this.offset;
var _assertThisInitialize2 = _assertThisInitialized(_this),
offset = _assertThisInitialize2.offset;
_this.setOffset(offset + navWrapNodeWH);

@@ -77,6 +110,10 @@ };

_this.props.onNextClick(e);
var navWrapNode = _this.props.getRef('navWrap');
var navWrapNodeWH = _this.getOffsetWH(navWrapNode);
var offset = _this.offset;
var _assertThisInitialize3 = _assertThisInitialized(_this),
offset = _assertThisInitialize3.offset;
_this.setOffset(offset - navWrapNodeWH);

@@ -86,3 +123,2 @@ };

_this.offset = 0;
_this.state = {

@@ -96,3 +132,3 @@ next: false,

_createClass(ScrollableTabBarNode, [{
key: 'componentDidMount',
key: "componentDidMount",
value: function componentDidMount() {

@@ -104,2 +140,3 @@ var _this2 = this;

_this2.setNextPrev();
_this2.scrollToActiveTab();

@@ -111,5 +148,6 @@ }, 200);

}, {
key: 'componentDidUpdate',
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
var props = this.props;
if (prevProps && prevProps.tabBarPosition !== props.tabBarPosition) {

@@ -119,5 +157,7 @@ this.setOffset(0);

}
var nextPrev = this.setNextPrev();
// wait next, prev show hide
var nextPrev = this.setNextPrev(); // wait next, prev show hide
/* eslint react/no-did-update-set-state:0 */
if (this.isNextPrevShown(this.state) !== this.isNextPrevShown(nextPrev)) {

@@ -131,3 +171,3 @@ this.setState({}, this.scrollToActiveTab);

}, {
key: 'componentWillUnmount',
key: "componentWillUnmount",
value: function componentWillUnmount() {

@@ -137,2 +177,3 @@ if (this.resizeObserver) {

}
if (this.debouncedResize && this.debouncedResize.cancel) {

@@ -143,17 +184,16 @@ this.debouncedResize.cancel();

}, {
key: 'setNextPrev',
key: "setNextPrev",
value: function setNextPrev() {
var navNode = this.props.getRef('nav');
var navTabsContainer = this.props.getRef('navTabsContainer');
var navNodeWH = this.getScrollWH(navTabsContainer || navNode);
// Add 1px to fix `offsetWidth` with decimal in Chrome not correct handle
var navNodeWH = this.getScrollWH(navTabsContainer || navNode); // Add 1px to fix `offsetWidth` with decimal in Chrome not correct handle
// https://github.com/ant-design/ant-design/issues/13423
var containerWH = this.getOffsetWH(this.props.getRef('container')) + 1;
var navWrapNodeWH = this.getOffsetWH(this.props.getRef('navWrap'));
var offset = this.offset;
var minOffset = containerWH - navNodeWH;
var _state = this.state,
next = _state.next,
prev = _state.prev;
var _this$state = this.state,
next = _this$state.next,
prev = _this$state.prev;

@@ -167,6 +207,6 @@ if (minOffset >= 0) {

} else {
next = false;
// Fix https://github.com/ant-design/ant-design/issues/8861
next = false; // Fix https://github.com/ant-design/ant-design/issues/8861
// Test with container offset which is stable
// and set the offset of the nav wrap node
var realOffset = navWrapNodeWH - navNodeWH;

@@ -191,37 +231,43 @@ this.setOffset(realOffset, false);

}, {
key: 'getOffsetWH',
key: "getOffsetWH",
value: function getOffsetWH(node) {
var tabBarPosition = this.props.tabBarPosition;
var prop = 'offsetWidth';
if (tabBarPosition === 'left' || tabBarPosition === 'right') {
prop = 'offsetHeight';
}
return node[prop];
}
}, {
key: 'getScrollWH',
key: "getScrollWH",
value: function getScrollWH(node) {
var tabBarPosition = this.props.tabBarPosition;
var prop = 'scrollWidth';
if (tabBarPosition === 'left' || tabBarPosition === 'right') {
prop = 'scrollHeight';
}
return node[prop];
}
}, {
key: 'getOffsetLT',
key: "getOffsetLT",
value: function getOffsetLT(node) {
var tabBarPosition = this.props.tabBarPosition;
var prop = 'left';
if (tabBarPosition === 'left' || tabBarPosition === 'right') {
prop = 'top';
}
return node.getBoundingClientRect()[prop];
}
}, {
key: 'setOffset',
key: "setOffset",
value: function setOffset(offset) {
var checkNextPrev = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
var target = Math.min(0, offset);
var target = Math.min(0, offset);
if (this.offset !== target) {

@@ -233,6 +279,7 @@ this.offset = target;

var transformSupported = isTransform3dSupported(navStyle);
if (tabBarPosition === 'left' || tabBarPosition === 'right') {
if (transformSupported) {
navOffset = {
value: 'translate3d(0,' + target + 'px,0)'
value: "translate3d(0,".concat(target, "px,0)")
};

@@ -242,3 +289,3 @@ } else {

name: 'top',
value: target + 'px'
value: "".concat(target, "px")
};

@@ -250,4 +297,5 @@ }

}
navOffset = {
value: 'translate3d(' + target + 'px,0,0)'
value: "translate3d(".concat(target, "px,0,0)")
};

@@ -257,5 +305,6 @@ } else {

name: 'left',
value: target + 'px'
value: "".concat(target, "px")
};
}
if (transformSupported) {

@@ -266,2 +315,3 @@ setTransform(navStyle, navOffset.value);

}
if (checkNextPrev) {

@@ -273,3 +323,3 @@ this.setNextPrev();

}, {
key: 'setPrev',
key: "setPrev",
value: function setPrev(v) {

@@ -283,3 +333,3 @@ if (this.state.prev !== v) {

}, {
key: 'setNext',
key: "setNext",
value: function setNext(v) {

@@ -293,3 +343,3 @@ if (this.state.next !== v) {

}, {
key: 'isNextPrevShown',
key: "isNextPrevShown",
value: function isNextPrevShown(state) {

@@ -299,68 +349,50 @@ if (state) {

}
return this.state.next || this.state.prev;
}
}, {
key: 'render',
key: "render",
value: function render() {
var _classnames, _classnames2, _classnames3, _classnames4;
var _state2 = this.state,
next = _state2.next,
prev = _state2.prev;
var _props = this.props,
prefixCls = _props.prefixCls,
scrollAnimated = _props.scrollAnimated,
navWrapper = _props.navWrapper,
prevIcon = _props.prevIcon,
nextIcon = _props.nextIcon;
var _this$state2 = this.state,
next = _this$state2.next,
prev = _this$state2.prev;
var _this$props = this.props,
prefixCls = _this$props.prefixCls,
scrollAnimated = _this$props.scrollAnimated,
navWrapper = _this$props.navWrapper,
prevIcon = _this$props.prevIcon,
nextIcon = _this$props.nextIcon;
var showNextPrev = prev || next;
var prevButton = React.createElement(
'span',
{
onClick: prev ? this.prev : null,
unselectable: 'unselectable',
className: classnames((_classnames = {}, _defineProperty(_classnames, prefixCls + '-tab-prev', 1), _defineProperty(_classnames, prefixCls + '-tab-btn-disabled', !prev), _defineProperty(_classnames, prefixCls + '-tab-arrow-show', showNextPrev), _classnames)),
onTransitionEnd: this.prevTransitionEnd
},
prevIcon || React.createElement('span', { className: prefixCls + '-tab-prev-icon' })
);
var nextButton = React.createElement(
'span',
{
onClick: next ? this.next : null,
unselectable: 'unselectable',
className: classnames((_classnames2 = {}, _defineProperty(_classnames2, prefixCls + '-tab-next', 1), _defineProperty(_classnames2, prefixCls + '-tab-btn-disabled', !next), _defineProperty(_classnames2, prefixCls + '-tab-arrow-show', showNextPrev), _classnames2))
},
nextIcon || React.createElement('span', { className: prefixCls + '-tab-next-icon' })
);
var navClassName = prefixCls + '-nav';
var navClasses = classnames((_classnames3 = {}, _defineProperty(_classnames3, navClassName, true), _defineProperty(_classnames3, scrollAnimated ? navClassName + '-animated' : navClassName + '-no-animated', true), _classnames3));
return React.createElement(
'div',
{
className: classnames((_classnames4 = {}, _defineProperty(_classnames4, prefixCls + '-nav-container', 1), _defineProperty(_classnames4, prefixCls + '-nav-container-scrolling', showNextPrev), _classnames4)),
key: 'container',
ref: this.props.saveRef('container')
},
prevButton,
nextButton,
React.createElement(
'div',
{ className: prefixCls + '-nav-wrap', ref: this.props.saveRef('navWrap') },
React.createElement(
'div',
{ className: prefixCls + '-nav-scroll' },
React.createElement(
'div',
{ className: navClasses, ref: this.props.saveRef('nav') },
navWrapper(this.props.children)
)
)
)
);
var prevButton = React.createElement("span", {
onClick: prev ? this.prev : null,
unselectable: "unselectable",
className: classnames((_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-tab-prev"), 1), _defineProperty(_classnames, "".concat(prefixCls, "-tab-btn-disabled"), !prev), _defineProperty(_classnames, "".concat(prefixCls, "-tab-arrow-show"), showNextPrev), _classnames)),
onTransitionEnd: this.prevTransitionEnd
}, prevIcon || React.createElement("span", {
className: "".concat(prefixCls, "-tab-prev-icon")
}));
var nextButton = React.createElement("span", {
onClick: next ? this.next : null,
unselectable: "unselectable",
className: classnames((_classnames2 = {}, _defineProperty(_classnames2, "".concat(prefixCls, "-tab-next"), 1), _defineProperty(_classnames2, "".concat(prefixCls, "-tab-btn-disabled"), !next), _defineProperty(_classnames2, "".concat(prefixCls, "-tab-arrow-show"), showNextPrev), _classnames2))
}, nextIcon || React.createElement("span", {
className: "".concat(prefixCls, "-tab-next-icon")
}));
var navClassName = "".concat(prefixCls, "-nav");
var navClasses = classnames((_classnames3 = {}, _defineProperty(_classnames3, navClassName, true), _defineProperty(_classnames3, scrollAnimated ? "".concat(navClassName, "-animated") : "".concat(navClassName, "-no-animated"), true), _classnames3));
return React.createElement("div", {
className: classnames((_classnames4 = {}, _defineProperty(_classnames4, "".concat(prefixCls, "-nav-container"), 1), _defineProperty(_classnames4, "".concat(prefixCls, "-nav-container-scrolling"), showNextPrev), _classnames4)),
key: "container",
ref: this.props.saveRef('container')
}, prevButton, nextButton, React.createElement("div", {
className: "".concat(prefixCls, "-nav-wrap"),
ref: this.props.saveRef('navWrap')
}, React.createElement("div", {
className: "".concat(prefixCls, "-nav-scroll")
}, React.createElement("div", {
className: navClasses,
ref: this.props.saveRef('nav')
}, navWrapper(this.props.children)))));
}

@@ -372,21 +404,3 @@ }]);

export default ScrollableTabBarNode;
ScrollableTabBarNode.propTypes = {
activeKey: PropTypes.string,
getRef: PropTypes.func.isRequired,
saveRef: PropTypes.func.isRequired,
tabBarPosition: PropTypes.oneOf(['left', 'right', 'top', 'bottom']),
prefixCls: PropTypes.string,
scrollAnimated: PropTypes.bool,
onPrevClick: PropTypes.func,
onNextClick: PropTypes.func,
navWrapper: PropTypes.func,
children: PropTypes.node,
prevIcon: PropTypes.node,
nextIcon: PropTypes.node,
direction: PropTypes.node
};
export { ScrollableTabBarNode as default };
ScrollableTabBarNode.defaultProps = {

@@ -393,0 +407,0 @@ tabBarPosition: 'left',

65

es/SwipeableInkTabBar.js

@@ -1,6 +0,21 @@

import _extends from 'babel-runtime/helpers/extends';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
/* eslint-disable react/prefer-stateless-function */

@@ -14,3 +29,3 @@ import React from 'react';

var SwipeableInkTabBar = function (_React$Component) {
var SwipeableInkTabBar = /*#__PURE__*/function (_React$Component) {
_inherits(SwipeableInkTabBar, _React$Component);

@@ -21,26 +36,24 @@

return _possibleConstructorReturn(this, (SwipeableInkTabBar.__proto__ || Object.getPrototypeOf(SwipeableInkTabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(SwipeableInkTabBar).apply(this, arguments));
}
_createClass(SwipeableInkTabBar, [{
key: 'render',
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
return React.createElement(
SaveRef,
null,
function (saveRef, getRef) {
return React.createElement(
TabBarRootNode,
_extends({ saveRef: saveRef }, _this2.props),
React.createElement(
SwipeableTabBarNode,
_extends({ saveRef: saveRef, getRef: getRef }, _this2.props),
React.createElement(TabBarSwipeableTabs, _extends({ saveRef: saveRef }, _this2.props)),
React.createElement(InkTabBarNode, _extends({ saveRef: saveRef, getRef: getRef }, _this2.props))
)
);
}
);
return React.createElement(SaveRef, null, function (saveRef, getRef) {
return React.createElement(TabBarRootNode, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), React.createElement(SwipeableTabBarNode, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), React.createElement(TabBarSwipeableTabs, _extends({
saveRef: saveRef
}, _this.props)), React.createElement(InkTabBarNode, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props))));
});
}

@@ -52,2 +65,2 @@ }]);

export default SwipeableInkTabBar;
export { SwipeableInkTabBar as default };

308

es/SwipeableTabBarNode.js

@@ -1,9 +0,28 @@

import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _extends from 'babel-runtime/helpers/extends';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';

@@ -14,19 +33,62 @@ import Hammer from 'rc-hammerjs';

var SwipeableTabBarNode = function (_React$Component) {
var SwipeableTabBarNode = /*#__PURE__*/function (_React$Component) {
_inherits(SwipeableTabBarNode, _React$Component);
function SwipeableTabBarNode(props) {
var _this;
_classCallCheck(this, SwipeableTabBarNode);
var _this = _possibleConstructorReturn(this, (SwipeableTabBarNode.__proto__ || Object.getPrototypeOf(SwipeableTabBarNode)).call(this, props));
_this = _possibleConstructorReturn(this, _getPrototypeOf(SwipeableTabBarNode).call(this, props));
_initialiseProps.call(_this);
_this.onPan = function (e) {
var _this$cache = _this.cache,
vertical = _this$cache.vertical,
totalAvaliableDelta = _this$cache.totalAvaliableDelta,
totalDelta = _this$cache.totalDelta;
var speed = _this.props.speed; // calculate touch distance
var _this$checkPagination = _this.checkPaginationByKey(_this.props.activeKey),
hasPrevPage = _this$checkPagination.hasPrevPage,
hasNextPage = _this$checkPagination.hasNextPage;
var nowDelta = vertical ? e.deltaY : e.deltaX;
nowDelta *= speed / 10; // calculate distance dom need transform
var _nextDelta = nowDelta + totalDelta;
if (_this.isRtl()) {
// calculate distance from right when direction is right-to-left
if (_nextDelta <= 0) {
_nextDelta = 0;
} else if (_nextDelta >= totalAvaliableDelta) {
_nextDelta = totalAvaliableDelta;
}
} // calculate distance from left when direction is left-to-right
else if (_nextDelta >= 0) {
_nextDelta = 0;
} else if (_nextDelta <= -totalAvaliableDelta) {
_nextDelta = -totalAvaliableDelta;
}
_this.cache.totalDelta = _nextDelta;
_this.setSwipePosition(); // calculate pagination display
var _this$checkPagination = _this.checkPaginationByDelta(_this.cache.totalDelta),
hasPrevPage = _this$checkPagination.hasPrevPage,
hasNextPage = _this$checkPagination.hasNextPage;
if (hasPrevPage !== _this.state.hasPrevPage || hasNextPage !== _this.state.hasNextPage) {
_this.setState({
hasPrevPage: hasPrevPage,
hasNextPage: hasNextPage
});
}
};
var _this$checkPagination2 = _this.checkPaginationByKey(_this.props.activeKey),
_hasPrevPage = _this$checkPagination2.hasPrevPage,
_hasNextPage = _this$checkPagination2.hasNextPage;
_this.state = {
hasPrevPage: hasPrevPage,
hasNextPage: hasNextPage
hasPrevPage: _hasPrevPage,
hasNextPage: _hasNextPage
};

@@ -37,3 +99,3 @@ return _this;

_createClass(SwipeableTabBarNode, [{
key: 'componentDidMount',
key: "componentDidMount",
value: function componentDidMount() {

@@ -43,5 +105,6 @@ var swipe = this.props.getRef('swipe');

var activeKey = this.props.activeKey;
this.swipeNode = ReactDOM.findDOMNode(swipe); // dom which scroll (9999px)
this.swipeNode = ReactDOM.findDOMNode(swipe); // dom which scroll (9999px)
this.realNode = ReactDOM.findDOMNode(nav); // dom which visiable in screen (viewport)
this.setCache();

@@ -51,5 +114,6 @@ this.setSwipePositionByKey(activeKey);

}, {
key: 'componentDidUpdate',
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
this.setCache();
if (this.props.activeKey && this.props.activeKey !== prevProps.activeKey || this.props.panels.length !== prevProps.panels.length || this.props.pageSize !== prevProps.pageSize) {

@@ -60,13 +124,16 @@ this.setSwipePositionByKey(this.props.activeKey);

}, {
key: 'setCache',
key: "setCache",
value: function setCache() {
var _props = this.props,
tabBarPosition = _props.tabBarPosition,
pageSize = _props.pageSize,
panels = _props.panels;
var _this$props = this.props,
tabBarPosition = _this$props.tabBarPosition,
pageSize = _this$props.pageSize,
panels = _this$props.panels;
var _isVertical = isVertical(tabBarPosition);
var _viewSize = getStyle(this.realNode, _isVertical ? 'height' : 'width');
var _tabWidth = _viewSize / pageSize;
this.cache = _extends({}, this.cache, {
this.cache = _objectSpread({}, this.cache, {
vertical: _isVertical,

@@ -77,3 +144,2 @@ totalAvaliableDelta: _tabWidth * panels.length - _viewSize,

}
/**

@@ -84,24 +150,23 @@ * used for props.activeKey setting, not for swipe callback

}, {
key: 'getDeltaByKey',
key: "getDeltaByKey",
value: function getDeltaByKey(activeKey) {
var pageSize = this.props.pageSize;
var index = this.getIndexByKey(activeKey);
var centerTabCount = Math.floor(pageSize / 2);
var tabWidth = this.cache.tabWidth;
var delta = (index - centerTabCount) * tabWidth; // in rtl direction tabs are ordered from right to left, so delta should be positive in order to
// push swiped element to righ side (start of view)
var delta = (index - centerTabCount) * tabWidth;
// in rtl direction tabs are ordered from right to left, so delta should be positive in order to
// push swiped element to righ side (start of view)
if (!this.isRtl()) {
delta *= -1;
}
return delta;
}
}, {
key: 'getIndexByKey',
key: "getIndexByKey",
value: function getIndexByKey(activeKey) {
var panels = this.props.panels;
var length = panels.length;
var length = panels.length;
for (var i = 0; i < length; i++) {

@@ -112,13 +177,13 @@ if (panels[i].key === activeKey) {

}
return -1;
}
}, {
key: 'setSwipePositionByKey',
key: "setSwipePositionByKey",
value: function setSwipePositionByKey(activeKey) {
var _checkPaginationByKey = this.checkPaginationByKey(activeKey),
hasPrevPage = _checkPaginationByKey.hasPrevPage,
hasNextPage = _checkPaginationByKey.hasNextPage;
var _this$checkPagination3 = this.checkPaginationByKey(activeKey),
hasPrevPage = _this$checkPagination3.hasPrevPage,
hasNextPage = _this$checkPagination3.hasNextPage;
var totalAvaliableDelta = this.cache.totalAvaliableDelta;
this.setState({

@@ -128,3 +193,4 @@ hasPrevPage: hasPrevPage,

});
var delta = void 0;
var delta;
if (!hasPrevPage) {

@@ -140,2 +206,3 @@ // the first page

}
this.cache.totalDelta = delta;

@@ -145,20 +212,18 @@ this.setSwipePosition();

}, {
key: 'setSwipePosition',
key: "setSwipePosition",
value: function setSwipePosition() {
var _cache = this.cache,
totalDelta = _cache.totalDelta,
vertical = _cache.vertical;
var _this$cache2 = this.cache,
totalDelta = _this$cache2.totalDelta,
vertical = _this$cache2.vertical;
setPxStyle(this.swipeNode, totalDelta, vertical);
}
}, {
key: 'checkPaginationByKey',
key: "checkPaginationByKey",
value: function checkPaginationByKey(activeKey) {
var _props2 = this.props,
panels = _props2.panels,
pageSize = _props2.pageSize;
var _this$props2 = this.props,
panels = _this$props2.panels,
pageSize = _this$props2.pageSize;
var index = this.getIndexByKey(activeKey);
var centerTabCount = Math.floor(pageSize / 2); // the basic rule is to make activeTab be shown in the center of TabBar viewport
var index = this.getIndexByKey(activeKey);
var centerTabCount = Math.floor(pageSize / 2);
// the basic rule is to make activeTab be shown in the center of TabBar viewport
return {

@@ -170,6 +235,5 @@ hasPrevPage: index - centerTabCount > 0,

}, {
key: 'checkPaginationByDelta',
key: "checkPaginationByDelta",
value: function checkPaginationByDelta(delta) {
var totalAvaliableDelta = this.cache.totalAvaliableDelta;
return {

@@ -181,3 +245,3 @@ hasPrevPage: delta < 0,

}, {
key: 'isRtl',
key: "isRtl",
value: function isRtl() {

@@ -187,15 +251,14 @@ return this.props.direction === 'rtl';

}, {
key: 'render',
key: "render",
value: function render() {
var _classnames2;
var _props3 = this.props,
prefixCls = _props3.prefixCls,
hammerOptions = _props3.hammerOptions,
tabBarPosition = _props3.tabBarPosition;
var _state = this.state,
hasPrevPage = _state.hasPrevPage,
hasNextPage = _state.hasNextPage;
var navClassName = prefixCls + '-nav';
var _this$props3 = this.props,
prefixCls = _this$props3.prefixCls,
hammerOptions = _this$props3.hammerOptions,
tabBarPosition = _this$props3.tabBarPosition;
var _this$state = this.state,
hasPrevPage = _this$state.hasPrevPage,
hasNextPage = _this$state.hasNextPage;
var navClassName = "".concat(prefixCls, "-nav");
var navClasses = classnames(_defineProperty({}, navClassName, true));

@@ -205,30 +268,19 @@ var events = {

};
return React.createElement(
'div',
{
className: classnames((_classnames2 = {}, _defineProperty(_classnames2, prefixCls + '-nav-container', 1), _defineProperty(_classnames2, prefixCls + '-nav-swipe-container', 1), _defineProperty(_classnames2, prefixCls + '-prevpage', hasPrevPage), _defineProperty(_classnames2, prefixCls + '-nextpage', hasNextPage), _classnames2)),
key: 'container',
ref: this.props.saveRef('container')
},
React.createElement(
'div',
{ className: prefixCls + '-nav-wrap', ref: this.props.saveRef('navWrap') },
React.createElement(
Hammer,
_extends({}, events, {
direction: isVertical(tabBarPosition) ? 'DIRECTION_ALL' : 'DIRECTION_HORIZONTAL',
options: hammerOptions
}),
React.createElement(
'div',
{ className: prefixCls + '-nav-swipe', ref: this.props.saveRef('swipe') },
React.createElement(
'div',
{ className: navClasses, ref: this.props.saveRef('nav') },
this.props.children
)
)
)
)
);
return React.createElement("div", {
className: classnames((_classnames2 = {}, _defineProperty(_classnames2, "".concat(prefixCls, "-nav-container"), 1), _defineProperty(_classnames2, "".concat(prefixCls, "-nav-swipe-container"), 1), _defineProperty(_classnames2, "".concat(prefixCls, "-prevpage"), hasPrevPage), _defineProperty(_classnames2, "".concat(prefixCls, "-nextpage"), hasNextPage), _classnames2)),
key: "container",
ref: this.props.saveRef('container')
}, React.createElement("div", {
className: "".concat(prefixCls, "-nav-wrap"),
ref: this.props.saveRef('navWrap')
}, React.createElement(Hammer, _extends({}, events, {
direction: isVertical(tabBarPosition) ? 'DIRECTION_ALL' : 'DIRECTION_HORIZONTAL',
options: hammerOptions
}), React.createElement("div", {
className: "".concat(prefixCls, "-nav-swipe"),
ref: this.props.saveRef('swipe')
}, React.createElement("div", {
className: navClasses,
ref: this.props.saveRef('nav')
}, this.props.children)))));
}

@@ -240,69 +292,3 @@ }]);

var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onPan = function (e) {
var _cache2 = _this2.cache,
vertical = _cache2.vertical,
totalAvaliableDelta = _cache2.totalAvaliableDelta,
totalDelta = _cache2.totalDelta;
var speed = _this2.props.speed;
// calculate touch distance
var nowDelta = vertical ? e.deltaY : e.deltaX;
nowDelta *= speed / 10;
// calculate distance dom need transform
var _nextDelta = nowDelta + totalDelta;
if (_this2.isRtl()) {
// calculate distance from right when direction is right-to-left
if (_nextDelta <= 0) {
_nextDelta = 0;
} else if (_nextDelta >= totalAvaliableDelta) {
_nextDelta = totalAvaliableDelta;
}
}
// calculate distance from left when direction is left-to-right
else if (_nextDelta >= 0) {
_nextDelta = 0;
} else if (_nextDelta <= -totalAvaliableDelta) {
_nextDelta = -totalAvaliableDelta;
}
_this2.cache.totalDelta = _nextDelta;
_this2.setSwipePosition();
// calculate pagination display
var _checkPaginationByDel = _this2.checkPaginationByDelta(_this2.cache.totalDelta),
hasPrevPage = _checkPaginationByDel.hasPrevPage,
hasNextPage = _checkPaginationByDel.hasNextPage;
if (hasPrevPage !== _this2.state.hasPrevPage || hasNextPage !== _this2.state.hasNextPage) {
_this2.setState({
hasPrevPage: hasPrevPage,
hasNextPage: hasNextPage
});
}
};
};
export default SwipeableTabBarNode;
SwipeableTabBarNode.propTypes = {
activeKey: PropTypes.string,
panels: PropTypes.node,
pageSize: PropTypes.number,
tabBarPosition: PropTypes.oneOf(['left', 'right', 'top', 'bottom']),
prefixCls: PropTypes.string,
children: PropTypes.node,
hammerOptions: PropTypes.object,
speed: PropTypes.number,
saveRef: PropTypes.func,
getRef: PropTypes.func,
direction: PropTypes.string
};
export { SwipeableTabBarNode as default };
SwipeableTabBarNode.defaultProps = {

@@ -314,6 +300,8 @@ panels: null,

hammerOptions: {},
pageSize: 5, // per page show how many tabs
speed: 7, // swipe speed, 1 to 10, more bigger more faster
pageSize: 5,
// per page show how many tabs
speed: 7,
// swipe speed, 1 to 10, more bigger more faster
saveRef: function saveRef() {},
getRef: function getRef() {}
};

136

es/SwipeableTabContent.js

@@ -1,8 +0,28 @@

import _extends from 'babel-runtime/helpers/extends';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import PropTypes from 'prop-types';
import Hammer from 'rc-hammerjs';

@@ -12,3 +32,2 @@ import ReactDOM from 'react-dom';

import { isVertical, getActiveIndex, getTransformByIndex, setTransform, getActiveKey, toArray, setTransition } from './utils';
var RESISTANCE_COEF = 0.6;

@@ -21,4 +40,4 @@

viewSize = _ref.viewSize;
var index = startIndex + -delta / viewSize;
var index = startIndex + -delta / viewSize;
if (index < 0) {

@@ -29,2 +48,3 @@ index = Math.exp(index * RESISTANCE_COEF) - 1;

}
return index;

@@ -36,5 +56,7 @@ }

var otherDelta = isVertical(this.props.tabBarPosition) ? e.deltaX : e.deltaY;
if (Math.abs(delta) < Math.abs(otherDelta)) {
return undefined;
}
var currentIndex = computeIndex({

@@ -47,2 +69,3 @@ maxIndex: this.maxIndex,

var showIndex = delta < 0 ? Math.floor(currentIndex + 1) : Math.floor(currentIndex);
if (showIndex < 0) {

@@ -53,23 +76,27 @@ showIndex = 0;

}
if (this.children[showIndex].props.disabled) {
return undefined;
}
return currentIndex;
}
var SwipeableTabContent = function (_React$Component) {
var SwipeableTabContent = /*#__PURE__*/function (_React$Component) {
_inherits(SwipeableTabContent, _React$Component);
function SwipeableTabContent() {
var _ref2;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
_classCallCheck(this, SwipeableTabContent);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref2 = SwipeableTabContent.__proto__ || Object.getPrototypeOf(SwipeableTabContent)).call.apply(_ref2, [this].concat(args))), _this), _this.onPanStart = function () {
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(SwipeableTabContent)).call.apply(_getPrototypeOf2, [this].concat(args)));
_this.onPanStart = function () {
var _this$props = _this.props,

@@ -80,11 +107,15 @@ tabBarPosition = _this$props.tabBarPosition,

animated = _this$props.animated;
_this.startIndex = getActiveIndex(children, activeKey);
_this.startIndex = getActiveIndex(children, activeKey);
var startIndex = _this.startIndex;
var _assertThisInitialize = _assertThisInitialized(_this),
startIndex = _assertThisInitialize.startIndex;
if (startIndex === -1) {
return;
}
if (animated) {
setTransition(_this.rootNode.style, 'none');
}
_this.startDrag = true;

@@ -94,30 +125,42 @@ _this.children = toArray(children);

_this.viewSize = isVertical(tabBarPosition) ? _this.rootNode.offsetHeight : _this.rootNode.offsetWidth;
}, _this.onPan = function (e) {
};
_this.onPan = function (e) {
if (!_this.startDrag) {
return;
}
var tabBarPosition = _this.props.tabBarPosition;
var currentIndex = getIndexByDelta.call(_assertThisInitialized(_this), e);
var currentIndex = getIndexByDelta.call(_this, e);
if (currentIndex !== undefined) {
setTransform(_this.rootNode.style, getTransformByIndex(currentIndex, tabBarPosition));
}
}, _this.onPanEnd = function (e) {
};
_this.onPanEnd = function (e) {
if (!_this.startDrag) {
return;
}
_this.end(e);
}, _this.onSwipe = function (e) {
};
_this.onSwipe = function (e) {
_this.end(e, true);
}, _this.end = function (e, swipe) {
};
_this.end = function (e, swipe) {
var _this$props2 = _this.props,
tabBarPosition = _this$props2.tabBarPosition,
animated = _this$props2.animated;
_this.startDrag = false;
_this.startDrag = false;
if (animated) {
setTransition(_this.rootNode.style, '');
}
var currentIndex = getIndexByDelta.call(_this, e);
var currentIndex = getIndexByDelta.call(_assertThisInitialized(_this), e);
var finalIndex = _this.startIndex;
if (currentIndex !== undefined) {

@@ -133,2 +176,3 @@ if (currentIndex < 0) {

var floorIndex = Math.floor(currentIndex);
if (currentIndex - floorIndex > 0.6) {

@@ -141,5 +185,7 @@ finalIndex = floorIndex + 1;

}
if (_this.children[finalIndex].props.disabled) {
return;
}
if (_this.startIndex === finalIndex) {

@@ -152,7 +198,9 @@ if (animated) {

}
}, _temp), _possibleConstructorReturn(_this, _ret);
};
return _this;
}
_createClass(SwipeableTabContent, [{
key: 'componentDidMount',
key: "componentDidMount",
value: function componentDidMount() {

@@ -162,9 +210,8 @@ this.rootNode = ReactDOM.findDOMNode(this);

}, {
key: 'render',
key: "render",
value: function render() {
var _props = this.props,
tabBarPosition = _props.tabBarPosition,
hammerOptions = _props.hammerOptions,
animated = _props.animated;
var _this$props3 = this.props,
tabBarPosition = _this$props3.tabBarPosition,
hammerOptions = _this$props3.hammerOptions,
animated = _this$props3.animated;
var events = {

@@ -174,4 +221,5 @@ onSwipe: this.onSwipe,

};
if (animated !== false) {
events = _extends({}, events, {
events = _objectSpread({}, events, {
onPan: this.onPan,

@@ -181,10 +229,7 @@ onPanEnd: this.onPanEnd

}
return React.createElement(
Hammer,
_extends({}, events, {
direction: isVertical(tabBarPosition) ? 'DIRECTION_ALL' : 'DIRECTION_HORIZONTAL',
options: hammerOptions
}),
React.createElement(TabContent, this.props)
);
return React.createElement(Hammer, _extends({}, events, {
direction: isVertical(tabBarPosition) ? 'DIRECTION_ALL' : 'DIRECTION_HORIZONTAL',
options: hammerOptions
}), React.createElement(TabContent, this.props));
}

@@ -196,16 +241,5 @@ }]);

export default SwipeableTabContent;
SwipeableTabContent.propTypes = {
tabBarPosition: PropTypes.string,
onChange: PropTypes.func,
children: PropTypes.node,
hammerOptions: PropTypes.any,
animated: PropTypes.bool,
activeKey: PropTypes.string
};
export { SwipeableTabContent as default };
SwipeableTabContent.defaultProps = {
animated: true
};

54

es/TabBar.js

@@ -1,6 +0,21 @@

import _extends from 'babel-runtime/helpers/extends';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
/* eslint-disable react/prefer-stateless-function */

@@ -12,3 +27,3 @@ import React from 'react';

var TabBar = function (_React$Component) {
var TabBar = /*#__PURE__*/function (_React$Component) {
_inherits(TabBar, _React$Component);

@@ -19,21 +34,18 @@

return _possibleConstructorReturn(this, (TabBar.__proto__ || Object.getPrototypeOf(TabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabBar).apply(this, arguments));
}
_createClass(TabBar, [{
key: 'render',
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
return React.createElement(
SaveRef,
null,
function (saveRef) {
return React.createElement(
TabBarRootNode,
_extends({ saveRef: saveRef }, _this2.props),
React.createElement(TabBarTabsNode, _extends({ saveRef: saveRef }, _this2.props))
);
}
);
return React.createElement(SaveRef, null, function (saveRef, getRef) {
return React.createElement(TabBarRootNode, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), React.createElement(TabBarTabsNode, _extends({
saveRef: saveRef
}, _this.props)));
});
}

@@ -45,2 +57,2 @@ }]);

export default TabBar;
export { TabBar as default };

148

es/TabBarRootNode.js

@@ -1,77 +0,120 @@

import _extends from 'babel-runtime/helpers/extends';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React, { cloneElement } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { getDataAttr } from './utils';
var TabBarRootNode = function (_React$Component) {
var TabBarRootNode = /*#__PURE__*/function (_React$Component) {
_inherits(TabBarRootNode, _React$Component);
function TabBarRootNode() {
var _ref;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
_classCallCheck(this, TabBarRootNode);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = TabBarRootNode.__proto__ || Object.getPrototypeOf(TabBarRootNode)).call.apply(_ref, [this].concat(args))), _this), _this.getExtraContentStyle = function () {
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(TabBarRootNode)).call.apply(_getPrototypeOf2, [this].concat(args)));
_this.getExtraContentStyle = function () {
var _this$props = _this.props,
tabBarPosition = _this$props.tabBarPosition,
direction = _this$props.direction;
var topOrBottom = tabBarPosition === 'top' || tabBarPosition === 'bottom';
var topOrBottom = tabBarPosition === 'top' || tabBarPosition === 'bottom';
if (direction === 'rtl') {
return topOrBottom ? { float: 'left' } : {};
return topOrBottom ? {
float: 'left'
} : {};
}
return topOrBottom ? { float: 'right' } : {};
}, _temp), _possibleConstructorReturn(_this, _ret);
return topOrBottom ? {
float: 'right'
} : {};
};
return _this;
}
_createClass(TabBarRootNode, [{
key: 'render',
key: "componentDidUpdate",
value: function componentDidUpdate() {
var activeTab = this.props.getRef('activeTab');
if (activeTab) {
activeTab.focus();
}
}
}, {
key: "render",
value: function render() {
var _props = this.props,
prefixCls = _props.prefixCls,
onKeyDown = _props.onKeyDown,
className = _props.className,
extraContent = _props.extraContent,
style = _props.style,
tabBarPosition = _props.tabBarPosition,
children = _props.children,
direction = _props.direction,
restProps = _objectWithoutProperties(_props, ['prefixCls', 'onKeyDown', 'className', 'extraContent', 'style', 'tabBarPosition', 'children', 'direction']);
var _this$props2 = this.props,
prefixCls = _this$props2.prefixCls,
onKeyDown = _this$props2.onKeyDown,
className = _this$props2.className,
extraContent = _this$props2.extraContent,
style = _this$props2.style,
tabBarPosition = _this$props2.tabBarPosition,
children = _this$props2.children,
direction = _this$props2.direction,
restProps = _objectWithoutProperties(_this$props2, ["prefixCls", "onKeyDown", "className", "extraContent", "style", "tabBarPosition", "children", "direction"]);
var cls = classnames(prefixCls + '-bar', _defineProperty({}, className, !!className));
var cls = classnames("".concat(prefixCls, "-bar"), _defineProperty({}, className, !!className));
var topOrBottom = tabBarPosition === 'top' || tabBarPosition === 'bottom';
var extraContentStyle = extraContent && extraContent.props ? extraContent.props.style : {};
var newChildren = children;
if (extraContent) {
newChildren = [cloneElement(extraContent, {
key: 'extra',
style: _extends({}, this.getExtraContentStyle(topOrBottom, direction), extraContentStyle)
}), cloneElement(children, { key: 'content' })];
onKeyDown: function onKeyDown(e) {
return e.stopPropagation();
},
style: _objectSpread({}, this.getExtraContentStyle(topOrBottom, direction), {}, extraContentStyle)
}), cloneElement(children, {
key: 'content'
})];
newChildren = topOrBottom ? newChildren : newChildren.reverse();
}
return React.createElement(
'div',
_extends({
role: 'tablist',
className: cls,
tabIndex: '0',
ref: this.props.saveRef('root'),
onKeyDown: onKeyDown,
style: style
}, getDataAttr(restProps)),
newChildren
);
return React.createElement("div", _extends({
role: "tablist",
tabIndex: -1,
className: cls,
ref: this.props.saveRef('root'),
onKeyDown: onKeyDown,
style: style
}, getDataAttr(restProps)), newChildren);
}

@@ -83,17 +126,3 @@ }]);

export default TabBarRootNode;
TabBarRootNode.propTypes = {
prefixCls: PropTypes.string,
className: PropTypes.string,
style: PropTypes.object,
tabBarPosition: PropTypes.oneOf(['left', 'right', 'top', 'bottom']),
children: PropTypes.node,
extraContent: PropTypes.node,
onKeyDown: PropTypes.func,
saveRef: PropTypes.func,
direction: PropTypes.oneOf(['ltr', 'rtl'])
};
export { TabBarRootNode as default };
TabBarRootNode.defaultProps = {

@@ -107,3 +136,4 @@ prefixCls: '',

onKeyDown: function onKeyDown() {},
saveRef: function saveRef() {}
saveRef: function saveRef() {},
getRef: function getRef() {}
};

93

es/TabBarSwipeableTabs.js

@@ -1,12 +0,27 @@

import _extends from 'babel-runtime/helpers/extends';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
var TabBarSwipeableTabs = function (_React$Component) {
var TabBarSwipeableTabs = /*#__PURE__*/function (_React$Component) {
_inherits(TabBarSwipeableTabs, _React$Component);

@@ -17,9 +32,9 @@

return _possibleConstructorReturn(this, (TabBarSwipeableTabs.__proto__ || Object.getPrototypeOf(TabBarSwipeableTabs)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabBarSwipeableTabs).apply(this, arguments));
}
_createClass(TabBarSwipeableTabs, [{
key: 'render',
key: "render",
value: function render() {
var _this2 = this;
var _this = this;

@@ -32,3 +47,4 @@ var props = this.props;

var _flexWidth = 1 / props.pageSize * 100 + '%';
var _flexWidth = "".concat(1 / props.pageSize * 100, "%");
var tabStyle = {

@@ -38,3 +54,2 @@ WebkitFlexBasis: _flexWidth,

};
React.Children.forEach(children, function (child) {

@@ -46,29 +61,33 @@ var _classnames;

}
var key = child.key;
var cls = classnames(prefixCls + '-tab', (_classnames = {}, _defineProperty(_classnames, prefixCls + '-tab-active', activeKey === key), _defineProperty(_classnames, prefixCls + '-tab-disabled', child.props.disabled), _classnames));
var cls = classnames("".concat(prefixCls, "-tab"), (_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-tab-active"), activeKey === key), _defineProperty(_classnames, "".concat(prefixCls, "-tab-disabled"), child.props.disabled), _classnames));
var events = {};
if (!child.props.disabled) {
events = {
onClick: _this2.props.onTabClick.bind(_this2, key)
onClick: _this.props.onTabClick.bind(_this, key)
};
}
var refProps = {};
if (activeKey === key) {
refProps.ref = _this2.props.saveRef('activeTab');
refProps.ref = _this.props.saveRef('activeTab');
}
rst.push(React.createElement(
'div',
_extends({
role: 'tab',
style: tabStyle,
'aria-disabled': child.props.disabled ? 'true' : 'false',
'aria-selected': activeKey === key ? 'true' : 'false'
}, events, {
className: cls,
key: key
}, refProps),
child.props.tab
));
var id = _this.props.id ? "".concat(key, "-").concat(_this.props.id) : key;
rst.push(React.createElement("div", _extends({
role: "tab",
style: tabStyle,
"aria-disabled": child.props.disabled ? 'true' : 'false',
"aria-selected": activeKey === key ? 'true' : 'false',
tabIndex: activeKey === key ? 0 : -1
}, events, {
className: cls,
key: key,
id: "tab-".concat(id),
"aria-controls": "tabpane-".concat(id)
}, refProps), child.props.tab));
});
return rst;

@@ -81,15 +100,3 @@ }

export default TabBarSwipeableTabs;
TabBarSwipeableTabs.propTypes = {
pageSize: PropTypes.number,
onTabClick: PropTypes.func,
saveRef: PropTypes.func,
destroyInactiveTabPane: PropTypes.bool,
prefixCls: PropTypes.string,
activeKey: PropTypes.string,
panels: PropTypes.node
};
export { TabBarSwipeableTabs as default };
TabBarSwipeableTabs.defaultProps = {

@@ -96,0 +103,0 @@ pageSize: 5,

124

es/TabBarTabsNode.js

@@ -1,13 +0,28 @@

import _extends from 'babel-runtime/helpers/extends';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import warning from 'warning';
import PropTypes from 'prop-types';
import { isVertical } from './utils';
var TabBarTabsNode = function (_React$Component) {
var TabBarTabsNode = /*#__PURE__*/function (_React$Component) {
_inherits(TabBarTabsNode, _React$Component);

@@ -18,22 +33,20 @@

return _possibleConstructorReturn(this, (TabBarTabsNode.__proto__ || Object.getPrototypeOf(TabBarTabsNode)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabBarTabsNode).apply(this, arguments));
}
_createClass(TabBarTabsNode, [{
key: 'render',
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
var _props = this.props,
children = _props.panels,
activeKey = _props.activeKey,
prefixCls = _props.prefixCls,
tabBarGutter = _props.tabBarGutter,
saveRef = _props.saveRef,
tabBarPosition = _props.tabBarPosition,
renderTabBarNode = _props.renderTabBarNode,
direction = _props.direction;
var _this$props = this.props,
children = _this$props.panels,
activeKey = _this$props.activeKey,
prefixCls = _this$props.prefixCls,
tabBarGutter = _this$props.tabBarGutter,
saveRef = _this$props.saveRef,
tabBarPosition = _this$props.tabBarPosition,
renderTabBarNode = _this$props.renderTabBarNode,
direction = _this$props.direction;
var rst = [];
React.Children.forEach(children, function (child, index) {

@@ -43,14 +56,18 @@ if (!child) {

}
var key = child.key;
var cls = activeKey === key ? prefixCls + '-tab-active' : '';
cls += ' ' + prefixCls + '-tab';
var cls = activeKey === key ? "".concat(prefixCls, "-tab-active") : '';
cls += " ".concat(prefixCls, "-tab");
var events = {};
if (child.props.disabled) {
cls += ' ' + prefixCls + '-tab-disabled';
cls += " ".concat(prefixCls, "-tab-disabled");
} else {
events = {
onClick: _this2.props.onTabClick.bind(_this2, key)
onClick: _this.props.onTabClick.bind(_this, key)
};
}
var ref = {};
if (activeKey === key) {

@@ -61,21 +78,21 @@ ref.ref = saveRef('activeTab');

var gutter = tabBarGutter && index === children.length - 1 ? 0 : tabBarGutter;
var marginProperty = direction === 'rtl' ? 'marginLeft' : 'marginRight';
var marginProperty = direction === 'rtl' ? 'marginLeft' : 'marginRight';
var style = _defineProperty({}, isVertical(tabBarPosition) ? 'marginBottom' : marginProperty, gutter);
warning('tab' in child.props, 'There must be `tab` property on children of Tabs.');
var id = _this.props.id ? "".concat(key, "-").concat(_this.props.id) : key;
var node = React.createElement("div", _extends({
role: "tab",
"aria-disabled": child.props.disabled ? 'true' : 'false',
"aria-selected": activeKey === key ? 'true' : 'false',
tabIndex: activeKey === key ? 0 : -1
}, events, {
className: cls,
key: key,
style: style,
id: "tab-".concat(id),
"aria-controls": "tabpane-".concat(id)
}, ref), child.props.tab);
var node = React.createElement(
'div',
_extends({
role: 'tab',
'aria-disabled': child.props.disabled ? 'true' : 'false',
'aria-selected': activeKey === key ? 'true' : 'false'
}, events, {
className: cls,
key: key,
style: style
}, ref),
child.props.tab
);
if (renderTabBarNode) {

@@ -87,8 +104,5 @@ node = renderTabBarNode(node);

});
return React.createElement(
'div',
{ ref: saveRef('navTabsContainer') },
rst
);
return React.createElement("div", {
ref: saveRef('navTabsContainer')
}, rst);
}

@@ -100,17 +114,3 @@ }]);

export default TabBarTabsNode;
TabBarTabsNode.propTypes = {
activeKey: PropTypes.string,
panels: PropTypes.node,
prefixCls: PropTypes.string,
tabBarGutter: PropTypes.number,
onTabClick: PropTypes.func,
saveRef: PropTypes.func,
renderTabBarNode: PropTypes.func,
tabBarPosition: PropTypes.string,
direction: PropTypes.string
};
export { TabBarTabsNode as default };
TabBarTabsNode.defaultProps = {

@@ -117,0 +117,0 @@ panels: [],

82

es/TabContent.js

@@ -1,13 +0,30 @@

import _extends from 'babel-runtime/helpers/extends';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { getTransformByIndex, getActiveIndex, getTransformPropValue, getMarginStyle } from './utils';
var TabContent = function (_React$Component) {
var TabContent = /*#__PURE__*/function (_React$Component) {
_inherits(TabContent, _React$Component);

@@ -18,7 +35,7 @@

return _possibleConstructorReturn(this, (TabContent.__proto__ || Object.getPrototypeOf(TabContent)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabContent).apply(this, arguments));
}
_createClass(TabContent, [{
key: 'getTabPanes',
key: "getTabPanes",
value: function getTabPanes() {

@@ -29,3 +46,2 @@ var props = this.props;

var newChildren = [];
React.Children.forEach(children, function (child) {

@@ -35,2 +51,3 @@ if (!child) {

}
var key = child.key;

@@ -41,10 +58,10 @@ var active = activeKey === key;

destroyInactiveTabPane: props.destroyInactiveTabPane,
rootPrefixCls: props.prefixCls
rootPrefixCls: props.prefixCls,
id: props.id
}));
});
return newChildren;
}
}, {
key: 'render',
key: "render",
value: function render() {

@@ -63,11 +80,12 @@ var _classnames;

var style = props.style;
var classes = classnames((_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-content"), true), _defineProperty(_classnames, animated ? "".concat(prefixCls, "-content-animated") : "".concat(prefixCls, "-content-no-animated"), true), _classnames), className);
var classes = classnames((_classnames = {}, _defineProperty(_classnames, prefixCls + '-content', true), _defineProperty(_classnames, animated ? prefixCls + '-content-animated' : prefixCls + '-content-no-animated', true), _classnames), className);
if (animated) {
var activeIndex = getActiveIndex(children, activeKey);
if (activeIndex !== -1) {
var animatedStyle = animatedWithMargin ? getMarginStyle(activeIndex, tabBarPosition, direction) : getTransformPropValue(getTransformByIndex(activeIndex, tabBarPosition, direction));
style = _extends({}, style, animatedStyle);
style = _objectSpread({}, style, {}, animatedStyle);
} else {
style = _extends({}, style, {
style = _objectSpread({}, style, {
display: 'none'

@@ -77,10 +95,7 @@ });

}
return React.createElement(
'div',
{
className: classes,
style: style
},
this.getTabPanes()
);
return React.createElement("div", {
className: classes,
style: style
}, this.getTabPanes());
}

@@ -92,20 +107,5 @@ }]);

export default TabContent;
TabContent.propTypes = {
animated: PropTypes.bool,
animatedWithMargin: PropTypes.bool,
prefixCls: PropTypes.string,
children: PropTypes.node,
activeKey: PropTypes.string,
style: PropTypes.any,
tabBarPosition: PropTypes.string,
className: PropTypes.string,
destroyInactiveTabPane: PropTypes.bool,
direction: PropTypes.string
};
export { TabContent as default };
TabContent.defaultProps = {
animated: true
};

140

es/TabPane.js

@@ -1,15 +0,36 @@

import _extends from 'babel-runtime/helpers/extends';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { getDataAttr } from './utils';
import Sentinel, { SentinelConsumer } from './Sentinel';
var TabPane = function (_React$Component) {
var TabPane = /*#__PURE__*/function (_React$Component) {
_inherits(TabPane, _React$Component);

@@ -20,66 +41,41 @@

return _possibleConstructorReturn(this, (TabPane.__proto__ || Object.getPrototypeOf(TabPane)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabPane).apply(this, arguments));
}
_createClass(TabPane, [{
key: 'render',
key: "render",
value: function render() {
var _classnames;
var _props = this.props,
id = _props.id,
className = _props.className,
destroyInactiveTabPane = _props.destroyInactiveTabPane,
active = _props.active,
forceRender = _props.forceRender,
rootPrefixCls = _props.rootPrefixCls,
style = _props.style,
children = _props.children,
placeholder = _props.placeholder,
restProps = _objectWithoutProperties(_props, ['id', 'className', 'destroyInactiveTabPane', 'active', 'forceRender', 'rootPrefixCls', 'style', 'children', 'placeholder']);
var _this$props = this.props,
id = _this$props.id,
className = _this$props.className,
destroyInactiveTabPane = _this$props.destroyInactiveTabPane,
active = _this$props.active,
forceRender = _this$props.forceRender,
rootPrefixCls = _this$props.rootPrefixCls,
style = _this$props.style,
children = _this$props.children,
placeholder = _this$props.placeholder,
tabKey = _this$props.tabKey,
restProps = _objectWithoutProperties(_this$props, ["id", "className", "destroyInactiveTabPane", "active", "forceRender", "rootPrefixCls", "style", "children", "placeholder", "tabKey"]);
this._isActived = this._isActived || active;
var prefixCls = rootPrefixCls + '-tabpane';
var cls = classnames((_classnames = {}, _defineProperty(_classnames, prefixCls, 1), _defineProperty(_classnames, prefixCls + '-inactive', !active), _defineProperty(_classnames, prefixCls + '-active', active), _defineProperty(_classnames, className, className), _classnames));
var prefixCls = "".concat(rootPrefixCls, "-tabpane");
var cls = classnames((_classnames = {}, _defineProperty(_classnames, prefixCls, 1), _defineProperty(_classnames, "".concat(prefixCls, "-inactive"), !active), _defineProperty(_classnames, "".concat(prefixCls, "-active"), active), _defineProperty(_classnames, className, className), _classnames));
var isRender = destroyInactiveTabPane ? active : this._isActived;
var shouldRender = isRender || forceRender;
return React.createElement(
SentinelConsumer,
null,
function (_ref) {
var sentinelStart = _ref.sentinelStart,
sentinelEnd = _ref.sentinelEnd,
setPanelSentinelStart = _ref.setPanelSentinelStart,
setPanelSentinelEnd = _ref.setPanelSentinelEnd;
// Create sentinel
var panelSentinelStart = void 0;
var panelSentinelEnd = void 0;
if (active && shouldRender) {
panelSentinelStart = React.createElement(Sentinel, {
setRef: setPanelSentinelStart,
prevElement: sentinelStart
});
panelSentinelEnd = React.createElement(Sentinel, {
setRef: setPanelSentinelEnd,
nextElement: sentinelEnd
});
}
return React.createElement(
'div',
_extends({
style: style,
role: 'tabpanel',
'aria-hidden': active ? 'false' : 'true',
className: cls,
id: id
}, getDataAttr(restProps)),
panelSentinelStart,
shouldRender ? children : placeholder,
panelSentinelEnd
);
}
);
var tabKeyExists = tabKey && String(tabKey).length > 0;
var uuid = tabKeyExists && (id ? "".concat(tabKey, "-").concat(id) : "".concat(tabKey));
return React.createElement("div", _extends({
style: _objectSpread({}, style, {
visibility: active ? 'visible' : 'hidden'
}),
role: "tabpanel",
"aria-hidden": active ? 'false' : 'true',
tabIndex: active ? 0 : -1,
className: cls,
id: uuid && "tabpane-".concat(uuid),
"aria-labelledby": uuid && "tab-".concat(uuid)
}, getDataAttr(restProps)), shouldRender ? children : placeholder);
}

@@ -91,19 +87,5 @@ }]);

export default TabPane;
TabPane.propTypes = {
className: PropTypes.string,
active: PropTypes.bool,
style: PropTypes.any,
destroyInactiveTabPane: PropTypes.bool,
forceRender: PropTypes.bool,
placeholder: PropTypes.node,
rootPrefixCls: PropTypes.string,
children: PropTypes.node,
id: PropTypes.string
};
export { TabPane as default };
TabPane.defaultProps = {
placeholder: null
};

330

es/Tabs.js

@@ -1,16 +0,32 @@

import _extends from 'babel-runtime/helpers/extends';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import raf from 'raf';
import KeyCode from './KeyCode';
import TabPane from './TabPane';
import { getDataAttr } from './utils';
import Sentinel, { SentinelProvider } from './Sentinel';

@@ -20,3 +36,3 @@ function noop() {}

function getDefaultActiveKey(props) {
var activeKey = void 0;
var activeKey;
React.Children.forEach(props.children, function (child) {

@@ -37,23 +53,103 @@ if (child && !activeKey && !child.props.disabled) {

var Tabs = function (_React$Component) {
var Tabs = /*#__PURE__*/function (_React$Component) {
_inherits(Tabs, _React$Component);
function Tabs(props) {
var _this;
_classCallCheck(this, Tabs);
var _this = _possibleConstructorReturn(this, (Tabs.__proto__ || Object.getPrototypeOf(Tabs)).call(this, props));
_this = _possibleConstructorReturn(this, _getPrototypeOf(Tabs).call(this, props));
_initialiseProps.call(_this);
_this.onTabClick = function (activeKey, e) {
if (_this.tabBar.props.onTabClick) {
_this.tabBar.props.onTabClick(activeKey, e);
}
var activeKey = void 0;
_this.setActiveKey(activeKey);
};
_this.onNavKeyDown = function (e) {
var keyboard = _this.props.keyboard;
if (!keyboard) {
return;
}
var eventKeyCode = e.keyCode;
if (eventKeyCode === KeyCode.RIGHT || eventKeyCode === KeyCode.DOWN) {
e.preventDefault();
var nextKey = _this.getNextActiveKey(true);
_this.onTabClick(nextKey);
} else if (eventKeyCode === KeyCode.LEFT || eventKeyCode === KeyCode.UP) {
e.preventDefault();
var previousKey = _this.getNextActiveKey(false);
_this.onTabClick(previousKey);
}
};
_this.onScroll = function (_ref) {
var target = _ref.target,
currentTarget = _ref.currentTarget;
if (target === currentTarget && target.scrollLeft > 0) {
target.scrollLeft = 0;
}
};
_this.setActiveKey = function (activeKey) {
if (_this.state.activeKey !== activeKey) {
if (!('activeKey' in _this.props)) {
_this.setState({
activeKey: activeKey
});
}
_this.props.onChange(activeKey);
}
};
_this.getNextActiveKey = function (next) {
var activeKey = _this.state.activeKey;
var children = [];
React.Children.forEach(_this.props.children, function (c) {
if (c && !c.props.disabled) {
if (next) {
children.push(c);
} else {
children.unshift(c);
}
}
});
var length = children.length;
var ret = length && children[0].key;
children.forEach(function (child, i) {
if (child.key === activeKey) {
if (i === length - 1) {
ret = children[0].key;
} else {
ret = children[i + 1].key;
}
}
});
return ret;
};
var _activeKey;
if ('activeKey' in props) {
activeKey = props.activeKey;
_activeKey = props.activeKey;
} else if ('defaultActiveKey' in props) {
activeKey = props.defaultActiveKey;
_activeKey = props.defaultActiveKey;
} else {
activeKey = getDefaultActiveKey(props);
_activeKey = getDefaultActiveKey(props);
}
_this.state = {
activeKey: activeKey
activeKey: _activeKey
};

@@ -64,25 +160,8 @@ return _this;

_createClass(Tabs, [{
key: 'componentWillUnmount',
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.destroy = true;
raf.cancel(this.sentinelId);
}
// Sentinel for tab index
}, {
key: 'updateSentinelContext',
value: function updateSentinelContext() {
var _this2 = this;
if (this.destroy) return;
raf.cancel(this.sentinelId);
this.sentinelId = raf(function () {
if (_this2.destroy) return;
_this2.forceUpdate();
});
}
}, {
key: 'render',
key: "render",
value: function render() {

@@ -101,8 +180,7 @@ var _classnames;

direction = props.direction,
restProps = _objectWithoutProperties(props, ['prefixCls', 'navWrapper', 'tabBarPosition', 'className', 'renderTabContent', 'renderTabBar', 'destroyInactiveTabPane', 'direction']);
id = props.id,
restProps = _objectWithoutProperties(props, ["prefixCls", "navWrapper", "tabBarPosition", "className", "renderTabContent", "renderTabBar", "destroyInactiveTabPane", "direction", "id"]);
var cls = classnames((_classnames = {}, _defineProperty(_classnames, prefixCls, 1), _defineProperty(_classnames, prefixCls + '-' + tabBarPosition, 1), _defineProperty(_classnames, className, !!className), _defineProperty(_classnames, prefixCls + '-rtl', direction === 'rtl'), _classnames));
var cls = classnames((_classnames = {}, _defineProperty(_classnames, prefixCls, 1), _defineProperty(_classnames, "".concat(prefixCls, "-").concat(tabBarPosition), 1), _defineProperty(_classnames, className, !!className), _defineProperty(_classnames, "".concat(prefixCls, "-rtl"), direction === 'rtl'), _classnames));
this.tabBar = renderTabBar();
var tabBar = React.cloneElement(this.tabBar, {

@@ -117,5 +195,5 @@ prefixCls: prefixCls,

activeKey: this.state.activeKey,
direction: this.props.direction
direction: this.props.direction,
id: id
});
var tabContent = React.cloneElement(renderTabContent(), {

@@ -129,49 +207,26 @@ prefixCls: prefixCls,

key: 'tabContent',
direction: this.props.direction
direction: this.props.direction,
id: id
});
var contents = [];
var sentinelStart = React.createElement(Sentinel, {
key: 'sentinelStart',
setRef: this.setSentinelStart,
nextElement: this.panelSentinelStart
});
var sentinelEnd = React.createElement(Sentinel, {
key: 'sentinelEnd',
setRef: this.setSentinelEnd,
prevElement: this.panelSentinelEnd
});
var contents = [];
if (tabBarPosition === 'bottom') {
contents.push(sentinelStart, tabContent, sentinelEnd, tabBar);
contents.push(tabContent, tabBar);
} else {
contents.push(tabBar, sentinelStart, tabContent, sentinelEnd);
contents.push(tabBar, tabContent);
}
return React.createElement(
SentinelProvider,
{
value: {
sentinelStart: this.sentinelStart,
sentinelEnd: this.sentinelEnd,
setPanelSentinelStart: this.setPanelSentinelStart,
setPanelSentinelEnd: this.setPanelSentinelEnd
}
},
React.createElement(
'div',
_extends({
className: cls,
style: props.style
}, getDataAttr(restProps), {
onScroll: this.onScroll
}),
contents
)
);
return React.createElement("div", _extends({
className: cls,
style: props.style
}, getDataAttr(restProps), {
onScroll: this.onScroll,
id: id
}), contents);
}
}], [{
key: 'getDerivedStateFromProps',
key: "getDerivedStateFromProps",
value: function getDerivedStateFromProps(props, state) {
var newState = {};
if ('activeKey' in props) {

@@ -182,5 +237,7 @@ newState.activeKey = props.activeKey;

}
if (Object.keys(newState).length > 0) {
return newState;
}
return null;

@@ -193,110 +250,2 @@ }

var _initialiseProps = function _initialiseProps() {
var _this3 = this;
this.onTabClick = function (activeKey, e) {
if (_this3.tabBar.props.onTabClick) {
_this3.tabBar.props.onTabClick(activeKey, e);
}
_this3.setActiveKey(activeKey);
};
this.onNavKeyDown = function (e) {
var eventKeyCode = e.keyCode;
if (eventKeyCode === KeyCode.RIGHT || eventKeyCode === KeyCode.DOWN) {
e.preventDefault();
var nextKey = _this3.getNextActiveKey(true);
_this3.onTabClick(nextKey);
} else if (eventKeyCode === KeyCode.LEFT || eventKeyCode === KeyCode.UP) {
e.preventDefault();
var previousKey = _this3.getNextActiveKey(false);
_this3.onTabClick(previousKey);
}
};
this.onScroll = function (_ref) {
var target = _ref.target,
currentTarget = _ref.currentTarget;
if (target === currentTarget && target.scrollLeft > 0) {
target.scrollLeft = 0;
}
};
this.setSentinelStart = function (node) {
_this3.sentinelStart = node;
};
this.setSentinelEnd = function (node) {
_this3.sentinelEnd = node;
};
this.setPanelSentinelStart = function (node) {
if (node !== _this3.panelSentinelStart) {
_this3.updateSentinelContext();
}
_this3.panelSentinelStart = node;
};
this.setPanelSentinelEnd = function (node) {
if (node !== _this3.panelSentinelEnd) {
_this3.updateSentinelContext();
}
_this3.panelSentinelEnd = node;
};
this.setActiveKey = function (activeKey) {
if (_this3.state.activeKey !== activeKey) {
if (!('activeKey' in _this3.props)) {
_this3.setState({
activeKey: activeKey
});
}
_this3.props.onChange(activeKey);
}
};
this.getNextActiveKey = function (next) {
var activeKey = _this3.state.activeKey;
var children = [];
React.Children.forEach(_this3.props.children, function (c) {
if (c && !c.props.disabled) {
if (next) {
children.push(c);
} else {
children.unshift(c);
}
}
});
var length = children.length;
var ret = length && children[0].key;
children.forEach(function (child, i) {
if (child.key === activeKey) {
if (i === length - 1) {
ret = children[0].key;
} else {
ret = children[i + 1].key;
}
}
});
return ret;
};
};
Tabs.propTypes = {
destroyInactiveTabPane: PropTypes.bool,
renderTabBar: PropTypes.func.isRequired,
renderTabContent: PropTypes.func.isRequired,
navWrapper: PropTypes.func,
onChange: PropTypes.func,
children: PropTypes.node,
prefixCls: PropTypes.string,
className: PropTypes.string,
tabBarPosition: PropTypes.string,
style: PropTypes.object,
activeKey: PropTypes.string,
defaultActiveKey: PropTypes.string,
direction: PropTypes.string
};
Tabs.defaultProps = {

@@ -306,2 +255,3 @@ prefixCls: 'rc-tabs',

onChange: noop,
keyboard: true,
navWrapper: function navWrapper(arg) {

@@ -315,5 +265,3 @@ return arg;

};
Tabs.TabPane = TabPane;
export default Tabs;

55

es/utils.js

@@ -1,4 +0,4 @@

import _defineProperty from 'babel-runtime/helpers/defineProperty';
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
import React from 'react';
export function toArray(children) {

@@ -14,5 +14,5 @@ // allow [c,[a,b]]

}
export function getActiveIndex(children, activeKey) {
var c = toArray(children);
for (var i = 0; i < c.length; i++) {

@@ -23,5 +23,5 @@ if (c[i].key === activeKey) {

}
return -1;
}
export function getActiveKey(children, index) {

@@ -31,3 +31,2 @@ var c = toArray(children);

}
export function setTransform(style, v) {

@@ -38,7 +37,5 @@ style.transform = v;

}
export function isTransform3dSupported(style) {
return ('transform' in style || 'webkitTransform' in style || 'MozTransform' in style) && window.atob;
}
export function setTransition(style, v) {

@@ -49,3 +46,2 @@ style.transition = v;

}
export function getTransformPropValue(v) {

@@ -58,38 +54,32 @@ return {

}
export function isVertical(tabBarPosition) {
return tabBarPosition === 'left' || tabBarPosition === 'right';
}
export function getTransformByIndex(index, tabBarPosition) {
var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'ltr';
var translate = isVertical(tabBarPosition) ? 'translateY' : 'translateX';
if (!isVertical(tabBarPosition) && direction === 'rtl') {
return translate + '(' + index * 100 + '%) translateZ(0)';
return "".concat(translate, "(").concat(index * 100, "%) translateZ(0)");
}
return translate + '(' + -index * 100 + '%) translateZ(0)';
return "".concat(translate, "(").concat(-index * 100, "%) translateZ(0)");
}
export function getMarginStyle(index, tabBarPosition) {
var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'ltr';
var marginDirection = isVertical(tabBarPosition) ? 'marginTop' : 'marginLeft';
if (!isVertical(tabBarPosition) && direction === 'rtl') {
return _defineProperty({}, marginDirection, (index + 1) * 100 + '%');
return _defineProperty({}, marginDirection, "".concat((index + 1) * 100, "%"));
}
return _defineProperty({}, marginDirection, -index * 100 + '%');
return _defineProperty({}, marginDirection, "".concat(-index * 100, "%"));
}
export function getStyle(el, property) {
return +window.getComputedStyle(el).getPropertyValue(property).replace('px', '');
}
export function setPxStyle(el, value, vertical) {
value = vertical ? '0px, ' + value + 'px, 0px' : value + 'px, 0px, 0px';
setTransform(el.style, 'translate3d(' + value + ')');
value = vertical ? "0px, ".concat(value, "px, 0px") : "".concat(value, "px, 0px, 0px");
setTransform(el.style, "translate3d(".concat(value, ")"));
}
export function getDataAttr(props) {

@@ -100,2 +90,3 @@ return Object.keys(props).reduce(function (prev, key) {

}
return prev;

@@ -110,3 +101,4 @@ }, {});

function getTypeValue(start, current, end, tabNode, wrapperNode) {
var total = getStyle(wrapperNode, 'padding-' + start);
var total = getStyle(wrapperNode, "padding-".concat(start));
if (!tabNode || !tabNode.parentNode) {

@@ -117,3 +109,2 @@ return total;

var childNodes = tabNode.parentNode.childNodes;
Array.prototype.some.call(childNodes, function (node) {

@@ -123,19 +114,18 @@ var style = window.getComputedStyle(node);

if (node !== tabNode) {
total += toNum(style, 'margin-' + start);
total += toNum(style, "margin-".concat(start));
total += node[current];
total += toNum(style, 'margin-' + end);
total += toNum(style, "margin-".concat(end));
if (style.boxSizing === 'content-box') {
total += toNum(style, 'border-' + start + '-width') + toNum(style, 'border-' + end + '-width');
total += toNum(style, "border-".concat(start, "-width")) + toNum(style, "border-".concat(end, "-width"));
}
return false;
}
// We need count current node margin
} // We need count current node margin
// ref: https://github.com/react-component/tabs/pull/139#issuecomment-431005262
total += toNum(style, 'margin-' + start);
total += toNum(style, "margin-".concat(start));
return true;
});
return total;

@@ -147,5 +137,4 @@ }

}
export function getTop(tabNode, wrapperNode) {
return getTypeValue('top', 'offsetHeight', 'bottom', tabNode, wrapperNode);
}

6

HISTORY.md
# History
----
## 10.1.0 / 2020-03-17
* Add `keyboard` prop.
* `extraContent` don't trigger keyboard navigate now.
* Remove `prop-types` and clean up dependencies.
## 9.6.0 / 2019-01-16

@@ -5,0 +11,0 @@

35

lib/index.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,20 +6,25 @@ Object.defineProperty(exports, "__esModule", {

});
exports.TabContent = exports.TabPane = undefined;
Object.defineProperty(exports, "TabPane", {
enumerable: true,
get: function get() {
return _TabPane.default;
}
});
Object.defineProperty(exports, "TabContent", {
enumerable: true,
get: function get() {
return _TabContent.default;
}
});
exports.default = void 0;
var _Tabs = require('./Tabs');
var _Tabs = _interopRequireDefault(require("./Tabs"));
var _Tabs2 = _interopRequireDefault(_Tabs);
var _TabPane = _interopRequireDefault(require("./TabPane"));
var _TabPane = require('./TabPane');
var _TabContent = _interopRequireDefault(require("./TabContent"));
var _TabPane2 = _interopRequireDefault(_TabPane);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _TabContent = require('./TabContent');
var _TabContent2 = _interopRequireDefault(_TabContent);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
exports['default'] = _Tabs2['default'];
exports.TabPane = _TabPane2['default'];
exports.TabContent = _TabContent2['default'];
var _default = _Tabs.default;
exports.default = _default;

103

lib/InkTabBar.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,90 +6,71 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _InkTabBarNode = _interopRequireDefault(require("./InkTabBarNode"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _TabBarTabsNode = _interopRequireDefault(require("./TabBarTabsNode"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _TabBarRootNode = _interopRequireDefault(require("./TabBarRootNode"));
var _createClass2 = require('babel-runtime/helpers/createClass');
var _SaveRef = _interopRequireDefault(require("./SaveRef"));
var _createClass3 = _interopRequireDefault(_createClass2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _inherits3 = _interopRequireDefault(_inherits2);
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _react = require('react');
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _react2 = _interopRequireDefault(_react);
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _propTypes = require('prop-types');
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _InkTabBarNode = require('./InkTabBarNode');
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _InkTabBarNode2 = _interopRequireDefault(_InkTabBarNode);
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _TabBarTabsNode = require('./TabBarTabsNode');
var InkTabBar = /*#__PURE__*/function (_React$Component) {
_inherits(InkTabBar, _React$Component);
var _TabBarTabsNode2 = _interopRequireDefault(_TabBarTabsNode);
function InkTabBar() {
_classCallCheck(this, InkTabBar);
var _TabBarRootNode = require('./TabBarRootNode');
var _TabBarRootNode2 = _interopRequireDefault(_TabBarRootNode);
var _SaveRef = require('./SaveRef');
var _SaveRef2 = _interopRequireDefault(_SaveRef);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
/* eslint-disable react/prefer-stateless-function */
var InkTabBar = function (_React$Component) {
(0, _inherits3['default'])(InkTabBar, _React$Component);
function InkTabBar() {
(0, _classCallCheck3['default'])(this, InkTabBar);
return (0, _possibleConstructorReturn3['default'])(this, (InkTabBar.__proto__ || Object.getPrototypeOf(InkTabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(InkTabBar).apply(this, arguments));
}
(0, _createClass3['default'])(InkTabBar, [{
key: 'render',
_createClass(InkTabBar, [{
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
return _react2['default'].createElement(
_SaveRef2['default'],
null,
function (saveRef, getRef) {
return _react2['default'].createElement(
_TabBarRootNode2['default'],
(0, _extends3['default'])({ saveRef: saveRef }, _this2.props),
_react2['default'].createElement(_TabBarTabsNode2['default'], (0, _extends3['default'])({ onTabClick: _this2.props.onTabClick, saveRef: saveRef }, _this2.props)),
_react2['default'].createElement(_InkTabBarNode2['default'], (0, _extends3['default'])({ saveRef: saveRef, getRef: getRef }, _this2.props))
);
}
);
return _react.default.createElement(_SaveRef.default, null, function (saveRef, getRef) {
return _react.default.createElement(_TabBarRootNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), _react.default.createElement(_TabBarTabsNode.default, _extends({
onTabClick: _this.props.onTabClick,
saveRef: saveRef
}, _this.props)), _react.default.createElement(_InkTabBarNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props)));
});
}
}]);
return InkTabBar;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = InkTabBar;
InkTabBar.propTypes = {
onTabClick: _propTypes2['default'].func
};
exports.default = InkTabBar;
InkTabBar.defaultProps = {
onTabClick: function onTabClick() {}
};
module.exports = exports['default'];
};

133

lib/InkTabBarNode.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,39 +6,32 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _react = _interopRequireDefault(require("react"));
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
var _classnames2 = _interopRequireDefault(require("classnames"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _utils = require("./utils");
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _createClass2 = require('babel-runtime/helpers/createClass');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _createClass3 = _interopRequireDefault(_createClass2);
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _inherits3 = _interopRequireDefault(_inherits2);
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _react = require('react');
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _react2 = _interopRequireDefault(_react);
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _propTypes = require('prop-types');
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _classnames2 = require('classnames');
var _classnames3 = _interopRequireDefault(_classnames2);
var _utils = require('./utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
function _componentDidUpdate(component, init) {

@@ -50,3 +43,2 @@ var _component$props = component.props,

direction = _component$props.direction;
var rootNode = component.props.getRef('root');

@@ -59,2 +51,3 @@ var wrapNode = component.props.getRef('nav') || rootNode;

var activeIndex = (0, _utils.getActiveIndex)(panels, activeKey);
if (init) {

@@ -64,7 +57,7 @@ // prevent mount animation

}
if (activeTab) {
var tabNode = activeTab;
var transformSupported = (0, _utils.isTransform3dSupported)(inkBarNodeStyle);
var transformSupported = (0, _utils.isTransform3dSupported)(inkBarNodeStyle); // Reset current style
// Reset current style
(0, _utils.setTransform)(inkBarNodeStyle, '');

@@ -80,7 +73,6 @@ inkBarNodeStyle.width = '';

var left = (0, _utils.getLeft)(tabNode, wrapNode);
var width = tabNode.offsetWidth;
// If tabNode'width width equal to wrapNode'width when tabBarPosition is top or bottom
var width = tabNode.offsetWidth; // If tabNode'width width equal to wrapNode'width when tabBarPosition is top or bottom
// It means no css working, then ink bar should not have width until css is loaded
// Fix https://github.com/ant-design/ant-design/issues/7564
if (width === rootNode.offsetWidth) {

@@ -90,2 +82,3 @@ width = 0;

width = parseFloat(styles.inkBar.width, 10);
if (width) {

@@ -95,17 +88,22 @@ left += (tabNode.offsetWidth - width) / 2;

}
if (direction === 'rtl') {
left = (0, _utils.getStyle)(tabNode, 'margin-left') - left;
}
// use 3d gpu to optimize render
} // use 3d gpu to optimize render
if (transformSupported) {
(0, _utils.setTransform)(inkBarNodeStyle, 'translate3d(' + left + 'px,0,0)');
(0, _utils.setTransform)(inkBarNodeStyle, "translate3d(".concat(left, "px,0,0)"));
} else {
inkBarNodeStyle.left = left + 'px';
inkBarNodeStyle.left = "".concat(left, "px");
}
inkBarNodeStyle.width = width + 'px';
inkBarNodeStyle.width = "".concat(width, "px");
} else {
var top = (0, _utils.getTop)(tabNode, wrapNode, true);
var height = tabNode.offsetHeight;
if (styles.inkBar && styles.inkBar.height !== undefined) {
height = parseFloat(styles.inkBar.height, 10);
if (height) {

@@ -115,26 +113,30 @@ top += (tabNode.offsetHeight - height) / 2;

}
if (transformSupported) {
(0, _utils.setTransform)(inkBarNodeStyle, 'translate3d(0,' + top + 'px,0)');
(0, _utils.setTransform)(inkBarNodeStyle, "translate3d(0,".concat(top, "px,0)"));
inkBarNodeStyle.top = '0';
} else {
inkBarNodeStyle.top = top + 'px';
inkBarNodeStyle.top = "".concat(top, "px");
}
inkBarNodeStyle.height = height + 'px';
inkBarNodeStyle.height = "".concat(height, "px");
}
}
inkBarNodeStyle.display = activeIndex !== -1 ? 'block' : 'none';
}
var InkTabBarNode = function (_React$Component) {
(0, _inherits3['default'])(InkTabBarNode, _React$Component);
var InkTabBarNode = /*#__PURE__*/function (_React$Component) {
_inherits(InkTabBarNode, _React$Component);
function InkTabBarNode() {
(0, _classCallCheck3['default'])(this, InkTabBarNode);
return (0, _possibleConstructorReturn3['default'])(this, (InkTabBarNode.__proto__ || Object.getPrototypeOf(InkTabBarNode)).apply(this, arguments));
_classCallCheck(this, InkTabBarNode);
return _possibleConstructorReturn(this, _getPrototypeOf(InkTabBarNode).apply(this, arguments));
}
(0, _createClass3['default'])(InkTabBarNode, [{
key: 'componentDidMount',
_createClass(InkTabBarNode, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
var _this = this;

@@ -148,7 +150,7 @@ // ref https://github.com/ant-design/ant-design/issues/8678

this.timeout = setTimeout(function () {
_componentDidUpdate(_this2, true);
_componentDidUpdate(_this, true);
}, 0);
}
}, {
key: 'componentDidUpdate',
key: "componentDidUpdate",
value: function componentDidUpdate() {

@@ -158,3 +160,3 @@ _componentDidUpdate(this);

}, {
key: 'componentWillUnmount',
key: "componentWillUnmount",
value: function componentWillUnmount() {

@@ -164,17 +166,16 @@ clearTimeout(this.timeout);

}, {
key: 'render',
key: "render",
value: function render() {
var _classnames;
var _props = this.props,
prefixCls = _props.prefixCls,
styles = _props.styles,
inkBarAnimated = _props.inkBarAnimated;
var className = prefixCls + '-ink-bar';
var classes = (0, _classnames3['default'])((_classnames = {}, (0, _defineProperty3['default'])(_classnames, className, true), (0, _defineProperty3['default'])(_classnames, inkBarAnimated ? className + '-animated' : className + '-no-animated', true), _classnames));
return _react2['default'].createElement('div', {
var _this$props = this.props,
prefixCls = _this$props.prefixCls,
styles = _this$props.styles,
inkBarAnimated = _this$props.inkBarAnimated;
var className = "".concat(prefixCls, "-ink-bar");
var classes = (0, _classnames2.default)((_classnames = {}, _defineProperty(_classnames, className, true), _defineProperty(_classnames, inkBarAnimated ? "".concat(className, "-animated") : "".concat(className, "-no-animated"), true), _classnames));
return _react.default.createElement("div", {
style: styles.inkBar,
className: classes,
key: 'inkBar',
key: "inkBar",
ref: this.props.saveRef('inkBar')

@@ -184,16 +185,7 @@ });

}]);
return InkTabBarNode;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = InkTabBarNode;
InkTabBarNode.propTypes = {
prefixCls: _propTypes2['default'].string,
styles: _propTypes2['default'].object,
inkBarAnimated: _propTypes2['default'].bool,
saveRef: _propTypes2['default'].func,
direction: _propTypes2['default'].string
};
exports.default = InkTabBarNode;
InkTabBarNode.defaultProps = {

@@ -204,3 +196,2 @@ prefixCls: '',

saveRef: function saveRef() {}
};
module.exports = exports['default'];
};

18

lib/KeyCode.js

@@ -6,15 +6,22 @@ "use strict";

});
exports["default"] = {
exports.default = void 0;
var _default = {
/**
* LEFT
*/
LEFT: 37, // also NUM_WEST
LEFT: 37,
// also NUM_WEST
/**
* UP
*/
UP: 38, // also NUM_NORTH
UP: 38,
// also NUM_NORTH
/**
* RIGHT
*/
RIGHT: 39, // also NUM_EAST
RIGHT: 39,
// also NUM_EAST
/**

@@ -24,3 +31,4 @@ * DOWN

DOWN: 40 // also NUM_SOUTH
};
module.exports = exports['default'];
exports.default = _default;

71

lib/SaveRef.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,46 +6,47 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _react = _interopRequireDefault(require("react"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _createClass2 = require('babel-runtime/helpers/createClass');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _createClass3 = _interopRequireDefault(_createClass2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _inherits3 = _interopRequireDefault(_inherits2);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _react = require('react');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _react2 = _interopRequireDefault(_react);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _propTypes = require('prop-types');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _propTypes2 = _interopRequireDefault(_propTypes);
var SaveRef = /*#__PURE__*/function (_React$Component) {
_inherits(SaveRef, _React$Component);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var SaveRef = function (_React$Component) {
(0, _inherits3['default'])(SaveRef, _React$Component);
function SaveRef() {
var _ref;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
(0, _classCallCheck3['default'])(this, SaveRef);
_classCallCheck(this, SaveRef);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, (_ref = SaveRef.__proto__ || Object.getPrototypeOf(SaveRef)).call.apply(_ref, [this].concat(args))), _this), _this.getRef = function (name) {
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(SaveRef)).call.apply(_getPrototypeOf2, [this].concat(args)));
_this.getRef = function (name) {
return _this[name];
}, _this.saveRef = function (name) {
};
_this.saveRef = function (name) {
return function (node) {

@@ -56,7 +57,9 @@ if (node) {

};
}, _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
};
return _this;
}
(0, _createClass3['default'])(SaveRef, [{
key: 'render',
_createClass(SaveRef, [{
key: "render",
value: function render() {

@@ -66,12 +69,7 @@ return this.props.children(this.saveRef, this.getRef);

}]);
return SaveRef;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = SaveRef;
SaveRef.propTypes = {
children: _propTypes2['default'].func
};
exports.default = SaveRef;
SaveRef.defaultProps = {

@@ -81,3 +79,2 @@ children: function children() {

}
};
module.exports = exports['default'];
};

120

lib/ScrollableInkTabBar.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,101 +6,79 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _InkTabBarNode = _interopRequireDefault(require("./InkTabBarNode"));
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
var _TabBarTabsNode = _interopRequireDefault(require("./TabBarTabsNode"));
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
var _TabBarRootNode = _interopRequireDefault(require("./TabBarRootNode"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _ScrollableTabBarNode = _interopRequireDefault(require("./ScrollableTabBarNode"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _SaveRef = _interopRequireDefault(require("./SaveRef"));
var _createClass2 = require('babel-runtime/helpers/createClass');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _createClass3 = _interopRequireDefault(_createClass2);
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _inherits3 = _interopRequireDefault(_inherits2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _react = require('react');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _react2 = _interopRequireDefault(_react);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _propTypes = require('prop-types');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _InkTabBarNode = require('./InkTabBarNode');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _InkTabBarNode2 = _interopRequireDefault(_InkTabBarNode);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _TabBarTabsNode = require('./TabBarTabsNode');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _TabBarTabsNode2 = _interopRequireDefault(_TabBarTabsNode);
var ScrollableInkTabBar = /*#__PURE__*/function (_React$Component) {
_inherits(ScrollableInkTabBar, _React$Component);
var _TabBarRootNode = require('./TabBarRootNode');
function ScrollableInkTabBar() {
_classCallCheck(this, ScrollableInkTabBar);
var _TabBarRootNode2 = _interopRequireDefault(_TabBarRootNode);
var _ScrollableTabBarNode = require('./ScrollableTabBarNode');
var _ScrollableTabBarNode2 = _interopRequireDefault(_ScrollableTabBarNode);
var _SaveRef = require('./SaveRef');
var _SaveRef2 = _interopRequireDefault(_SaveRef);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var ScrollableInkTabBar = function (_React$Component) {
(0, _inherits3['default'])(ScrollableInkTabBar, _React$Component);
function ScrollableInkTabBar() {
(0, _classCallCheck3['default'])(this, ScrollableInkTabBar);
return (0, _possibleConstructorReturn3['default'])(this, (ScrollableInkTabBar.__proto__ || Object.getPrototypeOf(ScrollableInkTabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(ScrollableInkTabBar).apply(this, arguments));
}
(0, _createClass3['default'])(ScrollableInkTabBar, [{
key: 'render',
_createClass(ScrollableInkTabBar, [{
key: "render",
value: function render() {
var _props = this.props,
renderTabBarNode = _props.children,
restProps = (0, _objectWithoutProperties3['default'])(_props, ['children']);
var _this$props = this.props,
renderTabBarNode = _this$props.children,
restProps = _objectWithoutProperties(_this$props, ["children"]);
return _react2['default'].createElement(
_SaveRef2['default'],
null,
function (saveRef, getRef) {
return _react2['default'].createElement(
_TabBarRootNode2['default'],
(0, _extends3['default'])({ saveRef: saveRef }, restProps),
_react2['default'].createElement(
_ScrollableTabBarNode2['default'],
(0, _extends3['default'])({ saveRef: saveRef, getRef: getRef }, restProps),
_react2['default'].createElement(_TabBarTabsNode2['default'], (0, _extends3['default'])({ saveRef: saveRef, renderTabBarNode: renderTabBarNode }, restProps)),
_react2['default'].createElement(_InkTabBarNode2['default'], (0, _extends3['default'])({ saveRef: saveRef, getRef: getRef }, restProps))
)
);
}
);
return _react.default.createElement(_SaveRef.default, null, function (saveRef, getRef) {
return _react.default.createElement(_TabBarRootNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, restProps), _react.default.createElement(_ScrollableTabBarNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, restProps), _react.default.createElement(_TabBarTabsNode.default, _extends({
saveRef: saveRef,
renderTabBarNode: renderTabBarNode
}, restProps)), _react.default.createElement(_InkTabBarNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, restProps))));
});
}
}]);
return ScrollableInkTabBar;
}(_react2['default'].Component); /* eslint-disable react/prefer-stateless-function */
}(_react.default.Component);
exports['default'] = ScrollableInkTabBar;
ScrollableInkTabBar.propTypes = {
children: _propTypes2['default'].func
};
module.exports = exports['default'];
exports.default = ScrollableInkTabBar;

93

lib/ScrollableTabBar.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,80 +6,67 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _ScrollableTabBarNode = _interopRequireDefault(require("./ScrollableTabBarNode"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _TabBarRootNode = _interopRequireDefault(require("./TabBarRootNode"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _TabBarTabsNode = _interopRequireDefault(require("./TabBarTabsNode"));
var _createClass2 = require('babel-runtime/helpers/createClass');
var _SaveRef = _interopRequireDefault(require("./SaveRef"));
var _createClass3 = _interopRequireDefault(_createClass2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _inherits3 = _interopRequireDefault(_inherits2);
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _react = require('react');
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _react2 = _interopRequireDefault(_react);
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _ScrollableTabBarNode = require('./ScrollableTabBarNode');
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _ScrollableTabBarNode2 = _interopRequireDefault(_ScrollableTabBarNode);
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _TabBarRootNode = require('./TabBarRootNode');
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _TabBarRootNode2 = _interopRequireDefault(_TabBarRootNode);
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _TabBarTabsNode = require('./TabBarTabsNode');
var ScrollableTabBar = /*#__PURE__*/function (_React$Component) {
_inherits(ScrollableTabBar, _React$Component);
var _TabBarTabsNode2 = _interopRequireDefault(_TabBarTabsNode);
function ScrollableTabBar() {
_classCallCheck(this, ScrollableTabBar);
var _SaveRef = require('./SaveRef');
var _SaveRef2 = _interopRequireDefault(_SaveRef);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var ScrollableTabBar = function (_React$Component) {
(0, _inherits3['default'])(ScrollableTabBar, _React$Component);
function ScrollableTabBar() {
(0, _classCallCheck3['default'])(this, ScrollableTabBar);
return (0, _possibleConstructorReturn3['default'])(this, (ScrollableTabBar.__proto__ || Object.getPrototypeOf(ScrollableTabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(ScrollableTabBar).apply(this, arguments));
}
(0, _createClass3['default'])(ScrollableTabBar, [{
key: 'render',
_createClass(ScrollableTabBar, [{
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
return _react2['default'].createElement(
_SaveRef2['default'],
null,
function (saveRef, getRef) {
return _react2['default'].createElement(
_TabBarRootNode2['default'],
(0, _extends3['default'])({ saveRef: saveRef }, _this2.props),
_react2['default'].createElement(
_ScrollableTabBarNode2['default'],
(0, _extends3['default'])({ saveRef: saveRef, getRef: getRef }, _this2.props),
_react2['default'].createElement(_TabBarTabsNode2['default'], (0, _extends3['default'])({ saveRef: saveRef }, _this2.props))
)
);
}
);
return _react.default.createElement(_SaveRef.default, null, function (saveRef, getRef) {
return _react.default.createElement(_TabBarRootNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), _react.default.createElement(_ScrollableTabBarNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), _react.default.createElement(_TabBarTabsNode.default, _extends({
saveRef: saveRef
}, _this.props))));
});
}
}]);
return ScrollableTabBar;
}(_react2['default'].Component); /* eslint-disable react/prefer-stateless-function */
}(_react.default.Component);
exports['default'] = ScrollableTabBar;
module.exports = exports['default'];
exports.default = ScrollableTabBar;

284

lib/ScrollableTabBarNode.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,55 +6,46 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _react = _interopRequireDefault(require("react"));
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
var _classnames5 = _interopRequireDefault(require("classnames"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _debounce = _interopRequireDefault(require("lodash/debounce"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _resizeObserverPolyfill = _interopRequireDefault(require("resize-observer-polyfill"));
var _createClass2 = require('babel-runtime/helpers/createClass');
var _utils = require("./utils");
var _createClass3 = _interopRequireDefault(_createClass2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _inherits3 = _interopRequireDefault(_inherits2);
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _react = require('react');
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _react2 = _interopRequireDefault(_react);
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _propTypes = require('prop-types');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _classnames5 = require('classnames');
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _classnames6 = _interopRequireDefault(_classnames5);
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _debounce = require('lodash/debounce');
var ScrollableTabBarNode = /*#__PURE__*/function (_React$Component) {
_inherits(ScrollableTabBarNode, _React$Component);
var _debounce2 = _interopRequireDefault(_debounce);
function ScrollableTabBarNode(props) {
var _this;
var _resizeObserverPolyfill = require('resize-observer-polyfill');
_classCallCheck(this, ScrollableTabBarNode);
var _resizeObserverPolyfill2 = _interopRequireDefault(_resizeObserverPolyfill);
_this = _possibleConstructorReturn(this, _getPrototypeOf(ScrollableTabBarNode).call(this, props));
var _utils = require('./utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var ScrollableTabBarNode = function (_React$Component) {
(0, _inherits3['default'])(ScrollableTabBarNode, _React$Component);
function ScrollableTabBarNode(props) {
(0, _classCallCheck3['default'])(this, ScrollableTabBarNode);
var _this = (0, _possibleConstructorReturn3['default'])(this, (ScrollableTabBarNode.__proto__ || Object.getPrototypeOf(ScrollableTabBarNode)).call(this, props));
_this.prevTransitionEnd = function (e) {

@@ -64,3 +55,5 @@ if (e.propertyName !== 'opacity') {

}
var container = _this.props.getRef('container');
_this.scrollToActiveTab({

@@ -74,10 +67,14 @@ target: container,

var activeTab = _this.props.getRef('activeTab');
var navWrap = _this.props.getRef('navWrap');
if (e && e.target !== e.currentTarget || !activeTab) {
return;
}
} // when not scrollable or enter scrollable first time, don't emit scrolling
// when not scrollable or enter scrollable first time, don't emit scrolling
var needToSroll = _this.isNextPrevShown() && _this.lastNextPrevShown;
_this.lastNextPrevShown = _this.isNextPrevShown();
if (!needToSroll) {

@@ -88,12 +85,19 @@ return;

var activeTabWH = _this.getScrollWH(activeTab);
var navWrapNodeWH = _this.getOffsetWH(navWrap);
var offset = _this.offset;
var _assertThisInitialize = _assertThisInitialized(_this),
offset = _assertThisInitialize.offset;
var wrapOffset = _this.getOffsetLT(navWrap);
var activeTabOffset = _this.getOffsetLT(activeTab);
if (wrapOffset > activeTabOffset) {
offset += wrapOffset - activeTabOffset;
_this.setOffset(offset);
} else if (wrapOffset + navWrapNodeWH < activeTabOffset + activeTabWH) {
offset -= activeTabOffset + activeTabWH - (wrapOffset + navWrapNodeWH);
_this.setOffset(offset);

@@ -105,6 +109,10 @@ }

_this.props.onPrevClick(e);
var navWrapNode = _this.props.getRef('navWrap');
var navWrapNodeWH = _this.getOffsetWH(navWrapNode);
var offset = _this.offset;
var _assertThisInitialize2 = _assertThisInitialized(_this),
offset = _assertThisInitialize2.offset;
_this.setOffset(offset + navWrapNodeWH);

@@ -115,6 +123,10 @@ };

_this.props.onNextClick(e);
var navWrapNode = _this.props.getRef('navWrap');
var navWrapNodeWH = _this.getOffsetWH(navWrapNode);
var offset = _this.offset;
var _assertThisInitialize3 = _assertThisInitialized(_this),
offset = _assertThisInitialize3.offset;
_this.setOffset(offset - navWrapNodeWH);

@@ -124,3 +136,2 @@ };

_this.offset = 0;
_this.state = {

@@ -133,4 +144,4 @@ next: false,

(0, _createClass3['default'])(ScrollableTabBarNode, [{
key: 'componentDidMount',
_createClass(ScrollableTabBarNode, [{
key: "componentDidMount",
value: function componentDidMount() {

@@ -140,13 +151,15 @@ var _this2 = this;

this.componentDidUpdate();
this.debouncedResize = (0, _debounce2['default'])(function () {
this.debouncedResize = (0, _debounce.default)(function () {
_this2.setNextPrev();
_this2.scrollToActiveTab();
}, 200);
this.resizeObserver = new _resizeObserverPolyfill2['default'](this.debouncedResize);
this.resizeObserver = new _resizeObserverPolyfill.default(this.debouncedResize);
this.resizeObserver.observe(this.props.getRef('container'));
}
}, {
key: 'componentDidUpdate',
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
var props = this.props;
if (prevProps && prevProps.tabBarPosition !== props.tabBarPosition) {

@@ -156,5 +169,7 @@ this.setOffset(0);

}
var nextPrev = this.setNextPrev();
// wait next, prev show hide
var nextPrev = this.setNextPrev(); // wait next, prev show hide
/* eslint react/no-did-update-set-state:0 */
if (this.isNextPrevShown(this.state) !== this.isNextPrevShown(nextPrev)) {

@@ -168,3 +183,3 @@ this.setState({}, this.scrollToActiveTab);

}, {
key: 'componentWillUnmount',
key: "componentWillUnmount",
value: function componentWillUnmount() {

@@ -174,2 +189,3 @@ if (this.resizeObserver) {

}
if (this.debouncedResize && this.debouncedResize.cancel) {

@@ -180,17 +196,16 @@ this.debouncedResize.cancel();

}, {
key: 'setNextPrev',
key: "setNextPrev",
value: function setNextPrev() {
var navNode = this.props.getRef('nav');
var navTabsContainer = this.props.getRef('navTabsContainer');
var navNodeWH = this.getScrollWH(navTabsContainer || navNode);
// Add 1px to fix `offsetWidth` with decimal in Chrome not correct handle
var navNodeWH = this.getScrollWH(navTabsContainer || navNode); // Add 1px to fix `offsetWidth` with decimal in Chrome not correct handle
// https://github.com/ant-design/ant-design/issues/13423
var containerWH = this.getOffsetWH(this.props.getRef('container')) + 1;
var navWrapNodeWH = this.getOffsetWH(this.props.getRef('navWrap'));
var offset = this.offset;
var minOffset = containerWH - navNodeWH;
var _state = this.state,
next = _state.next,
prev = _state.prev;
var _this$state = this.state,
next = _this$state.next,
prev = _this$state.prev;

@@ -204,6 +219,6 @@ if (minOffset >= 0) {

} else {
next = false;
// Fix https://github.com/ant-design/ant-design/issues/8861
next = false; // Fix https://github.com/ant-design/ant-design/issues/8861
// Test with container offset which is stable
// and set the offset of the nav wrap node
var realOffset = navWrapNodeWH - navNodeWH;

@@ -228,37 +243,43 @@ this.setOffset(realOffset, false);

}, {
key: 'getOffsetWH',
key: "getOffsetWH",
value: function getOffsetWH(node) {
var tabBarPosition = this.props.tabBarPosition;
var prop = 'offsetWidth';
if (tabBarPosition === 'left' || tabBarPosition === 'right') {
prop = 'offsetHeight';
}
return node[prop];
}
}, {
key: 'getScrollWH',
key: "getScrollWH",
value: function getScrollWH(node) {
var tabBarPosition = this.props.tabBarPosition;
var prop = 'scrollWidth';
if (tabBarPosition === 'left' || tabBarPosition === 'right') {
prop = 'scrollHeight';
}
return node[prop];
}
}, {
key: 'getOffsetLT',
key: "getOffsetLT",
value: function getOffsetLT(node) {
var tabBarPosition = this.props.tabBarPosition;
var prop = 'left';
if (tabBarPosition === 'left' || tabBarPosition === 'right') {
prop = 'top';
}
return node.getBoundingClientRect()[prop];
}
}, {
key: 'setOffset',
key: "setOffset",
value: function setOffset(offset) {
var checkNextPrev = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
var target = Math.min(0, offset);
var target = Math.min(0, offset);
if (this.offset !== target) {

@@ -270,6 +291,7 @@ this.offset = target;

var transformSupported = (0, _utils.isTransform3dSupported)(navStyle);
if (tabBarPosition === 'left' || tabBarPosition === 'right') {
if (transformSupported) {
navOffset = {
value: 'translate3d(0,' + target + 'px,0)'
value: "translate3d(0,".concat(target, "px,0)")
};

@@ -279,3 +301,3 @@ } else {

name: 'top',
value: target + 'px'
value: "".concat(target, "px")
};

@@ -287,4 +309,5 @@ }

}
navOffset = {
value: 'translate3d(' + target + 'px,0,0)'
value: "translate3d(".concat(target, "px,0,0)")
};

@@ -294,5 +317,6 @@ } else {

name: 'left',
value: target + 'px'
value: "".concat(target, "px")
};
}
if (transformSupported) {

@@ -303,2 +327,3 @@ (0, _utils.setTransform)(navStyle, navOffset.value);

}
if (checkNextPrev) {

@@ -310,3 +335,3 @@ this.setNextPrev();

}, {
key: 'setPrev',
key: "setPrev",
value: function setPrev(v) {

@@ -320,3 +345,3 @@ if (this.state.prev !== v) {

}, {
key: 'setNext',
key: "setNext",
value: function setNext(v) {

@@ -330,3 +355,3 @@ if (this.state.next !== v) {

}, {
key: 'isNextPrevShown',
key: "isNextPrevShown",
value: function isNextPrevShown(state) {

@@ -336,92 +361,60 @@ if (state) {

}
return this.state.next || this.state.prev;
}
}, {
key: 'render',
key: "render",
value: function render() {
var _classnames, _classnames2, _classnames3, _classnames4;
var _state2 = this.state,
next = _state2.next,
prev = _state2.prev;
var _props = this.props,
prefixCls = _props.prefixCls,
scrollAnimated = _props.scrollAnimated,
navWrapper = _props.navWrapper,
prevIcon = _props.prevIcon,
nextIcon = _props.nextIcon;
var _this$state2 = this.state,
next = _this$state2.next,
prev = _this$state2.prev;
var _this$props = this.props,
prefixCls = _this$props.prefixCls,
scrollAnimated = _this$props.scrollAnimated,
navWrapper = _this$props.navWrapper,
prevIcon = _this$props.prevIcon,
nextIcon = _this$props.nextIcon;
var showNextPrev = prev || next;
var prevButton = _react2['default'].createElement(
'span',
{
onClick: prev ? this.prev : null,
unselectable: 'unselectable',
className: (0, _classnames6['default'])((_classnames = {}, (0, _defineProperty3['default'])(_classnames, prefixCls + '-tab-prev', 1), (0, _defineProperty3['default'])(_classnames, prefixCls + '-tab-btn-disabled', !prev), (0, _defineProperty3['default'])(_classnames, prefixCls + '-tab-arrow-show', showNextPrev), _classnames)),
onTransitionEnd: this.prevTransitionEnd
},
prevIcon || _react2['default'].createElement('span', { className: prefixCls + '-tab-prev-icon' })
);
var prevButton = _react.default.createElement("span", {
onClick: prev ? this.prev : null,
unselectable: "unselectable",
className: (0, _classnames5.default)((_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-tab-prev"), 1), _defineProperty(_classnames, "".concat(prefixCls, "-tab-btn-disabled"), !prev), _defineProperty(_classnames, "".concat(prefixCls, "-tab-arrow-show"), showNextPrev), _classnames)),
onTransitionEnd: this.prevTransitionEnd
}, prevIcon || _react.default.createElement("span", {
className: "".concat(prefixCls, "-tab-prev-icon")
}));
var nextButton = _react2['default'].createElement(
'span',
{
onClick: next ? this.next : null,
unselectable: 'unselectable',
className: (0, _classnames6['default'])((_classnames2 = {}, (0, _defineProperty3['default'])(_classnames2, prefixCls + '-tab-next', 1), (0, _defineProperty3['default'])(_classnames2, prefixCls + '-tab-btn-disabled', !next), (0, _defineProperty3['default'])(_classnames2, prefixCls + '-tab-arrow-show', showNextPrev), _classnames2))
},
nextIcon || _react2['default'].createElement('span', { className: prefixCls + '-tab-next-icon' })
);
var nextButton = _react.default.createElement("span", {
onClick: next ? this.next : null,
unselectable: "unselectable",
className: (0, _classnames5.default)((_classnames2 = {}, _defineProperty(_classnames2, "".concat(prefixCls, "-tab-next"), 1), _defineProperty(_classnames2, "".concat(prefixCls, "-tab-btn-disabled"), !next), _defineProperty(_classnames2, "".concat(prefixCls, "-tab-arrow-show"), showNextPrev), _classnames2))
}, nextIcon || _react.default.createElement("span", {
className: "".concat(prefixCls, "-tab-next-icon")
}));
var navClassName = prefixCls + '-nav';
var navClasses = (0, _classnames6['default'])((_classnames3 = {}, (0, _defineProperty3['default'])(_classnames3, navClassName, true), (0, _defineProperty3['default'])(_classnames3, scrollAnimated ? navClassName + '-animated' : navClassName + '-no-animated', true), _classnames3));
return _react2['default'].createElement(
'div',
{
className: (0, _classnames6['default'])((_classnames4 = {}, (0, _defineProperty3['default'])(_classnames4, prefixCls + '-nav-container', 1), (0, _defineProperty3['default'])(_classnames4, prefixCls + '-nav-container-scrolling', showNextPrev), _classnames4)),
key: 'container',
ref: this.props.saveRef('container')
},
prevButton,
nextButton,
_react2['default'].createElement(
'div',
{ className: prefixCls + '-nav-wrap', ref: this.props.saveRef('navWrap') },
_react2['default'].createElement(
'div',
{ className: prefixCls + '-nav-scroll' },
_react2['default'].createElement(
'div',
{ className: navClasses, ref: this.props.saveRef('nav') },
navWrapper(this.props.children)
)
)
)
);
var navClassName = "".concat(prefixCls, "-nav");
var navClasses = (0, _classnames5.default)((_classnames3 = {}, _defineProperty(_classnames3, navClassName, true), _defineProperty(_classnames3, scrollAnimated ? "".concat(navClassName, "-animated") : "".concat(navClassName, "-no-animated"), true), _classnames3));
return _react.default.createElement("div", {
className: (0, _classnames5.default)((_classnames4 = {}, _defineProperty(_classnames4, "".concat(prefixCls, "-nav-container"), 1), _defineProperty(_classnames4, "".concat(prefixCls, "-nav-container-scrolling"), showNextPrev), _classnames4)),
key: "container",
ref: this.props.saveRef('container')
}, prevButton, nextButton, _react.default.createElement("div", {
className: "".concat(prefixCls, "-nav-wrap"),
ref: this.props.saveRef('navWrap')
}, _react.default.createElement("div", {
className: "".concat(prefixCls, "-nav-scroll")
}, _react.default.createElement("div", {
className: navClasses,
ref: this.props.saveRef('nav')
}, navWrapper(this.props.children)))));
}
}]);
return ScrollableTabBarNode;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = ScrollableTabBarNode;
ScrollableTabBarNode.propTypes = {
activeKey: _propTypes2['default'].string,
getRef: _propTypes2['default'].func.isRequired,
saveRef: _propTypes2['default'].func.isRequired,
tabBarPosition: _propTypes2['default'].oneOf(['left', 'right', 'top', 'bottom']),
prefixCls: _propTypes2['default'].string,
scrollAnimated: _propTypes2['default'].bool,
onPrevClick: _propTypes2['default'].func,
onNextClick: _propTypes2['default'].func,
navWrapper: _propTypes2['default'].func,
children: _propTypes2['default'].node,
prevIcon: _propTypes2['default'].node,
nextIcon: _propTypes2['default'].node,
direction: _propTypes2['default'].node
};
exports.default = ScrollableTabBarNode;
ScrollableTabBarNode.defaultProps = {

@@ -436,3 +429,2 @@ tabBarPosition: 'left',

}
};
module.exports = exports['default'];
};

101

lib/SwipeableInkTabBar.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,85 +6,72 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _SwipeableTabBarNode = _interopRequireDefault(require("./SwipeableTabBarNode"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _TabBarSwipeableTabs = _interopRequireDefault(require("./TabBarSwipeableTabs"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _TabBarRootNode = _interopRequireDefault(require("./TabBarRootNode"));
var _createClass2 = require('babel-runtime/helpers/createClass');
var _InkTabBarNode = _interopRequireDefault(require("./InkTabBarNode"));
var _createClass3 = _interopRequireDefault(_createClass2);
var _SaveRef = _interopRequireDefault(require("./SaveRef"));
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _inherits3 = _interopRequireDefault(_inherits2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _react = require('react');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _react2 = _interopRequireDefault(_react);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _SwipeableTabBarNode = require('./SwipeableTabBarNode');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _SwipeableTabBarNode2 = _interopRequireDefault(_SwipeableTabBarNode);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _TabBarSwipeableTabs = require('./TabBarSwipeableTabs');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _TabBarSwipeableTabs2 = _interopRequireDefault(_TabBarSwipeableTabs);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _TabBarRootNode = require('./TabBarRootNode');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _TabBarRootNode2 = _interopRequireDefault(_TabBarRootNode);
var SwipeableInkTabBar = /*#__PURE__*/function (_React$Component) {
_inherits(SwipeableInkTabBar, _React$Component);
var _InkTabBarNode = require('./InkTabBarNode');
function SwipeableInkTabBar() {
_classCallCheck(this, SwipeableInkTabBar);
var _InkTabBarNode2 = _interopRequireDefault(_InkTabBarNode);
var _SaveRef = require('./SaveRef');
var _SaveRef2 = _interopRequireDefault(_SaveRef);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
/* eslint-disable react/prefer-stateless-function */
var SwipeableInkTabBar = function (_React$Component) {
(0, _inherits3['default'])(SwipeableInkTabBar, _React$Component);
function SwipeableInkTabBar() {
(0, _classCallCheck3['default'])(this, SwipeableInkTabBar);
return (0, _possibleConstructorReturn3['default'])(this, (SwipeableInkTabBar.__proto__ || Object.getPrototypeOf(SwipeableInkTabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(SwipeableInkTabBar).apply(this, arguments));
}
(0, _createClass3['default'])(SwipeableInkTabBar, [{
key: 'render',
_createClass(SwipeableInkTabBar, [{
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
return _react2['default'].createElement(
_SaveRef2['default'],
null,
function (saveRef, getRef) {
return _react2['default'].createElement(
_TabBarRootNode2['default'],
(0, _extends3['default'])({ saveRef: saveRef }, _this2.props),
_react2['default'].createElement(
_SwipeableTabBarNode2['default'],
(0, _extends3['default'])({ saveRef: saveRef, getRef: getRef }, _this2.props),
_react2['default'].createElement(_TabBarSwipeableTabs2['default'], (0, _extends3['default'])({ saveRef: saveRef }, _this2.props)),
_react2['default'].createElement(_InkTabBarNode2['default'], (0, _extends3['default'])({ saveRef: saveRef, getRef: getRef }, _this2.props))
)
);
}
);
return _react.default.createElement(_SaveRef.default, null, function (saveRef, getRef) {
return _react.default.createElement(_TabBarRootNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), _react.default.createElement(_SwipeableTabBarNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), _react.default.createElement(_TabBarSwipeableTabs.default, _extends({
saveRef: saveRef
}, _this.props)), _react.default.createElement(_InkTabBarNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props))));
});
}
}]);
return SwipeableInkTabBar;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = SwipeableInkTabBar;
module.exports = exports['default'];
exports.default = SwipeableInkTabBar;

334

lib/SwipeableTabBarNode.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,68 +6,102 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _react = _interopRequireDefault(require("react"));
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
var _classnames3 = _interopRequireDefault(require("classnames"));
var _extends2 = require('babel-runtime/helpers/extends');
var _rcHammerjs = _interopRequireDefault(require("rc-hammerjs"));
var _extends3 = _interopRequireDefault(_extends2);
var _reactDom = _interopRequireDefault(require("react-dom"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _utils = require("./utils");
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _createClass2 = require('babel-runtime/helpers/createClass');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _createClass3 = _interopRequireDefault(_createClass2);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _inherits3 = _interopRequireDefault(_inherits2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _react = require('react');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _react2 = _interopRequireDefault(_react);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _propTypes = require('prop-types');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _classnames3 = require('classnames');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _classnames4 = _interopRequireDefault(_classnames3);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _rcHammerjs = require('rc-hammerjs');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _rcHammerjs2 = _interopRequireDefault(_rcHammerjs);
var SwipeableTabBarNode = /*#__PURE__*/function (_React$Component) {
_inherits(SwipeableTabBarNode, _React$Component);
var _reactDom = require('react-dom');
function SwipeableTabBarNode(props) {
var _this;
var _reactDom2 = _interopRequireDefault(_reactDom);
_classCallCheck(this, SwipeableTabBarNode);
var _utils = require('./utils');
_this = _possibleConstructorReturn(this, _getPrototypeOf(SwipeableTabBarNode).call(this, props));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
_this.onPan = function (e) {
var _this$cache = _this.cache,
vertical = _this$cache.vertical,
totalAvaliableDelta = _this$cache.totalAvaliableDelta,
totalDelta = _this$cache.totalDelta;
var speed = _this.props.speed; // calculate touch distance
var SwipeableTabBarNode = function (_React$Component) {
(0, _inherits3['default'])(SwipeableTabBarNode, _React$Component);
var nowDelta = vertical ? e.deltaY : e.deltaX;
nowDelta *= speed / 10; // calculate distance dom need transform
function SwipeableTabBarNode(props) {
(0, _classCallCheck3['default'])(this, SwipeableTabBarNode);
var _nextDelta = nowDelta + totalDelta;
var _this = (0, _possibleConstructorReturn3['default'])(this, (SwipeableTabBarNode.__proto__ || Object.getPrototypeOf(SwipeableTabBarNode)).call(this, props));
if (_this.isRtl()) {
// calculate distance from right when direction is right-to-left
if (_nextDelta <= 0) {
_nextDelta = 0;
} else if (_nextDelta >= totalAvaliableDelta) {
_nextDelta = totalAvaliableDelta;
}
} // calculate distance from left when direction is left-to-right
else if (_nextDelta >= 0) {
_nextDelta = 0;
} else if (_nextDelta <= -totalAvaliableDelta) {
_nextDelta = -totalAvaliableDelta;
}
_initialiseProps.call(_this);
_this.cache.totalDelta = _nextDelta;
var _this$checkPagination = _this.checkPaginationByKey(_this.props.activeKey),
hasPrevPage = _this$checkPagination.hasPrevPage,
hasNextPage = _this$checkPagination.hasNextPage;
_this.setSwipePosition(); // calculate pagination display
var _this$checkPagination = _this.checkPaginationByDelta(_this.cache.totalDelta),
hasPrevPage = _this$checkPagination.hasPrevPage,
hasNextPage = _this$checkPagination.hasNextPage;
if (hasPrevPage !== _this.state.hasPrevPage || hasNextPage !== _this.state.hasNextPage) {
_this.setState({
hasPrevPage: hasPrevPage,
hasNextPage: hasNextPage
});
}
};
var _this$checkPagination2 = _this.checkPaginationByKey(_this.props.activeKey),
_hasPrevPage = _this$checkPagination2.hasPrevPage,
_hasNextPage = _this$checkPagination2.hasNextPage;
_this.state = {
hasPrevPage: hasPrevPage,
hasNextPage: hasNextPage
hasPrevPage: _hasPrevPage,
hasNextPage: _hasNextPage
};

@@ -77,4 +111,4 @@ return _this;

(0, _createClass3['default'])(SwipeableTabBarNode, [{
key: 'componentDidMount',
_createClass(SwipeableTabBarNode, [{
key: "componentDidMount",
value: function componentDidMount() {

@@ -84,5 +118,6 @@ var swipe = this.props.getRef('swipe');

var activeKey = this.props.activeKey;
this.swipeNode = _reactDom.default.findDOMNode(swipe); // dom which scroll (9999px)
this.swipeNode = _reactDom2['default'].findDOMNode(swipe); // dom which scroll (9999px)
this.realNode = _reactDom2['default'].findDOMNode(nav); // dom which visiable in screen (viewport)
this.realNode = _reactDom.default.findDOMNode(nav); // dom which visiable in screen (viewport)
this.setCache();

@@ -92,5 +127,6 @@ this.setSwipePositionByKey(activeKey);

}, {
key: 'componentDidUpdate',
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
this.setCache();
if (this.props.activeKey && this.props.activeKey !== prevProps.activeKey || this.props.panels.length !== prevProps.panels.length || this.props.pageSize !== prevProps.pageSize) {

@@ -101,13 +137,16 @@ this.setSwipePositionByKey(this.props.activeKey);

}, {
key: 'setCache',
key: "setCache",
value: function setCache() {
var _props = this.props,
tabBarPosition = _props.tabBarPosition,
pageSize = _props.pageSize,
panels = _props.panels;
var _this$props = this.props,
tabBarPosition = _this$props.tabBarPosition,
pageSize = _this$props.pageSize,
panels = _this$props.panels;
var _isVertical = (0, _utils.isVertical)(tabBarPosition);
var _viewSize = (0, _utils.getStyle)(this.realNode, _isVertical ? 'height' : 'width');
var _tabWidth = _viewSize / pageSize;
this.cache = (0, _extends3['default'])({}, this.cache, {
this.cache = _objectSpread({}, this.cache, {
vertical: _isVertical,

@@ -118,3 +157,2 @@ totalAvaliableDelta: _tabWidth * panels.length - _viewSize,

}
/**

@@ -125,24 +163,23 @@ * used for props.activeKey setting, not for swipe callback

}, {
key: 'getDeltaByKey',
key: "getDeltaByKey",
value: function getDeltaByKey(activeKey) {
var pageSize = this.props.pageSize;
var index = this.getIndexByKey(activeKey);
var centerTabCount = Math.floor(pageSize / 2);
var tabWidth = this.cache.tabWidth;
var delta = (index - centerTabCount) * tabWidth; // in rtl direction tabs are ordered from right to left, so delta should be positive in order to
// push swiped element to righ side (start of view)
var delta = (index - centerTabCount) * tabWidth;
// in rtl direction tabs are ordered from right to left, so delta should be positive in order to
// push swiped element to righ side (start of view)
if (!this.isRtl()) {
delta *= -1;
}
return delta;
}
}, {
key: 'getIndexByKey',
key: "getIndexByKey",
value: function getIndexByKey(activeKey) {
var panels = this.props.panels;
var length = panels.length;
var length = panels.length;
for (var i = 0; i < length; i++) {

@@ -153,13 +190,13 @@ if (panels[i].key === activeKey) {

}
return -1;
}
}, {
key: 'setSwipePositionByKey',
key: "setSwipePositionByKey",
value: function setSwipePositionByKey(activeKey) {
var _checkPaginationByKey = this.checkPaginationByKey(activeKey),
hasPrevPage = _checkPaginationByKey.hasPrevPage,
hasNextPage = _checkPaginationByKey.hasNextPage;
var _this$checkPagination3 = this.checkPaginationByKey(activeKey),
hasPrevPage = _this$checkPagination3.hasPrevPage,
hasNextPage = _this$checkPagination3.hasNextPage;
var totalAvaliableDelta = this.cache.totalAvaliableDelta;
this.setState({

@@ -169,3 +206,4 @@ hasPrevPage: hasPrevPage,

});
var delta = void 0;
var delta;
if (!hasPrevPage) {

@@ -181,2 +219,3 @@ // the first page

}
this.cache.totalDelta = delta;

@@ -186,20 +225,18 @@ this.setSwipePosition();

}, {
key: 'setSwipePosition',
key: "setSwipePosition",
value: function setSwipePosition() {
var _cache = this.cache,
totalDelta = _cache.totalDelta,
vertical = _cache.vertical;
var _this$cache2 = this.cache,
totalDelta = _this$cache2.totalDelta,
vertical = _this$cache2.vertical;
(0, _utils.setPxStyle)(this.swipeNode, totalDelta, vertical);
}
}, {
key: 'checkPaginationByKey',
key: "checkPaginationByKey",
value: function checkPaginationByKey(activeKey) {
var _props2 = this.props,
panels = _props2.panels,
pageSize = _props2.pageSize;
var _this$props2 = this.props,
panels = _this$props2.panels,
pageSize = _this$props2.pageSize;
var index = this.getIndexByKey(activeKey);
var centerTabCount = Math.floor(pageSize / 2); // the basic rule is to make activeTab be shown in the center of TabBar viewport
var index = this.getIndexByKey(activeKey);
var centerTabCount = Math.floor(pageSize / 2);
// the basic rule is to make activeTab be shown in the center of TabBar viewport
return {

@@ -211,6 +248,5 @@ hasPrevPage: index - centerTabCount > 0,

}, {
key: 'checkPaginationByDelta',
key: "checkPaginationByDelta",
value: function checkPaginationByDelta(delta) {
var totalAvaliableDelta = this.cache.totalAvaliableDelta;
return {

@@ -222,3 +258,3 @@ hasPrevPage: delta < 0,

}, {
key: 'isRtl',
key: "isRtl",
value: function isRtl() {

@@ -228,119 +264,42 @@ return this.props.direction === 'rtl';

}, {
key: 'render',
key: "render",
value: function render() {
var _classnames2;
var _props3 = this.props,
prefixCls = _props3.prefixCls,
hammerOptions = _props3.hammerOptions,
tabBarPosition = _props3.tabBarPosition;
var _state = this.state,
hasPrevPage = _state.hasPrevPage,
hasNextPage = _state.hasNextPage;
var navClassName = prefixCls + '-nav';
var navClasses = (0, _classnames4['default'])((0, _defineProperty3['default'])({}, navClassName, true));
var _this$props3 = this.props,
prefixCls = _this$props3.prefixCls,
hammerOptions = _this$props3.hammerOptions,
tabBarPosition = _this$props3.tabBarPosition;
var _this$state = this.state,
hasPrevPage = _this$state.hasPrevPage,
hasNextPage = _this$state.hasNextPage;
var navClassName = "".concat(prefixCls, "-nav");
var navClasses = (0, _classnames3.default)(_defineProperty({}, navClassName, true));
var events = {
onPan: this.onPan
};
return _react2['default'].createElement(
'div',
{
className: (0, _classnames4['default'])((_classnames2 = {}, (0, _defineProperty3['default'])(_classnames2, prefixCls + '-nav-container', 1), (0, _defineProperty3['default'])(_classnames2, prefixCls + '-nav-swipe-container', 1), (0, _defineProperty3['default'])(_classnames2, prefixCls + '-prevpage', hasPrevPage), (0, _defineProperty3['default'])(_classnames2, prefixCls + '-nextpage', hasNextPage), _classnames2)),
key: 'container',
ref: this.props.saveRef('container')
},
_react2['default'].createElement(
'div',
{ className: prefixCls + '-nav-wrap', ref: this.props.saveRef('navWrap') },
_react2['default'].createElement(
_rcHammerjs2['default'],
(0, _extends3['default'])({}, events, {
direction: (0, _utils.isVertical)(tabBarPosition) ? 'DIRECTION_ALL' : 'DIRECTION_HORIZONTAL',
options: hammerOptions
}),
_react2['default'].createElement(
'div',
{ className: prefixCls + '-nav-swipe', ref: this.props.saveRef('swipe') },
_react2['default'].createElement(
'div',
{ className: navClasses, ref: this.props.saveRef('nav') },
this.props.children
)
)
)
)
);
return _react.default.createElement("div", {
className: (0, _classnames3.default)((_classnames2 = {}, _defineProperty(_classnames2, "".concat(prefixCls, "-nav-container"), 1), _defineProperty(_classnames2, "".concat(prefixCls, "-nav-swipe-container"), 1), _defineProperty(_classnames2, "".concat(prefixCls, "-prevpage"), hasPrevPage), _defineProperty(_classnames2, "".concat(prefixCls, "-nextpage"), hasNextPage), _classnames2)),
key: "container",
ref: this.props.saveRef('container')
}, _react.default.createElement("div", {
className: "".concat(prefixCls, "-nav-wrap"),
ref: this.props.saveRef('navWrap')
}, _react.default.createElement(_rcHammerjs.default, _extends({}, events, {
direction: (0, _utils.isVertical)(tabBarPosition) ? 'DIRECTION_ALL' : 'DIRECTION_HORIZONTAL',
options: hammerOptions
}), _react.default.createElement("div", {
className: "".concat(prefixCls, "-nav-swipe"),
ref: this.props.saveRef('swipe')
}, _react.default.createElement("div", {
className: navClasses,
ref: this.props.saveRef('nav')
}, this.props.children)))));
}
}]);
return SwipeableTabBarNode;
}(_react2['default'].Component);
}(_react.default.Component);
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onPan = function (e) {
var _cache2 = _this2.cache,
vertical = _cache2.vertical,
totalAvaliableDelta = _cache2.totalAvaliableDelta,
totalDelta = _cache2.totalDelta;
var speed = _this2.props.speed;
// calculate touch distance
var nowDelta = vertical ? e.deltaY : e.deltaX;
nowDelta *= speed / 10;
// calculate distance dom need transform
var _nextDelta = nowDelta + totalDelta;
if (_this2.isRtl()) {
// calculate distance from right when direction is right-to-left
if (_nextDelta <= 0) {
_nextDelta = 0;
} else if (_nextDelta >= totalAvaliableDelta) {
_nextDelta = totalAvaliableDelta;
}
}
// calculate distance from left when direction is left-to-right
else if (_nextDelta >= 0) {
_nextDelta = 0;
} else if (_nextDelta <= -totalAvaliableDelta) {
_nextDelta = -totalAvaliableDelta;
}
_this2.cache.totalDelta = _nextDelta;
_this2.setSwipePosition();
// calculate pagination display
var _checkPaginationByDel = _this2.checkPaginationByDelta(_this2.cache.totalDelta),
hasPrevPage = _checkPaginationByDel.hasPrevPage,
hasNextPage = _checkPaginationByDel.hasNextPage;
if (hasPrevPage !== _this2.state.hasPrevPage || hasNextPage !== _this2.state.hasNextPage) {
_this2.setState({
hasPrevPage: hasPrevPage,
hasNextPage: hasNextPage
});
}
};
};
exports['default'] = SwipeableTabBarNode;
SwipeableTabBarNode.propTypes = {
activeKey: _propTypes2['default'].string,
panels: _propTypes2['default'].node,
pageSize: _propTypes2['default'].number,
tabBarPosition: _propTypes2['default'].oneOf(['left', 'right', 'top', 'bottom']),
prefixCls: _propTypes2['default'].string,
children: _propTypes2['default'].node,
hammerOptions: _propTypes2['default'].object,
speed: _propTypes2['default'].number,
saveRef: _propTypes2['default'].func,
getRef: _propTypes2['default'].func,
direction: _propTypes2['default'].string
};
exports.default = SwipeableTabBarNode;
SwipeableTabBarNode.defaultProps = {

@@ -352,7 +311,8 @@ panels: null,

hammerOptions: {},
pageSize: 5, // per page show how many tabs
speed: 7, // swipe speed, 1 to 10, more bigger more faster
pageSize: 5,
// per page show how many tabs
speed: 7,
// swipe speed, 1 to 10, more bigger more faster
saveRef: function saveRef() {},
getRef: function getRef() {}
};
module.exports = exports['default'];
};

164

lib/SwipeableTabContent.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,47 +6,42 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _rcHammerjs = _interopRequireDefault(require("rc-hammerjs"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _reactDom = _interopRequireDefault(require("react-dom"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _TabContent = _interopRequireDefault(require("./TabContent"));
var _createClass2 = require('babel-runtime/helpers/createClass');
var _utils = require("./utils");
var _createClass3 = _interopRequireDefault(_createClass2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _inherits2 = require('babel-runtime/helpers/inherits');
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
var _inherits3 = _interopRequireDefault(_inherits2);
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
var _react = require('react');
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _react2 = _interopRequireDefault(_react);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _propTypes = require('prop-types');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _rcHammerjs = require('rc-hammerjs');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _rcHammerjs2 = _interopRequireDefault(_rcHammerjs);
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _reactDom = require('react-dom');
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _reactDom2 = _interopRequireDefault(_reactDom);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _TabContent = require('./TabContent');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _TabContent2 = _interopRequireDefault(_TabContent);
var _utils = require('./utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var RESISTANCE_COEF = 0.6;

@@ -59,4 +54,4 @@

viewSize = _ref.viewSize;
var index = startIndex + -delta / viewSize;
var index = startIndex + -delta / viewSize;
if (index < 0) {

@@ -67,2 +62,3 @@ index = Math.exp(index * RESISTANCE_COEF) - 1;

}
return index;

@@ -74,5 +70,7 @@ }

var otherDelta = (0, _utils.isVertical)(this.props.tabBarPosition) ? e.deltaX : e.deltaY;
if (Math.abs(delta) < Math.abs(otherDelta)) {
return undefined;
}
var currentIndex = computeIndex({

@@ -85,2 +83,3 @@ maxIndex: this.maxIndex,

var showIndex = delta < 0 ? Math.floor(currentIndex + 1) : Math.floor(currentIndex);
if (showIndex < 0) {

@@ -91,23 +90,27 @@ showIndex = 0;

}
if (this.children[showIndex].props.disabled) {
return undefined;
}
return currentIndex;
}
var SwipeableTabContent = function (_React$Component) {
(0, _inherits3['default'])(SwipeableTabContent, _React$Component);
var SwipeableTabContent = /*#__PURE__*/function (_React$Component) {
_inherits(SwipeableTabContent, _React$Component);
function SwipeableTabContent() {
var _ref2;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
(0, _classCallCheck3['default'])(this, SwipeableTabContent);
_classCallCheck(this, SwipeableTabContent);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, (_ref2 = SwipeableTabContent.__proto__ || Object.getPrototypeOf(SwipeableTabContent)).call.apply(_ref2, [this].concat(args))), _this), _this.onPanStart = function () {
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(SwipeableTabContent)).call.apply(_getPrototypeOf2, [this].concat(args)));
_this.onPanStart = function () {
var _this$props = _this.props,

@@ -118,11 +121,15 @@ tabBarPosition = _this$props.tabBarPosition,

animated = _this$props.animated;
_this.startIndex = (0, _utils.getActiveIndex)(children, activeKey);
_this.startIndex = (0, _utils.getActiveIndex)(children, activeKey);
var startIndex = _this.startIndex;
var _assertThisInitialize = _assertThisInitialized(_this),
startIndex = _assertThisInitialize.startIndex;
if (startIndex === -1) {
return;
}
if (animated) {
(0, _utils.setTransition)(_this.rootNode.style, 'none');
}
_this.startDrag = true;

@@ -132,30 +139,42 @@ _this.children = (0, _utils.toArray)(children);

_this.viewSize = (0, _utils.isVertical)(tabBarPosition) ? _this.rootNode.offsetHeight : _this.rootNode.offsetWidth;
}, _this.onPan = function (e) {
};
_this.onPan = function (e) {
if (!_this.startDrag) {
return;
}
var tabBarPosition = _this.props.tabBarPosition;
var currentIndex = getIndexByDelta.call(_assertThisInitialized(_this), e);
var currentIndex = getIndexByDelta.call(_this, e);
if (currentIndex !== undefined) {
(0, _utils.setTransform)(_this.rootNode.style, (0, _utils.getTransformByIndex)(currentIndex, tabBarPosition));
}
}, _this.onPanEnd = function (e) {
};
_this.onPanEnd = function (e) {
if (!_this.startDrag) {
return;
}
_this.end(e);
}, _this.onSwipe = function (e) {
};
_this.onSwipe = function (e) {
_this.end(e, true);
}, _this.end = function (e, swipe) {
};
_this.end = function (e, swipe) {
var _this$props2 = _this.props,
tabBarPosition = _this$props2.tabBarPosition,
animated = _this$props2.animated;
_this.startDrag = false;
_this.startDrag = false;
if (animated) {
(0, _utils.setTransition)(_this.rootNode.style, '');
}
var currentIndex = getIndexByDelta.call(_this, e);
var currentIndex = getIndexByDelta.call(_assertThisInitialized(_this), e);
var finalIndex = _this.startIndex;
if (currentIndex !== undefined) {

@@ -171,2 +190,3 @@ if (currentIndex < 0) {

var floorIndex = Math.floor(currentIndex);
if (currentIndex - floorIndex > 0.6) {

@@ -179,5 +199,7 @@ finalIndex = floorIndex + 1;

}
if (_this.children[finalIndex].props.disabled) {
return;
}
if (_this.startIndex === finalIndex) {

@@ -190,18 +212,19 @@ if (animated) {

}
}, _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
};
return _this;
}
(0, _createClass3['default'])(SwipeableTabContent, [{
key: 'componentDidMount',
_createClass(SwipeableTabContent, [{
key: "componentDidMount",
value: function componentDidMount() {
this.rootNode = _reactDom2['default'].findDOMNode(this);
this.rootNode = _reactDom.default.findDOMNode(this);
}
}, {
key: 'render',
key: "render",
value: function render() {
var _props = this.props,
tabBarPosition = _props.tabBarPosition,
hammerOptions = _props.hammerOptions,
animated = _props.animated;
var _this$props3 = this.props,
tabBarPosition = _this$props3.tabBarPosition,
hammerOptions = _this$props3.hammerOptions,
animated = _this$props3.animated;
var events = {

@@ -211,4 +234,5 @@ onSwipe: this.onSwipe,

};
if (animated !== false) {
events = (0, _extends3['default'])({}, events, {
events = _objectSpread({}, events, {
onPan: this.onPan,

@@ -218,30 +242,16 @@ onPanEnd: this.onPanEnd

}
return _react2['default'].createElement(
_rcHammerjs2['default'],
(0, _extends3['default'])({}, events, {
direction: (0, _utils.isVertical)(tabBarPosition) ? 'DIRECTION_ALL' : 'DIRECTION_HORIZONTAL',
options: hammerOptions
}),
_react2['default'].createElement(_TabContent2['default'], this.props)
);
return _react.default.createElement(_rcHammerjs.default, _extends({}, events, {
direction: (0, _utils.isVertical)(tabBarPosition) ? 'DIRECTION_ALL' : 'DIRECTION_HORIZONTAL',
options: hammerOptions
}), _react.default.createElement(_TabContent.default, this.props));
}
}]);
return SwipeableTabContent;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = SwipeableTabContent;
SwipeableTabContent.propTypes = {
tabBarPosition: _propTypes2['default'].string,
onChange: _propTypes2['default'].func,
children: _propTypes2['default'].node,
hammerOptions: _propTypes2['default'].any,
animated: _propTypes2['default'].bool,
activeKey: _propTypes2['default'].string
};
exports.default = SwipeableTabContent;
SwipeableTabContent.defaultProps = {
animated: true
};
module.exports = exports['default'];
};

82

lib/TabBar.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,72 +6,62 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _TabBarRootNode = _interopRequireDefault(require("./TabBarRootNode"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _TabBarTabsNode = _interopRequireDefault(require("./TabBarTabsNode"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _SaveRef = _interopRequireDefault(require("./SaveRef"));
var _createClass2 = require('babel-runtime/helpers/createClass');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _createClass3 = _interopRequireDefault(_createClass2);
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _inherits3 = _interopRequireDefault(_inherits2);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _react = require('react');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _react2 = _interopRequireDefault(_react);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _TabBarRootNode = require('./TabBarRootNode');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _TabBarRootNode2 = _interopRequireDefault(_TabBarRootNode);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _TabBarTabsNode = require('./TabBarTabsNode');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _TabBarTabsNode2 = _interopRequireDefault(_TabBarTabsNode);
var TabBar = /*#__PURE__*/function (_React$Component) {
_inherits(TabBar, _React$Component);
var _SaveRef = require('./SaveRef');
function TabBar() {
_classCallCheck(this, TabBar);
var _SaveRef2 = _interopRequireDefault(_SaveRef);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
/* eslint-disable react/prefer-stateless-function */
var TabBar = function (_React$Component) {
(0, _inherits3['default'])(TabBar, _React$Component);
function TabBar() {
(0, _classCallCheck3['default'])(this, TabBar);
return (0, _possibleConstructorReturn3['default'])(this, (TabBar.__proto__ || Object.getPrototypeOf(TabBar)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabBar).apply(this, arguments));
}
(0, _createClass3['default'])(TabBar, [{
key: 'render',
_createClass(TabBar, [{
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
return _react2['default'].createElement(
_SaveRef2['default'],
null,
function (saveRef) {
return _react2['default'].createElement(
_TabBarRootNode2['default'],
(0, _extends3['default'])({ saveRef: saveRef }, _this2.props),
_react2['default'].createElement(_TabBarTabsNode2['default'], (0, _extends3['default'])({ saveRef: saveRef }, _this2.props))
);
}
);
return _react.default.createElement(_SaveRef.default, null, function (saveRef, getRef) {
return _react.default.createElement(_TabBarRootNode.default, _extends({
saveRef: saveRef,
getRef: getRef
}, _this.props), _react.default.createElement(_TabBarTabsNode.default, _extends({
saveRef: saveRef
}, _this.props)));
});
}
}]);
return TabBar;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = TabBar;
module.exports = exports['default'];
exports.default = TabBar;

169

lib/TabBarRootNode.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,131 +6,138 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireWildcard(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _classnames2 = _interopRequireDefault(require("classnames"));
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _utils = require("./utils");
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _createClass2 = require('babel-runtime/helpers/createClass');
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
var _createClass3 = _interopRequireDefault(_createClass2);
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _inherits3 = _interopRequireDefault(_inherits2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _react = require('react');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _react2 = _interopRequireDefault(_react);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _propTypes = require('prop-types');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _classnames2 = require('classnames');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _classnames3 = _interopRequireDefault(_classnames2);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _utils = require('./utils');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var TabBarRootNode = /*#__PURE__*/function (_React$Component) {
_inherits(TabBarRootNode, _React$Component);
var TabBarRootNode = function (_React$Component) {
(0, _inherits3['default'])(TabBarRootNode, _React$Component);
function TabBarRootNode() {
var _ref;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
(0, _classCallCheck3['default'])(this, TabBarRootNode);
_classCallCheck(this, TabBarRootNode);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, (_ref = TabBarRootNode.__proto__ || Object.getPrototypeOf(TabBarRootNode)).call.apply(_ref, [this].concat(args))), _this), _this.getExtraContentStyle = function () {
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(TabBarRootNode)).call.apply(_getPrototypeOf2, [this].concat(args)));
_this.getExtraContentStyle = function () {
var _this$props = _this.props,
tabBarPosition = _this$props.tabBarPosition,
direction = _this$props.direction;
var topOrBottom = tabBarPosition === 'top' || tabBarPosition === 'bottom';
var topOrBottom = tabBarPosition === 'top' || tabBarPosition === 'bottom';
if (direction === 'rtl') {
return topOrBottom ? { float: 'left' } : {};
return topOrBottom ? {
float: 'left'
} : {};
}
return topOrBottom ? { float: 'right' } : {};
}, _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
return topOrBottom ? {
float: 'right'
} : {};
};
return _this;
}
(0, _createClass3['default'])(TabBarRootNode, [{
key: 'render',
_createClass(TabBarRootNode, [{
key: "componentDidUpdate",
value: function componentDidUpdate() {
var activeTab = this.props.getRef('activeTab');
if (activeTab) {
activeTab.focus();
}
}
}, {
key: "render",
value: function render() {
var _props = this.props,
prefixCls = _props.prefixCls,
onKeyDown = _props.onKeyDown,
className = _props.className,
extraContent = _props.extraContent,
style = _props.style,
tabBarPosition = _props.tabBarPosition,
children = _props.children,
direction = _props.direction,
restProps = (0, _objectWithoutProperties3['default'])(_props, ['prefixCls', 'onKeyDown', 'className', 'extraContent', 'style', 'tabBarPosition', 'children', 'direction']);
var _this$props2 = this.props,
prefixCls = _this$props2.prefixCls,
onKeyDown = _this$props2.onKeyDown,
className = _this$props2.className,
extraContent = _this$props2.extraContent,
style = _this$props2.style,
tabBarPosition = _this$props2.tabBarPosition,
children = _this$props2.children,
direction = _this$props2.direction,
restProps = _objectWithoutProperties(_this$props2, ["prefixCls", "onKeyDown", "className", "extraContent", "style", "tabBarPosition", "children", "direction"]);
var cls = (0, _classnames3['default'])(prefixCls + '-bar', (0, _defineProperty3['default'])({}, className, !!className));
var cls = (0, _classnames2.default)("".concat(prefixCls, "-bar"), _defineProperty({}, className, !!className));
var topOrBottom = tabBarPosition === 'top' || tabBarPosition === 'bottom';
var extraContentStyle = extraContent && extraContent.props ? extraContent.props.style : {};
var newChildren = children;
if (extraContent) {
newChildren = [(0, _react.cloneElement)(extraContent, {
key: 'extra',
style: (0, _extends3['default'])({}, this.getExtraContentStyle(topOrBottom, direction), extraContentStyle)
}), (0, _react.cloneElement)(children, { key: 'content' })];
onKeyDown: function onKeyDown(e) {
return e.stopPropagation();
},
style: _objectSpread({}, this.getExtraContentStyle(topOrBottom, direction), {}, extraContentStyle)
}), (0, _react.cloneElement)(children, {
key: 'content'
})];
newChildren = topOrBottom ? newChildren : newChildren.reverse();
}
return _react2['default'].createElement(
'div',
(0, _extends3['default'])({
role: 'tablist',
className: cls,
tabIndex: '0',
ref: this.props.saveRef('root'),
onKeyDown: onKeyDown,
style: style
}, (0, _utils.getDataAttr)(restProps)),
newChildren
);
return _react.default.createElement("div", _extends({
role: "tablist",
tabIndex: -1,
className: cls,
ref: this.props.saveRef('root'),
onKeyDown: onKeyDown,
style: style
}, (0, _utils.getDataAttr)(restProps)), newChildren);
}
}]);
return TabBarRootNode;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = TabBarRootNode;
TabBarRootNode.propTypes = {
prefixCls: _propTypes2['default'].string,
className: _propTypes2['default'].string,
style: _propTypes2['default'].object,
tabBarPosition: _propTypes2['default'].oneOf(['left', 'right', 'top', 'bottom']),
children: _propTypes2['default'].node,
extraContent: _propTypes2['default'].node,
onKeyDown: _propTypes2['default'].func,
saveRef: _propTypes2['default'].func,
direction: _propTypes2['default'].oneOf(['ltr', 'rtl'])
};
exports.default = TabBarRootNode;
TabBarRootNode.defaultProps = {

@@ -144,4 +151,4 @@ prefixCls: '',

onKeyDown: function onKeyDown() {},
saveRef: function saveRef() {}
};
module.exports = exports['default'];
saveRef: function saveRef() {},
getRef: function getRef() {}
};

118

lib/TabBarSwipeableTabs.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,53 +6,45 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _classnames2 = _interopRequireDefault(require("classnames"));
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _createClass2 = require('babel-runtime/helpers/createClass');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _createClass3 = _interopRequireDefault(_createClass2);
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _inherits3 = _interopRequireDefault(_inherits2);
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _react = require('react');
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _react2 = _interopRequireDefault(_react);
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _propTypes = require('prop-types');
var TabBarSwipeableTabs = /*#__PURE__*/function (_React$Component) {
_inherits(TabBarSwipeableTabs, _React$Component);
var _propTypes2 = _interopRequireDefault(_propTypes);
function TabBarSwipeableTabs() {
_classCallCheck(this, TabBarSwipeableTabs);
var _classnames2 = require('classnames');
var _classnames3 = _interopRequireDefault(_classnames2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var TabBarSwipeableTabs = function (_React$Component) {
(0, _inherits3['default'])(TabBarSwipeableTabs, _React$Component);
function TabBarSwipeableTabs() {
(0, _classCallCheck3['default'])(this, TabBarSwipeableTabs);
return (0, _possibleConstructorReturn3['default'])(this, (TabBarSwipeableTabs.__proto__ || Object.getPrototypeOf(TabBarSwipeableTabs)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabBarSwipeableTabs).apply(this, arguments));
}
(0, _createClass3['default'])(TabBarSwipeableTabs, [{
key: 'render',
_createClass(TabBarSwipeableTabs, [{
key: "render",
value: function render() {
var _this2 = this;
var _this = this;

@@ -65,3 +57,4 @@ var props = this.props;

var _flexWidth = 1 / props.pageSize * 100 + '%';
var _flexWidth = "".concat(1 / props.pageSize * 100, "%");
var tabStyle = {

@@ -72,3 +65,3 @@ WebkitFlexBasis: _flexWidth,

_react2['default'].Children.forEach(children, function (child) {
_react.default.Children.forEach(children, function (child) {
var _classnames;

@@ -79,27 +72,32 @@

}
var key = child.key;
var cls = (0, _classnames3['default'])(prefixCls + '-tab', (_classnames = {}, (0, _defineProperty3['default'])(_classnames, prefixCls + '-tab-active', activeKey === key), (0, _defineProperty3['default'])(_classnames, prefixCls + '-tab-disabled', child.props.disabled), _classnames));
var cls = (0, _classnames2.default)("".concat(prefixCls, "-tab"), (_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-tab-active"), activeKey === key), _defineProperty(_classnames, "".concat(prefixCls, "-tab-disabled"), child.props.disabled), _classnames));
var events = {};
if (!child.props.disabled) {
events = {
onClick: _this2.props.onTabClick.bind(_this2, key)
onClick: _this.props.onTabClick.bind(_this, key)
};
}
var refProps = {};
if (activeKey === key) {
refProps.ref = _this2.props.saveRef('activeTab');
refProps.ref = _this.props.saveRef('activeTab');
}
rst.push(_react2['default'].createElement(
'div',
(0, _extends3['default'])({
role: 'tab',
style: tabStyle,
'aria-disabled': child.props.disabled ? 'true' : 'false',
'aria-selected': activeKey === key ? 'true' : 'false'
}, events, {
className: cls,
key: key
}, refProps),
child.props.tab
));
var id = _this.props.id ? "".concat(key, "-").concat(_this.props.id) : key;
rst.push(_react.default.createElement("div", _extends({
role: "tab",
style: tabStyle,
"aria-disabled": child.props.disabled ? 'true' : 'false',
"aria-selected": activeKey === key ? 'true' : 'false',
tabIndex: activeKey === key ? 0 : -1
}, events, {
className: cls,
key: key,
id: "tab-".concat(id),
"aria-controls": "tabpane-".concat(id)
}, refProps), child.props.tab));
});

@@ -110,18 +108,7 @@

}]);
return TabBarSwipeableTabs;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = TabBarSwipeableTabs;
TabBarSwipeableTabs.propTypes = {
pageSize: _propTypes2['default'].number,
onTabClick: _propTypes2['default'].func,
saveRef: _propTypes2['default'].func,
destroyInactiveTabPane: _propTypes2['default'].bool,
prefixCls: _propTypes2['default'].string,
activeKey: _propTypes2['default'].string,
panels: _propTypes2['default'].node
};
exports.default = TabBarSwipeableTabs;
TabBarSwipeableTabs.defaultProps = {

@@ -131,3 +118,2 @@ pageSize: 5,

saveRef: function saveRef() {}
};
module.exports = exports['default'];
};

154

lib/TabBarTabsNode.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,84 +6,79 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _warning = _interopRequireDefault(require("warning"));
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _utils = require("./utils");
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _createClass2 = require('babel-runtime/helpers/createClass');
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _createClass3 = _interopRequireDefault(_createClass2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _inherits3 = _interopRequireDefault(_inherits2);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _react = require('react');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _react2 = _interopRequireDefault(_react);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _warning = require('warning');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _warning2 = _interopRequireDefault(_warning);
var TabBarTabsNode = /*#__PURE__*/function (_React$Component) {
_inherits(TabBarTabsNode, _React$Component);
var _propTypes = require('prop-types');
function TabBarTabsNode() {
_classCallCheck(this, TabBarTabsNode);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _utils = require('./utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var TabBarTabsNode = function (_React$Component) {
(0, _inherits3['default'])(TabBarTabsNode, _React$Component);
function TabBarTabsNode() {
(0, _classCallCheck3['default'])(this, TabBarTabsNode);
return (0, _possibleConstructorReturn3['default'])(this, (TabBarTabsNode.__proto__ || Object.getPrototypeOf(TabBarTabsNode)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabBarTabsNode).apply(this, arguments));
}
(0, _createClass3['default'])(TabBarTabsNode, [{
key: 'render',
_createClass(TabBarTabsNode, [{
key: "render",
value: function render() {
var _this2 = this;
var _this = this;
var _props = this.props,
children = _props.panels,
activeKey = _props.activeKey,
prefixCls = _props.prefixCls,
tabBarGutter = _props.tabBarGutter,
saveRef = _props.saveRef,
tabBarPosition = _props.tabBarPosition,
renderTabBarNode = _props.renderTabBarNode,
direction = _props.direction;
var _this$props = this.props,
children = _this$props.panels,
activeKey = _this$props.activeKey,
prefixCls = _this$props.prefixCls,
tabBarGutter = _this$props.tabBarGutter,
saveRef = _this$props.saveRef,
tabBarPosition = _this$props.tabBarPosition,
renderTabBarNode = _this$props.renderTabBarNode,
direction = _this$props.direction;
var rst = [];
_react2['default'].Children.forEach(children, function (child, index) {
_react.default.Children.forEach(children, function (child, index) {
if (!child) {
return;
}
var key = child.key;
var cls = activeKey === key ? prefixCls + '-tab-active' : '';
cls += ' ' + prefixCls + '-tab';
var cls = activeKey === key ? "".concat(prefixCls, "-tab-active") : '';
cls += " ".concat(prefixCls, "-tab");
var events = {};
if (child.props.disabled) {
cls += ' ' + prefixCls + '-tab-disabled';
cls += " ".concat(prefixCls, "-tab-disabled");
} else {
events = {
onClick: _this2.props.onTabClick.bind(_this2, key)
onClick: _this.props.onTabClick.bind(_this, key)
};
}
var ref = {};
if (activeKey === key) {

@@ -94,21 +89,22 @@ ref.ref = saveRef('activeTab');

var gutter = tabBarGutter && index === children.length - 1 ? 0 : tabBarGutter;
var marginProperty = direction === 'rtl' ? 'marginLeft' : 'marginRight';
var style = (0, _defineProperty3['default'])({}, (0, _utils.isVertical)(tabBarPosition) ? 'marginBottom' : marginProperty, gutter);
(0, _warning2['default'])('tab' in child.props, 'There must be `tab` property on children of Tabs.');
var node = _react2['default'].createElement(
'div',
(0, _extends3['default'])({
role: 'tab',
'aria-disabled': child.props.disabled ? 'true' : 'false',
'aria-selected': activeKey === key ? 'true' : 'false'
}, events, {
className: cls,
key: key,
style: style
}, ref),
child.props.tab
);
var style = _defineProperty({}, (0, _utils.isVertical)(tabBarPosition) ? 'marginBottom' : marginProperty, gutter);
(0, _warning.default)('tab' in child.props, 'There must be `tab` property on children of Tabs.');
var id = _this.props.id ? "".concat(key, "-").concat(_this.props.id) : key;
var node = _react.default.createElement("div", _extends({
role: "tab",
"aria-disabled": child.props.disabled ? 'true' : 'false',
"aria-selected": activeKey === key ? 'true' : 'false',
tabIndex: activeKey === key ? 0 : -1
}, events, {
className: cls,
key: key,
style: style,
id: "tab-".concat(id),
"aria-controls": "tabpane-".concat(id)
}, ref), child.props.tab);
if (renderTabBarNode) {

@@ -121,27 +117,12 @@ node = renderTabBarNode(node);

return _react2['default'].createElement(
'div',
{ ref: saveRef('navTabsContainer') },
rst
);
return _react.default.createElement("div", {
ref: saveRef('navTabsContainer')
}, rst);
}
}]);
return TabBarTabsNode;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = TabBarTabsNode;
TabBarTabsNode.propTypes = {
activeKey: _propTypes2['default'].string,
panels: _propTypes2['default'].node,
prefixCls: _propTypes2['default'].string,
tabBarGutter: _propTypes2['default'].number,
onTabClick: _propTypes2['default'].func,
saveRef: _propTypes2['default'].func,
renderTabBarNode: _propTypes2['default'].func,
tabBarPosition: _propTypes2['default'].string,
direction: _propTypes2['default'].string
};
exports.default = TabBarTabsNode;
TabBarTabsNode.defaultProps = {

@@ -153,3 +134,2 @@ panels: [],

saveRef: function saveRef() {}
};
module.exports = exports['default'];
};

109

lib/TabContent.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,53 +6,47 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _classnames2 = _interopRequireDefault(require("classnames"));
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _utils = require("./utils");
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
var _createClass2 = require('babel-runtime/helpers/createClass');
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
var _createClass3 = _interopRequireDefault(_createClass2);
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _inherits3 = _interopRequireDefault(_inherits2);
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _react = require('react');
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _react2 = _interopRequireDefault(_react);
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _propTypes = require('prop-types');
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _classnames2 = require('classnames');
var TabContent = /*#__PURE__*/function (_React$Component) {
_inherits(TabContent, _React$Component);
var _classnames3 = _interopRequireDefault(_classnames2);
function TabContent() {
_classCallCheck(this, TabContent);
var _utils = require('./utils');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var TabContent = function (_React$Component) {
(0, _inherits3['default'])(TabContent, _React$Component);
function TabContent() {
(0, _classCallCheck3['default'])(this, TabContent);
return (0, _possibleConstructorReturn3['default'])(this, (TabContent.__proto__ || Object.getPrototypeOf(TabContent)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabContent).apply(this, arguments));
}
(0, _createClass3['default'])(TabContent, [{
key: 'getTabPanes',
_createClass(TabContent, [{
key: "getTabPanes",
value: function getTabPanes() {

@@ -64,12 +58,14 @@ var props = this.props;

_react2['default'].Children.forEach(children, function (child) {
_react.default.Children.forEach(children, function (child) {
if (!child) {
return;
}
var key = child.key;
var active = activeKey === key;
newChildren.push(_react2['default'].cloneElement(child, {
newChildren.push(_react.default.cloneElement(child, {
active: active,
destroyInactiveTabPane: props.destroyInactiveTabPane,
rootPrefixCls: props.prefixCls
rootPrefixCls: props.prefixCls,
id: props.id
}));

@@ -81,3 +77,3 @@ });

}, {
key: 'render',
key: "render",
value: function render() {

@@ -96,11 +92,12 @@ var _classnames;

var style = props.style;
var classes = (0, _classnames2.default)((_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-content"), true), _defineProperty(_classnames, animated ? "".concat(prefixCls, "-content-animated") : "".concat(prefixCls, "-content-no-animated"), true), _classnames), className);
var classes = (0, _classnames3['default'])((_classnames = {}, (0, _defineProperty3['default'])(_classnames, prefixCls + '-content', true), (0, _defineProperty3['default'])(_classnames, animated ? prefixCls + '-content-animated' : prefixCls + '-content-no-animated', true), _classnames), className);
if (animated) {
var activeIndex = (0, _utils.getActiveIndex)(children, activeKey);
if (activeIndex !== -1) {
var animatedStyle = animatedWithMargin ? (0, _utils.getMarginStyle)(activeIndex, tabBarPosition, direction) : (0, _utils.getTransformPropValue)((0, _utils.getTransformByIndex)(activeIndex, tabBarPosition, direction));
style = (0, _extends3['default'])({}, style, animatedStyle);
style = _objectSpread({}, style, {}, animatedStyle);
} else {
style = (0, _extends3['default'])({}, style, {
style = _objectSpread({}, style, {
display: 'none'

@@ -110,34 +107,16 @@ });

}
return _react2['default'].createElement(
'div',
{
className: classes,
style: style
},
this.getTabPanes()
);
return _react.default.createElement("div", {
className: classes,
style: style
}, this.getTabPanes());
}
}]);
return TabContent;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = TabContent;
TabContent.propTypes = {
animated: _propTypes2['default'].bool,
animatedWithMargin: _propTypes2['default'].bool,
prefixCls: _propTypes2['default'].string,
children: _propTypes2['default'].node,
activeKey: _propTypes2['default'].string,
style: _propTypes2['default'].any,
tabBarPosition: _propTypes2['default'].string,
className: _propTypes2['default'].string,
destroyInactiveTabPane: _propTypes2['default'].bool,
direction: _propTypes2['default'].string
};
exports.default = TabContent;
TabContent.defaultProps = {
animated: true
};
module.exports = exports['default'];
};

165

lib/TabPane.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,143 +6,96 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _classnames2 = _interopRequireDefault(require("classnames"));
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _utils = require("./utils");
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
var _createClass2 = require('babel-runtime/helpers/createClass');
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _createClass3 = _interopRequireDefault(_createClass2);
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _inherits3 = _interopRequireDefault(_inherits2);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _react = require('react');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _react2 = _interopRequireDefault(_react);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _propTypes = require('prop-types');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _classnames2 = require('classnames');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _classnames3 = _interopRequireDefault(_classnames2);
var TabPane = /*#__PURE__*/function (_React$Component) {
_inherits(TabPane, _React$Component);
var _utils = require('./utils');
function TabPane() {
_classCallCheck(this, TabPane);
var _Sentinel = require('./Sentinel');
var _Sentinel2 = _interopRequireDefault(_Sentinel);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var TabPane = function (_React$Component) {
(0, _inherits3['default'])(TabPane, _React$Component);
function TabPane() {
(0, _classCallCheck3['default'])(this, TabPane);
return (0, _possibleConstructorReturn3['default'])(this, (TabPane.__proto__ || Object.getPrototypeOf(TabPane)).apply(this, arguments));
return _possibleConstructorReturn(this, _getPrototypeOf(TabPane).apply(this, arguments));
}
(0, _createClass3['default'])(TabPane, [{
key: 'render',
_createClass(TabPane, [{
key: "render",
value: function render() {
var _classnames;
var _props = this.props,
id = _props.id,
className = _props.className,
destroyInactiveTabPane = _props.destroyInactiveTabPane,
active = _props.active,
forceRender = _props.forceRender,
rootPrefixCls = _props.rootPrefixCls,
style = _props.style,
children = _props.children,
placeholder = _props.placeholder,
restProps = (0, _objectWithoutProperties3['default'])(_props, ['id', 'className', 'destroyInactiveTabPane', 'active', 'forceRender', 'rootPrefixCls', 'style', 'children', 'placeholder']);
var _this$props = this.props,
id = _this$props.id,
className = _this$props.className,
destroyInactiveTabPane = _this$props.destroyInactiveTabPane,
active = _this$props.active,
forceRender = _this$props.forceRender,
rootPrefixCls = _this$props.rootPrefixCls,
style = _this$props.style,
children = _this$props.children,
placeholder = _this$props.placeholder,
tabKey = _this$props.tabKey,
restProps = _objectWithoutProperties(_this$props, ["id", "className", "destroyInactiveTabPane", "active", "forceRender", "rootPrefixCls", "style", "children", "placeholder", "tabKey"]);
this._isActived = this._isActived || active;
var prefixCls = rootPrefixCls + '-tabpane';
var cls = (0, _classnames3['default'])((_classnames = {}, (0, _defineProperty3['default'])(_classnames, prefixCls, 1), (0, _defineProperty3['default'])(_classnames, prefixCls + '-inactive', !active), (0, _defineProperty3['default'])(_classnames, prefixCls + '-active', active), (0, _defineProperty3['default'])(_classnames, className, className), _classnames));
var prefixCls = "".concat(rootPrefixCls, "-tabpane");
var cls = (0, _classnames2.default)((_classnames = {}, _defineProperty(_classnames, prefixCls, 1), _defineProperty(_classnames, "".concat(prefixCls, "-inactive"), !active), _defineProperty(_classnames, "".concat(prefixCls, "-active"), active), _defineProperty(_classnames, className, className), _classnames));
var isRender = destroyInactiveTabPane ? active : this._isActived;
var shouldRender = isRender || forceRender;
return _react2['default'].createElement(
_Sentinel.SentinelConsumer,
null,
function (_ref) {
var sentinelStart = _ref.sentinelStart,
sentinelEnd = _ref.sentinelEnd,
setPanelSentinelStart = _ref.setPanelSentinelStart,
setPanelSentinelEnd = _ref.setPanelSentinelEnd;
// Create sentinel
var panelSentinelStart = void 0;
var panelSentinelEnd = void 0;
if (active && shouldRender) {
panelSentinelStart = _react2['default'].createElement(_Sentinel2['default'], {
setRef: setPanelSentinelStart,
prevElement: sentinelStart
});
panelSentinelEnd = _react2['default'].createElement(_Sentinel2['default'], {
setRef: setPanelSentinelEnd,
nextElement: sentinelEnd
});
}
return _react2['default'].createElement(
'div',
(0, _extends3['default'])({
style: style,
role: 'tabpanel',
'aria-hidden': active ? 'false' : 'true',
className: cls,
id: id
}, (0, _utils.getDataAttr)(restProps)),
panelSentinelStart,
shouldRender ? children : placeholder,
panelSentinelEnd
);
}
);
var tabKeyExists = tabKey && String(tabKey).length > 0;
var uuid = tabKeyExists && (id ? "".concat(tabKey, "-").concat(id) : "".concat(tabKey));
return _react.default.createElement("div", _extends({
style: _objectSpread({}, style, {
visibility: active ? 'visible' : 'hidden'
}),
role: "tabpanel",
"aria-hidden": active ? 'false' : 'true',
tabIndex: active ? 0 : -1,
className: cls,
id: uuid && "tabpane-".concat(uuid),
"aria-labelledby": uuid && "tab-".concat(uuid)
}, (0, _utils.getDataAttr)(restProps)), shouldRender ? children : placeholder);
}
}]);
return TabPane;
}(_react2['default'].Component);
}(_react.default.Component);
exports['default'] = TabPane;
TabPane.propTypes = {
className: _propTypes2['default'].string,
active: _propTypes2['default'].bool,
style: _propTypes2['default'].any,
destroyInactiveTabPane: _propTypes2['default'].bool,
forceRender: _propTypes2['default'].bool,
placeholder: _propTypes2['default'].node,
rootPrefixCls: _propTypes2['default'].string,
children: _propTypes2['default'].node,
id: _propTypes2['default'].string
};
exports.default = TabPane;
TabPane.defaultProps = {
placeholder: null
};
module.exports = exports['default'];
};

383

lib/Tabs.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,68 +6,48 @@ Object.defineProperty(exports, "__esModule", {

});
exports.default = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _classnames2 = _interopRequireDefault(require("classnames"));
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _KeyCode = _interopRequireDefault(require("./KeyCode"));
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
var _TabPane = _interopRequireDefault(require("./TabPane"));
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
var _utils = require("./utils");
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _createClass2 = require('babel-runtime/helpers/createClass');
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _createClass3 = _interopRequireDefault(_createClass2);
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _inherits3 = _interopRequireDefault(_inherits2);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _react = require('react');
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _react2 = _interopRequireDefault(_react);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _propTypes = require('prop-types');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _classnames2 = require('classnames');
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var _classnames3 = _interopRequireDefault(_classnames2);
var _raf = require('raf');
var _raf2 = _interopRequireDefault(_raf);
var _KeyCode = require('./KeyCode');
var _KeyCode2 = _interopRequireDefault(_KeyCode);
var _TabPane = require('./TabPane');
var _TabPane2 = _interopRequireDefault(_TabPane);
var _utils = require('./utils');
var _Sentinel = require('./Sentinel');
var _Sentinel2 = _interopRequireDefault(_Sentinel);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
function noop() {}
function getDefaultActiveKey(props) {
var activeKey = void 0;
_react2['default'].Children.forEach(props.children, function (child) {
var activeKey;
_react.default.Children.forEach(props.children, function (child) {
if (child && !activeKey && !child.props.disabled) {

@@ -77,2 +57,3 @@ activeKey = child.key;

});
return activeKey;

@@ -82,29 +63,112 @@ }

function activeKeyIsValid(props, key) {
var keys = _react2['default'].Children.map(props.children, function (child) {
var keys = _react.default.Children.map(props.children, function (child) {
return child && child.key;
});
return keys.indexOf(key) >= 0;
}
var Tabs = function (_React$Component) {
(0, _inherits3['default'])(Tabs, _React$Component);
var Tabs = /*#__PURE__*/function (_React$Component) {
_inherits(Tabs, _React$Component);
function Tabs(props) {
(0, _classCallCheck3['default'])(this, Tabs);
var _this;
var _this = (0, _possibleConstructorReturn3['default'])(this, (Tabs.__proto__ || Object.getPrototypeOf(Tabs)).call(this, props));
_classCallCheck(this, Tabs);
_initialiseProps.call(_this);
_this = _possibleConstructorReturn(this, _getPrototypeOf(Tabs).call(this, props));
var activeKey = void 0;
_this.onTabClick = function (activeKey, e) {
if (_this.tabBar.props.onTabClick) {
_this.tabBar.props.onTabClick(activeKey, e);
}
_this.setActiveKey(activeKey);
};
_this.onNavKeyDown = function (e) {
var keyboard = _this.props.keyboard;
if (!keyboard) {
return;
}
var eventKeyCode = e.keyCode;
if (eventKeyCode === _KeyCode.default.RIGHT || eventKeyCode === _KeyCode.default.DOWN) {
e.preventDefault();
var nextKey = _this.getNextActiveKey(true);
_this.onTabClick(nextKey);
} else if (eventKeyCode === _KeyCode.default.LEFT || eventKeyCode === _KeyCode.default.UP) {
e.preventDefault();
var previousKey = _this.getNextActiveKey(false);
_this.onTabClick(previousKey);
}
};
_this.onScroll = function (_ref) {
var target = _ref.target,
currentTarget = _ref.currentTarget;
if (target === currentTarget && target.scrollLeft > 0) {
target.scrollLeft = 0;
}
};
_this.setActiveKey = function (activeKey) {
if (_this.state.activeKey !== activeKey) {
if (!('activeKey' in _this.props)) {
_this.setState({
activeKey: activeKey
});
}
_this.props.onChange(activeKey);
}
};
_this.getNextActiveKey = function (next) {
var activeKey = _this.state.activeKey;
var children = [];
_react.default.Children.forEach(_this.props.children, function (c) {
if (c && !c.props.disabled) {
if (next) {
children.push(c);
} else {
children.unshift(c);
}
}
});
var length = children.length;
var ret = length && children[0].key;
children.forEach(function (child, i) {
if (child.key === activeKey) {
if (i === length - 1) {
ret = children[0].key;
} else {
ret = children[i + 1].key;
}
}
});
return ret;
};
var _activeKey;
if ('activeKey' in props) {
activeKey = props.activeKey;
_activeKey = props.activeKey;
} else if ('defaultActiveKey' in props) {
activeKey = props.defaultActiveKey;
_activeKey = props.defaultActiveKey;
} else {
activeKey = getDefaultActiveKey(props);
_activeKey = getDefaultActiveKey(props);
}
_this.state = {
activeKey: activeKey
activeKey: _activeKey
};

@@ -114,26 +178,9 @@ return _this;

(0, _createClass3['default'])(Tabs, [{
key: 'componentWillUnmount',
_createClass(Tabs, [{
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.destroy = true;
_raf2['default'].cancel(this.sentinelId);
}
// Sentinel for tab index
}, {
key: 'updateSentinelContext',
value: function updateSentinelContext() {
var _this2 = this;
if (this.destroy) return;
_raf2['default'].cancel(this.sentinelId);
this.sentinelId = (0, _raf2['default'])(function () {
if (_this2.destroy) return;
_this2.forceUpdate();
});
}
}, {
key: 'render',
key: "render",
value: function render() {

@@ -143,2 +190,3 @@ var _classnames;

var props = this.props;
var prefixCls = props.prefixCls,

@@ -152,9 +200,9 @@ navWrapper = props.navWrapper,

direction = props.direction,
restProps = (0, _objectWithoutProperties3['default'])(props, ['prefixCls', 'navWrapper', 'tabBarPosition', 'className', 'renderTabContent', 'renderTabBar', 'destroyInactiveTabPane', 'direction']);
id = props.id,
restProps = _objectWithoutProperties(props, ["prefixCls", "navWrapper", "tabBarPosition", "className", "renderTabContent", "renderTabBar", "destroyInactiveTabPane", "direction", "id"]);
var cls = (0, _classnames3['default'])((_classnames = {}, (0, _defineProperty3['default'])(_classnames, prefixCls, 1), (0, _defineProperty3['default'])(_classnames, prefixCls + '-' + tabBarPosition, 1), (0, _defineProperty3['default'])(_classnames, className, !!className), (0, _defineProperty3['default'])(_classnames, prefixCls + '-rtl', direction === 'rtl'), _classnames));
var cls = (0, _classnames2.default)((_classnames = {}, _defineProperty(_classnames, prefixCls, 1), _defineProperty(_classnames, "".concat(prefixCls, "-").concat(tabBarPosition), 1), _defineProperty(_classnames, className, !!className), _defineProperty(_classnames, "".concat(prefixCls, "-rtl"), direction === 'rtl'), _classnames));
this.tabBar = renderTabBar();
var tabBar = _react2['default'].cloneElement(this.tabBar, {
var tabBar = _react.default.cloneElement(this.tabBar, {
prefixCls: prefixCls,

@@ -168,6 +216,7 @@ navWrapper: navWrapper,

activeKey: this.state.activeKey,
direction: this.props.direction
direction: this.props.direction,
id: id
});
var tabContent = _react2['default'].cloneElement(renderTabContent(), {
var tabContent = _react.default.cloneElement(renderTabContent(), {
prefixCls: prefixCls,

@@ -180,49 +229,27 @@ tabBarPosition: tabBarPosition,

key: 'tabContent',
direction: this.props.direction
direction: this.props.direction,
id: id
});
var sentinelStart = _react2['default'].createElement(_Sentinel2['default'], {
key: 'sentinelStart',
setRef: this.setSentinelStart,
nextElement: this.panelSentinelStart
});
var sentinelEnd = _react2['default'].createElement(_Sentinel2['default'], {
key: 'sentinelEnd',
setRef: this.setSentinelEnd,
prevElement: this.panelSentinelEnd
});
var contents = [];
var contents = [];
if (tabBarPosition === 'bottom') {
contents.push(sentinelStart, tabContent, sentinelEnd, tabBar);
contents.push(tabContent, tabBar);
} else {
contents.push(tabBar, sentinelStart, tabContent, sentinelEnd);
contents.push(tabBar, tabContent);
}
return _react2['default'].createElement(
_Sentinel.SentinelProvider,
{
value: {
sentinelStart: this.sentinelStart,
sentinelEnd: this.sentinelEnd,
setPanelSentinelStart: this.setPanelSentinelStart,
setPanelSentinelEnd: this.setPanelSentinelEnd
}
},
_react2['default'].createElement(
'div',
(0, _extends3['default'])({
className: cls,
style: props.style
}, (0, _utils.getDataAttr)(restProps), {
onScroll: this.onScroll
}),
contents
)
);
return _react.default.createElement("div", _extends({
className: cls,
style: props.style
}, (0, _utils.getDataAttr)(restProps), {
onScroll: this.onScroll,
id: id
}), contents);
}
}], [{
key: 'getDerivedStateFromProps',
key: "getDerivedStateFromProps",
value: function getDerivedStateFromProps(props, state) {
var newState = {};
if ('activeKey' in props) {

@@ -233,119 +260,14 @@ newState.activeKey = props.activeKey;

}
if (Object.keys(newState).length > 0) {
return newState;
}
return null;
}
}]);
return Tabs;
}(_react2['default'].Component);
}(_react.default.Component);
var _initialiseProps = function _initialiseProps() {
var _this3 = this;
this.onTabClick = function (activeKey, e) {
if (_this3.tabBar.props.onTabClick) {
_this3.tabBar.props.onTabClick(activeKey, e);
}
_this3.setActiveKey(activeKey);
};
this.onNavKeyDown = function (e) {
var eventKeyCode = e.keyCode;
if (eventKeyCode === _KeyCode2['default'].RIGHT || eventKeyCode === _KeyCode2['default'].DOWN) {
e.preventDefault();
var nextKey = _this3.getNextActiveKey(true);
_this3.onTabClick(nextKey);
} else if (eventKeyCode === _KeyCode2['default'].LEFT || eventKeyCode === _KeyCode2['default'].UP) {
e.preventDefault();
var previousKey = _this3.getNextActiveKey(false);
_this3.onTabClick(previousKey);
}
};
this.onScroll = function (_ref) {
var target = _ref.target,
currentTarget = _ref.currentTarget;
if (target === currentTarget && target.scrollLeft > 0) {
target.scrollLeft = 0;
}
};
this.setSentinelStart = function (node) {
_this3.sentinelStart = node;
};
this.setSentinelEnd = function (node) {
_this3.sentinelEnd = node;
};
this.setPanelSentinelStart = function (node) {
if (node !== _this3.panelSentinelStart) {
_this3.updateSentinelContext();
}
_this3.panelSentinelStart = node;
};
this.setPanelSentinelEnd = function (node) {
if (node !== _this3.panelSentinelEnd) {
_this3.updateSentinelContext();
}
_this3.panelSentinelEnd = node;
};
this.setActiveKey = function (activeKey) {
if (_this3.state.activeKey !== activeKey) {
if (!('activeKey' in _this3.props)) {
_this3.setState({
activeKey: activeKey
});
}
_this3.props.onChange(activeKey);
}
};
this.getNextActiveKey = function (next) {
var activeKey = _this3.state.activeKey;
var children = [];
_react2['default'].Children.forEach(_this3.props.children, function (c) {
if (c && !c.props.disabled) {
if (next) {
children.push(c);
} else {
children.unshift(c);
}
}
});
var length = children.length;
var ret = length && children[0].key;
children.forEach(function (child, i) {
if (child.key === activeKey) {
if (i === length - 1) {
ret = children[0].key;
} else {
ret = children[i + 1].key;
}
}
});
return ret;
};
};
Tabs.propTypes = {
destroyInactiveTabPane: _propTypes2['default'].bool,
renderTabBar: _propTypes2['default'].func.isRequired,
renderTabContent: _propTypes2['default'].func.isRequired,
navWrapper: _propTypes2['default'].func,
onChange: _propTypes2['default'].func,
children: _propTypes2['default'].node,
prefixCls: _propTypes2['default'].string,
className: _propTypes2['default'].string,
tabBarPosition: _propTypes2['default'].string,
style: _propTypes2['default'].object,
activeKey: _propTypes2['default'].string,
defaultActiveKey: _propTypes2['default'].string,
direction: _propTypes2['default'].string
};
Tabs.defaultProps = {

@@ -355,2 +277,3 @@ prefixCls: 'rc-tabs',

onChange: noop,
keyboard: true,
navWrapper: function navWrapper(arg) {

@@ -364,6 +287,4 @@ return arg;

};
Tabs.TabPane = _TabPane2['default'];
exports['default'] = Tabs;
module.exports = exports['default'];
Tabs.TabPane = _TabPane.default;
var _default = Tabs;
exports.default = _default;

55

lib/utils.js

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,7 +6,2 @@ Object.defineProperty(exports, "__esModule", {

});
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
exports.toArray = toArray;

@@ -28,7 +23,7 @@ exports.getActiveIndex = getActiveIndex;

var _react = require('react');
var _react = _interopRequireDefault(require("react"));
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

@@ -38,3 +33,4 @@ function toArray(children) {

var c = [];
_react2['default'].Children.forEach(children, function (child) {
_react.default.Children.forEach(children, function (child) {
if (child) {

@@ -44,2 +40,3 @@ c.push(child);

});
return c;

@@ -50,2 +47,3 @@ }

var c = toArray(children);
for (var i = 0; i < c.length; i++) {

@@ -56,2 +54,3 @@ if (c[i].key === activeKey) {

}
return -1;

@@ -95,9 +94,9 @@ }

var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'ltr';
var translate = isVertical(tabBarPosition) ? 'translateY' : 'translateX';
if (!isVertical(tabBarPosition) && direction === 'rtl') {
return translate + '(' + index * 100 + '%) translateZ(0)';
return "".concat(translate, "(").concat(index * 100, "%) translateZ(0)");
}
return translate + '(' + -index * 100 + '%) translateZ(0)';
return "".concat(translate, "(").concat(-index * 100, "%) translateZ(0)");
}

@@ -107,9 +106,9 @@

var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'ltr';
var marginDirection = isVertical(tabBarPosition) ? 'marginTop' : 'marginLeft';
if (!isVertical(tabBarPosition) && direction === 'rtl') {
return (0, _defineProperty3['default'])({}, marginDirection, (index + 1) * 100 + '%');
return _defineProperty({}, marginDirection, "".concat((index + 1) * 100, "%"));
}
return (0, _defineProperty3['default'])({}, marginDirection, -index * 100 + '%');
return _defineProperty({}, marginDirection, "".concat(-index * 100, "%"));
}

@@ -122,4 +121,4 @@

function setPxStyle(el, value, vertical) {
value = vertical ? '0px, ' + value + 'px, 0px' : value + 'px, 0px, 0px';
setTransform(el.style, 'translate3d(' + value + ')');
value = vertical ? "0px, ".concat(value, "px, 0px") : "".concat(value, "px, 0px, 0px");
setTransform(el.style, "translate3d(".concat(value, ")"));
}

@@ -132,2 +131,3 @@

}
return prev;

@@ -142,3 +142,4 @@ }, {});

function getTypeValue(start, current, end, tabNode, wrapperNode) {
var total = getStyle(wrapperNode, 'padding-' + start);
var total = getStyle(wrapperNode, "padding-".concat(start));
if (!tabNode || !tabNode.parentNode) {

@@ -149,3 +150,2 @@ return total;

var childNodes = tabNode.parentNode.childNodes;
Array.prototype.some.call(childNodes, function (node) {

@@ -155,19 +155,18 @@ var style = window.getComputedStyle(node);

if (node !== tabNode) {
total += toNum(style, 'margin-' + start);
total += toNum(style, "margin-".concat(start));
total += node[current];
total += toNum(style, 'margin-' + end);
total += toNum(style, "margin-".concat(end));
if (style.boxSizing === 'content-box') {
total += toNum(style, 'border-' + start + '-width') + toNum(style, 'border-' + end + '-width');
total += toNum(style, "border-".concat(start, "-width")) + toNum(style, "border-".concat(end, "-width"));
}
return false;
}
// We need count current node margin
} // We need count current node margin
// ref: https://github.com/react-component/tabs/pull/139#issuecomment-431005262
total += toNum(style, 'margin-' + start);
total += toNum(style, "margin-".concat(start));
return true;
});
return total;

@@ -174,0 +173,0 @@ }

75

package.json
{
"name": "rc-tabs",
"version": "10.0.0",
"version": "10.1.0",
"description": "tabs ui component for react",
"engines": {
"node": ">=8.x"
},
"keywords": [

@@ -28,59 +31,31 @@ "react",

"license": "MIT",
"config": {
"port": 8002,
"entry": {
"rc-tabs": [
"./src/index.js",
"./assets/index.less"
]
}
},
"scripts": {
"dist": "rc-tools run dist",
"build": "rc-tools run build",
"compile": "rc-tools run compile --babel-runtime",
"gh-pages": "rc-tools run gh-pages",
"start": "rc-tools run server",
"pub": "rc-tools run pub --babel-runtime",
"prepublish": "rc-tools run guard",
"lint": "rc-tools run lint",
"watch": "rc-tools run watch",
"karma": "rc-test run karma",
"saucelabs": "rc-test run saucelabs",
"test": "jest",
"updateSn": "jest --updateSnapshot",
"start": "father doc dev --storybook",
"build": "father doc build --storybook",
"compile": "father build && npm run compile:style",
"test": "father test",
"chrome-test": "rc-test run chrome-test",
"coverage": "jest --coverage && cat ./coverage/lcov.info | coveralls",
"now-build": "npm run build"
"coverage": "father test --coverage",
"now-build": "npm run build",
"lint": "eslint src/ examples/ --ext .tsx,.ts,.jsx,.js",
"compile:style": "lessc --js assets/index.less assets/index.css",
"prepublishOnly": "npm run lint && npm run test && npm run compile && np --no-cleanup --yolo --no-publish"
},
"jest": {
"setupFiles": [
"./tests/setup.js"
],
"collectCoverageFrom": [
"src/*"
],
"transform": {
"\\.tsx?$": "./node_modules/rc-tools/scripts/jestPreprocessor.js",
"\\.jsx?$": "./node_modules/rc-tools/scripts/jestPreprocessor.js"
},
"globals": {
"__JEST__DEV__": true
}
},
"devDependencies": {
"@umijs/fabric": "^2.0.4",
"coveralls": "^3.0.6",
"cross-env": "^5.0.1",
"cross-env": "^7.0.2",
"enzyme": "^3.7.0",
"enzyme-adapter-react-16": "^1.7.0",
"enzyme-to-json": "^3.3.4",
"eslint": "^6.8.0",
"fastclick": "~1.0.6",
"father": "^2.29.2",
"history": "^1.17.0",
"immutability-helper": "^3.0.1",
"jest": "^23.6.0",
"pre-commit": "1.x",
"less": "^3.11.1",
"less-loader": "^5.0.0",
"np": "^6.2.0",
"preact": "^8.2.1",
"preact-compat": "^3.16.0",
"rc-test": "^6.0.1",
"rc-tools": "8.x",
"react": "^16.0.0",

@@ -94,16 +69,6 @@ "react-dnd": "^7.0.2",

},
"peerDependencies": {
"react": ">=15.0.0"
},
"pre-commit": [
"lint"
],
"dependencies": {
"babel-runtime": "6.x",
"classnames": "2.x",
"lodash": "^4.17.5",
"prop-types": "15.x",
"raf": "^3.4.1",
"rc-hammerjs": "~0.6.0",
"rc-util": "^4.0.4",
"resize-observer-polyfill": "^1.5.1",

@@ -110,0 +75,0 @@ "warning": "^4.0.3"

6

README.md

@@ -244,2 +244,8 @@ # rc-tabs

</tr>
<tr>
<td>keyboard</td>
<td>boolean</td>
<th>true</th>
<td>whether support keyboard to navigate tabs</td>
</tr>
</tbody>

@@ -246,0 +252,0 @@ </table>

dist/rc-tabs.css
dist/rc-tabs.css.map
dist/rc-tabs.js
dist/rc-tabs.js.map
dist/rc-tabs.min.css
dist/rc-tabs.min.css.map
dist/rc-tabs.min.js
es/Sentinel.js
lib/Sentinel.js
assets/index.css

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc