diff options
| -rw-r--r-- | src/lib/List/MediaRoulette.svelte | 28 |
1 files changed, 15 insertions, 13 deletions
diff --git a/src/lib/List/MediaRoulette.svelte b/src/lib/List/MediaRoulette.svelte index d4323476..4b498d4f 100644 --- a/src/lib/List/MediaRoulette.svelte +++ b/src/lib/List/MediaRoulette.svelte @@ -5,17 +5,21 @@ import settings from '$stores/settings'; import { mediaTitle } from './mediaTitle'; - export let media: Media[]; - export let type: 'anime' | 'manga'; - export let onClose: () => void; - export let spinDuration = 2; - - let isSpinning = false; - let selectedIndex = 0; - let displayIndex = 0; - let spinTimeout: ReturnType<typeof setTimeout> | null = null; - let showResult = false; - let isClosing = false; + interface Props { + media: Media[]; + type: 'anime' | 'manga'; + onClose: () => void; + spinDuration?: number; + } + + let { media, type, onClose, spinDuration = 2 }: Props = $props(); + let isSpinning = $state(false); + let selectedIndex = $state(0); + let displayIndex = $state(0); + let spinTimeout: ReturnType<typeof setTimeout> | null = $state(null); + let showResult = $state(false); + let isClosing = $state(false); + let currentMedia = $derived(media[displayIndex]); const startRoulette = () => { if (media.length === 0 || isSpinning) return; @@ -73,8 +77,6 @@ setTimeout(() => onClose(), 200); }; - $: currentMedia = media[displayIndex]; - const handleOverlayClick = (e: MouseEvent) => { if (e.target === e.currentTarget) handleClose(); }; |