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

function IconTabelNodataComponent(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 || 'hiagent';
    const loadingKls = spin ? ` ${prefix}-icon-loading` : '';
    return <svg className={`${prefix}-icon ${prefix}-icon-tabel-nodata${loadingKls} ${className}`} width={width} height={height} xmlns="http://www.w3.org/2000/svg" fill={useCurrentColor ? 'currentColor' : 'none'} viewBox="0 0 24 24" {...rest} ref={ref}><path fill={useCurrentColor ? 'currentColor' : '#DDE2E9'} d="M21.568 4.5H2.42a.32.32 0 0 0-.319.32v2.393a.32.32 0 0 0 .32.319h19.148a.32.32 0 0 0 .32-.32V4.82a.32.32 0 0 0-.32-.319Zm0 11.49h-5.745a.32.32 0 0 0-.319.318v2.873a.32.32 0 0 0 .32.319h5.744a.32.32 0 0 0 .32-.32v-2.872a.32.32 0 0 0-.32-.319Z"/><path fill={useCurrentColor ? 'currentColor' : '#E4E8ED'} d="M8.004 15.99H2.42a.32.32 0 0 0-.319.318v2.873a.32.32 0 0 0 .32.319h5.584a.32.32 0 0 0 .32-.32v-2.872a.32.32 0 0 0-.32-.319Z"/><path fill={useCurrentColor ? 'currentColor' : '#EEF1F4'} d="M14.706 15.99H9.121a.32.32 0 0 0-.319.318v2.873a.32.32 0 0 0 .32.319h5.584a.32.32 0 0 0 .32-.32v-2.872a.32.32 0 0 0-.32-.319Zm6.862-7.98h-5.745a.32.32 0 0 0-.319.32v2.872c0 .176.143.32.32.32h5.744a.32.32 0 0 0 .32-.32V8.33a.32.32 0 0 0-.32-.32Zm-13.564 0H2.42a.32.32 0 0 0-.319.32v2.872c0 .176.143.32.32.32h5.584a.32.32 0 0 0 .32-.32V8.33a.32.32 0 0 0-.32-.32Z"/><path fill={useCurrentColor ? 'currentColor' : '#E7EBF0'} d="M14.706 8.01H9.121a.32.32 0 0 0-.319.32v2.872c0 .176.143.32.32.32h5.584a.32.32 0 0 0 .32-.32V8.33a.32.32 0 0 0-.32-.32Z"/><path fill={useCurrentColor ? 'currentColor' : '#EEF1F4'} d="M21.568 12h-5.745a.32.32 0 0 0-.319.32v2.871c0 .177.143.32.32.32h5.744a.32.32 0 0 0 .32-.32V12.32a.32.32 0 0 0-.32-.319Z"/><path fill={useCurrentColor ? 'currentColor' : '#DDE2E9'} d="M8.004 12H2.42a.32.32 0 0 0-.319.32v2.871c0 .177.143.32.32.32h5.584a.32.32 0 0 0 .32-.32V12.32a.32.32 0 0 0-.32-.319Z"/><path fill={useCurrentColor ? 'currentColor' : '#E4E8ED'} d="M14.706 12H9.121a.32.32 0 0 0-.319.32v2.871c0 .177.143.32.32.32h5.584a.32.32 0 0 0 .32-.32V12.32a.32.32 0 0 0-.32-.319Z"/></svg>;
}

const IconTabelNodata = React.forwardRef(IconTabelNodataComponent);
export default IconTabelNodata;
