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

export const IconArLanguageOutline = 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-ar-language-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M5.26317 4.25C5.56844 4.25 5.84324 4.43502 5.95808 4.71786L8.79382 11.7022C8.79836 11.7127 8.80267 11.7233 8.80674 11.734L10.2212 15.2179C10.3771 15.6016 10.1923 16.0391 9.80847 16.1949C9.42469 16.3507 8.98725 16.1659 8.83142 15.7821L7.60033 12.75H2.92602L1.69492 15.7821C1.5391 16.1659 1.10166 16.3507 0.717872 16.1949C0.334086 16.0391 0.149285 15.6016 0.305108 15.2179L4.56827 4.71786C4.6831 4.43502 4.95791 4.25 5.26317 4.25ZM3.53504 11.25H6.99131L5.26317 6.99367L3.53504 11.25ZM11.6184 5C11.6184 4.58579 11.9542 4.25 12.3684 4.25H15.6842C17.8725 4.25 19.75 5.90191 19.75 8.0625C19.75 9.84182 18.4766 11.2762 16.805 11.727L19.5739 15.0171C19.8406 15.334 19.7999 15.8071 19.4829 16.0738C19.166 16.3405 18.6929 16.2998 18.4262 15.9829L14.9691 11.875H13.1184V15.5C13.1184 15.9142 12.7826 16.25 12.3684 16.25C11.9542 16.25 11.6184 15.9142 11.6184 15.5V5ZM13.1184 10.375H15.3128C15.3161 10.375 15.3195 10.375 15.3228 10.375H15.6842C17.1585 10.375 18.25 9.28466 18.25 8.0625C18.25 6.84034 17.1585 5.75 15.6842 5.75H13.1184V10.375Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconArLanguageOutline.displayName = "IconArLanguageOutline";

export default IconArLanguageOutline;