View Source SaladUI.Table (SaladUI v1.0.0-beta.1)

Implementation of table components from https://ui.shadcn.com/docs/components/table with proper ARIA attributes for accessibility.

Examples:

<.table aria-label="Invoices">
   <.table_caption>A list of your recent invoices.</.table_caption>
   <.table_header>
     <.table_row>
       <.table_head class="w-[100px]">Invoice</.table_head>
       <.table_head>Status</.table_head>
       <.table_head>Method</.table_head>
       <.table_head class="text-right">Amount</.table_head>
     </.table_row>
   </.table_header>
   <.table_body>
     <.table_row :for={invoice <- @invoices}>
       <.table_cell class="font-medium"><%= invoice.number %></.table_cell>
       <.table_cell><%= invoice.status %></.table_cell>
       <.table_cell><%= invoice.method %></.table_cell>
       <.table_cell class="text-right"><%= invoice.amount %></.table_cell>
     </.table_row>
   </.table_body>
</.table>

Summary

Functions

Renders a data table.

Renders the table body.

Renders a table caption.

Renders a table data cell.

Renders a table footer.

Renders a table column header.

Renders the table header container.

Renders a table row.

Functions

Renders a data table.

Attributes

  • :class - Additional CSS classes for the table
  • :aria-label - Accessible name for the table when no caption is present
  • :aria-describedby - ID of an element that describes the table

Attributes

  • class (:string) - Defaults to nil.
  • aria-label (:string) - Defaults to nil.
  • aria-describedby (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)

Renders the table body.

Attributes

  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)

Renders a table caption.

A caption provides an accessible name for the table.

Attributes

  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)

Renders a table data cell.

Attributes

  • :class - Additional CSS classes

Attributes

  • class (:any) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)

Renders a table footer.

Attributes

  • class (:string) - Defaults to nil.
  • Global attributes are accepted. Supports all globals plus: ["disabled", "form", "name", "value"].

Slots

  • inner_block (required)

Renders a table column header.

Attributes

  • :class - Additional CSS classes
  • :scope - Scope of the header cell (default: "col")
  • :aria-sort - Sort direction for screen readers (ascending, descending, or none)

Attributes

  • class (:string) - Defaults to nil.
  • scope (:string) - Defaults to "col".
  • aria-sort (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)

Renders the table header container.

Attributes

  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)

Renders a table row.

Attributes

  • :class - Additional CSS classes
  • :aria-rowindex - Numeric index of the row

Attributes

  • class (:string) - Defaults to nil.
  • aria-rowindex (:integer) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)