rc-motion - npm Package Compare versions

Comparing version 2.4.4 to 2.4.5

es/CSSMotion.js

@@ -51,3 +51,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
       try {
-        return findDOMNode(nodeRef.current || wrapperNodeRef.current);
+        // Here we're avoiding call for findDOMNode since it's deprecated
+        // in strict mode. We're calling it only when node ref is not
+        // an instance of DOM HTMLElement. Otherwise use
+        // findDOMNode as a final resort
+        return nodeRef.current instanceof HTMLElement ? nodeRef.current : findDOMNode(wrapperNodeRef.current);
       } catch (e) {
@@ -64,3 +68,3 @@ // Only happen when `motionDeadline` trigger but element removed.
         statusStyle = _useStatus2[2],
-        mergedVisible = _useStatus2[3]; // Record whether content has rended
+        mergedVisible = _useStatus2[3]; // Record whether content has rendered
     // Will return null for un-rendered even when `removeOnLeave={false}`
@@ -76,7 +80,5 @@
 
-    var originRef = useRef(ref);
-    originRef.current = ref;
     var setNodeRef = React.useCallback(function (node) {
       nodeRef.current = node;
-      fillRef(originRef.current, node);
+      fillRef(ref, node);
     }, []); // ===================== Render =====================
@@ -83,0 +85,0 @@

es/CSSMotionList.js

@@ -8,2 +8,4 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+var _excluded = ["component", "children", "onVisibleChanged"],
+    _excluded2 = ["status"];
 
@@ -35,3 +37,7 @@ /* eslint react/prop-types: 0 */
 
-      _this = _super.apply(this, arguments);
+      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));
       _this.state = {
@@ -69,3 +75,3 @@ keyEntities: []
             _onVisibleChanged = _this$props.onVisibleChanged,
-            restProps = _objectWithoutProperties(_this$props, ["component", "children", "onVisibleChanged"]);
+            restProps = _objectWithoutProperties(_this$props, _excluded);
 
@@ -81,3 +87,3 @@ var Component = component || React.Fragment;
           var status = _ref2.status,
-              eventProps = _objectWithoutProperties(_ref2, ["status"]);
+              eventProps = _objectWithoutProperties(_ref2, _excluded2);
 
@@ -84,0 +90,0 @@ var visible = status === STATUS_ADD || status === STATUS_KEEP;

es/hooks/useStatus.js

@@ -100,9 +100,9 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
     switch (status) {
-      case 'appear':
+      case STATUS_APPEAR:
         return _ref2 = {}, _defineProperty(_ref2, STEP_PREPARE, onAppearPrepare), _defineProperty(_ref2, STEP_START, onAppearStart), _defineProperty(_ref2, STEP_ACTIVE, onAppearActive), _ref2;
 
-      case 'enter':
+      case STATUS_ENTER:
         return _ref3 = {}, _defineProperty(_ref3, STEP_PREPARE, onEnterPrepare), _defineProperty(_ref3, STEP_START, onEnterStart), _defineProperty(_ref3, STEP_ACTIVE, onEnterActive), _ref3;
 
-      case 'leave':
+      case STATUS_LEAVE:
         return _ref4 = {}, _defineProperty(_ref4, STEP_PREPARE, onLeavePrepare), _defineProperty(_ref4, STEP_START, onLeaveStart), _defineProperty(_ref4, STEP_ACTIVE, onLeaveActive), _ref4;
@@ -109,0 +109,0 @@

es/hooks/useStepQueue.d.ts

@@ -1,2 +0,2 @@
-import { StepStatus, MotionStatus } from '../interface';
+import type { StepStatus, MotionStatus } from '../interface';
 /** Skip current step */
@@ -3,0 +3,0 @@ export declare const SkipStep: false;

es/hooks/useStepQueue.js

@@ -6,2 +6,3 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import useNextFrame from './useNextFrame';
+import useState from './useState';
 var STEP_QUEUE = [STEP_PREPARE, STEP_START, STEP_ACTIVE, STEP_ACTIVATED];
@@ -18,6 +19,6 @@ /** Skip current step */
 export default (function (status, callback) {
-  var _React$useState = React.useState(STEP_NONE),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      step = _React$useState2[0],
-      setStep = _React$useState2[1];
+  var _useState = useState(STEP_NONE),
+      _useState2 = _slicedToArray(_useState, 2),
+      step = _useState2[0],
+      setStep = _useState2[1];
 
@@ -24,0 +25,0 @@ var _useNextFrame = useNextFrame(),

lib/CSSMotion.js

@@ -10,4 +10,4 @@ "use strict";
 });
+exports.default = void 0;
 exports.genCSSMotion = genCSSMotion;
-exports.default = void 0;
 
@@ -75,3 +75,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
       try {
-        return (0, _findDOMNode.default)(nodeRef.current || wrapperNodeRef.current);
+        // Here we're avoiding call for findDOMNode since it's deprecated
+        // in strict mode. We're calling it only when node ref is not
+        // an instance of DOM HTMLElement. Otherwise use
+        // findDOMNode as a final resort
+        return nodeRef.current instanceof HTMLElement ? nodeRef.current : (0, _findDOMNode.default)(wrapperNodeRef.current);
       } catch (e) {
@@ -88,3 +92,3 @@ // Only happen when `motionDeadline` trigger but element removed.
         statusStyle = _useStatus2[2],
-        mergedVisible = _useStatus2[3]; // Record whether content has rended
+        mergedVisible = _useStatus2[3]; // Record whether content has rendered
     // Will return null for un-rendered even when `removeOnLeave={false}`
@@ -100,7 +104,5 @@
 
-    var originRef = (0, React.useRef)(ref);
-    originRef.current = ref;
     var setNodeRef = React.useCallback(function (node) {
       nodeRef.current = node;
-      (0, _ref.fillRef)(originRef.current, node);
+      (0, _ref.fillRef)(ref, node);
     }, []); // ===================== Render =====================
@@ -107,0 +109,0 @@

lib/CSSMotionList.js

 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 exports.genCSSMotionList = genCSSMotionList;
-exports.default = void 0;
 
@@ -35,3 +35,4 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-/* eslint react/prop-types: 0 */
+var _excluded = ["component", "children", "onVisibleChanged"],
+    _excluded2 = ["status"];
 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,3 +57,8 @@ /**
       (0, _classCallCheck2.default)(this, CSSMotionList);
-      _this = _super.apply(this, arguments);
+
+      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));
       _this.state = {
@@ -89,3 +95,3 @@ keyEntities: []
             _onVisibleChanged = _this$props.onVisibleChanged,
-            restProps = (0, _objectWithoutProperties2.default)(_this$props, ["component", "children", "onVisibleChanged"]);
+            restProps = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
         var Component = component || React.Fragment;
@@ -100,3 +106,3 @@ var motionProps = {};
           var status = _ref2.status,
-              eventProps = (0, _objectWithoutProperties2.default)(_ref2, ["status"]);
+              eventProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
           var visible = status === _diff.STATUS_ADD || status === _diff.STATUS_KEEP;
@@ -103,0 +109,0 @@ return /*#__PURE__*/React.createElement(CSSMotion, (0, _extends2.default)({}, motionProps, {

lib/hooks/useStatus.js

@@ -119,9 +119,9 @@ "use strict";
     switch (status) {
-      case 'appear':
+      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 'enter':
+      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 'leave':
+      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;
@@ -128,0 +128,0 @@

lib/hooks/useStepQueue.d.ts

@@ -1,2 +0,2 @@
-import { StepStatus, MotionStatus } from '../interface';
+import type { StepStatus, MotionStatus } from '../interface';
 /** Skip current step */
@@ -3,0 +3,0 @@ export declare const SkipStep: false;

lib/hooks/useStepQueue.js

@@ -10,4 +10,4 @@ "use strict";
 });
+exports.default = exports.SkipStep = exports.DoStep = void 0;
 exports.isActive = isActive;
-exports.default = exports.DoStep = exports.SkipStep = void 0;
 
@@ -24,2 +24,4 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
+var _useState3 = _interopRequireDefault(require("./useState"));
+
 var STEP_QUEUE = [_interface.STEP_PREPARE, _interface.STEP_START, _interface.STEP_ACTIVE, _interface.STEP_ACTIVATED];
@@ -40,6 +42,6 @@ /** Skip current step */
 var _default = function _default(status, callback) {
-  var _React$useState = React.useState(_interface.STEP_NONE),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      step = _React$useState2[0],
-      setStep = _React$useState2[1];
+  var _useState = (0, _useState3.default)(_interface.STEP_NONE),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      step = _useState2[0],
+      setStep = _useState2[1];
 
@@ -46,0 +48,0 @@ var _useNextFrame = (0, _useNextFrame3.default)(),

lib/interface.js

@@ -6,3 +6,3 @@ "use strict";
 });
-exports.STEP_ACTIVATED = exports.STEP_ACTIVE = exports.STEP_START = exports.STEP_PREPARE = exports.STEP_NONE = exports.STATUS_LEAVE = exports.STATUS_ENTER = exports.STATUS_APPEAR = exports.STATUS_NONE = void 0;
+exports.STEP_START = exports.STEP_PREPARE = exports.STEP_NONE = exports.STEP_ACTIVE = exports.STEP_ACTIVATED = exports.STATUS_NONE = exports.STATUS_LEAVE = exports.STATUS_ENTER = exports.STATUS_APPEAR = void 0;
 var STATUS_NONE = 'none';
@@ -9,0 +9,0 @@ exports.STATUS_NONE = STATUS_NONE;

lib/util/diff.js

@@ -8,6 +8,6 @@ "use strict";
 });
+exports.STATUS_REMOVED = exports.STATUS_REMOVE = exports.STATUS_KEEP = exports.STATUS_ADD = void 0;
+exports.diffKeys = diffKeys;
+exports.parseKeys = parseKeys;
 exports.wrapKeyToObject = wrapKeyToObject;
-exports.parseKeys = parseKeys;
-exports.diffKeys = diffKeys;
-exports.STATUS_REMOVED = exports.STATUS_REMOVE = exports.STATUS_KEEP = exports.STATUS_ADD = void 0;
 
@@ -14,0 +14,0 @@ var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));

