<script lang="ts" setup>
  import { MarkerArrowEnum } from '../../../enum';
</script>

<template>
  <svg>
    <defs>
      <marker
        :id="MarkerArrowEnum.BASIC_ARROW"
        markerWidth="5"
        markerHeight="5"
        viewBox="-6 -6 12 12"
        refX="5"
        refY="0"
        markerUnits="strokeWidth"
        orient="auto"
      >
        <polygon points="-2,0 -5,5 5,0 -5,-5" stroke="gray" fill="gray" stroke-width="1px" />
      </marker>
      <marker
        :id="MarkerArrowEnum.BASIC_ARROW_SELECTED"
        markerWidth="5"
        markerHeight="5"
        viewBox="-6 -6 12 12"
        refX="5"
        refY="0"
        markerUnits="strokeWidth"
        orient="auto"
      >
        <polygon points="-2,0 -5,5 5,0 -5,-5" stroke="red" fill="red" stroke-width="1px" />
      </marker>
    </defs>
  </svg>
</template>