fix: types

src/components/Edges/wrapEdge.tsx

@@ -1,9 +1,9 @@
 import { computed, DefineComponent, defineComponent, inject, PropType, ref } from 'vue';
-import { Edge, EdgeProps, Position, RevueFlowStore, WrapEdgeProps } from '../../types';
+import { Edge, Position, RevueFlowStore, WrapEdgeProps } from '../../types';
 import { onMouseDown } from '../Handle/handler';
 import { EdgeAnchor } from './EdgeAnchor';
 
-export default (EdgeComponent: DefineComponent<EdgeProps>) => {
+export default (EdgeComponent: DefineComponent<WrapEdgeProps>) => {
   return defineComponent({
     components: { EdgeComponent },
     props: {

src/components/NodesSelection/index.tsx

@@ -2,10 +2,10 @@
  * The nodes selection rectangle gets displayed when a user
  * made a selectio  with on or several nodes
  */
-import { isNode } from '../../utils/graph';
-import { Node, RevueFlowStore } from '../../types';
 import { computed, defineComponent, inject, PropType } from 'vue';
 import { Draggable, DraggableEventHandler } from '@braks/revue-draggable';
+import { isNode } from '../../utils/graph';
+import { Node, RevueFlowStore } from '../../types';
 
 export interface NodesSelectionProps {
   onSelectionDragStart?: (event: MouseEvent, nodes: Node[]) => void;

src/container/EdgeRenderer/utils.ts

@@ -1,23 +1,22 @@
+import { DefineComponent } from 'vue';
 import { BezierEdge, StepEdge, SmoothStepEdge, StraightEdge } from '../../components/Edges';
 import wrapEdge from '../../components/Edges/wrapEdge';
 import { rectToBox } from '../../utils/graph';
-
+import { EdgeTypesType, Position, Node, XYPosition, ElementId, HandleElement, Transform, Edge, WrapEdgeProps } from '../../types';
-import { EdgeTypesType, EdgeProps, Position, Node, XYPosition, ElementId, HandleElement, Transform, Edge } from '../../types';
-import { Component } from 'vue';
 
 export function createEdgeTypes(edgeTypes: EdgeTypesType): EdgeTypesType {
   const standardTypes: EdgeTypesType = {
-    default: wrapEdge(edgeTypes.default || BezierEdge),
+    default: wrapEdge(edgeTypes.default || BezierEdge) as DefineComponent<WrapEdgeProps>,
-    straight: wrapEdge(edgeTypes.bezier || StraightEdge),
+    straight: wrapEdge(edgeTypes.bezier || StraightEdge) as DefineComponent<WrapEdgeProps>,
-    step: wrapEdge(edgeTypes.step || StepEdge),
+    step: wrapEdge(edgeTypes.step || StepEdge) as DefineComponent<WrapEdgeProps>,
-    smoothstep: wrapEdge(edgeTypes.step || SmoothStepEdge)
+    smoothstep: wrapEdge(edgeTypes.step || SmoothStepEdge) as DefineComponent<WrapEdgeProps>
   };
 
   const wrappedTypes = {} as EdgeTypesType;
   const specialTypes: EdgeTypesType = Object.keys(edgeTypes)
     .filter((k) => !['default', 'bezier'].includes(k))
     .reduce((res, key) => {
-      res[key] = wrapEdge((edgeTypes[key] || BezierEdge) as Component<EdgeProps>);
+      res[key] = wrapEdge(edgeTypes[key] || BezierEdge) as DefineComponent<WrapEdgeProps>;
 
       return res;
     }, wrappedTypes);

src/container/NodeRenderer/utils.ts

@@ -2,20 +2,21 @@ import DefaultNode from '../../components/Nodes/DefaultNode';
 import InputNode from '../../components/Nodes/InputNode';
 import OutputNode from '../../components/Nodes/OutputNode';
 import wrapNode from '../../components/Nodes/wrapNode';
-import { NodeTypesType } from '../../types';
+import { NodeTypesType, WrapNodeProps } from '../../types';
+import { DefineComponent } from 'vue';
 
 export function createNodeTypes(nodeTypes: NodeTypesType): NodeTypesType {
   const standardTypes: NodeTypesType = {
-    input: wrapNode(nodeTypes.input || InputNode),
+    input: wrapNode(nodeTypes.input || InputNode) as DefineComponent<WrapNodeProps>,
-    default: wrapNode(nodeTypes.default || DefaultNode),
+    default: wrapNode(nodeTypes.default || DefaultNode) as DefineComponent<WrapNodeProps>,
-    output: wrapNode(nodeTypes.output || OutputNode)
+    output: wrapNode(nodeTypes.output || OutputNode) as DefineComponent<WrapNodeProps>
   };
 
   const wrappedTypes = {} as NodeTypesType;
   const specialTypes: NodeTypesType = Object.keys(nodeTypes)
     .filter((k) => !['input', 'default', 'output'].includes(k))
     .reduce((res, key) => {
-      res[key] = wrapNode(nodeTypes[key] || DefaultNode);
+      res[key] = wrapNode(nodeTypes[key] || DefaultNode) as DefineComponent<WrapNodeProps>;
 
       return res;
     }, wrappedTypes);

src/types/index.ts

@@ -87,7 +87,7 @@ export type HandleType = 'source' | 'target';
 
 export type NodeTypesType = { [key: string]: DefineComponent<WrapNodeProps> };
 
-export type EdgeTypesType = NodeTypesType;
+export type EdgeTypesType = { [key: string]: DefineComponent<WrapEdgeProps> };
 
 export interface SelectionRect extends Rect {
   startX: number;