1 | "use strict";
|
2 |
|
3 | var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
4 |
|
5 | var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
6 |
|
7 | Object.defineProperty(exports, "__esModule", {
|
8 | value: true
|
9 | });
|
10 | exports["default"] = void 0;
|
11 |
|
12 | var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
13 |
|
14 | var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
15 |
|
16 | var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
17 |
|
18 | var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
19 |
|
20 | var _react = _interopRequireWildcard(require("react"));
|
21 |
|
22 | var _classnames = _interopRequireDefault(require("classnames"));
|
23 |
|
24 | var _utils = require("./utils");
|
25 |
|
26 | var _TabsContext = _interopRequireDefault(require("./TabsContext"));
|
27 |
|
28 | var TabContent = (0, _react.forwardRef)(function TabContent(props, ref) {
|
29 | var destroyInactiveTabPane = props.destroyInactiveTabPane,
|
30 | animated = props.animated,
|
31 | animatedWithMargin = props.animatedWithMargin,
|
32 | style = props.style;
|
33 |
|
34 | var _useContext = (0, _react.useContext)(_TabsContext["default"]),
|
35 | prefixCls = _useContext.prefixCls,
|
36 | totalPanelsMap = _useContext.totalPanelsMap,
|
37 | activeKey = _useContext.activeKey,
|
38 | tabBarPosition = _useContext.tabBarPosition;
|
39 |
|
40 | var _useState = (0, _react.useState)(function () {
|
41 | return animated ? (0, _objectSpread2["default"])({}, style, {
|
42 | display: 'none'
|
43 | }) : style;
|
44 | }),
|
45 | _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
46 | mergedStyle = _useState2[0],
|
47 | setMergedStyle = _useState2[1];
|
48 |
|
49 | var classes = (0, _classnames["default"])("".concat(prefixCls, "-content"), animated ? "".concat(prefixCls, "-content-animated") : "".concat(prefixCls, "-content-no-animated"));
|
50 | (0, _react.useLayoutEffect)(function () {
|
51 | if (animated) {
|
52 | var activeIndex = (0, _utils.getActiveIndex)(totalPanelsMap, activeKey);
|
53 |
|
54 | if (activeIndex !== -1) {
|
55 | var animatedStyle = animatedWithMargin ? (0, _utils.getMarginStyle)(activeIndex, tabBarPosition) : (0, _utils.getTransformPropValue)((0, _utils.getTransformByIndex)(activeIndex, tabBarPosition));
|
56 | setMergedStyle((0, _objectSpread2["default"])({}, style, {}, animatedStyle));
|
57 | } else {
|
58 | setMergedStyle((0, _objectSpread2["default"])({}, style, {
|
59 | display: 'none'
|
60 | }));
|
61 | }
|
62 | } else {
|
63 | setMergedStyle(style);
|
64 | }
|
65 | }, [animated, totalPanelsMap, activeKey, tabBarPosition, style]);
|
66 |
|
67 | var getTabPanes = function getTabPanes() {
|
68 | return (0, _toConsumableArray2["default"])(totalPanelsMap.entries()).map(function (_ref2) {
|
69 | var _ref3 = (0, _slicedToArray2["default"])(_ref2, 2),
|
70 | key = _ref3[0],
|
71 | _ref = _ref3[1];
|
72 |
|
73 | var type = _ref.type,
|
74 | child = (0, _objectWithoutProperties2["default"])(_ref, ["type"]);
|
75 | return (0, _react.createElement)(type, (0, _objectSpread2["default"])({}, child, {
|
76 | key: key,
|
77 | active: activeKey === key,
|
78 | destroyInactiveTabPane: destroyInactiveTabPane,
|
79 | rootPrefixCls: prefixCls
|
80 | }));
|
81 | });
|
82 | };
|
83 |
|
84 | return _react["default"].createElement("div", {
|
85 | className: classes,
|
86 | style: mergedStyle,
|
87 | ref: ref
|
88 | }, getTabPanes());
|
89 | });
|
90 | TabContent.defaultProps = {
|
91 | animated: true
|
92 | };
|
93 | TabContent.displayName = 'TabContent';
|
94 | var _default = TabContent;
|
95 | exports["default"] = _default;
|
96 |
|