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

export const IconAttributeX = 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-attribute-x`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M5.60004 2.8833C5.35152 2.55193 4.88142 2.48477 4.55004 2.7333C4.21867 2.98182 4.15152 3.45193 4.40004 3.7833L9.06256 9.99999L4.40008 16.2166C4.15155 16.548 4.21871 17.0181 4.55008 17.2666C4.88145 17.5152 5.35155 17.448 5.60008 17.1166L10.0001 11.25L14.4 17.1166C14.6486 17.448 15.1187 17.5152 15.45 17.2666C15.7814 17.0181 15.8486 16.548 15.6 16.2166L10.9376 9.99999L15.6001 3.7833C15.8486 3.45193 15.7814 2.98182 15.4501 2.7333C15.1187 2.48477 14.6486 2.55193 14.4001 2.8833L10.0001 8.74999L5.60004 2.8833Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconAttributeX.displayName = "IconAttributeX";

export default IconAttributeX;