import classnames from 'classnames';
import React from 'react';

interface Props {
	className?: string[] | string;
	aktivert: boolean;
	tekst?: string;
}

function Spinner(props: Props) {
	const { className, aktivert, tekst } = props;
	const klasser = classnames('util-tekst-sentrert', className);
	return aktivert ? (
		<div className={klasser}>
			<div className="spinner-wrapper liten er-aktiv">
				<div className="spinner-layer">
					<div className="sirkel-clipper venstre">
						<div className="sirkel" />
					</div>
					<div className="mellomrom-fiks">
						<div className="sirkel" />
					</div>
					<div className="sirkel-clipper hoyre">
						<div className="sirkel" />
					</div>
				</div>
			</div>
			{tekst ? (
				<div className="vertical-spacing-small">
					<p className="util-leselengde spinner-tekst">{tekst}</p>
				</div>
			) : null}
		</div>
	) : null;
}

export { Spinner };