Corex.Image (Corex v0.1.0)

View Source

Data struct for image slides in Corex.Carousel.

Not a Phoenix component — there is no <.image> function. Use Corex.Image.new/2 to build items for a carousel image gallery; the carousel renders each entry as a plain HTML <img>. For custom slide markup (cards, blog posts, mixed content), pass arbitrary items and use <:item :let={item}> on <.carousel> instead.

Fields

FieldTypeRequiredDescription
srcString.t()yesImage URL or path (e.g. from ~p"/images/photo.jpg")
altString.t()noAccessible alternative text (defaults to "")
classString.t()noOptional class on the rendered <img>

Examples

iex> Corex.Image.new("/images/beach.jpg", alt: "Beach")
%Corex.Image{src: "/images/beach.jpg", alt: "Beach", class: nil}

iex> Corex.Image.new("/images/logo.png", alt: "Logo", class: "rounded-md")
%Corex.Image{src: "/images/logo.png", alt: "Logo", class: "rounded-md"}
<.carousel
  class="carousel"
  items={[
    Corex.Image.new(~p"/images/beach.jpg", alt: "Beach"),
    Corex.Image.new(~p"/images/fall.jpg", alt: "Fall")
  ]}
>
  <:prev_trigger><.heroicon name="hero-arrow-left" /></:prev_trigger>
  <:next_trigger><.heroicon name="hero-arrow-right" /></:next_trigger>
</.carousel>

Summary

Functions

Builds an image slide value for carousel items.

Types

t()

@type t() :: %Corex.Image{alt: String.t(), class: String.t() | nil, src: String.t()}

Functions

new(src, opts \\ [])

@spec new(
  String.t(),
  keyword()
) :: t()

Builds an image slide value for carousel items.

Examples

Corex.Image.new(~p"/images/beach.jpg", alt: "Beach")