Alert Edit

Displays a callout for user attention

Examples

Did you know?

You can wrap shadcn helpers in any component library you want!

<%= render_alert title: "Did you know?",
      description: "You can wrap shadcn helpers in any component library you want!" %>

Installation


rails generate shadcn-ui alert

Usage

<%= render_alert title:, description:, variant: %>

The Alert component introduces:

app/helpers/components/alert_helper.rb
app/views/components/ui/_alert.html.erb

The method render_alert defined in app/helpers/components/alert_helper.rb accepts a title: and description: required keyword arguments along with an optional variant: argument for the kind of alert to render. Skip the icon by setting the optional argument icon: to false.

Success

This variant is :success


<%= render_alert(variant: :success, title: "Success",
    description: "This variant is :success") %>

Info

This variant is :info


<%= render_alert(variant: :info, title: "Info",
    description: "This variant is :info") %>

Attention

This variant is :attention


<%= render_alert(variant: :attention, title: "Attention",
    description: "This variant is :attention") %>

Error

This variant is :error, :danger, :alert, :destructive

<%= render_alert(variant: :error, title: "Error",
    description: "This variant is :error, :danger, :alert, :destructive") %>

Skip the Icon

By setting icon: to false in your render_alert call.

<%= render_alert icon: false,
      title: "Skip the Icon",
      description: "By setting icon: to false in your render_alert call." %>

Getting Started

Components