feat: Migrate to SvelteKit 3

.gitmodules

@@ -1,3 +1,4 @@
 [submodule "packages/svelte-core"]
 	path = packages/svelte-core
 	url = https://github.com/OpenShock/svelte-core.git
+	branch = feature/svelte-kit-3

package.json

@@ -26,9 +26,9 @@
 		"@lucide/svelte": "^1.31.0",
 		"@microsoft/signalr": "^10.0.11",
 		"@playwright/test": "^1.62.1",
-		"@sveltejs/adapter-cloudflare": "^7.2.9",
-		"@sveltejs/adapter-node": "^5.5.7",
-		"@sveltejs/kit": "^2.70.2",
+		"@sveltejs/adapter-cloudflare": "8.0.0-next.6",
+		"@sveltejs/adapter-node": "6.0.0-next.10",
+		"@sveltejs/kit": "3.0.0-next.23",
 		"@sveltejs/vite-plugin-svelte": "^7.3.0",
 		"@tailwindcss/vite": "^4.3.3",
 		"@tanstack/svelte-table": "^9.1.2",
@@ -93,5 +93,9 @@
 	"browserslist": [
 		"defaults and fully supports es6-module"
 	],
-	"packageManager": "pnpm@11.22.0"
+	"packageManager": "pnpm@11.22.0",
+	"imports": {
+		"#lib": "./src/lib/index.js",
+		"#lib/*": "./src/lib/*"
+	}
 }

src/app.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="temporal-polyfill/global" />
-import type { TurnstileInstance } from '$lib/types/TurnstileInstance';
+import type { TurnstileInstance } from '#lib/types/TurnstileInstance.js';
 
 // See https://svelte.dev/docs/kit/types#app.d.ts
 // for information about these interfaces

src/env.ts

@@ -0,0 +1,29 @@
+import { defineEnvVars } from '@sveltejs/kit/env';
+
+// The variables below without `static: true` were read through `$env/dynamic/*` before the
+// SvelteKit 3 migration, so they were `undefined` when unset. `schema: (input) => input ?? ''`
+// keeps that behaviour: every consumer feeds them to `isTruthy()` (or compares to `'true'`),
+// for which an empty string is falsy just like `undefined` was.
+export const variables = defineEnvVars({
+  PRIVATE_BACKEND_TLS_INSECURE: { schema: (input) => input ?? '' },
+  PUBLIC_GITHUB_PROJECT_URL: { public: true, static: true },
+  PUBLIC_SIGNOZ_DEPLOYMENT_ENVIRONMENT: { public: true, static: true },
+  PUBLIC_SIGNOZ_LOGS_ENABLED: { public: true, static: true },
+  PUBLIC_SIGNOZ_LOGS_URL: { public: true, static: true },
+  PUBLIC_SIGNOZ_TRACES_URL: { public: true, static: true },
+  PUBLIC_SITE_NAME: { public: true, static: true },
+  PUBLIC_DEVELOPMENT_BANNER: { public: true, static: true },
+  PUBLIC_DISCORD_INVITE_URL: { public: true, static: true },
+  PUBLIC_DISABLE_SITEMAP: { public: true, schema: (input) => input ?? '' },
+  PUBLIC_DENY_ROBOTS: { public: true, schema: (input) => input ?? '' },
+  PUBLIC_DISABLE_LLMS_TXT: { public: true, schema: (input) => input ?? '' },
+  PUBLIC_SITE_DESCRIPTION: { public: true, static: true },
+  PUBLIC_DISABLE_SHOCKER_MAP: { public: true, static: true },
+  PUBLIC_BACKEND_API_URL: { public: true, static: true },
+  PUBLIC_SITE_SHORT_URL: { public: true, static: true },
+  PUBLIC_SITE_URL: { public: true, static: true },
+  PUBLIC_DISABLE_ONBOARDING: { public: true, static: true },
+  PUBLIC_SIGNOZ_RESOURCE_ATTRIBUTES: { public: true, static: true },
+  PUBLIC_SIGNOZ_TRACE_PROPAGATION: { public: true, static: true },
+  PUBLIC_TURNSTILE_DEV_BYPASS_VALUE: { public: true, static: true },
+});

src/hooks.client.ts

@@ -1,15 +1,15 @@
+import type { HandleClientError } from '@sveltejs/kit/hooks';
 import 'temporal-polyfill/global';
 
