Class: Primer::AvatarStackComponent

Inherits:
Component
  • Object
show all
Defined in:
app/components/primer/avatar_stack_component.rb

Overview

Use AvatarStack to stack multiple avatars together.

Constant Summary collapse

ALIGN_DEFAULT =
:left
ALIGN_OPTIONS =
[ALIGN_DEFAULT, :right].freeze

Constants included from Status::Dsl

Status::Dsl::STATUSES

Constants included from ViewHelper

ViewHelper::HELPERS

Constants included from TestSelectorHelper

TestSelectorHelper::TEST_SELECTOR_TAG

Constants included from FetchOrFallbackHelper

FetchOrFallbackHelper::InvalidValueError

Instance Method Summary collapse

Methods included from JoinStyleArgumentsHelper

#join_style_arguments

Methods included from TestSelectorHelper

#add_test_selector

Methods included from FetchOrFallbackHelper

#fetch_or_fallback, #fetch_or_fallback_boolean, #silence_deprecations?

Methods included from ClassNameHelper

#class_names

Constructor Details

#initialize(align: ALIGN_DEFAULT, tooltipped: false, body_arguments: {}, **system_arguments) ⇒ AvatarStackComponent

Returns a new instance of AvatarStackComponent.

Examples:

Default

<%= render(Primer::AvatarStackComponent.new) do |c| %>
  <%= c.avatar(src: "http://placekitten.com/200/200", alt: "@kittenuser") %>
  <%= c.avatar(src: "http://placekitten.com/200/200", alt: "@kittenuser") %>
  <%= c.avatar(src: "http://placekitten.com/200/200", alt: "@kittenuser") %>
<% end  %>

Align right

<%= render(Primer::AvatarStackComponent.new(align: :right)) do |c| %>
  <%= c.avatar(src: "http://placekitten.com/200/200", alt: "@kittenuser") %>
  <%= c.avatar(src: "http://placekitten.com/200/200", alt: "@kittenuser") %>
  <%= c.avatar(src: "http://placekitten.com/200/200", alt: "@kittenuser") %>
<% end  %>

With tooltip

<%= render(Primer::AvatarStackComponent.new(tooltipped: true, body_arguments: { label: 'This is a tooltip!' })) do |c| %>
  <%= c.avatar(src: "http://placekitten.com/200/200", alt: "@kittenuser") %>
  <%= c.avatar(src: "http://placekitten.com/200/200", alt: "@kittenuser") %>
  <%= c.avatar(src: "http://placekitten.com/200/200", alt: "@kittenuser") %>
<% end  %>

Parameters:

  • align (Symbol) (defaults to: ALIGN_DEFAULT)

    <%= one_of(Primer::AvatarStackComponent::ALIGN_OPTIONS) %>

  • tooltipped (Boolean) (defaults to: false)

    Whether to add a tooltip to the stack or not.

  • body_arguments (Hash) (defaults to: {})

    Parameters to add to the Body. If ‘tooltipped` is set, has the same arguments as <%= link_to_component(Primer::TooltipComponent) %>.

  • system_arguments (Hash)

    <%= link_to_system_arguments_docs %>



41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
# File 'app/components/primer/avatar_stack_component.rb', line 41

def initialize(align: ALIGN_DEFAULT, tooltipped: false, body_arguments: {}, **system_arguments)
  @align = fetch_or_fallback(ALIGN_OPTIONS, align, ALIGN_DEFAULT)
  @system_arguments = system_arguments
  @tooltipped = tooltipped
  @body_arguments = body_arguments

  @body_arguments[:tag] ||= :div
  @body_arguments[:classes] = class_names(
    "AvatarStack-body",
    @body_arguments[:classes]
  )

  @system_arguments[:tag] ||= :div
  @system_arguments[:classes] = class_names(
    "AvatarStack",
    system_arguments[:classes],
    "AvatarStack--right" => @align == :right
  )
end

Instance Method Details

#before_renderObject



69
70
71
72
73
74
75
# File 'app/components/primer/avatar_stack_component.rb', line 69

def before_render
  @system_arguments[:classes] = class_names(
    @system_arguments[:classes],
    "AvatarStack--two" => avatars.size == 2,
    "AvatarStack--three-plus" => avatars.size > 2
  )
end

#body_componentObject



61
62
63
64
65
66
67
# File 'app/components/primer/avatar_stack_component.rb', line 61

def body_component
  if @tooltipped
    Primer::TooltipComponent.new(**@body_arguments)
  else
    Primer::BaseComponent.new(**@body_arguments)
  end
end

#render?Boolean

Returns:

  • (Boolean)


77
78
79
# File 'app/components/primer/avatar_stack_component.rb', line 77

def render?
  avatars.any?
end