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

export const IconCounterSolid = 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-counter-solid`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M2.91675 9.37501C2.91675 5.69311 5.90151 2.70834 9.58341 2.70834C13.2653 2.70834 16.2501 5.69311 16.2501 9.37501C16.2501 13.0569 13.2653 16.0417 9.58341 16.0417C5.90151 16.0417 2.91675 13.0569 2.91675 9.37501ZM9.20321 13.0035H10.7981L10.7982 5.74653H9.55892L7.77342 6.70227L8.18219 8.03882L9.20321 7.47602V13.0035Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
        <path
          d="M17.5 9.37501C17.5 13.7473 13.9556 17.2917 9.58337 17.2917C9.22404 17.2917 8.87031 17.2677 8.52368 17.2214C9.53377 17.9225 10.7605 18.3333 12.0832 18.3333C15.535 18.3333 18.3332 15.5351 18.3332 12.0833C18.3332 10.9388 18.0256 9.86617 17.4885 8.94354C17.4961 9.08639 17.5 9.23025 17.5 9.37501Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconCounterSolid.displayName = "IconCounterSolid";

export default IconCounterSolid;