export type SectionProps = {
	description?: React.ReactNode;
	title?: React.ReactNode;
	children?: React.ReactNode;
};

const Section = ( { description, title, children }: SectionProps ) => (
	<fieldset className="preferences-modal__section">
		<legend className="preferences-modal__section-legend">
			<h2 className="preferences-modal__section-title">{ title }</h2>
			{ description && (
				<p className="preferences-modal__section-description">
					{ description }
				</p>
			) }
		</legend>
		<div className="preferences-modal__section-content">{ children }</div>
	</fieldset>
);

export default Section;