thesysdev/open-intelligent-ui

选用指南

AI 根据 README 整理 · 2026/10/17 06:01:01

使用方式

通过npm安装并运行开发服务器，在浏览器中访问本地地址进行使用。

查看 README 依据

```bash cp .env.example .env npm install npm run generate:apiKey # writes THESYS_API_KEY to .env npm run dev ``` Open http://localhost:3000 and try: `I'm in San Francisco for a day, plan a sightseeing route for me` | Variable | Required | Purpose | | --- | --- | --- | | `THESYS_API_KEY` | Yes, unless using a direct API | OpenUI Cloud (Gateway) key, used only on the server. | | `THESYS_MODEL` | No | A `{provider}/{model}` id. Defaults to `openai/gpt-6.1-sol`. | | `THESYS_BASE_URL` | No | The Gateway's Responses endpoint. Defaults to `https://api.thesys.dev/v1/embed`. |

部署要求

需要Node 24，并配置THESYS_API_KEY（除非使用直接API）。可选配置本地模型（Ollama）或任意OpenAI兼容API。

查看 README 依据

`@StartOf`) and data for dashboards (`@GroupBy`, `@Pivot`, `@Top`, `@Between`, `@Bucket`, `@Cumulative`, `@MovingAvg`, `@Change`, `@Histogram`, `@Stats`). A bad argument makes a call evaluate to null, as in 1.0. - **Actions:** `@CopyToClipboard(text)`, for copying a shopping list or a split. The dev-only page `/gallery` renders hand-written programs: a working answer for each of the 16 Intelligent UI examples (from the 7-speed bike to the arcade game), two dashboards over demo data, the prompt's worked examples, and programs that exercise every component. ## Setup Requires Node 24.

```bash cp .env.example .env npm install npm run generate:apiKey # writes THESYS_API_KEY to .env npm run dev ``` Open http://localhost:3000 and try: `I'm in San Francisco for a day, plan a sightseeing route for me` | Variable | Required | Purpose | | --- | --- | --- | | `THESYS_API_KEY` | Yes, unless using a direct API | OpenUI Cloud (Gateway) key, used only on the server. | | `THESYS_MODEL` | No | A `{provider}/{model}` id. Defaults to `openai/gpt-6.1-sol`. | | `THESYS_BASE_URL` | No | The Gateway's Responses endpoint. Defaults to `https://api.thesys.dev/v1/embed`. |

| `LLM_BASE_URL` | No | Use any OpenAI-compatible Chat Completions API directly instead of Cloud, e.g. `https://openrouter.ai/api/v1`; see [Use any OpenAI-compatible API](#use-any-openai-compatible-api). | | `LLM_API_KEY` | With `LLM_BASE_URL` | That API's key. | | `LLM_MODEL` | With `LLM_BASE_URL` | The model id it serves, e.g. `openai/gpt-6.1-sol` on OpenRouter. | | `LLM_REASONING_EFFORT` | No | Reasoning effort for both paths. Defaults to `low` (about five times faster to the first line of UI on gpt-6.1-sol, same quality); `default` sends none. |

已知限制

本地模型无输出校正，渲染结果可能不完美；地图数据仅提供道路概览，非步行或公交路线；聊天界面仅支持浅色主题。

查看 README 依据

OLLAMA_CONTEXT_LENGTH=32768 ollama serve ``` or create a model variant with a larger window and use its name as `OLLAMA_MODEL`: ```bash printf 'FROM qwen3.8:27b\nPARAMETER num_ctx 32768\n' > Modelfile ollama create qwen3.8-32k -f Modelfile ``` 3. In `.env`, set `MODEL_PROVIDER=ollama` (and `OLLAMA_MODEL` to use another model), then `npm run dev`. What changes with a local model: - **No output correction.** Gateway validates and corrects the generated OpenUI Lang; locally, the model's output is rendered as written, so larger models give better results.

- **Map data.** Street geometry comes from `/api/street-route`, which validates input and caches results from the public OSRM demo server's driving profile: a road overview, not walking or transit directions. When it's unavailable, a labelled direct connection is drawn instead. - **Theme.** Colors, type, radii and spacing are tokens in `src/lib/components/theme.css`, with a dark set under `data-theme="dark"` that only `/gallery` and `/preview` use. The chat shell keeps its `AgentInterface` theme from `src/lib/response-theme.ts`. ## Project structure | File | Purpose | | --- | --- |

The model streams OpenUI Lang 1.0, and the app renders it with a library of primitives the model arranges itself: no layout is fixed in the components. The library (`src/lib/library.ts`, components in `src/lib/components/`) follows the Open Intelligent UI design. The components have light and dark tokens, but only `/gallery` (and the benchmark's `/preview`) switch to dark; the chat is light only: - **Layout:** `Col`, `Row`, `Box` (background, radius, border, sizes, flex), `Grid`, `Card`, `Carousel` (a scrolling, snapping row), `Popover`, `Divider`, `Spacer`.