getEdgeId

[bcakmakoglu]

getEdgeId

[bcakmakoglu]

Well in the given flow above the getEdgeId function would not work. Params aren't an edge yet, they are just the basic params to create one so it is missing an id.
But no worries, what you want already works.

You can add edge properties to the params:

onConnect((params) => {
  addEdges([
    {
      ...params,
      style: { stroke: 'blue' },
      markerEnd: MarkerType.Arrow,
      animated: true,
      label: `${params.source} - connected to - ${params.target}`,
      labelBgStyle: { background: 'orange' },
    },
  ])
})

Here the TypeScript interface as a reference

/** base element props */
export interface Element {
  id: string
  label?:
    | string
    | {
        props?: any
        component: any
      }
  type?: string
  data?: Data
  class?: string
  style?: CSSProperties
  hidden?: boolean
}

export interface Edge extends Element {
  /** Source node id */
  source: string
  /** Target node id */
  target: string
  /** Source handle id */
  sourceHandle?: string | null
  /** Target handle id */
  targetHandle?: string | null
  /** Source position */
  sourcePosition?: Position
  /** Target position */
  targetPosition?: Position
  /** Label styles (CSSProperties) */
  labelStyle?: CSSProperties
  /** Show label bg */
  labelShowBg?: boolean
  /** Label Bg styles (CSSProperties) */
  labelBgStyle?: CSSProperties
  /** Label Bg padding */
  labelBgPadding?: [number, number]
  /** Label Bg border radius */
  labelBgBorderRadius?: number
  /** Animated edge */
  animated?: boolean
  /** EdgeMarker */
  markerStart?: EdgeMarkerType
  /** EdgeMarker */
  markerEnd?: EdgeMarkerType
  /** Disable/enable updating edge */
  updatable?: boolean
  /** Disable/enable selecting edge */
  selectable?: boolean
}