create-theokit 1.23.4 → 1.23.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-theokit",
-  "version": "1.23.4",
+  "version": "1.23.6",
   "type": "module",
   "description": "Scaffold a new TheoKit project",
   "license": "Apache-2.0",

package/templates/surfaces/desktop/.github/workflows/release.yml.tmpl

@@ -0,0 +1,83 @@
+# Cross-platform desktop release — builds {{name}} for macOS (Apple Silicon + Intel),
+# Linux (x64 + arm64) and Windows, then drafts a GitHub release with the installers.
+#
+# WHY a matrix of native runners: Tauri does NOT support cross-compiling between operating
+# systems (macOS/Linux bundles REQUIRE their own host; only Windows-NSIS-from-Linux is a
+# last-resort exception). Each target therefore builds on its own runner — the documented
+# best practice: https://v2.tauri.app/distribute/pipelines/github/
+#
+# ⚠️ PREREQUISITE — the sidecar must be a real binary, not the dev shim.
+#    `tauri build` runs `scripts/build-sidecar.mjs`, which in DEV writes a POSIX shell shim
+#    that execs this repo's local `tsx` (absolute build-time paths, requires Node on the user's
+#    machine). That shim is NOT portable to end users, and `build-sidecar.mjs` intentionally
+#    FAILS on Windows (Tauri needs a `.exe`). Before this workflow can ship a working app you
+#    MUST compile `sidecar/sidecar.ts` to a self-contained per-platform binary at
+#    `src-tauri/binaries/theo-sidecar-<target-triple>[.exe]`. See README-surface.md § Packaging.
+#
+# Trigger: push to the `release` branch, or run manually (Actions → Run workflow).
+name: release-desktop
+
+on:
+  workflow_dispatch:
+  push:
+    branches: [release]
+
+jobs:
+  build:
+    permissions:
+      contents: write
+    strategy:
+      fail-fast: false
+      matrix:
+        include:
+          - platform: macos-latest # Apple Silicon → .app / .dmg
+            args: --target aarch64-apple-darwin
+          - platform: macos-latest # Intel → .app / .dmg
+            args: --target x86_64-apple-darwin
+          - platform: ubuntu-22.04 # Linux x64 → .deb / .AppImage / .rpm
+            args: ''
+          - platform: ubuntu-22.04-arm # Linux arm64
+            args: ''
+          - platform: windows-latest # Windows → .exe (NSIS) / .msi
+            args: ''
+
+    runs-on: ${{ matrix.platform }}
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Install Linux system dependencies
+        if: startsWith(matrix.platform, 'ubuntu')
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y libwebkit2gtk-4.1-dev libappindicator3-dev librsvg2-dev patchelf xdg-utils
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+          cache: npm
+
+      - name: Install Rust (stable)
+        uses: dtolnay/rust-toolchain@stable
+        with:
+          targets: ${{ matrix.platform == 'macos-latest' && 'aarch64-apple-darwin,x86_64-apple-darwin' || '' }}
+
+      - name: Rust cache
+        uses: swatinem/rust-cache@v2
+        with:
+          workspaces: ./src-tauri -> target
+
+      - name: Install frontend dependencies
+        run: npm install
+
+      - name: Build + release with Tauri
+        uses: tauri-apps/tauri-action@v0
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          tagName: {{name}}-v__VERSION__
+          releaseName: '{{name}} v__VERSION__'
+          releaseBody: 'See the assets below to download and install this version.'
+          releaseDraft: true
+          prerelease: false
+          args: ${{ matrix.args }}

package/templates/surfaces/desktop/README-surface.md.tmpl

