rc-motion - npm Package Compare versions

Comparing version 2.6.3 to 2.7.0

es/CSSMotion.js

@@ -5,3 +5,2 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
-
 /* eslint-disable react/default-props-match-prop-types, react/no-multi-comp, react/prop-types */
@@ -18,3 +17,3 @@ import * as React from 'react';
 import { isActive } from "./hooks/useStepQueue";
-
+import { Context } from "./context";
 /**
@@ -26,27 +25,26 @@ * `transitionSupport` is used for none transition test case.
   var transitionSupport = config;
-
   if (_typeof(config) === 'object') {
     transitionSupport = config.transitionSupport;
   }
-
-  function isSupportTransition(props) {
-    return !!(props.motionName && transitionSupport);
+  function isSupportTransition(props, contextMotion) {
+    return !!(props.motionName && transitionSupport && contextMotion !== false);
   }
-
   var CSSMotion = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var _props$visible = props.visible,
-        visible = _props$visible === void 0 ? true : _props$visible,
-        _props$removeOnLeave = props.removeOnLeave,
-        removeOnLeave = _props$removeOnLeave === void 0 ? true : _props$removeOnLeave,
-        forceRender = props.forceRender,
-        children = props.children,
-        motionName = props.motionName,
-        leavedClassName = props.leavedClassName,
-        eventProps = props.eventProps;
-    var supportMotion = isSupportTransition(props); // Ref to the react node, it may be a HTMLElement
+      visible = _props$visible === void 0 ? true : _props$visible,
+      _props$removeOnLeave = props.removeOnLeave,
+      removeOnLeave = _props$removeOnLeave === void 0 ? true : _props$removeOnLeave,
+      forceRender = props.forceRender,
+      children = props.children,
+      motionName = props.motionName,
+      leavedClassName = props.leavedClassName,
+      eventProps = props.eventProps;
+    var _React$useContext = React.useContext(Context),
+      contextMotion = _React$useContext.motion;
+    var supportMotion = isSupportTransition(props, contextMotion);
 
-    var nodeRef = useRef(); // Ref to the dom wrapper in case ref can not pass to HTMLElement
-
+    // Ref to the react node, it may be a HTMLElement
+    var nodeRef = useRef();
+    // Ref to the dom wrapper in case ref can not pass to HTMLElement
     var wrapperNodeRef = useRef();
-
     function getDomElement() {
@@ -64,34 +62,31 @@ try {
     }
+    var _useStatus = useStatus(supportMotion, visible, getDomElement, props),
+      _useStatus2 = _slicedToArray(_useStatus, 4),
+      status = _useStatus2[0],
+      statusStep = _useStatus2[1],
+      statusStyle = _useStatus2[2],
+      mergedVisible = _useStatus2[3];
 
-    var _useStatus = useStatus(supportMotion, visible, getDomElement, props),
-        _useStatus2 = _slicedToArray(_useStatus, 4),
-        status = _useStatus2[0],
-        statusStep = _useStatus2[1],
-        statusStyle = _useStatus2[2],
-        mergedVisible = _useStatus2[3]; // Record whether content has rendered
+    // Record whether content has rendered
     // Will return null for un-rendered even when `removeOnLeave={false}`
-
-
     var renderedRef = React.useRef(mergedVisible);
-
     if (mergedVisible) {
       renderedRef.current = true;
-    } // ====================== Refs ======================
+    }
 
-
+    // ====================== Refs ======================
     var setNodeRef = React.useCallback(function (node) {
       nodeRef.current = node;
       fillRef(ref, node);
-    }, [ref]); // ===================== Render =====================
+    }, [ref]);
 
+    // ===================== Render =====================
     var motionChildren;
-
     var mergedProps = _objectSpread(_objectSpread({}, eventProps), {}, {
       visible: visible
     });
-
     if (!children) {
       // No children
       motionChildren = null;
-    } else if (status === STATUS_NONE || !isSupportTransition(props)) {
+    } else if (status === STATUS_NONE || !isSupportTransition(props, contextMotion)) {
       // Stable children
@@ -115,6 +110,4 @@ if (mergedVisible) {
       var _classNames;
-
       // In motion
       var statusSuffix;
-
       if (statusStep === STEP_PREPARE) {
@@ -127,3 +120,2 @@ statusSuffix = 'prepare';
       }
-
       motionChildren = children(_objectSpread(_objectSpread({}, mergedProps), {}, {
@@ -133,9 +125,8 @@ className: classNames(getTransitionName(motionName, status), (_classNames = {}, _defineProperty(_classNames, getTransitionName(motionName, "".concat(status, "-").concat(statusSuffix)), statusSuffix), _defineProperty(_classNames, motionName, typeof motionName === 'string'), _classNames)),
       }), setNodeRef);
-    } // Auto inject ref if child node not have `ref` props
+    }
 
-
+    // Auto inject ref if child node not have `ref` props
     if ( /*#__PURE__*/React.isValidElement(motionChildren) && supportRef(motionChildren)) {
       var _ref = motionChildren,
-          originNodeRef = _ref.ref;
-
+        originNodeRef = _ref.ref;
       if (!originNodeRef) {
@@ -147,3 +138,2 @@ motionChildren = /*#__PURE__*/React.cloneElement(motionChildren, {
     }
-
     return /*#__PURE__*/React.createElement(DomWrapper, {
@@ -150,0 +140,0 @@ ref: wrapperNodeRef

es/CSSMotionList.js

@@ -11,4 +11,3 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 var _excluded = ["component", "children", "onVisibleChanged", "onAllRemoved"],
-    _excluded2 = ["status"];
-
+  _excluded2 = ["status"];
 /* eslint react/prop-types: 0 */
@@ -20,3 +19,2 @@ import * as React from 'react';
 var MOTION_PROP_NAMES = ['eventProps', 'visible', 'children', 'motionName', 'motionAppear', 'motionEnter', 'motionLeave', 'motionLeaveImmediately', 'motionDeadline', 'removeOnLeave', 'leavedClassName', 'onAppearStart', 'onAppearActive', 'onAppearEnd', 'onEnterStart', 'onEnterActive', 'onEnterEnd', 'onLeaveStart', 'onLeaveActive', 'onLeaveEnd'];
-
 /**
@@ -29,23 +27,15 @@ * Generate a CSSMotionList component with config
   var CSSMotion = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : OriginCSSMotion;
-
   var CSSMotionList = /*#__PURE__*/function (_React$Component) {
     _inherits(CSSMotionList, _React$Component);
-
     var _super = _createSuper(CSSMotionList);
-
     function CSSMotionList() {
       var _this;
-
       _classCallCheck(this, CSSMotionList);
-
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
       }
-
       _this = _super.call.apply(_super, [this].concat(args));
-
       _defineProperty(_assertThisInitialized(_this), "state", {
         keyEntities: []
       });
-
       _defineProperty(_assertThisInitialized(_this), "removeKey", function (removeKey) {
@@ -59,7 +49,5 @@ var keyEntities = _this.state.keyEntities;
         });
-
         _this.setState({
           keyEntities: nextKeyEntities
         });
-
         return nextKeyEntities.filter(function (_ref) {
@@ -70,6 +58,4 @@ var status = _ref.status;
       });
-
       return _this;
     }
-
     _createClass(CSSMotionList, [{
@@ -79,12 +65,9 @@ key: "render",
         var _this2 = this;
-
         var keyEntities = this.state.keyEntities;
-
         var _this$props = this.props,
-            component = _this$props.component,
-            children = _this$props.children,
-            _onVisibleChanged = _this$props.onVisibleChanged,
-            onAllRemoved = _this$props.onAllRemoved,
-            restProps = _objectWithoutProperties(_this$props, _excluded);
-
+          component = _this$props.component,
+          children = _this$props.children,
+          _onVisibleChanged = _this$props.onVisibleChanged,
+          onAllRemoved = _this$props.onAllRemoved,
+          restProps = _objectWithoutProperties(_this$props, _excluded);
         var Component = component || React.Fragment;
@@ -99,4 +82,3 @@ var motionProps = {};
           var status = _ref2.status,
-              eventProps = _objectWithoutProperties(_ref2, _excluded2);
-
+            eventProps = _objectWithoutProperties(_ref2, _excluded2);
           var visible = status === STATUS_ADD || status === STATUS_KEEP;
@@ -111,6 +93,4 @@ return /*#__PURE__*/React.createElement(CSSMotion, _extends({}, motionProps, {
               });
-
               if (!changedVisible) {
                 var restKeysCount = _this2.removeKey(eventProps.key);
-
                 if (restKeysCount === 0 && onAllRemoved) {
@@ -136,24 +116,22 @@ onAllRemoved();
               return entity.key === key;
-            }); // Remove if already mark as removed
+            });
 
+            // Remove if already mark as removed
             if (prevEntity && prevEntity.status === STATUS_REMOVED && entity.status === STATUS_REMOVE) {
               return false;
             }
-
             return true;
           })
         };
-      } // ZombieJ: Return the count of rest keys. It's safe to refactor if need more info.
+      }
 
+      // ZombieJ: Return the count of rest keys. It's safe to refactor if need more info.
     }]);
