path: root/frontend/src/lib/scraper/components/SelectorItem.svelte

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

	let { title, selector }: { title: string; selector?: Selector<string> } = $props();
</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>