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

function IconWpsComponent(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 || 'hkgai';
    const loadingKls = spin ? ` ${prefix}-icon-loading` : '';
    return <svg className={`${prefix}-icon ${prefix}-icon-wps${loadingKls} ${className}`} width={width} height={height} viewBox="0 0 16 20" fill="none" {...rest} ref={ref}><mask id="svg_80db15125f__a" style={{maskType: 'alpha'}} maskUnits="userSpaceOnUse" x="0" y="0" width="16" height="20"><path d="M1.103 0h10.24c.146 0 .285.056.389.157l4.105 3.985c.104.101.163.24.163.384v14.393c0 .597-.494 1.081-1.103 1.081H1.103C.494 20 0 19.516 0 18.919V1.08C0 .484.494 0 1.103 0z" fill={useCurrentColor ? 'currentColor' : '#fff'}/></mask><g mask="url(#svg_80db15125f__a)"><path d="M1.103 0h10.24c.146 0 .285.056.389.157l4.105 3.985c.104.101.163.24.163.384v14.393c0 .597-.494 1.081-1.103 1.081H1.103C.494 20 0 19.516 0 18.919V1.08C0 .484.494 0 1.103 0z" fill={useCurrentColor ? 'currentColor' : '#1664FF'}/><path fillRule="evenodd" clipRule="evenodd" d="M11.57 0h4.414v4.324h-3.31c-.61 0-1.104-.484-1.104-1.08V0z" fill={useCurrentColor ? 'currentColor' : '#94BFFF'}/></g><path d="M8.005 10.158L6.53 15.615a.152.152 0 01-.146.112h-.869a.152.152 0 01-.146-.11l-2-7.06a.152.152 0 01.147-.194h.87c.07 0 .13.047.148.114l1.422 5.503 1.478-5.504a.152.152 0 01.147-.113h.848c.07 0 .13.047.147.113l1.468 5.503 1.423-5.502a.152.152 0 01.147-.114h.87a.152.152 0 01.147.193l-2 7.06a.152.152 0 01-.146.11h-.868a.152.152 0 01-.147-.112l-1.465-5.456z" fill={useCurrentColor ? 'currentColor' : '#fff'}/></svg>;
}

const IconWps = React.forwardRef(IconWpsComponent);
export default IconWps;
