feat(member): let members tailor overview density and visible columns
The View dropdown drives row density and whether the Member and Address fields render as composite cells or split into their underlying columns; the column manager toggles visibility and resets to the curated default. All choices persist per browser through the URL/session/cookie/global chain, so a saved layout survives reloads without a per-account store.
This commit is contained in:
parent
af2cc2e0d4
commit
dfc616257d
21 changed files with 1643 additions and 263 deletions
|
|
@ -250,7 +250,7 @@ defmodule MvWeb.CoreComponents do
|
|||
|
||||
attr :size, :any,
|
||||
default: "md",
|
||||
doc: "Badge size: sm | md"
|
||||
doc: "Badge size: xs | sm | md"
|
||||
|
||||
attr :sr_label, :string,
|
||||
default: nil,
|
||||
|
|
@ -269,7 +269,7 @@ defmodule MvWeb.CoreComponents do
|
|||
|
||||
variant_class = "badge-#{variant}"
|
||||
style_class = badge_style_class(style)
|
||||
size_class = "badge-#{size}"
|
||||
size_class = badge_size_class(size)
|
||||
# Outline has transparent bg in DaisyUI; add bg so it stays visible on base-200/base-300
|
||||
outline_bg = if style == "outline", do: "bg-base-100", else: nil
|
||||
|
||||
|
|
@ -309,6 +309,13 @@ defmodule MvWeb.CoreComponents do
|
|||
defp badge_style_class("outline"), do: "badge-outline"
|
||||
defp badge_style_class(_), do: nil
|
||||
|
||||
# Literal strings so Tailwind's content scanner sees badge-xs / badge-sm / badge-md / badge-lg
|
||||
# and does not purge them from the CSS bundle (string interpolation "badge-#{size}" would be invisible).
|
||||
defp badge_size_class("xs"), do: "badge-xs"
|
||||
defp badge_size_class("sm"), do: "badge-sm"
|
||||
defp badge_size_class("lg"), do: "badge-lg"
|
||||
defp badge_size_class(_), do: "badge-md"
|
||||
|
||||
@doc """
|
||||
Renders a visually empty table cell with screen-reader-only text (WCAG).
|
||||
|
||||
|
|
@ -443,6 +450,11 @@ defmodule MvWeb.CoreComponents do
|
|||
attr :selected, :map, default: %{}
|
||||
attr :open, :boolean, default: false, doc: "Whether the dropdown is open"
|
||||
attr :show_select_buttons, :boolean, default: false, doc: "Show select all/none buttons"
|
||||
|
||||
attr :show_reset_button, :boolean,
|
||||
default: false,
|
||||
doc: "Show a reset-to-default icon button next to All/None (emits reset_fields)"
|
||||
|
||||
attr :phx_target, :any, required: true, doc: "The LiveView/LiveComponent target for events"
|
||||
attr :menu_class, :string, default: nil, doc: "Additional CSS classes for the menu"
|
||||
attr :menu_width, :string, default: "w-64", doc: "Width class for the menu (default: w-64)"
|
||||
|
|
@ -546,6 +558,19 @@ defmodule MvWeb.CoreComponents do
|
|||
>
|
||||
{gettext("None")}
|
||||
</button>
|
||||
<button
|
||||
:if={@show_reset_button}
|
||||
type="button"
|
||||
role="menuitem"
|
||||
aria-label={gettext("Reset to default")}
|
||||
title={gettext("Reset to default")}
|
||||
phx-click="reset_fields"
|
||||
phx-target={@phx_target}
|
||||
class="btn btn-xs btn-ghost"
|
||||
data-testid="dropdown-reset"
|
||||
>
|
||||
<.icon name="hero-arrow-uturn-left" class="size-4" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
|
@ -938,6 +963,11 @@ defmodule MvWeb.CoreComponents do
|
|||
attr :sort_field, :any, default: nil, doc: "current sort field"
|
||||
attr :sort_order, :atom, default: nil, doc: "current sort order"
|
||||
|
||||
attr :size_class, :string,
|
||||
default: "",
|
||||
doc:
|
||||
"optional DaisyUI table-size class controlling row density (e.g. table-xs, table-md); driven by the view-settings density value"
|
||||
|
||||
attr :sticky_header, :boolean,
|
||||
default: false,
|
||||
doc:
|
||||
|
|
@ -1016,7 +1046,7 @@ defmodule MvWeb.CoreComponents do
|
|||
data-sticky-first-col-rows={@sticky_first_col && "true"}
|
||||
phx-hook={@row_click && "TableRowKeydown"}
|
||||
>
|
||||
<table class="table table-zebra">
|
||||
<table class={["table table-zebra", @size_class]}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th
|
||||
|
|
@ -1223,7 +1253,7 @@ defmodule MvWeb.CoreComponents do
|
|||
defp table_th_sticky_class(_), do: nil
|
||||
|
||||
defp sticky_th_classes,
|
||||
do: "lg:sticky lg:top-0 bg-base-100 z-10 hover:z-20 focus-within:z-20"
|
||||
do: "lg:sticky lg:top-0 bg-base-100 hover:bg-base-100 z-10 hover:z-20 focus-within:z-20"
|
||||
|
||||
@doc """
|
||||
Renders a reorderable table (sortable list) with drag handle and keyboard support.
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue