upgrade motion

Author: amcdnl

docs/tools/templates/reaflow-codesandbox-template/package.json

@@ -4,7 +4,7 @@
   "description": "",
   "main": "src/index.js",
   "dependencies": {
-    "framer-motion": "^2.1.2",
+    "motion": "^11.18.0",
     "react": "latest",
     "react-dom": "latest",
     "react-scripts": "3.0.1",

package-lock.json

@@ -54,11 +54,11 @@
     "d3-shape": "^3.0.1",
     "elkjs": "^0.8.2",
     "ellipsize": "^0.2.0",
-    "framer-motion": "^11.0.6",
+    "motion": "^11.18.0",
     "kld-affine": "^2.1.1",
     "kld-intersections": "^0.7.0",
     "p-cancelable": "^3.0.0",
-    "reablocks": "^8.0.3",
+    "reablocks": "^8.7.4",
     "react-cool-dimensions": "^2.0.7",
     "react-fast-compare": "^3.2.2",
     "react-use-gesture": "^8.0.1",

package.json

@@ -9,7 +9,7 @@ import { CanvasPosition, EdgeData, NodeData, PortData } from './types';
 import classNames from 'classnames';
 import { CanvasProvider, useCanvas } from './utils/CanvasProvider';
 import { getDragNodeData } from './utils/helpers';
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import { ZoomResult } from './utils/useZoom';
 import css from './Canvas.module.css';
 
@@ -327,17 +327,17 @@ const InternalCanvas: FC<CanvasProps & { ref?: Ref<CanvasRef> }> = forwardRef(({
             scale: zoom,
             transition: animated
               ? {
-                  velocity: 100,
-                  translateX: { duration: mount.current ? 0.3 : 0 },
-                  translateY: { duration: mount.current ? 0.3 : 0 },
-                  opacity: { duration: 0.8 },
-                  when: 'beforeChildren'
-                }
+                velocity: 100,
+                translateX: { duration: mount.current ? 0.3 : 0 },
+                translateY: { duration: mount.current ? 0.3 : 0 },
+                opacity: { duration: 0.8 },
+                when: 'beforeChildren'
+              }
               : {
-                  type: false,
-                  duration: 0,
-                  when: 'beforeChildren'
-                }
+                type: false,
+                duration: 0,
+                when: 'beforeChildren'
+              }
           }}
         >
           {layout?.children?.map(({ children, ...n }) => {