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

function IconTimeoutComponent(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-timeout${loadingKls} ${className}`} width={width} height={height} xmlns="http://www.w3.org/2000/svg" fill={useCurrentColor ? 'currentColor' : '#000'} viewBox="0 0 20 20" {...rest} ref={ref}><path d="M10 1.766a8.227 8.227 0 0 1 8.026 6.41c.099.433-.248.824-.693.824-.366 0-.673-.27-.762-.626A6.774 6.774 0 0 0 10 3.232a6.77 6.77 0 0 0-6.769 6.769 6.77 6.77 0 0 0 7.83 6.685c.473-.076.939.265.939.745a.674.674 0 0 1-.543.672 8.222 8.222 0 0 1-4.608-.497A8.237 8.237 0 0 1 1.766 10 8.235 8.235 0 0 1 10 1.766Zm5.787 14.287c.15 0 .292.056.398.155.105.1.165.234.165.374v.589c0 .14-.06.275-.165.374a.581.581 0 0 1-.398.155h-.625a.583.583 0 0 1-.398-.155.514.514 0 0 1-.164-.374v-.589a.51.51 0 0 1 .164-.374.578.578 0 0 1 .398-.155h.625ZM15.963 11c.129 0 .252.048.343.134a.446.446 0 0 1 .143.323c0 .836-.044 2.546-.175 3.392-.034.221-.202.44-.485.44h-.632c-.282 0-.45-.22-.484-.44-.13-.846-.173-2.556-.173-3.392a.44.44 0 0 1 .143-.323.502.502 0 0 1 .343-.134h.977ZM9.917 5.1c.405 0 .733.328.733.732v3.822a1.568 1.568 0 0 1-.459 1.108L7.52 13.435a.734.734 0 0 1-1.039-1.037l2.704-2.702V5.832c0-.404.328-.732.732-.732Z"/></svg>;
}

const IconTimeout = React.forwardRef(IconTimeoutComponent);
export default IconTimeout;
