import React, { ComponentType } from 'react'

import { CustomIconProps } from '@monorail/visualComponents/icon/Icon'

export const TrackingItem: ComponentType<CustomIconProps> = props => (
  <svg
    width="24"
    height="24"
    viewBox="0 0 24 24"
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
    {...props}
  >
    {props.title && <title>{props.title}</title>}
    <path
      fillRule="evenodd"
      clipRule="evenodd"
      d="M14.71 14H15.5L20.49 19L19 20.49L14 15.5V14.71L13.73 14.43C12.59 15.41 11.11 16 9.5 16C5.91 16 3 13.09 3 9.5C3 5.91 5.91 3 9.5 3C13.09 3 16 5.91 16 9.5C16 11.11 15.41 12.59 14.43 13.73L14.71 14ZM5 9.5C5 11.99 7.01 14 9.5 14C11.99 14 14 11.99 14 9.5C14 7.01 11.99 5 9.5 5C7.01 5 5 7.01 5 9.5Z"
    />
    <path
      fillRule="evenodd"
      clipRule="evenodd"
      d="M9.49996 7.3125C8.04163 7.3125 6.79621 8.21958 6.29163 9.5C6.79621 10.7804 8.04163 11.6875 9.49996 11.6875C10.9583 11.6875 12.2037 10.7804 12.7083 9.5C12.2037 8.21958 10.9583 7.3125 9.49996 7.3125ZM9.49996 10.9583C8.69496 10.9583 8.04163 10.305 8.04163 9.5C8.04163 8.695 8.69496 8.04167 9.49996 8.04167C10.305 8.04167 10.9583 8.695 10.9583 9.5C10.9583 10.305 10.305 10.9583 9.49996 10.9583ZM8.62496 9.5C8.62496 9.01583 9.01579 8.625 9.49996 8.625C9.98413 8.625 10.375 9.01583 10.375 9.5C10.375 9.98417 9.98413 10.375 9.49996 10.375C9.01579 10.375 8.62496 9.98417 8.62496 9.5Z"
    />
  </svg>
)