-
     return CSSMotionList;
   }(React.Component);
-
   _defineProperty(CSSMotionList, "defaultProps", {
     component: 'div'
   });
-
   return CSSMotionList;
 }
 export default genCSSMotionList(supportTransition);

es/DomWrapper.js

@@ -6,14 +6,9 @@ import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import * as React from 'react';
-
 var DomWrapper = /*#__PURE__*/function (_React$Component) {
   _inherits(DomWrapper, _React$Component);
-
   var _super = _createSuper(DomWrapper);
-
   function DomWrapper() {
     _classCallCheck(this, DomWrapper);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(DomWrapper, [{
@@ -25,6 +20,4 @@ key: "render",
   }]);
-
   return DomWrapper;
 }(React.Component);
-
 export default DomWrapper;

es/hooks/useDomMotionEvents.js

@@ -5,11 +5,14 @@ import * as React from 'react';
 export default (function (callback) {
-  var cacheElementRef = useRef(); // Cache callback
+  var cacheElementRef = useRef();
 
+  // Cache callback
   var callbackRef = useRef(callback);
-  callbackRef.current = callback; // Internal motion event handler
+  callbackRef.current = callback;
 
+  // Internal motion event handler
   var onInternalMotionEnd = React.useCallback(function (event) {
     callbackRef.current(event);
-  }, []); // Remove events
+  }, []);
 
+  // Remove events
   function removeMotionEvents(element) {
@@ -20,5 +23,5 @@ if (element) {
     }
-  } // Patch events
+  }
 
-
+  // Patch events
   function patchMotionEvents(element) {
@@ -28,12 +31,12 @@ if (cacheElementRef.current && cacheElementRef.current !== element) {
     }
-
     if (element && element !== cacheElementRef.current) {
       element.addEventListener(transitionEndName, onInternalMotionEnd);
-      element.addEventListener(animationEndName, onInternalMotionEnd); // Save as cache in case dom removed trigger by `motionDeadline`
+      element.addEventListener(animationEndName, onInternalMotionEnd);
 
+      // Save as cache in case dom removed trigger by `motionDeadline`
       cacheElementRef.current = element;
     }
-  } // Clean up when removed
+  }
 
