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

export const IconCog6ToothOutline = 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-shein-icon customeow-shein-icon-icon-cog-6-tooth-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M7.99464 3.2835C8.06998 2.83145 8.46109 2.50012 8.91938 2.50012H11.081C11.5393 2.50012 11.9304 2.83145 12.0058 3.2835L12.1837 4.35104C12.2356 4.66274 12.4439 4.92238 12.7204 5.07542C12.7822 5.10964 12.8433 5.14498 12.9037 5.18143C13.1746 5.34499 13.504 5.39584 13.8003 5.28484L14.8144 4.90494C15.2435 4.74416 15.726 4.91721 15.9552 5.3141L17.036 7.18613C17.2651 7.58302 17.1737 8.0874 16.8199 8.37867L15.983 9.06769C15.7392 9.26835 15.6184 9.57822 15.6242 9.8939C15.6249 9.92923 15.6252 9.96464 15.6252 10.0001C15.6252 10.0356 15.6249 10.071 15.6242 10.1063C15.6184 10.422 15.7392 10.7319 15.983 10.9325L16.8199 11.6216C17.1737 11.9128 17.2651 12.4172 17.036 12.8141L15.9552 14.6861C15.726 15.083 15.2435 15.2561 14.8144 15.0953L13.8003 14.7154C13.504 14.6044 13.1746 14.6552 12.9037 14.8188C12.8433 14.8553 12.7822 14.8906 12.7204 14.9248C12.4439 15.0779 12.2356 15.3375 12.1837 15.6492L12.0058 16.7167C11.9304 17.1688 11.5393 17.5001 11.081 17.5001H8.91938C8.46109 17.5001 8.06998 17.1688 7.99464 16.7167L7.81671 15.6492C7.76476 15.3375 7.55645 15.0779 7.27998 14.9248C7.21817 14.8906 7.15707 14.8553 7.09671 14.8188C6.82585 14.6553 6.4964 14.6044 6.2001 14.7154L5.18604 15.0953C4.75688 15.2561 4.27439 15.083 4.04525 14.6861L2.96443 12.8141C2.73529 12.4172 2.82666 11.9128 3.18048 11.6216L4.01744 10.9326C4.2612 10.7319 4.38203 10.422 4.37618 10.1063C4.37553 10.071 4.3752 10.0356 4.3752 10.0001C4.3752 9.96464 4.37553 9.92923 4.37618 9.89391C4.38203 9.57823 4.2612 9.26837 4.01744 9.0677L3.18048 8.37868C2.82666 8.08741 2.73529 7.58303 2.96443 7.18614L4.04525 5.31411C4.27439 4.91722 4.75688 4.74417 5.18604 4.90495L6.20009 5.28484C6.49639 5.39585 6.82583 5.345 7.0967 5.18144C7.15706 5.14499 7.21816 5.10964 7.27998 5.07542C7.55645 4.92238 7.76476 4.66274 7.81671 4.35104L7.99464 3.2835Z"
          stroke={color}
          strokeWidth="1.5"
          strokeLinecap="round"
          strokeLinejoin="round"
        />
        <path
          d="M12.5 10.0001C12.5 11.3808 11.3807 12.5001 10 12.5001C8.61929 12.5001 7.50001 11.3808 7.50001 10.0001C7.50001 8.61934 8.61929 7.50006 10 7.50006C11.3807 7.50006 12.5 8.61934 12.5 10.0001Z"
          stroke={color}
          strokeWidth="1.5"
          strokeLinecap="round"
          strokeLinejoin="round"
        />
      </svg>
    );
  }
);

IconCog6ToothOutline.displayName = "IconCog6ToothOutline";

export default IconCog6ToothOutline;