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

function IconDownComponent(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-down${loadingKls} ${className}`} width={width} height={height} viewBox="0 0 12 12" fill={useCurrentColor ? 'currentColor' : '#000'} xmlns="http://www.w3.org/2000/svg" {...rest} ref={ref}><path fillRule="evenodd" clipRule="evenodd" d="M3.87654 4.05542C3.68128 3.86016 3.3647 3.86016 3.16943 4.05542L2.81588 4.40897C2.62062 4.60424 2.62062 4.92082 2.81588 5.11608L5.64431 7.94451C5.74246 8.04266 5.87127 8.09148 5.99992 8.09095C6.12856 8.09148 6.25737 8.04266 6.35552 7.94451L9.18395 5.11608C9.37921 4.92082 9.37921 4.60424 9.18395 4.40897L8.8304 4.05542C8.63514 3.86016 8.31855 3.86016 8.12329 4.05542L5.99992 6.1788L3.87654 4.05542Z"/></svg>;
}

const IconDown = React.forwardRef(IconDownComponent);
export default IconDown;
