Changelog

现在，所有 shadcn 组件都会从 cn 软件包导入 cn。

多年来，每个 shadcn 项目都会在 lib/utils.ts 中以相同的五行代码开始：导入 clsx 和 twMerge，将它们组合起来，再导出为 cn。这种方式可行，但需要两个依赖项，还得将辅助函数复制到每个项目和每个注册表中。

我们已将这部分功能移入独立软件包。cn 可直接替代 twMerge(clsx(...))。它更小、速度更快，并提供相同的 API，因此调用处无需更改。

Copyimport { cn } from "cn"
 
;<div className={cn("flex items-center", className)} />

变更内容#

• 注册表组件、区块和示例现在从 cn 导入 cn，而不是从 @/lib/utils 导入。
• npx shadcn init 会安装 cn，并生成只有一行内容的 lib/utils.ts。
• 每个使用 cn 的注册表项都会将其声明为依赖项，因此 npx shadcn add 也会在本次变更之前创建的项目中安装它。

lib/utils.ts#

utils 注册表项仍然存在。它现在会重新导出 cn，让你自己的代码继续正常工作，同时仍为项目辅助函数保留统一入口。

Copyexport { cn } from "cn"

现有项目#

现有功能不会受影响。你的 lib/utils.ts 会继续工作，新组件会在其旁边安装 cn。如需迁移项目的其余部分并移除 clsx 和 tailwind-merge，请运行以下迁移：

pnpmnpmyarnbun
pnpm dlx shadcn@latest migrate cn
Copy

该迁移会重写导入，将 twMerge(clsx(...)) 调用替换为 cn(...)，并在旧软件包不再被引用时将其移除。详情请参阅 CLI 文档。

现在，GitHub 注册表已支持私有仓库。

今年 6 月，我们让任何公共 GitHub 仓库都可以作为注册表。团队希望内部代码也能这样使用，例如不适合公开的设计系统、功能套件、代理规则和项目约定。

现在，你可以从私有仓库安装内容。只要你有权读取仓库，CLI 就可以从中安装。

pnpmnpmyarnbun
pnpm dlx shadcn@latest add acme/internal-toolkit/auth-kit
Copy

零配置#

如果你已经登录 GitHub CLI，就不需要额外配置。

Copygh auth login

如果仓库无法公开读取，CLI 会通过 gh 使用已保存的凭据读取仓库。令牌保留在 GitHub CLI 内，不会进入 shadcn 进程。

Copy✔ Using gh credentials.
✔ Checking registry.
✔ Created 1 file:
  - lib/auth.ts

CI 支持#

未安装 GitHub CLI 时，请设置 GH_TOKEN 或 GITHUB_TOKEN：

CopyGH_TOKEN=github_pat_xxx npx shadcn@latest add acme/internal-toolkit/auth-kit

我们建议使用范围限定到该仓库、具有 Contents: Read-only 权限的细粒度个人访问令牌。

支持所有命令#

私有仓库支持与公共 GitHub 注册表相同的命令。

pnpmnpmyarnbun
pnpm dlx shadcn@latest list acme/internal-toolkit
Copy

pnpmnpmyarnbun
pnpm dlx shadcn@latest search acme/internal-toolkit --query auth
Copy

pnpmnpmyarnbun
pnpm dlx shadcn@latest view acme/internal-toolkit/auth-kit
Copy

pnpmnpmyarnbun
pnpm dlx shadcn@latest registry validate acme/internal-toolkit
Copy

工作原理#

• 公共仓库仍与之前一样以匿名方式读取，不使用凭据，也不会调用 GitHub CLI。
• CLI 会先尝试匿名访问，只有仓库无法公开读取时才会使用你的凭据。
• 私有文件通过 GitHub Contents API 读取，并固定到已解析出的 commit SHA。
• GH_TOKEN 中的令牌只会发送到 api.github.com。已保存的 GitHub CLI 凭据由 gh 读取，而不是由 CLI 读取。

完整指南请参阅私有仓库文档。

@shadcn/helpers 现在可以为 AI SDK 模拟人在回路中的流程。一个 脚本化的对话可以暂停以等待真实用户输入，等待审批，并根据用户的决定继续。

所有内容都会通过真实的 useChat 生命周期进行流式传输，因此你的工具卡片、审批提示和问题流程 表现会与生产环境中的完全一致。

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."
    )
  })

传入 needsApproval，即可在用户做出决定之前暂停。审批通过后，脚本化输出 会继续流式传输，而拒绝则会自动流式传输。

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.

现在，注册表可以在服务器端处理搜索。

运行 shadcn search 时，CLI 会将搜索参数作为查询参数转发到你的 注册表：

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

返回匹配的项目以及一个 pagination 对象，CLI 会原样使用你的搜索结果。这让大型注册表的搜索速度更快：不再需要下载完整目录后再进行搜索。

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

动态搜索是可选功能。静态注册表会忽略查询参数，无需任何更改即可继续运行。

请参阅动态搜索文档，了解完整指南。