rails-viewcomponentslisted
Install: claude install-skill mickzijdel/rails-toolkit
# Rails ViewComponents
## Overview
ViewComponents are Ruby objects that render HTML. Think of them as "ActiveRecord for UI" — they bring testability, explicit interfaces, and reuse to view code that would otherwise be scattered across partials.
## When to Use
- Replacing a partial that has grown logic or conditional rendering
- A UI pattern appears in 3+ places (three-instance rule before extracting)
- The view needs unit-testable behaviour
- You want an explicit, typed interface instead of implicit local assigns
**Keep as a partial when:** it's simple, single-use, and has no logic.
## Component Types
| Type | Purpose | Example |
|------|---------|---------|
| **General-purpose** | Reusable UI pattern | `ButtonComponent`, `CardComponent` |
| **Domain-specific** | Wraps a model into a general component | `User::AvatarComponent` → `DesignSystem::AvatarComponent` |
Extract general-purpose components only after they're proven useful in multiple contexts — "good frameworks are extracted, not invented."
## File Structure
```
app/components/
button_component.rb
button_component.html.erb
user/
avatar_component.rb
avatar_component.html.erb
```
## Defining a Component
Make the component the **single source of truth** for its styling: keep the class map in a
constant and resolve it through one method — never scatter `btn btn-*` shims across views.
```ruby
class ButtonComponent < ViewComponent::Base
VARIANT_CLASSES = {
primary: "bg-blue-600 text-white h