update dependencies

package.json

@@ -34,62 +34,62 @@
     "typesafe-i18n": "typesafe-i18n"
   },
   "devDependencies": {
-    "@codemirror/autocomplete": "^6.17.0",
-    "@codemirror/commands": "^6.6.0",
+    "@codemirror/autocomplete": "^6.18.2",
+    "@codemirror/commands": "^6.7.1",
     "@codemirror/lang-javascript": "^6.2.2",
-    "@codemirror/language": "^6.10.2",
+    "@codemirror/language": "^6.10.3",
     "@codemirror/state": "^6.4.1",
-    "@codemirror/view": "^6.29.1",
-    "@fontsource-variable/material-symbols-rounded": "^5.0.36",
-    "@fontsource-variable/noto-sans-mono": "^5.0.20",
-    "@lezer/highlight": "^1.2.0",
+    "@codemirror/view": "^6.34.1",
+    "@fontsource-variable/material-symbols-rounded": "^5.1.3",
+    "@fontsource-variable/noto-sans-mono": "^5.1.0",
+    "@lezer/highlight": "^1.2.1",
     "@material/material-color-utilities": "^0.3.0",
     "@melt-ui/pp": "^0.3.2",
-    "@melt-ui/svelte": "^0.83.0",
+    "@melt-ui/svelte": "^0.86.0",
     "@modyfi/vite-plugin-yaml": "^1.1.0",
-    "@sveltejs/adapter-static": "^3.0.2",
-    "@sveltejs/kit": "^2.5.18",
-    "@sveltejs/vite-plugin-svelte": "^3.1.1",
+    "@sveltejs/adapter-static": "^3.0.6",
+    "@sveltejs/kit": "^2.7.5",
+    "@sveltejs/vite-plugin-svelte": "^4.0.0",
     "@tauri-apps/api": "^1.6.0",
     "@tauri-apps/cli": "^1.6.0",
     "@types/dom-view-transitions": "^1.0.5",
     "@types/flexsearch": "^0.7.6",
-    "@types/w3c-web-serial": "^1.0.6",
+    "@types/w3c-web-serial": "^1.0.7",
     "@types/w3c-web-usb": "^1.0.10",
     "@types/wicg-file-system-access": "^2023.10.5",
-    "@vite-pwa/sveltekit": "^0.6.0",
-    "autoprefixer": "^10.4.19",
+    "@vite-pwa/sveltekit": "^0.6.6",
+    "autoprefixer": "^10.4.20",
     "codemirror": "^6.0.1",
     "cypress": "^13.13.2",
     "d3": "^7.9.0",
     "flexsearch": "^0.7.43",
-    "fontkit": "^2.0.2",
+    "fontkit": "^2.0.4",
     "glob": "^11.0.0",
-    "jsdom": "^24.1.1",
-    "matrix-js-sdk": "^34.4.0",
+    "jsdom": "^25.0.1",
+    "matrix-js-sdk": "^34.9.0",
     "npm-run-all": "^4.1.5",
     "prettier": "^3.3.3",
-    "prettier-plugin-svelte": "^3.2.6",
+    "prettier-plugin-svelte": "^3.2.7",
     "rxjs": "^7.8.1",
-    "sass": "^1.77.8",
-    "socket.io-client": "^4.7.5",
-    "stylelint": "^16.8.1",
+    "sass": "^1.80.6",
+    "socket.io-client": "^4.8.1",
+    "stylelint": "^16.10.0",
     "stylelint-config-clean-order": "^6.1.0",
     "stylelint-config-html": "^1.1.0",
     "stylelint-config-prettier-scss": "^1.0.0",
     "stylelint-config-recommended-scss": "^14.1.0",
     "stylelint-config-standard-scss": "^13.1.0",
-    "svelte": "5.0.0-next.221",
-    "svelte-check": "^3.8.5",
-    "svelte-preprocess": "^6.0.2",
+    "svelte": "5.1.9",
+    "svelte-check": "^4.0.5",
+    "svelte-preprocess": "^6.0.3",
     "tippy.js": "^6.3.7",
     "typesafe-i18n": "^5.26.2",
-    "typescript": "^5.5.4",
-    "vite": "^5.3.5",
-    "vite-plugin-mkcert": "^1.17.5",
-    "vite-plugin-pwa": "^0.20.1",
-    "vitest": "^2.0.5",
-    "workbox-window": "^7.1.0"
+    "typescript": "^5.6.3",
+    "vite": "^5.4.10",
+    "vite-plugin-mkcert": "^1.17.6",
+    "vite-plugin-pwa": "^0.20.5",
+    "vitest": "^2.1.4",
+    "workbox-window": "^7.3.0"
   },
   "type": "module"
 }

src/routes/(app)/+layout.svelte

@@ -111,7 +111,7 @@
 </script>
 
 <svelte:head>
