Components
Alert
Inline feedback, warnings and errors.
Usage
After the one-time setup, call the helper directly from ERB. No component import is needed.
<%= lc_alert "That name is already taken." %>Examples
Error
<%= lc_alert "That name is already taken." %>Success
<%= lc_alert "Changes saved.", tone: :success %>Title and actions
<%= lc_alert "Your card was declined. Update the payment method to keep the workspace active.", title: "Payment failed" do |alert| %>
<%= alert.actions do %>
<%= lc_button "Update payment", size: :sm %>
<%= lc_button "Dismiss", variant: :ghost, size: :sm %>
<% end %>
<% end %>API reference
Helpers render semantic HTML and include their interaction wiring. Pass native attributes through class:, data:, aria: and the usual Rails options. Blocks use captured ERB content.
lc_alert
lc_alert(message = nil, title: nil, tone: :destructive, **attributes, &block)| Input | Default | Values |
|---|---|---|
| message | nil | — |
| title | nil | — |
| tone | :destructive | :neutral · :primary · :success · :warning · :destructive |
| attributes | {} | Native HTML attributes; class:, data: and aria: merge with defaults |
| block | Captured block | Captured Rails ERB content |
lc_alert yields a builder, alert, with these parts. Each part carries data-slot and merges class: and native attributes.
alert.actions
alert.actions(**attributes, &block)| Input | Default | Values |
|---|---|---|
| attributes | {} | Native HTML attributes; class:, data: and aria: merge with defaults |
| block | Captured block | Captured Rails ERB content |
The examples also use lc_button. Each is documented on its own page.
Styling and extension
Use class: to merge utilities, native attributes for application behavior, and the theming guide for the shared palette. For custom markup, the advanced class helpers expose the same styles, including glass surfaces and class merging.