Introduction¶

DSH is positioned as “everything is a plugin,” meaning conversations, tools, and interfaces can all be extended by plugins. However, in standard conversations, the model typically provides a block of text. When you want the answer to include charts, cards, or interactive components, a pure text stream does not directly meet the need.

dsh-openui-studio is a plugin designed to address this problem. It is maintained by zouyao-andy, is listed under the client category, displays 0 stars on the directory page, and has an npm version of 0.1.2. Its approach is to add a triggerable /openui command to a standard DSH conversation: the model selected in the current session generates OpenUI Lang, which is validated by the official OpenUI chat library and then rendered into the conversation using the official OpenUI Renderer. Session management, reasoning, history, tool logs, and the input box are still handled by DSH; the plugin does not set up a separate interface.

Core Features¶

Below are the actual capabilities provided by the plugin, all derived from the repository README and package.json.

1. On-demand generation: OpenUI generation is only enabled in the turn where an explicit /openui request appears; normal messages still follow the standard DSH flow. Attachments are supported, and /openui requests with only attachments are also accepted.
2. Generation and validation: The agent calls openui_generate with session context. The result is first validated by the official OpenUI chat library; valid results are saved and displayed in the main conversation as DSH tool results. If validation fails for the first time, the plugin makes a repair call; if it still fails, DSH displays a tool error and does not save the unfinished interface.
3. Official rendering: Rendering uses the official OpenUI Renderer and style sheets; the plugin does not add its own conversation database, sidebar, input box, or DSH mode.
4. Result reuse: Saved results are rendered directly when reopening a conversation; no need to trigger another model call.
5. Retry on failure: When the model does not produce usable text, the tool error reports the stream end reason, chunk count, and raw text length, but does not record model content, nor will it automatically retry in the current /openui turn.
6. Buttons do not auto-send: Buttons in the OpenUI answer only fill the suggested question into the DSH input box and focus on it, without automatically sending the message.

Layer-by-Layer Redraw and Replay¶

The new answer uses the Swarm Rebuild engine to rebuild the rendered OpenUI DOM layer by layer: drawing frames, entering text, placing media, copying duplicate elements, resizing, and using alignment guides. Replay scrolls through unfinished work within the conversation, then returns to the real-time OpenUI answer; the viewport follows active elements, with dense paragraphs slowed down and sparse paragraphs sped up. At the transition point, when the conversation reaches the end of the answer, it briefly cross-fades to the real-time page. Replay starts from the readable answer content; there is no pure cursor opening animation.

Saved answers open immediately. Clicking the replay icon next to OpenUI Studio rebuilds it once without regenerating; clicking the canvas or pressing Escape returns to the interactive answer. Replay is skipped if the system requests fewer dynamic effects or if the new answer completes in the DSH background. Switching themes during playback returns to the real-time answer.

The animation only takes snapshots of the rendered OpenUI DOM; it does not modify the OpenUI Lang result, nor does it append records to the conversation.

Rendering Configuration¶

The rendering layer can be customized by editing render.js. It can be opened by clicking the configuration icon next to OpenUI Studio in DSH, or by editing the file directly. The file exports a JavaScript object with the following configuration items:

The css string contains typography variables like --openui-studio-font, --openui-studio-body-size, --openui-studio-body-leading, --openui-studio-heading-size, etc. Custom selectors must be placed under .openui-answer or .openui-native to avoid affecting DSH itself. These settings only change rendering and controls, not the LLM prompt or saved answers. After editing render.js, you need to completely exit and reopen DSH; no build or model call is required. Invalid configurations will fall back to built-in defaults and report an error next to the answer title.

Model Invocation Configuration¶

Model invocation parameters are placed separately in cordis.patch.yml, with fields for provider, model, maxTokens, temperature, reasoningEffort, maxQuestionChars, and promptSuffix.

Leaving model and generation-related configurations as null will use the current DSH session’s request settings. When the session has no token budget, the plugin reads the selected model’s defaultMaxTokens; if this value does not exist, it is left to DSH to decide. Non-null values in the plugin override the corresponding session settings. maxQuestionChars limits the length of the question sent to the generator, and promptSuffix appends environment-related descriptions to the generated official OpenUI prompt. The base prompt and validation schema still come from the installed OpenUI package. DSH needs to be restarted after modifying plugin configuration. The profile’s cordis.patch.yml is applied after the plugin bundle, so these fields can be overridden without modifying the plugin source code. Interface controls follow DSH language, and answer text follows the question language.

Installation and Enablement¶

The official installation method is to enter the plugin identifier in DSH’s plugin management interface. Steps are as follows.

1. Install DSH and select a default model in Settings → Models.
2. Enter dsh-openui-studio in Settings → Plugins → Add plugin; you can also install directly from the GitHub repository.
3. Completely exit and reopen DSH after installation or update.
4. Enter the command in a Standard or PTC conversation, for example:

/openui Explain KV cache memory usage with a chart and a worked example

Animation Diagnosis¶

To troubleshoot replay issues, you can enable debug logging.

1. Set toolbar to ['replay', 'debug', 'download-log'] in render.js and restart DSH.
2. Click the bug icon next to OpenUI Studio; replay will log block, cursor, animation, scroll, and finish events simultaneously.
3. Click the download icon after the replay ends to save the JSON log.

The log contains time and geometric information, but not answer text, and does not require the DevTools Console. Debug and download buttons are hidden by default.

Local Development¶

Local development requires Node.js 20 or higher.

git clone https://github.com/zouyao-andy/dsh-openui-studio.git
cd dsh-openui-studio
npm ci
npm run build

Then install this directory as a local bundle via the DSH plugin manager. Local checkout and npm package use the same plugin ID, so you must remove the old @local/dsh-openui-studio before adding a new installation.

npm test
npm run test:render
npm run build

Source code responsibilities: src/host/index.js handles commands, gated tools, model invocation, and OpenUI validation; src/client/chat-answer.js puts saved results into DSH turns; src/client/native-answer.js uses the official Renderer and style sheets; src/client/swarm-reveal.js connects the answer to the adapted Swarm Rebuild engine src/client/vendor/swarm-rebuild.js. Previous drawing strategy files are kept for comparison but are no longer used. scripts/gen.mjs generates the official OpenUI prompt and schema, and scripts/build.mjs generates the Host index.js and Client client.js bundle. DSH needs to be restarted and rebuilt after modifying the plugin source code.

Applicable Scenarios and Notes¶

Suitable for developers who are already building conversational tools or content displays in DSH and want answers with interactive interfaces, as well as plugin authors who want to incorporate OpenUI Lang generation into existing sessions rather than separate interfaces.

Several points need attention: The plugin runs with the permissions of the current DSH process; you should check the source code and license before installing. Generated results depend on the model selected in the current session, output token budget, and reasoning intensity. Normal conversation flow is not changed when there is no explicit /openui request. The official renderer version does not support early custom Stack answers. The license is MIT, and the drawing engine is adapted from Swarm Rebuild (commit 601f6e2), also MIT.

Conclusion¶

DSH delegates interface rendering to plugins, and dsh-openui-studio incorporates “generating OpenUI answers and on-demand redrawing” into a single conversation while keeping session management with DSH. The directory page is an independent site with no official affiliation to DeepSeek / Magic Square.

• Directory page: https://www.skillhub.cn/plugins/zouyao-andy/dsh-openui-studio
• Repository: https://github.com/zouyao-andy/dsh-openui-studio