path: root/frontend/src/lib/components/DeleteButton.svelte

<script lang="ts">
	import { accelerator } from '$lib/Shortcuts';
	import type { MouseEventHandler } from 'svelte/elements';

	interface Props {
		prominent?: boolean;
		onclick: MouseEventHandler<HTMLButtonElement>;
	}

	let { prominent = false, onclick }: Props = $props();
</script>

<button
	type="button"
	class={prominent ? 'btn-rose' : 'btn-slate hover:bg-rose-700'}
	title="Delete forever"
	aria-label="Delete forever"
	{onclick}
	use:accelerator={'Delete'}
>
	<span class="icon-base icon-[material-symbols--delete-forever]"></span>
</button>