LightningWeb.Live.Helpers.TableHelpers (Lightning v2.13.5)
View SourceUtilities for simplifying common table operations like sorting and filtering.
This module provides reusable functions to reduce complexity in LiveView components that handle sortable, filterable tables.
Summary
Functions
Combines filtering and sorting in one operation.
Renders a filter input with magnifying glass icon and clear button.
Filters a list of items based on searchable fields and a filter term.
Creates a sort function based on direction string.
Sorts items by a given field and direction.
Toggles sort direction between "asc" and "desc".
Functions
Combines filtering and sorting in one operation.
Examples
users = [%{name: "Bob", email: "bob@test.com"}, %{name: "Alice", email: "alice@test.com"}]
filter_and_sort(users, "test", [:email], "name", "asc", %{"name" => :name})
Renders a filter input with magnifying glass icon and clear button.
Attributes
filter
- The current filter valueplaceholder
- Placeholder text for the inputtarget
- Optional phx-target for the events- All other attributes are passed through to the input
Attributes
filter
(:string
) (required)placeholder
(:string
) - Defaults to"Filter..."
.target
(:any
) - Defaults tonil
.- Global attributes are accepted. Supports all globals plus:
["class", "phx-keyup", "phx-debounce"]
.
Filters a list of items based on searchable fields and a filter term.
Examples
users = [%{name: "Alice", email: "alice@example.com"}]
search_fields = [:name, :email]
filter_items(users, "alice", search_fields)
# => [%{name: "Alice", email: "alice@example.com"}]
Creates a sort function based on direction string.
Examples
iex> sort_compare_fn("asc")
&<=/2
iex> sort_compare_fn("desc")
&>=/2
Sorts items by a given field and direction.
Examples
users = [%{name: "Bob"}, %{name: "Alice"}]
sort_items(users, "name", "asc", %{"name" => :name})
# => [%{name: "Alice"}, %{name: "Bob"}]
Toggles sort direction between "asc" and "desc".
Examples
iex> toggle_sort_direction("asc", "name", "name")
{"name", "desc"}
iex> toggle_sort_direction("desc", "name", "name")
{"name", "asc"}
iex> toggle_sort_direction("asc", "name", "email")
{"email", "asc"}