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

function IconPicturePlaceholderComponent(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-picture-placeholder${loadingKls} ${className}`} width={width} height={height} xmlns="http://www.w3.org/2000/svg" fill={useCurrentColor ? 'currentColor' : '#000'} viewBox="0 0 54 53" {...rest} ref={ref}><circle cx="13.354" cy="6.783" r="6.353"/><path fillRule="evenodd" d="M5.36 52.893h39.006H5.343h.018Zm1.58-10.592c.246.112.469.291.641.537l2.288 3.266a1.594 1.594 0 0 0 2.755-.251l6.154-13.461-2.638-7.156c-.513-1.393-2.485-1.389-2.993.007L6.94 42.3Zm34.328-5.088L33.494 14.22c-.491-1.451-2.547-1.442-3.024.013l-4.701 14.322 8.472 16.98c.586 1.174 2.262 1.176 2.85.002l4.177-8.324Z" clipRule="evenodd" opacity=".5"/><path d="M52.186 52.893H1.814c-1.234 0-2-1.342-1.372-2.404l4.462-7.548a1.594 1.594 0 0 1 2.677-.103l2.288 3.266a1.594 1.594 0 0 0 2.755-.251l9.025-19.742c.557-1.218 2.278-1.247 2.876-.049l9.716 19.472c.586 1.175 2.262 1.177 2.85.003l6.013-11.984c.602-1.2 2.328-1.164 2.878.06l7.657 17.033a1.594 1.594 0 0 1-1.453 2.247Z"/></svg>;
}

const IconPicturePlaceholder = React.forwardRef(IconPicturePlaceholderComponent);
export default IconPicturePlaceholder;
