Class: Shadcn::AvatarComponent

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

Overview

Avatar component for user profile images Matches shadcn/ui Avatar component

Examples:

Basic avatar with image

<%= render Shadcn::AvatarComponent.new(src: user.avatar_url, alt: user.name) %>

With fallback

<%= render Shadcn::AvatarComponent.new(src: user.avatar_url, alt: user.name, fallback: user.initials) %>

Different sizes

<%= render Shadcn::AvatarComponent.new(src: url, alt: name, size: :sm) %>
<%= render Shadcn::AvatarComponent.new(src: url, alt: name, size: :lg) %>

With slot-based fallback

<%= render Shadcn::AvatarComponent.new(size: :sm) do |avatar| %>
  <% avatar.with_fallback { "JD" } %>
<% end %>

Constant Summary collapse

SIZES = 
{
  sm: "h-8 w-8 text-xs",
  default: "h-10 w-10 text-sm",
  lg: "h-12 w-12 text-base",
  xl: "h-16 w-16 text-lg"
}.freeze
BASE_CLASSES = 
"relative flex shrink-0 overflow-hidden rounded-full"
IMAGE_CLASSES = 
"aspect-square h-full w-full"
FALLBACK_CLASSES = 
"flex h-full w-full items-center justify-center rounded-full bg-muted"

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(src: nil, alt: "", fallback: nil, size: :default, **options) ⇒ AvatarComponent

Returns a new instance of AvatarComponent.

Parameters:

  • src (String, nil) (defaults to: nil) —

    Image URL

  • alt (String) (defaults to: "") —

    Alt text for the image

  • fallback (String, nil) (defaults to: nil) —

    Fallback text when image fails to load

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

    Avatar size (:sm, :default, :lg, :xl)



41
42
43
44
45
46
47
 
# File 'app/components/shadcn/avatar_component.rb', line 41

def initialize(src: nil, alt: "", fallback: nil, size: :default, **options)
  super(**options)
  @src = src
  @alt = alt
  @fallback = fallback || generate_fallback(alt)
  @size = size.to_sym
end