-  <!--{@html webManifestLink}-->
+  {@html webManifestLink}
   <title>{$LL.TITLE()}</title>
   <meta name="description" content={$LL.DESCRIPTION()} />
   <meta name="theme-color" content={data.themeColor} />

src/routes/(app)/Sidebar.svelte

@@ -1,14 +1,5 @@
 <script lang="ts">
-  import { browser } from "$app/environment";
   import { page } from "$app/stores";
-  import { userPreferences } from "$lib/preferences";
-  import { onMount } from "svelte";
-
-  onMount(async () => {
-    if (browser && !$userPreferences.autoConnect) {
-      connectButton.click();
-    }
-  });
 
   const routes = [
     [
@@ -114,6 +105,7 @@
       justify-content: center;
       font-size: 24px;
       padding: 8px;
+      border-radius: 8px;
 
       transition: all 250ms ease;
     }

src/routes/(app)/config/PageTransition.svelte

@@ -2,13 +2,13 @@
   import { fly } from "svelte/transition";
   import { afterNavigate, beforeNavigate } from "$app/navigation";
   import { expoIn, expoOut } from "svelte/easing";
-  import type { Snippet } from "svelte";
+  import { type Snippet } from "svelte";
 
   let { children }: { children: Snippet } = $props();
 
   let inDirection = $state(0);
   let outDirection = $state(0);
-  let outroEnd: undefined | (() => void) = $state(undefined);
+  let done: undefined | (() => void) = $state(undefined);
   let animationDone: Promise<void>;
 
   let isNavigating = $state(false);
@@ -19,6 +19,10 @@
     "/config/layout/",
   ];
 
+  function outroEnd() {
+    done?.();
+  }
+
   beforeNavigate((navigation) => {
     const from = navigation.from?.url.pathname;
     const to = navigation.to?.url.pathname;
@@ -37,7 +41,7 @@
     }
 
     animationDone = new Promise((resolve) => {
-      outroEnd = resolve;
+      done = resolve;
     });
   });
 
@@ -49,7 +53,12 @@
 
 {#if !isNavigating}
   <main
-    in:fly={{ y: inDirection * 24, duration: 150, easing: expoOut }}
+    in:fly={{
+      y: inDirection * 24,
+      duration: 150,
+      delay: 1, // flicker for some reason without this
+      easing: expoOut,
+    }}
     out:fly={{ y: outDirection * 24, duration: 150, easing: expoIn }}
     onoutroend={outroEnd}
   >

src/routes/(app)/config/chords/ChordEdit.svelte

@@ -46,7 +46,7 @@
     id.splice(id.indexOf(0), 1);
     id.push(0);
     while ($chords.some((it) => JSON.stringify(it.id) === JSON.stringify(id))) {
-      id[id.length - 1]!++;
+      id[id.length - 1] = id[id.length - 1]! + 1;
     }
 
     changes.update((changes) => {

src/routes/(app)/plugin/+page.svelte

@@ -155,30 +155,31 @@
       doc: examplePlugin,
     });
   });
-  let channels = $derived(
-    $serialPort
-      ? ({
-          getVersion: async (..._args: unknown[]) => $serialPort.version,
-          getDevice: async (..._args: unknown[]) => $serialPort.device,
-          commit: async (..._args: unknown[]) => {
-            if (
-              confirm(
-                "Perform a commit? Settings are already applied until the next reboot.\n\n" +
-                  "Excessive commits can lead to premature breakdowns, as the settings storage is only rated for 10,000-25,000 commits.\n\n" +
-                  "Click OK to perform the commit anyways.",
-              )
-            ) {
-              return $serialPort.commit();
-            }
-          },
-          ...Object.fromEntries(
-            charaMethods.map(
-              (it) => [it, $serialPort[it].bind($serialPort)] as const,
-            ),
-          ),
-        } satisfies Record<string, Function>)
-      : ({} as any),
-  );
+
+  let channels = $derived.by(() => {
+    if (!$serialPort) return {} as any;
+    return {
+      getVersion: (..._args: unknown[]) => Promise.resolve($serialPort.version),
+      getDevice: (..._args: unknown[]) => Promise.resolve($serialPort.device),
+      commit: (..._args: unknown[]) => {
+        if (
+          confirm(
+            "Perform a commit? Settings are already applied until the next reboot.\n\n" +
+              "Excessive commits can lead to premature breakdowns, as the settings storage is only rated for 10,000-25,000 commits.\n\n" +
+              "Click OK to perform the commit anyways.",
+          )
+        ) {
+          return Promise.resolve($serialPort.commit());
+        }
+        return Promise.resolve();
+      },
+      ...Object.fromEntries(
+        charaMethods.map(
+          (it) => [it, $serialPort[it].bind($serialPort)] as const,
+        ),
+      ),
+    } satisfies Record<string, Function>;
+  });
 
   async function onMessage(event: MessageEvent) {
     if (event.origin !== "null" || event.source !== frame.contentWindow) return;