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

function IconPreviewComponent(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-preview${loadingKls} ${className}`} width={width} height={height} viewBox="0 0 16 16" fill={useCurrentColor ? 'currentColor' : '#000'} xmlns="http://www.w3.org/2000/svg" {...rest} ref={ref}><path fillRule="evenodd" clipRule="evenodd" d="M2.54545 3.88186H3.95959C4.29431 3.88186 4.56565 3.60983 4.56565 3.27427C4.56565 2.9387 4.29431 2.66667 3.95959 2.66667H2.07407C1.66497 2.66667 1.33333 2.99915 1.33333 3.40929V5.29958C1.33333 5.63515 1.60467 5.90718 1.93939 5.90718C2.27411 5.90718 2.54545 5.63515 2.54545 5.29958V3.88186ZM3.35353 5.97469C3.35353 5.26627 3.92637 4.69199 4.63299 4.69199H11.367C12.0736 4.69199 12.6465 5.26627 12.6465 5.97469V10.0253C12.6465 10.7337 12.0736 11.308 11.367 11.308H4.63299C3.92636 11.308 3.35353 10.7337 3.35353 10.0253V5.97469ZM4.63299 5.90718C4.5958 5.90718 4.56565 5.9374 4.56565 5.97469V10.0253C4.56565 10.0626 4.5958 10.0928 4.63299 10.0928H11.367C11.4042 10.0928 11.4343 10.0626 11.4343 10.0253V5.97469C11.4343 5.9374 11.4042 5.90718 11.367 5.90718H4.63299ZM12.0404 12.1181H13.4545V10.7004C13.4545 10.3649 13.7259 10.0928 14.0606 10.0928C14.3953 10.0928 14.6667 10.3649 14.6667 10.7004V12.5907C14.6667 13.0009 14.335 13.3333 13.9259 13.3333H12.0404C11.7057 13.3333 11.4343 13.0613 11.4343 12.7257C11.4343 12.3902 11.7057 12.1181 12.0404 12.1181ZM2.54545 12.1181H3.95959C4.29431 12.1181 4.56565 12.3902 4.56565 12.7257C4.56565 13.0613 4.29431 13.3333 3.95959 13.3333H2.07407C1.66497 13.3333 1.33333 13.0009 1.33333 12.5907V10.7004C1.33333 10.3649 1.60467 10.0928 1.93939 10.0928C2.27411 10.0928 2.54545 10.3649 2.54545 10.7004V12.1181ZM12.0404 3.88186H13.4545V5.29958C13.4545 5.63515 13.7259 5.90718 14.0606 5.90718C14.3953 5.90718 14.6667 5.63515 14.6667 5.29958V3.40929C14.6667 2.99915 14.335 2.66667 13.9259 2.66667H12.0404C11.7057 2.66667 11.4343 2.9387 11.4343 3.27427C11.4343 3.60983 11.7057 3.88186 12.0404 3.88186Z"/></svg>;
}

const IconPreview = React.forwardRef(IconPreviewComponent);
export default IconPreview;
