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

function IconCheckboxComponent(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 || 'hkgai';
    const loadingKls = spin ? ` ${prefix}-icon-loading` : '';
    return <svg className={`${prefix}-icon ${prefix}-icon-Checkbox${loadingKls} ${className}`} width={width} height={height} viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg" {...rest} ref={ref}><path d="M1 8.06663C1 5.82642 1 4.70631 1.43597 3.85066C1.81947 3.09802 2.43139 2.48609 3.18404 2.1026C4.03968 1.66663 5.15979 1.66663 7.4 1.66663H8.6C10.8402 1.66663 11.9603 1.66663 12.816 2.1026C13.5686 2.48609 14.1805 3.09802 14.564 3.85066C15 4.70631 15 5.82642 15 8.06663V9.26663C15 11.5068 15 12.6269 14.564 13.4826C14.1805 14.2352 13.5686 14.8472 12.816 15.2307C11.9603 15.6666 10.8402 15.6666 8.6 15.6666H7.4C5.15979 15.6666 4.03968 15.6666 3.18404 15.2307C2.43139 14.8472 1.81947 14.2352 1.43597 13.4826C1 12.6269 1 11.5068 1 9.26663V8.06663Z" fill={useCurrentColor ? 'currentColor' : '#1C1C1C'}/><path fillRule="evenodd" clipRule="evenodd" d="M11.0087 6.86553C11.3131 7.14648 11.3321 7.62097 11.0511 7.92534L8.23977 10.9709C7.83662 11.4077 7.14379 11.3985 6.75239 10.9512L5.18556 9.16051C4.9128 8.84878 4.94439 8.37496 5.25612 8.1022C5.56784 7.82944 6.04167 7.86102 6.31443 8.17275L7.51491 9.54473L9.94889 6.90792C10.2298 6.60355 10.7043 6.58457 11.0087 6.86553Z" fill={useCurrentColor ? 'currentColor' : '#fff'}/></svg>;
}

const IconCheckbox = React.forwardRef(IconCheckboxComponent);
export default IconCheckbox;
