Vean Component Development

This skill is the single, self-contained source of truth for Vean component work. It owns pattern classification, phase order, layer rules, delivery surfaces, generation workflow, and the finish-stage checklist. Load it for any task that creates, migrates, extends, standardizes, fixes, or audits a Vean component.

For detailed rules, see layers.md (aria admission, implementation layers), surfaces.md (delivery surfaces), e2e.md (browser e2e testing), process.md (finish checklist and commit convention), and audit.md (assessment methodology, seven check dimensions, and regression flows for already-shipped components). For request shapes that trigger this skill, see EXAMPLES.md. TypeScript functional style and Vue SFC structure are owned by the global typescript-functional-style and vue-sfc-structure skills — load them directly; this skill does not restate their content.

Repository context

• Monorepo: pnpm workspaces (private root + 13 child workspaces: 10 packages + 2 apps + skills/)
• Stack: Vue 3 + TypeScript (strict) + UnoCSS + @soybeanjs/cva
• Architecture: aria / styled separation. Compile-time dependency is packages/ui -> packages/aria; aria never imports UI.
• @vean/aria (packages/aria/): Logic, state, a11y, structure. Zero styles.
• @vean/ui (packages/ui/): Styled wrappers. UnoCSS + cv() / scv(). S-prefixed components.
• @vean/docs (apps/docs/): ubean SSG (mode: 'ssg') with file routing, content collections, and built-in i18n (en + zh). NOT VitePress.

Quick start