skills.rest
ahostbr
ahostbrCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ls-generative-ui

Render interactive widgets inline in chat via prompt_widget and render_widget protocols.

Updated Aug 5, 2026
Search Tags:#chat widgets#generative ui#interactive forms#inline charts#prompt confirmations#dashboard layouts#sandbox html
One-click install
npx skills add https://github.com/ahostbr/liteharness --skill ls-generative-ui
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ls-generative-ui
Source: https://github.com/ahostbr/liteharness/tree/main/liteharness/catalog/skills/ls-generative-ui
Command: npx skills add https://github.com/ahostbr/liteharness --skill ls-generative-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill solves the problem of turning chat-only responses into interactive, user-driven UI elements that can collect input or display rich visuals inline.

Core Features & Use Cases

  • prompt_widget for user input: Creates interactive widgets that block until the user acts, returning a structured {action, data} result for confirmations, forms, and picks.
  • render_widget for inline displays: Sends fire-and-forget widget content like charts, dashboards, stat cards, and summaries without requiring a user response.
  • Three rendering bands (catalog, specs, html): Uses themed components when possible (catalog), multi-component layouts for complex dashboards (specs), and self-contained custom visuals/interactivity when needed (html).

Quick Start

Ask for an inline confirmation by calling prompt_widget with type set to catalog and component set to genui.Button (for example, a “Confirm” button) so the user’s click returns the tool result.

Frequently Asked Questions about ls-generative-ui

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

FAQPage Schema
How do I render interactive widgets inside a chat interface?▼

To render interactive widgets in chat, use prompt_widget to block for user input like confirmations and forms, or render_widget for fire-and-forget inline displays like charts and dashboards without requiring a response.

Can I display inline charts and dashboard layouts directly in chat messages?▼

Yes, inline charts and dashboard layouts are supported using the specs rendering band for multi-component layouts or the html band for self-contained custom visuals and sandboxed interactions.

What's the best way to collect user confirmations and form selections during a chat flow?▼

The best way to collect confirmations and selections is calling prompt_widget with type set to catalog and a component like genui.Button, which blocks execution and returns a structured action and data result.

Does generative UI for chat require specific protocols for HTML widget interactions?▼

Yes, interactive HTML widgets require exact widget-response postMessage protocol handling along with prompt_widget request fields including type, requestId, and agentId to process sandboxed custom interactions properly.

When should I use sandboxed HTML widgets instead of catalog components for chat UI?▼

Use sandboxed HTML widgets when custom visuals or complex interactions exceed standard catalog components, otherwise rely on themed catalog components or multi-component specs for structured dashboard layouts.

Related Skills

Explore More Design & Creative Skills→
forcedotcomforcedotcom
803

embedded-agent

Integrate Salesforce Agentforce chat into React applications with configurable rendering.

Official
Advanced
umbracoumbraco
26

umbraco-collection-action

Generate Umbraco backoffice collection action manifest and class files.

Official
Intermediate
pch007pch007
1

react-native

Render JSON-driven UI specifications as native React Native components.

Community
Advanced
minicooheiminicoohei
345

interactive-dashboard-builder

Build self-contained interactive HTML dashboards with Chart.js charts and filters.

Community
Intermediate