Table Card

The mobile version of a table row.

Read more Read less

Supports an optional 3 dot ‘actions’ menu, and an optional ‘Control’ button.

The default value for ‘button’ is false.

Examples

<.table_card title="Medieval Times Dinner & Tournament">
  <:item label="Subdomain">
    medievaltimes2345
  </:item>
  <.p>A basic table card with a title.</.p>
</.table_card>
<.table_card title="Medieval Times Dinner & Tournament">
  <:item label="Subdomain">
    medievaltimes2345
  </:item>
  <:button on_click={JS.push(...)}>Control</:button>
</.table_card>
<.table_card title="Medieval Times Dinner & Tournament">
  <:item label="Subdomain">
    medievaltimes2345
  </:item>
  <:action on_click={JS.push(...)}>Action 1</:action>
  <:button on_click={JS.push(...)}>Control</:button>
</.table_card>
Attribute Type Documentation Default Value
Required id * :string
Required title * :string
navigate :string
title_chip :slot
item :slot
Show slot attributes Hide slot attributes
Required label * :string
<:item label="Subdomain">
  timhortons
</:item>
<:action on_click={JS.toggle(to: "#action-menu .table-card-click-demo")}>Action 1</:action>
action :slot
Show slot attributes Hide slot attributes
on_click %JS{}
icon :string
<:item label="Subdomain">
  timhortons
</:item>
<:action on_click={JS.toggle(to: "#action-menu .table-card-click-demo")}>Action 1</:action>
button :slot
Show slot attributes Hide slot attributes
on_click %JS{}
Required inner_block * :slot