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

function IconRemarksComponent(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 || 'hiagent';
    const loadingKls = spin ? ` ${prefix}-icon-loading` : '';
    return <svg className={`${prefix}-icon ${prefix}-icon-remarks${loadingKls} ${className}`} width={width} height={height} xmlns="http://www.w3.org/2000/svg" fill={useCurrentColor ? 'currentColor' : '#000'} viewBox="0 0 18 18" {...rest} ref={ref}><path d="M13.347 14.237a4.627 4.627 0 1 1 3.036-6.171V7.96A6.71 6.71 0 0 0 3.345 5.726l-1.983 4.546a.836.836 0 0 0 .766 1.17h.984v2.393c0 .461.374.835.836.835H5.89v2.08h7.457v-2.513Z"/><path fillRule="evenodd" d="M7.46 9.784a4.627 4.627 0 1 1 9.253 0 4.627 4.627 0 0 1-9.254 0Zm1.387-1.101c0-.107.087-.193.193-.193h.771c.107 0 .193.086.193.193v2.474a.193.193 0 0 1-.193.193h-.77a.193.193 0 0 1-.194-.193V8.683Zm1.967-.664a.193.193 0 0 0-.193.193v3.415c0 .107.086.193.193.193h.77a.193.193 0 0 0 .194-.193V8.212a.193.193 0 0 0-.193-.193h-.771Zm1.58-.612c0-.106.087-.193.193-.193h.771c.107 0 .193.087.193.193v4.754a.193.193 0 0 1-.193.193h-.77a.193.193 0 0 1-.194-.193V7.407ZM14.36 8.74a.193.193 0 0 0-.192.193v2.474c0 .106.086.193.193.193h.77a.193.193 0 0 0 .193-.193V8.933a.193.193 0 0 0-.192-.193h-.771Z" clipRule="evenodd" opacity=".5"/></svg>;
}

const IconRemarks = React.forwardRef(IconRemarksComponent);
export default IconRemarks;
