import * as React from 'react'
import { SpinnerProps } from '../interfaces'

const styles = require('../../src/styles/components/spinner.scss')

export class Spinner extends React.Component<SpinnerProps, any> {
    public static defaultProps: SpinnerProps = {
        visible: true,
        size: 10,
    }

    public render() {
        const inline = {
            width: `${this.props.size}px`,
            height: `${this.props.size}px`,
            margin: `${this.props.size}px auto`,
        }

        return this.props.visible
            ? <div className={styles.visible} style={inline} />
            : <div className={styles.invisible} style={inline} />
    }
}