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

export const IconArrowDownCaretTriangleSolid = 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-down-caret-triangle-solid`,
  };
  return (
    <svg
      viewBox="0 0 20 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
      ref={forwardedRef}
    >
      <path
        d="M4.6098 6.66675H15.3902C15.6203 6.66675 15.8068 6.8533 15.8068 7.08341C15.8068 7.17711 15.7753 7.26806 15.7172 7.3416L10.327 14.1692C10.1844 14.3498 9.92242 14.3806 9.7418 14.238C9.71624 14.2178 9.69313 14.1947 9.67295 14.1692L4.28276 7.3416C4.14017 7.16098 4.171 6.89897 4.35161 6.75638C4.42515 6.69832 4.51611 6.66675 4.6098 6.66675Z"
        fill={color}
        fillRule="evenodd"
        clipRule="evenodd"
      />
    </svg>
  );
});

IconArrowDownCaretTriangleSolid.displayName = "IconArrowDownCaretTriangleSolid";

export default IconArrowDownCaretTriangleSolid;
