MotionTreeNode.js 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. var _typeof = require("@babel/runtime/helpers/typeof");
  4. Object.defineProperty(exports, "__esModule", {
  5. value: true
  6. });
  7. exports.default = void 0;
  8. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  9. var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime/helpers/objectDestructuringEmpty"));
  10. var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
  11. var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
  12. var _classnames = _interopRequireDefault(require("classnames"));
  13. var _rcMotion = _interopRequireDefault(require("rc-motion"));
  14. var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
  15. var React = _interopRequireWildcard(require("react"));
  16. var _contextTypes = require("./contextTypes");
  17. var _TreeNode = _interopRequireDefault(require("./TreeNode"));
  18. var _useUnmount = _interopRequireDefault(require("./useUnmount"));
  19. var _treeUtil = require("./utils/treeUtil");
  20. var _excluded = ["className", "style", "motion", "motionNodes", "motionType", "onMotionStart", "onMotionEnd", "active", "treeNodeRequiredProps"];
  21. function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
  22. function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
  23. var MotionTreeNode = /*#__PURE__*/React.forwardRef(function (oriProps, ref) {
  24. var className = oriProps.className,
  25. style = oriProps.style,
  26. motion = oriProps.motion,
  27. motionNodes = oriProps.motionNodes,
  28. motionType = oriProps.motionType,
  29. onOriginMotionStart = oriProps.onMotionStart,
  30. onOriginMotionEnd = oriProps.onMotionEnd,
  31. active = oriProps.active,
  32. treeNodeRequiredProps = oriProps.treeNodeRequiredProps,
  33. props = (0, _objectWithoutProperties2.default)(oriProps, _excluded);
  34. var _React$useState = React.useState(true),
  35. _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
  36. visible = _React$useState2[0],
  37. setVisible = _React$useState2[1];
  38. var _React$useContext = React.useContext(_contextTypes.TreeContext),
  39. prefixCls = _React$useContext.prefixCls;
  40. // Calculate target visible here.
  41. // And apply in effect to make `leave` motion work.
  42. var targetVisible = motionNodes && motionType !== 'hide';
  43. (0, _useLayoutEffect.default)(function () {
  44. if (motionNodes) {
  45. if (targetVisible !== visible) {
  46. setVisible(targetVisible);
  47. }
  48. }
  49. }, [motionNodes]);
  50. var triggerMotionStart = function triggerMotionStart() {
  51. if (motionNodes) {
  52. onOriginMotionStart();
  53. }
  54. };
  55. // Should only trigger once
  56. var triggerMotionEndRef = React.useRef(false);
  57. var triggerMotionEnd = function triggerMotionEnd() {
  58. if (motionNodes && !triggerMotionEndRef.current) {
  59. triggerMotionEndRef.current = true;
  60. onOriginMotionEnd();
  61. }
  62. };
  63. // Effect if unmount
  64. (0, _useUnmount.default)(triggerMotionStart, triggerMotionEnd);
  65. // Motion end event
  66. var onVisibleChanged = function onVisibleChanged(nextVisible) {
  67. if (targetVisible === nextVisible) {
  68. triggerMotionEnd();
  69. }
  70. };
  71. if (motionNodes) {
  72. return /*#__PURE__*/React.createElement(_rcMotion.default, (0, _extends2.default)({
  73. ref: ref,
  74. visible: visible
  75. }, motion, {
  76. motionAppear: motionType === 'show',
  77. onVisibleChanged: onVisibleChanged
  78. }), function (_ref, motionRef) {
  79. var motionClassName = _ref.className,
  80. motionStyle = _ref.style;
  81. return /*#__PURE__*/React.createElement("div", {
  82. ref: motionRef,
  83. className: (0, _classnames.default)("".concat(prefixCls, "-treenode-motion"), motionClassName),
  84. style: motionStyle
  85. }, motionNodes.map(function (treeNode) {
  86. var restProps = Object.assign({}, ((0, _objectDestructuringEmpty2.default)(treeNode.data), treeNode.data)),
  87. title = treeNode.title,
  88. key = treeNode.key,
  89. isStart = treeNode.isStart,
  90. isEnd = treeNode.isEnd;
  91. delete restProps.children;
  92. var treeNodeProps = (0, _treeUtil.getTreeNodeProps)(key, treeNodeRequiredProps);
  93. return /*#__PURE__*/React.createElement(_TreeNode.default, (0, _extends2.default)({}, restProps, treeNodeProps, {
  94. title: title,
  95. active: active,
  96. data: treeNode.data,
  97. key: key,
  98. isStart: isStart,
  99. isEnd: isEnd
  100. }));
  101. }));
  102. });
  103. }
  104. return /*#__PURE__*/React.createElement(_TreeNode.default, (0, _extends2.default)({
  105. domRef: ref,
  106. className: className,
  107. style: style
  108. }, props, {
  109. active: active
  110. }));
  111. });
  112. if (process.env.NODE_ENV !== 'production') {
  113. MotionTreeNode.displayName = 'MotionTreeNode';
  114. }
  115. var _default = exports.default = MotionTreeNode;