path: root/frontend/src/lib/toolbar/Search.svelte

<script lang="ts">
	import { page } from '$app/stores';
	import { debounce } from '$lib/Actions';
	import { BasicFilterContext, getFilterContext } from '$lib/Filter';
	import { accelerator } from '$lib/Shortcuts';

	const filter = getFilterContext<BasicFilterContext>();

	export let name: string;
	export let field: string;
</script>

<input
	type="text"
	size={25}
	class="btn-slate w-min"
	placeholder="Search {name}..."
	bind:value={field}
	use:debounce={{ callback: () => $filter.apply($page.url.searchParams) }}
	use:accelerator={'F'}
/>