PUI.Avatar (pui v1.0.0)

Copy Markdown

An avatar with a host-controlled fallback.

Avatar renders an image when src is present and the fallback when it is not. It deliberately does not add a JavaScript error handler; applications that need a fallback after a failed remote image request can own that behavior through the forwarded global attributes.

Examples

<.avatar src={@user.avatar_url} alt={@user.name} fallback_text="SC" />

<.avatar alt="Team" size="lg">
  <:fallback>TM</:fallback>
</.avatar>

Attributes

NameTypeDefaultDescription
srcstringnilImage source; fallback renders when absent
altstring""Image alternative text
fallback_textstringnilText shown when no image exists
sizestring"default""sm", "default", or "lg"
classstring""Additional CSS classes
restglobalGlobal HTML attributes

Slots

SlotRequiredDescription
fallbacknoCustom fallback content

Summary

Functions

avatar(assigns)

Attributes

  • src (:string) - Defaults to nil.
  • alt (:string) - Defaults to "".
  • fallback_text (:string) - Defaults to nil.
  • size (:string) - Defaults to "default". Must be one of "sm", "default", or "lg".
  • class (:string) - Defaults to "".
  • Global attributes are accepted.

Slots

  • fallback