fix(#243): claude on aws bedrock (#241)

Co-authored-by: Dax Raad <d@ironbay.co>

README.md

@@ -7,18 +7,17 @@
     </picture>
   </a>
 </p>
+<p align="center">AI coding agent, built for the terminal.</p>
 <p align="center">
   <a href="https://opencode.ai/docs"><img alt="View docs" src="https://img.shields.io/badge/view-docs-blue?style=flat-square" /></a>
   <a href="https://www.npmjs.com/package/opencode-ai"><img alt="npm" src="https://img.shields.io/npm/v/opencode-ai?style=flat-square" /></a>
   <a href="https://github.com/sst/opencode/actions/workflows/publish.yml"><img alt="Build status" src="https://img.shields.io/github/actions/workflow/status/sst/opencode/publish.yml?style=flat-square&branch=dev" /></a>
 </p>
 
----
-
-AI coding agent, built for the terminal.
-
 [![opencode Terminal UI](packages/web/src/assets/themes/opencode.png)](https://opencode.ai)
 
+---
+
 ### Installation
 
 ```bash

bun.lock

@@ -43,8 +43,10 @@
         "yargs": "18.0.0",
         "zod": "catalog:",
         "zod-openapi": "4.2.4",
+        "zod-validation-error": "3.5.2",
       },
       "devDependencies": {
+        "@ai-sdk/amazon-bedrock": "2.2.10",
         "@ai-sdk/anthropic": "1.2.12",
         "@tsconfig/bun": "1.0.7",
         "@types/bun": "latest",
@@ -101,6 +103,8 @@
     "zod": "3.24.2",
   },
   "packages": {
+    "@ai-sdk/amazon-bedrock": ["@ai-sdk/amazon-bedrock@2.2.10", "", { "dependencies": { "@ai-sdk/provider": "1.1.3", "@ai-sdk/provider-utils": "2.2.8", "@smithy/eventstream-codec": "^4.0.1", "@smithy/util-utf8": "^4.0.0", "aws4fetch": "^1.0.20" }, "peerDependencies": { "zod": "^3.0.0" } }, "sha512-icLGO7Q0NinnHIPgT+y1QjHVwH4HwV+brWbvM+FfCG2Afpa89PyKa3Ret91kGjZpBgM/xnj1B7K5eM+rRlsXQA=="],
+
     "@ai-sdk/anthropic": ["@ai-sdk/anthropic@1.2.12", "", { "dependencies": { "@ai-sdk/provider": "1.1.3", "@ai-sdk/provider-utils": "2.2.8" }, "peerDependencies": { "zod": "^3.0.0" } }, "sha512-YSzjlko7JvuiyQFmI9RN1tNZdEiZxc+6xld/0tq/VkJaHpEzGAb1yiNxxvmYVcjvfu/PcvCxAAYXmTYQQ63IHQ=="],
 
     "@ai-sdk/provider": ["@ai-sdk/provider@1.1.3", "", { "dependencies": { "json-schema": "^0.4.0" } }, "sha512-qZMxYJ0qqX/RfnuIaab+zp8UAeJn/ygXXAffR5I4N0n1IrvA6qBsjc8hXLmBiMV2zoXlifkacF7sEFnYnjBcqg=="],
@@ -137,6 +141,12 @@
 
     "@astrojs/underscore-redirects": ["@astrojs/underscore-redirects@0.6.1", "", {}, "sha512-4bMLrs2KW+8/vHEE5Ffv2HbxCbbgXO+2N6MpoCsMXUlUoi7pgEEx8kbkzMXJ2dZtWF3gvwm9lvgjnFeanC2LGg=="],
 
+    "@aws-crypto/crc32": ["@aws-crypto/crc32@5.2.0", "", { "dependencies": { "@aws-crypto/util": "^5.2.0", "@aws-sdk/types": "^3.222.0", "tslib": "^2.6.2" } }, "sha512-nLbCWqQNgUiwwtFsen1AdzAtvuLRsQS8rYgMuxCrdKf9kOssamGLuPwyTY9wyYblNr9+1XM8v6zoDTPPSIeANg=="],
+
+    "@aws-crypto/util": ["@aws-crypto/util@5.2.0", "", { "dependencies": { "@aws-sdk/types": "^3.222.0", "@smithy/util-utf8": "^2.0.0", "tslib": "^2.6.2" } }, "sha512-4RkU9EsI6ZpBve5fseQlGNUWKMa1RLPQ1dnjnQoe07ldfIzcsGb5hC5W0Dm7u423KWzawlrpbjXBrXCEv9zazQ=="],
+
+    "@aws-sdk/types": ["@aws-sdk/types@3.821.0", "", { "dependencies": { "@smithy/types": "^4.3.1", "tslib": "^2.6.2" } }, "sha512-Znroqdai1a90TlxGaJ+FK1lwC0fHpo97Xjsp5UKGR5JODYm7f9+/fF17ebO1KdoBr/Rm0UIFiF5VmI8ts9F1eA=="],
+
     "@babel/code-frame": ["@babel/code-frame@7.27.1", "", { "dependencies": { "@babel/helper-validator-identifier": "^7.27.1", "js-tokens": "^4.0.0", "picocolors": "^1.1.1" } }, "sha512-cjQ7ZlQ0Mv3b47hABuTevyTuYN4i+loJKGeV9flcCgIK37cCXRh+L1bd3iBHlynerhQ7BhCkn2BPbQUL+rGqFg=="],
 
     "@babel/compat-data": ["@babel/compat-data@7.27.3", "", {}, "sha512-V42wFfx1ymFte+ecf6iXghnnP8kWTO+ZLXIyZq+1LAXHHvTZdVxicn4yiVYdYMGaCO3tmqub11AorKkv+iodqw=="],
@@ -417,6 +427,18 @@
 
     "@shikijs/vscode-textmate": ["@shikijs/vscode-textmate@10.0.2", "", {}, "sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg=="],
 
+    "@smithy/eventstream-codec": ["@smithy/eventstream-codec@4.0.4", "", { "dependencies": { "@aws-crypto/crc32": "5.2.0", "@smithy/types": "^4.3.1", "@smithy/util-hex-encoding": "^4.0.0", "tslib": "^2.6.2" } }, "sha512-7XoWfZqWb/QoR/rAU4VSi0mWnO2vu9/ltS6JZ5ZSZv0eovLVfDfu0/AX4ub33RsJTOth3TiFWSHS5YdztvFnig=="],
+
+    "@smithy/is-array-buffer": ["@smithy/is-array-buffer@4.0.0", "", { "dependencies": { "tslib": "^2.6.2" } }, "sha512-saYhF8ZZNoJDTvJBEWgeBccCg+yvp1CX+ed12yORU3NilJScfc6gfch2oVb4QgxZrGUx3/ZJlb+c/dJbyupxlw=="],
+
+    "@smithy/types": ["@smithy/types@4.3.1", "", { "dependencies": { "tslib": "^2.6.2" } }, "sha512-UqKOQBL2x6+HWl3P+3QqFD4ncKq0I8Nuz9QItGv5WuKuMHuuwlhvqcZCoXGfc+P1QmfJE7VieykoYYmrOoFJxA=="],
+
+    "@smithy/util-buffer-from": ["@smithy/util-buffer-from@4.0.0", "", { "dependencies": { "@smithy/is-array-buffer": "^4.0.0", "tslib": "^2.6.2" } }, "sha512-9TOQ7781sZvddgO8nxueKi3+yGvkY35kotA0Y6BWRajAv8jjmigQ1sBwz0UX47pQMYXJPahSKEKYFgt+rXdcug=="],
+
+    "@smithy/util-hex-encoding": ["@smithy/util-hex-encoding@4.0.0", "", { "dependencies": { "tslib": "^2.6.2" } }, "sha512-Yk5mLhHtfIgW2W2WQZWSg5kuMZCVbvhFmC7rV4IO2QqnZdbEFPmQnCcGMAX2z/8Qj3B9hYYNjZOhWym+RwhePw=="],
+
+    "@smithy/util-utf8": ["@smithy/util-utf8@4.0.0", "", { "dependencies": { "@smithy/util-buffer-from": "^4.0.0", "tslib": "^2.6.2" } }, "sha512-b+zebfKCfRdgNJDknHCob3O7FpeYQN6ZG6YLExMcasDHsCXlsXCEuiPZeLnJLpwa5dvPetGlnGCiMHuLwGvFow=="],
+
     "@standard-schema/spec": ["@standard-schema/spec@1.0.0", "", {}, "sha512-m2bOd0f2RT9k8QJx1JN85cZYyH1RqFBdlwtkSlf4tBDYLCiiZnv1fIIwacK6cqwXavOydf0NPToMQgpKq+dVlA=="],
 
     "@swc/helpers": ["@swc/helpers@0.5.17", "", { "dependencies": { "tslib": "^2.8.0" } }, "sha512-5IKx/Y13RsYd+sauPb2x+U/xZikHjolzfuDgTAl/Tdf3Q8rslRvC19NKDLgAJQ6wsqADk10ntlv08nPFw/gO/A=="],
@@ -1655,12 +1677,24 @@
 
     "zod-to-ts": ["zod-to-ts@1.2.0", "", { "peerDependencies": { "typescript": "^4.9.4 || ^5.0.2", "zod": "^3" } }, "sha512-x30XE43V+InwGpvTySRNz9kB7qFU8DlyEy7BsSTCHPH1R0QasMmHWZDCzYm6bVXtj/9NNJAZF3jW8rzFvH5OFA=="],
 
+    "zod-validation-error": ["zod-validation-error@3.5.2", "", { "peerDependencies": { "zod": "^3.25.0" } }, "sha512-mdi7YOLtram5dzJ5aDtm1AG9+mxRma1iaMrZdYIpFO7epdKBUwLHIxTF8CPDeCQ828zAXYtizrKlEJAtzgfgrw=="],
+
     "zwitch": ["zwitch@2.0.4", "", {}, "sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A=="],
 
+    "@ai-sdk/amazon-bedrock/aws4fetch": ["aws4fetch@1.0.20", "", {}, "sha512-/djoAN709iY65ETD6LKCtyyEI04XIBP5xVvfmNxsEP0uJB5tyaGBztSryRr4HqMStr9R06PisQE7m9zDTXKu6g=="],
+
     "@ampproject/remapping/@jridgewell/trace-mapping": ["@jridgewell/trace-mapping@0.3.25", "", { "dependencies": { "@jridgewell/resolve-uri": "^3.1.0", "@jridgewell/sourcemap-codec": "^1.4.14" } }, "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ=="],
 
     "@astrojs/mdx/@astrojs/markdown-remark": ["@astrojs/markdown-remark@6.3.2", "", { "dependencies": { "@astrojs/internal-helpers": "0.6.1", "@astrojs/prism": "3.3.0", "github-slugger": "^2.0.0", "hast-util-from-html": "^2.0.3", "hast-util-to-text": "^4.0.2", "import-meta-resolve": "^4.1.0", "js-yaml": "^4.1.0", "mdast-util-definitions": "^6.0.0", "rehype-raw": "^7.0.0", "rehype-stringify": "^10.0.1", "remark-gfm": "^4.0.1", "remark-parse": "^11.0.0", "remark-rehype": "^11.1.2", "remark-smartypants": "^3.0.2", "shiki": "^3.2.1", "smol-toml": "^1.3.1", "unified": "^11.0.5", "unist-util-remove-position": "^5.0.0", "unist-util-visit": "^5.0.0", "unist-util-visit-parents": "^6.0.1", "vfile": "^6.0.3" } }, "sha512-bO35JbWpVvyKRl7cmSJD822e8YA8ThR/YbUsciWNA7yTcqpIAL2hJDToWP5KcZBWxGT6IOdOkHSXARSNZc4l/Q=="],
 
+    "@aws-crypto/crc32/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
+
+    "@aws-crypto/util/@smithy/util-utf8": ["@smithy/util-utf8@2.3.0", "", { "dependencies": { "@smithy/util-buffer-from": "^2.2.0", "tslib": "^2.6.2" } }, "sha512-R8Rdn8Hy72KKcebgLiv8jQcQkXoLMOGGv5uI1/k0l+snqkOzQ1R0ChUBCxWMlBsFMekWjq0wRudIweFs7sKT5A=="],
+
+    "@aws-crypto/util/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
+
+    "@aws-sdk/types/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
+
     "@babel/core/semver": ["semver@6.3.1", "", { "bin": { "semver": "bin/semver.js" } }, "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA=="],
 
     "@babel/generator/@jridgewell/trace-mapping": ["@jridgewell/trace-mapping@0.3.25", "", { "dependencies": { "@jridgewell/resolve-uri": "^3.1.0", "@jridgewell/sourcemap-codec": "^1.4.14" } }, "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ=="],
@@ -1681,6 +1715,18 @@
 
     "@rollup/pluginutils/estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
 
+    "@smithy/eventstream-codec/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
+
+    "@smithy/is-array-buffer/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
+
+    "@smithy/types/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
+
+    "@smithy/util-buffer-from/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
+
+    "@smithy/util-hex-encoding/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
+
+    "@smithy/util-utf8/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
+
     "@swc/helpers/tslib": ["tslib@2.8.1", "", {}, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
 
     "ansi-align/string-width": ["string-width@4.2.3", "", { "dependencies": { "emoji-regex": "^8.0.0", "is-fullwidth-code-point": "^3.0.0", "strip-ansi": "^6.0.1" } }, "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g=="],
@@ -1751,6 +1797,8 @@
 
     "@astrojs/mdx/@astrojs/markdown-remark/@astrojs/prism": ["@astrojs/prism@3.3.0", "", { "dependencies": { "prismjs": "^1.30.0" } }, "sha512-q8VwfU/fDZNoDOf+r7jUnMC2//H2l0TuQ6FkGJL8vD8nw/q5KiL3DS1KKBI3QhI9UQhpJ5dc7AtqfbXWuOgLCQ=="],
 
+    "@aws-crypto/util/@smithy/util-utf8/@smithy/util-buffer-from": ["@smithy/util-buffer-from@2.2.0", "", { "dependencies": { "@smithy/is-array-buffer": "^2.2.0", "tslib": "^2.6.2" } }, "sha512-IJdWBbTcMQ6DA0gdNhh/BwrLkDR+ADW5Kr1aZmd4k3DIF6ezMV4R2NIAmT08wQJ3yUK82thHWmC/TnK/wpMMIA=="],
+
     "@babel/helper-compilation-targets/lru-cache/yallist": ["yallist@3.1.1", "", {}, "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g=="],
 
     "ansi-align/string-width/emoji-regex": ["emoji-regex@8.0.0", "", {}, "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="],
@@ -1817,6 +1865,8 @@
 
     "wrangler/esbuild/@esbuild/win32-x64": ["@esbuild/win32-x64@0.25.4", "", { "os": "win32", "cpu": "x64" }, "sha512-nOT2vZNw6hJ+z43oP1SPea/G/6AbN6X+bGNhNuq8NtRHy4wsMhw765IKLNmnjek7GvjWBYQ8Q5VBoYTFg9y1UQ=="],
 
+    "@aws-crypto/util/@smithy/util-utf8/@smithy/util-buffer-from/@smithy/is-array-buffer": ["@smithy/is-array-buffer@2.2.0", "", { "dependencies": { "tslib": "^2.6.2" } }, "sha512-GGP3O9QFD24uGeAXYUjwSTXARoqpZykHadOmA8G5vfJPK0/DC67qa//0qvqrJzL1xc8WQWX7/yc7fwudjPHPhA=="],
+
     "ansi-align/string-width/strip-ansi/ansi-regex": ["ansi-regex@5.0.1", "", {}, "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="],
 
     "args/chalk/ansi-styles/color-convert": ["color-convert@1.9.3", "", { "dependencies": { "color-name": "1.1.3" } }, "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg=="],

infra/app.ts

@@ -23,9 +23,10 @@ export const api = new sst.cloudflare.Worker("Api", {
         },
       ])
       args.migrations = {
-        // oldTag: "v1",
-        // newTag: "v1",
-        newSqliteClasses: ["SyncServer"],
+        // Note: when releasing the next tag, make sure all stages use tag v2
+        oldTag: $app.stage === "production" ? "" : "v1",
+        newTag: $app.stage === "production" ? "" : "v1",
+        //newSqliteClasses: ["SyncServer"],
       }
     },
   },

opencode.json

@@ -1,5 +1,3 @@
 {
-  "$schema": "https://opencode.ai/config.json",
-  "keybinds": {},
-  "mcp": {}
+  "$schema": "https://opencode.ai/config.json"
 }

packages/opencode/package.json

@@ -12,13 +12,14 @@
     "./*": "./src/*.ts"
   },
   "devDependencies": {
+    "@ai-sdk/amazon-bedrock": "2.2.10",
+    "@ai-sdk/anthropic": "1.2.12",
     "@tsconfig/bun": "1.0.7",
     "@types/bun": "latest",
     "@types/turndown": "5.0.5",
     "@types/yargs": "17.0.33",
     "typescript": "catalog:",
-    "zod-to-json-schema": "3.24.5",
-    "@ai-sdk/anthropic": "1.2.12"
+    "zod-to-json-schema": "3.24.5"
   },
   "dependencies": {
     "@clack/prompts": "0.11.0",
@@ -42,6 +43,7 @@
     "xdg-basedir": "5.1.0",
     "yargs": "18.0.0",
     "zod": "catalog:",
-    "zod-openapi": "4.2.4"
+    "zod-openapi": "4.2.4",
+    "zod-validation-error": "3.5.2"
   }
 }

packages/opencode/src/auth/anthropic.ts

@@ -8,7 +8,7 @@ export namespace AuthAnthropic {
     const pkce = await generatePKCE()
     const url = new URL("https://claude.ai/oauth/authorize", import.meta.url)
     url.searchParams.set("code", "true")
-    url.searchParams.set("client_id", "9d1c250a-e61b-44d9-88ed-5944d1962f5e")
+    url.searchParams.set("client_id", CLIENT_ID)
     url.searchParams.set("response_type", "code")
     url.searchParams.set(
       "redirect_uri",
@@ -38,7 +38,7 @@ export namespace AuthAnthropic {
         code: splits[0],
         state: splits[1],
         grant_type: "authorization_code",
-        client_id: "9d1c250a-e61b-44d9-88ed-5944d1962f5e",
+        client_id: CLIENT_ID,
         redirect_uri: "https://console.anthropic.com/oauth/code/callback",
         code_verifier: verifier,
       }),

packages/opencode/src/cli/error.ts

@@ -0,0 +1,13 @@
+import { Config } from "../config/config"
+
+export function FormatError(input: unknown) {
+  if (Config.JsonError.isInstance(input))
+    return `Config file at ${input.data.path} is not valid JSON`
+  if (Config.InvalidError.isInstance(input))
+    return [
+      `Config file at ${input.data.path} is invalid`,
+      ...(input.data.issues?.map(
+        (issue) => "↳ " + issue.message + " " + issue.path.join("."),
+      ) ?? []),
+    ].join("\n")
+}

packages/opencode/src/config/config.ts

@@ -8,6 +8,7 @@ import { mergeDeep } from "remeda"
 import { Global } from "../global"
 import fs from "fs/promises"
 import { lazy } from "../util/lazy"
+import { NamedError } from "../util/error"
 
 export namespace Config {
   const log = Log.create({ service: "config" })
@@ -15,27 +16,9 @@ export namespace Config {
   export const state = App.state("config", async (app) => {
     let result = await global()
     for (const file of ["opencode.jsonc", "opencode.json"]) {
-      const [resolved] = await Filesystem.findUp(
-        file,
-        app.path.cwd,
-        app.path.root,
-      )
-      if (!resolved) continue
-      try {
-        result = mergeDeep(
-          result,
-          await import(resolved).then((mod) => Info.parse(mod.default)),
-        )
-        log.info("found", { path: resolved })
-        break
-      } catch (e) {
-        if (e instanceof z.ZodError) {
-          for (const issue of e.issues) {
-            log.info(issue.message)
-          }
-          throw e
-        }
-        continue
+      const found = await Filesystem.findUp(file, app.path.cwd, app.path.root)
+      for (const resolved of found.toReversed()) {
+        result = mergeDeep(result, await load(resolved))
       }
     }
     log.info("loaded", result)
@@ -45,9 +28,16 @@ export namespace Config {
   export const McpLocal = z
     .object({
       type: z.literal("local").describe("Type of MCP server connection"),
-      command: z.string().array().describe("Command and arguments to run the MCP server"),
-      environment: z.record(z.string(), z.string()).optional().describe("Environment variables to set when running the MCP server"),
+      command: z
+        .string()
+        .array()
+        .describe("Command and arguments to run the MCP server"),
+      environment: z
+        .record(z.string(), z.string())
+        .optional()
+        .describe("Environment variables to set when running the MCP server"),
     })
+    .strict()
     .openapi({
       ref: "Config.McpLocal",
     })
@@ -57,6 +47,7 @@ export namespace Config {
       type: z.literal("remote").describe("Type of MCP server connection"),
       url: z.string().describe("URL of the remote MCP server"),
     })
+    .strict()
     .openapi({
       ref: "Config.McpRemote",
     })
@@ -66,41 +57,84 @@ export namespace Config {
 
   export const Keybinds = z
     .object({
-      leader: z.string().optional().describe("Leader key for keybind combinations"),
+      leader: z
+        .string()
+        .optional()
+        .describe("Leader key for keybind combinations"),
       help: z.string().optional().describe("Show help dialog"),
       editor_open: z.string().optional().describe("Open external editor"),
       session_new: z.string().optional().describe("Create a new session"),
       session_list: z.string().optional().describe("List all sessions"),
       session_share: z.string().optional().describe("Share current session"),
-      session_interrupt: z.string().optional().describe("Interrupt current session"),
-      session_compact: z.string().optional().describe("Toggle compact mode for session"),
+      session_interrupt: z
+        .string()
+        .optional()
+        .describe("Interrupt current session"),
+      session_compact: z
+        .string()
+        .optional()
+        .describe("Toggle compact mode for session"),
       tool_details: z.string().optional().describe("Show tool details"),
       model_list: z.string().optional().describe("List available models"),
       theme_list: z.string().optional().describe("List available themes"),
-      project_init: z.string().optional().describe("Initialize project configuration"),
+      project_init: z
+        .string()
+        .optional()
+        .describe("Initialize project configuration"),
       input_clear: z.string().optional().describe("Clear input field"),
       input_paste: z.string().optional().describe("Paste from clipboard"),
       input_submit: z.string().optional().describe("Submit input"),
       input_newline: z.string().optional().describe("Insert newline in input"),
-      history_previous: z.string().optional().describe("Navigate to previous history item"),
-      history_next: z.string().optional().describe("Navigate to next history item"),
-      messages_page_up: z.string().optional().describe("Scroll messages up by one page"),
-      messages_page_down: z.string().optional().describe("Scroll messages down by one page"),
-      messages_half_page_up: z.string().optional().describe("Scroll messages up by half page"),
-      messages_half_page_down: z.string().optional().describe("Scroll messages down by half page"),
-      messages_previous: z.string().optional().describe("Navigate to previous message"),
+      history_previous: z
+        .string()
+        .optional()
+        .describe("Navigate to previous history item"),
+      history_next: z
+        .string()
+        .optional()
+        .describe("Navigate to next history item"),
+      messages_page_up: z
+        .string()
+        .optional()
+        .describe("Scroll messages up by one page"),
+      messages_page_down: z
+        .string()
+        .optional()
+        .describe("Scroll messages down by one page"),
+      messages_half_page_up: z
+        .string()
+        .optional()
+        .describe("Scroll messages up by half page"),
+      messages_half_page_down: z
+        .string()
+        .optional()
+        .describe("Scroll messages down by half page"),
+      messages_previous: z
+        .string()
+        .optional()
+        .describe("Navigate to previous message"),
       messages_next: z.string().optional().describe("Navigate to next message"),
-      messages_first: z.string().optional().describe("Navigate to first message"),
+      messages_first: z
+        .string()
+        .optional()
+        .describe("Navigate to first message"),
       messages_last: z.string().optional().describe("Navigate to last message"),
       app_exit: z.string().optional().describe("Exit the application"),
     })
+    .strict()
     .openapi({
       ref: "Config.Keybinds",
     })
   export const Info = z
     .object({
-      $schema: z.string().optional().describe("JSON schema reference for configuration validation"),
-      theme: z.string().optional().describe("Theme name to use for the interface"),
+      $schema: z
+        .string()
+        .optional()
+        .describe("JSON schema reference for configuration validation"),
+      theme: z
+        .string()
+        .optional()
+        .describe("Theme name to use for the interface"),
       keybinds: Keybinds.optional().describe("Custom keybind configurations"),
       autoshare: z
         .boolean()
@@ -129,8 +163,12 @@ export namespace Config {
         )
         .optional()
         .describe("Custom provider configurations and model overrides"),
-      mcp: z.record(z.string(), Mcp).optional().describe("MCP (Model Context Protocol) server configurations"),
+      mcp: z
+        .record(z.string(), Mcp)
+        .optional()
+        .describe("MCP (Model Context Protocol) server configurations"),
     })
+    .strict()
     .openapi({
       ref: "Config.Info",
     })
@@ -138,10 +176,7 @@ export namespace Config {
   export type Info = z.output<typeof Info>
 
   export const global = lazy(async () => {
-    let result = await Bun.file(path.join(Global.Path.config, "config.json"))
-      .json()
-      .then((mod) => Info.parse(mod))
-      .catch(() => ({}) as Info)
+    let result = await load(path.join(Global.Path.config, "config.json"))
 
     await import(path.join(Global.Path.config, "config"), {
       with: {
@@ -160,9 +195,38 @@ export namespace Config {
         await fs.unlink(path.join(Global.Path.config, "config"))
       })
       .catch(() => {})
-    return Info.parse(result)
+
+    return result
   })
 
+  async function load(path: string) {
+    const data = await Bun.file(path)
+      .json()
+      .catch((err) => {
+        if (err.code === "ENOENT") return {}
+        throw new JsonError({ path }, { cause: err })
+      })
+
+    const parsed = Info.safeParse(data)
+    if (parsed.success) return parsed.data
+    throw new InvalidError({ path, issues: parsed.error.issues })
+  }
+
+  export const JsonError = NamedError.create(
+    "ConfigJsonError",
+    z.object({
+      path: z.string(),
+    }),
+  )
+
+  export const InvalidError = NamedError.create(
+    "ConfigInvalidError",
+    z.object({
+      path: z.string(),
+      issues: z.custom<z.ZodIssue[]>().optional(),
+    }),
+  )
+
   export function get() {
     return state()
   }

packages/opencode/src/index.ts

@@ -18,6 +18,8 @@ import { UI } from "./cli/ui"
 import { Installation } from "./installation"
 import { Bus } from "./bus"
 import { Config } from "./config/config"
+import { NamedError } from "./util/error"
+import { FormatError } from "./cli/error"
 
 const cli = yargs(hideBin(process.argv))
   .scriptName("opencode")
@@ -84,21 +86,21 @@ const cli = yargs(hideBin(process.argv))
             },
           })
 
-            ; (async () => {
-              if (Installation.VERSION === "dev") return
-              if (Installation.isSnapshot()) return
-              const config = await Config.global()
-              if (config.autoupdate === false) return
-              const latest = await Installation.latest()
-              if (Installation.VERSION === latest) return
-              const method = await Installation.method()
-              if (method === "unknown") return
-              await Installation.upgrade(method, latest)
-                .then(() => {
-                  Bus.publish(Installation.Event.Updated, { version: latest })
-                })
-                .catch(() => { })
-            })()
+          ;(async () => {
+            if (Installation.VERSION === "dev") return
+            if (Installation.isSnapshot()) return
+            const config = await Config.global()
+            if (config.autoupdate === false) return
+            const latest = await Installation.latest()
+            if (Installation.VERSION === latest) return
+            const method = await Installation.method()
+            if (method === "unknown") return
+            await Installation.upgrade(method, latest)
+              .then(() => {
+                Bus.publish(Installation.Event.Updated, { version: latest })
+              })
+              .catch(() => {})
+          })()
 
           await proc.exited
           server.stop()
@@ -133,7 +135,25 @@ const cli = yargs(hideBin(process.argv))
 try {
   await cli.parse()
 } catch (e) {
-  Log.Default.error(e, {
-    stack: e instanceof Error ? e.stack : undefined,
-  })
+  const data: Record<string, any> = {}
+  if (e instanceof NamedError) {
+    const obj = e.toObject()
+    Object.assign(data, {
+      ...obj.data,
+    })
+  }
+  if (e instanceof Error) {
+    Object.assign(data, {
+      name: e.name,
+      message: e.message,
+      cause: e.cause?.toString(),
+    })
+  }
+  Log.Default.error("fatal", data)
+  const formatted = FormatError(e)
+  if (formatted) UI.error(formatted)
+  if (!formatted)
+    UI.error(
+      "Unexpected error, check log file at " + Log.file() + " for more details",
+    )
 }

packages/opencode/src/lsp/server.ts

@@ -70,6 +70,9 @@ export namespace LSPServer {
           const proc = Bun.spawn({
             cmd: ["go", "install", "golang.org/x/tools/gopls@latest"],
             env: { ...process.env, GOBIN: Global.Path.bin },
+            stdout: "pipe",
+            stderr: "pipe",
+            stdin: "pipe",
           })
           const exit = await proc.exited
           if (exit !== 0) {

packages/opencode/src/permission/index.ts

@@ -64,6 +64,7 @@ export namespace Permission {
     title: Info["title"]
     metadata: Info["metadata"]
   }) {
+    return
     const { pending, approved } = state()
     log.info("asking", {
       sessionID: input.sessionID,

packages/opencode/src/provider/provider.ts

@@ -27,9 +27,13 @@ import { TaskTool } from "../tool/task"
 export namespace Provider {
   const log = Log.create({ service: "provider" })
 
-  type CustomLoader = (
-    provider: ModelsDev.Provider,
-  ) => Promise<Record<string, any> | false>
+  type CustomLoader = (provider: ModelsDev.Provider) => Promise<
+    | {
+        getModel?: (sdk: any, modelID: string) => Promise<any>
+        options: Record<string, any>
+      }
+    | false
+  >
 
   type Source = "env" | "config" | "custom" | "api"
 
@@ -44,30 +48,52 @@ export namespace Provider {
         }
       }
       return {
-        apiKey: "",
-        async fetch(input: any, init: any) {
-          const access = await AuthAnthropic.access()
-          const headers = {
-            ...init.headers,
-            authorization: `Bearer ${access}`,
-            "anthropic-beta": "oauth-2025-04-20",
-          }
-          delete headers["x-api-key"]
-          return fetch(input, {
-            ...init,
-            headers,
-          })
+        options: {
+          apiKey: "",
+          async fetch(input: any, init: any) {
+            const access = await AuthAnthropic.access()
+            const headers = {
+              ...init.headers,
+              authorization: `Bearer ${access}`,
+              "anthropic-beta": "oauth-2025-04-20",
+            }
+            delete headers["x-api-key"]
+            return fetch(input, {
+              ...init,
+              headers,
+            })
+          },
         },
       }
     },
+    openai: async () => {
+      return {
+        async getModel(sdk: any, modelID: string) {
+          return sdk.responses(modelID)
+        },
+        options: {},
+      }
+    },
     "amazon-bedrock": async () => {
-      if (!process.env["AWS_PROFILE"]) return false
+      if (!process.env["AWS_PROFILE"]) false
+
+      const region = process.env["AWS_REGION"] ?? "us-east-1"
+
       const { fromNodeProviderChain } = await import(
         await BunProc.install("@aws-sdk/credential-providers")
       )
       return {
-        region: process.env["AWS_REGION"] ?? "us-east-1",
-        credentialProvider: fromNodeProviderChain(),
+        options: {
+          region,
+          credentialProvider: fromNodeProviderChain(),
+        },
+        async getModel(sdk: any, modelID: string) {
+          if (modelID.includes("claude")) {
+            const prefix = region.split("-")[0]
+            modelID = `${prefix}.${modelID}`
+          }
+          return sdk.languageModel(modelID)
+        },
       }
     },
   }
@@ -80,6 +106,7 @@ export namespace Provider {
       [providerID: string]: {
         source: Source
         info: ModelsDev.Provider
+        getModel?: (sdk: any, modelID: string) => Promise<any>
         options: Record<string, any>
       }
     } = {}
@@ -95,6 +122,7 @@ export namespace Provider {
       id: string,
       options: Record<string, any>,
       source: Source,
+      getModel?: (sdk: any, modelID: string) => Promise<any>,
     ) {
       const provider = providers[id]
       if (!provider) {
@@ -110,6 +138,7 @@ export namespace Provider {
       }
       provider.options = mergeDeep(provider.options, options)
       provider.source = source
+      provider.getModel = getModel ?? provider.getModel
     }
 
     const configProviders = Object.entries(config.provider ?? {})
@@ -173,7 +202,8 @@ export namespace Provider {
     for (const [providerID, fn] of Object.entries(CUSTOM_LOADERS)) {
       if (disabled.has(providerID)) continue
       const result = await fn(database[providerID])
-      if (result) mergeProvider(providerID, result, "custom")
+      if (result)
+        mergeProvider(providerID, result.options, "custom", result.getModel)
     }
 
     // load config
@@ -181,7 +211,11 @@ export namespace Provider {
       mergeProvider(providerID, provider.options ?? {}, "config")
     }
 
-    for (const providerID of Object.keys(providers)) {
+    for (const [providerID, provider] of Object.entries(providers)) {
+      if (Object.keys(provider.info.models).length === 0) {
+        delete providers[providerID]
+        continue
+      }
       log.info("found", { providerID })
     }
 
@@ -232,9 +266,9 @@ export namespace Provider {
     const sdk = await getSDK(provider.info)
 
     try {
-      const language =
-        // @ts-expect-error
-        "responses" in sdk ? sdk.responses(modelID) : sdk.languageModel(modelID)
+      const language = provider.getModel
+        ? await provider.getModel(sdk, modelID)
+        : sdk.languageModel(modelID)
       log.info("found", { providerID, modelID })
       s.models.set(key, {
         info,
@@ -322,6 +356,10 @@ export namespace Provider {
       ...t,
       parameters: optionalToNullable(t.parameters),
     })),
+    azure: TOOLS.map((t) => ({
+      ...t,
+      parameters: optionalToNullable(t.parameters),
+    })),
     google: TOOLS,
   }
 

packages/opencode/src/session/system.ts

@@ -25,7 +25,7 @@ export namespace SystemPrompt {
   export async function environment() {
     const app = App.info()
 
-    const tree = async () => {
+    ;async () => {
       const files = await Ripgrep.files({
         cwd: app.path.cwd,
       })
@@ -82,9 +82,9 @@ export namespace SystemPrompt {
         `  Platform: ${process.platform}`,
         `  Today's date: ${new Date().toDateString()}`,
         `</env>`,
-        `<project>`,
-        `  ${app.git ? await tree() : ""}`,
-        `</project>`,
+        // `<project>`,
+        // `  ${app.git ? await tree() : ""}`,
+        // `</project>`,
       ].join("\n"),
     ]
   }

