Changelog

@shadcn/helpers can now mock human-in-the-loop flows for the AI SDK. A scripted conversation can pause for real user input, wait for an approval, and continue with whatever the user decided.

Everything streams through the real useChat lifecycle, so your tool cards, approval prompts, and question flows behave exactly as they would in production.

Copyimport { createChat } from "@shadcn/helpers/ai-sdk"
 
const chat = createChat<ChatMessage>()
  .user("Help me plan the next prototype.")
  .assistant(({ writer }) => {
    writer.text("A couple of questions before I start.")
    writer.tool("askQuestions", { input: { questions } })
  })
  .assistant(({ writer, toolCall }) => {
    writer.text(
      toolCall?.name === "askQuestions" && toolCall.output
        ? `Starting with ${toolCall.output.answers.direction}.`
        : "Starting now."
    )
  })

Pass needsApproval to pause behind the user's decision. The scripted output streams after approval, and denial streams automatically.

Copychat
  .assistant(({ writer }) => {
    writer.text("That will archive 3 drafts. I need your approval.")
    writer.tool("archiveDrafts", {
      input: { count: 3 },
      needsApproval: true,
      output: { archived: 3 },
    })
  })
  .assistant(({ writer, toolCall }) => {
    writer.text(
      toolCall?.approved ? "Archived 3 drafts." : "Okay, leaving them in place."
    )
  })

Today, we're releasing Questionnaire, a new component for multi-step question flows. Use it for agent clarification prompts, onboarding, surveys, intake forms, and configuration.

Questionnaire is available for Base UI, React Aria, and Radix across all eight styles.

"use client"

import * as React from "react"

Features#

• Single and multiple selection with native radios and checkboxes.
• Freeform answers alongside fixed choices.
• Explicit skipping for optional questions.
• Previous, next, submit, and custom progress controls.
• Required and custom validation.
• Controlled navigation, saved defaults, and conditional questions.
• Keyboard navigation with optional letter or number shortcuts.
• Native form serialization and server-rendered collection state.
• Standalone, Card, and Dialog composition.

Installation#

pnpmnpmyarnbun
pnpm dlx shadcn@latest add questionnaire
Copy

@shadcn/react#

The <Questionnaire /> component is also available as an unstyled headless primitive in @shadcn/react. Read the docs to learn more.

Registries can now handle search server-side.

When you run shadcn search, the CLI forwards the search parameters to your registry as query params:

CopyGET /r/registry.json?q=button&limit=50&offset=0

Return the matching items with a pagination object and the CLI uses your results as-is. This makes search fast for large registries: no more downloading the full catalog to search it.

Copy{
  "name": "acme",
  "homepage": "https://acme.com",
  "items": [
    {
      "name": "button",
      "type": "registry:ui",
      "description": "A button component."
    }
  ],
  "pagination": {
    "total": 12,
    "offset": 0,
    "limit": 1,
    "hasMore": true
  }
}

Dynamic search is opt-in. Static registries ignore the query params and keep working without any changes.

See the Dynamic Search docs for the full guide.

A new Toast component is now available for Base UI projects. It supports actions, status types, promises, stacking, and swipe dismissal.

"use client"

import { Button } from "@/components/ui/button"

Add it to your project with the CLI:

pnpmnpmyarnbun
pnpm dlx shadcn@latest add toast
Copy

React Aria is now a first-class component base in shadcn/ui.

Build with React Aria Components alongside Base UI and Radix. Pick it in shadcn/create or initialize a project with --base aria. The CLI handles the dependencies, registry resolution, styles, and component installation.

What's New#

• A first-class React Aria base - Choose React Aria anywhere you can choose Base UI or Radix, including the CLI, presets, and shadcn/create.
• Full component documentation - React Aria components have dedicated installation, usage, composition, examples, and API reference sections.
• All eight styles - Use React Aria with Vega, Nova, Maia, Lyra, Mira, Luma, Rhea, or Sera.
• Base-specific output - React Aria state selectors and dependencies are scoped to the Aria registry. Existing Base UI and Radix components are unchanged.

Start with React Aria#

Use the aria base when initializing a project:

pnpmnpmyarnbun
pnpm dlx shadcn@latest init --base aria
Copy

Or choose React Aria in shadcn/create. Once the project is initialized, shadcn add installs the React Aria implementation for each component.

Base UI remains the default, and Radix remains fully supported. Existing projects stay on their current base.