import React from 'react';

interface IProps {
    size?: 'sm' | 'xs' | 'lg';
    isInline?: boolean;
    show?: boolean;
    message?: string;
}
const defaultProps: Partial<IProps> = {
    isInline: false,
    show: true,
    size: 'sm'
};

export default function LoadingIndicator(props: IProps) {
    if (!props.show) { return null; }
    return (<>
        <div className={`spinner spinner-${props.size} ${props.isInline ? 'spinner-inline' : ''}`}>
            <span className="sr-only">Loading...</span>
        </div>
        {props.message && <span className="spinner-message">{props.message}</span>}
    </>);
}
LoadingIndicator.defaultProps = defaultProps;
