Update

src/components/admin/pages/generate/TeamChip.svelte

@@ -18,20 +18,27 @@
   -->
 
 <script lang="ts">
+  import { createBubbler } from 'svelte/legacy';
+
+  const bubble = createBubbler();
     import type {Team} from "@type/team.ts";
     import {brightness, colorFromTeam, lighten} from "../../util";
 
-    export let team: Team;
+  interface Props {
+    team: Team;
+  }
 
-    let hover = false;
+  let { team }: Props = $props();
+
+    let hover = $state(false);
 </script>
 
 <div class="rounded w-fit p-2 border-gray-600 border cursor-grab select-none m-1 flex place-items-center"
      style:background-color={hover ? lighten(colorFromTeam(team)) : colorFromTeam(team)}
      class:text-black={brightness(colorFromTeam(team))} draggable="true"
-     on:dragstart
-     on:mouseenter={() => hover = true}
-     on:mouseleave={() => hover = false}
+     ondragstart={bubble('dragstart')}
+     onmouseenter={() => hover = true}
+     onmouseleave={() => hover = false}
      role="figure">
     <span>{team.name}</span>
 </div>