# VelvetKit

## Divider (`UI::Divider`)

A horizontal or vertical rule, optionally labelled.

Add it: `bin/rails generate velvetkit:add divider`

### Arguments

```ruby
UI::Divider.new(orientation: :horizontal, label: nil, class: nil, **html_attrs)
```

### Example: Horizontal

```erb
<div class="space-y-4">
  <%= render(UI::Divider.new) %>
  <p class="text-sm text-muted-foreground">Content between dividers</p>
  <%= render(UI::Divider.new) %>
</div>
```

### Example: Vertical

```erb
<div class="flex gap-4 h-32">
  <div class="flex-1 bg-muted/50 rounded p-4">
    <p class="text-sm">Left content</p>
  </div>
  <%= render(UI::Divider.new(orientation: :vertical)) %>
  <div class="flex-1 bg-muted/50 rounded p-4">
    <p class="text-sm">Right content</p>
  </div>
</div>
```

### Example: With Label

```erb
<div class="space-y-4">
  <%= render(UI::Divider.new(label: "OR")) %>
  <%= render(UI::Divider.new(label: "Section Divider")) %>
  <%= render(UI::Divider.new(label: "Continue")) %>
</div>
```