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

export const IconDeviceDesktopBicolorBicolor = 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-device-desktop-bicolor-bicolor`,
  };
  return (
    <svg
      viewBox="0 0 20 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
      ref={forwardedRef}
    >
      <g fill={color} clipPath="url(#a)">
        <path d="M15.3242 3.33334C16.5515 3.33342 17.5459 4.32875 17.5459 5.556V15.1849H18.2871C18.6962 15.1849 19.0273 15.5171 19.0273 15.9261C19.0272 16.3351 18.6961 16.6663 18.2871 16.6664H1.99121C1.58217 16.6664 1.2501 16.3351 1.25 15.9261C1.25 15.517 1.58211 15.1849 1.99121 15.1849H2.73145V5.556C2.73145 4.3287 3.72681 3.33334 4.9541 3.33334H15.3242ZM8.89355 14.1781C8.64826 14.1783 8.44922 14.3771 8.44922 14.6224C8.44933 14.8677 8.64833 15.0665 8.89355 15.0667H11.5605C11.8059 15.0667 12.0048 14.8678 12.0049 14.6224C12.0049 14.3769 11.806 14.1781 11.5605 14.1781H8.89355ZM4.95312 4.81479C4.57329 4.81479 4.25964 5.10075 4.2168 5.46909L4.21191 5.556V12.9632H16.0645V5.556C16.0645 5.17626 15.7784 4.86264 15.4102 4.81967L15.3232 4.81479H4.95312Z" />
        <path
          opacity=".5"
          d="M8.44946 14.1777H12.005V15.0666H8.44946V14.1777Z"
        />
      </g>
      <defs>
        <clipPath id="a">
          <path fill={color} d="M0 0H20V20H0z" />
        </clipPath>
      </defs>
    </svg>
  );
});

IconDeviceDesktopBicolorBicolor.displayName = "IconDeviceDesktopBicolorBicolor";

export default IconDeviceDesktopBicolorBicolor;