PhoenixPaper.Skeleton (PhoenixPaper v0.1.0)

Copy Markdown View Source

A placeholder loading shape (pp_skeleton/1), in the spirit of MUI's Skeleton — a text line, a circular avatar outline, or a rectangular block, with a pulsing or shimmering animation while real content loads.

<.pp_skeleton />
<.pp_skeleton variant="circular" width={40} height={40} />
<.pp_skeleton variant="rectangular" height={120} />
<.pp_skeleton animation="wave" />
<.pp_skeleton animation="none" />

width/height accept a bare integer (read as pixels) or any CSS length string (e.g. "100%", "12rem") — rendered as inline style, not a Tailwind class, since arbitrary numbers can't be literal class names (see AGENTS.md's "Tailwind class safety").

Summary

Functions

Renders a skeleton placeholder. See the module doc.

Functions

pp_skeleton(assigns)

Renders a skeleton placeholder. See the module doc.

Attributes

  • paperize (:boolean) - Defaults to true.
  • variant (:string) - Defaults to "text". Must be one of "text", "circular", "rectangular", or "rounded".
  • width (:any) - an integer (px) or a CSS length string. Defaults to nil.
  • height (:any) - an integer (px) or a CSS length string. Defaults to nil.
  • animation (:string) - Defaults to "pulse". Must be one of "pulse", "wave", or "none".
  • class (:any) - Defaults to nil.
  • Global attributes are accepted.