---
import { getWidgetArea } from "../widgets/index.js";
import WidgetRenderer from "./WidgetRenderer.astro";

interface Props {
	name: string;
	class?: string;
}

const { name, class: className } = Astro.props;
const area = await getWidgetArea(name);
---

{
	area && area.widgets.length > 0 && (
		<div class:list={["widget-area", className]} data-widget-area={name}>
			{area.widgets.map((widget) => (
				<WidgetRenderer widget={widget} />
			))}
		</div>
	)
}