Agent Skills Hub

react-ui-patterns

标准化的 React UI 模式，用于处理加载状态、错误处理与数据获取，确保一致的用户体验与稳固的组件架构。

router-query-integration

整合 TanStack Router 与 TanStack Query 以提升单页应用 (SPA) 效能，实现路由预加载、查询预获取与流畅的导航体验。

core-components

核心组件库与设计系统模式，通过设计令牌 (design tokens) 确保 UI 开发的一致性。

airiot-frontend

官方 AIRIOT 开发套件，用于构建基于 React、TypeScript 与 shadcn/ui 的应用程序，并集成实时平台功能。

draw-io

专门用于创建、编辑和维护 .drawio 流程图的技能。支持 XML 操作、排版优化、AWS 图标集成，以及文档自动化 PNG 转换。

web-component-design

掌握 React、Vue 和 Svelte 的组件驱动开发。学习进阶组合模式、CSS-in-JS 策略及用于可扩展 UI 设计系统的组件 API 设计。

nuxt-ui-v4

Nuxt UI v4 生产级组件库，包含 125+ 个可访问组件、Tailwind CSS v4、Reka UI，以及专为仪表板、AI 对话和编辑器设计的专业布局。

explaining-code

使用可视化图表、生活比喻、逐步导览与常见陷阱来解释代码。

shadcn-ui

实现 shadcn/ui 组件：包含安装、Vite/TanStack Router 配置、CLI 命令管理及 Tailwind CSS 集成。

webgl-expert

WebGL 1.0/2.0 开发专家指南：涵盖 GLSL 着色器、3D 图形、GPU 编程、渲染管线、缓冲区及 Web Canvas 性能优化。

Building Frontend Dashboards

使用 TypeScript、shadcn/ui、TanStack Query 和 Supabase 构建响应式 React 仪表板。适用于制作 KPI 卡片、数据表格、Recharts 图表及 event-studio 管理后台。

react-native

React Native 开发最佳实践，适用于 Expo 与原生项目。涵盖项目结构、路由导航、NativeWind 样式、平台特定代码及 TypeScript 整合。