PhoenixImage.Component (phx_image v0.1.0)

Next.js-like image function component for Phoenix templates.

Import this module and use:

<.image src="/images/logo.png" alt="Logo" width={240} height={120} />

Summary

image(assigns)

Returns normalized <img> attributes for the given image assigns.

src (:string) (required)
alt (:string) (required)
width (:integer) - Defaults to nil.
height (:integer) - Defaults to nil.
fill (:boolean) - Defaults to false.
sizes (:string) - Defaults to nil.
quality (:integer) - Defaults to nil.
format (:string) - Defaults to "webp". Must be one of "webp", "avif", "jpg", or "png".
loading (:string) - Defaults to "lazy". Must be one of "lazy", or "eager".
preload (:boolean) - Defaults to false.
unoptimized (:boolean) - Defaults to false.
upscale (:boolean) - Defaults to false.
path (:string) - Defaults to nil.
allowed_hosts (:list) - Defaults to nil.
Global attributes are accepted.

Returns normalized <img> attributes for the given image assigns.