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

export const IconArrowChevronDoubleDownOutline = 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-arrow-chevron-double-down-outline`,
  };
  return (
    <svg
      viewBox="0 0 20 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
      ref={forwardedRef}
    >
      <path
        d="M5.23017 4.20938C4.93159 4.49647 4.92228 4.97125 5.20938 5.26983L9.45938 9.76983C9.60078 9.91689 9.79599 10 10 10C10.204 10 10.3992 9.91689 10.5406 9.76983L14.7906 5.26983C15.0777 4.97125 15.0684 4.49647 14.7698 4.20938C14.4713 3.92228 13.9965 3.93159 13.7094 4.23017L10 8.16792L6.29063 4.23017C6.00353 3.93159 5.52875 3.92228 5.23017 4.20938ZM5.23017 10.2094C4.93159 10.4965 4.92228 10.9713 5.20938 11.2698L9.45938 15.7698C9.60078 15.9169 9.79599 16 10 16C10.204 16 10.3992 15.9169 10.5406 15.7698L14.7906 11.2698C15.0777 10.9713 15.0684 10.4965 14.7698 10.2094C14.4713 9.92228 13.9965 9.93159 13.7094 10.2302L10 14.1679L6.29063 10.2302C6.00353 9.93159 5.52875 9.92228 5.23017 10.2094Z"
        fill={color}
        fillRule="evenodd"
        clipRule="evenodd"
      />
    </svg>
  );
});

IconArrowChevronDoubleDownOutline.displayName =
  "IconArrowChevronDoubleDownOutline";

export default IconArrowChevronDoubleDownOutline;