-
+  // Clean up when removed
   React.useEffect(function () {
@@ -40,0 +43,0 @@ return function () {

es/hooks/useIsomorphicLayoutEffect.js

 import { useEffect, useLayoutEffect } from 'react';
-import canUseDom from "rc-util/es/Dom/canUseDom"; // It's safe to use `useLayoutEffect` but the warning is annoying
+import canUseDom from "rc-util/es/Dom/canUseDom";
 
+// It's safe to use `useLayoutEffect` but the warning is annoying
 var useIsomorphicLayoutEffect = canUseDom() ? useLayoutEffect : useEffect;
 export default useIsomorphicLayoutEffect;

es/hooks/useNextFrame.js

@@ -5,7 +5,5 @@ import * as React from 'react';
   var nextFrameRef = React.useRef(null);
-
   function cancelNextFrame() {
     raf.cancel(nextFrameRef.current);
   }
-
   function nextFrame(callback) {
@@ -27,3 +25,2 @@ var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
   }
-
   React.useEffect(function () {
@@ -30,0 +27,0 @@ return function () {

es/hooks/useStatus.js

@@ -13,52 +13,47 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
   var _ref$motionEnter = _ref.motionEnter,
-      motionEnter = _ref$motionEnter === void 0 ? true : _ref$motionEnter,
-      _ref$motionAppear = _ref.motionAppear,
-      motionAppear = _ref$motionAppear === void 0 ? true : _ref$motionAppear,
-      _ref$motionLeave = _ref.motionLeave,
-      motionLeave = _ref$motionLeave === void 0 ? true : _ref$motionLeave,
-      motionDeadline = _ref.motionDeadline,
-      motionLeaveImmediately = _ref.motionLeaveImmediately,
-      onAppearPrepare = _ref.onAppearPrepare,
-      onEnterPrepare = _ref.onEnterPrepare,
-      onLeavePrepare = _ref.onLeavePrepare,
-      onAppearStart = _ref.onAppearStart,
-      onEnterStart = _ref.onEnterStart,
-      onLeaveStart = _ref.onLeaveStart,
-      onAppearActive = _ref.onAppearActive,
-      onEnterActive = _ref.onEnterActive,
-      onLeaveActive = _ref.onLeaveActive,
-      onAppearEnd = _ref.onAppearEnd,
-      onEnterEnd = _ref.onEnterEnd,
-      onLeaveEnd = _ref.onLeaveEnd,
-      onVisibleChanged = _ref.onVisibleChanged;
-
+    motionEnter = _ref$motionEnter === void 0 ? true : _ref$motionEnter,
+    _ref$motionAppear = _ref.motionAppear,
+    motionAppear = _ref$motionAppear === void 0 ? true : _ref$motionAppear,
+    _ref$motionLeave = _ref.motionLeave,
+    motionLeave = _ref$motionLeave === void 0 ? true : _ref$motionLeave,
+    motionDeadline = _ref.motionDeadline,
+    motionLeaveImmediately = _ref.motionLeaveImmediately,
+    onAppearPrepare = _ref.onAppearPrepare,
+    onEnterPrepare = _ref.onEnterPrepare,
+    onLeavePrepare = _ref.onLeavePrepare,
+    onAppearStart = _ref.onAppearStart,
+    onEnterStart = _ref.onEnterStart,
+    onLeaveStart = _ref.onLeaveStart,
+    onAppearActive = _ref.onAppearActive,
+    onEnterActive = _ref.onEnterActive,
+    onLeaveActive = _ref.onLeaveActive,
+    onAppearEnd = _ref.onAppearEnd,
+    onEnterEnd = _ref.onEnterEnd,
+    onLeaveEnd = _ref.onLeaveEnd,
+    onVisibleChanged = _ref.onVisibleChanged;
   // Used for outer render usage to avoid `visible: false & status: none` to render nothing
   var _useState = useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      asyncVisible = _useState2[0],
-      setAsyncVisible = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    asyncVisible = _useState2[0],
+    setAsyncVisible = _useState2[1];
   var _useState3 = useState(STATUS_NONE),
-      _useState4 = _slicedToArray(_useState3, 2),
-      status = _useState4[0],
-      setStatus = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    status = _useState4[0],
+    setStatus = _useState4[1];
   var _useState5 = useState(null),
-      _useState6 = _slicedToArray(_useState5, 2),
-      style = _useState6[0],
-      setStyle = _useState6[1];
-
+    _useState6 = _slicedToArray(_useState5, 2),
+    style = _useState6[0],
+    setStyle = _useState6[1];
   var mountedRef = useRef(false);
-  var deadlineRef = useRef(null); // =========================== Dom Node ===========================
+  var deadlineRef = useRef(null);
 
+  // =========================== Dom Node ===========================
   function getDomElement() {
     return getElement();
-  } // ========================== Motion End ==========================
+  }
 
-
+  // ========================== Motion End ==========================
   var activeRef = useRef(false);
-
   function onInternalMotionEnd(event) {
     var element = getDomElement();
-
     if (event && !event.deadline && event.target !== element) {
@@ -70,6 +65,4 @@ // event exists
     }
-
     var currentActive = activeRef.current;
     var canEnd;
-
     if (status === STATUS_APPEAR && currentActive) {
@@ -81,5 +74,5 @@ canEnd = onAppearEnd === null || onAppearEnd === void 0 ? void 0 : onAppearEnd(element, event);
       canEnd = onLeaveEnd === null || onLeaveEnd === void 0 ? void 0 : onLeaveEnd(element, event);
-    } // Only update status when `canEnd` and not destroyed
+    }
 
-
+    // Only update status when `canEnd` and not destroyed
     if (status !== STATUS_NONE && currentActive && canEnd !== false) {
@@ -90,21 +83,16 @@ setStatus(STATUS_NONE, true);
   }
-
   var _useDomMotionEvents = useDomMotionEvents(onInternalMotionEnd),
-      _useDomMotionEvents2 = _slicedToArray(_useDomMotionEvents, 1),
-      patchMotionEvents = _useDomMotionEvents2[0]; // ============================= Step =============================
+    _useDomMotionEvents2 = _slicedToArray(_useDomMotionEvents, 1),
+    patchMotionEvents = _useDomMotionEvents2[0];
 
-
+  // ============================= Step =============================
   var eventHandlers = React.useMemo(function () {
     var _ref2, _ref3, _ref4;
-
     switch (status) {
       case STATUS_APPEAR:
         return _ref2 = {}, _defineProperty(_ref2, STEP_PREPARE, onAppearPrepare), _defineProperty(_ref2, STEP_START, onAppearStart), _defineProperty(_ref2, STEP_ACTIVE, onAppearActive), _ref2;
-
       case STATUS_ENTER:
         return _ref3 = {}, _defineProperty(_ref3, STEP_PREPARE, onEnterPrepare), _defineProperty(_ref3, STEP_START, onEnterStart), _defineProperty(_ref3, STEP_ACTIVE, onEnterActive), _ref3;
-
       case STATUS_LEAVE:
         return _ref4 = {}, _defineProperty(_ref4, STEP_PREPARE, onLeavePrepare), _defineProperty(_ref4, STEP_START, onLeaveStart), _defineProperty(_ref4, STEP_ACTIVE, onLeaveActive), _ref4;
-
       default:
@@ -114,46 +102,39 @@ return {};
   }, [status]);
-
   var _useStepQueue = useStepQueue(status, function (newStep) {
-    // Only prepare step can be skip
-    if (newStep === STEP_PREPARE) {
-      var onPrepare = eventHandlers[STEP_PREPARE];
-
-      if (!onPrepare) {
-        return SkipStep;
+      // Only prepare step can be skip
+      if (newStep === STEP_PREPARE) {
+        var onPrepare = eventHandlers[STEP_PREPARE];
+        if (!onPrepare) {
+          return SkipStep;
+        }
+        return onPrepare(getDomElement());
       }
 
-      return onPrepare(getDomElement());
-    } // Rest step is sync update
-
-
-    if (step in eventHandlers) {
-      var _eventHandlers$step;
-
-      setStyle(((_eventHandlers$step = eventHandlers[step]) === null || _eventHandlers$step === void 0 ? void 0 : _eventHandlers$step.call(eventHandlers, getDomElement(), null)) || null);
-    }
-
-    if (step === STEP_ACTIVE) {
-      // Patch events when motion needed
-      patchMotionEvents(getDomElement());
-
-      if (motionDeadline > 0) {
-        clearTimeout(deadlineRef.current);
-        deadlineRef.current = setTimeout(function () {
-          onInternalMotionEnd({
-            deadline: true
-          });
-        }, motionDeadline);
+      // Rest step is sync update
+      if (step in eventHandlers) {
+        var _eventHandlers$step;
+        setStyle(((_eventHandlers$step = eventHandlers[step]) === null || _eventHandlers$step === void 0 ? void 0 : _eventHandlers$step.call(eventHandlers, getDomElement(), null)) || null);
       }
-    }
+      if (step === STEP_ACTIVE) {
+        // Patch events when motion needed
+        patchMotionEvents(getDomElement());
+        if (motionDeadline > 0) {
+          clearTimeout(deadlineRef.current);
+          deadlineRef.current = setTimeout(function () {
+            onInternalMotionEnd({
+              deadline: true
+            });
+          }, motionDeadline);
+        }
+      }
+      return DoStep;
+    }),
+    _useStepQueue2 = _slicedToArray(_useStepQueue, 2),
+    startStep = _useStepQueue2[0],
+    step = _useStepQueue2[1];
+  var active = isActive(step);
+  activeRef.current = active;
 
-    return DoStep;
-  }),
-      _useStepQueue2 = _slicedToArray(_useStepQueue, 2),
-      startStep = _useStepQueue2[0],
-      step = _useStepQueue2[1];
-
-  var active = isActive(step);
-  activeRef.current = active; // ============================ Status ============================
+  // ============================ Status ============================
   // Update with new status
-
   useIsomorphicLayoutEffect(function () {
@@ -163,24 +144,23 @@ setAsyncVisible(visible);
     mountedRef.current = true;
-
     if (!supportMotion) {
       return;
     }
+    var nextStatus;
 
-    var nextStatus; // Appear
-
+    // Appear
     if (!isMounted && visible && motionAppear) {
       nextStatus = STATUS_APPEAR;
-    } // Enter
+    }
 
-
+    // Enter
     if (isMounted && visible && motionEnter) {
       nextStatus = STATUS_ENTER;
-    } // Leave
+    }
 
-
+    // Leave
     if (isMounted && !visible && motionLeave || !isMounted && motionLeaveImmediately && !visible && motionLeave) {
       nextStatus = STATUS_LEAVE;
-    } // Update to next status
+    }
 
-
+    // Update to next status
     if (nextStatus) {
@@ -190,9 +170,13 @@ setStatus(nextStatus);
     }
-  }, [visible]); // ============================ Effect ============================
+  }, [visible]);
+
+  // ============================ Effect ============================
   // Reset when motion changed
-
   useEffect(function () {
-    if ( // Cancel appear
-    status === STATUS_APPEAR && !motionAppear || // Cancel enter
-    status === STATUS_ENTER && !motionEnter || // Cancel leave
+    if (
+    // Cancel appear
+    status === STATUS_APPEAR && !motionAppear ||
+    // Cancel enter
+    status === STATUS_ENTER && !motionEnter ||
+    // Cancel leave
     status === STATUS_LEAVE && !motionLeave) {
@@ -207,4 +191,5 @@ setStatus(STATUS_NONE);
     };
-  }, []); // Trigger `onVisibleChanged`
+  }, []);
 
+  // Trigger `onVisibleChanged`
   var firstMountChangeRef = React.useRef(false);
@@ -216,3 +201,2 @@ useEffect(function () {
     }
-
     if (asyncVisible !== undefined && status === STATUS_NONE) {
@@ -223,9 +207,8 @@ // Skip first render is invisible since it's nothing changed
       }
-
       firstMountChangeRef.current = true;
     }
-  }, [asyncVisible, status]); // ============================ Styles ============================
+  }, [asyncVisible, status]);
 
+  // ============================ Styles ============================
   var mergedStyle = style;
