File size: 807 Bytes
4304c6d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
import { memo } from 'react'
import type { ConnectionLineComponentProps } from 'reactflow'
import {
Position,
getBezierPath,
} from 'reactflow'
const CustomConnectionLine = ({ fromX, fromY, toX, toY }: ConnectionLineComponentProps) => {
const [
edgePath,
] = getBezierPath({
sourceX: fromX,
sourceY: fromY,
sourcePosition: Position.Right,
targetX: toX,
targetY: toY,
targetPosition: Position.Left,
curvature: 0.16,
})
return (
<g>
<path
fill="none"
stroke='#D0D5DD'
strokeWidth={2}
d={edgePath}
/>
<rect
x={toX}
y={toY - 4}
width={2}
height={8}
fill='#2970FF'
/>
</g>
)
}
export default memo(CustomConnectionLine)
|