@jskit-ai/create-app 0.1.93 → 0.1.95

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@jskit-ai/create-app",
-  "version": "0.1.93",
-  "description": "Scaffold minimal JSKIT app shells.",
+  "version": "0.1.95",
+  "description": "Scaffold JSKIT app shells.",
   "type": "module",
   "files": [
     "bin",

package/src/server/index.js

@@ -7,6 +7,7 @@ import { createCliError } from "./cliError.js";
 import { shellQuote } from "./cliEntrypoint.js";
 
 const DEFAULT_TEMPLATE = "base-shell";
+const MINIMAL_TEMPLATE = "minimal-shell";
 const DEFAULT_INITIAL_BUNDLES = "none";
 const INITIAL_BUNDLE_PRESETS = new Set(["none", "auth"]);
 const TENANCY_MODES = new Set(["none", "personal", "workspaces"]);
@@ -128,6 +129,11 @@ function parseCliArgs(argv) {
       continue;
     }
 
+    if (arg === "--minimal") {
+      options.template = MINIMAL_TEMPLATE;
+      continue;
+    }
+
     if (arg === "--template") {
       const { value, nextIndex } = parseOptionWithValue(args, index, "--template");
       options.template = value;
@@ -221,8 +227,9 @@ function printUsage(stream = process.stderr) {
   stream.write("\n");
   stream.write("Options:\n");
   stream.write(
-    `  --template <name>  Template folder under templates/ (default: ${DEFAULT_TEMPLATE}; use ai-seed for the minimal AI seed flow)\n`
+    `  --template <name>  Template folder under templates/ (default: ${DEFAULT_TEMPLATE}; use minimal-shell for the bare scaffold or ai-seed for the AI seed flow)\n`
   );
+  stream.write("  --minimal          Use the bare minimal-shell template instead of the default shell-web app scaffold\n");
   stream.write("  --title <text>     App title used for template replacements\n");
   stream.write("  --target <path>    Target directory (default: ./<app-name>)\n");
   stream.write("  --initial-bundles <preset>  Optional bundle preset: none | auth (default: none)\n");

package/templates/base-shell/.jskit/lock.json

@@ -26,6 +26,235 @@
       },
       "options": {},
       "installedAt": "1970-01-01T00:00:00.000Z"
+    },
+    "@jskit-ai/shell-web": {
+      "packageId": "@jskit-ai/shell-web",
+      "version": "0.1.85",
+      "source": {
+        "type": "catalog",
+        "descriptorPath": "../jskit-catalog/catalog/packages.json#@jskit-ai/shell-web"
+      },
+      "managed": {
+        "packageJson": {
+          "dependencies": {
+            "@mdi/js": {
+              "hadPrevious": false,
+              "previousValue": "",
+              "value": "^7.4.47"
+            },
+            "@jskit-ai/shell-web": {
+              "hadPrevious": false,
+              "previousValue": "",
+              "value": "0.x"
+            }
+          },
+          "devDependencies": {},
+          "scripts": {}
+        },
+        "text": {
+          "packages/main/src/client/providers/MainClientProvider.js::shell-web-main-client-provider-menu-link-item-import": {
+            "file": "packages/main/src/client/providers/MainClientProvider.js",
+            "op": "append-text",
+            "value": "import MenuLinkItem from \"/src/components/menus/MenuLinkItem.vue\";\n",
+            "position": "top",
+            "reason": "Bind app-owned shell menu link-item scaffold into local main client provider imports.",
+            "category": "shell-web",
+            "id": "shell-web-main-client-provider-menu-link-item-import"
+          },
+          "packages/main/src/client/providers/MainClientProvider.js::shell-web-main-client-provider-surface-aware-menu-link-item-import": {
+            "file": "packages/main/src/client/providers/MainClientProvider.js",
+            "op": "append-text",
+            "value": "import SurfaceAwareMenuLinkItem from \"/src/components/menus/SurfaceAwareMenuLinkItem.vue\";\n",
+            "position": "top",
+            "reason": "Bind app-owned shell surface-aware menu link-item scaffold into local main client provider imports.",
+            "category": "shell-web",
+            "id": "shell-web-main-client-provider-surface-aware-menu-link-item-import"
+          },
+          "packages/main/src/client/providers/MainClientProvider.js::shell-web-main-client-provider-tab-link-item-import": {
+            "file": "packages/main/src/client/providers/MainClientProvider.js",
+            "op": "append-text",
+            "value": "import TabLinkItem from \"/src/components/menus/TabLinkItem.vue\";\n",
+            "position": "top",
+            "reason": "Bind app-owned shell tab link-item scaffold into local main client provider imports.",
+            "category": "shell-web",
+            "id": "shell-web-main-client-provider-tab-link-item-import"
+          },
+          "packages/main/src/client/providers/MainClientProvider.js::shell-web-main-client-provider-menu-link-item-register": {
+            "file": "packages/main/src/client/providers/MainClientProvider.js",
+            "op": "append-text",
+            "value": "\nregisterMainClientComponent(\"local.main.ui.menu-link-item\", () => MenuLinkItem);\n",
+            "position": "bottom",
+            "reason": "Bind app-owned shell menu link-item token into local main client provider registry.",
+            "category": "shell-web",
+            "id": "shell-web-main-client-provider-menu-link-item-register"
+          },
+          "packages/main/src/client/providers/MainClientProvider.js::shell-web-main-client-provider-surface-aware-menu-link-item-register": {
+            "file": "packages/main/src/client/providers/MainClientProvider.js",
+            "op": "append-text",
+            "value": "\nregisterMainClientComponent(\"local.main.ui.surface-aware-menu-link-item\", () => SurfaceAwareMenuLinkItem);\n",
+            "position": "bottom",
+            "reason": "Bind app-owned shell surface-aware menu link-item token into local main client provider registry.",
+            "category": "shell-web",
+            "id": "shell-web-main-client-provider-surface-aware-menu-link-item-register"
+          },
+          "packages/main/src/client/providers/MainClientProvider.js::shell-web-main-client-provider-tab-link-item-register": {
+            "file": "packages/main/src/client/providers/MainClientProvider.js",
+            "op": "append-text",
+            "value": "\nregisterMainClientComponent(\"local.main.ui.tab-link-item\", () => TabLinkItem);\n",
+            "position": "bottom",
+            "reason": "Bind app-owned shell tab link-item token into local main client provider registry.",
+            "category": "shell-web",
+            "id": "shell-web-main-client-provider-tab-link-item-register"
+          }
+        },
+        "vite": {},
+        "files": [
+          {
+            "path": "src/App.vue",
+            "hash": "e8ad49df01c665c6453d783ea3b67deda05473870fd29faa039e9a38e28a7f2c",
+            "hadPrevious": true,
+            "previousContentBase64": "PHRlbXBsYXRlPgogIDx2LWFwcD4KICAgIDx2LW1haW4+CiAgICAgIDx2LWNvbnRhaW5lciBjbGFzcz0icHktMTAgcHktbWQtMTQiPgogICAgICAgIDx2LXJvdyBqdXN0aWZ5PSJjZW50ZXIiPgogICAgICAgICAgPHYtY29sIGNvbHM9IjEyIiBzbT0iMTEiIG1kPSIxMCIgbGc9IjgiIHhsPSI3Ij4KICAgICAgICAgICAgPFJvdXRlclZpZXcgLz4KICAgICAgICAgIDwvdi1jb2w+CiAgICAgICAgPC92LXJvdz4KICAgICAgPC92LWNvbnRhaW5lcj4KICAgIDwvdi1tYWluPgogIDwvdi1hcHA+CjwvdGVtcGxhdGU+Cg==",
+            "preserveOnRemove": false,
+            "reason": "Install full-width shell app root with shell-web error host and edge-to-edge layout.",
+            "category": "shell-web",
+            "id": "shell-web-app-root"
+          },
+          {
+            "path": "src/components/ShellLayout.vue",
+            "hash": "0c2c3b5439890e0822dab32b0a740927b7612df1510efe2254cb20d90fd7312c",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install app-owned shell layout component so apps can customize structure and slots.",
+            "category": "shell-web",
+            "id": "shell-web-component-shell-layout"
+          },
+          {
+            "path": "src/components/menus/MenuLinkItem.vue",
+            "hash": "91460689ede313da18352c5fd67f99f198433198906b276586c7f60742f042a1",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install app-owned shell menu link-item scaffold for local placement customization.",
+            "category": "shell-web",
+            "id": "shell-web-component-menu-link-item"
+          },
+          {
+            "path": "src/components/menus/SurfaceAwareMenuLinkItem.vue",
+            "hash": "63ad9112bf096974a6b268e2c719e9d5522fde179350f56dc640f8902c0e914e",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install app-owned surface-aware shell menu link-item scaffold for local placement customization.",
+            "category": "shell-web",
+            "id": "shell-web-component-surface-aware-menu-link-item"
+          },
+          {
+            "path": "src/components/menus/TabLinkItem.vue",
+            "hash": "6fc8405ca0e19516ce762e392733fd39e7c2af85d8483193b4ee52caac76f1f4",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install app-owned shell tab link-item scaffold for local placement customization.",
+            "category": "shell-web",
+            "id": "shell-web-component-tab-link-item"
+          },
+          {
+            "path": "src/error.js",
+            "hash": "dd7e2f4e32b83d1227135a0f224bb2c46854fe7fd9714c7cc56cf94f2f1eb55b",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install app-owned error runtime policy and presenter config scaffold.",
+            "category": "shell-web",
+            "id": "shell-web-error-config"
+          },
+          {
+            "path": "src/placement.js",
+            "hash": "39ef1011cc96c94e8b1778a199b2222bed9887b066331918633524515ca8b909",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install app-owned placement registry scaffold used by shell-web placement runtime.",
+            "category": "shell-web",
+            "id": "shell-web-placement-registry"
+          },
+          {
+            "path": "src/placementTopology.js",
+            "hash": "3e8a515abc359c61f28061c1c3d3df8b810ddc50b4a0c805c093394cc7693ffd",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install app-owned semantic placement topology used by shell-web placement runtime.",
+            "category": "shell-web",
+            "id": "shell-web-placement-topology"
+          },
+          {
+            "path": "src/pages/home.vue",
+            "hash": "52e99863be5b81fa9e5813bb10e912b4439446ebdcc5c543e46f223558b355cc",
+            "hadPrevious": true,
+            "previousContentBase64": "PHJvdXRlIGxhbmc9Impzb24iPgp7CiAgIm1ldGEiOiB7CiAgICAianNraXQiOiB7CiAgICAgICJzdXJmYWNlIjogImhvbWUiCiAgICB9CiAgfQp9Cjwvcm91dGU+Cgo8dGVtcGxhdGU+CiAgPFJvdXRlclZpZXcgLz4KPC90ZW1wbGF0ZT4K",
+            "preserveOnRemove": false,
+            "reason": "Install shell-driven home wrapper page.",
+            "category": "shell-web",
+            "id": "shell-web-page-home-wrapper"
+          },
+          {
+            "path": "src/pages/home/index.vue",
+            "hash": "3aff6e5d0430679bb4314af0920724b987e29ba487d5d93eb2a51aa79275f103",
+            "hadPrevious": true,
+            "previousContentBase64": "PHRlbXBsYXRlPgogIDxzZWN0aW9uIGNsYXNzPSJnZW5lcmF0ZWQtdWktc2NyZWVuIGdlbmVyYXRlZC11aS1zY3JlZW4tLWFwcCBob21lLXN0YXJ0LXNjcmVlbiBkLWZsZXggZmxleC1jb2x1bW4gZ2EtNCI+CiAgICA8aGVhZGVyPgogICAgICA8cCBjbGFzcz0idGV4dC1vdmVybGluZSB0ZXh0LW1lZGl1bS1lbXBoYXNpcyBtYi0xIj5Ib21lPC9wPgogICAgICA8aDEgY2xhc3M9ImhvbWUtc3RhcnQtc2NyZWVuX190aXRsZSI+SG9tZSBiYXNlPC9oMT4KICAgICAgPHAgY2xhc3M9InRleHQtYm9keS0yIHRleHQtbWVkaXVtLWVtcGhhc2lzIG1iLTAiPgogICAgICAgIFRoZSBhcHAgcnVudGltZSBpcyBvbmxpbmUgYW5kIHJlYWR5IGZvciB0aGUgZmlyc3QgcmVhbCB3b3JrZmxvdy4KICAgICAgPC9wPgogICAgPC9oZWFkZXI+CgogICAgPHYtc2hlZXQgcm91bmRlZD0ibGciIGJvcmRlciBjbGFzcz0iaG9tZS1zdGFydC1zY3JlZW5fX3BhbmVsIj4KICAgICAgPGgyIGNsYXNzPSJ0ZXh0LWg2IG1iLTIiPk5vIGFjdGl2aXR5IHlldDwvaDI+CiAgICAgIDxwIGNsYXNzPSJ0ZXh0LWJvZHktMiB0ZXh0LW1lZGl1bS1lbXBoYXNpcyBtYi0wIj4KICAgICAgICBSZWNlbnQgd29yaywgc2F2ZWQgcmVjb3JkcywgYW5kIG5leHQgYWN0aW9ucyB3aWxsIGFwcGVhciBoZXJlIG9uY2UgdGhpcyBhcHAgaGFzIGRhdGEuCiAgICAgIDwvcD4KICAgIDwvdi1zaGVldD4KICA8L3NlY3Rpb24+CjwvdGVtcGxhdGU+Cgo8c3R5bGUgc2NvcGVkPgouZ2VuZXJhdGVkLXVpLXNjcmVlbiB7CiAgLS1nZW5lcmF0ZWQtdWktc2NyZWVuLXRpdGxlLXNpemU6IGNsYW1wKDEuNXJlbSwgM3Z3LCAyLjVyZW0pOwogIC0tZ2VuZXJhdGVkLXVpLXNjcmVlbi1wYW5lbC1wYWRkaW5nOiAxcmVtOwp9CgouaG9tZS1zdGFydC1zY3JlZW4gewogIG1hcmdpbi1pbmxpbmU6IGF1dG87CiAgbWF4LXdpZHRoOiA0OHJlbTsKfQoKLmhvbWUtc3RhcnQtc2NyZWVuX190aXRsZSB7CiAgZm9udC1zaXplOiB2YXIoLS1nZW5lcmF0ZWQtdWktc2NyZWVuLXRpdGxlLXNpemUpOwogIGZvbnQtd2VpZ2h0OiA3MDA7CiAgbGV0dGVyLXNwYWNpbmc6IC0wLjAzZW07CiAgbGluZS1oZWlnaHQ6IDEuMDg7CiAgbWFyZ2luOiAwIDAgMC40NXJlbTsKfQoKLmhvbWUtc3RhcnQtc2NyZWVuX19wYW5lbCB7CiAgcGFkZGluZzogdmFyKC0tZ2VuZXJhdGVkLXVpLXNjcmVlbi1wYW5lbC1wYWRkaW5nKTsKfQo8L3N0eWxlPgo=",
+            "preserveOnRemove": false,
+            "reason": "Install shell-driven home surface starter page.",
+            "category": "shell-web",
+            "id": "shell-web-page-home"
+          },
+          {
+            "path": "src/pages/home/settings.vue",
+            "hash": "ebf4f694e3b52bf8f899f78f8211c3350fc48ba3f822d2b68406724e523a7e2a",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install shell-driven home settings shell route with section navigation.",
+            "category": "shell-web",
+            "id": "shell-web-page-home-settings-shell"
+          },
+          {
+            "path": "src/pages/home/settings/index.vue",
+            "hash": "e82040354f747a009887df7cf3f2f25911e42959f40d376ba254fa7e8fa69247",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install shell-driven home settings redirect so the starter settings shell lands on a real child page.",
+            "category": "shell-web",
+            "id": "shell-web-page-home-settings"
+          },
+          {
+            "path": "src/pages/home/settings/general/index.vue",
+            "hash": "ef2c566a83b707e5e69c9e821caf891f177ee344fa0c6ab7307b3031f618c3bf",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install shell-driven general settings child page with a tiny browser-local shell preference example.",
+            "category": "shell-web",
+            "id": "shell-web-page-home-settings-general"
+          },
+          {
+            "path": "tests/e2e/adaptive-shell.spec.ts",
+            "hash": "456cbb65ebd0b97052e4e171bf87081e89b293fe67b9250af2cf876969d4eafd",
+            "hadPrevious": false,
+            "previousContentBase64": "",
+            "preserveOnRemove": false,
+            "reason": "Install compact/medium/expanded Playwright smoke coverage for the adaptive shell.",
+            "category": "shell-web",
+            "id": "shell-web-test-adaptive-shell-smoke"
+          }
+        ],
+        "migrations": []
+      },
+      "options": {},
+      "installedAt": "1970-01-01T00:00:00.000Z",
+      "migrationSyncVersion": "0.1.85"
     }
   }
 }

