import { forwardRef, SVGProps } from 'react';

type DragHandleProps = SVGProps<SVGSVGElement>;

type DragHandleRef = SVGSVGElement;

export const DragHandle = forwardRef<DragHandleRef, DragHandleProps>((delegated, ref) => {
  return (
    <svg ref={ref} width="11" height="18" viewBox="0 0 11 18" fill="none" {...delegated}>
      <circle cx="2" cy="2" r="2" fill="#7E8592" />
      <circle cx="2" cy="9" r="2" fill="#7E8592" />
      <circle cx="2" cy="16" r="2" fill="#7E8592" />
      <circle cx="9" cy="2" r="2" fill="#7E8592" />
      <circle cx="9" cy="9" r="2" fill="#7E8592" />
      <circle cx="9" cy="16" r="2" fill="#7E8592" />
    </svg>
  );
});

DragHandle.displayName = 'DragHandleIcon';
