A lightweight, embeddable Web Component that connects directly to an OpenCode Server. Real-time streaming of model output, reasoning, and tool calls — in any page, with any framework.
| Attribute | Type | Default | Description |
|---|---|---|---|
| server-url | string | http://localhost:4096 | OpenCode Server base URL |
| agent | string | plan | Agent name to use |
| title | string | Assistant | Sidebar header title |
| theme | editorial | bank | business | loglens | editorial | Built-in visual theme. Omit for default. |
| open | boolean | false | Sidebar visibility |
| hide-toggle | boolean | false | Hide the built-in lower-right launcher button when using a custom trigger. |
| show-history | boolean | true | Show session history panel |
| Method | Description |
|---|---|
| .open() | Open the sidebar |
| .close() | Close the sidebar |
| .toggle() | Toggle sidebar visibility |
| .sendPrompt(text) | Send a prompt to the active session |
| .abortSession() | Abort the current generation |
| .addPromptBlock(block) | Inject a prompt block (text/capsule) into the input area |
| .removePromptBlock(i) | Remove a prompt block by index |
| .clearPromptBlocks() | Clear all prompt blocks |
| .createNewSession() | Create a new session and switch to it |
| Event | Description |
|---|---|
| opencode:connected | Server connection established |
| opencode:error | Error occurred (detail: message, error) |
Include the script and drop the element into any page. The component connects via SSE for real-time streaming of messages, reasoning steps, and tool calls.
<script src="opencode-assistant.iife.js"></script>
<opencode-assistant server-url="http://localhost:4096"
agent="plan" title="Assistant"></opencode-assistant>
The input supports mixed Chinese/English composition: Enter sends,
Shift+Enter inserts a newline, and composition confirmation is not sent.