atmo.rsvp
1<script lang="ts">
2 import type { EventTheme } from '$lib/theme';
3 import Blobs from './themes/Blobs.svelte';
4 import Stars from './themes/Stars.svelte';
5 import Matrix from './themes/Matrix.svelte';
6 import Fireflies from './themes/Fireflies.svelte';
7 import Butterflies from './themes/Butterflies.svelte';
8 import Kaleidoscope from './themes/Kaleidoscope.svelte';
9
10 let {
11 theme
12 }: {
13 theme: EventTheme;
14 } = $props();
15
16 let key = $derived(`${theme.name}-${theme.accentColor}-${theme.baseColor}`);
17</script>
18
19{#key key}
20 {#if theme.name === 'blobs'}
21 <Blobs />
22 {:else if theme.name === 'warp'}
23 <Stars />
24 {:else if theme.name === 'matrix'}
25 <Matrix />
26 {:else if theme.name === 'fireflies'}
27 <Fireflies />
28 {:else if theme.name === 'butterflies'}
29 <Butterflies />
30 {:else if theme.name === 'kaleidoscope'}
31 <Kaleidoscope />
32 {/if}
33{/key}