Class: Shadcn::ToastComponent

Inherits:
BaseComponent
  • Object
show all
Defined in:
app/components/shadcn/toast_component.rb

Overview

Toast component for notifications Matches shadcn/ui Toast component Uses Stimulus for interactivity

Examples:

Basic toast (typically rendered via JavaScript/Turbo)

<%= render Shadcn::ToastComponent.new(variant: :default) do |toast| %>
  <% toast.with_title { "Scheduled" } %>
  <% toast.with_description { "Your message has been scheduled." } %>
<% end %>

Destructive toast

<%= render Shadcn::ToastComponent.new(variant: :destructive) do |toast| %>
  <% toast.with_title { "Error" } %>
  <% toast.with_description { "Something went wrong." } %>
  <% toast.with_action(alt_text: "Try again") do %>
    <%= render Shadcn::ButtonComponent.new(variant: :outline, size: :sm) { "Try again" } %>
  <% end %>
<% end %>

Constant Summary collapse

VARIANTS = 
{
  default: "border bg-background text-foreground",
  destructive: "destructive group border-destructive bg-destructive text-destructive-foreground"
}.freeze
BASE_CLASSES = 
"group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md border p-4 pr-6 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full"

Instance Attribute Summary

Attributes inherited from BaseComponent

#class_name, #data, #html_options

Instance Method Summary collapse

Methods inherited from BaseComponent

#content

Methods included from Rails::Helpers::ClassNameHelper

#cn

Constructor Details

#initialize(variant: :default, duration: 5000, open: true, **options) ⇒ ToastComponent

Returns a new instance of ToastComponent.

Parameters:

  • variant (Symbol) (defaults to: :default) —

    Toast variant (:default, :destructive)

  • duration (Integer) (defaults to: 5000) —

    Auto-dismiss duration in ms (0 for no auto-dismiss)

  • open (Boolean) (defaults to: true) —

    Whether toast is visible



45
46
47
48
49
50
 
# File 'app/components/shadcn/toast_component.rb', line 45

def initialize(variant: :default, duration: 5000, open: true, **options)
  super(**options)
  @variant = variant.to_sym
  @duration = duration
  @open = open
end