Packages
corex
0.1.0-alpha.30
0.1.2
0.1.1
0.1.0
0.1.0-rc.1
0.1.0-rc.0
0.1.0-beta.5
0.1.0-beta.4
0.1.0-beta.3
0.1.0-beta.2
0.1.0-beta.1
0.1.0-alpha.33
0.1.0-alpha.32
0.1.0-alpha.31
0.1.0-alpha.30
0.1.0-alpha.29
0.1.0-alpha.28
0.1.0-alpha.27
0.1.0-alpha.26
0.1.0-alpha.25
0.1.0-alpha.24
0.1.0-alpha.23
0.1.0-alpha.22
0.1.0-alpha.21
0.1.0-alpha.20
0.1.0-alpha.19
0.1.0-alpha.18
0.1.0-alpha.17
0.1.0-alpha.16
0.1.0-alpha.15
0.1.0-alpha.14
0.1.0-alpha.13
0.1.0-alpha.12
0.1.0-alpha.11
0.1.0-alpha.10
0.1.0-alpha.9
0.1.0-alpha.8
0.1.0-alpha.7
0.1.0-alpha.6
0.1.0-alpha.5
0.1.0-alpha.4
0.1.0-alpha.3
0.1.0-alpha.2
0.1.0-alpha.1
Accessible and unstyled UI components library written in Elixir and TypeScript that integrates Zag.js state machines into the Phoenix Framework.
Current section
Files
Jump to
Current section
Files
lib/components/data_list.ex
defmodule Corex.DataList do
@moduledoc ~S'''
Renders a list with data based on Phoenix Core Components.
'''
@doc type: :component
use Phoenix.Component
attr(:rest, :global, doc: "Additional attributes for the root element")
@doc """
Renders a list with data.
## Examples
<.data_list>
<:item title="Title">{@post.title}</:item>
<:item title="Views">{@post.views}</:item>
</.data_list>
"""
slot :item, required: true do
attr(:title, :string, required: true)
attr(:class, :string, required: false)
end
def data_list(assigns) do
~H"""
<div {@rest}>
<ul data-scope="data-list" data-part="root">
<li :for={item <- @item} data-scope="data-list" data-part="item">
<div data-scope="data-list" data-part="content">
<div data-scope="data-list" data-part="title">{item.title}</div>
<div>{render_slot(item)}</div>
</div>
</li>
</ul>
</div>
"""
end
end