feat(edges): add arrow head options

src/components/Edges/SmoothStepEdge.tsx

@@ -1,6 +1,7 @@
 import React, { memo } from 'react';
 
 import EdgeText from './EdgeText';
+import { getMarkerEnd } from './utils';
 import { EdgeBezierProps, Position } from '../../types';
 
 // These are some helper methods for drawing the round corners
@@ -138,6 +139,8 @@ export default memo(
     style,
     sourcePosition = Position.Bottom,
     targetPosition = Position.Top,
+    arrowHeadType,
+    markerEndId,
   }: EdgeBezierProps) => {
     const yOffset = Math.abs(targetY - sourceY) / 2;
     const centerY = targetY < sourceY ? targetY + yOffset : targetY - yOffset;
@@ -158,6 +161,8 @@ export default memo(
       targetPosition,
     });
 
+    const markerEnd = getMarkerEnd(arrowHeadType, markerEndId);
+
     const text = label ? (
       <EdgeText
         x={centerX}
@@ -171,7 +176,7 @@ export default memo(
 
     return (
       <>
-        <path style={style} className="react-flow__edge-path" d={path} />
+        <path style={style} className="react-flow__edge-path" d={path} markerEnd={markerEnd} />
         {text}
       </>
     );