<script lang="ts">
	import { Selector } from '$lib/Scraper';
	import SelectorButton from './SelectorButton.svelte';

	export let title: string;
	export let selector: Selector<string> | undefined;
</script>

{#if selector}
	<div class="flex flex-col gap-1">
		<h2>{title}</h2>
		<SelectorButton {selector} />
	</div>
{/if}

<style>
	:root {
		--span: 6;
	}

	div {
		grid-column: span var(--span) / span var(--span);
	}
</style>