nomadexapp 0.1.0

package/docs/SETUP.md

@@ -0,0 +1,242 @@
+# Setup
+
+This guide covers the practical Nomadex setup for the workflow it was built for:
+
+- the coding agent runs on your own machine
+- the repo and credentials stay on that machine
+- you open Nomadex from your phone, tablet, or another computer to monitor and steer the run remotely
+
+## 1. Prerequisites
+
+- Node.js 20 or newer recommended
+- `npm`
+- `codex` CLI available on `PATH`
+
+Quick check:
+
+```bash
+codex --version
+```
+
+## 2. Recommended Launch
+
+Normal use:
+
+```bash
+npx nomadexapp
+```
+
+Expected result:
+
+- Codex app-server on `ws://127.0.0.1:3901`
+- Nomadex UI on `http://127.0.0.1:3784`
+- Browser websocket proxy on `/codex-ws`
+
+`npx nomadexapp` is the packaged launcher path. It:
+
+- it reuses an existing app-server only if `/readyz` succeeds
+- it starts the app-server if needed
+- it fails if the UI port is already busy
+- it binds the UI to `0.0.0.0`, which is useful for LAN and phone access
+- it serves the built UI directly instead of running Vite dev mode
+- it prints a UI password in the terminal and blocks browser access until that password is entered
+- it can prompt for a newer npm package version before startup
+
+Repo development:
+
+```bash
+npm install
+npm run dev:live
+```
+
+Use `dev:live` when you are editing Nomadex itself and want the Vite development workflow.
+
+## 3. Preferred Remote Access
+
+Preferred setup: ZeroTier.
+
+Why ZeroTier is the preferred path for Nomadex:
+
+- it keeps the UI on a private overlay network
+- it is safer than exposing the raw dev server directly
+- it works well for phone access from anywhere
+- it preserves the model where the real agent stays local to your machine
+
+Recommended flow:
+
+1. Install ZeroTier on the host machine.
+2. Install ZeroTier on your phone or remote laptop.
+3. Join both devices to the same ZeroTier network.
+4. Run `npx nomadexapp` on the host machine.
+5. Open `http://<host-zerotier-ip>:3784` from the remote device.
+
+Alternative options:
+
+- Tailscale
+- SSH tunnel
+- reverse proxy with real auth in front of Nomadex
+
+Do not expose the raw Nomadex dev server directly to the public internet.
+
+## 4. LAN And Mobile Access
+
+On the same local network:
+
+1. Run `npx nomadexapp` on the host machine.
+2. Or run `npm run dev:live` if you are using the repo development flow.
+3. Find the machine’s LAN IP.
+4. Open `http://<lan-ip>:3784` from your phone or tablet.
+
+Because the websocket is proxied through the same origin, the browser should connect through the Nomadex host without needing a separate websocket URL.
+
+## 5. Repo Development And Manual Launch
+
+For normal installed usage, prefer `npx nomadexapp`.
+
+If you are working from the repo and want to manage the bridge yourself:
+
+```bash
+npm run app-server
+VITE_CODEX_WS_URL=ws://127.0.0.1:3901 npm run dev -- --host 0.0.0.0 --port 3784 --strictPort
+```
+
+This is useful if:
+
+- you want a different websocket target
+- you are debugging the app-server directly
+- you want to run the bridge separately from Vite
+
+## 6. Environment Variables
+
+Main variables:
+
+- `NOMADEX_WS_URL`
+  Websocket URL for the packaged launcher. Default: `ws://127.0.0.1:3901`
+- `NOMADEX_UI_PORT`
+  UI port used by `npx nomadexapp`. Default: `3784`
+- `NOMADEX_AUTH_RELAY_TARGET`
+  HTTP target used by the packaged auth relay. Default: `http://127.0.0.1:1455`
+- `NOMADEX_PASSWORD`
+  Stable UI password for the packaged launcher. If unset, Nomadex generates one on each launch and prints it in the terminal.
+- `VITE_CODEX_WS_URL`
+  Websocket URL for the Codex app-server. Default: `ws://127.0.0.1:3901`
+- `VITE_CODEX_UI_PORT`
+  UI port used by `dev:live`. Default: `3784`
+- `VITE_CODEX_AUTH_RELAY_TARGET`
+  HTTP target used for login callback relay. Default: `http://127.0.0.1:1455`
+
+Examples:
+
+```bash
+npx nomadexapp --port 4173
+npx nomadexapp --ws-url ws://127.0.0.1:3902
+NOMADEX_PASSWORD=my-secret npx nomadexapp
+VITE_CODEX_UI_PORT=4173 npm run dev:live
+VITE_CODEX_WS_URL=ws://127.0.0.1:3902 npm run dev:live
+```
+
+## 7. Build And Preview
+
+Build:
+
+```bash
+npm run build
+```
+
+Preview:
+
+```bash
+npm run preview
+```
+
+Use `preview` to inspect the built shell inside the repo. The normal packaged launch is `npx nomadexapp`.
+
+## 8. GitHub Actions And npm Publish
+
+This repo now includes:
+
+- `.github/workflows/ci.yml`
+- `.github/workflows/publish.yml`
+
+Behavior:
+
+- pushes and pull requests run `npm ci`, `npm run lint`, and `npm run build`
+- pushes to `main` also check npm
+- if the current `package.json` version is not published yet, GitHub Actions runs `npm publish --access public --provenance`
+
+Required setup:
+
+1. Add a repository secret named `NPM_TOKEN`.
+2. Make sure that token has permission to publish the package.
+3. Bump `package.json` version before pushing a release to `main`.
+
+Without a new version, the publish workflow skips instead of failing on a duplicate publish.
+
+## 9. Files, Images, And Uploads
+
+Current behavior:
+
+- images can be pasted into the composer
+- non-image files go through `Attach`
+- uploaded assets are written into the workspace under:
+  - `.codex-web/uploads`
+  - `.codex-web/uploads/files`
+
+The runtime injects file mentions into the prompt manifest so the live agent can see attached file paths consistently.
+
+## 10. Troubleshooting
+
+### UI port is busy
+
+Error:
+
+```text
+UI port 3784 is already in use
+```
+
+Fix:
+
+- stop the old process using `3784`
+- open the already-running UI
+- or change `NOMADEX_UI_PORT` for the packaged launcher
+- or change `VITE_CODEX_UI_PORT` for the repo dev launcher
+
+### Websocket bridge port is occupied
+
+Error:
+
+```text
+Port 3901 on 127.0.0.1 is already in use, but it is not responding like a Codex app-server
+```
+
+Fix:
+
+- stop the conflicting process
+- or run the app-server on another port and set `NOMADEX_WS_URL`
+- or set `VITE_CODEX_WS_URL` if you are using `dev:live`
+
+### Browser shows websocket connection failures
+
+Check:
+
+1. `npx nomadexapp` is still running, or `npm run dev:live` if you are in the repo
+2. the UI URL is really the strict port you launched
+3. the app-server is reachable on the configured websocket target
+4. you hard refreshed after recent websocket changes
+
+### Old favicon or theme color still shows
+
+Mobile browsers cache icon and `theme-color` metadata aggressively.
+
+Fix:
+
+1. hard refresh
+2. close the tab
+3. reopen the page
+
+## 11. Current Boundaries
+
+- Codex is still the strongest live provider path.
+- The provider abstraction is ahead of full provider-runtime parity.
+- Internet-safe deployment is not built in. Add your own network boundary and auth if you expose Nomadex remotely.
+- The packaged launcher currently assumes the Codex app-server contract as the reference bridge path.

