Ask
A questionnaire wrap with review, cancel, auto-advance, and HITL-shaped results for AI SDK addToolOutput.
Built on shadcn Questionnaire. Distributed as a shadcn registry block from GitHub.
Default
Next and Submit. Other is a row — Enter commits, it is not an answer while typing.
Installation
npx shadcn@latest add layishsieger/registry/askThe CLI copies the block into your project. You own the source.
Usage
import { Ask } from "@/components/ask"
const items = [
{
name: "direction",
title: "Which direction?",
required: true,
choices: [
{ value: "clarify", label: "Ask a clarifying question" },
{ value: "draft", label: "Draft a first version" },
],
},
]
export function Example() {
return (
<Ask
items={items}
onResult={(result) => {
// HITL: addToolOutput({ output: result })
}}
/>
)
}onResult is the HITL payload. Submit returns { status: "submitted", answers }. Cancel returns { status: "canceled" }. Pass that object to addToolOutput({ output }).
Auto-advance
First pick auto-advances. Other Enter commits and advances. After Back, Next comes back.
Review
Set review on the batch. Last-slide auto-advance and Other commit go to review, not submit.
Cancel
Set cancel on the batch. Confirm before discarding answers.
AI SDK HITL
onResult is the tool output. The host passes it to addToolOutput.
API
Ask
| Prop | Type | Default |
|---|---|---|
| items | AskItem[] | — |
| onResult | (result) => void | — |
| review | boolean | false |
| cancel | boolean | false |
| shortcuts | "numbers" | "letters" | false | "numbers" |
| autoAdvanceDelay | number | 380 |
| item / onItemChange | controlled navigation | — |