Agent skill
reusable-components
Biblioteca de componentes Blade do sistema Easy Budget. Use esta skill sempre que precisar gerar interfaces (UI), formulários, tabelas, modais ou dashboards. Ela garante que o código gerado siga o padrão visual do projeto, utilizando a sintaxe <x-componente> em vez de HTML/Bootstrap puro
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/reusable-components
SKILL.md
Diretrizes de UI do Easy Budget (Laravel Blade Components)
Você deve atuar como um especialista em Frontend para o sistema Easy Budget. Sempre dê preferência ao uso destes componentes Blade (<x-nome-do-componente>) em vez de escrever HTML ou classes Bootstrap puras.
📦 1. Componentes Base (Estrutura e Navegação)
Botões (x-button)
Use para ações, links e submissões.
- Props:
variant(primary, secondary, danger, success),outline(bool),icon(bi-*),size(sm, lg),type(button, link, submit),href,label. - Exemplo:
<x-button variant="primary" icon="plus" label="Novo" />
Cabeçalho de Página (x-page-header)
Use no topo de todas as páginas principais.
- Props:
title,icon,breadcrumbItems(array ['Nome' => 'Rota']). - Exemplo:
<x-page-header title="Produtos" icon="box" :breadcrumb-items="['Dashboard' => route('dashboard'), 'Produtos' => '#']" />
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?