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

function IconInvisibleComponent(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-invisible${loadingKls} ${className}`} width={width} height={height} viewBox="0 0 48 48" fill={useCurrentColor ? 'currentColor' : '#000'} xmlns="http://www.w3.org/2000/svg" {...rest} ref={ref}><path d="M24 30c-1.314 0-2.6-.104-3.848-.302l-.996 3.717a1 1 0 01-1.225.708l-1.932-.518a1 1 0 01-.707-1.225l.975-3.64a22.221 22.221 0 01-4.553-2.14l-3.178 3.178a1 1 0 01-1.414 0l-1.415-1.414a1 1 0 010-1.414l2.8-2.8a18.109 18.109 0 01-3.563-4.577l-.14-.27-.17-.34a1 1 0 01.191-1.14l.293-.29c.056-.054.107-.102.153-.143l.718-.652c.102-.095.197-.183.288-.27l.193-.193a.898.898 0 011.41.163l.052.1C10.422 22.123 16.386 26 24 26c7.296 0 13.399-3.773 15.848-8.952.067-.14.14-.31.219-.508a.85.85 0 011.303-.36l.086.075 1.664 1.664a1 1 0 01.188 1.152l-.212.419c-.1.19-.187.352-.264.485a18.302 18.302 0 01-3.606 4.422l2.552 2.553a1 1 0 010 1.414l-1.414 1.414a1 1 0 01-1.414 0l-2.984-2.984a22.294 22.294 0 01-4.233 1.946l.976 3.64A1 1 0 0132 33.605l-1.931.518a1 1 0 01-1.225-.708l-.996-3.717A24.539 24.539 0 0124 30z"/></svg>;
}

const IconInvisible = React.forwardRef(IconInvisibleComponent);
export default IconInvisible;