lib/util/motion.js

@@ -8,6 +8,7 @@ "use strict";
 });
+exports.animationEndName = void 0;
+exports.getTransitionName = getTransitionName;
+exports.getVendorPrefixedEventName = getVendorPrefixedEventName;
 exports.getVendorPrefixes = getVendorPrefixes;
-exports.getVendorPrefixedEventName = getVendorPrefixedEventName;
-exports.getTransitionName = getTransitionName;
-exports.transitionEndName = exports.animationEndName = exports.supportTransition = void 0;
+exports.transitionEndName = exports.supportTransition = void 0;
 
@@ -14,0 +15,0 @@ var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));

package.json

 {
   "name": "rc-motion",
-  "version": "2.4.4",
+  "version": "2.4.5",
   "description": "React lifecycle controlled motion library",
@@ -46,3 +46,3 @@ "keywords": [
     "classnames": "^2.2.1",
-    "rc-util": "^5.2.1"
+    "rc-util": "^5.18.1"
   },
@@ -49,0 +49,0 @@ "devDependencies": {

README.md

@@ -41,7 +41,7 @@ # rc-motion
 
-export default ({ visible }) => {
+export default ({ visible }) => (
   <CSSMotion visible={visible} motionName="my-motion">
     {({ className, style }) => <div className={className} style={style} />}
-  </CSSMotion>;
-};
+  </CSSMotion>
+);
 ```
@@ -48,0 +48,0 @@

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

91486

increased by1.03%

Lines of code

1964

increased by0.82%

Dependency changes

• Updatedrc-util@^5.18.1