ARIA: set aria-sort on th for sortable columns
Some checks reported errors
continuous-integration/drone/push Build was killed
continuous-integration/drone/promote/production Build is passing

- Table: optional col sort_field; th gets aria-sort when col is sorted.
- User index: pass sort_field/sort_order to table, sort_field: :email on email col.
This commit is contained in:
Moritz 2026-02-04 11:40:23 +01:00
parent 24d130ffb5
commit 083592489f

View file

@ -545,6 +545,9 @@ defmodule MvWeb.CoreComponents do
attr :label, :string attr :label, :string
attr :class, :string attr :class, :string
attr :col_click, :any, doc: "optional column-specific click handler that overrides row_click" attr :col_click, :any, doc: "optional column-specific click handler that overrides row_click"
attr :sort_field, :any,
doc: "optional; when equal to table sort_field, aria-sort is set on this th"
end end
slot :action, doc: "the slot for showing user actions in the last table column" slot :action, doc: "the slot for showing user actions in the last table column"
@ -560,7 +563,13 @@ defmodule MvWeb.CoreComponents do
<table class="table table-zebra"> <table class="table table-zebra">
<thead> <thead>
<tr> <tr>
<th :for={col <- @col} class={Map.get(col, :class)}>{col[:label]}</th> <th
:for={col <- @col}
class={Map.get(col, :class)}
aria-sort={table_th_aria_sort(col, @sort_field, @sort_order)}
>
{col[:label]}
</th>
<th :for={dyn_col <- @dynamic_cols}> <th :for={dyn_col <- @dynamic_cols}>
<.live_component <.live_component
module={MvWeb.Components.SortHeaderComponent} module={MvWeb.Components.SortHeaderComponent}
@ -646,6 +655,16 @@ defmodule MvWeb.CoreComponents do
""" """
end end
defp table_th_aria_sort(col, sort_field, sort_order) do
col_sort = Map.get(col, :sort_field)
if not is_nil(col_sort) and col_sort == sort_field and sort_order in [:asc, :desc] do
if sort_order == :asc, do: "ascending", else: "descending"
else
nil
end
end
@doc """ @doc """
Renders a data list. Renders a data list.