# Erinrugas Artisan Agents Vue Component > UI Component Skill - Skill: `tomevault-io/erinrugas-artisan-agents-vue-component` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/erinrugas-artisan-agents-vue-component` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/erinrugas-artisan-agents-vue-component/raw - Safety review: pending (external: skill-scanner PASS, skillspector PASS) - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Web & Frontend - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/erinrugas-artisan-agents-vue-component --- # UI Component Skill ## When to Apply - User asks for frontend component/page work. - Existing UI needs refactor into reusable units. ## Workflow 1. Read UI constraints from `specs/ui-spec.md` and `specs/specs.md`. 2. Detect project UI stack and conventions from repository. 3. Implement component/page with: - clear props/contracts - typed state/events - loading/error/empty states - accessibility basics (labels, focus, landmarks) 4. Reuse existing design system/component primitives first. ## Quality Bar - No `any` unless unavoidable and justified. - Avoid duplicated business logic in view components. - Keep components composable and testable. --- > Converted and distributed by [TomeVault](https://tomevault.io/claim/erinrugas) — claim your Tome and manage your conversions.