refactor(nodes,edges,types!): Change label-type to string | VNode | Object

package/src/types/components.ts

@@ -1,4 +1,4 @@
-import { Component, CSSProperties, DefineComponent, HTMLAttributes } from 'vue'
+import { Component, CSSProperties, DefineComponent, HTMLAttributes, VNode } from 'vue'
 import { BackgroundVariant, Dimensions, ElementData, XYPosition } from './flow'
 import { GraphNode, Node, NodeProps } from './node'
 import { EdgeProps } from './edge'
@@ -99,12 +99,7 @@ export interface MiniMapNodeProps {
 export interface EdgeTextProps extends HTMLAttributes {
   x: number
   y: number
-  label?:
-    | string
-    | {
-        component: any
-        props?: any
-      }
+  label?: string | VNode | Object
   labelStyle?: CSSProperties
   labelShowBg?: boolean
   labelBgStyle?: CSSProperties

package/src/types/flow.ts

@@ -1,4 +1,4 @@
-import { CSSProperties } from 'vue'
+import { CSSProperties, VNode } from 'vue'
 import { GraphEdge, Edge, DefaultEdgeOptions } from './edge'
 import { GraphNode, CoordinateExtent, Node } from './node'
 import { ConnectionLineType, ConnectionMode } from './connection'
@@ -27,12 +27,7 @@ export type StyleFunc<Data = ElementData> = (element: FlowElement<Data>) => Styl
 /** base element props */
 export interface Element<Data extends ElementData = ElementData> {
   id: string
-  label?:
-    | string
-    | {
-        props?: any
-        component: any
-      }
+  label?: string | VNode
   type?: string
   data?: Data
   class?: string | ClassFunc<Data>

package/src/types/node.ts

@@ -1,3 +1,4 @@
+import { VNode } from 'vue'
 import { XYPosition, Position, SnapGrid, Element, XYZPosition, Dimensions, ElementData } from './flow'
 import { DefaultNodeTypes } from './components'
 import { HandleElement, ValidConnectionFunc } from './handle'
@@ -79,16 +80,16 @@ export interface NodeProps<Data = ElementData> {
   connectable: boolean
   /** absolute position in relation to parent elements + z-index */
   computedPosition: XYZPosition
-  /** x, y position */
+  /** node x, y (relative) position on graph */
   position: XYPosition
   /** dom element dimensions (width, height) */
   dimensions: Dimensions
-  label?:
-    | string
-    | {
-        props?: any
-        component: any
-      }
+  /**
+   * node label, either pass a string or a VNode
+   * For example like this: `h('div', props, children)`)
+   * Object is just a type-hack for Vue, ignore that
+   */
+  label?: string | VNode | Object
   /** called when used as target for new connection */
   isValidTargetPos?: ValidConnectionFunc
   /** called when used as source for new connection */