diff --git a/example/.gitignore b/example/.gitignore
index 4d29575d..43d022f7 100644
--- a/example/.gitignore
+++ b/example/.gitignore
@@ -21,3 +21,5 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+
+/src_oldapi
\ No newline at end of file
diff --git a/example/package-lock.json b/example/package-lock.json
index 3560909a..520b9afe 100644
--- a/example/package-lock.json
+++ b/example/package-lock.json
@@ -27,7 +27,7 @@
     },
     "..": {
       "name": "react-flow-renderer",
-      "version": "9.6.7",
+      "version": "9.6.8",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.15.4",
diff --git a/example/src/FloatingEdges/FloatingConnectionLine.tsx b/example/src/FloatingEdges/FloatingConnectionLine.tsx
new file mode 100644
index 00000000..987af43d
--- /dev/null
+++ b/example/src/FloatingEdges/FloatingConnectionLine.tsx
@@ -0,0 +1,40 @@
+import { FC } from 'react';
+import { getBezierPath, ConnectionLineComponentProps, Node } from 'react-flow-renderer';
+
+import { getEdgeParams } from './utils';
+
+const FloatingConnectionLine: FC<ConnectionLineComponentProps> = ({
+  targetX,
+  targetY,
+  sourcePosition,
+  targetPosition,
+  sourceNode,
+}) => {
+  if (!sourceNode) {
+    return null;
+  }
+
+  const targetNode = {
+    id: 'connection-target',
+    __rf: { width: 1, height: 1, position: { x: targetX, y: targetY } },
+  } as Node;
+
+  const { sx, sy } = getEdgeParams(sourceNode, targetNode);
+  const d = getBezierPath({
+    sourceX: sx,
+    sourceY: sy,
+    sourcePosition,
+    targetPosition,
+    targetX,
+    targetY,
+  });
+
+  return (
+    <g>
+      <path fill="none" stroke="#222" strokeWidth={1.5} className="animated" d={d} />
+      <circle cx={targetX} cy={targetY} fill="#fff" r={3} stroke="#222" strokeWidth={1.5} />
+    </g>
+  );
+};
+
+export default FloatingConnectionLine;
diff --git a/example/src/FloatingEdges/FloatingEdge.tsx b/example/src/FloatingEdges/FloatingEdge.tsx
new file mode 100644
index 00000000..60ee4b93
--- /dev/null
+++ b/example/src/FloatingEdges/FloatingEdge.tsx
@@ -0,0 +1,35 @@
+import { FC, useMemo, CSSProperties } from 'react';
+import { EdgeProps, getMarkerEnd, useStoreState, getBezierPath } from 'react-flow-renderer';
+
+import { getEdgeParams } from './utils';
+
+const FloatingEdge: FC<EdgeProps> = ({ id, source, target, arrowHeadType, markerEndId, style }) => {
+  const nodes = useStoreState((state) => state.nodes);
+  const markerEnd = getMarkerEnd(arrowHeadType, markerEndId);
+
+  const sourceNode = useMemo(() => nodes.find((n) => n.id === source), [source, nodes]);
+  const targetNode = useMemo(() => nodes.find((n) => n.id === target), [target, nodes]);
+
+  if (!sourceNode || !targetNode) {
+    return null;
+  }
+
+  const { sx, sy, tx, ty, sourcePos, targetPos } = getEdgeParams(sourceNode, targetNode);
+
+  const d = getBezierPath({
+    sourceX: sx,
+    sourceY: sy,
+    sourcePosition: sourcePos,
+    targetPosition: targetPos,
+    targetX: tx,
+    targetY: ty,
+  });
+
+  return (
+    <g className="react-flow__connection">
+      <path id={id} className="react-flow__edge-path" d={d} markerEnd={markerEnd} style={style as CSSProperties} />
+    </g>
+  );
+};
+
+export default FloatingEdge;
diff --git a/example/src/FloatingEdges/index.tsx b/example/src/FloatingEdges/index.tsx
new file mode 100644
index 00000000..7bdfc7a2
--- /dev/null
+++ b/example/src/FloatingEdges/index.tsx
@@ -0,0 +1,53 @@
+import React, { useState } from 'react';
+
+import ReactFlow, {
+  removeElements,
+  addEdge,
+  Background,
+  OnLoadParams,
+  EdgeTypesType,
+  Elements,
+  Connection,
+  Edge,
+  ArrowHeadType,
+} from 'react-flow-renderer';
+
+import './style.css';
+
+import FloatingEdge from './FloatingEdge';
+import FloatingConnectionLine from './FloatingConnectionLine';
+import { createElements } from './utils';
+
+const onLoad = (reactFlowInstance: OnLoadParams) => reactFlowInstance.fitView();
+
+const initialElements: Elements = createElements();
+
+const edgeTypes: EdgeTypesType = {
+  floating: FloatingEdge,
+};
+
+const NodeAsHandleFlow = () => {
+  const [elements, setElements] = useState<Elements>(initialElements);
+
+  const onElementsRemove = (elementsToRemove: Elements) => setElements((els) => removeElements(elementsToRemove, els));
+
+  const onConnect = (params: Connection | Edge) =>
+    setElements((els) => addEdge({ ...params, type: 'floating', arrowHeadType: ArrowHeadType.Arrow }, els));
+
+  return (
+    <div className="floatingedges">
+      <ReactFlow
+        elements={elements}
+        onElementsRemove={onElementsRemove}
+        onConnect={onConnect}
+        onLoad={onLoad}
+        edgeTypes={edgeTypes}
+        connectionLineComponent={FloatingConnectionLine}
+      >
+        <Background />
+      </ReactFlow>
+    </div>
+  );
+};
+
+export default NodeAsHandleFlow;
diff --git a/example/src/FloatingEdges/style.css b/example/src/FloatingEdges/style.css
new file mode 100644
index 00000000..052fedb8
--- /dev/null
+++ b/example/src/FloatingEdges/style.css
@@ -0,0 +1,9 @@
+.floatingedges {
+  flex-direction: column;
+  display: flex;
+  height: 100%;
+}
+
+.floatingedges .react-flow__handle {
+  opacity: 0;
+}
diff --git a/example/src/FloatingEdges/utils.ts b/example/src/FloatingEdges/utils.ts
new file mode 100644
index 00000000..c8962b72
--- /dev/null
+++ b/example/src/FloatingEdges/utils.ts
@@ -0,0 +1,99 @@
+import { Position, ArrowHeadType, Node, XYPosition } from 'react-flow-renderer';
+
+// this helper function returns the intersection point
+// of the line between the center of the intersectionNode and the target node
+function getNodeIntersection(intersectionNode: Node, targetNode: Node): XYPosition {
+  // https://math.stackexchange.com/questions/1724792/an-algorithm-for-finding-the-intersection-point-between-a-center-of-vision-and-a
+  const {
+    width: intersectionNodeWidth,
+    height: intersectionNodeHeight,
+    position: intersectionNodePosition,
+  } = intersectionNode.__rf;
+  const targetPosition = targetNode.__rf.position;
+
+  const w = intersectionNodeWidth / 2;
+  const h = intersectionNodeHeight / 2;
+
+  const x2 = intersectionNodePosition.x + w;
+  const y2 = intersectionNodePosition.y + h;
+  const x1 = targetPosition.x + w;
+  const y1 = targetPosition.y + h;
+
+  const xx1 = (x1 - x2) / (2 * w) - (y1 - y2) / (2 * h);
+  const yy1 = (x1 - x2) / (2 * w) + (y1 - y2) / (2 * h);
+  const a = 1 / (Math.abs(xx1) + Math.abs(yy1));
+  const xx3 = a * xx1;
+  const yy3 = a * yy1;
+  const x = w * (xx3 + yy3) + x2;
+  const y = h * (-xx3 + yy3) + y2;
+
+  return { x, y };
+}
+
+// returns the position (top,right,bottom or right) passed node compared to the intersection point
+function getEdgePosition(node: Node, intersectionPoint: XYPosition) {
+  const n = { ...node.__rf.position, ...node.__rf };
+  const nx = Math.round(n.x);
+  const ny = Math.round(n.y);
+  const px = Math.round(intersectionPoint.x);
+  const py = Math.round(intersectionPoint.y);
+
+  if (px <= nx + 1) {
+    return Position.Left;
+  }
+  if (px >= nx + n.width - 1) {
+    return Position.Right;
+  }
+  if (py <= ny + 1) {
+    return Position.Top;
+  }
+  if (py >= n.y + n.height - 1) {
+    return Position.Bottom;
+  }
+
+  return Position.Top;
+}
+
+// returns the parameters (sx, sy, tx, ty, sourcePos, targetPos) you need to create an edge
+export function getEdgeParams(source: Node, target: Node) {
+  const sourceIntersectionPoint = getNodeIntersection(source, target);
+  const targetIntersectionPoint = getNodeIntersection(target, source);
+
+  const sourcePos = getEdgePosition(source, sourceIntersectionPoint);
+  const targetPos = getEdgePosition(target, targetIntersectionPoint);
+
+  return {
+    sx: sourceIntersectionPoint.x,
+    sy: sourceIntersectionPoint.y,
+    tx: targetIntersectionPoint.x,
+    ty: targetIntersectionPoint.y,
+    sourcePos,
+    targetPos,
+  };
+}
+
+export function createElements() {
+  const elements = [];
+  const center = { x: window.innerWidth / 2, y: window.innerHeight / 2 };
+
+  elements.push({ id: 'target', data: { label: 'Target' }, position: center });
+
+  for (let i = 0; i < 8; i++) {
+    const degrees = i * (360 / 8);
+    const radians = degrees * (Math.PI / 180);
+    const x = 250 * Math.cos(radians) + center.x;
+    const y = 250 * Math.sin(radians) + center.y;
+
+    elements.push({ id: `${i}`, data: { label: 'Source' }, position: { x, y } });
+
+    elements.push({
+      id: `edge-${i}`,
+      target: 'target',
+      source: `${i}`,
+      type: 'floating',
+      arrowHeadType: ArrowHeadType.Arrow,
+    });
+  }
+
+  return elements;
+}
diff --git a/example/src/Undirectional/index.tsx b/example/src/Undirectional/index.tsx
index f05ad21e..9f51296a 100644
--- a/example/src/Undirectional/index.tsx
+++ b/example/src/Undirectional/index.tsx
@@ -68,7 +68,7 @@ const initialElements: Elements = [
     target: '01',
     sourceHandle: 'left',
     targetHandle: 'bottom',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -77,7 +77,7 @@ const initialElements: Elements = [
     target: '01',
     sourceHandle: 'top',
     targetHandle: 'right',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -86,7 +86,7 @@ const initialElements: Elements = [
     target: '02',
     sourceHandle: 'top',
     targetHandle: 'left',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -95,7 +95,7 @@ const initialElements: Elements = [
     target: '02',
     sourceHandle: 'right',
     targetHandle: 'bottom',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -104,7 +104,7 @@ const initialElements: Elements = [
     target: '03',
     sourceHandle: 'right',
     targetHandle: 'top',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -113,7 +113,7 @@ const initialElements: Elements = [
     target: '03',
     sourceHandle: 'bottom',
     targetHandle: 'left',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -122,7 +122,7 @@ const initialElements: Elements = [
     target: '04',
     sourceHandle: 'bottom',
     targetHandle: 'right',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -131,7 +131,7 @@ const initialElements: Elements = [
     target: '04',
     sourceHandle: 'left',
     targetHandle: 'top',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -140,7 +140,7 @@ const initialElements: Elements = [
     target: '10',
     sourceHandle: 'top',
     targetHandle: 'bottom',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -149,7 +149,7 @@ const initialElements: Elements = [
     target: '20',
     sourceHandle: 'right',
     targetHandle: 'left',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -158,7 +158,7 @@ const initialElements: Elements = [
     target: '30',
     sourceHandle: 'bottom',
     targetHandle: 'top',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
   {
@@ -167,7 +167,7 @@ const initialElements: Elements = [
     target: '40',
     sourceHandle: 'left',
     targetHandle: 'right',
-    type: 'smoothstep',
+    type: 'default',
     arrowHeadType: ArrowHeadType.Arrow,
   },
 ];
@@ -181,8 +181,7 @@ const getId = (): ElementId => `${id++}`;
 
 const UpdateNodeInternalsFlow = () => {
   const [elements, setElements] = useState<Elements>(initialElements);
-  const onConnect = (params: Connection | Edge) =>
-    setElements((els) => addEdge({ ...params, type: 'smoothstep' }, els));
+  const onConnect = (params: Connection | Edge) => setElements((els) => addEdge({ ...params, type: 'default' }, els));
   const { project } = useZoomPanHelper();
   const onEdgeUpdate = (oldEdge: Edge, newConnection: Connection) =>
     setElements((els) => updateEdge(oldEdge, newConnection, els));
diff --git a/example/src/index.tsx b/example/src/index.tsx
index f81278ba..8371c0af 100644
--- a/example/src/index.tsx
+++ b/example/src/index.tsx
@@ -14,6 +14,7 @@ import Provider from './Provider';
 import Hidden from './Hidden';
 import EdgeTypes from './EdgeTypes';
 import CustomConnectionLine from './CustomConnectionLine';
+import FloatingEdges from './FloatingEdges';
 import NodeTypeChange from './NodeTypeChange';
 import NodeTypesObjectChange from './NodeTypesObjectChange';
 import UpdatableEdge from './UpdatableEdge';
@@ -79,6 +80,10 @@ const routes = [
     path: '/custom-connectionline',
     component: CustomConnectionLine,
   },
+  {
+    path: '/floating-edges',
+    component: FloatingEdges,
+  },
   {
     path: '/nodetype-change',
     component: NodeTypeChange,
diff --git a/package-lock.json b/package-lock.json
index ace876fc..dee85300 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,17 +1,17 @@
 {
   "name": "react-flow-renderer",
-  "version": "9.6.8",
+  "version": "9.6.9",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "react-flow-renderer",
-      "version": "9.6.8",
+      "version": "9.6.9",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.15.4",
         "@types/d3": "^7.0.0",
-        "@types/react-redux": "^7.1.18",
+        "@types/react-redux": "^7.1.19",
         "classcat": "^5.0.3",
         "d3-selection": "^3.0.0",
         "d3-zoom": "^3.0.0",
@@ -21,9 +21,9 @@
         "redux": "^4.1.1"
       },
       "devDependencies": {
-        "@babel/core": "^7.15.5",
-        "@babel/plugin-transform-runtime": "^7.15.0",
-        "@babel/preset-env": "^7.15.6",
+        "@babel/core": "^7.15.8",
+        "@babel/plugin-transform-runtime": "^7.15.8",
+        "@babel/preset-env": "^7.15.8",
         "@babel/preset-react": "^7.14.5",
         "@rollup/plugin-babel": "^5.3.0",
         "@rollup/plugin-commonjs": "^21.0.0",
@@ -32,10 +32,10 @@
         "@svgr/rollup": "^5.5.0",
         "@types/redux": "^3.6.31",
         "@types/resize-observer-browser": "^0.1.6",
-        "autoprefixer": "^10.3.6",
+        "autoprefixer": "^10.3.7",
         "babel-preset-react-app": "^10.0.0",
         "cypress": "^8.5.0",
-        "postcss": "^8.3.8",
+        "postcss": "^8.3.9",
         "postcss-cli": "^9.0.1",
         "postcss-nested": "^5.0.6",
         "prettier": "2.4.1",
@@ -52,15 +52,18 @@
         "start-server-and-test": "^1.14.0",
         "typescript": "^4.4.3"
       },
+      "engines": {
+        "node": ">=12"
+      },
       "peerDependencies": {
         "react": "16 || 17",
         "react-dom": "16 || 17"
       }
     },
     "node_modules/@babel/code-frame": {
-      "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.14.5.tgz",
-      "integrity": "sha512-9pzDqyc6OLDaqe+zbACgFkb6fKMNG6CObKpnYXChRsvYGyEdc7CA2BaqeOM+vOtCS5ndmJicPJhKAwYRI6UfFw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.15.8.tgz",
+      "integrity": "sha512-2IAnmn8zbvC/jKYhq5Ki9I+DwjlrtMPUCH/CpHvqI4dNnlwHwsxoIhlc8WcYY5LSYknXQtAlFYuHfqAFCvQ4Wg==",
       "dev": true,
       "dependencies": {
         "@babel/highlight": "^7.14.5"
@@ -79,20 +82,20 @@
       }
     },
     "node_modules/@babel/core": {
-      "version": "7.15.5",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.15.5.tgz",
-      "integrity": "sha512-pYgXxiwAgQpgM1bNkZsDEq85f0ggXMA5L7c+o3tskGMh2BunCI9QUwB9Z4jpvXUOuMdyGKiGKQiRe11VS6Jzvg==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.15.8.tgz",
+      "integrity": "sha512-3UG9dsxvYBMYwRv+gS41WKHno4K60/9GPy1CJaH6xy3Elq8CTtvtjT5R5jmNhXfCYLX2mTw+7/aq5ak/gOE0og==",
       "dev": true,
       "dependencies": {
-        "@babel/code-frame": "^7.14.5",
-        "@babel/generator": "^7.15.4",
+        "@babel/code-frame": "^7.15.8",
+        "@babel/generator": "^7.15.8",
         "@babel/helper-compilation-targets": "^7.15.4",
-        "@babel/helper-module-transforms": "^7.15.4",
+        "@babel/helper-module-transforms": "^7.15.8",
         "@babel/helpers": "^7.15.4",
-        "@babel/parser": "^7.15.5",
+        "@babel/parser": "^7.15.8",
         "@babel/template": "^7.15.4",
         "@babel/traverse": "^7.15.4",
-        "@babel/types": "^7.15.4",
+        "@babel/types": "^7.15.6",
         "convert-source-map": "^1.7.0",
         "debug": "^4.1.0",
         "gensync": "^1.0.0-beta.2",
@@ -109,12 +112,12 @@
       }
     },
     "node_modules/@babel/generator": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.15.4.tgz",
-      "integrity": "sha512-d3itta0tu+UayjEORPNz6e1T3FtvWlP5N4V5M+lhp/CxT4oAA7/NcScnpRyspUMLK6tu9MNHmQHxRykuN2R7hw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.15.8.tgz",
+      "integrity": "sha512-ECmAKstXbp1cvpTTZciZCgfOt6iN64lR0d+euv3UZisU5awfRawOvg07Utn/qBGuH4bRIEZKrA/4LzZyXhZr8g==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.15.4",
+        "@babel/types": "^7.15.6",
         "jsesc": "^2.5.1",
         "source-map": "^0.5.0"
       },
@@ -295,19 +298,19 @@
       }
     },
     "node_modules/@babel/helper-module-transforms": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.15.4.tgz",
-      "integrity": "sha512-9fHHSGE9zTC++KuXLZcB5FKgvlV83Ox+NLUmQTawovwlJ85+QMhk1CnVk406CQVj97LaWod6KVjl2Sfgw9Aktw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.15.8.tgz",
+      "integrity": "sha512-DfAfA6PfpG8t4S6npwzLvTUpp0sS7JrcuaMiy1Y5645laRJIp/LiLGIBbQKaXSInK8tiGNI7FL7L8UvB8gdUZg==",
       "dev": true,
       "dependencies": {
         "@babel/helper-module-imports": "^7.15.4",
         "@babel/helper-replace-supers": "^7.15.4",
         "@babel/helper-simple-access": "^7.15.4",
         "@babel/helper-split-export-declaration": "^7.15.4",
-        "@babel/helper-validator-identifier": "^7.14.9",
+        "@babel/helper-validator-identifier": "^7.15.7",
         "@babel/template": "^7.15.4",
         "@babel/traverse": "^7.15.4",
-        "@babel/types": "^7.15.4"
+        "@babel/types": "^7.15.6"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -400,9 +403,9 @@
       }
     },
     "node_modules/@babel/helper-validator-identifier": {
-      "version": "7.14.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.9.tgz",
-      "integrity": "sha512-pQYxPY0UP6IHISRitNe8bsijHex4TWZXi2HwKVsjPiltzlhse2znVcm9Ace510VT1kxIHjGJCZZQBX2gJDbo0g==",
+      "version": "7.15.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.15.7.tgz",
+      "integrity": "sha512-K4JvCtQqad9OY2+yTU8w+E82ywk/fe+ELNlt1G8z3bVGlZfn/hOcQQsUhGhW/N+tb3fxK800wLtKOE/aM0m72w==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
@@ -461,9 +464,9 @@
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.15.6",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.15.6.tgz",
-      "integrity": "sha512-S/TSCcsRuCkmpUuoWijua0Snt+f3ewU/8spLo+4AXJCZfT0bVCzLD5MuOKdrx0mlAptbKzn5AdgEIIKXxXkz9Q==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.15.8.tgz",
+      "integrity": "sha512-BRYa3wcQnjS/nqI8Ac94pYYpJfojHVvVXJ97+IDCImX4Jc8W8Xv1+47enbruk+q1etOpsQNwnfFcNGw+gtPGxA==",
       "dev": true,
       "bin": {
         "parser": "bin/babel-parser.js"
@@ -490,9 +493,9 @@
       }
     },
     "node_modules/@babel/plugin-proposal-async-generator-functions": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.15.4.tgz",
-      "integrity": "sha512-2zt2g5vTXpMC3OmK6uyjvdXptbhBXfA77XGrd3gh93zwG8lZYBLOBImiGBEG0RANu3JqKEACCz5CGk73OJROBw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.15.8.tgz",
+      "integrity": "sha512-2Z5F2R2ibINTc63mY7FLqGfEbmofrHU9FitJW1Q7aPaKFhiPvSq6QEt/BoWN5oME3GVyjcRuNNSRbb9LC0CSWA==",
       "dev": true,
       "dependencies": {
         "@babel/helper-plugin-utils": "^7.14.5",
@@ -1509,15 +1512,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-runtime": {
-      "version": "7.15.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.15.0.tgz",
-      "integrity": "sha512-sfHYkLGjhzWTq6xsuQ01oEsUYjkHRux9fW1iUA68dC7Qd8BS1Unq4aZ8itmQp95zUzIcyR2EbNMTzAicFj+guw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.15.8.tgz",
+      "integrity": "sha512-+6zsde91jMzzvkzuEA3k63zCw+tm/GvuuabkpisgbDMTPQsIMHllE3XczJFFtEHLjjhKQFZmGQVRdELetlWpVw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-module-imports": "^7.14.5",
+        "@babel/helper-module-imports": "^7.15.4",
         "@babel/helper-plugin-utils": "^7.14.5",
         "babel-plugin-polyfill-corejs2": "^0.2.2",
-        "babel-plugin-polyfill-corejs3": "^0.2.2",
+        "babel-plugin-polyfill-corejs3": "^0.2.5",
         "babel-plugin-polyfill-regenerator": "^0.2.2",
         "semver": "^6.3.0"
       },
@@ -1544,13 +1547,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-spread": {
-      "version": "7.14.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.14.6.tgz",
-      "integrity": "sha512-Zr0x0YroFJku7n7+/HH3A2eIrGMjbmAIbJSVv0IZ+t3U2WUQUA64S/oeied2e+MaGSjmt4alzBCsK9E8gh+fag==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.15.8.tgz",
+      "integrity": "sha512-/daZ8s2tNaRekl9YJa9X4bzjpeRZLt122cpgFnQPLGUe61PH8zMEBmYqKkW5xF5JUEh5buEGXJoQpqBmIbpmEQ==",
       "dev": true,
       "dependencies": {
         "@babel/helper-plugin-utils": "^7.14.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.14.5"
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.15.4"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1653,9 +1656,9 @@
       }
     },
     "node_modules/@babel/preset-env": {
-      "version": "7.15.6",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.15.6.tgz",
-      "integrity": "sha512-L+6jcGn7EWu7zqaO2uoTDjjMBW+88FXzV8KvrBl2z6MtRNxlsmUNRlZPaNNPUTgqhyC5DHNFk/2Jmra+ublZWw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.15.8.tgz",
+      "integrity": "sha512-rCC0wH8husJgY4FPbHsiYyiLxSY8oMDJH7Rl6RQMknbN9oDDHhM9RDFvnGM2MgkbUJzSQB4gtuwygY5mCqGSsA==",
       "dev": true,
       "dependencies": {
         "@babel/compat-data": "^7.15.0",
@@ -1663,7 +1666,7 @@
         "@babel/helper-plugin-utils": "^7.14.5",
         "@babel/helper-validator-option": "^7.14.5",
         "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.15.4",
-        "@babel/plugin-proposal-async-generator-functions": "^7.15.4",
+        "@babel/plugin-proposal-async-generator-functions": "^7.15.8",
         "@babel/plugin-proposal-class-properties": "^7.14.5",
         "@babel/plugin-proposal-class-static-block": "^7.15.4",
         "@babel/plugin-proposal-dynamic-import": "^7.14.5",
@@ -1718,7 +1721,7 @@
         "@babel/plugin-transform-regenerator": "^7.14.5",
         "@babel/plugin-transform-reserved-words": "^7.14.5",
         "@babel/plugin-transform-shorthand-properties": "^7.14.5",
-        "@babel/plugin-transform-spread": "^7.14.6",
+        "@babel/plugin-transform-spread": "^7.15.8",
         "@babel/plugin-transform-sticky-regex": "^7.14.5",
         "@babel/plugin-transform-template-literals": "^7.14.5",
         "@babel/plugin-transform-typeof-symbol": "^7.14.5",
@@ -1727,7 +1730,7 @@
         "@babel/preset-modules": "^0.1.4",
         "@babel/types": "^7.15.6",
         "babel-plugin-polyfill-corejs2": "^0.2.2",
-        "babel-plugin-polyfill-corejs3": "^0.2.2",
+        "babel-plugin-polyfill-corejs3": "^0.2.5",
         "babel-plugin-polyfill-regenerator": "^0.2.2",
         "core-js-compat": "^3.16.0",
         "semver": "^6.3.0"
@@ -2766,9 +2769,9 @@
       }
     },
     "node_modules/@types/react-redux": {
-      "version": "7.1.18",
-      "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.18.tgz",
-      "integrity": "sha512-9iwAsPyJ9DLTRH+OFeIrm9cAbIj1i2ANL3sKQFATqnPWRbg+jEFXyZOKHiQK/N86pNRXbb4HRxAxo0SIX1XwzQ==",
+      "version": "7.1.19",
+      "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.19.tgz",
+      "integrity": "sha512-L37dSCT0aoJnCgpR8Iuginlbxoh7qhWOXiaDqEsxVMrER1CmVhFD+63NxgJeT4pkmEM28oX0NH4S4f+sXHTZjA==",
       "dependencies": {
         "@types/hoist-non-react-statics": "^3.3.0",
         "@types/react": "*",
@@ -3081,16 +3084,16 @@
       }
     },
     "node_modules/autoprefixer": {
-      "version": "10.3.6",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.3.6.tgz",
-      "integrity": "sha512-3bDjTfF0MfZntwVCSd18XAT2Zndufh3Mep+mafbzdIQEeWbncVRUVDjH8/EPANV9Hq40seJ24QcYAyhUsFz7gQ==",
+      "version": "10.3.7",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.3.7.tgz",
+      "integrity": "sha512-EmGpu0nnQVmMhX8ROoJ7Mx8mKYPlcUHuxkwrRYEYMz85lu7H09v8w6R1P0JPdn/hKU32GjpLBFEOuIlDWCRWvg==",
       "dev": true,
       "dependencies": {
-        "browserslist": "^4.17.1",
-        "caniuse-lite": "^1.0.30001260",
+        "browserslist": "^4.17.3",
+        "caniuse-lite": "^1.0.30001264",
         "fraction.js": "^4.1.1",
-        "nanocolors": "^0.2.8",
         "normalize-range": "^0.1.2",
+        "picocolors": "^0.2.1",
         "postcss-value-parser": "^4.1.0"
       },
       "bin": {
@@ -3182,13 +3185,13 @@
       }
     },
     "node_modules/babel-plugin-polyfill-corejs3": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.2.3.tgz",
-      "integrity": "sha512-rCOFzEIJpJEAU14XCcV/erIf/wZQMmMT5l5vXOpL5uoznyOGfDIjPj6FVytMvtzaKSTSVKouOCTPJ5OMUZH30g==",
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.2.5.tgz",
+      "integrity": "sha512-ninF5MQNwAX9Z7c9ED+H2pGt1mXdP4TqzlHKyPIYmJIYz0N+++uwdM7RnJukklhzJ54Q84vA4ZJkgs7lu5vqcw==",
       "dev": true,
       "dependencies": {
         "@babel/helper-define-polyfill-provider": "^0.2.2",
-        "core-js-compat": "^3.14.0"
+        "core-js-compat": "^3.16.2"
       },
       "peerDependencies": {
         "@babel/core": "^7.0.0-0"
@@ -3674,16 +3677,16 @@
       }
     },
     "node_modules/browserslist": {
-      "version": "4.17.1",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.17.1.tgz",
-      "integrity": "sha512-aLD0ZMDSnF4lUt4ZDNgqi5BUn9BZ7YdQdI/cYlILrhdSSZJLU9aNZoD5/NBmM4SK34APB2e83MOsRt1EnkuyaQ==",
+      "version": "4.17.3",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.17.3.tgz",
+      "integrity": "sha512-59IqHJV5VGdcJZ+GZ2hU5n4Kv3YiASzW6Xk5g9tf5a/MAzGeFwgGWU39fVzNIOVcgB3+Gp+kiQu0HEfTVU/3VQ==",
       "dev": true,
       "dependencies": {
-        "caniuse-lite": "^1.0.30001259",
-        "electron-to-chromium": "^1.3.846",
+        "caniuse-lite": "^1.0.30001264",
+        "electron-to-chromium": "^1.3.857",
         "escalade": "^3.1.1",
-        "nanocolors": "^0.1.5",
-        "node-releases": "^1.1.76"
+        "node-releases": "^1.1.77",
+        "picocolors": "^0.2.1"
       },
       "bin": {
         "browserslist": "cli.js"
@@ -3696,12 +3699,6 @@
         "url": "https://opencollective.com/browserslist"
       }
     },
-    "node_modules/browserslist/node_modules/nanocolors": {
-      "version": "0.1.12",
-      "resolved": "https://registry.npmjs.org/nanocolors/-/nanocolors-0.1.12.tgz",
-      "integrity": "sha512-2nMHqg1x5PU+unxX7PGY7AuYxl2qDx7PSrTRjizr8sxdd3l/3hBuWWaki62qmtYm2U5i4Z5E7GbjlyDFhs9/EQ==",
-      "dev": true
-    },
     "node_modules/buffer": {
       "version": "5.7.1",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
@@ -3830,24 +3827,15 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001260",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001260.tgz",
-      "integrity": "sha512-Fhjc/k8725ItmrvW5QomzxLeojewxvqiYCKeFcfFEhut28IVLdpHU19dneOmltZQIE5HNbawj1HYD+1f2bM1Dg==",
+      "version": "1.0.30001265",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001265.tgz",
+      "integrity": "sha512-YzBnspggWV5hep1m9Z6sZVLOt7vrju8xWooFAgN6BA5qvy98qPAPb7vNUzypFaoh2pb3vlfzbDO8tB57UPGbtw==",
       "dev": true,
-      "dependencies": {
-        "nanocolors": "^0.1.0"
-      },
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/browserslist"
       }
     },
-    "node_modules/caniuse-lite/node_modules/nanocolors": {
-      "version": "0.1.12",
-      "resolved": "https://registry.npmjs.org/nanocolors/-/nanocolors-0.1.12.tgz",
-      "integrity": "sha512-2nMHqg1x5PU+unxX7PGY7AuYxl2qDx7PSrTRjizr8sxdd3l/3hBuWWaki62qmtYm2U5i4Z5E7GbjlyDFhs9/EQ==",
-      "dev": true
-    },
     "node_modules/caseless": {
       "version": "0.12.0",
       "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
@@ -4980,9 +4968,9 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.3.850",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.850.tgz",
-      "integrity": "sha512-ZzkDcdzePeF4dhoGZQT77V2CyJOpwfTZEOg4h0x6R/jQhGt/rIRpbRyVreWLtD7B/WsVxo91URm2WxMKR9JQZA==",
+      "version": "1.3.864",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.864.tgz",
+      "integrity": "sha512-v4rbad8GO6/yVI92WOeU9Wgxc4NA0n4f6P1FvZTY+jyY7JHEhw3bduYu60v3Q1h81Cg6eo4ApZrFPuycwd5hGw==",
       "dev": true
     },
     "node_modules/emoji-regex": {
@@ -7307,9 +7295,9 @@
       }
     },
     "node_modules/node-releases": {
-      "version": "1.1.76",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.76.tgz",
-      "integrity": "sha512-9/IECtNr8dXNmPWmFXepT0/7o5eolGesHUa3mtr0KlgnCvnZxwh2qensKL42JJY2vQKC3nIBXetFAqR+PW1CmA==",
+      "version": "1.1.77",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.77.tgz",
+      "integrity": "sha512-rB1DUFUNAN4Gn9keO2K1efO35IDK7yKHCdCaIMvFO7yUYmmZYeDjnGKle26G4rwj+LKRQpjyUUvMkPglwGCYNQ==",
       "dev": true
     },
     "node_modules/normalize-path": {
@@ -7997,6 +7985,12 @@
       "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=",
       "dev": true
     },
+    "node_modules/picocolors": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
+      "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==",
+      "dev": true
+    },
     "node_modules/picomatch": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
@@ -8083,13 +8077,13 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.3.8",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.8.tgz",
-      "integrity": "sha512-GT5bTjjZnwDifajzczOC+r3FI3Cu+PgPvrsjhQdRqa2kTJ4968/X9CUce9xttIB0xOs5c6xf0TCWZo/y9lF6bA==",
+      "version": "8.3.9",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.9.tgz",
+      "integrity": "sha512-f/ZFyAKh9Dnqytx5X62jgjhhzttjZS7hMsohcI7HEI5tjELX/HxCy3EFhsRxyzGvrzFF+82XPvCS8T9TFleVJw==",
       "dev": true,
       "dependencies": {
-        "nanocolors": "^0.2.2",
-        "nanoid": "^3.1.25",
+        "nanoid": "^3.1.28",
+        "picocolors": "^0.2.1",
         "source-map-js": "^0.6.2"
       },
       "engines": {
@@ -11239,9 +11233,9 @@
   },
   "dependencies": {
     "@babel/code-frame": {
-      "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.14.5.tgz",
-      "integrity": "sha512-9pzDqyc6OLDaqe+zbACgFkb6fKMNG6CObKpnYXChRsvYGyEdc7CA2BaqeOM+vOtCS5ndmJicPJhKAwYRI6UfFw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.15.8.tgz",
+      "integrity": "sha512-2IAnmn8zbvC/jKYhq5Ki9I+DwjlrtMPUCH/CpHvqI4dNnlwHwsxoIhlc8WcYY5LSYknXQtAlFYuHfqAFCvQ4Wg==",
       "dev": true,
       "requires": {
         "@babel/highlight": "^7.14.5"
@@ -11254,20 +11248,20 @@
       "dev": true
     },
     "@babel/core": {
-      "version": "7.15.5",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.15.5.tgz",
-      "integrity": "sha512-pYgXxiwAgQpgM1bNkZsDEq85f0ggXMA5L7c+o3tskGMh2BunCI9QUwB9Z4jpvXUOuMdyGKiGKQiRe11VS6Jzvg==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.15.8.tgz",
+      "integrity": "sha512-3UG9dsxvYBMYwRv+gS41WKHno4K60/9GPy1CJaH6xy3Elq8CTtvtjT5R5jmNhXfCYLX2mTw+7/aq5ak/gOE0og==",
       "dev": true,
       "requires": {
-        "@babel/code-frame": "^7.14.5",
-        "@babel/generator": "^7.15.4",
+        "@babel/code-frame": "^7.15.8",
+        "@babel/generator": "^7.15.8",
         "@babel/helper-compilation-targets": "^7.15.4",
-        "@babel/helper-module-transforms": "^7.15.4",
+        "@babel/helper-module-transforms": "^7.15.8",
         "@babel/helpers": "^7.15.4",
-        "@babel/parser": "^7.15.5",
+        "@babel/parser": "^7.15.8",
         "@babel/template": "^7.15.4",
         "@babel/traverse": "^7.15.4",
-        "@babel/types": "^7.15.4",
+        "@babel/types": "^7.15.6",
         "convert-source-map": "^1.7.0",
         "debug": "^4.1.0",
         "gensync": "^1.0.0-beta.2",
@@ -11277,12 +11271,12 @@
       }
     },
     "@babel/generator": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.15.4.tgz",
-      "integrity": "sha512-d3itta0tu+UayjEORPNz6e1T3FtvWlP5N4V5M+lhp/CxT4oAA7/NcScnpRyspUMLK6tu9MNHmQHxRykuN2R7hw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.15.8.tgz",
+      "integrity": "sha512-ECmAKstXbp1cvpTTZciZCgfOt6iN64lR0d+euv3UZisU5awfRawOvg07Utn/qBGuH4bRIEZKrA/4LzZyXhZr8g==",
       "dev": true,
       "requires": {
-        "@babel/types": "^7.15.4",
+        "@babel/types": "^7.15.6",
         "jsesc": "^2.5.1",
         "source-map": "^0.5.0"
       }
@@ -11415,19 +11409,19 @@
       }
     },
     "@babel/helper-module-transforms": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.15.4.tgz",
-      "integrity": "sha512-9fHHSGE9zTC++KuXLZcB5FKgvlV83Ox+NLUmQTawovwlJ85+QMhk1CnVk406CQVj97LaWod6KVjl2Sfgw9Aktw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.15.8.tgz",
+      "integrity": "sha512-DfAfA6PfpG8t4S6npwzLvTUpp0sS7JrcuaMiy1Y5645laRJIp/LiLGIBbQKaXSInK8tiGNI7FL7L8UvB8gdUZg==",
       "dev": true,
       "requires": {
         "@babel/helper-module-imports": "^7.15.4",
         "@babel/helper-replace-supers": "^7.15.4",
         "@babel/helper-simple-access": "^7.15.4",
         "@babel/helper-split-export-declaration": "^7.15.4",
-        "@babel/helper-validator-identifier": "^7.14.9",
+        "@babel/helper-validator-identifier": "^7.15.7",
         "@babel/template": "^7.15.4",
         "@babel/traverse": "^7.15.4",
-        "@babel/types": "^7.15.4"
+        "@babel/types": "^7.15.6"
       }
     },
     "@babel/helper-optimise-call-expression": {
@@ -11496,9 +11490,9 @@
       }
     },
     "@babel/helper-validator-identifier": {
-      "version": "7.14.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.9.tgz",
-      "integrity": "sha512-pQYxPY0UP6IHISRitNe8bsijHex4TWZXi2HwKVsjPiltzlhse2znVcm9Ace510VT1kxIHjGJCZZQBX2gJDbo0g==",
+      "version": "7.15.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.15.7.tgz",
+      "integrity": "sha512-K4JvCtQqad9OY2+yTU8w+E82ywk/fe+ELNlt1G8z3bVGlZfn/hOcQQsUhGhW/N+tb3fxK800wLtKOE/aM0m72w==",
       "dev": true
     },
     "@babel/helper-validator-option": {
@@ -11542,9 +11536,9 @@
       }
     },
     "@babel/parser": {
-      "version": "7.15.6",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.15.6.tgz",
-      "integrity": "sha512-S/TSCcsRuCkmpUuoWijua0Snt+f3ewU/8spLo+4AXJCZfT0bVCzLD5MuOKdrx0mlAptbKzn5AdgEIIKXxXkz9Q==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.15.8.tgz",
+      "integrity": "sha512-BRYa3wcQnjS/nqI8Ac94pYYpJfojHVvVXJ97+IDCImX4Jc8W8Xv1+47enbruk+q1etOpsQNwnfFcNGw+gtPGxA==",
       "dev": true
     },
     "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": {
@@ -11559,9 +11553,9 @@
       }
     },
     "@babel/plugin-proposal-async-generator-functions": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.15.4.tgz",
