From dc4db405d2991d3ec6a114f3b08d3fccd057d3ee Mon Sep 17 00:00:00 2001
From: Wolfgang Müller
Date: Thu, 13 Feb 2025 17:52:16 +0100
Subject: frontend: Migrate to Svelte 5

---
 frontend/src/lib/components/Card.svelte | 35 ++++++++++++++++++++++++---------
 1 file changed, 26 insertions(+), 9 deletions(-)

(limited to 'frontend/src/lib/components/Card.svelte')

diff --git a/frontend/src/lib/components/Card.svelte b/frontend/src/lib/components/Card.svelte
index d209517..21181dc 100644
--- a/frontend/src/lib/components/Card.svelte
+++ b/frontend/src/lib/components/Card.svelte
@@ -1,4 +1,4 @@
-<script lang="ts" context="module">
+<script lang="ts" module>
 	import type { ComicFragment, ImageFragment } from '$gql/graphql';
 
 	interface CardDetails {
@@ -24,12 +24,29 @@
 <script lang="ts">
 	import { src } from '$lib/Utils';
 	import Star from '$lib/icons/Star.svelte';
+	import type { Snippet } from 'svelte';
 
-	export let href: string;
-	export let details: CardDetails;
-	export let compact = false;
-	export let coverOnly = false;
-	export let ellipsis = true;
+	interface Props {
+		href: string;
+		details: CardDetails;
+		compact?: boolean;
+		coverOnly?: boolean;
+		ellipsis?: boolean;
+		overlay?: Snippet;
+		children?: Snippet;
+		onclick?: (event: MouseEvent) => void;
+	}
+
+	let {
+		href,
+		details,
+		compact = false,
+		coverOnly = false,
+		ellipsis = true,
+		overlay,
+		children,
+		onclick
+	}: Props = $props();
 </script>
 
 <a
@@ -37,9 +54,9 @@
 	class="grid-card-v sm:grid-card-h focus-thick focus-blue relative grid overflow-hidden rounded bg-slate-900 shadow-md shadow-slate-950/30"
 	class:compact
 	class:grid-card-cover-only={coverOnly}
-	on:click
+	{onclick}
 >
-	<slot name="overlay" />
+	{@render overlay?.()}
 	{#if details.cover}
 		<img
 			class="h-full w-full object-cover object-[center_top]"
@@ -76,7 +93,7 @@
 			</header>
 
 			<section class="max-h-full grow overflow-auto border-t border-slate-800/80 pt-2 text-xs">
-				<slot />
+				{@render children?.()}
 			</section>
 		</article>
 	{/if}
-- 
cgit v1.2.3-2-gb3c3