interactive-input

Q: How do I install interactive-input?

Run npx skills add https://github.com/sugarforever/01coder-agent-skills --skill interactive-input in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/interactive-input/ (personal) or .claude/skills/interactive-input/ (project).

by sugarforeverFrontend & Design

Enables rich interactive UI components in chat responses. When presenting questions that require structured input (multiple choice, true/false, forms), embed interactive blocks that compatible clients render as native UI elements. Use when user asks for quizzes, exercises, surveys, or any structured input scenario.

Installs: 434
Last 24h: —
Trending rank: —
Security: Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/sugarforever/01coder-agent-skills --skill interactive-input

01
Install
Run the command in your project. The CLI asks which agents to install for.
02
Describe the task
Ask your agent for something this skill covers. It loads interactive-input automatically when relevant.
03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

Interactive Input Blocks

Embed interactive UI components (radio buttons, checkboxes, text fields, toggles) directly in chat responses. Compatible clients render these as native UI elements; other clients show a readable JSON code block as fallback.

When to Use

Quizzes and exercises (single/multiple choice, fill-in-the-blank)
Surveys and polls
Structured data collection (forms)
Any scenario where the user needs to select from options or provide structured input

How It Works

Wrap a JSON block in a ```interactive code fence within your normal markdown response. You can mix regular text and interactive blocks freely in the same message.

Schema Reference

See references/schema.md for the complete schema specification.

Quick Example

When presenting a multiple-choice question, instead of listing options as text:

Here's your first question:

```interactive
{
  "id": "q1",
  "card": {
    "body": [
      { "type": "TextBlock", "text": "What is the capital of France?", "weight": "bold" },
      { "type": "Input.ChoiceSet", "id": "answer", "style": "expanded",
        "choices": [
          { "title": "A. London", "value": "london" },
          { "title": "B. Paris", "value": "paris" },
          { "title": "C. Berlin", "value": "berlin" },
          { "title": "D. Madrid", "value": "madrid" }
        ]
      }
    ],
    "actions": [{ "type": "Action.Submit", "title": "Submit" }]
  }
}
```

Rules

Every interactive block MUST have a unique id field
Every interactive block MUST have at least one element in card.body
Include an Action.Submit in card.actions so the user can submit their response
Use "style": "expanded" for choice sets to show all options visually (recommended for quizzes)
Use "style": "compact" for dropdown selects when there are many options
Set "isMultiSelect": true on Input.ChoiceSet for multiple-choice questions
The first TextBlock in the body is used as the question label in the submitted response
You can include multiple interactive blocks in one message (e.g., a full quiz)
Always wrap the JSON in a ```interactive code fence — never use ```json for interactive blocks
Keep the JSON compact and valid — no comments, no trailing commas

FAQ

What does the interactive-input skill do?

How do I install interactive-input?

Run npx skills add https://github.com/sugarforever/01coder-agent-skills --skill interactive-input in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/interactive-input/ (personal) or .claude/skills/interactive-input/ (project).

Which AI agents can use interactive-input?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is interactive-input safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains interactive-input?

It is published by sugarforever in sugarforever/01coder-agent-skills. It has 434 recorded installs.