AgentSkillsCN

component-guide

在管理指南页面中注册 UI 组件,并为每个组件配备独立的标签页,分别展示来自真实示例文件的样例输出与源代码。在新增或更新任何共享组件时使用。

SKILL.md
--- frontmatter
name: component-guide
description: Register UI components in the admin guide page with per-component tabs for sample output and source code loaded from real example files. Use when adding or updating any shared component.

Component Guide

  • Add component examples under packages/ui/src/examples.
  • Regenerate snippet registry using pnpm snippets.
  • Register each example in apps/admin/app/guide/page.tsx.
  • Keep two tabs per component: Sample and Code.
  • Never paste manual snippets when source can be auto-loaded.
  • Ensure examples demonstrate composable props and state handoff.