Class: UI::Avatar

Inherits:
Phlex::HTML
  • Object
show all
Includes:
AvatarBehavior
Defined in:
app/components/ui/avatar.rb

Overview

Avatar - Phlex implementation

Displays an image element with a fallback for representing users. Uses AvatarBehavior module for shared styling logic.

Based on shadcn/ui Avatar: https://ui.shadcn.com/docs/components/avatar Based on Radix UI Avatar: https://www.radix-ui.com/primitives/docs/components/avatar

Examples:

Basic usage

render UI::Avatar.new do
  render UI::Image.new(src: "https://github.com/shadcn.png", alt: "User")
  render UI::Fallback.new { "CN" }
end

Instance Method Summary collapse

Methods included from AvatarBehavior

#avatar_classes, #avatar_data_attributes, #avatar_html_attributes

Constructor Details

#initialize(classes: "", **attributes) ⇒ Avatar

Returns a new instance of Avatar.

Parameters:

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

    Additional CSS classes to merge

  • attributes (Hash) —

    Additional HTML attributes



21
22
23
24
# File 'app/components/ui/avatar.rb', line 21

def initialize(classes: "", **attributes)
  @classes = classes
  @attributes = attributes
end

Instance Method Details

#view_template(&block) ⇒ Object



26
27
28
29
30
# File 'app/components/ui/avatar.rb', line 26

def view_template(&block)
  span(**avatar_html_attributes.deep_merge(@attributes)) do
    yield if block_given?
  end
end