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

export const IconRotate2Right = 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-rotate-2-right`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M4.82451 5.57481C4.54996 5.26466 4.57883 4.79066 4.88898 4.51611L5.83229 3.6811C5.09687 3.6471 4.49145 3.68963 3.97828 3.928C3.42927 4.18303 2.86485 4.72417 2.43522 6.00936C2.30389 6.4022 1.87897 6.6142 1.48613 6.48288C1.09328 6.35155 0.88128 5.92663 1.01261 5.53378C1.53411 3.97378 2.32508 3.04201 3.34635 2.56761C4.15714 2.19099 5.0308 2.14619 5.82499 2.17891L5.0824 1.34002C4.80786 1.02986 4.83672 0.555865 5.14688 0.281318C5.45703 0.00677009 5.93103 0.0356362 6.20558 0.345792L8.19403 2.59214C8.46857 2.90229 8.43971 3.37629 8.12955 3.65084L5.88321 5.63929C5.57305 5.91383 5.09905 5.88497 4.82451 5.57481Z"
          fill={color}
        />
        <path
          d="M4.99999 8.00005C4.99999 6.89548 5.89543 6.00005 6.99999 6.00005H15C16.1046 6.00005 17 6.89548 17 8.00005V16C17 17.1046 16.1046 18 15 18H7C5.89543 18 4.99999 17.1046 4.99999 16V8.00005ZM6.99999 7.50005H15C15.2761 7.50005 15.5 7.7239 15.5 8.00005V16C15.5 16.2762 15.2761 16.5 15 16.5H7C6.72385 16.5 6.49999 16.2762 6.49999 16V8.00005C6.49999 7.7239 6.72385 7.50005 6.99999 7.50005Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconRotate2Right.displayName = "IconRotate2Right";

export default IconRotate2Right;