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

function IconMarkdownSmallColorComponent(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 || 'font';
    const loadingKls = spin ? ` ${prefix}-icon-loading` : '';
    return <svg className={`${prefix}-icon ${prefix}-icon-markdown_small_color${loadingKls} ${className}`} width={width} height={height} viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...rest} ref={ref}><rect width="20" height="20" rx="5" fill={useCurrentColor ? 'currentColor' : '#8CA9E0'} fillOpacity=".2"/><path d="M2.246 6.51442V13.4856C2.246 13.5988 2.3378 13.6906 2.45104 13.6906H4.20165C4.31489 13.6906 4.40669 13.5988 4.40669 13.4856V10.0449C4.40669 9.85136 4.6501 9.76557 4.77144 9.9163L6.40765 11.9489C6.48973 12.0509 6.64502 12.0509 6.72709 11.9489L8.3633 9.9163C8.48464 9.76557 8.72806 9.85136 8.72806 10.0449V13.4856C8.72806 13.5988 8.81985 13.6906 8.93309 13.6906H10.6837C10.7969 13.6906 10.8887 13.5988 10.8887 13.4856V6.51442C10.8887 6.40118 10.7969 6.30939 10.6837 6.30939H8.82622C8.76415 6.30939 8.70542 6.3375 8.6665 6.38585L6.72709 8.79516C6.64502 8.89712 6.48973 8.89712 6.40765 8.79516L4.46824 6.38585C4.42932 6.3375 4.37059 6.30939 4.30852 6.30939H2.45104C2.3378 6.30939 2.246 6.40118 2.246 6.51442zM12.8895 10.4774L15.6648 13.5228C15.7467 13.6126 15.8882 13.6119 15.9692 13.5214L18.7532 10.4089C18.8713 10.2768 18.7776 10.0672 18.6004 10.0672H17.1032C16.99 10.0672 16.8982 9.97536 16.8982 9.86213V6.51442C16.8982 6.40118 16.8064 6.30939 16.6931 6.30939H14.9425C14.8293 6.30939 14.7375 6.40118 14.7375 6.51442V9.92919C14.7375 10.0424 14.6457 10.1342 14.5324 10.1342H13.041C12.8629 10.1342 12.7695 10.3457 12.8895 10.4774z" fill={useCurrentColor ? 'currentColor' : '#8CA9E0'}/></svg>;
}

const IconMarkdownSmallColor = React.forwardRef(IconMarkdownSmallColorComponent);
export default IconMarkdownSmallColor;
