import React, { ForwardedRef, useContext } from 'react';
import { OriginIconProps } from '../type';
import { Context } from '../context';

function IconImageToImageComponent(props: OriginIconProps, ref: ForwardedRef<SVGSVGElement>) {
    const { prefix: prefixFromContext } = useContext(Context);
    const { className = '', prefix: prefixFromProps, width = '1em', height = '1em', useCurrentColor = true, spin, ...rest } = props;

    const prefix = prefixFromProps || prefixFromContext || 'hkgai';
    const loadingKls = spin ? ` ${prefix}-icon-loading` : '';
    return <svg className={`${prefix}-icon ${prefix}-icon-ImageToImage${loadingKls} ${className}`} width={width} height={height} viewBox="0 0 24 24" fill={useCurrentColor ? 'currentColor' : '#000'} xmlns="http://www.w3.org/2000/svg" {...rest} ref={ref}><path fillRule="evenodd" clipRule="evenodd" d="M14.6737 4.80361C12.948 4.3988 11.1519 4.3988 9.42616 4.80361C7.18212 5.32999 5.42994 7.08216 4.90356 9.32621C4.49875 11.052 4.49875 12.848 4.90356 14.5738C4.98419 14.9175 5.09359 15.2497 5.22911 15.5678L6.27087 14.526C8.12998 12.6669 11.1442 12.6669 13.0033 14.526L13.9802 15.5029L13.9973 15.4858C15.3813 14.1019 17.5454 14.022 19.0206 15.1797C19.0892 14.9823 19.148 14.7801 19.1963 14.5738C19.6012 12.848 19.6012 11.052 19.1963 9.32621C18.67 7.08216 16.9178 5.32999 14.6737 4.80361ZM20.1481 17.0427C20.5053 16.4071 20.7772 15.7161 20.9488 14.9849C21.417 12.9887 21.417 10.9113 20.9488 8.91515C20.2663 6.00553 17.9944 3.73368 15.0848 3.05117C13.0887 2.58294 11.0112 2.58294 9.0151 3.05117C6.10548 3.73368 3.83363 6.00553 3.15113 8.91514C2.68289 10.9113 2.68289 12.9887 3.15113 14.9849C3.83363 17.8945 6.10548 20.1663 9.0151 20.8488C11.0112 21.3171 13.0887 21.3171 15.0848 20.8488C17.1212 20.3712 18.8451 19.115 19.9305 17.4066C20.0338 17.3017 20.1067 17.1764 20.1481 17.0427ZM18.1504 16.8194C17.3879 15.988 16.0769 15.9518 15.2701 16.7586L15.253 16.7757L16.6906 18.2132C17.2518 17.833 17.7453 17.3615 18.1504 16.8194ZM14.955 19.0233L11.7305 15.7988C10.5744 14.6426 8.69983 14.6426 7.54366 15.7988L6.20458 17.1379C7.02812 18.0983 8.14726 18.7964 9.42617 19.0964C11.1519 19.5012 12.948 19.5012 14.6737 19.0964C14.7684 19.0742 14.8622 19.0498 14.955 19.0233Z"/><path d="M14.3013 7.35288C14.4154 6.88237 15.0846 6.88237 15.1987 7.35288L15.5126 8.64752C15.5533 8.8155 15.6845 8.94666 15.8525 8.98739L17.1471 9.30132C17.6176 9.41542 17.6176 10.0846 17.1471 10.1987L15.8525 10.5126C15.6845 10.5533 15.5533 10.6845 15.5126 10.8525L15.1987 12.1471C15.0846 12.6176 14.4154 12.6176 14.3013 12.1471L13.9874 10.8525C13.9467 10.6845 13.8155 10.5533 13.6475 10.5126L12.3529 10.1987C12.3235 10.1915 12.2959 10.1822 12.2702 10.1711 11.8842 10.0031 11.9118 9.40828 12.3529 9.30132L13.6475 8.98739C13.8155 8.94666 13.9467 8.8155 13.9874 8.64752L14.3013 7.35288zM22 21C22 21.5523 21.5523 22 21 22 20.4477 22 20 21.5523 20 21 20 20.4477 20.4477 20 21 20 21.5523 20 22 20.4477 22 21zM22 3C22 3.55228 21.5523 4 21 4 20.4477 4 20 3.55228 20 3 20 2.44772 20.4477 2 21 2 21.5523 2 22 2.44772 22 3zM4 21C4 21.5523 3.55228 22 3 22 2.44772 22 2 21.5523 2 21 2 20.4477 2.44772 20 3 20 3.55228 20 4 20.4477 4 21zM4 3C4 3.55228 3.55228 4 3 4 2.44772 4 2 3.55228 2 3 2 2.44772 2.44772 2 3 2 3.55228 2 4 2.44772 4 3z"/></svg>;
}

const IconImageToImage = React.forwardRef(IconImageToImageComponent);
export default IconImageToImage;
