Current section

Files

Jump to
doggo lib doggo components box.ex
Raw

lib/doggo/components/box.ex

defmodule Doggo.Components.Box do
@moduledoc false
@behaviour Doggo.Component
use Phoenix.Component
@impl true
def doc do
"""
Renders a box for a section on the page.
"""
end
@impl true
def usage do
"""
Minimal example with only a box body:
```heex
<.box>
<p>This is a box.</p>
</.box>
```
With title, banner, action, and footer:
```heex
<box>
<:title>Profile</:title>
<:banner>
<img src="banner-image.png" alt="" />
</:banner>
<:action>
<button_link patch={~p"/profiles/\#{@profile}/edit"}>Edit</button_link>
</:action>
<p>This is a profile.</p>
<:footer>
<p>Last edited: <%= @profile.updated_at %></p>
</:footer>
</box>
```
"""
end
@impl true
def config do
[
type: :layout,
since: "0.6.0",
maturity: :developing,
modifiers: []
]
end
@impl true
def attrs_and_slots do
quote do
slot :title, doc: "The title for the box."
slot :inner_block,
required: true,
doc: "Slot for the content of the box body."
slot :action, doc: "A slot for action buttons related to the box."
slot :banner,
doc: "A slot that can be used to render a banner image in the header."
slot :footer, doc: "An optional slot for the footer."
attr :rest, :global, doc: "Any additional HTML attributes."
end
end
@impl true
def init_block(_opts, _extra) do
[]
end
@impl true
def render(assigns) do
~H"""
<section class={@class} {@rest}>
<header :if={@title != [] || @banner != [] || @action != []}>
<h2 :if={@title != []}><%= render_slot(@title) %></h2>
<div :if={@action != []} class={"#{@base_class}-actions"}>
<%= for action <- @action do %>
<%= render_slot(action) %>
<% end %>
</div>
<div :if={@banner != []} class={"#{@base_class}-banner"}>
<%= render_slot(@banner) %>
</div>
</header>
<%= render_slot(@inner_block) %>
<footer :if={@footer != []}>
<%= render_slot(@footer) %>
</footer>
</section>
"""
end
end