SuperAPI AI 工具集

ark-ui

前端与建站

查看项目

更新于 10-15 21:40

技能介绍

用途:Ark UI 是 Zag.js 之上的 headless / unstyled 组件库,只提供组件行为与无障碍能力,不含样式,可作为 Chakra UI v3 的无头实现基础,支持 React、Solid、Vue、Svelte。若需在自有设计系统中手动加样式可用本技能;若想直接用 Chakra 样式系统,则参考 chakra-ui 技能。

主要能力:通过 asChild 将行为接入任意元素或设计系统;提供 RootProvider 管理外部状态;用 createListCollection、createTreeCollection 构建数据集合。组件覆盖表单(Checkbox、Slider、Number Input、Tags Input、File Upload、Color Picker 等)、集合类(Select、Combobox、Tree View、Menu、Carousel、Pagination、Steps)、浮层(Dialog、Drawer、Popover、Tooltip、Toast、Tour)、折叠披露(Accordion、Tabs、Toggle、Splitter、Scroll Area)、日期时间(Date Picker、Date Input、Timer)、展示(Avatar、Progress、QR Code、Clipboard、Marquee)以及工具(EnvironmentProvider、LocaleProvider、格式化、Focus Trap、Presence、Highlight、JSON Tree View)。

使用方式:资料按 overview、guides、collections、components、utilities、samples、scripts 组织。先按任务在映射表中定位分类,再读该分类 README 找到目标页,最后读取对应 .md 获取细节。guides 涵盖 data-scope/data-part/data-state 样式约定、asChild 组合、组件状态、动画、表单集成与 ref;samples 提供 Provider 设置、Panda CSS/Tailwind 样式、RootProvider 外部状态、React Hook Form 集成等示例;scripts 含安装、MCP Server 与 llms.txt 获取命令。

适用场景:需要无样式、可访问、跨框架的组件原语,并希望自行控制样式与设计系统时。

限制:资料未提供具体安装命令、版本号、收费与价格信息,暂未提供;具体 API 细节需查阅对应参考页。