<.table
  id="table-single-default"
  rows={[%{id: 1, city: "Paris", last_name: "Dupont", first_name: "Jean"}, %{id: 2, city: "NY", last_name: "Smith", first_name: "Sam"}]}
>
  <:col :let={user} label="ID">
    <%= user.id %>
  </:col>
  <:col :let={user} label="First name">
    <%= user.first_name %>
  </:col>
  <:col :let={user} label="Last name">
    <%= user.last_name %>
  </:col>
  <:col :let={user} label="City">
    <%= user.city %>
  </:col>
</.table>

<.table
  id="table-single-with-function"
  rows={[%{id: 1, city: "Paris", last_name: "Dupont", first_name: "Jean"}, %{id: 2, city: "NY", last_name: "Smith", first_name: "Sam"}]}
  row_id={&"user-#{&1.id}"}
  row_item={&%{&1 | last_name: String.upcase(&1.last_name)}}
>
  <:col :let={user} label="ID">
    <%= user.id %>
  </:col>
  <:col :let={user} label="First name">
    <%= user.first_name %>
  </:col>
  <:col :let={user} label="Last name">
    <%= user.last_name %>
  </:col>
  <:col :let={user} label="City">
    <%= user.city %>
  </:col>
</.table>

<.table
  id="table-single-with-actions"
  rows={[%{id: 1, city: "Paris", last_name: "Dupont", first_name: "Jean"}, %{id: 2, city: "NY", last_name: "Smith", first_name: "Sam"}]}
>
  <:action>
    <.button>Show</.button>
  </:action>
  <:col :let={user} label="ID">
    <%= user.id %>
  </:col>
  <:col :let={user} label="First name">
    <%= user.first_name %>
  </:col>
  <:col :let={user} label="Last name">
    <%= user.last_name %>
  </:col>
  <:col :let={user} label="City">
    <%= user.city %>
  </:col>
</.table>