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

export const IconPaperClipOutline = 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-paper-clip-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M12.3925 4.04435C13.6246 2.8122 15.6223 2.8122 16.8544 4.04435C18.0866 5.27649 18.0866 7.27418 16.8544 8.50632L9.76512 15.5956C8.0528 17.308 5.27658 17.308 3.56427 15.5956C1.85195 13.8833 1.85195 11.1071 3.56427 9.39478L9.26581 3.69326L10.1497 4.57715L4.44816 10.2787C3.22399 11.5028 3.22399 13.4876 4.44815 14.7118C5.67231 15.9359 7.65707 15.9359 8.88123 14.7118L15.9705 7.62244C16.7145 6.87845 16.7145 5.67221 15.9706 4.92823C15.2266 4.18424 14.0203 4.18424 13.2763 4.92823L6.32356 11.881C6.09516 12.1094 6.09516 12.4797 6.32356 12.7081C6.54917 12.9337 6.91396 12.9369 7.14344 12.7153L13.0097 7.04929L13.8781 7.94838L8.01185 13.6143C7.29189 14.3097 6.14745 14.2998 5.43968 13.592C4.72312 12.8755 4.72312 11.7137 5.43968 10.9971L12.3925 4.04435Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconPaperClipOutline.displayName = "IconPaperClipOutline";

export default IconPaperClipOutline;
