Files
xyflow/packages/core/src/components/Edges/BaseEdge.tsx
T

59 lines
1.2 KiB
TypeScript

import { isNumeric } from '@reactflow/utils';
import type { BaseEdgeProps } from '@reactflow/system';
import EdgeText from './EdgeText';
const BaseEdge = ({
path,
labelX,
labelY,
label,
labelStyle,
labelShowBg,
labelBgStyle,
labelBgPadding,
labelBgBorderRadius,
style,
markerEnd,
markerStart,
interactionWidth = 20,
}: BaseEdgeProps) => {
return (
<>
<path
style={style}
d={path}
fill="none"
className="react-flow__edge-path"
markerEnd={markerEnd}
markerStart={markerStart}
/>
{interactionWidth && (
<path
d={path}
fill="none"
strokeOpacity={0}
strokeWidth={interactionWidth}
className="react-flow__edge-interaction"
/>
)}
{label && isNumeric(labelX) && isNumeric(labelY) ? (
<EdgeText
x={labelX}
y={labelY}
label={label}
labelStyle={labelStyle}
labelShowBg={labelShowBg}
labelBgStyle={labelBgStyle}
labelBgPadding={labelBgPadding}
labelBgBorderRadius={labelBgBorderRadius}
/>
) : null}
</>
);
};
BaseEdge.displayName = 'BaseEdge';
export default BaseEdge;