Packages
phoenix_webcomponent
2.7.0
3.2.4
3.2.3
3.2.2
3.2.1
3.2.0
3.1.5
3.1.4
3.1.3
3.1.2
3.1.1
3.1.0
2.8.0
2.7.0
2.6.0
2.5.4
2.5.3
2.5.2
2.5.1
2.5.0
2.4.0
2.3.6
2.3.5
2.3.4
2.3.3
2.3.2
2.3.1
2.2.3
2.2.2
2.2.1
2.2.0
2.1.4
2.1.3
2.1.2
2.1.1
2.1.0
2.0.0
1.6.3
1.6.2
1.6.1
1.6.0
1.5.1
1.5.0
1.4.5
1.4.4
1.4.3
1.4.2
1.4.1
1.4.0
1.3.0
1.2.0
1.1.1
1.1.0
1.0.0
1.0.0-beta.4
1.0.0-beta.3
1.0.0-beta.2
0.0.0
Phoenix view functions for working with WebComponent
Current section
Files
Jump to
Current section
Files
lib/phoenix_webcomponent/card.ex
defmodule Phoenix.WebComponent.Card do
@moduledoc """
Render card.
"""
use Phoenix.WebComponent, :html
# alias Phoenix.LiveView.JS
@doc """
Generates card
## Example
<.wc_card>
<:title>
Star Wars
</:title>
Star Wars is an American epic space opera multimedia
franchise created by George Lucas,
which began with the eponymous 1977 film and
quickly became a worldwide pop-culture phenomenon.
</.wc_card>
"""
@doc type: :component
attr(:id, :any,
default: false,
doc: """
html attribute id
"""
)
attr(:class, :string,
default: "",
doc: """
html attribute class
"""
)
slot(:title,
required: false,
doc: """
Render a card title.
"""
)
def wc_card(assigns) do
assigns =
assigns
|> assign_new(:title, fn -> nil end)
~H"""
<div
id={@id}
class={[
"m-4 p-6 flex flex-col",
"bg-white shadow",
@class
]}
>
<div
:for={{title, _i} <- Enum.with_index(@title)}
class={[
"w-full text-xl",
"flex flex-row justify-start items-center",
"h-10 mb-4",
Map.get(title, :class, ""),
]}
>
<%= render_slot(title) %>
</div>
<%= render_slot(@inner_block) %>
</div>
"""
end
end