用途:该技能用于生成企业级 Web 应用,采用 Backstage Design System,适合管理后台、开发者工具、内部应用与数据管理界面。
主要能力:技术栈为 React 18+ 与 TypeScript,组件基于 Radix UI 无头原语,样式使用 Tailwind CSS,变体通过 Class Variance Authority(CVA)实现类型安全;表单采用 React Hook Form 配合 Zod 校验,图标使用 Lucide React。组件采用复合组件模式(如 Card 含 CardHeader、CardTitle、CardDescription、CardAction、CardContent、CardFooter),并通过 data-slot 属性统一标识与样式。
主题与设计:提供品牌色 11 级色阶与语义化颜色令牌,支持明暗两种模式(通过 [data-theme='dark'] 切换);字体方面正文使用 Poppins,标题使用 Instrument Serif,标题中的介词使用斜体;排版与间距基于 4px 基准单位。响应式采用移动优先,断点为 sm 640px、md 768px、lg 1024px、xl 1280px、2xl 1536px,侧边栏在移动端转为抽屉。
无障碍与表单:基于 Radix UI 提供 ARIA 支持,包含键盘导航、焦点管理与焦点陷阱;表单通过 FormField 模式集成校验与错误提示。
状态与性能:支持组件本地状态、Context 共享状态与 URL 状态管理(筛选、搜索、分页);性能方面支持路由懒加载与 Suspense、useMemo/useCallback/memo 记忆化,以及 react-window 虚拟滚动处理大列表。
测试:提供组件测试(Testing Library)与无障碍测试(jest-axe)模式。
限制:资料未提供安装命令、具体版本号、收费方式、平台支持范围或实际生成效果说明,这些信息暂未提供。