class Ariadne::UI::Avatar::Component
[Learn more about best image practices (WAI Images)](www.w3.org/WAI/tutorials/images/)
rather than ‘@kittenuser`.
if `Avatar` is a link to a user profile, the alt attribute should be `@kittenuser profile`
If the avatar functions as a link, provide alt text that helps convey the function. For instance,
Images should have text alternatives that describe the information or function represented.
@accessibility
A component that can represent a user or entity with an image or initials.
def badge_classes
def badge_classes merge_tailwind_classes([badge_position_classes, badge_style_classes]) end
def badge_position_classes
def badge_position_classes position_classes = { top_right: "ariadne:-top-1 ariadne:-right-1", top_left: "ariadne:-top-1 ariadne:-left-1", bottom_right: "ariadne:-bottom-1 ariadne:-right-1", bottom_left: "ariadne:-bottom-1 ariadne:-left-1", } # Apply size-specific adjustments with class-based approach for badge sizing size_classes = case size when :xs, :sm "ariadne:h-3 ariadne:w-3 ariadne:text-[8px]" when :md "ariadne:h-4 ariadne:w-4 ariadne:text-[10px]" when :lg, :xl "ariadne:h-5 ariadne:w-5 ariadne:text-xs" else "ariadne:h-4 ariadne:w-4 ariadne:text-[10px]" end # Add border to make badge stand out against avatar "#{position_classes[badge_position]} #{size_classes} ariadne:ring-1 ariadne:ring-white ariadne:dark:ring-gray-800 ariadne:rounded-full ariadne:flex ariadne:items-center ariadne:justify-center ariadne:overflow-hidden" end
def badge_style_classes
def badge_style_classes [ "ariadne:absolute", "ariadne:bg-white", "ariadne:p-0.5", "ariadne:leading-[0]", ] end
def before_render
def before_render validate! # must be done here rather than within an `accepts_html_attributes` block # because it's dependewnt on `with_badge_*` slot's existence, which isn't known until now html_attrs[:class] = merge_tailwind_classes([style(size:, shape:, has_src: src.present?, has_badge: badge), html_attrs[:class]].join(" ")) # One char long or two len = [:xs, :sm, :md].include?(size) ? 0 : 1 @placeholder_text = (text || "").strip.split[0..len].map { |word| word.capitalize[0] }.join html_attrs[:aria] = merge_aria( html_attrs, { aria: { label: text || alt, }, } ) end
def validate!
def validate! ArgumentError, "Must provide either `text` or `src`" if @text.blank? && @src.blank? ArgumentError, "Must provide only `text` or `src`, not both" if @text.present? && @src.present? ArgumentError, "Must provide `alt` text when `src` is provided" if @src.present? && @alt.blank? ge? && !BADGE_POSITIONS.include?(badge_position) e ArgumentError, "Invalid badge position: #{badge_position}. Must be one of: #{BADGE_POSITIONS.join(", ")}"