@@ -53,3 +53,17 @@ externalBin that a shell shim cannot satisfy (`build:sidecar` fails loud on win3
 before building. Options: **Node SEA** (single-executable app — runs under Node, where the stream works),
 or `bun build --compile`/`pkg` (verify the ai-sdk token stream survives your bundler first). Replace the
 `build:sidecar` script with your compile command and keep the same output path.
+
+### Cross-platform release (macOS · Linux · Windows)
+
+Tauri does **not** cross-compile between operating systems — macOS/Linux bundles must be built on their own
+host, and only Windows-NSIS-from-Linux is a fragile last resort ([docs](https://v2.tauri.app/distribute/pipelines/github/)).
+The best practice is a **matrix of native CI runners**, so this surface ships
+`.github/workflows/release.yml`: on push to a `release` branch (or a manual run) it builds `{{name}}` on
+`macos-latest` (Apple Silicon **and** Intel), `ubuntu-22.04` (x64 + arm64) and `windows-latest`, then drafts
+a GitHub release with the installers (`.dmg`/`.app`, `.deb`/`.AppImage`/`.rpm`, `.msi`/NSIS `.exe`).
+
+Before that workflow can ship a **working** app, resolve the sidecar gap above (the CI `tauri build` runs the
+same `build:sidecar`, which fails on the Windows runner and produces a non-portable shim on macOS/Linux). For
+public distribution you also need **code signing** — macOS notarization (Apple Developer ID) and a Windows
+signing certificate; see [Tauri › Distribute](https://v2.tauri.app/distribute/).

package/templates/surfaces/desktop/frontend/src/App.tsx.tmpl

@@ -13,7 +13,7 @@ import {
 } from '@theokit/ui'
 import { Button } from '@usetheo/ui'
 import { createTauriChannelSource, type TauriCore } from '@theokit/tauri'
-import { Bot, Plus, Sparkles } from 'lucide-react'
+import { Bot, Minus, Plus, Sparkles, Square, X } from 'lucide-react'
 import { ChannelTransport, useAgent } from 'theokit/client'
 
 import { AGENT } from '../../shared/agent'
@@ -40,6 +40,25 @@ if (tauri === undefined) {
 }
 const transport = new ChannelTransport({ source: createTauriChannelSource(tauri.core) })
 
+// The window is frameless (`decorations: false` in tauri.conf.json) so the OS title bar can't clash with
+// the app background — the app owns its top bar. These drive the native window from our custom controls.
+const appWindow = (
+  globalThis as {
+    __TAURI__?: {
+      window?: {
+        getCurrentWindow: () => {
+          minimize: () => Promise<void>
+          toggleMaximize: () => Promise<void>
+          close: () => Promise<void>
+        }
+      }
+    }
+  }
+).__TAURI__?.window
+const minimizeWindow = (): void => void appWindow?.getCurrentWindow().minimize()
+const maximizeWindow = (): void => void appWindow?.getCurrentWindow().toggleMaximize()
+const closeWindow = (): void => void appWindow?.getCurrentWindow().close()
+
 /** The agent's opening line (from `shared/agent.ts`) — so the conversation starts warm instead of empty. */
 const GREETING: UIMessage = {
   id: 'greeting',
@@ -55,24 +74,30 @@ const STARTERS: QuickAction[] = [
 ]
 
 // App-level layout in inline styles (the desktop bundle has no Tailwind). Colors read the theme CSS vars
-// `@theokit/ui` sets, so light/dark + the theme switcher cascade exactly like the web surface.
+// `@theokit/ui` sets — and those vars are `oklch()` colors, so wrap them in `color-mix(in oklch, …)` for
+// alpha (NOT `hsl(var(--x) / a)`, which is invalid CSS and silently renders transparent).
 const styles = {
   page: {
     display: 'flex',
     flexDirection: 'column',
     height: '100vh',
-    background: 'hsl(var(--background))',
-    color: 'hsl(var(--foreground))',
+    background: 'var(--background)',
+    color: 'var(--foreground)',
   },
   header: {
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'space-between',
-    borderBottom: '1px solid hsl(var(--border) / 0.6)',
-    padding: '8px 16px',
+    // The frameless title bar is its own DISTINCT band: the `--muted` surface reads clearly apart
+    // from the content background (adapts to light/dark), with a border to seal the strip.
+    background: 'var(--muted)',
+    borderBottom: '1px solid var(--border)',
+    // Slim title bar — thin vertical padding keeps the strip compact.
+    padding: '3px 12px',
   },
   brand: { display: 'inline-flex', alignItems: 'center', gap: 8 },
-  brandName: { fontWeight: 600, fontSize: 13, letterSpacing: '-0.01em' },
+  brandName: { fontWeight: 600, fontSize: 12, letterSpacing: '-0.01em' },
+  headerRight: { display: 'inline-flex', alignItems: 'center', gap: 2 },
   scroll: { flex: 1, overflowY: 'auto', minHeight: 0 },
   column: {
     margin: '0 auto',
@@ -84,8 +109,8 @@ const styles = {
     padding: 24,
   },
   composerBar: {
-    borderTop: '1px solid hsl(var(--border) / 0.6)',
-    background: 'hsl(var(--background) / 0.5)',
+    borderTop: '1px solid color-mix(in oklch, var(--border) 60%, transparent)',
+    background: 'color-mix(in oklch, var(--background) 50%, transparent)',
   },
   composerInner: { margin: '0 auto', width: '100%', maxWidth: 768, padding: '16px 24px' },
 } satisfies Record<string, CSSProperties>
@@ -115,13 +140,57 @@ export function App(): ReactElement {
 
   return (
     <TheoUIProvider>
+      {/* Window controls need :hover feedback — inline styles can't do pseudo-classes, so the button
+          appearance (incl. hover, and the classic red close) lives in this small stylesheet. */}
+      <style>{`
+        .tk-winbtn {
+          display: inline-flex; align-items: center; justify-content: center;
+          width: 20px; height: 20px; border: none; border-radius: 6px;
+          background: transparent; color: var(--muted-foreground); cursor: pointer;
+          transition: background 0.12s ease, color 0.12s ease;
+        }
+        .tk-winbtn:hover { background: color-mix(in oklch, var(--foreground) 12%, transparent); color: var(--foreground); }
+        .tk-winbtn--close:hover { background: #e5484d; color: #fff; }
+      `}</style>
       <div style={styles.page}>
-        <header style={styles.header}>
+        {/* Frameless title bar: `data-tauri-drag-region` makes the whole strip drag the window; the
+            background is the `--muted` band, so the bar reads as a distinct strip. Interactive
+            children (theme switcher, window buttons) still receive clicks. */}
+        <header style={styles.header} data-tauri-drag-region>
           <span style={styles.brand}>
-            <Bot size={18} style={{ color: 'hsl(var(--primary))' }} aria-hidden />
-            <span style={styles.brandName}>{{name}} — TheoKit agent</span>
+            <Bot size={18} style={{ color: 'var(--primary)' }} aria-hidden />
+            <span style={styles.brandName}>{{name}}</span>
+          </span>
+          <span style={styles.headerRight}>
+            <ThemeSwitcher />
+            <button
+              type="button"
+              className="tk-winbtn"
+              onClick={minimizeWindow}
+              aria-label="Minimize"
+              title="Minimize"
+            >
+              <Minus size={15} />
+            </button>
+            <button
+              type="button"
+              className="tk-winbtn"
+              onClick={maximizeWindow}
+              aria-label="Maximize"
+              title="Maximize"
+            >
+              <Square size={12} />
+            </button>
+            <button
+              type="button"
+              className="tk-winbtn tk-winbtn--close"
+              onClick={closeWindow}
+              aria-label="Close"
+              title="Close"
+            >
+              <X size={15} />
+            </button>
           </span>
-          <ThemeSwitcher />
         </header>
 
         <div style={styles.scroll}>

package/templates/surfaces/desktop/src-tauri/capabilities/default.json

@@ -1,10 +1,16 @@
 {
   "$schema": "../gen/schemas/desktop-schema.json",
   "identifier": "default",
-  "description": "Allow the webview to run the agent turn + settle HITL via the sidecar.",
+  "description": "Allow the webview to run the agent turn + settle HITL via the sidecar, and drive the frameless window (drag + minimize/maximize/close).",
   "windows": ["main"],
   "permissions": [
     "core:default",
+    "core:window:allow-start-dragging",
+    "core:window:allow-minimize",
+    "core:window:allow-maximize",
+    "core:window:allow-unmaximize",
+    "core:window:allow-toggle-maximize",
+    "core:window:allow-close",
     "shell:allow-spawn",
     {
       "identifier": "shell:allow-execute",

package/templates/surfaces/desktop/src-tauri/tauri.conf.json.tmpl

@@ -16,7 +16,8 @@
         "label": "main",
         "title": "{{name}} — TheoKit desktop",
         "width": 900,
-        "height": 680
+        "height": 680,
+        "decorations": false
       }
     ],
     "security": {