import * as React from 'react';
import * as Styles from './style';

export namespace LoadingSpinner {
    export interface Props {
        size?: number;
        mTop?: string;
        color?: string;
        id?: string;
        name?: string;
    }
}
const LoadingSpinner = (props: LoadingSpinner.Props) => {
    const { size, color, mTop } = props;
    return (
        <Styles.Loading mTop={mTop} id={props.id && props.id + '-loading-div'}>
            <Styles.SVGLoad size={size} id={props.id ? props.id + '-load-svg' : "load"} viewBox="0 0 150 150" name={props.name && props.name + '-load'}>
                <Styles.LoadingInnerCircle color={color} id={props.id ? props.id + '-loading-inner' : "loading-inner"} name={props.name && props.name + '-loading-inner'} />
            </Styles.SVGLoad>
        </Styles.Loading>
    );
}

export default LoadingSpinner;
