Agent Skills
› kokonut-labs/kokonutui
kokonut-labs/kokonutui
GitHub指导构建现代、可访问且可组合的UI组件，涵盖原型开发、无障碍实现、设计令牌设置及npm发布等全流程。
Install All Skills
npx skills add kokonut-labs/kokonutui --all -g -y
Skills in Collection (10)
指导构建现代、可访问且可组合的UI组件，涵盖原型开发、无障碍实现、设计令牌设置及npm发布等全流程。
构建新的UI组件
实现无障碍功能
创建可组合的组件API
设置设计令牌和主题系统
向npm发布组件
npx skills add kokonut-labs/kokonutui --skill building-components -g -y
指导创建独特、生产级的前端界面，避免通用AI美学。适用于构建Web组件、页面、海报或应用，强调大胆的设计方向和精致的视觉细节。
用户要求构建网页组件或页面
需要美化或设计Web UI
npx skills add kokonut-labs/kokonutui --skill frontend-design -g -y
提供 Next.js 开发最佳实践指南，涵盖文件约定、RSC 边界、异步模式、运行时选择、错误处理、数据获取及性能优化等核心规则，用于规范代码编写与审查。
Next.js 项目代码审查
Next.js 新功能开发与架构设计
排查 RSC 或异步 API 相关错误
npx skills add kokonut-labs/kokonutui --skill next-best-practices -g -y
Next.js 16+ 缓存组件技能，支持 PPR 混合静态、缓存与动态内容。涵盖启用配置、use cache 指令、cacheLife 生命周期及 cacheTag 失效机制，用于优化前端渲染性能与数据缓存策略。
需要配置 Next.js 缓存组件
使用 use cache 指令优化异步数据渲染
设置 cacheLife 或 cacheTag 管理缓存
npx skills add kokonut-labs/kokonutui --skill next-cache-components -g -y
指导将 Next.js 项目升级至最新版本，包括检测当前版本、查阅官方迁移指南、执行 codemods、更新依赖及测试构建。
用户要求升级 Next.js
检测到 Next.js 版本过旧
npx skills add kokonut-labs/kokonutui --skill next-upgrade -g -y
提供React组件组合模式指南，用于重构含布尔属性的复杂组件、构建可复用库及设计灵活API。涵盖复合组件、状态提升与React 19新特性，提升代码可维护性。
重构包含大量布尔属性的组件
构建可复用的组件库
审查或设计组件架构
使用复合组件或上下文提供者
npx skills add kokonut-labs/kokonutui --skill vercel-composition-patterns -g -y
提供React和Next.js性能优化指南，涵盖消除瀑布流、包体积优化及服务端渲染等规则，用于指导代码编写、审查与重构。
编写或重构React组件
优化Next.js页面性能
数据获取策略审查
Bundle体积优化
npx skills add kokonut-labs/kokonutui --skill vercel-react-best-practices -g -y
提供React Native和Expo应用的开发最佳实践，涵盖性能优化、动画实现、UI模式及原生模块配置等规则，旨在指导构建高性能移动端应用。
构建React Native或Expo应用
优化列表滚动性能
实现Reanimated动画
处理原生模块或字体配置
npx skills add kokonut-labs/kokonutui --skill vercel-react-native-skills -g -y
用于审查前端 UI 代码是否符合 Web 界面指南，支持访问性检查和设计审计。通过获取最新规范并比对文件，输出格式化的问题报告。
review my UI
check accessibility
audit design
review UX
check my site against best practices
npx skills add kokonut-labs/kokonutui --skill web-design-guidelines -g -y
指导通过 shadcn CLI 或 MCP 服务器发现、安装和读取 KokonutUI React 组件，支持自动解析依赖并编辑源码。
用户需要集成特定 UI 组件
用户希望使用 shadcn 管理前端组件库
npx skills add kokonut-labs/kokonutui --skill install-kokonutui-component -g -y