package/docs/ui-desktop.svg

@@ -0,0 +1,190 @@
+<svg width="1600" height="960" viewBox="0 0 1600 960" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect width="1600" height="960" rx="24" fill="#120B16"/>
+  <rect x="20" y="20" width="1560" height="920" rx="18" fill="#130F19" stroke="#2B2232"/>
+
+  <rect x="20" y="20" width="1560" height="52" rx="18" fill="#17111D"/>
+  <rect x="32" y="30" width="26" height="26" rx="8" fill="#171C27" stroke="#2D3342"/>
+  <text x="41" y="47" fill="#B6BFD6" font-family="JetBrains Mono, monospace" font-size="13">+</text>
+  <rect x="68" y="30" width="36" height="26" rx="8" fill="#171C27" stroke="#2D3342"/>
+  <rect x="80" y="37" width="13" height="10" rx="2" fill="#F0B34A"/>
+  <rect x="110" y="30" width="36" height="26" rx="8" fill="#171C27" stroke="#2D3342"/>
+  <rect x="123" y="35" width="10" height="16" rx="2" fill="#E6D0B6"/>
+  <rect x="152" y="30" width="36" height="26" rx="8" fill="#171C27" stroke="#2D3342"/>
+  <circle cx="170" cy="43" r="7" stroke="#6C7387" stroke-width="1.5"/>
+  <circle cx="224" cy="43" r="8" fill="#33D6BA"/>
+  <text x="240" y="48" fill="#EEE7F7" font-family="JetBrains Mono, monospace" font-size="18" font-weight="700">Nomadex</text>
+
+  <rect x="360" y="29" width="126" height="28" rx="14" fill="#14311F" stroke="#2D6A4D"/>
+  <text x="386" y="47" fill="#8DE2A7" font-family="JetBrains Mono, monospace" font-size="14">Full Access</text>
+
+  <rect x="501" y="30" width="28" height="26" rx="8" fill="#171C27" stroke="#2D3342"/>
+  <text x="510" y="47" fill="#A9A0C3" font-family="JetBrains Mono, monospace" font-size="13">96</text>
+  <rect x="540" y="30" width="28" height="26" rx="8" fill="#171C27" stroke="#2D3342"/>
+  <text x="549" y="47" fill="#A9A0C3" font-family="JetBrains Mono, monospace" font-size="13">v</text>
+  <rect x="579" y="30" width="28" height="26" rx="8" fill="#171C27" stroke="#2D3342"/>
+  <rect x="588" y="36" width="11" height="12" rx="2" fill="#F1C456"/>
+  <rect x="618" y="30" width="28" height="26" rx="8" fill="#171C27" stroke="#2D3342"/>
+  <rect x="627" y="35" width="10" height="16" rx="2" fill="#F1E6D7"/>
+  <rect x="657" y="30" width="28" height="26" rx="8" fill="#171C27" stroke="#2D3342"/>
+  <circle cx="671" cy="43" r="6" stroke="#667088" stroke-width="1.5"/>
+  <rect x="697" y="29" width="90" height="28" rx="14" fill="#23172B" stroke="#3A2947"/>
+  <circle cx="713" cy="43" r="5" fill="#8B60E6"/>
+  <text x="727" y="47" fill="#D7C7F5" font-family="JetBrains Mono, monospace" font-size="13">Plasma</text>
+
+  <rect x="1420" y="28" width="140" height="30" rx="12" fill="#171C27" stroke="#2D3342"/>
+  <circle cx="1437" cy="43" r="5" fill="#39D39A"/>
+  <text x="1450" y="47" fill="#B4B8CD" font-family="JetBrains Mono, monospace" font-size="14">gpt-5.4</text>
+
+  <rect x="20" y="72" width="250" height="868" fill="#141018"/>
+  <rect x="34" y="88" width="220" height="44" rx="8" fill="#18141C" stroke="#2E2432"/>
+  <text x="50" y="115" fill="#F2EDF6" font-family="JetBrains Mono, monospace" font-size="14">+ New Session</text>
+
+  <text x="34" y="160" fill="#6E697C" font-family="JetBrains Mono, monospace" font-size="11">TODAY</text>
+  <circle cx="46" cy="186" r="5" fill="#E7DFF1"/>
+  <text x="60" y="191" fill="#F2EDF6" font-family="JetBrains Mono, monospace" font-size="13">it was slow because the first...</text>
+  <rect x="40" y="198" width="180" height="2" rx="1" fill="#3FE0D0"/>
+
+  <circle cx="46" cy="224" r="5" fill="#E7DFF1"/>
+  <text x="60" y="229" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">fix this please</text>
+  <circle cx="46" cy="262" r="5" fill="#E7DFF1"/>
+  <text x="60" y="267" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">hi,i want you to make me a ui...</text>
+  <circle cx="46" cy="300" r="5" fill="#E7DFF1"/>
+  <text x="60" y="305" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">give me current project loca...</text>
+
+  <text x="34" y="352" fill="#6E697C" font-family="JetBrains Mono, monospace" font-size="11">YESTERDAY</text>
+  <circle cx="46" cy="378" r="5" fill="#E7DFF1"/>
+  <text x="60" y="383" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">this is a test</text>
+  <circle cx="46" cy="416" r="5" fill="#E7DFF1"/>
+  <text x="60" y="421" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">test</text>
+  <circle cx="46" cy="454" r="5" fill="#E7DFF1"/>
+  <text x="60" y="459" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">any latch briefly</text>
+  <circle cx="46" cy="492" r="5" fill="#E7DFF1"/>
+  <text x="60" y="497" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">hello</text>
+
+  <text x="34" y="548" fill="#6E697C" font-family="JetBrains Mono, monospace" font-size="11">EARLIER</text>
+  <circle cx="46" cy="574" r="5" fill="#E7DFF1"/>
+  <text x="60" y="579" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">hi</text>
+  <circle cx="46" cy="612" r="5" fill="#E7DFF1"/>
+  <text x="60" y="617" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">run the shell command "slmp"</text>
+  <circle cx="46" cy="650" r="5" fill="#E7DFF1"/>
+  <text x="60" y="655" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">can you create me a new ui st...</text>
+  <circle cx="46" cy="688" r="5" fill="#E7DFF1"/>
+  <text x="60" y="693" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">this is my staging repo://ta...</text>
+  <circle cx="46" cy="726" r="5" fill="#E7DFF1"/>
+  <text x="60" y="731" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">Add Discord bot and reset row</text>
+  <circle cx="46" cy="764" r="5" fill="#E7DFF1"/>
+  <text x="60" y="769" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">implement this please</text>
+  <circle cx="46" cy="802" r="5" fill="#E7DFF1"/>
+  <text x="60" y="807" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">https://github.com/fbuls2/com...</text>
+
+  <text x="34" y="860" fill="#7B738A" font-family="JetBrains Mono, monospace" font-size="12">Command palette</text>
+  <rect x="182" y="846" width="38" height="20" rx="6" fill="#211A29" stroke="#342B3D"/>
+  <text x="194" y="860" fill="#A79FBD" font-family="JetBrains Mono, monospace" font-size="11">K</text>
+  <text x="34" y="892" fill="#B9B0C9" font-family="JetBrains Mono, monospace" font-size="12">/review working tree</text>
+  <text x="34" y="922" fill="#B9B0C9" font-family="JetBrains Mono, monospace" font-size="12">/fork session</text>
+
+  <rect x="270" y="72" width="960" height="868" fill="#11161C"/>
+  <rect x="270" y="72" width="960" height="34" fill="#121820"/>
+  <text x="292" y="94" fill="#EEE7F7" font-family="JetBrains Mono, monospace" font-size="13">it was slow because...</text>
+  <text x="523" y="94" fill="#7D728F" font-family="JetBrains Mono, monospace" font-size="13">fix this please</text>
+  <text x="678" y="94" fill="#7D728F" font-family="JetBrains Mono, monospace" font-size="13">+</text>
+  <rect x="294" y="104" width="230" height="3" rx="1.5" fill="#3FE0D0"/>
+
+  <rect x="312" y="132" width="560" height="22" rx="6" fill="#16131A" stroke="#302633"/>
+  <rect x="326" y="137" width="118" height="12" rx="6" fill="#5F5D17"/>
+  <text x="337" y="146" fill="#E7E0AB" font-family="JetBrains Mono, monospace" font-size="10">index.css L17706</text>
+  <rect x="456" y="137" width="44" height="12" rx="6" fill="#231A2B"/>
+  <text x="470" y="146" fill="#B2A3C8" font-family="JetBrains Mono, monospace" font-size="10">DB</text>
+
+  <rect x="336" y="198" width="824" height="70" rx="10" fill="#6A5B7C" stroke="#8D7AA4"/>
+  <circle cx="362" cy="222" r="7" fill="#FF6659"/>
+  <circle cx="382" cy="222" r="7" fill="#F3BF4E"/>
+  <circle cx="402" cy="222" r="7" fill="#36D074"/>
+  <text x="735" y="226" fill="#EFEAF5" font-family="JetBrains Mono, monospace" font-size="13">index.css</text>
+  <rect x="1072" y="210" width="72" height="16" rx="6" fill="#30493E"/>
+  <text x="1083" y="221" fill="#A9E0B8" font-family="JetBrains Mono, monospace" font-size="10">COMPLETED</text>
+  <text x="354" y="252" fill="#E9E1F4" font-family="JetBrains Mono, monospace" font-size="13">rg -n "terminalDockReady|startBottomShell|workspace terminal dock loading|Opening terminal" src/app/WorkspaceShell.tsx src/index.css</text>
+  <rect x="354" y="258" width="126" height="14" rx="6" fill="#201924"/>
+  <text x="366" y="268" fill="#A79BB8" font-family="JetBrains Mono, monospace" font-size="10">~/trade-console</text>
+  <rect x="488" y="258" width="40" height="14" rx="6" fill="#201924"/>
+  <text x="499" y="268" fill="#A79BB8" font-family="JetBrains Mono, monospace" font-size="10">17706</text>
+  <rect x="535" y="258" width="30" height="14" rx="6" fill="#201924"/>
+  <text x="545" y="268" fill="#A79BB8" font-family="JetBrains Mono, monospace" font-size="10">0ms</text>
+
+  <circle cx="332" cy="318" r="10" fill="#7E61D6"/>
+  <text x="356" y="323" fill="#B9B1C8" font-family="JetBrains Mono, monospace" font-size="14">Agent</text>
+  <text x="1122" y="323" fill="#6F6A77" font-family="JetBrains Mono, monospace" font-size="12">completed</text>
+  <text x="330" y="366" fill="#EEE7F7" font-family="JetBrains Mono, monospace" font-size="16">It was slow because the first shell open was doing too much in one interaction:</text>
+  <text x="330" y="394" fill="#EEE7F7" font-family="JetBrains Mono, monospace" font-size="16">showing the dock, mounting the terminal UI, and starting the pty shell at the same time.</text>
+  <text x="330" y="422" fill="#EEE7F7" font-family="JetBrains Mono, monospace" font-size="16">I changed that in WorkspaceShell.tsx so the bottom dock paints first, the</text>
+  <text x="330" y="450" fill="#EEE7F7" font-family="JetBrains Mono, monospace" font-size="16">heavier terminal content mounts on the next frame, and the shell starts after that.</text>
+  <text x="330" y="478" fill="#EEE7F7" font-family="JetBrains Mono, monospace" font-size="16">I also added a lightweight Opening terminal placeholder in WorkspaceShell.tsx.</text>
+  <text x="330" y="532" fill="#EEE7F7" font-family="JetBrains Mono, monospace" font-size="16">npm run build passes. Hard refresh Nomadex and try the Shell button again.</text>
+
+  <rect x="330" y="566" width="102" height="20" rx="6" fill="#17141A" stroke="#2E2432"/>
+  <text x="342" y="580" fill="#A89FBC" font-family="JetBrains Mono, monospace" font-size="11">/fork</text>
+  <rect x="440" y="566" width="68" height="20" rx="6" fill="#17141A" stroke="#2E2432"/>
+  <text x="451" y="580" fill="#A89FBC" font-family="JetBrains Mono, monospace" font-size="11">/plan</text>
+  <rect x="516" y="566" width="22" height="20" rx="6" fill="#17141A" stroke="#2E2432"/>
+  <text x="523" y="580" fill="#A89FBC" font-family="JetBrains Mono, monospace" font-size="11">[]</text>
+
+  <rect x="330" y="636" width="620" height="54" rx="10" fill="#161A20" stroke="#2C313A"/>
+  <text x="346" y="667" fill="#B4ACC4" font-family="JetBrains Mono, monospace" font-size="13">this video</text>
+
+  <rect x="296" y="724" width="874" height="34" fill="#12171D"/>
+  <text x="306" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Auto</text>
+  <text x="372" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Plan</text>
+  <text x="440" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Mention</text>
+  <text x="526" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Files</text>
+  <text x="592" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Image</text>
+  <text x="660" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Shell</text>
+  <text x="730" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Web</text>
+  <text x="794" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Review</text>
+  <text x="876" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Agents</text>
+  <text x="958" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Trim</text>
+  <text x="1024" y="746" fill="#7B7486" font-family="JetBrains Mono, monospace" font-size="12">Editor</text>
+
+  <rect x="296" y="758" width="874" height="144" rx="10" fill="#12171D" stroke="#2A303A"/>
+  <rect x="330" y="796" width="732" height="80" rx="10" fill="#151A21" stroke="#343A45"/>
+  <text x="350" y="844" fill="#697487" font-family="JetBrains Mono, monospace" font-size="16">Ask Nomadex... / for slash commands - @ mention - $ skills - ! shell - Ctrl+G editor</text>
+  <rect x="1108" y="812" width="34" height="50" rx="10" fill="#1A1F28" stroke="#323845"/>
+  <text x="1120" y="844" fill="#EDE7F7" font-family="JetBrains Mono, monospace" font-size="20">^</text>
+
+  <text x="328" y="898" fill="#776F81" font-family="JetBrains Mono, monospace" font-size="12">Shift+Enter</text>
+  <text x="936" y="898" fill="#776F81" font-family="JetBrains Mono, monospace" font-size="12">Context 65.7k / 200k</text>
+  <rect x="1086" y="882" width="52" height="20" rx="10" fill="#1E232B" stroke="#343A45"/>
+  <text x="1098" y="896" fill="#938CA1" font-family="JetBrains Mono, monospace" font-size="11">5h 79%</text>
+  <rect x="1146" y="882" width="58" height="20" rx="10" fill="#1E232B" stroke="#343A45"/>
+  <text x="1158" y="896" fill="#938CA1" font-family="JetBrains Mono, monospace" font-size="11">Week 82%</text>
+
+  <rect x="1230" y="72" width="350" height="868" fill="#12161E"/>
+  <text x="1248" y="110" fill="#EEE7F7" font-family="JetBrains Mono, monospace" font-size="20" font-weight="700">Files</text>
+  <text x="1248" y="144" fill="#B2ACBD" font-family="JetBrains Mono, monospace" font-size="13">Files</text>
+  <text x="1314" y="144" fill="#6F6A77" font-family="JetBrains Mono, monospace" font-size="13">Branches</text>
+  <text x="1410" y="144" fill="#6F6A77" font-family="JetBrains Mono, monospace" font-size="13">Diff</text>
+  <text x="1462" y="144" fill="#6F6A77" font-family="JetBrains Mono, monospace" font-size="13">Agents</text>
+  <text x="1536" y="144" fill="#6F6A77" font-family="JetBrains Mono, monospace" font-size="13">Config</text>
+  <rect x="1248" y="154" width="54" height="2" rx="1" fill="#3FE0D0"/>
+
+  <rect x="1248" y="182" width="110" height="24" rx="12" fill="#182332" stroke="#2C3C52"/>
+  <text x="1266" y="198" fill="#A5C8FF" font-family="JetBrains Mono, monospace" font-size="12">~/xaenic/nomadex</text>
+  <text x="1248" y="224" fill="#7D778A" font-family="JetBrains Mono, monospace" font-size="12">codex-console - 10 modified</text>
+
+  <rect x="1258" y="252" width="116" height="24" rx="12" fill="#18263A" stroke="#30527B"/>
+  <text x="1276" y="268" fill="#9FC7FF" font-family="JetBrains Mono, monospace" font-size="12">codex-console</text>
+  <text x="1258" y="312" fill="#F0B34A" font-family="JetBrains Mono, monospace" font-size="16">dist</text>
+  <text x="1258" y="350" fill="#F0B34A" font-family="JetBrains Mono, monospace" font-size="16">docs</text>
+  <text x="1258" y="388" fill="#F0B34A" font-family="JetBrains Mono, monospace" font-size="16">public</text>
+  <text x="1258" y="426" fill="#F0B34A" font-family="JetBrains Mono, monospace" font-size="16">scripts</text>
+  <text x="1258" y="464" fill="#F0B34A" font-family="JetBrains Mono, monospace" font-size="16">src</text>
+  <text x="1258" y="502" fill="#F0B34A" font-family="JetBrains Mono, monospace" font-size="16">test-results</text>
+  <text x="1258" y="540" fill="#D6D0E1" font-family="JetBrains Mono, monospace" font-size="16">.gitignore</text>
+  <text x="1258" y="578" fill="#D6D0E1" font-family="JetBrains Mono, monospace" font-size="16">eslint.config.js</text>
+  <text x="1258" y="616" fill="#D6D0E1" font-family="JetBrains Mono, monospace" font-size="16">index.html</text>
+  <text x="1258" y="654" fill="#D6D0E1" font-family="JetBrains Mono, monospace" font-size="16">package-lock.json</text>
+  <text x="1258" y="692" fill="#D6D0E1" font-family="JetBrains Mono, monospace" font-size="16">package.json</text>
+  <text x="1258" y="730" fill="#D6D0E1" font-family="JetBrains Mono, monospace" font-size="16">README.md</text>
+
+  <rect x="1560" y="162" width="6" height="742" rx="3" fill="#2D2B2F"/>
+  <rect x="1560" y="172" width="6" height="168" rx="3" fill="#AAA6B0"/>
+</svg>

