interactive-widgets

Generate validated JSON widget descriptors for streaming interactive UI in AI conversations.

Updated Apr 2, 2026
One-click install
npx skills add https://github.com/ssssssssassssss/disease-risk-classifier --skill interactive-widgets-ssssssssassssss
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: interactive-widgets
Source: https://github.com/ssssssssassssss/disease-risk-classifier/tree/main/.claude/skills/20-interactive-widgets
Command: npx skills add https://github.com/ssssssssassssss/disease-risk-classifier --skill interactive-widgets-ssssssssassssss

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

AI conversation systems are often limited to static text or images and cannot provide interactive, actionable UIs inside the conversation. This Skill enables backends and frontends to cooperate so AI responses can include dynamic widget descriptors, stream them to clients, and accept secure user interactions without context switching.

Core Features & Use Cases

  • Streaming Widget Descriptors: Produce validated JSON widget descriptors (chart, table, form, card, navigation) that can be streamed alongside text responses.
  • Action & RBAC Handling: Define actions with permission controls (API calls, downloads, navigation, form submits) and validate them server-side to prevent unauthorized operations.
  • Frontend Rendering Patterns: Guidance and Flutter renderer patterns for dynamically building interactive widgets, handling touch/mouse events, drill-downs, and exports.
  • Use Case: Turn a sales query into an interactive chart with drill-down and export buttons streamed to a Flutter chat UI.

Quick Start

Generate a streaming chart widget for "Show Q2 sales by region" that includes drill-down and export actions.

Frequently Asked Questions about interactive-widgets

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

FAQPage Schema
How do I stream interactive widgets inside an AI conversation stream?

Streaming interactive widgets involves producing validated JSON widget descriptors for charts, tables, or forms, then sending them over WebSocket or Nexus connections to render dynamically in the frontend.

What are interactive widget descriptors and how do they work with Flutter?

Interactive widget descriptors are validated JSON definitions of UI components like charts or tables that Flutter frontends dynamically render, handling touch events, drill-downs, and exports directly within the chat interface.

How do I enforce RBAC for actions triggered by interactive UI components in a streaming AI chat?

You enforce RBAC for interactive UI actions by defining permission controls for API calls, downloads, and form submits within the widget descriptor, then validating them server-side to prevent unauthorized operations.

Can I turn a natural language query into an interactive chart with drill-down actions in Flutter?

Yes, you can turn a natural language query into an interactive chart by generating a streaming widget descriptor that includes drill-down and export actions, which the Flutter frontend renders dynamically.

Does this approach support streaming structured UI responses like tables and forms over WebSocket?

Yes, this approach supports streaming structured UI responses by producing validated JSON descriptors for charts, tables, and forms, then streaming them over WebSocket or Nexus to the client.