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

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

    const prefix = prefixFromProps || prefixFromContext || 'hiagent';
    const loadingKls = spin ? ` ${prefix}-icon-loading` : '';
    return <svg className={`${prefix}-icon ${prefix}-icon-Jinja${loadingKls} ${className}`} width={width} height={height} viewBox="0 0 18 18" fill={useCurrentColor ? 'currentColor' : 'none'} xmlns="http://www.w3.org/2000/svg" {...rest} ref={ref}><path fillRule="evenodd" clipRule="evenodd" d="M4.5 1.125C3.90326 1.125 3.33097 1.36205 2.90901 1.78401C2.48705 2.20597 2.25 2.77826 2.25 3.375V14.625C2.25 15.2217 2.48705 15.794 2.90901 16.216C3.33097 16.6379 3.90326 16.875 4.5 16.875H13.5C14.0967 16.875 14.669 16.6379 15.091 16.216C15.5129 15.794 15.75 15.2217 15.75 14.625V6.75L10.125 1.125H4.5Z" fill={useCurrentColor ? 'currentColor' : '#B54A58'}/><path d="M4.16118 7.80241H4.19738C5.97186 8.3352 8.29556 8.3352 8.94136 8.32551L9.5389 8.31584C11.3013 8.2577 12.2006 7.64741 13.7759 7.01291C13.8845 6.96931 14.0113 7.04196 13.9992 7.14368C13.9871 7.49243 13.8845 8.95518 12.6714 9.33783C12.6291 9.35236 12.5808 9.36688 12.5386 9.37657C12.4782 9.38626 12.4541 9.42986 12.442 9.45891L12.3394 9.74468C12.3213 9.8125 12.267 9.87062 12.2066 9.87062H12.104C12.0135 9.87062 11.9411 9.92874 11.935 10.0014V10.2775C11.935 10.3065 11.9652 10.3308 12.0014 10.3308H12.78C12.8524 10.3308 12.9128 10.3792 12.9128 10.4373V10.8684C12.9128 10.9265 12.8524 10.975 12.78 10.975H12.0014C11.9652 10.975 11.935 10.9992 11.935 11.0283V11.1445C11.935 11.1735 11.9652 11.1978 12.0014 11.1978H12.78C12.8524 11.2026 12.9068 11.2462 12.9068 11.3043V11.7354C12.9068 11.7839 12.8585 11.8371 12.8042 11.8371H11.9954C11.9592 11.8371 11.929 11.8613 11.929 11.8904V14.7239C11.929 14.8692 11.7781 14.9903 11.597 14.9903H11.0478C10.8667 14.9903 10.7158 14.8692 10.7158 14.7239V11.8904C10.7158 11.8613 10.6857 11.8371 10.6494 11.8371L7.25744 11.8323C7.22122 11.8323 7.19104 11.8565 7.19104 11.8856V14.7336C7.19104 14.8789 7.04016 15 6.85908 15H6.30984C6.12878 15 5.97788 14.8789 5.97788 14.7336V11.8807C5.97788 11.8516 5.94772 11.8274 5.9115 11.8274C5.9115 11.8274 5.06652 11.8226 5.05444 11.8177C5.01822 11.7984 4.99408 11.7645 4.99408 11.7257V11.2995C4.99408 11.2414 5.05444 11.1929 5.1329 11.1929H5.97186V11.1881H5.97788V11.0283C5.97788 10.9992 5.94772 10.975 5.9115 10.975H5.1329C5.06048 10.975 5.00012 10.9265 5.00012 10.8684V10.4373C5.00012 10.3792 5.06048 10.3308 5.1329 10.3308H5.9115C5.94772 10.3308 5.97788 10.3065 5.97788 10.2775V10.0014C5.97788 9.93359 5.90546 9.87062 5.8089 9.87062H5.70628C5.63386 9.87062 5.59162 9.80766 5.5735 9.74468L5.4709 9.45891C5.45882 9.42017 5.41658 9.38626 5.3683 9.37174C4.5897 9.21673 4.26982 8.7566 4.00424 8.0349V8.03007C3.97408 7.84601 4.11288 7.8121 4.16118 7.80241ZM7.17898 9.86095V10.2823C7.17898 10.3404 7.22122 10.384 7.27554 10.384H8.36196C8.41628 10.384 8.45852 10.3404 8.45852 10.2823V9.86095C8.45852 9.80766 8.41628 9.75923 8.36196 9.75923H7.27554C7.22726 9.76406 7.17898 9.80766 7.17898 9.86095ZM9.41818 9.86095V10.2823C9.41818 10.3356 9.46042 10.384 9.51474 10.384H10.6012C10.6555 10.384 10.6977 10.3404 10.6977 10.2823V9.86095C10.6977 9.80766 10.6555 9.75923 10.6012 9.75923H9.51474C9.46646 9.76406 9.41818 9.80766 9.41818 9.86095Z" fill={useCurrentColor ? 'currentColor' : '#fff'}/><path d="M10.125 1.125L15.75 6.75H12.375C11.7783 6.75 11.206 6.51295 10.784 6.09099C10.3621 5.66903 10.125 5.09674 10.125 4.5V1.125Z" fill={useCurrentColor ? 'currentColor' : '#E37D8A'}/></svg>;
}

const IconJinja = React.forwardRef(IconJinjaComponent);
export default IconJinja;
