@nxgt/material 3.17.0 → 3.19.0

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @nxgt/material
 
+## 3.19.0
+
+### Minor Changes
+
+- [#1537](https://github.com/softistx/nxgt-material/pull/1537) [`cbb0fe3`](https://github.com/softistx/nxgt-material/commit/cbb0fe3eb7c36f04930578d8dee72c6c271daf84) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `ServerTable` gets a `description` (a muted line under the `title`, or alone above the band's controls when there is no `title`, so a page whose `h1` is elsewhere keeps a heading-less band: leaving out `title` gives a band with no heading) and a richer empty page: `empty.none` and `empty.noMatch` take a `ListEmptyPage` (`{ title, description?, illustration?, action? }`) besides a title, so "nothing yet" draws a scene (a scene id of a registered set, or `true`) and a call to action while "nothing matches" keeps its "no results" scene and its way out. `empty.iconStyle` (and `ListEmpty`'s) sets the icon style of those scenes, keeping the `IllustrationDefaults` icons and scene sets above it, for an app that serves only some sprites. A title given as before behaves as before. `empty.none` and `empty.noMatch` (and `ListEmpty`'s `none` and `noMatch`) widen from `ReactNode` to `ReactNode | ListEmptyPage`: code that reads them back reads `.title` of a page, or handles the page form.
+
+- [#1571](https://github.com/softistx/nxgt-material/pull/1571) [`2cac20d`](https://github.com/softistx/nxgt-material/commit/2cac20d8bda60b486e664903d6e60477f8d7dec9) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `ServerTable` takes `bandDensity="compact"` (the room above and under the band halved, the controls unchanged), `pageControls="icon"` (the footer's Previous and Next as icon-only buttons with a tooltip, named "Previous page" / "Next page"; new keys `material.table.pagination.previous-page` and `next-page`; also `pagination.pageControls` on a manual `DataTable`) and `filterRef` (`focus()` on the Filter's first control). The Filter's focus contract falls to the first shown control (a quick filter, "Add filter", "Filters (N)") when the bar has no search, in `filterFocusElement` of `@nxgt/material-core/filter`. Additive: the defaults look as before.
+
+- [#1536](https://github.com/softistx/nxgt-material/pull/1536) [`63466ff`](https://github.com/softistx/nxgt-material/commit/63466ffe24f3aad3565e68512e6186ebdd5b79f2) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `ServerTable` takes `enableRowSelection` (`boolean` or `(row) => boolean`, as `DataTable`'s) and `rowSelectionDisabledReason`: with `bulkActions`, a locked row's checkbox is `aria-disabled` but focusable and described by the reason, "Select all" skips locked rows, and its checked and indeterminate states count only the rows that can be selected. A tap on a locked checkbox shows its reason too (in `DataTable`, whose tooltip opened on hover and focus only). Additive.
+
+### Patch Changes
+
+- Updated dependencies [[`2cac20d`](https://github.com/softistx/nxgt-material/commit/2cac20d8bda60b486e664903d6e60477f8d7dec9)]:
+  - @nxgt/material-core@0.33.0
+
+## 3.18.0
+
+### Minor Changes
+
+- [#1580](https://github.com/softistx/nxgt-material/pull/1580) [`c9531e1`](https://github.com/softistx/nxgt-material/commit/c9531e162625998083cb8364cbfd29e48afffe57) Thanks [@SteveGT96](https://github.com/SteveGT96)! - A modern `Switcher`, with no API break (`options`, `label`, `value` and `onValueChange` keep their meaning). **The default trigger changes visibly**: a 44px card tile (a tinted tile with the initial or the icon, the title, the subtitle and an up-down chevron) replaces the grey button, and the options open as a menu (up to 7: tint, start bar and check on the chosen row) or, from 8 or with `searchable`, as a panel with a search (a combobox over a listbox), groups and a "Manage…" footer; on a phone it is a bottom sheet. `variant="expressive"` is a pill with a larger panel, "Recent" tiles (`recent`, up to 3 ids) and soft badges (`badge`). `SwitcherItem` gains `group`, `initial`, `tone`, `badge`, `href` and `disabled`, and the `Switcher` gains `variant`, `searchable`, `recent`, `getHref` with `linkComponent` (link mode: a `nav` of links with `aria-current="page"` in place of the listbox, the arrows move real focus), `footer`, `emptyLabel` and `sheet`; its trigger props are button props. The initial tile renders again ([#1039](https://github.com/softistx/nxgt-material/issues/1039)), and a clipped title carries the full title in `aria-label`, shows it in a tooltip, and stays whole in the trigger's accessible name ([#1419](https://github.com/softistx/nxgt-material/issues/1419)). New `material.switcher.*` strings, in English and French. Core: the Free sprites draw `angles-up-down` as `sort`.
+
+### Patch Changes
+
+- Updated dependencies [[`c9531e1`](https://github.com/softistx/nxgt-material/commit/c9531e162625998083cb8364cbfd29e48afffe57)]:
+  - @nxgt/material-core@0.32.1
+
 ## 3.17.0
 
 ### Minor Changes

package/README.md

@@ -586,7 +586,7 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/selection-choice-transferlist.webp" width="120" alt="TransferList"> | [`TransferList`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/selection-and-choice.md#transferlist) · `TransferListFormField` | Two-pane picker with search, counts, select-all, Shift-range checks, drag-and-drop between panes, reordering and a `max`; avatar and badge slots, a `compact` density, and panes that stack in a narrow container. | `TransferList`, `TransferListFormField` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/selection-choice-sortablelist.webp" width="120" alt="SortableList"> | [`SortableList`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/selection-and-choice.md#sortablelist) · `SortableListFormField` | Searchable list you reorder by dragging (row or grip) or with the keyboard (Space to pick up, arrows, Space to drop, Escape to cancel), each step announced; `numbered`, `removable`, locked rows, `cards` or `plain`, `compact`. | `SortableList`, `SortableListFormField` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/selection-choice-treeselectfield.webp" width="120" alt="TreeSelectField"> | [`TreeSelectField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/selection-and-choice.md#treeselectfield) · `TreeSelectFormField` | A field that opens a `Tree` in a popover: pick one node, or several as chips, with an optional filter. | `TreeSelectField`, `TreeSelectFormField` |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/selection-choice-switcher.webp" width="120" alt="Switcher"> | [`Switcher`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/selection-and-choice.md#switcher) | Dropdown for switching the active workspace or account, with an avatar. | `Switcher` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/selection-choice-switcher.webp" width="120" alt="Switcher"> | [`Switcher`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/selection-and-choice.md#switcher) | Switches the active workspace, establishment or class: a menu, or a searchable panel with groups and links; an expressive variant. | `Switcher` |
 
 ### Data display
 
@@ -627,8 +627,8 @@ Not components: what the stylesheet gives any element.
 | Preview | Component | What it does | @nxgt/material-vue |
 | --- | --- | --- | --- |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-datatable.webp" width="120" alt="DataTable"> | [`DataTable`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#datatable), `DataTableColumnHeader`, `DataTablePagination`, `DataTableServerFooter`, `DataTableViewOptions` | TanStack Table v9 with sorting, filtering, selection, expandable rows, pagination or load-more, column visibility, skeleton rows while loading and your own empty state — or one server page at a time, with controlled sorting and selection, cursor Previous / Next links and row links. On a phone it keeps its header row and scrolls sideways in a keyboard-reachable region; the page does not. Or cards and tiles instead of the table (`layout`, `renderCard`, `renderTile`), and `layout={{ phone: 'tiles', wide: 'table' }}` for tiles on a phone ([cards and tiles guide](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/guides/cards-and-tiles.md)). Long lists render only the rows in view (`virtual`). | `DataTable`, `DataTableColumnHeader`, `DataTablePagination`, `DataTableServerFooter`, `DataTableViewOptions` |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-servertable.webp" width="120" alt="ServerTable"> | [`ServerTable`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#servertable), `createSorting`, `tableFilters`, `defineFilterModel`, `parseFilterQuery`, `serializeFilterQuery`, `paramsFromQuery`, `serverPagination`… | A server-mode `DataTable` driven by the URL's search params, for any router: the Filter in its top band with the page's title and actions, the sort, forward cursor paging, a selection reset on a new query, the empty page with the filters as removable chips, a page past the last (rows deleted) that says so and links back to the first, an error state with Retry for a failed fetch (`error`, `onRetry`), and one count announced. | `ServerTable`, `createSorting`, `tableFilters`, `serverPagination` |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-listempty.webp" width="120" alt="ListEmpty"> | [`ListEmpty`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#listempty) | A list's empty page: nothing yet, or nothing matches with what narrows it and a way out (a button or a link); its title is an `h2` (`headingLevel`). | `ListEmpty` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-servertable.webp" width="120" alt="ServerTable"> | [`ServerTable`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#servertable), `createSorting`, `tableFilters`, `defineFilterModel`, `parseFilterQuery`, `serializeFilterQuery`, `paramsFromQuery`, `serverPagination`… | A server-mode `DataTable` driven by the URL's search params, for any router: the Filter in its top band with the page's title (optional), description and actions, the sort, forward cursor paging, a selection reset on a new query, the empty page (a scene and an action for "nothing yet", the filters as removable chips), a compact band (`bandDensity`), icon-only Previous / Next (`pageControls`), a `filterRef` to focus the Filter, a page past the last (rows deleted) that says so and links back to the first, an error state with Retry for a failed fetch (`error`, `onRetry`), and one count announced. | `ServerTable`, `createSorting`, `tableFilters`, `serverPagination` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-listempty.webp" width="120" alt="ListEmpty"> | [`ListEmpty`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#listempty) | A list's empty page: nothing yet (a title, or a scene, a line and an action), or nothing matches with what narrows it and a way out (a button or a link); its title is an `h2` (`headingLevel`). | `ListEmpty` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-datagrid.webp" width="120" alt="DataGrid"> | [`DataGrid`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#datagrid) | An editable grid over `DataTable`'s columns: spreadsheet keys, a selected range, editors for text, numbers (with codes such as "abs"), options, dates and checkboxes, or your own; paste from Excel or Sheets, a fill handle that continues series, resizable, hideable and reorderable columns, undo, totals, and saving per cell, per row or in a batch with versions and conflicts ([guide](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/guides/data-grid.md)). Long grids render only what is in view; on a phone it is a list of rows that open a panel. | — (later) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-daygroupedlist.webp" width="120" alt="DayGroupedList"> | [`DayGroupedList`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#daygroupedlist), `groupByDay` | A list split by day — Today, Yesterday, This week, Earlier — under headings that stick while their items scroll. | — (later) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-filter.webp" width="120" alt="Filter"> | [`Filter`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#filter), `FilterProvider`, `FilterContent`, `FilterChips`, `FilterPresets`, `FilterSheetTrigger` · `FilterFormField` | Schema-driven filters with chips, presets, validation, and URL or storage persistence, and a query-driven `variant="bar"` / `"facets"` (quick filters, locked conditions, a phone sheet, a URL codec for a loader); the filter bar's "Filters (N)" (`FilterSheetTrigger`) can be placed inside a `ServerTable` (its actions). | `Filter`, `FilterProvider`, `FilterContent`, `FilterChips`, `FilterPresets`, `FilterSheetTrigger`, `FilterFormField` |

package/dist/{async-slice-BA7wI9qp.js → async-slice-nTRgm_ct.js}

@@ -1,5 +1,5 @@
-import { i as e, r as t, t as n } from "./stored-language-DiCe2ZcR.js";
-import { r } from "./translator-Ch1dEqFf.js";
+import { i as e, r as t, t as n } from "./stored-language-CJn_iWwG.js";
+import { r } from "./translator-1THr41fc.js";
 import { t as i } from "./_baseIsEqual-C6ksIHya.js";
 import { useMemo as a } from "react";
 import { asyncThunkCreator as o, buildCreateSlice as s } from "@reduxjs/toolkit";

package/dist/{button-DOYHfcMJ.js → button-rdIhY2BT.js}

@@ -2,7 +2,7 @@ import { t as e } from "./utils-BLfntITJ.js";
 import { n as t, t as n } from "./dist-DVRQkaTK.js";
 import { o as r, t as i } from "./tooltip-CkttDIab.js";
 import { t as a } from "./is-production-GLw59WU8.js";
-import { t as o } from "./spinner-CGgOgUCe.js";
+import { t as o } from "./spinner-B7HCQMFr.js";
 import { a as s, i as c, r as l, t as u } from "./button-tones-BwuVvAmd.js";
 import { t as d } from "./button-group-context-CaP0X5p_.js";
 import { t as f } from "./has-text-content-Ds2dkHX_.js";

package/dist/charts.js

@@ -1,12 +1,12 @@
 import { t as e } from "./ui.utils-CAnKTCw5.js";
 import { t } from "./utils-BLfntITJ.js";
-import { t as n } from "./use-material-translation-C4ysFJtw.js";
-import { t as r } from "./button-DOYHfcMJ.js";
+import { t as n } from "./use-material-translation-BFQODuQz.js";
+import { t as r } from "./button-rdIhY2BT.js";
 import { t as i } from "./use-ssr-media-query-C6M5m8sf.js";
 import { i as a, n as o, r as s, t as c } from "./util-4heV2LPI.js";
 import { t as l } from "./useIsomorphicLayoutEffect-DfgAhWcH.js";
 import { t as u } from "./warn-once-C_e47JM8.js";
-import { t as d } from "./chip-C8MB2xzb.js";
+import { t as d } from "./chip-CEau88ZV.js";
 import { c as f, d as p, f as m, i as h, o as g, p as _, s as v, t as y } from "./line-path-C5pZGC49.js";
 import { t as b } from "./live-status-BGPaN8r8.js";
 import { t as x } from "./linear-G97mfnKF.js";

package/dist/{chip-C8MB2xzb.js → chip-CEau88ZV.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { t } from "./tooltip-CkttDIab.js";
-import { t as n } from "./use-material-translation-C4ysFJtw.js";
+import { t as n } from "./use-material-translation-BFQODuQz.js";
 import { a as r } from "./button-tones-BwuVvAmd.js";
 import { t as i } from "./react-node-text-Crkpfpco.js";
 import { Check as a, X as o } from "lucide-react";

package/dist/{code-editor-BqeS_XMJ.js → code-editor-DHB5ytUz.js}

@@ -1,12 +1,12 @@
 import { r as e } from "./rolldown-runtime-BFFgcFxR.js";
 import { t } from "./utils-BLfntITJ.js";
 import { a as n } from "./dist-lmHmz_bu.js";
-import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-CL6mNhgT.js";
+import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-mTDyFwbQ.js";
 import { a as c, i as l, n as u } from "./field-blur-context-Cft9s7Hg.js";
-import { a as d, d as f, r as p, t as m, u as h } from "./toolbar-items-DCZxamGy.js";
+import { a as d, d as f, r as p, t as m, u as h } from "./toolbar-items-Tn3MMu-s.js";
 import { t as g } from "./is-production-GLw59WU8.js";
-import { t as _ } from "./use-material-translation-C4ysFJtw.js";
-import { i as v, n as y, o as b, t as x } from "./code-language-items-DOr9J9yu.js";
+import { t as _ } from "./use-material-translation-BFQODuQz.js";
+import { i as v, n as y, o as b, t as x } from "./code-language-items-Dww9amx_.js";
 import { t as S } from "./useIsomorphicLayoutEffect-DfgAhWcH.js";
 import { n as C, t as w } from "./escape-owner-C4W_sOAU.js";
 import { t as T } from "./skeleton-DSdtr2qc.js";

package/dist/code-editor.js

@@ -1,14 +1,14 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { a as t } from "./dist-lmHmz_bu.js";
-import { d as n, r, t as i, u as a } from "./toolbar-items-DCZxamGy.js";
-import { t as o } from "./use-material-translation-C4ysFJtw.js";
-import { i as s, n as c, o as l } from "./code-language-items-DOr9J9yu.js";
+import { d as n, r, t as i, u as a } from "./toolbar-items-Tn3MMu-s.js";
+import { t as o } from "./use-material-translation-BFQODuQz.js";
+import { i as s, n as c, o as l } from "./code-language-items-Dww9amx_.js";
 import { r as u, t as d } from "./field-blur-CJHzVSh9.js";
 import { t as f } from "./skeleton-DSdtr2qc.js";
 import { t as p } from "./live-status-BGPaN8r8.js";
 import { t as m } from "./use-mobile-BDro060N.js";
 import { t as h } from "./react-node-text-Crkpfpco.js";
-import { a as g, c as _, d as v, f as y, i as b, l as x, m as S, o as C, p as w, r as T, s as E, t as D, u as O } from "./code-editor-BqeS_XMJ.js";
+import { a as g, c as _, d as v, f as y, i as b, l as x, m as S, o as C, p as w, r as T, s as E, t as D, u as O } from "./code-editor-DHB5ytUz.js";
 import { ChevronDown as k, ChevronUp as A, Columns2 as j } from "lucide-react";
 import { useEffect as M, useRef as N, useState as P } from "react";
 import { Fragment as F, jsx as I, jsxs as L } from "react/jsx-runtime";

package/dist/{code-language-items-DOr9J9yu.js → code-language-items-Dww9amx_.js}

@@ -1,5 +1,5 @@
-import { d as e, f as t } from "./dropdown-menu-CL6mNhgT.js";
-import { t as n } from "./use-material-translation-C4ysFJtw.js";
+import { d as e, f as t } from "./dropdown-menu-mTDyFwbQ.js";
+import { t as n } from "./use-material-translation-BFQODuQz.js";
 import { t as r } from "./live-status-BGPaN8r8.js";
 import { useEffect as i, useRef as a, useState as o } from "react";
 import { jsx as s } from "react/jsx-runtime";