PhoenixKit.Modules.Shared.Components.Image (phoenix_kit v1.7.71)

Copy Markdown View Source

Image component with lazy loading and responsive sizing.

Supports both direct URLs and PhoenixKit Storage file UUIDs with automatic variant selection.

Usage

With direct URL:

<Image src="/path/to/image.jpg" alt="Description" />

With PhoenixKit Storage file UUID:

<Image file_uuid="018e3c4a-9f6b-7890-abcd-ef1234567890" alt="Description" />
<Image file_uuid="018e3c4a-9f6b-7890-abcd-ef1234567890" file_variant="thumbnail" alt="Description" />

Attributes

  • src - Direct image URL (takes precedence over file_uuid)
  • file_uuid - PhoenixKit Storage file UUID
  • file_variant - Storage variant to use (default: "original")
    • Images: "original", "thumbnail", "small", "medium", "large"
  • alt - Alt text for accessibility (required)
  • class - Additional CSS classes (optional)

Summary

Functions

render(assigns)

Functions

render(assigns)

Attributes

  • attributes (:map) - Defaults to %{}.
  • variant (:string) - Defaults to "default".
  • content (:string) - Defaults to nil.