Updated to Svelte 5

frontend/src/lib/quiztivity/components/abcd/edit.svelte

@@ -9,7 +9,11 @@ SPDX-License-Identifier: MPL-2.0
 	import { getLocalization } from '$lib/i18n';
 	import BrownButton from '$lib/components/buttons/brown.svelte';
 
-	export let data: Abcd | undefined;
+	interface Props {
+		data: Abcd | undefined;
+	}
+
+	let { data = $bindable() }: Props = $props();
 
 	if (!data) {
 		data = {
@@ -39,7 +43,7 @@ SPDX-License-Identifier: MPL-2.0
 				/>
 				<button
 					type="button"
-					on:click={() => {
+					onclick={() => {
 						answer.correct = !answer.correct;
 					}}
 				>

frontend/src/lib/quiztivity/components/abcd/play.svelte

@@ -7,9 +7,13 @@ SPDX-License-Identifier: MPL-2.0
 <script lang="ts">
 	import type { Abcd } from '$lib/quiztivity/types';
 
-	export let data: Abcd | undefined;
+	interface Props {
+		data: Abcd | undefined;
+	}
 
-	let selected_answer: number | undefined;
+	let { data }: Props = $props();
+
+	let selected_answer: number | undefined = $state();
 
 	const select_answer = (i: number) => {
 		selected_answer = i;
@@ -24,7 +28,7 @@ SPDX-License-Identifier: MPL-2.0
 		{#each data.answers as answer, i}
 			<button
 				class="rounded-sm p-6 bg-gray-700 flex transition-all"
-				on:click={() => {
+				onclick={() => {
 					select_answer(i);
 				}}
 				class:opacity-50={selected_answer !== undefined && !answer.correct}