LiveTable

View Source

A Phoenix LiveView component library for building dynamic, interactive data tables with real-time updates.

Hex.pm Documentation

Features

  • Advanced Filtering - Text search, range filters, select dropdowns, boolean toggles, and transformers
  • Smart Sorting - Multi-column sorting with shift-click support
  • Flexible Pagination - Standard pagination or infinite scroll
  • Export Capabilities - CSV and PDF exports with background processing
  • Real-time Updates - Built for Phoenix LiveView with instant feedback
  • Multiple View Modes - Table and card layouts with custom components
  • Complex Queries - Full support for joins, aggregations, and computed fields

LiveTable Demo

Live Demo (1M+ records) | Advanced Demo | Advanced Demo Source

Quick Start

1. Add dependency:

# mix.exs
{:live_table, "~> 0.4.0"}

2. Install:

mix deps.get && mix live_table.install

3. Create a table:

# lib/my_app_web/live/product_live/index.ex
defmodule MyAppWeb.ProductLive.Index do
  use MyAppWeb, :live_view
  use LiveTable.LiveResource, schema: MyApp.Product

  def fields do
    [
      id: %{label: "ID", sortable: true},
      name: %{label: "Name", sortable: true, searchable: true},
      price: %{label: "Price", sortable: true}
    ]
  end

  def filters do
    [
      in_stock: Boolean.new(:quantity, "in_stock", %{
        label: "In Stock",
        condition: dynamic([p], p.quantity > 0)
      })
    ]
  end
end

4. Render it:

<%# lib/my_app_web/live/product_live/index.html.heex %>
<.live_table fields={fields()} filters={filters()} options={@options} streams={@streams} />

Documentation

Full Documentation on HexDocs

AI/LLM Integration

LiveTable includes usage rules for AI assistants to provide accurate code suggestions.

License

MIT License. See LICENSE for details.

Contributing

  1. Fork the repository
  2. Create your feature branch
  3. Open a Pull Request

Support