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

function IconTextComponent(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-text${loadingKls} ${className}`} width={width} height={height} xmlns="http://www.w3.org/2000/svg" fill={useCurrentColor ? 'currentColor' : '#000'} viewBox="0 0 24 24" {...rest} ref={ref}><path fillRule="evenodd" d="M19.63 10.5c1.205 0 2.1.339 2.678 1.02.503.598.756 1.458.756 2.568v5.318a.5.5 0 0 1-.5.499h-.72a.5.5 0 0 1-.499-.5v-.565c-.29.357-.63.646-1.02.864a4.035 4.035 0 0 1-1.903.444c-.801 0-1.446-.218-1.923-.645l-.093-.09c-.531-.485-.795-1.12-.795-1.902 0-1.041.373-1.854 1.11-2.407.66-.525 1.597-.798 2.815-.834l1.7-.048v-.255c0-1.183-.558-1.756-1.713-1.756-.497 0-.897.1-1.19.296-.251.16-.444.398-.55.677l-.021.061a.5.5 0 0 1-.525.351l-.839-.081a.5.5 0 0 1-.45-.545l.006-.04.015-.067.008-.024c.225-.754.633-1.334 1.215-1.716.594-.42 1.41-.623 2.439-.623ZM8.9 4.5a.465.465 0 0 1 .435.297l5.634 14.571a.467.467 0 0 1-.434.632h-1.122a.465.465 0 0 1-.435-.297l-1.88-4.868H4.921l-1.9 4.87a.465.465 0 0 1-.434.296H1.463a.466.466 0 0 1-.432-.633L6.72 4.796a.465.465 0 0 1 .431-.296H8.9Zm12.337 11.68v-.405l-1.588.05c-1.448.033-2.15.576-2.15 1.617a.94.94 0 0 0 .351.76c.231.21.552.321.945.321.64.01 1.258-.236 1.718-.682a2.2 2.2 0 0 0 .723-1.66h.001ZM8.022 6.89l-2.367 6.064h4.715L8.022 6.889Z" clipRule="evenodd"/></svg>;
}

const IconText = React.forwardRef(IconTextComponent);
export default IconText;