-
   if (eventHandlers[STEP_PREPARE] && step === STEP_START) {
@@ -236,4 +219,3 @@ mergedStyle = _objectSpread({
   }
-
   return [status, step, mergedStyle, asyncVisible !== null && asyncVisible !== void 0 ? asyncVisible : visible];
 }

es/hooks/useStepQueue.js

@@ -8,7 +8,6 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 var STEP_QUEUE = [STEP_PREPARE, STEP_START, STEP_ACTIVE, STEP_ACTIVATED];
+
 /** Skip current step */
-
 export var SkipStep = false;
 /** Current step should be update in */
-
 export var DoStep = true;
@@ -20,15 +19,12 @@ export function isActive(step) {
   var _useState = useState(STEP_NONE),
-      _useState2 = _slicedToArray(_useState, 2),
-      step = _useState2[0],
-      setStep = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    step = _useState2[0],
+    setStep = _useState2[1];
   var _useNextFrame = useNextFrame(),
-      _useNextFrame2 = _slicedToArray(_useNextFrame, 2),
-      nextFrame = _useNextFrame2[0],
-      cancelNextFrame = _useNextFrame2[1];
-
+    _useNextFrame2 = _slicedToArray(_useNextFrame, 2),
+    nextFrame = _useNextFrame2[0],
+    cancelNextFrame = _useNextFrame2[1];
   function startQueue() {
     setStep(STEP_PREPARE, true);
   }
-
   useIsomorphicLayoutEffect(function () {
@@ -39,3 +35,2 @@ if (step !== STEP_NONE && step !== STEP_ACTIVATED) {
       var result = callback(step);
-
       if (result === SkipStep) {
@@ -52,3 +47,2 @@ // Skip when no needed
           }
-
           if (result === true) {
@@ -55,0 +49,0 @@ doNext();

es/index.d.ts

@@ -6,4 +6,5 @@ import CSSMotion from './CSSMotion';
 import type { MotionEventHandler, MotionEndEventHandler } from './interface';
+export { default as Provider } from './context';
 export { CSSMotionList };
 export type { CSSMotionProps, CSSMotionListProps, MotionEventHandler, MotionEndEventHandler, };
 export default CSSMotion;

es/index.js

 import CSSMotion from "./CSSMotion";
 import CSSMotionList from "./CSSMotionList";
+export { default as Provider } from "./context";
 export { CSSMotionList };
 export default CSSMotion;

es/util/diff.js

@@ -9,3 +9,2 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
   var keyObj;
-
   if (key && _typeof(key) === 'object' && 'key' in key) {
@@ -18,3 +17,2 @@ keyObj = key;
   }
-
   return _objectSpread(_objectSpread({}, keyObj), {}, {
@@ -35,10 +33,9 @@ key: String(keyObj.key)
   var prevKeyObjects = parseKeys(prevKeys);
-  var currentKeyObjects = parseKeys(currentKeys); // Check prev keys to insert or keep
+  var currentKeyObjects = parseKeys(currentKeys);
 
+  // Check prev keys to insert or keep
   prevKeyObjects.forEach(function (keyObj) {
     var hit = false;
-
     for (var i = currentIndex; i < currentLen; i += 1) {
       var currentKeyObj = currentKeyObjects[i];
-
       if (currentKeyObj.key === keyObj.key) {
@@ -54,3 +51,2 @@ // New added keys should add before current key
         }
-
         list.push(_objectSpread(_objectSpread({}, currentKeyObj), {}, {
@@ -63,5 +59,5 @@ status: STATUS_KEEP
       }
-    } // If not hit, it means key is removed
+    }
 
-
+    // If not hit, it means key is removed
     if (!hit) {
@@ -72,4 +68,5 @@ list.push(_objectSpread(_objectSpread({}, keyObj), {}, {
     }
-  }); // Add rest to the list
+  });
 
+  // Add rest to the list
   if (currentIndex < currentLen) {
@@ -82,2 +79,3 @@ list = list.concat(currentKeyObjects.slice(currentIndex).map(function (obj) {
   }
+
   /**
@@ -87,4 +85,2 @@ * Merge same key when it remove and add again:
    */
-
-
   var keys = {};
@@ -102,6 +98,7 @@ list.forEach(function (_ref) {
       var key = _ref2.key,
-          status = _ref2.status;
+        status = _ref2.status;
       return key !== matchKey || status !== STATUS_REMOVE;
-    }); // Update `STATUS_ADD` to `STATUS_KEEP`
+    });
 
+    // Update `STATUS_ADD` to `STATUS_KEEP`
     list.forEach(function (node) {
@@ -108,0 +105,0 @@ if (node.key === matchKey) {

es/util/motion.js

 import _typeof from "@babel/runtime/helpers/esm/typeof";
 import canUseDOM from "rc-util/es/Dom/canUseDom";
-
 // ================= Transition =================
@@ -15,3 +14,2 @@ // Event wrapper. Copy from react source code
 }
-
 export function getVendorPrefixes(domSupport, win) {
@@ -22,3 +20,2 @@ var prefixes = {
   };
-
   if (domSupport) {
@@ -28,3 +25,2 @@ if (!('AnimationEvent' in win)) {
     }
-
     if (!('TransitionEvent' in win)) {
@@ -34,3 +30,2 @@ delete prefixes.transitionend.transition;
   }
-
   return prefixes;
@@ -40,9 +35,6 @@ }
 var style = {};
-
 if (canUseDOM()) {
   var _document$createEleme = document.createElement('div');
-
   style = _document$createEleme.style;
 }
-
 var prefixedEventNames = {};
@@ -53,12 +45,8 @@ export function getVendorPrefixedEventName(eventName) {
   }
-
   var prefixMap = vendorPrefixes[eventName];
-
   if (prefixMap) {
     var stylePropList = Object.keys(prefixMap);
     var len = stylePropList.length;
-
     for (var i = 0; i < len; i += 1) {
       var styleProp = stylePropList[i];
-
       if (Object.prototype.hasOwnProperty.call(prefixMap, styleProp) && styleProp in style) {
@@ -70,3 +58,2 @@ prefixedEventNames[eventName] = prefixMap[styleProp];
   }
-
   return '';
@@ -81,3 +68,2 @@ }
   if (!transitionName) return null;
-
   if (_typeof(transitionName) === 'object') {
@@ -89,4 +75,3 @@ var type = transitionType.replace(/-\w/g, function (match) {
   }
-
   return "".concat(transitionName, "-").concat(transitionType);
 }

lib/CSSMotion.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof3 = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -12,33 +10,18 @@ value: true
 exports.genCSSMotion = genCSSMotion;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _findDOMNode = _interopRequireDefault(require("rc-util/lib/Dom/findDOMNode"));
-
 var _ref2 = require("rc-util/lib/ref");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _motion = require("./util/motion");
-
 var _interface = require("./interface");
-
 var _useStatus3 = _interopRequireDefault(require("./hooks/useStatus"));
-
 var _DomWrapper = _interopRequireDefault(require("./DomWrapper"));
-
 var _useStepQueue = require("./hooks/useStepQueue");
-
+var _context = require("./context");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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; }
-
 /* eslint-disable react/default-props-match-prop-types, react/no-multi-comp, react/prop-types */
@@ -52,27 +35,26 @@
   var transitionSupport = config;
-
   if ((0, _typeof2.default)(config) === 'object') {
     transitionSupport = config.transitionSupport;
   }
-
-  function isSupportTransition(props) {
-    return !!(props.motionName && transitionSupport);
+  function isSupportTransition(props, contextMotion) {
+    return !!(props.motionName && transitionSupport && contextMotion !== false);
   }
-
   var CSSMotion = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var _props$visible = props.visible,
-        visible = _props$visible === void 0 ? true : _props$visible,
-        _props$removeOnLeave = props.removeOnLeave,
-        removeOnLeave = _props$removeOnLeave === void 0 ? true : _props$removeOnLeave,
-        forceRender = props.forceRender,
-        children = props.children,
-        motionName = props.motionName,
-        leavedClassName = props.leavedClassName,
-        eventProps = props.eventProps;
-    var supportMotion = isSupportTransition(props); // Ref to the react node, it may be a HTMLElement
+      visible = _props$visible === void 0 ? true : _props$visible,
+      _props$removeOnLeave = props.removeOnLeave,
+      removeOnLeave = _props$removeOnLeave === void 0 ? true : _props$removeOnLeave,
+      forceRender = props.forceRender,
+      children = props.children,
+      motionName = props.motionName,
+      leavedClassName = props.leavedClassName,
+      eventProps = props.eventProps;
+    var _React$useContext = React.useContext(_context.Context),
+      contextMotion = _React$useContext.motion;
+    var supportMotion = isSupportTransition(props, contextMotion);
 
-    var nodeRef = (0, React.useRef)(); // Ref to the dom wrapper in case ref can not pass to HTMLElement
-
+    // Ref to the react node, it may be a HTMLElement
+    var nodeRef = (0, React.useRef)();
+    // Ref to the dom wrapper in case ref can not pass to HTMLElement
     var wrapperNodeRef = (0, React.useRef)();
-
     function getDomElement() {
@@ -90,24 +72,23 @@ try {
     }
+    var _useStatus = (0, _useStatus3.default)(supportMotion, visible, getDomElement, props),
+      _useStatus2 = (0, _slicedToArray2.default)(_useStatus, 4),
+      status = _useStatus2[0],
+      statusStep = _useStatus2[1],
+      statusStyle = _useStatus2[2],
+      mergedVisible = _useStatus2[3];
 
-    var _useStatus = (0, _useStatus3.default)(supportMotion, visible, getDomElement, props),
-        _useStatus2 = (0, _slicedToArray2.default)(_useStatus, 4),
-        status = _useStatus2[0],
-        statusStep = _useStatus2[1],
-        statusStyle = _useStatus2[2],
-        mergedVisible = _useStatus2[3]; // Record whether content has rendered
+    // Record whether content has rendered
     // Will return null for un-rendered even when `removeOnLeave={false}`
-
-
     var renderedRef = React.useRef(mergedVisible);
-
     if (mergedVisible) {
       renderedRef.current = true;
-    } // ====================== Refs ======================
+    }
 
-
+    // ====================== Refs ======================
     var setNodeRef = React.useCallback(function (node) {
       nodeRef.current = node;
       (0, _ref2.fillRef)(ref, node);
-    }, [ref]); // ===================== Render =====================
+    }, [ref]);
 
+    // ===================== Render =====================
     var motionChildren;
@@ -117,7 +98,6 @@ var mergedProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, eventProps), {}, {
     });
-
     if (!children) {
       // No children
       motionChildren = null;
-    } else if (status === _interface.STATUS_NONE || !isSupportTransition(props)) {
+    } else if (status === _interface.STATUS_NONE || !isSupportTransition(props, contextMotion)) {
       // Stable children
@@ -141,6 +121,4 @@ if (mergedVisible) {
       var _classNames;
-
       // In motion
       var statusSuffix;
-
       if (statusStep === _interface.STEP_PREPARE) {
@@ -153,3 +131,2 @@ statusSuffix = 'prepare';
       }
-
       motionChildren = children((0, _objectSpread2.default)((0, _objectSpread2.default)({}, mergedProps), {}, {
@@ -159,9 +136,8 @@ className: (0, _classnames.default)((0, _motion.getTransitionName)(motionName, status), (_classNames = {}, (0, _defineProperty2.default)(_classNames, (0, _motion.getTransitionName)(motionName, "".concat(status, "-").concat(statusSuffix)), statusSuffix), (0, _defineProperty2.default)(_classNames, motionName, typeof motionName === 'string'), _classNames)),
       }), setNodeRef);
-    } // Auto inject ref if child node not have `ref` props
+    }
 
-
+    // Auto inject ref if child node not have `ref` props
     if ( /*#__PURE__*/React.isValidElement(motionChildren) && (0, _ref2.supportRef)(motionChildren)) {
       var _ref = motionChildren,
-          originNodeRef = _ref.ref;
-
+        originNodeRef = _ref.ref;
       if (!originNodeRef) {
@@ -173,3 +149,2 @@ motionChildren = /*#__PURE__*/React.cloneElement(motionChildren, {
     }
-
     return /*#__PURE__*/React.createElement(_DomWrapper.default, {
@@ -182,5 +157,3 @@ ref: wrapperNodeRef
 }
-
 var _default = genCSSMotion(_motion.supportTransition);
-
 exports.default = _default;

lib/CSSMotionList.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -12,38 +10,20 @@ value: true
 exports.genCSSMotionList = genCSSMotionList;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
 var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
 var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _CSSMotion = _interopRequireDefault(require("./CSSMotion"));
-
 var _motion = require("./util/motion");
-
 var _diff = require("./util/diff");
-
 var _excluded = ["component", "children", "onVisibleChanged", "onAllRemoved"],
-    _excluded2 = ["status"];
-
+  _excluded2 = ["status"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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 MOTION_PROP_NAMES = ['eventProps', 'visible', 'children', 'motionName', 'motionAppear', 'motionEnter', 'motionLeave', 'motionLeaveImmediately', 'motionDeadline', 'removeOnLeave', 'leavedClassName', 'onAppearStart', 'onAppearActive', 'onAppearEnd', 'onEnterStart', 'onEnterActive', 'onEnterEnd', 'onLeaveStart', 'onLeaveActive', 'onLeaveEnd'];
-
 /**
@@ -56,17 +36,11 @@ * Generate a CSSMotionList component with config
   var CSSMotion = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _CSSMotion.default;
-
   var CSSMotionList = /*#__PURE__*/function (_React$Component) {
     (0, _inherits2.default)(CSSMotionList, _React$Component);
-
     var _super = (0, _createSuper2.default)(CSSMotionList);
-
     function CSSMotionList() {
       var _this;
-
       (0, _classCallCheck2.default)(this, CSSMotionList);
-
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
       }
-
       _this = _super.call.apply(_super, [this].concat(args));
@@ -84,7 +58,5 @@ (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
         });
-
         _this.setState({
           keyEntities: nextKeyEntities
         });
-
         return nextKeyEntities.filter(function (_ref) {
@@ -97,3 +69,2 @@ var status = _ref.status;
     }
-
     (0, _createClass2.default)(CSSMotionList, [{
@@ -103,10 +74,9 @@ key: "render",
         var _this2 = this;
-
         var keyEntities = this.state.keyEntities;
         var _this$props = this.props,
-            component = _this$props.component,
-            children = _this$props.children,
-            _onVisibleChanged = _this$props.onVisibleChanged,
-            onAllRemoved = _this$props.onAllRemoved,
-            restProps = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
+          component = _this$props.component,
+          children = _this$props.children,
+          _onVisibleChanged = _this$props.onVisibleChanged,
+          onAllRemoved = _this$props.onAllRemoved,
+          restProps = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
         var Component = component || React.Fragment;
@@ -121,3 +91,3 @@ var motionProps = {};
           var status = _ref2.status,
-              eventProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
+            eventProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
           var visible = status === _diff.STATUS_ADD || status === _diff.STATUS_KEEP;
@@ -132,6 +102,4 @@ return /*#__PURE__*/React.createElement(CSSMotion, (0, _extends2.default)({}, motionProps, {
               });
-
               if (!changedVisible) {
                 var restKeysCount = _this2.removeKey(eventProps.key);
-
                 if (restKeysCount === 0 && onAllRemoved) {
@@ -157,17 +125,17 @@ onAllRemoved();
               return entity.key === key;
-            }); // Remove if already mark as removed
+            });
 
+            // Remove if already mark as removed
             if (prevEntity && prevEntity.status === _diff.STATUS_REMOVED && entity.status === _diff.STATUS_REMOVE) {
               return false;
             }
-
             return true;
           })
         };
-      } // ZombieJ: Return the count of rest keys. It's safe to refactor if need more info.
+      }
 
+      // ZombieJ: Return the count of rest keys. It's safe to refactor if need more info.
     }]);
     return CSSMotionList;
   }(React.Component);
-
   (0, _defineProperty2.default)(CSSMotionList, "defaultProps", {
@@ -178,5 +146,3 @@ component: 'div'
 }
-
 var _default = genCSSMotionList(_motion.supportTransition);
-
 exports.default = _default;

lib/DomWrapper.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,22 +9,12 @@ value: true
 exports.default = void 0;
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
 var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-
 var React = _interopRequireWildcard(require("react"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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 DomWrapper = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(DomWrapper, _React$Component);
-
   var _super = (0, _createSuper2.default)(DomWrapper);
-
   function DomWrapper() {
@@ -36,3 +24,2 @@ (0, _classCallCheck2.default)(this, DomWrapper);
   }
-
   (0, _createClass2.default)(DomWrapper, [{
@@ -46,4 +33,3 @@ key: "render",
 }(React.Component);
-
 var _default = DomWrapper;
 exports.default = _default;

lib/hooks/useDomMotionEvents.js

 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,21 +8,19 @@ value: true
 exports.default = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 var _motion = require("../util/motion");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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 _default = function _default(callback) {
-  var cacheElementRef = (0, React.useRef)(); // Cache callback
+  var cacheElementRef = (0, React.useRef)();
 
+  // Cache callback
   var callbackRef = (0, React.useRef)(callback);
-  callbackRef.current = callback; // Internal motion event handler
+  callbackRef.current = callback;
 
+  // Internal motion event handler
   var onInternalMotionEnd = React.useCallback(function (event) {
     callbackRef.current(event);
-  }, []); // Remove events
+  }, []);
 
+  // Remove events
   function removeMotionEvents(element) {
@@ -34,5 +31,5 @@ if (element) {
     }
-  } // Patch events
+  }
 
-
+  // Patch events
   function patchMotionEvents(element) {
@@ -42,12 +39,12 @@ if (cacheElementRef.current && cacheElementRef.current !== element) {
     }
-
     if (element && element !== cacheElementRef.current) {
       element.addEventListener(_motion.transitionEndName, onInternalMotionEnd);
-      element.addEventListener(_motion.animationEndName, onInternalMotionEnd); // Save as cache in case dom removed trigger by `motionDeadline`
+      element.addEventListener(_motion.animationEndName, onInternalMotionEnd);
 
+      // Save as cache in case dom removed trigger by `motionDeadline`
       cacheElementRef.current = element;
     }
-  } // Clean up when removed
+  }
 
-
+  // Clean up when removed
   React.useEffect(function () {
@@ -60,3 +57,2 @@ return function () {
 };
-
 exports.default = _default;

lib/hooks/useIsomorphicLayoutEffect.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,7 +8,4 @@ value: true
 exports.default = void 0;
-
 var _react = require("react");
-
 var _canUseDom = _interopRequireDefault(require("rc-util/lib/Dom/canUseDom"));
-
 // It's safe to use `useLayoutEffect` but the warning is annoying
@@ -16,0 +12,0 @@ var useIsomorphicLayoutEffect = (0, _canUseDom.default)() ? _react.useLayoutEffect : _react.useEffect;

lib/hooks/useNextFrame.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,18 +9,11 @@ value: true
 exports.default = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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 _default = function _default() {
   var nextFrameRef = React.useRef(null);
-
   function cancelNextFrame() {
     _raf.default.cancel(nextFrameRef.current);
   }
-
   function nextFrame(callback) {
@@ -44,3 +35,2 @@ var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
   }
-
   React.useEffect(function () {
@@ -53,3 +43,2 @@ return function () {
 };
-
 exports.default = _default;

lib/hooks/useStatus.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,77 +9,60 @@ value: true
 exports.default = useStatus;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _useState7 = _interopRequireDefault(require("rc-util/lib/hooks/useState"));
-
 var _interface = require("../interface");
-
 var _useStepQueue3 = _interopRequireWildcard(require("./useStepQueue"));
-
 var _useDomMotionEvents3 = _interopRequireDefault(require("./useDomMotionEvents"));
-
 var _useIsomorphicLayoutEffect = _interopRequireDefault(require("./useIsomorphicLayoutEffect"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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; }
-
 function useStatus(supportMotion, visible, getElement, _ref) {
   var _ref$motionEnter = _ref.motionEnter,
-      motionEnter = _ref$motionEnter === void 0 ? true : _ref$motionEnter,
-      _ref$motionAppear = _ref.motionAppear,
-      motionAppear = _ref$motionAppear === void 0 ? true : _ref$motionAppear,
-      _ref$motionLeave = _ref.motionLeave,
-      motionLeave = _ref$motionLeave === void 0 ? true : _ref$motionLeave,
-      motionDeadline = _ref.motionDeadline,
-      motionLeaveImmediately = _ref.motionLeaveImmediately,
-      onAppearPrepare = _ref.onAppearPrepare,
-      onEnterPrepare = _ref.onEnterPrepare,
-      onLeavePrepare = _ref.onLeavePrepare,
-      onAppearStart = _ref.onAppearStart,
-      onEnterStart = _ref.onEnterStart,
-      onLeaveStart = _ref.onLeaveStart,
-      onAppearActive = _ref.onAppearActive,
-      onEnterActive = _ref.onEnterActive,
-      onLeaveActive = _ref.onLeaveActive,
-      onAppearEnd = _ref.onAppearEnd,
-      onEnterEnd = _ref.onEnterEnd,
-      onLeaveEnd = _ref.onLeaveEnd,
-      onVisibleChanged = _ref.onVisibleChanged;
-
+    motionEnter = _ref$motionEnter === void 0 ? true : _ref$motionEnter,
+    _ref$motionAppear = _ref.motionAppear,
+    motionAppear = _ref$motionAppear === void 0 ? true : _ref$motionAppear,
+    _ref$motionLeave = _ref.motionLeave,
+    motionLeave = _ref$motionLeave === void 0 ? true : _ref$motionLeave,
+    motionDeadline = _ref.motionDeadline,
+    motionLeaveImmediately = _ref.motionLeaveImmediately,
+    onAppearPrepare = _ref.onAppearPrepare,
+    onEnterPrepare = _ref.onEnterPrepare,
+    onLeavePrepare = _ref.onLeavePrepare,
+    onAppearStart = _ref.onAppearStart,
+    onEnterStart = _ref.onEnterStart,
+    onLeaveStart = _ref.onLeaveStart,
+    onAppearActive = _ref.onAppearActive,
+    onEnterActive = _ref.onEnterActive,
+    onLeaveActive = _ref.onLeaveActive,
+    onAppearEnd = _ref.onAppearEnd,
+    onEnterEnd = _ref.onEnterEnd,
+    onLeaveEnd = _ref.onLeaveEnd,
+    onVisibleChanged = _ref.onVisibleChanged;
   // Used for outer render usage to avoid `visible: false & status: none` to render nothing
   var _useState = (0, _useState7.default)(),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      asyncVisible = _useState2[0],
-      setAsyncVisible = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    asyncVisible = _useState2[0],
+    setAsyncVisible = _useState2[1];
   var _useState3 = (0, _useState7.default)(_interface.STATUS_NONE),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      status = _useState4[0],
-      setStatus = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    status = _useState4[0],
+    setStatus = _useState4[1];
   var _useState5 = (0, _useState7.default)(null),
-      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      style = _useState6[0],
-      setStyle = _useState6[1];
-
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    style = _useState6[0],
+    setStyle = _useState6[1];
   var mountedRef = (0, React.useRef)(false);
-  var deadlineRef = (0, React.useRef)(null); // =========================== Dom Node ===========================
+  var deadlineRef = (0, React.useRef)(null);
 
+  // =========================== Dom Node ===========================
   function getDomElement() {
     return getElement();
-  } // ========================== Motion End ==========================
+  }
 
-
+  // ========================== Motion End ==========================
   var activeRef = (0, React.useRef)(false);
-
   function onInternalMotionEnd(event) {
     var element = getDomElement();
-
     if (event && !event.deadline && event.target !== element) {
@@ -93,6 +74,4 @@ // event exists
     }
-
     var currentActive = activeRef.current;
     var canEnd;
-
     if (status === _interface.STATUS_APPEAR && currentActive) {
@@ -104,5 +83,5 @@ canEnd = onAppearEnd === null || onAppearEnd === void 0 ? void 0 : onAppearEnd(element, event);
       canEnd = onLeaveEnd === null || onLeaveEnd === void 0 ? void 0 : onLeaveEnd(element, event);
-    } // Only update status when `canEnd` and not destroyed
+    }
 
-
+    // Only update status when `canEnd` and not destroyed
     if (status !== _interface.STATUS_NONE && currentActive && canEnd !== false) {
@@ -113,21 +92,16 @@ setStatus(_interface.STATUS_NONE, true);
   }
-
   var _useDomMotionEvents = (0, _useDomMotionEvents3.default)(onInternalMotionEnd),
-      _useDomMotionEvents2 = (0, _slicedToArray2.default)(_useDomMotionEvents, 1),
-      patchMotionEvents = _useDomMotionEvents2[0]; // ============================= Step =============================
+    _useDomMotionEvents2 = (0, _slicedToArray2.default)(_useDomMotionEvents, 1),
+    patchMotionEvents = _useDomMotionEvents2[0];
 
-
+  // ============================= Step =============================
   var eventHandlers = React.useMemo(function () {
     var _ref2, _ref3, _ref4;
-
     switch (status) {
       case _interface.STATUS_APPEAR:
         return _ref2 = {}, (0, _defineProperty2.default)(_ref2, _interface.STEP_PREPARE, onAppearPrepare), (0, _defineProperty2.default)(_ref2, _interface.STEP_START, onAppearStart), (0, _defineProperty2.default)(_ref2, _interface.STEP_ACTIVE, onAppearActive), _ref2;
-
       case _interface.STATUS_ENTER:
         return _ref3 = {}, (0, _defineProperty2.default)(_ref3, _interface.STEP_PREPARE, onEnterPrepare), (0, _defineProperty2.default)(_ref3, _interface.STEP_START, onEnterStart), (0, _defineProperty2.default)(_ref3, _interface.STEP_ACTIVE, onEnterActive), _ref3;
-
       case _interface.STATUS_LEAVE:
         return _ref4 = {}, (0, _defineProperty2.default)(_ref4, _interface.STEP_PREPARE, onLeavePrepare), (0, _defineProperty2.default)(_ref4, _interface.STEP_START, onLeaveStart), (0, _defineProperty2.default)(_ref4, _interface.STEP_ACTIVE, onLeaveActive), _ref4;
-
       default:
@@ -137,46 +111,39 @@ return {};
   }, [status]);
-
   var _useStepQueue = (0, _useStepQueue3.default)(status, function (newStep) {
-    // Only prepare step can be skip
-    if (newStep === _interface.STEP_PREPARE) {
-      var onPrepare = eventHandlers[_interface.STEP_PREPARE];
-
-      if (!onPrepare) {
-        return _useStepQueue3.SkipStep;
+      // Only prepare step can be skip
+      if (newStep === _interface.STEP_PREPARE) {
+        var onPrepare = eventHandlers[_interface.STEP_PREPARE];
+        if (!onPrepare) {
+          return _useStepQueue3.SkipStep;
+        }
+        return onPrepare(getDomElement());
       }
 
-      return onPrepare(getDomElement());
-    } // Rest step is sync update
-
-
-    if (step in eventHandlers) {
-      var _eventHandlers$step;
-
-      setStyle(((_eventHandlers$step = eventHandlers[step]) === null || _eventHandlers$step === void 0 ? void 0 : _eventHandlers$step.call(eventHandlers, getDomElement(), null)) || null);
-    }
-
-    if (step === _interface.STEP_ACTIVE) {
-      // Patch events when motion needed
-      patchMotionEvents(getDomElement());
-
-      if (motionDeadline > 0) {
-        clearTimeout(deadlineRef.current);
-        deadlineRef.current = setTimeout(function () {
-          onInternalMotionEnd({
-            deadline: true
-          });
-        }, motionDeadline);
+      // Rest step is sync update
+      if (step in eventHandlers) {
+        var _eventHandlers$step;
+        setStyle(((_eventHandlers$step = eventHandlers[step]) === null || _eventHandlers$step === void 0 ? void 0 : _eventHandlers$step.call(eventHandlers, getDomElement(), null)) || null);
       }
-    }
+      if (step === _interface.STEP_ACTIVE) {
+        // Patch events when motion needed
+        patchMotionEvents(getDomElement());
+        if (motionDeadline > 0) {
+          clearTimeout(deadlineRef.current);
+          deadlineRef.current = setTimeout(function () {
+            onInternalMotionEnd({
+              deadline: true
+            });
+          }, motionDeadline);
+        }
+      }
+      return _useStepQueue3.DoStep;
+    }),
+    _useStepQueue2 = (0, _slicedToArray2.default)(_useStepQueue, 2),
+    startStep = _useStepQueue2[0],
+    step = _useStepQueue2[1];
+  var active = (0, _useStepQueue3.isActive)(step);
+  activeRef.current = active;
 
-    return _useStepQueue3.DoStep;
-  }),
-      _useStepQueue2 = (0, _slicedToArray2.default)(_useStepQueue, 2),
-      startStep = _useStepQueue2[0],
-      step = _useStepQueue2[1];
-
-  var active = (0, _useStepQueue3.isActive)(step);
-  activeRef.current = active; // ============================ Status ============================
+  // ============================ Status ============================
   // Update with new status
-
   (0, _useIsomorphicLayoutEffect.default)(function () {
@@ -186,24 +153,23 @@ setAsyncVisible(visible);
     mountedRef.current = true;
-
     if (!supportMotion) {
       return;
     }
+    var nextStatus;
 
-    var nextStatus; // Appear
-
+    // Appear
     if (!isMounted && visible && motionAppear) {
       nextStatus = _interface.STATUS_APPEAR;
-    } // Enter
+    }
 
-
+    // Enter
     if (isMounted && visible && motionEnter) {
       nextStatus = _interface.STATUS_ENTER;
-    } // Leave
+    }
 
-
+    // Leave
     if (isMounted && !visible && motionLeave || !isMounted && motionLeaveImmediately && !visible && motionLeave) {
       nextStatus = _interface.STATUS_LEAVE;
-    } // Update to next status
+    }
 
-
+    // Update to next status
     if (nextStatus) {
@@ -213,9 +179,13 @@ setStatus(nextStatus);
     }
-  }, [visible]); // ============================ Effect ============================
+  }, [visible]);
+
+  // ============================ Effect ============================
   // Reset when motion changed
-
   (0, React.useEffect)(function () {
-    if ( // Cancel appear
-    status === _interface.STATUS_APPEAR && !motionAppear || // Cancel enter
-    status === _interface.STATUS_ENTER && !motionEnter || // Cancel leave
+    if (
+    // Cancel appear
+    status === _interface.STATUS_APPEAR && !motionAppear ||
+    // Cancel enter
+    status === _interface.STATUS_ENTER && !motionEnter ||
+    // Cancel leave
     status === _interface.STATUS_LEAVE && !motionLeave) {
@@ -230,4 +200,5 @@ setStatus(_interface.STATUS_NONE);
     };
-  }, []); // Trigger `onVisibleChanged`
+  }, []);
 
+  // Trigger `onVisibleChanged`
   var firstMountChangeRef = React.useRef(false);
@@ -239,3 +210,2 @@ (0, React.useEffect)(function () {
     }
-
     if (asyncVisible !== undefined && status === _interface.STATUS_NONE) {
@@ -246,9 +216,8 @@ // Skip first render is invisible since it's nothing changed
       }
-
       firstMountChangeRef.current = true;
     }
-  }, [asyncVisible, status]); // ============================ Styles ============================
+  }, [asyncVisible, status]);
 
+  // ============================ Styles ============================
   var mergedStyle = style;
-
   if (eventHandlers[_interface.STEP_PREPARE] && step === _interface.STEP_START) {
@@ -259,4 +228,3 @@ mergedStyle = (0, _objectSpread2.default)({
   }
-
   return [status, step, mergedStyle, asyncVisible !== null && asyncVisible !== void 0 ? asyncVisible : visible];
 }

lib/hooks/useStepQueue.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -12,48 +10,33 @@ value: true
 exports.isActive = isActive;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _useState3 = _interopRequireDefault(require("rc-util/lib/hooks/useState"));
-
 var _interface = require("../interface");
-
 var _useNextFrame3 = _interopRequireDefault(require("./useNextFrame"));
-
 var _useIsomorphicLayoutEffect = _interopRequireDefault(require("./useIsomorphicLayoutEffect"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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 STEP_QUEUE = [_interface.STEP_PREPARE, _interface.STEP_START, _interface.STEP_ACTIVE, _interface.STEP_ACTIVATED];
 
-var STEP_QUEUE = [_interface.STEP_PREPARE, _interface.STEP_START, _interface.STEP_ACTIVE, _interface.STEP_ACTIVATED];
 /** Skip current step */
-
 var SkipStep = false;
 /** Current step should be update in */
-
 exports.SkipStep = SkipStep;
 var DoStep = true;
 exports.DoStep = DoStep;
-
 function isActive(step) {
   return step === _interface.STEP_ACTIVE || step === _interface.STEP_ACTIVATED;
 }
-
 var _default = function _default(status, callback) {
   var _useState = (0, _useState3.default)(_interface.STEP_NONE),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      step = _useState2[0],
-      setStep = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    step = _useState2[0],
+    setStep = _useState2[1];
   var _useNextFrame = (0, _useNextFrame3.default)(),
-      _useNextFrame2 = (0, _slicedToArray2.default)(_useNextFrame, 2),
-      nextFrame = _useNextFrame2[0],
-      cancelNextFrame = _useNextFrame2[1];
-
+    _useNextFrame2 = (0, _slicedToArray2.default)(_useNextFrame, 2),
+    nextFrame = _useNextFrame2[0],
+    cancelNextFrame = _useNextFrame2[1];
   function startQueue() {
     setStep(_interface.STEP_PREPARE, true);
   }
-
   (0, _useIsomorphicLayoutEffect.default)(function () {
@@ -64,3 +47,2 @@ if (step !== _interface.STEP_NONE && step !== _interface.STEP_ACTIVATED) {
       var result = callback(step);
-
       if (result === SkipStep) {
@@ -77,3 +59,2 @@ // Skip when no needed
           }
-
           if (result === true) {
@@ -96,3 +77,2 @@ doNext();
 };
-
 exports.default = _default;

lib/index.d.ts

@@ -6,4 +6,5 @@ import CSSMotion from './CSSMotion';
 import type { MotionEventHandler, MotionEndEventHandler } from './interface';
+export { default as Provider } from './context';
 export { CSSMotionList };
 export type { CSSMotionProps, CSSMotionListProps, MotionEventHandler, MotionEndEventHandler, };
 export default CSSMotion;

lib/index.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -14,9 +13,13 @@ value: true
 });
+Object.defineProperty(exports, "Provider", {
+  enumerable: true,
+  get: function get() {
+    return _context.default;
+  }
+});
 exports.default = void 0;
-
 var _CSSMotion = _interopRequireDefault(require("./CSSMotion"));
-
 var _CSSMotionList = _interopRequireDefault(require("./CSSMotionList"));
-
+var _context = _interopRequireDefault(require("./context"));
 var _default = _CSSMotion.default;
 exports.default = _default;

lib/util/diff.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -12,7 +11,4 @@ value: true
 exports.wrapKeyToObject = wrapKeyToObject;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
 var STATUS_ADD = 'add';
@@ -26,6 +22,4 @@ exports.STATUS_ADD = STATUS_ADD;
 exports.STATUS_REMOVED = STATUS_REMOVED;
-
 function wrapKeyToObject(key) {
   var keyObj;
-
   if (key && (0, _typeof2.default)(key) === 'object' && 'key' in key) {
@@ -38,3 +32,2 @@ keyObj = key;
   }
-
   return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, keyObj), {}, {
@@ -44,3 +37,2 @@ key: String(keyObj.key)
 }
-
 function parseKeys() {
@@ -50,3 +42,2 @@ var keys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
 }
-
 function diffKeys() {
@@ -59,10 +50,9 @@ var prevKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   var prevKeyObjects = parseKeys(prevKeys);
-  var currentKeyObjects = parseKeys(currentKeys); // Check prev keys to insert or keep
+  var currentKeyObjects = parseKeys(currentKeys);
 
+  // Check prev keys to insert or keep
   prevKeyObjects.forEach(function (keyObj) {
     var hit = false;
-
     for (var i = currentIndex; i < currentLen; i += 1) {
       var currentKeyObj = currentKeyObjects[i];
-
       if (currentKeyObj.key === keyObj.key) {
@@ -78,3 +68,2 @@ // New added keys should add before current key
         }
-
         list.push((0, _objectSpread2.default)((0, _objectSpread2.default)({}, currentKeyObj), {}, {
@@ -87,5 +76,5 @@ status: STATUS_KEEP
       }
-    } // If not hit, it means key is removed
+    }
 
-
+    // If not hit, it means key is removed
     if (!hit) {
@@ -96,4 +85,5 @@ list.push((0, _objectSpread2.default)((0, _objectSpread2.default)({}, keyObj), {}, {
     }
-  }); // Add rest to the list
+  });
 
+  // Add rest to the list
   if (currentIndex < currentLen) {
@@ -106,2 +96,3 @@ list = list.concat(currentKeyObjects.slice(currentIndex).map(function (obj) {
   }
+
   /**
@@ -111,4 +102,2 @@ * Merge same key when it remove and add again:
    */
-
-
   var keys = {};
@@ -126,6 +115,7 @@ list.forEach(function (_ref) {
       var key = _ref2.key,
-          status = _ref2.status;
+        status = _ref2.status;
       return key !== matchKey || status !== STATUS_REMOVE;
-    }); // Update `STATUS_ADD` to `STATUS_KEEP`
+    });
 
+    // Update `STATUS_ADD` to `STATUS_KEEP`
     list.forEach(function (node) {
@@ -132,0 +122,0 @@ if (node.key === matchKey) {

lib/util/motion.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -13,7 +12,4 @@ value: true
 exports.transitionEndName = exports.supportTransition = void 0;
-
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
 var _canUseDom = _interopRequireDefault(require("rc-util/lib/Dom/canUseDom"));
-
 // ================= Transition =================
@@ -30,3 +26,2 @@ // Event wrapper. Copy from react source code
 }
-
 function getVendorPrefixes(domSupport, win) {
@@ -37,3 +32,2 @@ var prefixes = {
   };
-
   if (domSupport) {
@@ -43,3 +37,2 @@ if (!('AnimationEvent' in win)) {
     }
-
     if (!('TransitionEvent' in win)) {
@@ -49,17 +42,11 @@ delete prefixes.transitionend.transition;
   }
-
   return prefixes;
 }
-
 var vendorPrefixes = getVendorPrefixes((0, _canUseDom.default)(), typeof window !== 'undefined' ? window : {});
 var style = {};
-
 if ((0, _canUseDom.default)()) {
   var _document$createEleme = document.createElement('div');
-
   style = _document$createEleme.style;
 }
-
 var prefixedEventNames = {};
-
 function getVendorPrefixedEventName(eventName) {
@@ -69,12 +56,8 @@ if (prefixedEventNames[eventName]) {
   }
-
   var prefixMap = vendorPrefixes[eventName];
-
   if (prefixMap) {
     var stylePropList = Object.keys(prefixMap);
     var len = stylePropList.length;
-
     for (var i = 0; i < len; i += 1) {
       var styleProp = stylePropList[i];
-
       if (Object.prototype.hasOwnProperty.call(prefixMap, styleProp) && styleProp in style) {
@@ -86,6 +69,4 @@ prefixedEventNames[eventName] = prefixMap[styleProp];
   }
-
   return '';
 }
-
 var internalAnimationEndName = getVendorPrefixedEventName('animationend');
@@ -99,6 +80,4 @@ var internalTransitionEndName = getVendorPrefixedEventName('transitionend');
 exports.transitionEndName = transitionEndName;
-
 function getTransitionName(transitionName, transitionType) {
   if (!transitionName) return null;
-
   if ((0, _typeof2.default)(transitionName) === 'object') {
@@ -110,4 +89,3 @@ var type = transitionType.replace(/-\w/g, function (match) {
   }
-
   return "".concat(transitionName, "-").concat(transitionType);
 }

package.json

 {
   "name": "rc-motion",
-  "version": "2.6.3",
+  "version": "2.7.0",
   "description": "React lifecycle controlled motion library",
@@ -5,0 +5,0 @@ "keywords": [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

104509

increased by3.47%

Number of package files

55

increased by7.84%

Lines of code

2149

increased by6.81%

No dependency changes