-      "integrity": "sha512-2zt2g5vTXpMC3OmK6uyjvdXptbhBXfA77XGrd3gh93zwG8lZYBLOBImiGBEG0RANu3JqKEACCz5CGk73OJROBw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.15.8.tgz",
+      "integrity": "sha512-2Z5F2R2ibINTc63mY7FLqGfEbmofrHU9FitJW1Q7aPaKFhiPvSq6QEt/BoWN5oME3GVyjcRuNNSRbb9LC0CSWA==",
       "dev": true,
       "requires": {
         "@babel/helper-plugin-utils": "^7.14.5",
@@ -12215,15 +12209,15 @@
       }
     },
     "@babel/plugin-transform-runtime": {
-      "version": "7.15.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.15.0.tgz",
-      "integrity": "sha512-sfHYkLGjhzWTq6xsuQ01oEsUYjkHRux9fW1iUA68dC7Qd8BS1Unq4aZ8itmQp95zUzIcyR2EbNMTzAicFj+guw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.15.8.tgz",
+      "integrity": "sha512-+6zsde91jMzzvkzuEA3k63zCw+tm/GvuuabkpisgbDMTPQsIMHllE3XczJFFtEHLjjhKQFZmGQVRdELetlWpVw==",
       "dev": true,
       "requires": {
-        "@babel/helper-module-imports": "^7.14.5",
+        "@babel/helper-module-imports": "^7.15.4",
         "@babel/helper-plugin-utils": "^7.14.5",
         "babel-plugin-polyfill-corejs2": "^0.2.2",
-        "babel-plugin-polyfill-corejs3": "^0.2.2",
+        "babel-plugin-polyfill-corejs3": "^0.2.5",
         "babel-plugin-polyfill-regenerator": "^0.2.2",
         "semver": "^6.3.0"
       }
@@ -12238,13 +12232,13 @@
       }
     },
     "@babel/plugin-transform-spread": {
-      "version": "7.14.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.14.6.tgz",
-      "integrity": "sha512-Zr0x0YroFJku7n7+/HH3A2eIrGMjbmAIbJSVv0IZ+t3U2WUQUA64S/oeied2e+MaGSjmt4alzBCsK9E8gh+fag==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.15.8.tgz",
+      "integrity": "sha512-/daZ8s2tNaRekl9YJa9X4bzjpeRZLt122cpgFnQPLGUe61PH8zMEBmYqKkW5xF5JUEh5buEGXJoQpqBmIbpmEQ==",
       "dev": true,
       "requires": {
         "@babel/helper-plugin-utils": "^7.14.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.14.5"
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.15.4"
       }
     },
     "@babel/plugin-transform-sticky-regex": {
@@ -12305,9 +12299,9 @@
       }
     },
     "@babel/preset-env": {
-      "version": "7.15.6",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.15.6.tgz",
-      "integrity": "sha512-L+6jcGn7EWu7zqaO2uoTDjjMBW+88FXzV8KvrBl2z6MtRNxlsmUNRlZPaNNPUTgqhyC5DHNFk/2Jmra+ublZWw==",
+      "version": "7.15.8",
+      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.15.8.tgz",
+      "integrity": "sha512-rCC0wH8husJgY4FPbHsiYyiLxSY8oMDJH7Rl6RQMknbN9oDDHhM9RDFvnGM2MgkbUJzSQB4gtuwygY5mCqGSsA==",
       "dev": true,
       "requires": {
         "@babel/compat-data": "^7.15.0",
@@ -12315,7 +12309,7 @@
         "@babel/helper-plugin-utils": "^7.14.5",
         "@babel/helper-validator-option": "^7.14.5",
         "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.15.4",
-        "@babel/plugin-proposal-async-generator-functions": "^7.15.4",
+        "@babel/plugin-proposal-async-generator-functions": "^7.15.8",
         "@babel/plugin-proposal-class-properties": "^7.14.5",
         "@babel/plugin-proposal-class-static-block": "^7.15.4",
         "@babel/plugin-proposal-dynamic-import": "^7.14.5",
@@ -12370,7 +12364,7 @@
         "@babel/plugin-transform-regenerator": "^7.14.5",
         "@babel/plugin-transform-reserved-words": "^7.14.5",
         "@babel/plugin-transform-shorthand-properties": "^7.14.5",
-        "@babel/plugin-transform-spread": "^7.14.6",
+        "@babel/plugin-transform-spread": "^7.15.8",
         "@babel/plugin-transform-sticky-regex": "^7.14.5",
         "@babel/plugin-transform-template-literals": "^7.14.5",
         "@babel/plugin-transform-typeof-symbol": "^7.14.5",
@@ -12379,7 +12373,7 @@
         "@babel/preset-modules": "^0.1.4",
         "@babel/types": "^7.15.6",
         "babel-plugin-polyfill-corejs2": "^0.2.2",
-        "babel-plugin-polyfill-corejs3": "^0.2.2",
+        "babel-plugin-polyfill-corejs3": "^0.2.5",
         "babel-plugin-polyfill-regenerator": "^0.2.2",
         "core-js-compat": "^3.16.0",
         "semver": "^6.3.0"
@@ -13229,9 +13223,9 @@
       }
     },
     "@types/react-redux": {
-      "version": "7.1.18",
-      "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.18.tgz",
-      "integrity": "sha512-9iwAsPyJ9DLTRH+OFeIrm9cAbIj1i2ANL3sKQFATqnPWRbg+jEFXyZOKHiQK/N86pNRXbb4HRxAxo0SIX1XwzQ==",
+      "version": "7.1.19",
+      "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.19.tgz",
+      "integrity": "sha512-L37dSCT0aoJnCgpR8Iuginlbxoh7qhWOXiaDqEsxVMrER1CmVhFD+63NxgJeT4pkmEM28oX0NH4S4f+sXHTZjA==",
       "requires": {
         "@types/hoist-non-react-statics": "^3.3.0",
         "@types/react": "*",
@@ -13483,16 +13477,16 @@
       "dev": true
     },
     "autoprefixer": {
-      "version": "10.3.6",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.3.6.tgz",
-      "integrity": "sha512-3bDjTfF0MfZntwVCSd18XAT2Zndufh3Mep+mafbzdIQEeWbncVRUVDjH8/EPANV9Hq40seJ24QcYAyhUsFz7gQ==",
+      "version": "10.3.7",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.3.7.tgz",
+      "integrity": "sha512-EmGpu0nnQVmMhX8ROoJ7Mx8mKYPlcUHuxkwrRYEYMz85lu7H09v8w6R1P0JPdn/hKU32GjpLBFEOuIlDWCRWvg==",
       "dev": true,
       "requires": {
-        "browserslist": "^4.17.1",
-        "caniuse-lite": "^1.0.30001260",
+        "browserslist": "^4.17.3",
+        "caniuse-lite": "^1.0.30001264",
         "fraction.js": "^4.1.1",
-        "nanocolors": "^0.2.8",
         "normalize-range": "^0.1.2",
+        "picocolors": "^0.2.1",
         "postcss-value-parser": "^4.1.0"
       }
     },
@@ -13564,13 +13558,13 @@
       }
     },
     "babel-plugin-polyfill-corejs3": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.2.3.tgz",
