tui-basics

Create OpenCode TUI plugins with @opentui/solid and TuiPluginModule exports.

Updated Apr 12, 2026
One-click install
npx skills add https://github.com/xuezhaojun/oh-your-opencode --skill tui-basics
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: tui-basics
Source: https://github.com/xuezhaojun/oh-your-opencode/tree/main/.opencode/skills/tui-basics
Command: npx skills add https://github.com/xuezhaojun/oh-your-opencode --skill tui-basics

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Knowledge about OpenCode TUI plugins development — slots, commands, keybinds, routes, and the @opentui/solid rendering framework.

Core Features & Use Cases

OpenCode TUI plugins use @opentui/solid (SolidJS-based terminal UI framework) to render custom UI components. They are separate from server plugins — a single .tsx file exports a TuiPluginModule.

Quick Start

Create a minimal TUI plugin file that exports a TuiPluginModule and uses @opentui/solid to register a sample command.

Frequently Asked Questions about tui-basics

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build OpenCode TUI plugins with SolidJS?

To build OpenCode TUI plugins, create a single .tsx file that exports a TuiPluginModule and uses the @opentui/solid rendering framework to register custom UI components, commands, and keybinds.

What are slots, commands, and routes in OpenCode TUI development?

OpenCode TUI development uses slots, commands, and routes to structure terminal UI plugins. Slots define rendering areas, commands register actions, and routes map navigation within the @opentui/solid framework.

Do I need server plugins to create terminal UI components for OpenCode?

No, you do not need server plugins to create terminal UI components for OpenCode. TUI plugins are separate modules that export a TuiPluginModule and use the JSX pragma for rendering within the @opentui/solid framework.

How do I register a sample command in a TuiPluginModule?

To register a sample command in a TuiPluginModule, use the @opentui/solid framework to define the command within your .tsx file, ensuring you export the module correctly to integrate with the OpenCode TUI.

What is the best way to start developing terminal UI plugins for OpenCode?

The best way to start developing terminal UI plugins for OpenCode is to create a minimal .tsx file that exports a TuiPluginModule, uses the JSX pragma, and leverages the @opentui/solid framework to render a sample command.