package/docs/ui-mobile.svg

@@ -0,0 +1,113 @@
+<svg width="430" height="932" viewBox="0 0 430 932" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect width="430" height="932" rx="28" fill="#180D12"/>
+  <rect x="14" y="14" width="402" height="904" rx="22" fill="#1B0F14" stroke="#38242D"/>
+
+  <rect x="14" y="14" width="402" height="54" rx="22" fill="#19101A"/>
+  <rect x="24" y="24" width="24" height="24" rx="7" fill="#191E28" stroke="#2E3341"/>
+  <text x="32" y="40" fill="#AFB7CA" font-family="JetBrains Mono, monospace" font-size="12">=</text>
+  <rect x="58" y="24" width="26" height="24" rx="7" fill="#191E28" stroke="#2E3341"/>
+  <rect x="67" y="31" width="9" height="10" rx="2" fill="#557BFF"/>
+  <text x="95" y="40" fill="#F1EAF6" font-family="JetBrains Mono, monospace" font-size="15" font-weight="700">Nomadex</text>
+  <rect x="170" y="23" width="110" height="26" rx="13" fill="#163422" stroke="#2B6D4B"/>
+  <text x="193" y="40" fill="#9AE0A9" font-family="JetBrains Mono, monospace" font-size="13">Full Access</text>
+  <rect x="289" y="24" width="24" height="24" rx="7" fill="#191E28" stroke="#2E3341"/>
+  <text x="297" y="40" fill="#B8AFC5" font-family="JetBrains Mono, monospace" font-size="12">96</text>
+  <rect x="321" y="24" width="24" height="24" rx="7" fill="#191E28" stroke="#2E3341"/>
+  <text x="330" y="40" fill="#B8AFC5" font-family="JetBrains Mono, monospace" font-size="12">v</text>
+  <rect x="353" y="24" width="24" height="24" rx="7" fill="#191E28" stroke="#2E3341"/>
+  <circle cx="365" cy="36" r="5" stroke="#6E7484" stroke-width="1.5"/>
+  <rect x="385" y="24" width="24" height="24" rx="7" fill="#2A141B" stroke="#653242"/>
+  <circle cx="397" cy="36" r="5" fill="#FF5877"/>
+
+  <rect x="28" y="84" width="290" height="26" rx="8" fill="#18131A" stroke="#34212A"/>
+  <circle cx="38" cy="97" r="4" fill="#E6DFF0"/>
+  <text x="52" y="101" fill="#EDE7F7" font-family="JetBrains Mono, monospace" font-size="13">I'm making the ...</text>
+  <text x="292" y="101" fill="#8A8098" font-family="JetBrains Mono, monospace" font-size="13">+</text>
+  <rect x="30" y="112" width="198" height="2" rx="1" fill="#F0548D"/>
+
+  <circle cx="30" cy="150" r="10" fill="#B23A55"/>
+  <text x="52" y="154" fill="#BDB4C9" font-family="JetBrains Mono, monospace" font-size="13">Agent</text>
+  <text x="370" y="154" fill="#6E6879" font-family="JetBrains Mono, monospace" font-size="11">live</text>
+
+  <text x="42" y="190" fill="#F1EAF6" font-family="JetBrains Mono, monospace" font-size="16">I'm making the open path cancellable too, so a</text>
+  <text x="42" y="216" fill="#F1EAF6" font-family="JetBrains Mono, monospace" font-size="16">quick open-close tap on mobile doesn't leave a</text>
+  <text x="42" y="242" fill="#F1EAF6" font-family="JetBrains Mono, monospace" font-size="16">queued shell startup running after the panel is</text>
+  <text x="42" y="268" fill="#F1EAF6" font-family="JetBrains Mono, monospace" font-size="16">already gone.</text>
+
+  <rect x="40" y="298" width="10" height="20" rx="5" fill="#D4C7E8"/>
+  <rect x="42" y="336" width="84" height="20" rx="6" fill="#17141A" stroke="#32242D"/>
+  <text x="53" y="350" fill="#A59AB7" font-family="JetBrains Mono, monospace" font-size="11">/fork</text>
+  <rect x="134" y="336" width="68" height="20" rx="6" fill="#17141A" stroke="#32242D"/>
+  <text x="145" y="350" fill="#A59AB7" font-family="JetBrains Mono, monospace" font-size="11">/plan</text>
+  <rect x="210" y="336" width="22" height="20" rx="6" fill="#17141A" stroke="#32242D"/>
+  <text x="217" y="350" fill="#A59AB7" font-family="JetBrains Mono, monospace" font-size="11">[]</text>
+
+  <rect x="28" y="388" width="374" height="90" rx="12" fill="#31191E" stroke="#5B2D38"/>
+  <circle cx="44" cy="406" r="6" fill="#FF6659"/>
+  <circle cx="62" cy="406" r="6" fill="#F3BF4E"/>
+  <circle cx="80" cy="406" r="6" fill="#36D074"/>
+  <text x="166" y="410" fill="#EDE7F7" font-family="JetBrains Mono, monospace" font-size="12">WorkspaceShell.tsx</text>
+  <rect x="324" y="396" width="62" height="16" rx="6" fill="#32483E"/>
+  <text x="334" y="407" fill="#A5DEB5" font-family="JetBrains Mono, monospace" font-size="10">COMPLETED</text>
+  <text x="42" y="444" fill="#EDE7F7" font-family="JetBrains Mono, monospace" font-size="13">sed -n '1,80p' src/app/WorkspaceShell.tsx</text>
+  <rect x="42" y="452" width="110" height="14" rx="6" fill="#20161B"/>
+  <text x="52" y="462" fill="#A89CB5" font-family="JetBrains Mono, monospace" font-size="10">~/code-console</text>
+  <rect x="160" y="452" width="38" height="14" rx="6" fill="#20161B"/>
+  <text x="170" y="462" fill="#A89CB5" font-family="JetBrains Mono, monospace" font-size="10">4132</text>
+  <rect x="204" y="452" width="26" height="14" rx="6" fill="#20161B"/>
+  <text x="212" y="462" fill="#A89CB5" font-family="JetBrains Mono, monospace" font-size="10">0ms</text>
+
+  <rect x="28" y="494" width="374" height="90" rx="12" fill="#31191E" stroke="#5B2D38"/>
+  <circle cx="44" cy="512" r="6" fill="#FF6659"/>
+  <circle cx="62" cy="512" r="6" fill="#F3BF4E"/>
+  <circle cx="80" cy="512" r="6" fill="#36D074"/>
+  <text x="180" y="516" fill="#EDE7F7" font-family="JetBrains Mono, monospace" font-size="12">index.css</text>
+  <rect x="324" y="502" width="62" height="16" rx="6" fill="#32483E"/>
+  <text x="334" y="513" fill="#A5DEB5" font-family="JetBrains Mono, monospace" font-size="10">COMPLETED</text>
+  <text x="42" y="550" fill="#EDE7F7" font-family="JetBrains Mono, monospace" font-size="13">sed -n '4560,4625p' src/index.css</text>
+  <rect x="42" y="558" width="110" height="14" rx="6" fill="#20161B"/>
+  <text x="52" y="568" fill="#A89CB5" font-family="JetBrains Mono, monospace" font-size="10">~/code-console</text>
+  <rect x="160" y="558" width="38" height="14" rx="6" fill="#20161B"/>
+  <text x="170" y="568" fill="#A89CB5" font-family="JetBrains Mono, monospace" font-size="10">86510</text>
+  <rect x="204" y="558" width="26" height="14" rx="6" fill="#20161B"/>
+  <text x="212" y="568" fill="#A89CB5" font-family="JetBrains Mono, monospace" font-size="10">0ms</text>
+
+  <rect x="28" y="594" width="374" height="32" rx="8" fill="#17141A" stroke="#342731"/>
+  <text x="46" y="614" fill="#B3A9C4" font-family="JetBrains Mono, monospace" font-size="13">this video</text>
+
+  <text x="42" y="656" fill="#9487A5" font-family="JetBrains Mono, monospace" font-size="13">Writing response</text>
+  <rect x="32" y="646" width="12" height="12" rx="6" stroke="#6D5A86" stroke-width="1.5"/>
+
+  <rect x="28" y="688" width="374" height="86" rx="12" fill="#3A1A25" stroke="#6A3546"/>
+  <text x="40" y="710" fill="#D9CEDF" font-family="JetBrains Mono, monospace" font-size="14">Changing</text>
+  <text x="384" y="710" fill="#8E7D95" font-family="JetBrains Mono, monospace" font-size="13">2</text>
+  <rect x="42" y="728" width="104" height="28" rx="14" fill="#231923" stroke="#3B293A"/>
+  <text x="55" y="746" fill="#E7B642" font-family="JetBrains Mono, monospace" font-size="12">MOD</text>
+  <text x="94" y="746" fill="#EDE7F7" font-family="JetBrains Mono, monospace" font-size="12">index.css</text>
+  <rect x="156" y="728" width="164" height="28" rx="14" fill="#231923" stroke="#3B293A"/>
+  <text x="169" y="746" fill="#E7B642" font-family="JetBrains Mono, monospace" font-size="12">MOD</text>
+  <text x="208" y="746" fill="#EDE7F7" font-family="JetBrains Mono, monospace" font-size="12">WorkspaceShell.tsx</text>
+
+  <rect x="20" y="784" width="390" height="28" fill="#17141A"/>
+  <text x="30" y="802" fill="#7E748E" font-family="JetBrains Mono, monospace" font-size="11">Auto</text>
+  <text x="84" y="802" fill="#7E748E" font-family="JetBrains Mono, monospace" font-size="11">Plan</text>
+  <text x="140" y="802" fill="#7E748E" font-family="JetBrains Mono, monospace" font-size="11">Mention</text>
+  <text x="222" y="802" fill="#7E748E" font-family="JetBrains Mono, monospace" font-size="11">Files</text>
+  <text x="272" y="802" fill="#7E748E" font-family="JetBrains Mono, monospace" font-size="11">Image</text>
+  <text x="326" y="802" fill="#D3A2C3" font-family="JetBrains Mono, monospace" font-size="11">Shell</text>
+
+  <rect x="20" y="812" width="390" height="104" rx="10" fill="#17141A" stroke="#372B33"/>
+  <rect x="30" y="830" width="318" height="70" rx="8" fill="#1C171D" stroke="#473541"/>
+  <text x="42" y="870" fill="#6A6175" font-family="JetBrains Mono, monospace" font-size="14">Ask Nomadex... / for slash commands - @ mention...</text>
+  <rect x="362" y="838" width="30" height="54" rx="10" fill="#1F1419" stroke="#7B3348"/>
+  <text x="372" y="871" fill="#F6EAF3" font-family="JetBrains Mono, monospace" font-size="16">^</text>
+  <rect x="398" y="838" width="20" height="54" rx="10" fill="#2A141B" stroke="#A33A59"/>
+  <text x="404" y="871" fill="#FF6B89" font-family="JetBrains Mono, monospace" font-size="16">[]</text>
+
+  <text x="24" y="914" fill="#867A8C" font-family="JetBrains Mono, monospace" font-size="11">Shift+Enter</text>
+  <text x="132" y="914" fill="#867A8C" font-family="JetBrains Mono, monospace" font-size="11">Context 65.2k / 200k</text>
+  <rect x="316" y="902" width="44" height="18" rx="9" fill="#1F1B22" stroke="#393541"/>
+  <text x="324" y="914" fill="#A093A8" font-family="JetBrains Mono, monospace" font-size="10">5h 75%</text>
+  <rect x="364" y="902" width="50" height="18" rx="9" fill="#1F1B22" stroke="#393541"/>
+  <text x="371" y="914" fill="#A093A8" font-family="JetBrains Mono, monospace" font-size="10">Week 82%</text>
+</svg>