Refactor/vanilla store utils (#3138)

* feat(stores): use vanilla store utils

* fix(store-utils): keep dimensions if possible

* feat(utils): add nodeDimension and panBy utils

* fix(svelte): use correct updateDim func

* refactor(react): cleanup store

* chore(tests): use new imports

examples/vite-app/cypress/components/hooks/useEdges.cy.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react';
-import ReactFlow, { Edge, useEdges } from '@xyflow/react';
+import { ReactFlow, Edge, useEdges } from '@xyflow/react';
 
 import { nodes as initialNodes, edges as initialEdges } from '../../fixtures/simpleflow';
 

examples/vite-app/cypress/components/hooks/useNodes.cy.tsx

@@ -1,5 +1,5 @@
 import { useEffect } from 'react';
-import ReactFlow, { Node, useNodes } from '@xyflow/react';
+import { ReactFlow, Node, useNodes } from '@xyflow/react';
 
 import { nodes } from '../../fixtures/simpleflow';
 

examples/vite-app/cypress/components/hooks/useNodesInitialized.cy.tsx

@@ -1,4 +1,4 @@
-import ReactFlow, { useNodesInitialized } from '@xyflow/react';
+import { ReactFlow, useNodesInitialized } from '@xyflow/react';
 
 import { nodes } from '../../fixtures/simpleflow';
 import ControlledFlow from '../../support/ControlledFlow';

examples/vite-app/cypress/components/hooks/useOnViewportChange.cy.tsx

@@ -1,4 +1,4 @@
-import ReactFlow, { useOnViewportChange, Viewport } from '@xyflow/react';
+import { ReactFlow, useOnViewportChange, Viewport } from '@xyflow/react';
 
 describe('useOnViewportChange.cy.tsx', () => {
   it('listen to viewport drag', () => {

examples/vite-app/cypress/components/hooks/useViewport.cy.tsx

@@ -1,4 +1,4 @@
-import ReactFlow, { useViewport, Viewport } from '@xyflow/react';
+import { ReactFlow, useViewport, Viewport } from '@xyflow/react';
 
 describe('useViewport.cy.tsx', () => {
   it('handles drag', () => {

examples/vite-app/cypress/components/reactflow/basic-props.cy.tsx

@@ -1,4 +1,4 @@
-import ReactFlow, { EdgeProps } from '@xyflow/react';
+import { ReactFlow, EdgeProps } from '@xyflow/react';
 
 import ControlledFlow from '../../support/ControlledFlow';
 import * as simpleflow from '../../fixtures/simpleflow';

examples/vite-app/cypress/components/reactflow/multiple-instance.cy.tsx

@@ -1,4 +1,4 @@
-import ReactFlow, { BaseEdge, EdgeLabelRenderer, EdgeProps, getSmoothStepPath, ReactFlowProvider } from '@xyflow/react';
+import { ReactFlow, BaseEdge, EdgeLabelRenderer, EdgeProps, getSmoothStepPath, ReactFlowProvider } from '@xyflow/react';
 import * as simpleflow from '../../fixtures/simpleflow';
 
 function CustomEdge(props: EdgeProps) {

examples/vite-app/cypress/components/reactflow/uncontrolled.cy.tsx

@@ -1,4 +1,4 @@
-import ReactFlow from '@xyflow/react';
+import { ReactFlow } from '@xyflow/react';
 
 import { nodes, edges } from '../../fixtures/simpleflow';
 

examples/vite-app/cypress/components/reactflow/view-props.cy.tsx

@@ -1,4 +1,4 @@
-import ReactFlow, { ReactFlowProps, Viewport, useViewport, SnapGrid, CoordinateExtent, Node } from '@xyflow/react';
+import { ReactFlow, ReactFlowProps, Viewport, useViewport, SnapGrid, CoordinateExtent, Node } from '@xyflow/react';
 
 import ControlledFlow from '../../support/ControlledFlow';
 import * as simpleflow from '../../fixtures/simpleflow';

examples/vite-app/package.json

@@ -30,8 +30,8 @@
     "@types/react-dom": "^18.0.6",
     "@vitejs/plugin-react": "4.0.0",
     "@vitejs/plugin-react-swc": "^3.3.2",
-    "cypress": "^10.6.0",
-    "cypress-real-events": "^1.7.1",
+    "cypress": "12.14.0",
+    "cypress-real-events": "1.8.1",
     "start-server-and-test": "^1.14.0",
     "typescript": "^4.9.4",
     "vite": "4.3.9"