Add ModeTemplate with Svelte 5 frontend and components

- Create reusable components: auth, api-client, shared-types
- ModeTemplate with Hono backend and SvelteKit frontend
- Auth store refactored to class-based Svelte 5 pattern
- SSR-safe hydrate() pattern for localStorage access
- Frontend builds successfully with Svelte 5 runes

ModeTemplate/frontend/.svelte-kit/output/server/entries/fallbacks/error.svelte.js

@@ -0,0 +1,44 @@
+import { g as getContext, e as escape_html } from "../../chunks/context.js";
+import "clsx";
+import "../../chunks/state.svelte.js";
+import "@sveltejs/kit/internal";
+import "../../chunks/exports.js";
+import "../../chunks/utils.js";
+import { w as writable } from "../../chunks/index.js";
+import "@sveltejs/kit/internal/server";
+function create_updated_store() {
+  const { set, subscribe } = writable(false);
+  {
+    return {
+      subscribe,
+      // eslint-disable-next-line @typescript-eslint/require-await
+      check: async () => false
+    };
+  }
+}
+const stores = {
+  updated: /* @__PURE__ */ create_updated_store()
+};
+({
+  check: stores.updated.check
+});
+function context() {
+  return getContext("__request__");
+}
+const page$1 = {
+  get error() {
+    return context().page.error;
+  },
+  get status() {
+    return context().page.status;
+  }
+};
+const page = page$1;
+function Error$1($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    $$renderer2.push(`<h1>${escape_html(page.status)}</h1> <p>${escape_html(page.error?.message)}</p>`);
+  });
+}
+export {
+  Error$1 as default
+};

ModeTemplate/frontend/.svelte-kit/output/server/entries/pages/_layout.svelte.js

@@ -0,0 +1,25 @@
+import { w as head } from "../../chunks/index2.js";
+import { a as auth } from "../../chunks/auth.svelte.js";
+import { e as escape_html } from "../../chunks/context.js";
+function _layout($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let { children } = $$props;
+    head("12qhfyh", $$renderer2, ($$renderer3) => {
+      $$renderer3.push(`<meta name="description" content="Mode Template"/>`);
+    });
+    $$renderer2.push(`<div class="app svelte-12qhfyh"><header class="svelte-12qhfyh"><nav class="svelte-12qhfyh"><a href="/" class="svelte-12qhfyh">Home</a> `);
+    if (auth.isAuthenticated) {
+      $$renderer2.push("<!--[-->");
+      $$renderer2.push(`<span>Welcome, ${escape_html(auth.user?.displayName)}</span> <button class="svelte-12qhfyh">Logout</button>`);
+    } else {
+      $$renderer2.push("<!--[!-->");
+      $$renderer2.push(`<button class="svelte-12qhfyh">Login</button>`);
+    }
+    $$renderer2.push(`<!--]--></nav></header> <main class="svelte-12qhfyh">`);
+    children($$renderer2);
+    $$renderer2.push(`<!----></main></div>`);
+  });
+}
+export {
+  _layout as default
+};

ModeTemplate/frontend/.svelte-kit/output/server/entries/pages/_page.svelte.js

@@ -0,0 +1,26 @@
+import { e as escape_html } from "../../chunks/context.js";
+import "clsx";
+import { a as auth } from "../../chunks/auth.svelte.js";
+function _page($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    $$renderer2.push(`<h1>Mode Template</h1> `);
+    if (auth.loading) {
+      $$renderer2.push("<!--[-->");
+      $$renderer2.push(`<p>Loading...</p>`);
+    } else {
+      $$renderer2.push("<!--[!-->");
+      if (auth.isAuthenticated) {
+        $$renderer2.push("<!--[-->");
+        $$renderer2.push(`<p>Welcome, ${escape_html(auth.user?.displayName)}!</p> <p>Email: ${escape_html(auth.user?.email)}</p>`);
+      } else {
+        $$renderer2.push("<!--[!-->");
+        $$renderer2.push(`<p>Please log in to continue.</p> <button>Sign in with Microsoft</button>`);
+      }
+      $$renderer2.push(`<!--]-->`);
+    }
+    $$renderer2.push(`<!--]-->`);
+  });
+}
+export {
+  _page as default
+};

ModeTemplate/frontend/.svelte-kit/output/server/entries/pages/callback/_page.svelte.js

@@ -0,0 +1,19 @@
+import "clsx";
+import "@sveltejs/kit/internal";
+import "../../../chunks/exports.js";
+import "../../../chunks/utils.js";
+import "@sveltejs/kit/internal/server";
+import "../../../chunks/state.svelte.js";
+function _page($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    $$renderer2.push(`<h1>Authenticating...</h1> `);
+    {
+      $$renderer2.push("<!--[!-->");
+      $$renderer2.push(`<p>Please wait...</p>`);
+    }
+    $$renderer2.push(`<!--]-->`);
+  });
+}
+export {
+  _page as default
+};