EssenceUI.Components.Table (Essence UI v0.2.0)

A semantic table component for presenting tabular data.

Supports various sizes, variants, and layouts. The table provides proper semantic structure with separate header and body sections, and supports different types of cells.

Examples

<.table>
  <.table_header>
    <.table_row>
      <.table_column_header_cell>Name</.table_column_header_cell>
      <.table_column_header_cell>Email</.table_column_header_cell>
    </.table_row>
  </.table_header>
  <.table_body>
    <.table_row>
      <.table_row_header_cell>John Doe</.table_row_header_cell>
      <.table_cell>john@example.com</.table_cell>
    </.table_row>
  </.table_body>
</.table>

Props

size - Table size: "1", "2", "3" (default: "2")
variant - Table variant: "surface", "ghost" (default: "surface")
layout - Table layout: "auto", "fixed" (default: "auto")
Plus margin props (m, mx, my, mt, mr, mb, ml) for spacing control

Summary

Functions

table(assigns)

table_body(assigns)

table_cell(assigns)

table_column_header_cell(assigns)

table_header(assigns)

table_row(assigns)

table_row_header_cell(assigns)

Functions

table(assigns)

Attributes

m (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
mx (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
my (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
mt (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
mr (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
mb (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
ml (:any) - Margin utility class string or map. Example: 1 or %{xs: '1', sm: '2'}.
size (:string) - Table size from 1 to 3. Controls text size and cell padding. Defaults to "2". Must be one of "1", "2", or "3".
variant (:string) - Visual style variant. One of 'surface' or 'ghost'. Defaults to "surface". Must be one of "surface", or "ghost".
layout (:string) - Table layout algorithm. One of 'auto' or 'fixed'. Defaults to "auto". Must be one of "auto", or "fixed".
class (:string) - Additional CSS classes to add to the element. Defaults to nil.
style (:string) - Defaults to "".
Global attributes are accepted. Global attributes and event handlers. Supports all globals plus: ["id", "aria-label", "aria-labelledby", "aria-describedby"].

Slots

inner_block (required) - Table content (header and body).

table_body(assigns)

Slots

inner_block (required) - Body rows content.

table_cell(assigns)

Attributes

class (:string) - Additional CSS classes to add to the element. Defaults to nil.
style (:string) - Defaults to "".
Global attributes are accepted. Global attributes and event handlers. Supports all globals plus: ["id", "colspan", "rowspan", "aria-label", "aria-labelledby", "aria-describedby"].

Slots

inner_block (required) - Cell content.

table_column_header_cell(assigns)

Attributes

class (:string) - Additional CSS classes to add to the element. Defaults to nil.
style (:string) - Defaults to "".
Global attributes are accepted. Global attributes and event handlers. Supports all globals plus: ["id", "colspan", "rowspan", "aria-label", "aria-labelledby", "aria-describedby", "scope"].

Slots

inner_block (required) - Header cell content.

table_header(assigns)

Slots

inner_block (required) - Header cells content.

table_row(assigns)

Attributes

class (:string) - Additional CSS classes to add to the element. Defaults to nil.
style (:string) - Defaults to "".
Global attributes are accepted. Global attributes and event handlers. Supports all globals plus: ["id", "aria-label", "aria-labelledby", "aria-describedby"].

Slots

inner_block (required) - Row cells content.

table_row_header_cell(assigns)

Attributes

class (:string) - Additional CSS classes to add to the element. Defaults to nil.
style (:string) - Defaults to "".
Global attributes are accepted. Global attributes and event handlers. Supports all globals plus: ["id", "colspan", "rowspan", "aria-label", "aria-labelledby", "aria-describedby", "scope"].

Slots

inner_block (required) - Header cell content.