用途:为 json-render 提供预构建的 shadcn/ui 组件定义与实现,共 36 个组件,基于 Radix UI 与 Tailwind CSS。适合为 catalog 添加标准 UI 组件、构建 Web 界面。
两个入口:@json-render/shadcn/catalog 导出 shadcnComponentDefinitions,为目录 schema,无 React 依赖,可安全用于服务端;@json-render/shadcn 导出 shadcnComponents,为 React 实现。
用法:从标准定义中按需挑选组件,不要一次性展开全部定义。用 defineCatalog 与 defineRegistry 分别选取定义与对应实现;catalog 与 registry 中的组件需一一对应。可混入自定义组件,自定义项用 z.object 定义 props 并加 description。
内置动作:setState、pushState、removeState、validateForm 由 React schema 内置,ActionProvider 自动处理,无需在 catalog 声明。表单组件支持 checks(类型与消息对)校验,并用 validateOn 控制时机:change(Select、Checkbox、Radio、Switch 默认)、blur(Input、Textarea 默认)、submit。事件方面,输入类发出 change/submit/focus/blur,按钮发出 press,选择类发出 change/select。
组件类别:布局(Card、Stack、Grid、Separator)、导航(Tabs、Accordion、Collapsible、Pagination)、浮层(Dialog、Drawer、Tooltip、Popover、DropdownMenu)、内容(Heading、Text、Image、Avatar、Badge、Alert、Carousel、Table)、反馈(Progress、Skeleton、Spinner)、输入(Button、Link、Input、Textarea、Select、Checkbox、Radio、Switch、Slider、Toggle、ToggleGroup、ButtonGroup)。
限制:组件使用 Tailwind CSS 类,应用需已配置 Tailwind;组件实现使用打包的 shadcn/ui 原语,而非应用的 components/ui/;/catalog 入口无 React 依赖,可用于服务端提示词生成。其余收费、平台等信息暂未提供。