1 files changed, 14 insertions, 9 deletions
diff --git a/src/lib/Layout/Dropdown.svelte b/src/lib/Layout/Dropdown.svelte
index fb270dfe..aca94975 100644
--- a/src/lib/Layout/Dropdown.svelte
+++ b/src/lib/Layout/Dropdown.svelte
@@ -6,12 +6,14 @@
     preventDefault?: boolean;
   }
 
-  export let items: Item[] = [];
-  export let title: string | undefined = undefined;
-  export let header = true;
-  export let center = false;
+  let {
+    items = [] as Item[],
+    title = undefined as string | undefined,
+    header = true,
+    center = false
+  } = $props();
 
-  let open = false;
+  let open = $state(false);
 
   const handleClickOutside = (event: any) => {
     if (!event.target.closest('.dropdown')) open = false;
@@ -30,8 +32,8 @@
   <span
     class={`${header ? 'header-item' : ''} dropdown-toggle`}
     id="dropdown-toggle"
-    on:click|preventDefault={() => (open = !open)}
-    on:keydown={() => {}}
+    onclick={() => (open = !open)}
+    onkeydown={() => {}}
     role="button"
     tabindex="0"
   >
@@ -47,7 +49,7 @@
       <a
         href={item.url}
         class="header-item"
-        on:click={(e) => {
+        onclick={(e) => {
           if (item.preventDefault) e.preventDefault();
           if (item.onClick) item.onClick();
         }}
@@ -89,7 +91,10 @@
     transform: translateY(-20px);
     visibility: hidden;
     $delay: 0.25s;
-    transition: opacity $delay ease, transform $delay ease, visibility 0s linear $delay;
+    transition:
+      opacity $delay ease,
+      transform $delay ease,
+      visibility 0s linear $delay;
     left: var(--dropdown-left);
     transform: var(--dropdown-transform);
     z-index: 1;