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

export const IconRotateRightRectangleOutline = 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-right-rectangle-outline`,
  };
  return (
    <svg
      viewBox="0 0 20 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
      ref={forwardedRef}
    >
      <path
        d="M4.82449 5.57481C4.54994 5.26466 4.57881 4.79066 4.88897 4.51611L5.83227 3.6811C5.09685 3.6471 4.49143 3.68963 3.97827 3.928C3.42925 4.18303 2.86484 4.72417 2.4352 6.00936C2.30388 6.4022 1.87895 6.6142 1.48611 6.48288C1.09327 6.35155 0.881265 5.92663 1.01259 5.53378C1.53409 3.97378 2.32507 3.04201 3.34634 2.56761C4.15712 2.19099 5.03078 2.14619 5.82497 2.17891L5.08239 1.34002C4.80784 1.02986 4.83671 0.555865 5.14686 0.281318C5.45702 0.00677009 5.93101 0.0356362 6.20556 0.345792L8.19401 2.59214C8.46856 2.90229 8.43969 3.37629 8.12954 3.65084L5.88319 5.63929C5.57304 5.91383 5.09904 5.88497 4.82449 5.57481Z"
        fill={color}
      />
      <path
        d="M4.99998 8.00005C4.99998 6.89548 5.89541 6.00005 6.99998 6.00005H15C16.1045 6.00005 17 6.89548 17 8.00005V16C17 17.1046 16.1045 18 15 18H6.99998C5.89541 18 4.99998 17.1046 4.99998 16V8.00005ZM6.99998 7.50005H15C15.2761 7.50005 15.5 7.7239 15.5 8.00005V16C15.5 16.2762 15.2761 16.5 15 16.5H6.99998C6.72384 16.5 6.49998 16.2762 6.49998 16V8.00005C6.49998 7.7239 6.72384 7.50005 6.99998 7.50005Z"
        fill={color}
        fillRule="evenodd"
        clipRule="evenodd"
      />
    </svg>
  );
});

IconRotateRightRectangleOutline.displayName = "IconRotateRightRectangleOutline";

export default IconRotateRightRectangleOutline;