# `FrappeUIPhx.Components.List`
[🔗](https://github.com/moacirbishopcamata/frappe_ui_phx/blob/v0.3.1/lib/frappe_ui_phx/components/list.ex#L1)

Tabela de objetos: colunas por slot (`:col`), ações por linha (`:action`),
seleção por checkbox e reordenação por arrastar-e-soltar. O estado
(`selected`, ordem de `rows`) vive no servidor; cada interação é um evento.

    <.list id="pedidos" rows={@pedidos} selectable selected={@selected} on_select="select" on_drop="reorder">
      <:col :let={pedido} label="Número">{pedido.numero}</:col>
      <:action :let={pedido}><.button label="Abrir" navigate={~p"/pedidos/#{pedido.id}"} /></:action>
    </.list>

Em apps que já têm `list/1` no `core_components`, use `use FrappeUIPhx, except: [list: 1]`.

# `list`

## Attributes

* `id` (`:string`) (required)
* `rows` (`:list`) (required)
* `row_id` (`:any`) - Defaults to `&FrappeUIPhx.Components.Sortable.default_id/1`.
* `selectable` (`:boolean`) - mostra a coluna de seleção (um checkbox por linha). Defaults to `false`.
* `selected` (`:list`) - ids selecionados, comparados como texto. Defaults to `[]`.
* `on_select` (`:string`) - evento do servidor: %{"id" => id}. Defaults to `nil`.
* `on_drop` (`:string`) - liga o arrastar-e-soltar; evento: %{"id", "to", "position"}. Defaults to `nil`.
* `empty_text` (`:string`) - Defaults to `nil`.
* `class` (`:any`) - Defaults to `nil`.
* Global attributes are accepted.
## Slots

* `col` (required) - Accepts attributes:

  * `label` (`:string`) (required)
  * `class` (`:string`)
* `action`

---

*Consult [api-reference.md](api-reference.md) for complete listing*