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

interface DefinisjonProps {
	type?: 'vertikal' | 'horisontal';
	term: string;
	detail?: string;
}

export function Definisjon({
	type = 'horisontal',
	term: descriptionTerm,
	detail: descriptionDetail,
}: DefinisjonProps): JSX.Element {
	return (
		<dl
			className={classnames('liste-ustilet', {
				'definition-list-horisontal': type === 'horisontal',
			})}
		>
			<dt>
				<strong>{descriptionTerm}</strong>{' '}
			</dt>
			<dd data-hj-suppress>{descriptionDetail}</dd>
		</dl>
	);
}