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

function IconThumbsDownHatedComponent(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-ThumbsDown-hated${loadingKls} ${className}`} width={width} height={height} viewBox="0 0 20 20" fill={useCurrentColor ? 'currentColor' : '#000'} xmlns="http://www.w3.org/2000/svg" {...rest} ref={ref}><path d="M18.7359 12.2656L17.7984 4.76563C17.7413 4.31241 17.5208 3.89562 17.1781 3.59354C16.8354 3.29145 16.3943 3.12484 15.9375 3.125H2.5C2.16848 3.125 1.85054 3.2567 1.61612 3.49112C1.3817 3.72554 1.25 4.04348 1.25 4.375V11.25C1.25 11.5815 1.3817 11.8995 1.61612 12.1339C1.85054 12.3683 2.16848 12.5 2.5 12.5H5.86406L8.81563 18.4047C8.86759 18.5085 8.94744 18.5958 9.04625 18.6568C9.14505 18.7178 9.25889 18.7501 9.375 18.75C10.2038 18.75 10.9987 18.4208 11.5847 17.8347C12.1708 17.2487 12.5 16.4538 12.5 15.625V14.375H16.875C17.1411 14.3751 17.4041 14.3186 17.6467 14.2091C17.8892 14.0997 18.1057 13.94 18.2817 13.7404C18.4577 13.5409 18.5892 13.3062 18.6676 13.0519C18.7459 12.7976 18.7692 12.5296 18.7359 12.2656ZM5.625 11.25H2.5V4.375H5.625V11.25Z"/></svg>;
}

const IconThumbsDownHated = React.forwardRef(IconThumbsDownHatedComponent);
export default IconThumbsDownHated;
