<!-- Announcer.svelte - From the tinro docs: https://github.com/AlexxNB/tinro -->
<!-- This will be included in the App.svelte so that URL changes are announced in a way that accessibility tools can read the page. -->
<script>
	import { router } from 'tinro';
	$: current = $router.path === '/' ? 'Home' : $router.path.slice(1);
</script>

<div aria-live="assertive" aria-atomic="true">
	{#key current}
		Navigated to {current}
	{/key}
</div>

<style>
    div {
        position: absolute;
        left: 0;
        top: 0;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        overflow: hidden;
        white-space: nowrap;
        width: 1px;
        height: 1px;
    }
</style>
