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

export const IconVariableFunction = 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-variable-function`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M10.5549 1.90002C9.46486 1.90002 8.51136 2.63386 8.23227 3.68761L7.11659 7.90002H5.7077C5.29349 7.90002 4.9577 8.23581 4.9577 8.65002 4.9577 9.06424 5.29349 9.40002 5.7077 9.40002H6.71931L5.17464 15.2322C5.07037 15.6259 4.71415 15.9 4.3069 15.9 3.94431 15.9 3.61732 15.6819 3.47807 15.3471L3.34268 15.0216C3.18361 14.6391 2.74461 14.4581 2.36216 14.6171 1.97971 14.7762 1.79863 15.2152 1.9577 15.5976L2.0931 15.9232C2.46503 16.8174 3.33841 17.4 4.3069 17.4 5.39467 17.4 6.34614 16.6678 6.62464 15.6162L8.27103 9.40002H9.7077C10.1219 9.40002 10.4577 9.06424 10.4577 8.65002 10.4577 8.23581 10.1219 7.90002 9.7077 7.90002H8.66831L9.68227 4.07165C9.78713 3.67574 10.1454 3.40002 10.5549 3.40002H10.7928C11.16 3.40002 11.4577 3.69771 11.4577 4.06492 11.4577 4.47913 11.7935 4.81492 12.2077 4.81492 12.6219 4.81492 12.9577 4.47913 12.9577 4.06492 12.9577 2.86928 11.9884 1.90002 10.7928 1.90002H10.5549ZM10.6955 10.6379C10.9884 10.345 11.4633 10.345 11.7562 10.6379L13.9668 12.8485 16.1774 10.6379C16.4703 10.345 16.9451 10.345 17.238 10.6379 17.5309 10.9308 17.5309 11.4057 17.238 11.6985L15.0274 13.9091 17.238 16.1197C17.5309 16.4126 17.5309 16.8875 17.238 17.1804 16.9451 17.4733 16.4703 17.4733 16.1774 17.1804L13.9668 14.9698 11.7562 17.1804C11.4633 17.4733 10.9884 17.4733 10.6955 17.1804 10.4027 16.8875 10.4027 16.4126 10.6955 16.1197L12.9061 13.9091 10.6955 11.6985C10.4027 11.4057 10.4027 10.9308 10.6955 10.6379Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconVariableFunction.displayName = "IconVariableFunction";

export default IconVariableFunction;