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

export const IconDeviceMobile = 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-mobile`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M7.7371 2.66777L12.1033 2.66669C12.8834 2.66669 13.2284 2.73776 13.5208 2.8723L13.644 2.93382C13.9699 3.10813 14.2258 3.36392 14.4 3.68985L14.4616 3.81305C14.5961 4.10547 14.6672 4.4505 14.6672 5.23057V14.7694C14.6672 15.5495 14.5961 15.8946 14.4616 16.187L14.4 16.3102C14.2258 16.6361 13.9699 16.8919 13.644 17.0662L13.5208 17.1278C13.2284 17.2623 12.8834 17.3334 12.1033 17.3334H7.89775C7.11767 17.3334 6.77265 17.2623 6.48023 17.1278L6.35702 17.0662C6.03109 16.8919 5.7753 16.6361 5.60099 16.3102L5.53947 16.187C5.41454 15.9154 5.34434 15.5986 5.33495 14.9301L5.33386 5.23057C5.33386 4.4505 5.40493 4.10547 5.53947 3.81305L5.60099 3.68985C5.7753 3.36392 6.03109 3.10813 6.35702 2.93382L6.48023 2.8723C6.75175 2.74737 7.06865 2.67716 7.7371 2.66777ZM7.77328 4.00045H12.2271L12.3381 4.00185L12.5248 4.00761L12.6712 4.01773C12.7785 4.02807 12.8523 4.04335 12.9136 4.06461L12.9824 4.09305L13.0149 4.10955C13.1085 4.1596 13.1739 4.22506 13.224 4.31863L13.2405 4.3511L13.2689 4.41998C13.2944 4.4935 13.3113 4.58503 13.3214 4.73102L13.3293 4.89651L13.3331 5.10642L13.3335 13.4361L13.3317 13.6713L13.3259 13.8579L13.3158 14.0043C13.3055 14.1117 13.2902 14.1854 13.2689 14.2467L13.2405 14.3156L13.224 14.348C13.1739 14.4416 13.1085 14.5071 13.0149 14.5571L12.9824 14.5736L12.9136 14.6021C12.84 14.6276 12.7485 14.6445 12.6025 14.6546L12.437 14.6624L12.2271 14.6662L7.89742 14.6667L7.66227 14.6649L7.47558 14.6591L7.32925 14.6489C7.22188 14.6386 7.14811 14.6234 7.08684 14.6021L7.01796 14.5736L6.98549 14.5571C6.89192 14.5071 6.82646 14.4416 6.77642 14.348L6.75992 14.3156L6.73147 14.2467C6.70596 14.1732 6.68906 14.0817 6.67896 13.9357L6.67107 13.7702L6.66732 13.5603L6.66687 5.23056L6.6687 4.9954L6.67448 4.80872L6.68459 4.6624C6.69493 4.55502 6.71021 4.48125 6.73147 4.41998L6.75992 4.3511L6.77642 4.31863C6.82646 4.22506 6.89192 4.1596 6.98549 4.10955L7.01796 4.09305L7.08684 4.06461C7.16036 4.0391 7.25189 4.0222 7.39788 4.0121L7.56338 4.00421L7.77328 4.00045ZM9.99955 15.3334C9.63136 15.3334 9.33289 15.6319 9.33289 16C9.33289 16.3682 9.63136 16.6667 9.99955 16.6667C10.3677 16.6667 10.6662 16.3682 10.6662 16C10.6662 15.6319 10.3677 15.3334 9.99955 15.3334Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconDeviceMobile.displayName = "IconDeviceMobile";

export default IconDeviceMobile;