-      "integrity": "sha512-rCOFzEIJpJEAU14XCcV/erIf/wZQMmMT5l5vXOpL5uoznyOGfDIjPj6FVytMvtzaKSTSVKouOCTPJ5OMUZH30g==",
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.2.5.tgz",
+      "integrity": "sha512-ninF5MQNwAX9Z7c9ED+H2pGt1mXdP4TqzlHKyPIYmJIYz0N+++uwdM7RnJukklhzJ54Q84vA4ZJkgs7lu5vqcw==",
       "dev": true,
       "requires": {
         "@babel/helper-define-polyfill-provider": "^0.2.2",
-        "core-js-compat": "^3.14.0"
+        "core-js-compat": "^3.16.2"
       }
     },
     "babel-plugin-polyfill-regenerator": {
@@ -13964,24 +13958,16 @@
       }
     },
     "browserslist": {
-      "version": "4.17.1",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.17.1.tgz",
-      "integrity": "sha512-aLD0ZMDSnF4lUt4ZDNgqi5BUn9BZ7YdQdI/cYlILrhdSSZJLU9aNZoD5/NBmM4SK34APB2e83MOsRt1EnkuyaQ==",
+      "version": "4.17.3",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.17.3.tgz",
+      "integrity": "sha512-59IqHJV5VGdcJZ+GZ2hU5n4Kv3YiASzW6Xk5g9tf5a/MAzGeFwgGWU39fVzNIOVcgB3+Gp+kiQu0HEfTVU/3VQ==",
       "dev": true,
       "requires": {
-        "caniuse-lite": "^1.0.30001259",
-        "electron-to-chromium": "^1.3.846",
+        "caniuse-lite": "^1.0.30001264",
+        "electron-to-chromium": "^1.3.857",
         "escalade": "^3.1.1",
-        "nanocolors": "^0.1.5",
-        "node-releases": "^1.1.76"
-      },
-      "dependencies": {
-        "nanocolors": {
-          "version": "0.1.12",
-          "resolved": "https://registry.npmjs.org/nanocolors/-/nanocolors-0.1.12.tgz",
-          "integrity": "sha512-2nMHqg1x5PU+unxX7PGY7AuYxl2qDx7PSrTRjizr8sxdd3l/3hBuWWaki62qmtYm2U5i4Z5E7GbjlyDFhs9/EQ==",
-          "dev": true
-        }
+        "node-releases": "^1.1.77",
+        "picocolors": "^0.2.1"
       }
     },
     "buffer": {
@@ -14068,21 +14054,10 @@
       }
     },
     "caniuse-lite": {
-      "version": "1.0.30001260",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001260.tgz",
-      "integrity": "sha512-Fhjc/k8725ItmrvW5QomzxLeojewxvqiYCKeFcfFEhut28IVLdpHU19dneOmltZQIE5HNbawj1HYD+1f2bM1Dg==",
-      "dev": true,
-      "requires": {
-        "nanocolors": "^0.1.0"
-      },
-      "dependencies": {
-        "nanocolors": {
-          "version": "0.1.12",
-          "resolved": "https://registry.npmjs.org/nanocolors/-/nanocolors-0.1.12.tgz",
-          "integrity": "sha512-2nMHqg1x5PU+unxX7PGY7AuYxl2qDx7PSrTRjizr8sxdd3l/3hBuWWaki62qmtYm2U5i4Z5E7GbjlyDFhs9/EQ==",
-          "dev": true
-        }
-      }
+      "version": "1.0.30001265",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001265.tgz",
+      "integrity": "sha512-YzBnspggWV5hep1m9Z6sZVLOt7vrju8xWooFAgN6BA5qvy98qPAPb7vNUzypFaoh2pb3vlfzbDO8tB57UPGbtw==",
+      "dev": true
     },
     "caseless": {
       "version": "0.12.0",
@@ -14949,9 +14924,9 @@
       }
     },
     "electron-to-chromium": {
-      "version": "1.3.850",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.850.tgz",
-      "integrity": "sha512-ZzkDcdzePeF4dhoGZQT77V2CyJOpwfTZEOg4h0x6R/jQhGt/rIRpbRyVreWLtD7B/WsVxo91URm2WxMKR9JQZA==",
+      "version": "1.3.864",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.864.tgz",
+      "integrity": "sha512-v4rbad8GO6/yVI92WOeU9Wgxc4NA0n4f6P1FvZTY+jyY7JHEhw3bduYu60v3Q1h81Cg6eo4ApZrFPuycwd5hGw==",
       "dev": true
     },
     "emoji-regex": {
@@ -16684,9 +16659,9 @@
       }
     },
     "node-releases": {
-      "version": "1.1.76",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.76.tgz",
-      "integrity": "sha512-9/IECtNr8dXNmPWmFXepT0/7o5eolGesHUa3mtr0KlgnCvnZxwh2qensKL42JJY2vQKC3nIBXetFAqR+PW1CmA==",
+      "version": "1.1.77",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.77.tgz",
+      "integrity": "sha512-rB1DUFUNAN4Gn9keO2K1efO35IDK7yKHCdCaIMvFO7yUYmmZYeDjnGKle26G4rwj+LKRQpjyUUvMkPglwGCYNQ==",
       "dev": true
     },
     "normalize-path": {
@@ -17204,6 +17179,12 @@
       "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=",
       "dev": true
     },