-import { base } from '$app/paths';
-import { versionGetBackendInfo } from '$lib/api';
-import { handleApiError } from '$lib/errorhandling/apiErrorHandling';
-import { authState, startAuthLifecycle } from '$lib/state/auth-state.svelte';
-import { backendMetadata } from '$lib/state/backend-metadata-state.svelte';
-import { userState } from '$lib/state/user-state.svelte';
-import { initTelemetry, log } from '$lib/telemetry/logger';
-import { redirectLegacyHashRoute } from '$lib/utils/legacy-hash-redirect';
+import { versionGetBackendInfo } from '#lib/api/index.js';
+import { handleApiError } from '#lib/errorhandling/apiErrorHandling.js';
+import { authState, startAuthLifecycle } from '#lib/state/auth-state.svelte.js';
+import { backendMetadata } from '#lib/state/backend-metadata-state.svelte.js';
+import { userState } from '#lib/state/user-state.svelte.js';
+import { initTelemetry, log } from '#lib/telemetry/logger.js';
+import { redirectLegacyHashRoute } from '#lib/utils/legacy-hash-redirect.js';
+import { basePath } from '#lib/utils/url.js';
 import { initializeColorScheme } from '@openshock/svelte-core/state/color-scheme-state.svelte.js';
-import type { HandleClientError } from '@sveltejs/kit';
 
 /** Best-effort extraction of a message + stack from an unknown thrown value. */
 function describeError(value: unknown): { message: string; stack?: string } {
@@ -75,21 +75,33 @@ async function clientInit(): Promise<void> {
 export async function init() {
   initTelemetry();
   registerGlobalErrorCapture();
-  redirectLegacyHashRoute(base);
+  // `basePath()` has no trailing slash — the mapped target already starts with one.
+  redirectLegacyHashRoute(basePath());
   await clientInit().catch(handleApiError);
   initializeColorScheme();
 }
 
 /**
  * SvelteKit routes errors thrown during rendering, load, and navigation here instead of to
  * window.onerror — so forward them to telemetry too, otherwise they're silently swallowed.
+ *
+ * Since SvelteKit 3 this also receives *expected* errors: `error(...)` thrown by our own code
+ * (`kind: 'app'`) and SvelteKit's own 404s and the like (`kind: 'framework'`). Those are normal
+ * responses rather than defects, so they are logged at warn level and only unexpected throws
+ * are reported as errors.
  */
-export const handleError: HandleClientError = ({ error, event, status, message }) => {
-  const { message: errMessage, stack } = describeError(error);
-  log.error(errMessage, {
-    stack,
-    status,
-    route: event.route?.id ?? undefined,
-    kitMessage: message,
+export const handleError: HandleClientError = ({ kind, error, event }) => {
+  const route = event.route?.id ?? undefined;
+
+  if (kind === 'unknown') {
+    const { message, stack } = describeError(error);
+    log.error(message, { stack, status: 500, route, kind });
+    return;
+  }
+
+  log.warn(error.message, {
+    status: kind === 'framework' ? error.status : undefined,
+    route,
+    kind,
   });
 };

src/hooks.server.ts

@@ -1,6 +1,6 @@
-import { env } from '$env/dynamic/private';
-import { PUBLIC_GITHUB_PROJECT_URL } from '$env/static/public';
-import type { Handle, ServerInit } from '@sveltejs/kit';
+import { PRIVATE_BACKEND_TLS_INSECURE } from '$app/env/private';
+import { PUBLIC_GITHUB_PROJECT_URL } from '$app/env/public';
+import type { Handle, ServerInit } from '@sveltejs/kit/hooks';
 
 /**
  * Security + metadata headers for every dynamically rendered response.
@@ -58,7 +58,7 @@ export const handle: Handle = async ({ event, resolve }) => {
 export const init: ServerInit = () => {
   // `typeof process` guard: on the Cloudflare adapter there is no Node `process`
   // and no self-signed-cert scenario, so this is a no-op there.
-  if (env.PRIVATE_BACKEND_TLS_INSECURE === 'true' && typeof process !== 'undefined') {
+  if (PRIVATE_BACKEND_TLS_INSECURE === 'true' && typeof process !== 'undefined') {
     process.env.NODE_TLS_REJECT_UNAUTHORIZED = '0';
     console.warn(
       '[hooks.server] PRIVATE_BACKEND_TLS_INSECURE=true — TLS certificate validation is DISABLED for ' +

src/instrumentation.server.ts

@@ -1,10 +1,10 @@
-import { version } from '$app/environment';
+import { version } from '$app/env';
 import {
   PUBLIC_SIGNOZ_DEPLOYMENT_ENVIRONMENT,
   PUBLIC_SIGNOZ_LOGS_ENABLED,
   PUBLIC_SIGNOZ_LOGS_URL,
   PUBLIC_SIGNOZ_TRACES_URL,
-} from '$env/static/public';
+} from '$app/env/public';
 import { OTLPTraceExporter } from '@opentelemetry/exporter-trace-otlp-http';
 import { resourceFromAttributes } from '@opentelemetry/resources';
 import { BatchSpanProcessor, NodeTracerProvider } from '@opentelemetry/sdk-trace-node';

src/lib/api/internal/runtime-config.ts

@@ -1,5 +1,5 @@
-import { PUBLIC_BACKEND_API_URL } from '$env/static/public';
-import { getBackendURL } from '$lib/utils/url';
+import { getBackendURL } from '#lib/utils/url.js';
+import { PUBLIC_BACKEND_API_URL } from '$app/env/public';
 import type { CreateClientConfig } from './v1/client.gen';
 
 function resolveBaseUrl(): string {

src/lib/api/next/base.ts

@@ -1,4 +1,4 @@
-import { getBackendURL, type BackendPath } from '$lib/utils/url';
+import { getBackendURL, type BackendPath } from '#lib/utils/url.js';
 import { ResponseError } from './ResponseError';
 
 export async function GetJson<T>(

src/lib/api/next/oauth.ts

@@ -1,4 +1,4 @@
-import { getBackendURL } from '$lib/utils/url';
+import { getBackendURL } from '#lib/utils/url.js';
 import { GetJson, PostJson } from './base';
 import type { LoginOkResponse, OAuthFinalizeRequest, OAuthSignupData } from './models';
 import { TransformLoginOkResponse, TransformOAuthSignupData } from './transformers';

src/lib/comparers/ShockerLimitsComparer.ts

@@ -1,4 +1,4 @@
-import type { ShockerLimits } from '$lib/api';
+import type { ShockerLimits } from '#lib/api/index.js';
 
 export default function CompareShockerLimits(a: ShockerLimits, b: ShockerLimits) {
   // Compare the limits of the two shocker objects

src/lib/comparers/ShockerPermissionsComparer.ts

@@ -1,4 +1,4 @@
-import type { ShockerPermissions } from '$lib/api';
+import type { ShockerPermissions } from '#lib/api/index.js';
 
 export default function CompareShockerPermissions(a: ShockerPermissions, b: ShockerPermissions) {
   // Compare the permissions and limits of the two shocker objects

src/lib/comparers/UserShareComparer.ts

@@ -1,5 +1,5 @@
-import type { UserShareInfo } from '$lib/api';
-import CompareShockerPermissions from '$lib/comparers/ShockerPermissionsComparer';
+import type { UserShareInfo } from '#lib/api/index.js';
+import CompareShockerPermissions from '#lib/comparers/ShockerPermissionsComparer.js';
 import CompareShockerLimits from './ShockerLimitsComparer';
 
 export function ComparePermissionsAndLimits(a: UserShareInfo, b: UserShareInfo) {

src/lib/components/ControlModules/ClassicControlModule.svelte

@@ -4,9 +4,9 @@
     ControlDurationProps,
     ControlIntensityDefault,
     ControlIntensityProps,
-  } from '$lib/constants/ControlConstants';
-  import { ControlType } from '$lib/signalr/models/ControlType';
-  import { useShockerEvents } from '$lib/hooks/shocker-events.svelte';
+  } from '#lib/constants/ControlConstants.js';
+  import { ControlType } from '#lib/signalr/models/ControlType.js';
+  import { useShockerEvents } from '#lib/hooks/shocker-events.svelte.js';
   import ActionButtons from './impl/ActionButtons.svelte';
   import CircleSlider from './impl/CircleSlider.svelte';
   import LimitsDisplay from './impl/LimitsDisplay.svelte';

src/lib/components/ControlModules/LiveButton.svelte

@@ -6,7 +6,7 @@
     getLiveConnection,
     setHubLiveControl,
     toggleShockerLiveControl,
-  } from '$lib/state/live-control-state.svelte';
+  } from '#lib/state/live-control-state.svelte.js';
 
   interface Props {
     hubId: string;

src/lib/components/ControlModules/LiveControlModule.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
   import { Volume2, Waves, Zap } from '@lucide/svelte';
   import { buttonVariants } from '@openshock/svelte-core/components/ui/button';
-  import { ControlType } from '$lib/signalr/models/ControlType';
+  import { ControlType } from '#lib/signalr/models/ControlType.js';
   import {
     type LiveShockerState,
     type LiveDeviceConnection,
-  } from '$lib/state/live-control-state.svelte';
+  } from '#lib/state/live-control-state.svelte.js';
   import { cn } from '@openshock/svelte-core/utils';
   import LiveSlider from './impl/LiveSlider.svelte';
 

src/lib/components/ControlModules/MapControlModule.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import type { ShockerResponse } from '$lib/api';
+  import type { ShockerResponse } from '#lib/api/index.js';
   import { onMount } from 'svelte';
 
   interface Props {

src/lib/components/ControlModules/PublicShareClassicControlModule.svelte

@@ -1,17 +1,17 @@
 <script lang="ts">
   import { ClockFading, Gauge, Pause } from '@lucide/svelte';
-  import type { PublicShareShocker } from '$lib/api';
+  import type { PublicShareShocker } from '#lib/api/index.js';
   import {
     ControlDurationDefault,
     ControlDurationProps,
     ControlIntensityDefault,
     ControlIntensityProps,
-  } from '$lib/constants/ControlConstants';
-  import type { Control } from '$lib/signalr/models/Control';
-  import { ControlType } from '$lib/signalr/models/ControlType';
+  } from '#lib/constants/ControlConstants.js';
+  import type { Control } from '#lib/signalr/models/Control.js';
+  import { ControlType } from '#lib/signalr/models/ControlType.js';
   import { formatDurationSeconds } from '@openshock/svelte-core/utils';
-  import { getPauseReason } from '$lib/utils';
-  import { useShockerEvents } from '$lib/hooks/shocker-events.svelte';
+  import { getPauseReason } from '#lib/utils/index.js';
+  import { useShockerEvents } from '#lib/hooks/shocker-events.svelte.js';
   import ActionButtons from './impl/ActionButtons.svelte';
   import CircleSlider from './impl/CircleSlider.svelte';
 

src/lib/components/ControlModules/RichControlModule.svelte

@@ -1,17 +1,17 @@
 <script lang="ts">
   import { Signal, Timer } from '@lucide/svelte';
-  import type { ShockerResponse } from '$lib/api';
+  import type { ShockerResponse } from '#lib/api/index.js';
   import {
     ControlDurationDefault,
     ControlDurationProps,
     ControlIntensityDefault,
     ControlIntensityProps,
-  } from '$lib/constants/ControlConstants';
-  import { getConnection } from '$lib/signalr/user.svelte';
-  import { ControlType } from '$lib/signalr/models/ControlType';
-  import { serializeControlMessages } from '$lib/signalr/serializers/Control';
+  } from '#lib/constants/ControlConstants.js';
+  import { getConnection } from '#lib/signalr/user.svelte.js';
+  import { ControlType } from '#lib/signalr/models/ControlType.js';
+  import { serializeControlMessages } from '#lib/signalr/serializers/Control.js';
   import { formatDurationSeconds } from '@openshock/svelte-core/utils';
-  import { useShockerEvents } from '$lib/hooks/shocker-events.svelte';
+  import { useShockerEvents } from '#lib/hooks/shocker-events.svelte.js';
   import ActionButtons from './impl/ActionButtons.svelte';
 
   interface Props {

src/lib/components/ControlModules/SharedShockerControlModule.svelte

@@ -1,17 +1,17 @@
 <script lang="ts">
   import { ClockFading, Gauge, Pause } from '@lucide/svelte';
-  import type { SharedShocker } from '$lib/api';
+  import type { SharedShocker } from '#lib/api/index.js';
   import {
     ControlDurationDefault,
     ControlDurationProps,
     ControlIntensityDefault,
     ControlIntensityProps,
-  } from '$lib/constants/ControlConstants';
-  import { getConnection } from '$lib/signalr/user.svelte';
-  import { ControlType } from '$lib/signalr/models/ControlType';
-  import { serializeControlMessages } from '$lib/signalr/serializers/Control';
+  } from '#lib/constants/ControlConstants.js';
+  import { getConnection } from '#lib/signalr/user.svelte.js';
+  import { ControlType } from '#lib/signalr/models/ControlType.js';
+  import { serializeControlMessages } from '#lib/signalr/serializers/Control.js';
   import { formatDurationSeconds } from '@openshock/svelte-core/utils';
-  import { useShockerEvents } from '$lib/hooks/shocker-events.svelte';
+  import { useShockerEvents } from '#lib/hooks/shocker-events.svelte.js';
   import ActionButtons from './impl/ActionButtons.svelte';
   import CircleSlider from './impl/CircleSlider.svelte';
 

src/lib/components/ControlModules/SimpleControlHeader.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { Timer, Volume2, Zap } from '@lucide/svelte';
-  import { ControlDurationProps, ControlIntensityProps } from '$lib/constants/ControlConstants';
+  import { ControlDurationProps, ControlIntensityProps } from '#lib/constants/ControlConstants.js';
   import { formatDurationSeconds } from '@openshock/svelte-core/utils';
   import CircleSlider from './impl/CircleSlider.svelte';
 

src/lib/components/ControlModules/SimpleControlModule.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
-  import type { ShockerResponse } from '$lib/api';
-  import { getConnection } from '$lib/signalr/user.svelte';
-  import { ControlType } from '$lib/signalr/models/ControlType';
-  import { serializeControlMessages } from '$lib/signalr/serializers/Control';
-  import { useShockerEvents } from '$lib/hooks/shocker-events.svelte';
+  import type { ShockerResponse } from '#lib/api/index.js';
+  import { getConnection } from '#lib/signalr/user.svelte.js';
+  import { ControlType } from '#lib/signalr/models/ControlType.js';
+  import { serializeControlMessages } from '#lib/signalr/serializers/Control.js';
+  import { useShockerEvents } from '#lib/hooks/shocker-events.svelte.js';
   import ActionButtons from './impl/ActionButtons.svelte';
 
   interface Props {

src/lib/components/ControlModules/dialogs/dialog-shocker-add.svelte

@@ -1,5 +1,5 @@
 <script lang="ts" module>
-  import { ShockerModelType } from '$lib/api';
+  import { ShockerModelType } from '#lib/api/index.js';
   export interface AddShockerData {
     name: string;
     rfId: number;
@@ -18,16 +18,16 @@
 </script>
 
 <script lang="ts">
-  import type { NewShocker } from '$lib/api';
+  import type { NewShocker } from '#lib/api/index.js';
   import { TextInput } from '@openshock/svelte-core/components/input';
   import { Button } from '@openshock/svelte-core/components/ui/button';
   import * as Dialog from '@openshock/svelte-core/components/ui/dialog';
   import * as Select from '@openshock/svelte-core/components/ui/select';
   import { Field, FieldLabel } from '@openshock/svelte-core/components/ui/field';
   import { Input } from '@openshock/svelte-core/components/ui/input';
   import type { DialogContentProps } from '@openshock/svelte-core/components/dialog-manager';
-  import { RfIdMax, RfIdMin, isValidRfId } from '$lib/constants/ShockerConstants';
-  import type { OwnHub } from '$lib/state/hubs-state.svelte';
+  import { RfIdMax, RfIdMin, isValidRfId } from '#lib/constants/ShockerConstants.js';
+  import type { OwnHub } from '#lib/state/hubs-state.svelte.js';
 
   interface Props extends DialogContentProps<NewShocker | undefined> {
     data: AddShockerData;

src/lib/components/ControlModules/impl/ActionButtons.svelte

@@ -1,7 +1,7 @@
 <script lang="ts" module>
   import { Volume2, Waves, Zap } from '@lucide/svelte';
   import { buttonVariants } from '@openshock/svelte-core/components/ui/button';
-  import { ControlType } from '$lib/signalr/models/ControlType';
+  import { ControlType } from '#lib/signalr/models/ControlType.js';
 
   const Buttons = [
     { type: ControlType.Sound, Icon: Volume2 },
@@ -14,7 +14,7 @@
 
 <script lang="ts">
   import { Spinner } from '@openshock/svelte-core/components/ui/spinner';
-  import type { TimeoutHandle } from '$lib/types/WAPI';
+  import type { TimeoutHandle } from '#lib/types/WAPI.js';
   import { cn } from '@openshock/svelte-core/utils';
   import { onDestroy } from 'svelte';
 

src/lib/components/ControlModules/impl/LiveSlider.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { onDestroy, onMount } from 'svelte';
-  import type { LiveShockerState } from '$lib/state/live-control-state.svelte';
+  import type { LiveShockerState } from '#lib/state/live-control-state.svelte.js';
 
   interface Props {
     liveState: LiveShockerState;