skills.rest
dljsjr
dljsjrCOMMUNITY
Explore all skills by this author →
GitHub

tui

Guide developers in building TUI components for Sandpiper extensions.

Updated Mar 20, 2026
Search Tags:#notifications#widgets#tui#ui-patterns#renderers#sandpiper#dynamic-border
One-click install
npx skills add https://github.com/dljsjr/sandpiper-ai --skill tui-dljsjr
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tui
Source: https://github.com/dljsjr/sandpiper-ai/tree/main/skills/sandpiper/tui
Command: npx skills add https://github.com/dljsjr/sandpiper-ai --skill tui-dljsjr

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Helps developers design, implement, and debug TUI components in Sandpiper extensions by providing structured patterns, API usage guidance, and best practices for rich UI experiences.

Core Features & Use Cases

  • Guidance for using ctx.ui.notify, ctx.ui.setWidget, and pi.registerMessageRenderer to render and manage UI.
  • Techniques for adding dynamic borders, banners, and sticky widgets in extension UIs.
  • Patterns for safe, transient UI injection and custom rendering while avoiding persistence pitfalls.

Quick Start

Open the skill docs and start experimenting with TUI patterns to add and manage widgets in your Sandpiper extension.

Frequently Asked Questions about tui

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

FAQPage Schema
How do I build TUI components for Sandpiper extensions?▼

Building TUI components for Sandpiper extensions requires applying structured patterns for ctx.ui.notify, ctx.ui.setWidget, and custom message renderers to manage UI safely and predictably.

What is the best way to add dynamic borders and banners in Sandpiper?▼

Adding dynamic borders and banners in Sandpiper uses the DynamicBorder pattern and frontmatter-driven entry to inject rich UI elements. This technique allows safe, transient UI injection while avoiding persistence pitfalls.

How does custom message rendering work in Sandpiper extensions?▼

Custom message rendering in Sandpiper extensions works by calling pi.registerMessageRenderer to handle UI output. This pattern allows developers to safely inject custom rendering logic while avoiding persistence pitfalls in the extension lifecycle.

Can I use frontmatter-driven entry for Sandpiper extension UI?▼

Yes, you can use frontmatter-driven entry for Sandpiper extension UI. This approach manages how UI components are initialized and integrated, working alongside ctx.ui APIs and lifecycle guidance to ensure UI elements integrate safely and predictably.

Why do my Sandpiper widgets have persistence pitfalls during UI injection?▼

Persistence pitfalls during UI injection in Sandpiper widgets occur when transient UI elements are not managed correctly through their lifecycle. Using structured patterns for ctx.ui.setWidget and notify ensures safe, transient UI injection without unwanted state retention.

Related Skills

Explore More Software Engineering Skills→
ruskibeatsruskibeats

survey-pi-extension

Analyze Pi extension structure, entry points, and components.

Community
Intermediate
hussain9491hussain9491

building-chat-widgets

Create interactive AI chat widgets with client and server action handlers for widget-driven behavior.

Community
Advanced
Awais68Awais68

chatkit-widget

Integrate OpenAI/ChatKit chat widgets into Next.js/React applications with secure configuration.

Community
Advanced
msichtermanmsichterman

vercel-composition-patterns

Refactor React component libraries by replacing boolean props with composition patterns.

Community
Advanced