+    "picocolors": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
+      "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==",
+      "dev": true
+    },
     "picomatch": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
@@ -17265,13 +17246,13 @@
       }
     },
     "postcss": {
-      "version": "8.3.8",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.8.tgz",
-      "integrity": "sha512-GT5bTjjZnwDifajzczOC+r3FI3Cu+PgPvrsjhQdRqa2kTJ4968/X9CUce9xttIB0xOs5c6xf0TCWZo/y9lF6bA==",
+      "version": "8.3.9",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.9.tgz",
+      "integrity": "sha512-f/ZFyAKh9Dnqytx5X62jgjhhzttjZS7hMsohcI7HEI5tjELX/HxCy3EFhsRxyzGvrzFF+82XPvCS8T9TFleVJw==",
       "dev": true,
       "requires": {
-        "nanocolors": "^0.2.2",
-        "nanoid": "^3.1.25",
+        "nanoid": "^3.1.28",
+        "picocolors": "^0.2.1",
         "source-map-js": "^0.6.2"
       }
     },
diff --git a/package.json b/package.json
index 3e5250e4..d4f573b4 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-flow-renderer",
-  "version": "9.6.8",
+  "version": "9.6.9",
   "engines": {
     "node": ">=12"
   },
@@ -33,7 +33,7 @@
   "dependencies": {
     "@babel/runtime": "^7.15.4",
     "@types/d3": "^7.0.0",
-    "@types/react-redux": "^7.1.18",
+    "@types/react-redux": "^7.1.19",
     "classcat": "^5.0.3",
     "d3-selection": "^3.0.0",
     "d3-zoom": "^3.0.0",
@@ -43,9 +43,9 @@
     "redux": "^4.1.1"
   },
   "devDependencies": {
-    "@babel/core": "^7.15.5",
-    "@babel/plugin-transform-runtime": "^7.15.0",
-    "@babel/preset-env": "^7.15.6",
+    "@babel/core": "^7.15.8",
+    "@babel/plugin-transform-runtime": "^7.15.8",
+    "@babel/preset-env": "^7.15.8",
     "@babel/preset-react": "^7.14.5",
     "@rollup/plugin-babel": "^5.3.0",
     "@rollup/plugin-commonjs": "^21.0.0",
@@ -54,10 +54,10 @@
     "@svgr/rollup": "^5.5.0",
     "@types/redux": "^3.6.31",
     "@types/resize-observer-browser": "^0.1.6",
-    "autoprefixer": "^10.3.6",
+    "autoprefixer": "^10.3.7",
     "babel-preset-react-app": "^10.0.0",
     "cypress": "^8.5.0",
-    "postcss": "^8.3.8",
+    "postcss": "^8.3.9",
     "postcss-cli": "^9.0.1",
     "postcss-nested": "^5.0.6",
     "prettier": "2.4.1",
diff --git a/src/components/Edges/BezierEdge.tsx b/src/components/Edges/BezierEdge.tsx
index 368fdcc6..b4c94197 100644
--- a/src/components/Edges/BezierEdge.tsx
+++ b/src/components/Edges/BezierEdge.tsx
@@ -37,9 +37,9 @@ export function getBezierPath({
   if (leftAndRight.includes(sourcePosition) && leftAndRight.includes(targetPosition)) {
     path = `M${sourceX},${sourceY} C${cX},${sourceY} ${cX},${targetY} ${targetX},${targetY}`;
   } else if (leftAndRight.includes(targetPosition)) {
-    path = `M${sourceX},${sourceY} C${sourceX},${targetY} ${sourceX},${targetY} ${targetX},${targetY}`;
+    path = `M${sourceX},${sourceY} Q${sourceX},${targetY} ${targetX},${targetY}`;
   } else if (leftAndRight.includes(sourcePosition)) {
-    path = `M${sourceX},${sourceY} C${targetX},${sourceY} ${targetX},${sourceY} ${targetX},${targetY}`;
+    path = `M${sourceX},${sourceY} Q${targetX},${sourceY} ${targetX},${targetY}`;
   }
 
   return path;
diff --git a/src/components/SelectionListener/index.tsx b/src/components/SelectionListener/index.tsx
index 98e1e0d4..9f912794 100644
--- a/src/components/SelectionListener/index.tsx
+++ b/src/components/SelectionListener/index.tsx
@@ -7,9 +7,7 @@ interface SelectionListenerProps {
   onSelectionChange: (elements: Elements | null) => void;
 }
 
-// This is just a helper component for calling the onSelectionChange listener.
-// As soon as easy-peasy has implemented the effectOn hook, we can remove this component
-// and use the hook instead. https://github.com/ctrlplusb/easy-peasy/pull/459
+// This is a helper component for calling the onSelectionChange listener
 
 export default ({ onSelectionChange }: SelectionListenerProps) => {
   const selectedElements = useStoreState((s) => s.selectedElements);