choerodon-ui/lib/rc-components/tabs/TabContent.js

An enterprise-class UI design language and React-based implementation

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _react = _interopRequireWildcard(require("react"));

var _createReactClass = _interopRequireDefault(require("create-react-class"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames2 = _interopRequireDefault(require("classnames"));

var _utils = require("./utils");

var TabContent = (0, _createReactClass["default"])({
  displayName: 'TabContent',
  propTypes: {
    animated: _propTypes["default"].bool,
    animatedWithMargin: _propTypes["default"].bool,
    prefixCls: _propTypes["default"].string,
    children: _propTypes["default"].any,
    activeKey: _propTypes["default"].string,
    style: _propTypes["default"].any,
    tabBarPosition: _propTypes["default"].string
  },
  getDefaultProps: function getDefaultProps() {
    return {
      animated: true
    };
  },
  getTabPanes: function getTabPanes() {
    var props = this.props;
    var activeKey = props.activeKey;
    var children = props.children;
    var newChildren = [];

    _react.Children.forEach(children, function (child, index) {
      if (!child) {
        return;
      }

      var key = (0, _utils.generateKey)(child.key, index);
      var active = activeKey === key;
      newChildren.push((0, _react.cloneElement)(child, {
        key: key,
        active: active,
        destroyInactiveTabPane: props.destroyInactiveTabPane,
        rootPrefixCls: props.prefixCls
      }));
    });

    return newChildren;
  },
  render: function render() {
    var _classnames;

    var props = this.props;
    var prefixCls = props.prefixCls,
        children = props.children,
        activeKey = props.activeKey,
        tabBarPosition = props.tabBarPosition,
        animated = props.animated,
        animatedWithMargin = props.animatedWithMargin;
    var style = props.style;
    var classes = (0, _classnames2["default"])((_classnames = {}, (0, _defineProperty2["default"])(_classnames, "".concat(prefixCls, "-content"), true), (0, _defineProperty2["default"])(_classnames, animated ? "".concat(prefixCls, "-content-animated") : "".concat(prefixCls, "-content-no-animated"), true), _classnames));

    if (animated) {
      var activeIndex = (0, _utils.getActiveIndex)(children, activeKey);

      if (activeIndex !== -1) {
        var animatedStyle = animatedWithMargin ? (0, _utils.getMarginStyle)(activeIndex, tabBarPosition) : (0, _utils.getTransformPropValue)((0, _utils.getTransformByIndex)(activeIndex, tabBarPosition));
        style = (0, _objectSpread2["default"])({}, style, {}, animatedStyle);
      } else {
        style = (0, _objectSpread2["default"])({}, style, {
          display: 'none'
        });
      }
    }

    return _react["default"].createElement("div", {
      className: classes,
      style: style
    }, this.getTabPanes());
  }
});
var _default = TabContent;
exports["default"] = _default;
//# sourceMappingURL=TabContent.js.map