import { forwardRef } from "react";
import type { IconProps } from "../../types";

export const IconDragArrowOutline = forwardRef<SVGSVGElement, IconProps>(
  ({ color = "currentColor", ...props }, forwardedRef) => {
    const { className } = props;
    props = {
      ...props,
      width: `${props.width || props.size || 20}`,
      height: `${props.height || props.size || 20}`,
      className: `${
        className ? className + " " : ""
      }customeow-icon customeow-icon-icon-drag-arrow-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M3.25 5.5C3.25 4.25736 4.25736 3.25 5.5 3.25H10C10.4142 3.25 10.75 3.58579 10.75 4C10.75 4.41421 10.4142 4.75 10 4.75H5.5C5.08579 4.75 4.75 5.08579 4.75 5.5V10C4.75 10.4142 4.41421 10.75 4 10.75C3.58579 10.75 3.25 10.4142 3.25 10V5.5ZM16 9.25C16.4142 9.25 16.75 9.58579 16.75 10V14.5C16.75 15.7426 15.7426 16.75 14.5 16.75H10C9.58579 16.75 9.25 16.4142 9.25 16C9.25 15.5858 9.58579 15.25 10 15.25H14.5C14.9142 15.25 15.25 14.9142 15.25 14.5V10C15.25 9.58579 15.5858 9.25 16 9.25Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconDragArrowOutline.displayName = "IconDragArrowOutline";

export default IconDragArrowOutline;