simplify component exports

src/lib/components/audio/audio.svelte

@@ -18,7 +18,7 @@
 	$: __internal_audio_metadata.update((x) => ({ ...x, muted }));
 </script>
 
-{#if src}
+{#key src}
 	<audio
 		bind:this={element}
 		{src}
@@ -73,4 +73,4 @@
 		}}
 	/>
 	<!-- <AudioA11yProgress {currentTime} {paused} {duration} /> -->
-{/if}
+{/key}

src/lib/components/audio/index.ts

@@ -0,0 +1,2 @@
+export { default as AudioManager } from './audio.svelte';
+export { audio } from './store';

src/routes/+page.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
-	import Audio from '$lib/components/audio/audio.svelte';
+	import { audio, AudioManager } from '$lib/components/audio';
-	import { audio } from '$lib/components/audio/store';
 
 	const sources = {
 		syntax: '/example-syntax.mp3',
@@ -12,7 +11,7 @@
 
 <h1>Demo</h1>
 
-<Audio on:progress={(e) => console.log(e.detail)} />
+<AudioManager on:progress={(e) => console.log(e.detail)} />
 <!-- <progress
 	style="width: 960px; max-width:100%"
 	data-paused={$_paused ? 'true' : 'false'}