<script lang="ts">
	import { createEventDispatcher } from 'svelte';
	export let query = '';
	export let page: Number = 0;

	const dispatch = createEventDispatcher();
	function execSearch() {
		dispatch('search', {
			query,
			page
		});
	}
</script>

<form class="flex bg-bh-black rounded-md grow" on:submit|preventDefault={() => execSearch()}>
	<input class="border-none grow py-1 px-2 mr-1 rounded-l-md" name="terms" bind:value={query} />
	<button class="border-none rounded-r-md py-1 px-2">Submit</button>
</form>
