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

export const IconTextBicolor = 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-text-bicolor`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M3.33325 6.29167C3.33325 4.81891 4.52716 3.625 5.99992 3.625H11.9999C13.4727 3.625 14.6666 4.81891 14.6666 6.29167V8.29167H13.0008C12.5618 7.23878 11.7193 6.39621 10.6664 5.95709V15.6249L10.6668 14.0573C10.6668 15.0458 11.3329 15.5683 12.6652 15.6249L12.6669 16.9583H5.33358V15.6249C6.64608 15.5692 7.31259 15.062 7.33309 14.1033V5.95696C6.28008 6.39603 5.43743 7.23867 4.99834 8.29167H3.33325V6.29167Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
        <path
          opacity=".5"
          d="M15.3124 7.29169V4.95836L15.3646 4.95898C16.8248 4.97638 17.9995 6.16509 17.9995 7.62546V9.62503H16.646C16.646 8.64469 16.2015 7.86691 15.3124 7.29169ZM11.3385 13.8714V6.411C11.7778 6.55686 12.133 6.85045 12.4042 7.29178C12.5267 7.49098 12.6656 7.92148 12.6656 8.20925V8.95123H13.9924V13.7089C13.9924 14.3189 13.9968 14.8024 14.5309 15.2248C14.809 15.4447 15.2929 15.5781 15.9827 15.6251V16.9584H13.329V14.9978C12.9133 14.9773 12.605 14.9571 12.4042 14.9371C12.1031 14.9072 11.9065 14.8341 11.744 14.769C11.438 14.6463 11.3028 14.3471 11.3385 13.8714Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconTextBicolor.displayName = "IconTextBicolor";

export default IconTextBicolor;