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

export const IconDeviceDesktop = 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`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M16.6672 6C16.6672 4.89543 15.7717 4 14.6672 4H5.33382C4.22925 4 3.33382 4.89543 3.33382 6V14.6667H2.66715C2.29896 14.6667 2.00049 14.9652 2.00049 15.3333C2.00049 15.7015 2.29896 16 2.66715 16H17.3338C17.702 16 18.0005 15.7015 18.0005 15.3333C18.0005 14.9652 17.702 14.6667 17.3338 14.6667H16.6672V6ZM14.6665 5.33342H5.33317C4.99128 5.33342 4.7095 5.59078 4.67099 5.92233L4.66651 6.00008V12.6667H15.3332V6.00008C15.3332 5.65819 15.0758 5.37641 14.7442 5.3379L14.6665 5.33342ZM11.0005 14H9.00049C8.8164 14 8.66715 14.1493 8.66715 14.3333C8.66715 14.497 8.78507 14.6331 8.94057 14.6613L9.00049 14.6667H11.0005C11.1846 14.6667 11.3338 14.5174 11.3338 14.3333C11.3338 14.1697 11.2159 14.0336 11.0604 14.0053L11.0005 14Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconDeviceDesktop.displayName = "IconDeviceDesktop";

export default IconDeviceDesktop;