packages/opencode/src/util/error.ts

@@ -1,7 +1,7 @@
 import { z, type ZodSchema } from "zod"
-import { Log } from "./log"
+// import { Log } from "./log"
 
-const log = Log.create()
+// const log = Log.create()
 
 export abstract class NamedError extends Error {
   abstract schema(): ZodSchema
@@ -30,10 +30,6 @@ export abstract class NamedError extends Error {
       ) {
         super(name, options)
         this.name = name
-        log.error(name, {
-          ...this.data,
-          cause: options?.cause?.toString(),
-        })
       }
 
       static isInstance(input: any): input is InstanceType<typeof result> {

packages/opencode/src/util/log.ts

@@ -68,13 +68,13 @@ export namespace Log {
     }
     const result = {
       info(message?: any, extra?: Record<string, any>) {
-        process.stderr.write(build(message, extra))
+        process.stderr.write("INFO  " + build(message, extra))
       },
       error(message?: any, extra?: Record<string, any>) {
-        process.stderr.write(build(message, extra))
+        process.stderr.write("ERROR " + build(message, extra))
       },
       warn(message?: any, extra?: Record<string, any>) {
-        process.stderr.write(build(message, extra))
+        process.stderr.write("WARN  " + build(message, extra))
       },
       tag(key: string, value: string) {
         if (tags) tags[key] = value

packages/tui/internal/completions/commands.go

@@ -35,8 +35,7 @@ func (c *CommandCompletionProvider) GetEmptyMessage() string {
 	return "no matching commands"
 }
 
-func getCommandCompletionItem(cmd commands.Command, space int) dialog.CompletionItemI {
-	t := theme.CurrentTheme()
+func getCommandCompletionItem(cmd commands.Command, space int, t theme.Theme) dialog.CompletionItemI {
 	spacer := strings.Repeat(" ", space)
 	title := "  /" + cmd.Trigger + lipgloss.NewStyle().Foreground(t.TextMuted()).Render(spacer+cmd.Description)
 	value := string(cmd.Name)
@@ -47,6 +46,9 @@ func getCommandCompletionItem(cmd commands.Command, space int) dialog.Completion
 }
 
 func (c *CommandCompletionProvider) GetChildEntries(query string) ([]dialog.CompletionItemI, error) {
+	t := theme.CurrentTheme()
+	commands := c.app.Commands
+
 	space := 1
 	for _, cmd := range c.app.Commands {
 		if lipgloss.Width(cmd.Trigger) > space {
@@ -55,15 +57,16 @@ func (c *CommandCompletionProvider) GetChildEntries(query string) ([]dialog.Comp
 	}
 	space += 2
 
+	sorted := commands.Sorted()
 	if query == "" {
 		// If no query, return all commands
 		items := []dialog.CompletionItemI{}
-		for _, cmd := range c.app.Commands {
+		for _, cmd := range sorted {
 			if cmd.Trigger == "" {
 				continue
 			}
 			space := space - lipgloss.Width(cmd.Trigger)
-			items = append(items, getCommandCompletionItem(cmd, space))
+			items = append(items, getCommandCompletionItem(cmd, space, t))
 		}
 		return items, nil
 	}
@@ -72,13 +75,13 @@ func (c *CommandCompletionProvider) GetChildEntries(query string) ([]dialog.Comp
 	var commandNames []string
 	commandMap := make(map[string]dialog.CompletionItemI)
 
-	for _, cmd := range c.app.Commands {
+	for _, cmd := range sorted {
 		if cmd.Trigger == "" {
 			continue
 		}
 		space := space - lipgloss.Width(cmd.Trigger)
 		commandNames = append(commandNames, cmd.Trigger)
-		commandMap[cmd.Trigger] = getCommandCompletionItem(cmd, space)
+		commandMap[cmd.Trigger] = getCommandCompletionItem(cmd, space, t)
 	}
 
 	// Find fuzzy matches

packages/tui/internal/components/chat/editor.go

@@ -54,6 +54,9 @@ func (m *editorComponent) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 	var cmd tea.Cmd
 
 	switch msg := msg.(type) {
+	case spinner.TickMsg:
+		m.spinner, cmd = m.spinner.Update(msg)
+		return m, cmd
 	case tea.KeyPressMsg:
 		// Maximize editor responsiveness for printable characters
 		if msg.Text != "" {
@@ -214,8 +217,7 @@ func (m *editorComponent) Paste() (tea.Model, tea.Cmd) {
 }
 
 func (m *editorComponent) Newline() (tea.Model, tea.Cmd) {
-	value := m.textarea.Value()
-	m.textarea.SetValue(value + "\n")
+	m.textarea.Newline()
 	return m, nil
 }
 

packages/tui/internal/components/chat/message.go

@@ -137,7 +137,7 @@ func renderContentBlock(content string, options ...renderingOption) string {
 		PaddingBottom(renderer.paddingBottom).
 		PaddingLeft(renderer.paddingLeft).
 		PaddingRight(renderer.paddingRight).
-		Background(t.BackgroundSubtle()).
+		Background(t.BackgroundPanel()).
 		Foreground(t.TextMuted()).
 		BorderStyle(lipgloss.ThickBorder())
 
@@ -146,7 +146,7 @@ func renderContentBlock(content string, options ...renderingOption) string {
 		align = *renderer.align
 	}
 
-	borderColor := t.BackgroundSubtle()
+	borderColor := t.BackgroundPanel()
 	if renderer.borderColor != nil {
 		borderColor = *renderer.borderColor
 	}
@@ -159,7 +159,7 @@ func renderContentBlock(content string, options ...renderingOption) string {
 			AlignHorizontal(align).
 			BorderLeftForeground(borderColor).
 			BorderLeftBackground(t.Background()).
-			BorderRightForeground(t.BackgroundSubtle()).
+			BorderRightForeground(t.BackgroundPanel()).
 			BorderRightBackground(t.Background())
 	case lipgloss.Right:
 		style = style.
@@ -168,7 +168,7 @@ func renderContentBlock(content string, options ...renderingOption) string {
 			AlignHorizontal(align).
 			BorderRightForeground(borderColor).
 			BorderRightBackground(t.Background()).
-			BorderLeftForeground(t.BackgroundSubtle()).
+			BorderLeftForeground(t.BackgroundPanel()).
 			BorderLeftBackground(t.Background())
 	}
 
@@ -229,7 +229,7 @@ func renderText(message client.MessageInfo, text string, author string) string {
 	if message.Role == client.Assistant {
 		markdownWidth = width - padding - 4
 	}
-	content := toMarkdown(text, markdownWidth, t.BackgroundSubtle())
+	content := toMarkdown(text, markdownWidth, t.BackgroundPanel())
 	content = strings.Join([]string{content, info}, "\n")
 
 	switch message.Role {
@@ -274,7 +274,7 @@ func renderToolInvocation(
 	t := theme.CurrentTheme()
 	style := styles.Muted().
 		Width(outerWidth).
-		Background(t.BackgroundSubtle()).
+		Background(t.BackgroundPanel()).
 		PaddingTop(paddingTop).
 		PaddingBottom(paddingBottom).
 		PaddingLeft(2).
@@ -282,7 +282,7 @@ func renderToolInvocation(
 		BorderLeft(true).
 		BorderRight(true).
 		BorderBackground(t.Background()).
-		BorderForeground(t.BackgroundSubtle()).
+		BorderForeground(t.BackgroundPanel()).
 		BorderStyle(lipgloss.ThickBorder())
 
 	if toolCall.State == "partial-call" {
@@ -290,7 +290,7 @@ func renderToolInvocation(
 		if !showDetails {
 			title = "∟ " + title
 			padding := calculatePadding()
-			style := lipgloss.NewStyle().Width(outerWidth - padding - 4).Background(t.BackgroundSubtle())
+			style := lipgloss.NewStyle().Width(outerWidth - padding - 4).Background(t.BackgroundPanel())
 			return renderContentBlock(style.Render(title),
 				WithAlign(lipgloss.Left),
 				WithBorderColor(t.Accent()),
@@ -332,7 +332,7 @@ func renderToolInvocation(
 		if m, ok := metadata.Get("message"); ok {
 			style = style.BorderLeftForeground(t.Error())
 			error = styles.BaseStyle().
-				Background(t.BackgroundSubtle()).
+				Background(t.BackgroundPanel()).
 				Foreground(t.Error()).
 				Render(m.(string))
 			error = renderContentBlock(
@@ -374,7 +374,7 @@ func renderToolInvocation(
 				formattedDiff = lipgloss.NewStyle().
 					BorderStyle(lipgloss.ThickBorder()).
 					BorderBackground(t.Background()).
-					BorderForeground(t.BackgroundSubtle()).
+					BorderForeground(t.BackgroundPanel()).
 					BorderLeft(true).
 					BorderRight(true).
 					Render(formattedDiff)
@@ -410,19 +410,21 @@ func renderToolInvocation(
 			command := toolArgsMap["command"].(string)
 			stdout := stdout.(string)
 			body = fmt.Sprintf("```console\n> %s\n%s```", command, stdout)
-			body = toMarkdown(body, innerWidth, t.BackgroundSubtle())
+			body = toMarkdown(body, innerWidth, t.BackgroundPanel())
 			body = renderContentBlock(body, WithFullWidth(), WithMarginBottom(1))
 		}
 	case "webfetch":
 		toolArgs = renderArgs(&toolArgsMap, "url")
 		title = fmt.Sprintf("FETCH %s", toolArgs)
 		if format, ok := toolArgsMap["format"].(string); ok {
-			body = *result
-			body = truncateHeight(body, 10)
-			if format == "html" || format == "markdown" {
-				body = toMarkdown(body, innerWidth, t.BackgroundSubtle())
+			if result != nil {
+				body = *result
+				body = truncateHeight(body, 10)
+				if format == "html" || format == "markdown" {
+					body = toMarkdown(body, innerWidth, t.BackgroundPanel())
+				}
+				body = renderContentBlock(body, WithFullWidth(), WithMarginBottom(1))
 			}
-			body = renderContentBlock(body, WithFullWidth(), WithMarginBottom(1))
 		}
 	case "todowrite":
 		title = fmt.Sprintf("PLAN")
@@ -441,7 +443,7 @@ func renderToolInvocation(
 					body += fmt.Sprintf("- [ ] %s\n", content)
 				}
 			}
-			body = toMarkdown(body, innerWidth, t.BackgroundSubtle())
+			body = toMarkdown(body, innerWidth, t.BackgroundPanel())
 			body = renderContentBlock(body, WithFullWidth(), WithMarginBottom(1))
 		}
 	case "task":
@@ -501,7 +503,7 @@ func renderToolInvocation(
 	if !showDetails {
 		title = "∟ " + title
 		padding := calculatePadding()
-		style := lipgloss.NewStyle().Width(outerWidth - padding - 4).Background(t.BackgroundSubtle())
+		style := lipgloss.NewStyle().Width(outerWidth - padding - 4).Background(t.BackgroundPanel())
 		paddingBottom := 0
 		if isLast {
 			paddingBottom = 1
@@ -590,7 +592,7 @@ func renderFile(filename string, content string, options ...fileRenderingOption)
 		content = truncateHeight(content, renderer.height)
 	}
 	content = fmt.Sprintf("```%s\n%s\n```", extension(renderer.filename), content)
-	content = toMarkdown(content, width, t.BackgroundSubtle())
+	content = toMarkdown(content, width, t.BackgroundPanel())
 
 	return renderContentBlock(content, WithFullWidth(), WithMarginBottom(1))
 }
@@ -604,7 +606,7 @@ func renderToolAction(name string) string {
 	case "edit":
 		return "Preparing edit..."
 	case "webfetch":
-		return "Writing fetch..."
+		return "Fetching from the web..."
 	case "glob":
 		return "Finding files..."
 	case "grep":

packages/tui/internal/components/chat/messages.go

@@ -60,17 +60,14 @@ func (m *messagesComponent) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 		return m, nil
 	case dialog.ThemeSelectedMsg:
 		m.cache.Clear()
-		m.renderView()
-		return m, nil
+		return m, m.Reload()
 	case ToggleToolDetailsMsg:
 		m.showToolDetails = !m.showToolDetails
-		m.renderView()
-		return m, nil
+		return m, m.Reload()
 	case app.SessionSelectedMsg:
 		m.cache.Clear()
-		cmd := m.Reload()
-		m.viewport.GotoBottom()
-		return m, cmd
+		m.tail = true
+		return m, m.Reload()
 	case app.SessionClearedMsg:
 		m.cache.Clear()
 		cmd := m.Reload()
@@ -346,6 +343,7 @@ func (m *messagesComponent) home() string {
 		logoAndVersion,
 		lipgloss.WithWhitespaceStyle(lipgloss.NewStyle().Background(t.Background())),
 	)
+	m.commands.SetBackgroundColor(t.Background())
 	commands := lipgloss.PlaceHorizontal(
 		m.width,
 		lipgloss.Center,

packages/tui/internal/components/commands/commands.go

@@ -18,6 +18,7 @@ type CommandsComponent interface {
 	tea.Model
 	tea.ViewModel
 	layout.Sizeable
+	SetBackgroundColor(color compat.AdaptiveColor)
 }
 
 type commandsComponent struct {
@@ -38,6 +39,10 @@ func (c *commandsComponent) GetSize() (int, int) {
 	return c.width, c.height
 }
 
+func (c *commandsComponent) SetBackgroundColor(color compat.AdaptiveColor) {
+	c.background = &color
+}
+
 func (c *commandsComponent) Init() tea.Cmd {
 	return nil
 }

packages/tui/internal/components/dialog/complete.go

@@ -173,7 +173,6 @@ func (c *completionDialogComponent) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 			}
 			cmds = append(cmds, cmd)
 			cmds = append(cmds, c.pseudoSearchTextArea.Focus())
-			// c.pseudoSearchTextArea.SetValue(msg.String())
 			return c, tea.Batch(cmds...)
 		}
 	case tea.WindowSizeMsg:
@@ -218,12 +217,12 @@ func (c *completionDialogComponent) SetProvider(provider CompletionProvider) {
 	if c.completionProvider.GetId() != provider.GetId() {
 		c.completionProvider = provider
 		c.list.SetEmptyMessage(" " + provider.GetEmptyMessage())
+		c.list.SetItems([]CompletionItemI{})
 	}
 }
 
 func (c *completionDialogComponent) complete(item CompletionItemI) tea.Cmd {
 	value := c.pseudoSearchTextArea.Value()
-
 	if value == "" {
 		return nil
 	}
@@ -242,10 +241,8 @@ func (c *completionDialogComponent) complete(item CompletionItemI) tea.Cmd {
 }
 
 func (c *completionDialogComponent) close() tea.Cmd {
-	c.list.SetItems([]CompletionItemI{})
 	c.pseudoSearchTextArea.Reset()
 	c.pseudoSearchTextArea.Blur()
-
 	return util.CmdHandler(CompletionDialogCloseMsg{})
 }
 

packages/tui/internal/components/diff/diff.go

@@ -441,10 +441,10 @@ func SyntaxHighlight(w io.Writer, source, fileName, formatter string, bg color.C
 	<entry type="TextWhitespace" style="%s"/>
 </style>
 `,
-		getColor(t.BackgroundSubtle()), // Background
-		getColor(t.Text()),             // Text
-		getColor(t.Text()),             // Other
-		getColor(t.Error()),            // Error
+		getColor(t.BackgroundPanel()), // Background
+		getColor(t.Text()),            // Text
+		getColor(t.Text()),            // Other
+		getColor(t.Error()),           // Error
 
 		getColor(t.SyntaxKeyword()), // Keyword
 		getColor(t.SyntaxKeyword()), // KeywordConstant
@@ -614,7 +614,7 @@ func applyHighlighting(content string, segments []Segment, segmentType LineType,
 
 	// Get the appropriate color based on terminal background
 	bgColor := lipgloss.Color(getColor(highlightBg))
-	fgColor := lipgloss.Color(getColor(theme.CurrentTheme().BackgroundSubtle()))
+	fgColor := lipgloss.Color(getColor(theme.CurrentTheme().BackgroundPanel()))
 
 	for i := 0; i < len(content); {
 		// Check if we're at an ANSI sequence

packages/tui/internal/components/status/status.go

@@ -88,7 +88,7 @@ func (m statusComponent) View() string {
 
 	cwd := styles.Padded().
 		Foreground(t.TextMuted()).
-		Background(t.BackgroundSubtle()).
+		Background(t.BackgroundPanel()).
 		Render(m.app.Info.Path.Cwd)
 
 	sessionInfo := ""
@@ -123,7 +123,7 @@ func (m statusComponent) View() string {
 		0,
 		m.width-lipgloss.Width(logo)-lipgloss.Width(cwd)-lipgloss.Width(sessionInfo),
 	)
-	spacer := lipgloss.NewStyle().Background(t.BackgroundSubtle()).Width(space).Render("")
+	spacer := lipgloss.NewStyle().Background(t.BackgroundPanel()).Width(space).Render("")
 
 	status := logo + cwd + spacer + sessionInfo
 

packages/tui/internal/components/textarea/textarea.go

@@ -553,6 +553,14 @@ func (m Model) Line() int {
 	return m.row
 }
 
+func (m *Model) Newline() {
+	if m.MaxHeight > 0 && len(m.value) >= m.MaxHeight {
+		return
+	}
+	m.col = clamp(m.col, 0, len(m.value[m.row]))
+	m.splitLine(m.row, m.col)
+}
+
 // CursorDown moves the cursor down by one line.
 // Returns whether or not the cursor blink should be reset.
 func (m *Model) CursorDown() {
@@ -1113,11 +1121,7 @@ func (m Model) Update(msg tea.Msg) (Model, tea.Cmd) {
 			}
 			m.deleteWordRight()
 		case key.Matches(msg, m.KeyMap.InsertNewline):
-			if m.MaxHeight > 0 && len(m.value) >= m.MaxHeight {
-				return m, nil
-			}
-			m.col = clamp(m.col, 0, len(m.value[m.row]))
-			m.splitLine(m.row, m.col)
+			m.Newline()
 		case key.Matches(msg, m.KeyMap.LineEnd):
 			m.CursorEnd()
 		case key.Matches(msg, m.KeyMap.LineStart):
@@ -1161,8 +1165,6 @@ func (m Model) Update(msg tea.Msg) (Model, tea.Cmd) {
 	}
 
 	var cmd tea.Cmd
-	cmds = append(cmds, cmd)
-
 	newRow, newCol := m.cursorLineNumber(), m.col
 	m.virtualCursor, cmd = m.virtualCursor.Update(msg)
 	if (newRow != oldRow || newCol != oldCol) && m.virtualCursor.Mode() == cursor.CursorBlink {
@@ -1171,7 +1173,6 @@ func (m Model) Update(msg tea.Msg) (Model, tea.Cmd) {
 	}
 	cmds = append(cmds, cmd)
 
-	m.SetHeight(m.ContentHeight())
 	return m, tea.Batch(cmds...)
 }
 

packages/tui/internal/styles/styles.go

@@ -15,7 +15,7 @@ func BaseStyle() lipgloss.Style {
 func Panel() lipgloss.Style {
 	t := theme.CurrentTheme()
 	return lipgloss.NewStyle().
-		Background(t.BackgroundSubtle()).
+		Background(t.BackgroundPanel()).
 		Border(lipgloss.NormalBorder(), true, false, true, false).
 		BorderForeground(t.BorderSubtle()).
 		Foreground(t.Text())
@@ -131,9 +131,9 @@ func BackgroundColor() compat.AdaptiveColor {
 	return theme.CurrentTheme().Background()
 }
 
-// BackgroundSubtleColor returns the subtle background color from the current theme
-func BackgroundSubtleColor() compat.AdaptiveColor {
-	return theme.CurrentTheme().BackgroundSubtle()
+// BackgroundPanelColor returns the subtle background color from the current theme
+func BackgroundPanelColor() compat.AdaptiveColor {
+	return theme.CurrentTheme().BackgroundPanel()
 }
 
 // BackgroundElementColor returns the darker background color from the current theme

packages/tui/internal/theme/ayu.go

@@ -98,7 +98,7 @@ func NewAyuTheme() *AyuTheme {
 		Dark:  lipgloss.Color(darkBg),
 		Light: lipgloss.Color(darkBg),
 	}
-	theme.BackgroundSubtleColor = compat.AdaptiveColor{
+	theme.BackgroundPanelColor = compat.AdaptiveColor{
 		Dark:  lipgloss.Color(darkBgAlt),
 		Light: lipgloss.Color(darkBgAlt),
 	}

packages/tui/internal/theme/everforest.go

@@ -120,7 +120,7 @@ func NewEverforestTheme() *EverforestTheme {
 		Dark:  lipgloss.Color(darkStep1),
 		Light: lipgloss.Color(lightStep1),
 	}
-	theme.BackgroundSubtleColor = compat.AdaptiveColor{
+	theme.BackgroundPanelColor = compat.AdaptiveColor{
 		Dark:  lipgloss.Color(darkStep2),
 		Light: lipgloss.Color(lightStep2),
 	}

packages/tui/internal/theme/manager.go

@@ -146,7 +146,7 @@ func LoadCustomTheme(customTheme map[string]any) (Theme, error) {
 		case "background":
 			theme.BackgroundColor = adaptiveColor
 		case "backgroundsubtle":
-			theme.BackgroundSubtleColor = adaptiveColor
+			theme.BackgroundPanelColor = adaptiveColor
 		case "backgroundelement":
 			theme.BackgroundElementColor = adaptiveColor
 		case "border":

packages/tui/internal/theme/opencode.go

@@ -119,7 +119,7 @@ func NewOpenCodeTheme() *OpenCodeTheme {
 		Dark:  lipgloss.Color(darkStep1),
 		Light: lipgloss.Color(lightStep1),
 	}
-	theme.BackgroundSubtleColor = compat.AdaptiveColor{
+	theme.BackgroundPanelColor = compat.AdaptiveColor{
 		Dark:  lipgloss.Color(darkStep2),
 		Light: lipgloss.Color(lightStep2),
 	}

packages/tui/internal/theme/theme.go

@@ -14,7 +14,7 @@ import (
 type Theme interface {
 	// Background colors
 	Background() compat.AdaptiveColor        // Radix 1
-	BackgroundSubtle() compat.AdaptiveColor  // Radix 2
+	BackgroundPanel() compat.AdaptiveColor   // Radix 2
 	BackgroundElement() compat.AdaptiveColor // Radix 3
 
 	// Border colors
@@ -84,7 +84,7 @@ type Theme interface {
 type BaseTheme struct {
 	// Background colors
 	BackgroundColor        compat.AdaptiveColor
-	BackgroundSubtleColor  compat.AdaptiveColor
+	BackgroundPanelColor   compat.AdaptiveColor
 	BackgroundElementColor compat.AdaptiveColor
 
 	// Border colors
@@ -163,7 +163,7 @@ func (t *BaseTheme) Text() compat.AdaptiveColor      { return t.TextColor }
 func (t *BaseTheme) TextMuted() compat.AdaptiveColor { return t.TextMutedColor }
 
 func (t *BaseTheme) Background() compat.AdaptiveColor        { return t.BackgroundColor }
-func (t *BaseTheme) BackgroundSubtle() compat.AdaptiveColor  { return t.BackgroundSubtleColor }
+func (t *BaseTheme) BackgroundPanel() compat.AdaptiveColor   { return t.BackgroundPanelColor }
 func (t *BaseTheme) BackgroundElement() compat.AdaptiveColor { return t.BackgroundElementColor }
 
 func (t *BaseTheme) Border() compat.AdaptiveColor       { return t.BorderColor }

packages/tui/internal/theme/tokyonight.go

@@ -117,7 +117,7 @@ func NewTokyoNightTheme() *TokyoNightTheme {
 		Dark:  lipgloss.Color(darkStep1),
 		Light: lipgloss.Color(lightStep1),
 	}
-	theme.BackgroundSubtleColor = compat.AdaptiveColor{
+	theme.BackgroundPanelColor = compat.AdaptiveColor{
 		Dark:  lipgloss.Color(darkStep2),
 		Light: lipgloss.Color(lightStep2),
 	}

packages/tui/internal/tui/tui.go

@@ -44,7 +44,11 @@ type appModel struct {
 
 func (a appModel) Init() tea.Cmd {
 	var cmds []tea.Cmd
-	cmds = append(cmds, tea.RequestBackgroundColor)
+	// https://github.com/charmbracelet/bubbletea/issues/1440
+	// https://github.com/sst/opencode/issues/127
+	if !util.IsWsl() {
+		cmds = append(cmds, tea.RequestBackgroundColor)
+	}
 	cmds = append(cmds, a.app.InitializeProvider())
 	cmds = append(cmds, a.editor.Init())
 	cmds = append(cmds, a.messages.Init())
@@ -66,9 +70,11 @@ func (a appModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 
 	switch msg := msg.(type) {
 	case tea.KeyPressMsg:
+		keyString := msg.String()
+
 		// 1. Handle active modal
 		if a.modal != nil {
-			switch msg.String() {
+			switch keyString {
 			// Escape always closes current modal
 			case "esc", "ctrl+c":
 				a.modal = nil
@@ -84,7 +90,6 @@ func (a appModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 		// 2. Check for commands that require leader
 		if a.isLeaderSequence {
 			matches := a.app.Commands.Matches(msg, a.isLeaderSequence)
-			// Reset leader state
 			a.isLeaderSequence = false
 			if len(matches) > 0 {
 				return a, util.CmdHandler(commands.ExecuteCommandsMsg(matches))
@@ -92,48 +97,49 @@ func (a appModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 		}
 
 		// 3. Handle completions trigger
-		switch msg.String() {
-		case "/":
-			if !a.showCompletionDialog {
-				a.showCompletionDialog = true
+		if keyString == "/" && !a.showCompletionDialog {
+			a.showCompletionDialog = true
 
-				initialValue := "/"
-				currentInput := a.editor.Value()
-				// if the input doesn't end with a space,
-				// then we want to include the last word
-				if !strings.HasSuffix(currentInput, " ") {
-					words := strings.Split(a.editor.Value(), " ")
-					if len(words) > 0 {
-						lastWord := words[len(words)-1]
-						lastWord = strings.TrimSpace(lastWord)
-						initialValue = lastWord + "/"
-					}
+			initialValue := "/"
+			currentInput := a.editor.Value()
+
+			// if the input doesn't end with a space,
+			// then we want to include the last word
+			// (ie, `packages/`)
+			if !strings.HasSuffix(currentInput, " ") {
+				words := strings.Split(a.editor.Value(), " ")
+				if len(words) > 0 {
+					lastWord := words[len(words)-1]
+					lastWord = strings.TrimSpace(lastWord)
+					initialValue = lastWord + "/"
 				}
-				updated, cmd := a.completions.Update(
-					app.CompletionDialogTriggerdMsg{
-						InitialValue: initialValue,
-					},
-				)
-				a.completions = updated.(dialog.CompletionDialog)
-				cmds = append(cmds, cmd)
-
-				updated, cmd = a.completions.Update(msg)
-				a.completions = updated.(dialog.CompletionDialog)
-				cmds = append(cmds, cmd)
-
-				updated, cmd = a.editor.Update(msg)
-				a.editor = updated.(chat.EditorComponent)
-				cmds = append(cmds, cmd)
-				return a, tea.Sequence(cmds...)
 			}
+
+			updated, cmd := a.completions.Update(
+				app.CompletionDialogTriggerdMsg{
+					InitialValue: initialValue,
+				},
+			)
+			a.completions = updated.(dialog.CompletionDialog)
+			cmds = append(cmds, cmd)
+
+			updated, cmd = a.editor.Update(msg)
+			a.editor = updated.(chat.EditorComponent)
+			cmds = append(cmds, cmd)
+
+			updated, cmd = a.updateCompletions(msg)
+			a.completions = updated.(dialog.CompletionDialog)
+			cmds = append(cmds, cmd)
+
+			return a, tea.Sequence(cmds...)
 		}
 
 		if a.showCompletionDialog {
-			switch msg.String() {
+			switch keyString {
 			case "tab", "enter", "esc", "ctrl+c":
-				context, contextCmd := a.completions.Update(msg)
-				a.completions = context.(dialog.CompletionDialog)
-				cmds = append(cmds, contextCmd)
+				updated, cmd := a.updateCompletions(msg)
+				a.completions = updated.(dialog.CompletionDialog)
+				cmds = append(cmds, cmd)
 				return a, tea.Batch(cmds...)
 			}
 
@@ -141,13 +147,10 @@ func (a appModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 			a.editor = updated.(chat.EditorComponent)
 			cmds = append(cmds, cmd)
 
-			currentInput := a.editor.Value()
-			provider := a.completionManager.GetProvider(currentInput)
-			a.completions.SetProvider(provider)
+			updated, cmd = a.updateCompletions(msg)
+			a.completions = updated.(dialog.CompletionDialog)
+			cmds = append(cmds, cmd)
 
-			context, contextCmd := a.completions.Update(msg)
-			a.completions = context.(dialog.CompletionDialog)
-			cmds = append(cmds, contextCmd)
 			return a, tea.Batch(cmds...)
 		}
 
@@ -173,10 +176,8 @@ func (a appModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 			return a, util.CmdHandler(commands.ExecuteCommandsMsg(matches))
 		}
 
-		// 7. Fallback to editor. This shouldn't happen?
-		// All printable characters were already sent, and
-		// any other keypress that didn't match a command
-		// is likely a noop.
+		// 7. Fallback to editor. This is for other characters
+		// likek backspace, tab, etc.
 		updatedEditor, cmd := a.editor.Update(msg)
 		a.editor = updatedEditor.(chat.EditorComponent)
 		return a, cmd
@@ -211,7 +212,6 @@ func (a appModel) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
 		cmds = append(cmds, cmd)
 	case dialog.CompletionDialogCloseMsg:
 		a.showCompletionDialog = false
-		a.completions.SetProvider(a.completionManager.DefaultProvider())
 	case client.EventInstallationUpdated:
 		return a, toast.NewSuccessToast(
 			"opencode updated to "+msg.Properties.Version+", restart to apply.",
@@ -507,30 +507,18 @@ func (a appModel) executeCommand(command commands.Command) (tea.Model, tea.Cmd)
 		a.messages = updated.(chat.MessagesComponent)
 		cmds = append(cmds, cmd)
 	case commands.MessagesPageUpCommand:
-		if a.showCompletionDialog {
-			return a, nil
-		}
 		updated, cmd := a.messages.PageUp()
 		a.messages = updated.(chat.MessagesComponent)
 		cmds = append(cmds, cmd)
 	case commands.MessagesPageDownCommand:
-		if a.showCompletionDialog {
-			return a, nil
-		}
 		updated, cmd := a.messages.PageDown()
 		a.messages = updated.(chat.MessagesComponent)
 		cmds = append(cmds, cmd)
 	case commands.MessagesHalfPageUpCommand:
-		if a.showCompletionDialog {
-			return a, nil
-		}
 		updated, cmd := a.messages.HalfPageUp()
 		a.messages = updated.(chat.MessagesComponent)
 		cmds = append(cmds, cmd)
 	case commands.MessagesHalfPageDownCommand:
-		if a.showCompletionDialog {
-			return a, nil
-		}
 		updated, cmd := a.messages.HalfPageDown()
 		a.messages = updated.(chat.MessagesComponent)
 		cmds = append(cmds, cmd)
@@ -540,6 +528,15 @@ func (a appModel) executeCommand(command commands.Command) (tea.Model, tea.Cmd)
 	return a, tea.Batch(cmds...)
 }
 
+func (a appModel) updateCompletions(msg tea.Msg) (tea.Model, tea.Cmd) {
+	currentInput := a.editor.Value()
+	if currentInput != "" {
+		provider := a.completionManager.GetProvider(currentInput)
+		a.completions.SetProvider(provider)
+	}
+	return a.completions.Update(msg)
+}
+
 func NewModel(app *app.App) tea.Model {
 	completionManager := completions.NewCompletionManager(app)
 	initialProvider := completionManager.DefaultProvider()

packages/tui/internal/util/util.go

@@ -1,6 +1,9 @@
 package util
 
 import (
+	"os"
+	"strings"
+
 	tea "github.com/charmbracelet/bubbletea/v2"
 )
 
@@ -17,3 +20,18 @@ func Clamp(v, low, high int) int {
 	}
 	return min(high, max(low, v))
 }
+
+func IsWsl() bool {
+	// Check for WSL environment variables
+	if os.Getenv("WSL_DISTRO_NAME") != "" {
+		return true
+	}
+
+	// Check /proc/version for WSL signature
+	if data, err := os.ReadFile("/proc/version"); err == nil {
+		version := strings.ToLower(string(data))
+		return strings.Contains(version, "microsoft") || strings.Contains(version, "wsl")
+	}
+
+	return false
+}

packages/web/astro.config.mjs

@@ -4,10 +4,15 @@ import starlight from "@astrojs/starlight"
 import solidJs from "@astrojs/solid-js"
 import cloudflare from "@astrojs/cloudflare"
 import theme from "toolbeam-docs-theme"
+import config from "./config.mjs"
 import { rehypeHeadingIds } from "@astrojs/markdown-remark"
 import rehypeAutolinkHeadings from "rehype-autolink-headings"
 
 const github = "https://github.com/sst/opencode"
+const headerLinks = [
+  { name: "Docs", url: "/docs/" },
+  { name: "GitHub", url: github },
+]
 
 // https://astro.build/config
 export default defineConfig({
@@ -30,7 +35,7 @@ export default defineConfig({
       title: "opencode",
       expressiveCode: { themes: ["github-light", "github-dark"] },
       social: [
-        { icon: "github", label: "GitHub", href: github },
+        { icon: "github", label: "GitHub", href: config.github },
       ],
       editLink: {
         baseUrl: `${github}/edit/master/www/`,
@@ -59,11 +64,7 @@ export default defineConfig({
       },
       plugins: [
         theme({
-          // Optionally, add your own header links
-          headerLinks: [
-            { name: "Home", url: "/" },
-            { name: "Docs", url: "/docs/" },
-          ],
+          headerLinks: config.headerLinks,
         }),
       ],
     }),

packages/web/config.mjs

@@ -0,0 +1,7 @@
+export default {
+  github: "https://github.com/sst/opencode",
+  headerLinks: [
+    { name: "Home", url: "/" },
+    { name: "Docs", url: "/docs/" },
+  ],
+}

packages/web/public/theme.json

@@ -0,0 +1,169 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "type": "object",
+  "properties": {
+    "$schema": {
+      "type": "string",
+      "description": "JSON schema reference for configuration validation"
+    },
+    "defs": {
+      "type": "object",
+      "description": "Color definitions that can be referenced in the theme",
+      "patternProperties": {
+        "^[a-zA-Z][a-zA-Z0-9_]*$": {
+          "oneOf": [
+            {
+              "type": "string",
+              "pattern": "^#[0-9a-fA-F]{6}$",
+              "description": "Hex color value"
+            },
+            {
+              "type": "integer",
+              "minimum": 0,
+              "maximum": 255,
+              "description": "ANSI color code (0-255)"
+            }
+          ]
+        }
+      },
+      "additionalProperties": false
+    },
+    "theme": {
+      "type": "object",
+      "description": "Theme color definitions",
+      "properties": {
+        "primary": { "$ref": "#/definitions/colorValue" },
+        "secondary": { "$ref": "#/definitions/colorValue" },
+        "accent": { "$ref": "#/definitions/colorValue" },
+        "error": { "$ref": "#/definitions/colorValue" },
+        "warning": { "$ref": "#/definitions/colorValue" },
+        "success": { "$ref": "#/definitions/colorValue" },
+        "info": { "$ref": "#/definitions/colorValue" },
+        "text": { "$ref": "#/definitions/colorValue" },
+        "textMuted": { "$ref": "#/definitions/colorValue" },
+        "background": { "$ref": "#/definitions/colorValue" },
+        "backgroundPanel": { "$ref": "#/definitions/colorValue" },
+        "backgroundElement": { "$ref": "#/definitions/colorValue" },
+        "border": { "$ref": "#/definitions/colorValue" },
+        "borderActive": { "$ref": "#/definitions/colorValue" },
+        "borderSubtle": { "$ref": "#/definitions/colorValue" },
+        "diffAdded": { "$ref": "#/definitions/colorValue" },
+        "diffRemoved": { "$ref": "#/definitions/colorValue" },
+        "diffContext": { "$ref": "#/definitions/colorValue" },
+        "diffHunkHeader": { "$ref": "#/definitions/colorValue" },
+        "diffHighlightAdded": { "$ref": "#/definitions/colorValue" },
+        "diffHighlightRemoved": { "$ref": "#/definitions/colorValue" },
+        "diffAddedBg": { "$ref": "#/definitions/colorValue" },
+        "diffRemovedBg": { "$ref": "#/definitions/colorValue" },
+        "diffContextBg": { "$ref": "#/definitions/colorValue" },
+        "diffLineNumber": { "$ref": "#/definitions/colorValue" },
+        "diffAddedLineNumberBg": { "$ref": "#/definitions/colorValue" },
+        "diffRemovedLineNumberBg": { "$ref": "#/definitions/colorValue" },
+        "markdownText": { "$ref": "#/definitions/colorValue" },
+        "markdownHeading": { "$ref": "#/definitions/colorValue" },
+        "markdownLink": { "$ref": "#/definitions/colorValue" },
+        "markdownLinkText": { "$ref": "#/definitions/colorValue" },
+        "markdownCode": { "$ref": "#/definitions/colorValue" },
+        "markdownBlockQuote": { "$ref": "#/definitions/colorValue" },
+        "markdownEmph": { "$ref": "#/definitions/colorValue" },
+        "markdownStrong": { "$ref": "#/definitions/colorValue" },
+        "markdownHorizontalRule": { "$ref": "#/definitions/colorValue" },
+        "markdownListItem": { "$ref": "#/definitions/colorValue" },
+        "markdownListEnumeration": { "$ref": "#/definitions/colorValue" },
+        "markdownImage": { "$ref": "#/definitions/colorValue" },
+        "markdownImageText": { "$ref": "#/definitions/colorValue" },
+        "markdownCodeBlock": { "$ref": "#/definitions/colorValue" },
+        "syntaxComment": { "$ref": "#/definitions/colorValue" },
+        "syntaxKeyword": { "$ref": "#/definitions/colorValue" },
+        "syntaxFunction": { "$ref": "#/definitions/colorValue" },
+        "syntaxVariable": { "$ref": "#/definitions/colorValue" },
+        "syntaxString": { "$ref": "#/definitions/colorValue" },
+        "syntaxNumber": { "$ref": "#/definitions/colorValue" },
+        "syntaxType": { "$ref": "#/definitions/colorValue" },
+        "syntaxOperator": { "$ref": "#/definitions/colorValue" },
+        "syntaxPunctuation": { "$ref": "#/definitions/colorValue" }
+      },
+      "required": [
+        "primary",
+        "secondary",
+        "accent",
+        "text",
+        "textMuted",
+        "background"
+      ],
+      "additionalProperties": false
+    }
+  },
+  "required": ["theme"],
+  "additionalProperties": false,
+  "definitions": {
+    "colorValue": {
+      "oneOf": [
+        {
+          "type": "string",
+          "pattern": "^#[0-9a-fA-F]{6}$",
+          "description": "Hex color value (same for dark and light)"
+        },
+        {
+          "type": "integer",
+          "minimum": 0,
+          "maximum": 255,
+          "description": "ANSI color code (0-255, same for dark and light)"
+        },
+        {
+          "type": "string",
+          "pattern": "^[a-zA-Z][a-zA-Z0-9_]*$",
+          "description": "Reference to another color in the theme or defs"
+        },
+        {
+          "type": "object",
+          "properties": {
+            "dark": {
+              "oneOf": [
+                {
+                  "type": "string",
+                  "pattern": "^#[0-9a-fA-F]{6}$",
+                  "description": "Hex color value for dark mode"
+                },
+                {
+                  "type": "integer",
+                  "minimum": 0,
+                  "maximum": 255,
+                  "description": "ANSI color code for dark mode"
+                },
+                {
+                  "type": "string",
+                  "pattern": "^[a-zA-Z][a-zA-Z0-9_]*$",
+                  "description": "Reference to another color for dark mode"
+                }
+              ]
+            },
+            "light": {
+              "oneOf": [
+                {
+                  "type": "string",
+                  "pattern": "^#[0-9a-fA-F]{6}$",
+                  "description": "Hex color value for light mode"
+                },
+                {
+                  "type": "integer",
+                  "minimum": 0,
+                  "maximum": 255,
+                  "description": "ANSI color code for light mode"
+                },
+                {
+                  "type": "string",
+                  "pattern": "^[a-zA-Z][a-zA-Z0-9_]*$",
+                  "description": "Reference to another color for light mode"
+                }
+              ]
+            }
+          },
+          "required": ["dark", "light"],
+          "additionalProperties": false,
+          "description": "Separate colors for dark and light modes"
+        }
+      ]
+    }
+  }
+}

packages/web/src/components/Header.astro

@@ -1,5 +1,6 @@
 ---
-import config from 'virtual:starlight/user-config';
+import config from '../../config.mjs';
+import astroConfig from 'virtual:starlight/user-config';
 import { Icon } from '@astrojs/starlight/components';
 import { HeaderLinks } from 'toolbeam-docs-theme/components';
 import Default from 'toolbeam-docs-theme/overrides/Header.astro';
@@ -8,7 +9,9 @@ import SiteTitle from '@astrojs/starlight/components/SiteTitle.astro';
 
 const path = Astro.url.pathname;
 
-const links = config.social || [];
+const links = astroConfig.social || [];
+const headerLinks = config.headerLinks;
+
 ---
 
 { path.startsWith("/s")
@@ -17,7 +20,11 @@ const links = config.social || [];
 		<SiteTitle {...Astro.props} />
 	</div>
 	<div class="middle-group sl-flex">
-		<HeaderLinks {...Astro.props} />
+		{
+		  headerLinks?.map(({ name, url }) => (
+		    <a class="links" href={url}>{name}</a>
+		  ))
+		}
 	</div>
 	<div class="sl-hidden md:sl-flex right-group">
 		{
@@ -80,6 +87,12 @@ const links = config.social || [];
               color: var(--sl-color-text-dimmed);
           }
       }
+  a.links {
+		text-transform: uppercase;
+    font-size: var(--sl-text-sm);
+    color: var(--sl-color-text-secondary);
+    line-height: normal;
+  }
 	}
 
 	@media (min-width: 50rem) {
@@ -113,4 +126,3 @@ const links = config.social || [];
 		}
 	}
 </style>
-

packages/web/src/components/Lander.astro

@@ -5,6 +5,7 @@ import type { Props } from '@astrojs/starlight/props';
 
 import CopyIcon from "../assets/lander/copy.svg";
 import CheckIcon from "../assets/lander/check.svg";
+import Screenshot from "../assets/themes/tokyonight.png";
 
 const { data } = Astro.locals.starlightRoute.entry;
 const { title = data.title, tagline, image, actions = [] } = data.hero || {};
@@ -77,6 +78,13 @@ if (image) {
       </ul>
     </section>
 
+    <section class="images">
+      <div>
+        <p>opencode TUI with the tokyonight theme</p>
+        <Image width={600} src={Screenshot} alt="opencode TUI with the tokyonight theme" />
+      </div>
+    </section>
+
     <section class="footer">
       <div class="col1">
         <span>Version: Beta</span>
@@ -128,24 +136,39 @@ section.cta {
   justify-content: space-between;
   border-top: 2px solid var(--sl-color-border);
 
+  @media (max-width: 40rem) {
+    flex-direction: column;
+  }
+
   & > div {
     flex: 1;
     line-height: 1.4;
     padding: calc(var(--padding) / 2) 0.5rem;
+
+    @media (max-width: 40rem) {
+      padding-bottom: calc(var(--padding) / 2 + 4px);
+    }
+
+    a {
+      font-size: 1rem;
+    }
+  }
+  & > div.col2 {
+    @media (max-width: 50rem) {
+      flex: 0 0 auto;
+    }
   }
   & > div:not(.col2) {
     text-align: center;
     text-transform: uppercase;
   }
 
-  @media (max-width: 30rem) {
-    & > div {
-      padding-bottom: calc(var(--padding) / 2 + 4px);
-    }
-  }
-
   & > div + div {
     border-left: 2px solid var(--sl-color-border);
+    @media (max-width: 40rem) {
+      border-left: none;
+      border-top: 2px solid var(--sl-color-border);
+    }
   }
 
   .command {
@@ -211,6 +234,61 @@ section.content {
   }
 }
 
+section.images {
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  justify-content: space-between;
+  border-top: 2px solid var(--sl-color-border);
+
+  & > div {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: calc(var(--padding) / 4);
+    padding: calc(var(--padding) / 2);
+    border-width: 0;
+    border-style: solid;
+    border-color: var(--sl-color-border);
+
+    & > div, p {
+      flex: 1;
+      display: flex;
+      align-items: center;
+    }
+  }
+
+  p {
+    letter-spacing: -0.03125rem;
+    text-transform: uppercase;
+    color: var(--sl-color-text-dimmed);
+
+    @media (max-width: 30rem) {
+      font-size: 0.75rem;
+    }
+  }
+
+  img {
+    align-self: center;
+    width: 100%;
+    max-width: 600px;
+    height: auto;
+  }
+
+  & > div + div {
+    border-width: 0 0 0 2px;
+  }
+
+  @media (max-width: 30rem) {
+    & {
+      flex-direction: column;
+    }
+    & > div + div {
+      border-width: 2px 0 0 0;
+    }
+  }
+}
+
 section.approach {
   border-top: 2px solid var(--sl-color-border);
   padding: var(--padding);

packages/web/src/components/share.module.css

@@ -254,7 +254,7 @@
         line-height: 18px;
         font-size: 0.875rem;
         color: var(--sl-color-text-secondary);
-        max-wdith: var(--sm-tool-width);
+        max-width: var(--sm-tool-width);
 
         display: flex;
         align-items: flex-start;

packages/web/src/content/docs/docs/config.mdx

@@ -5,7 +5,7 @@ title: Config
 You can configure opencode using a JSON config file that can be placed in:
 
 - Globally under `~/.config/opencode/config.json`.
-- Your project root under `opencode.json`. This is safe to checked into Git and uses the same schema as the global one.
+- Your project root under `opencode.json`. This is safe to be checked into Git and uses the same schema as the global one.
 
 ```json
 {

packages/web/src/content/docs/docs/index.mdx

@@ -13,6 +13,8 @@ import { Tabs, TabItem } from '@astrojs/starlight/components';
 - Log in with Anthropic to use your Claude Pro or Claude Max account.
 - Supports 75+ LLM providers through [Models.dev](https://models.dev), including local models.
 
+![opencode TUI with the opencode theme](../../../assets/themes/opencode.png)
+
 ---
 
 ## Install