import type { ComponentSettings } from '@nitrogenbuilder/types';

export const nitrogenContentSlotSettings: ComponentSettings = {
	categories: {},
	options: {
		icon: 'fa-solid fa-layer-group',
		category: 'Layout',
	},
};

export default function NitrogenContentSlot({ id }: { id: string }) {
	return (
		<div
			id={id}
			className='nitrogen-module'
			data-nitrogen-module='NitrogenContentSlot'
			style={{
				border: '2px dashed #94a3b8',
				borderRadius: '8px',
				padding: '2rem',
				textAlign: 'center' as const,
				color: '#64748b',
				backgroundColor: '#f8fafc',
				minHeight: '100px',
				display: 'flex',
				alignItems: 'center',
				justifyContent: 'center',
			}}
		>
			Content Slot
		</div>
	);
}