package/templates/base-shell/package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "type": "module",
-  "description": "Minimal JSKIT base app (Fastify + Vue)",
+  "description": "JSKIT shell-web app (Fastify + Vue)",
   "engines": {
     "node": ">=20 <23"
   },
@@ -39,7 +39,9 @@
     "vue": "^3.5.13",
     "vue-router": "^5.0.4",
     "vuetify": "^4.0.0",
-    "@jskit-ai/http-runtime": "0.x"
+    "@jskit-ai/http-runtime": "0.x",
+    "@mdi/js": "^7.4.47",
+    "@jskit-ai/shell-web": "0.x"
   },
   "devDependencies": {
     "@jskit-ai/agent-docs": "0.x",

package/templates/base-shell/packages/main/src/client/providers/MainClientProvider.js

@@ -1,3 +1,7 @@
+import MenuLinkItem from "/src/components/menus/MenuLinkItem.vue";
+import SurfaceAwareMenuLinkItem from "/src/components/menus/SurfaceAwareMenuLinkItem.vue";
+import TabLinkItem from "/src/components/menus/TabLinkItem.vue";
+
 const mainClientComponents = [];
 
 function registerMainClientComponent(token, resolveComponent) {
@@ -18,3 +22,7 @@ export {
   MainClientProvider,
   registerMainClientComponent
 };
+
+registerMainClientComponent("local.main.ui.menu-link-item", () => MenuLinkItem);
+registerMainClientComponent("local.main.ui.surface-aware-menu-link-item", () => SurfaceAwareMenuLinkItem);
+registerMainClientComponent("local.main.ui.tab-link-item", () => TabLinkItem);

package/templates/base-shell/src/App.vue

@@ -1,13 +1,11 @@
+<script setup>
+import { RouterView } from "vue-router";
+import ShellErrorHost from "@jskit-ai/shell-web/client/components/ShellErrorHost";
+</script>
+
 <template>
   <v-app>
-    <v-main>
-      <v-container class="py-10 py-md-14">
-        <v-row justify="center">
-          <v-col cols="12" sm="11" md="10" lg="8" xl="7">
-            <RouterView />
-          </v-col>
-        </v-row>
-      </v-container>
-    </v-main>
+    <RouterView />
+    <ShellErrorHost />
   </v-app>
 </template>

package/templates/base-shell/src/components/ShellLayout.vue

@@ -0,0 +1,12 @@
+<script>
+import { h } from "vue";
+import PackageShellLayout from "@jskit-ai/shell-web/client/components/ShellLayout";
+
+export default {
+  name: "ShellLayout",
+  inheritAttrs: false,
+  setup(_, { attrs, slots }) {
+    return () => h(PackageShellLayout, attrs, slots);
+  }
+};
+</script>

package/templates/base-shell/src/components/menus/MenuLinkItem.vue

@@ -0,0 +1,30 @@
+<script setup>
+import ShellMenuLinkItem from "@jskit-ai/shell-web/client/components/ShellMenuLinkItem";
+
+const props = defineProps({
+  label: {
+    type: String,
+    default: ""
+  },
+  to: {
+    type: String,
+    default: ""
+  },
+  icon: {
+    type: String,
+    default: ""
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  exact: {
+    type: Boolean,
+    default: false
+  }
+});
+</script>
+
+<template>
+  <ShellMenuLinkItem v-bind="props" />
+</template>

package/templates/base-shell/src/components/menus/SurfaceAwareMenuLinkItem.vue

@@ -0,0 +1,42 @@
+<script setup>
+import ShellSurfaceAwareMenuLinkItem from "@jskit-ai/shell-web/client/components/ShellSurfaceAwareMenuLinkItem";
+
+const props = defineProps({
+  label: {
+    type: String,
+    default: ""
+  },
+  to: {
+    type: String,
+    default: ""
+  },
+  icon: {
+    type: String,
+    default: ""
+  },
+  surface: {
+    type: String,
+    default: ""
+  },
+  scopedSuffix: {
+    type: String,
+    default: "/"
+  },
+  unscopedSuffix: {
+    type: String,
+    default: "/"
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  exact: {
+    type: Boolean,
+    default: false
+  }
+});
+</script>
+
+<template>
+  <ShellSurfaceAwareMenuLinkItem v-bind="props" />
+</template>

package/templates/base-shell/src/components/menus/TabLinkItem.vue

@@ -0,0 +1,42 @@
+<script setup>
+import ShellTabLinkItem from "@jskit-ai/shell-web/client/components/ShellTabLinkItem";
+
+const props = defineProps({
+  label: {
+    type: String,
+    default: ""
+  },
+  to: {
+    type: String,
+    default: ""
+  },
+  icon: {
+    type: String,
+    default: ""
+  },
+  surface: {
+    type: String,
+    default: ""
+  },
+  scopedSuffix: {
+    type: String,
+    default: "/"
+  },
+  unscopedSuffix: {
+    type: String,
+    default: "/"
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  exact: {
+    type: Boolean,
+    default: false
+  }
+});
+</script>
+
+<template>
+  <ShellTabLinkItem v-bind="props" />
+</template>

package/templates/base-shell/src/error.js

@@ -0,0 +1,19 @@
+import { createDefaultErrorPolicy } from "@jskit-ai/shell-web/client/error";
+
+/**
+ * App-owned error handling contract.
+ * - intent chooses default presentation: resource-load, action-feedback, app-recoverable, blocking.
+ * - policy(event, ctx): decide channel + presenter + message.
+ * - defaultPresenterId: used when policy does not set presenterId.
+ * - presenters: optional custom presenters registered at boot.
+ */
+export default Object.freeze({
+  defaultPresenterId: "material.snackbar",
+  policy: createDefaultErrorPolicy({
+    resourceLoadChannel: "silent",
+    actionFeedbackChannel: "snackbar",
+    appRecoverableChannel: "banner",
+    blockingChannel: "dialog"
+  }),
+  presenters: []
+});

package/templates/base-shell/src/pages/home/index.vue

@@ -1,42 +1,106 @@
+<script setup>
+import { computed } from "vue";
+import { useQuery } from "@tanstack/vue-query";
+
+const healthQuery = useQuery({
+  queryKey: ["shell-web", "health"],
+  queryFn: async () => {
+    const response = await fetch("/api/health");
+    if (!response.ok) {
+      throw new Error("Health request failed.");
+    }
+    return response.json();
+  },
+  refetchOnWindowFocus: false
+});
+
+const health = computed(() => {
+  if (healthQuery.isPending.value || healthQuery.isFetching.value) {
+    return "loading...";
+  }
+
+  if (healthQuery.error.value) {
+    return "unreachable";
+  }
+
+  return healthQuery.data.value?.ok ? "ok" : "unhealthy";
+});
+</script>
+
 <template>
-  <section class="generated-ui-screen generated-ui-screen--app home-start-screen d-flex flex-column ga-4">
-    <header>
-      <p class="text-overline text-medium-emphasis mb-1">Home</p>
-      <h1 class="home-start-screen__title">Home base</h1>
-      <p class="text-body-2 text-medium-emphasis mb-0">
-        The app runtime is online and ready for the first real workflow.
-      </p>
+  <section class="generated-ui-screen generated-ui-screen--app home-surface-screen d-flex flex-column ga-4">
+    <header class="home-surface-screen__header">
+      <div>
+        <p class="text-overline text-medium-emphasis mb-1">Home</p>
+        <h1 class="home-surface-screen__title">Ready</h1>
+        <p class="text-body-2 text-medium-emphasis mb-0">
+          Core services are available.
+        </p>
+      </div>
+      <v-btn color="primary" variant="flat" to="/home/settings/general">Settings</v-btn>
     </header>
 
-    <v-sheet rounded="lg" border class="home-start-screen__panel">
-      <h2 class="text-h6 mb-2">No activity yet</h2>
-      <p class="text-body-2 text-medium-emphasis mb-0">
-        Recent work, saved records, and next actions will appear here once this app has data.
-      </p>
+    <v-sheet rounded="lg" border class="home-surface-screen__panel">
+      <div class="home-surface-screen__status">
+        <span class="text-caption text-medium-emphasis">Service health</span>
+        <strong>{{ health }}</strong>
+      </div>
+      <v-divider vertical class="d-none d-sm-block" />
+      <div class="home-surface-screen__status">
+        <span class="text-caption text-medium-emphasis">Route</span>
+        <strong>/home</strong>
+      </div>
     </v-sheet>
   </section>
 </template>
 
 <style scoped>
 .generated-ui-screen {
-  --generated-ui-screen-title-size: clamp(1.5rem, 3vw, 2.5rem);
+  --generated-ui-screen-title-size: 2rem;
   --generated-ui-screen-panel-padding: 1rem;
 }
 
-.home-start-screen {
-  margin-inline: auto;
-  max-width: 48rem;
+.home-surface-screen__header {
+  align-items: flex-start;
+  display: flex;
+  gap: 1rem;
+  justify-content: space-between;
 }
 
-.home-start-screen__title {
+.home-surface-screen__title {
   font-size: var(--generated-ui-screen-title-size);
   font-weight: 700;
-  letter-spacing: -0.03em;
-  line-height: 1.08;
-  margin: 0 0 0.45rem;
+  letter-spacing: 0;
+  line-height: 1.1;
+  margin: 0 0 0.4rem;
 }
 
-.home-start-screen__panel {
+.home-surface-screen__panel {
+  align-items: stretch;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 1rem;
   padding: var(--generated-ui-screen-panel-padding);
 }
+
+.home-surface-screen__status {
+  display: grid;
+  gap: 0.15rem;
+  min-width: 9rem;
+}
+
+@media (max-width: 640px) {
+  .generated-ui-screen {
+    --generated-ui-screen-title-size: 1.5rem;
+  }
+
+  .home-surface-screen__header {
+    flex-direction: column;
+  }
+
+  .home-surface-screen__header :deep(.v-btn) {
+    min-height: 48px;
+    width: 100%;
+  }
+}
 </style>

package/templates/base-shell/src/pages/home/settings/general/index.vue

@@ -0,0 +1,40 @@
+<script setup>
+import { computed } from "vue";
+import { useShellLayoutState } from "@jskit-ai/shell-web/client/composables/useShellLayoutState";
+
+const { drawerDefaultOpen, setDrawerDefaultOpen } = useShellLayoutState();
+
+const drawerDefaultOpenModel = computed({
+  get() {
+    return drawerDefaultOpen.value;
+  },
+  set(value) {
+    setDrawerDefaultOpen(Boolean(value));
+  }
+});
+</script>
+
+<template>
+  <section class="generated-ui-screen generated-ui-screen--settings settings-general-screen d-flex flex-column ga-4">
+    <div>
+      <h2 class="text-h6 mb-2">Navigation</h2>
+      <p class="text-body-2 text-medium-emphasis mb-0">
+        Choose the default behavior for wider screens. Phone layouts keep primary navigation in the bottom bar.
+      </p>
+    </div>
+
+    <v-switch
+      v-model="drawerDefaultOpenModel"
+      color="primary"
+      inset
+      hide-details="auto"
+      label="Open drawer by default on wider screens"
+    />
+  </section>
+</template>
+
+<style scoped>
+.settings-general-screen :deep(.v-switch) {
+  min-height: 48px;
+}
+</style>

package/templates/base-shell/src/pages/home/settings/index.vue

@@ -0,0 +1,7 @@
+<script setup>
+import { redirectToChild } from "@jskit-ai/kernel/client/pageRedirects";
+
+definePage({
+  redirect: redirectToChild("general")
+});
+</script>