@nxgt/material 3.88.1 → 3.90.0

package/CHANGELOG.md

@@ -1,5 +1,49 @@
 # @nxgt/material
 
+## 3.90.0
+
+### Minor Changes
+
+- [#2608](https://github.com/softistx/nxgt-material/pull/2608) [`6b85084`](https://github.com/softistx/nxgt-material/commit/6b8508406e37fa2e9c63c3c554cce809f867c2a8) Thanks [@SteveGT96](https://github.com/SteveGT96)! - ActivityContent: add `asidePhone` (`'stack'` | `'toggle'`), `asidePreviewLabel` and `asideMainLabel`. With `asidePhone="toggle"` the side panel (a form's live preview, say) is not stacked below the content on a phone: a two-button switch above the content ("Content" / "Preview"; French: "Contenu" / "Aperçu") swaps the two, the content staying mounted; from `asideFrom` nothing changes. Known limit: a save bar inside the content is hidden while the preview shows (a footer slot is tracked in [#2609](https://github.com/softistx/nxgt-material/issues/2609)). New i18n keys `material.app-shell.aside-main`, `aside-preview` and `aside-toggle`. [#2604](https://github.com/softistx/nxgt-material/issues/2604)
+
+- [#2643](https://github.com/softistx/nxgt-material/pull/2643) [`b6219b1`](https://github.com/softistx/nxgt-material/commit/b6219b14eb16eab5306f13c8da7c0fdff5bdf721) Thanks [@SteveGT96](https://github.com/SteveGT96)! - BackLink: add `flush`. It drops the start padding so the arrow lines up with the page's start edge and the content under it, in LTR and RTL, instead of a hand-written negative margin. [#2584](https://github.com/softistx/nxgt-material/issues/2584)
+
+- [#2605](https://github.com/softistx/nxgt-material/pull/2605) [`2ee855f`](https://github.com/softistx/nxgt-material/commit/2ee855f842cf6283669a301f331a534cf87aea18) Thanks [@SteveGT96](https://github.com/SteveGT96)! - EntityHeader: add a `surface` prop (`'card'` | `'none'`). `'card'` is the default and keeps today's look; `'none'` draws the header flat, with no background, padding or shadow, for a header that sits directly on a page band so surfaces do not nest. [#2603](https://github.com/softistx/nxgt-material/issues/2603)
+
+- [#2614](https://github.com/softistx/nxgt-material/pull/2614) [`2630fa2`](https://github.com/softistx/nxgt-material/commit/2630fa27cd09aeb78ae6b96853091915acdd8062) Thanks [@SteveGT96](https://github.com/SteveGT96)! - PageLoadFailed: add an optional retry action (`onRetry`, `retrying`, `retryLabel`, like ErrorState). It is the filled primary action with the "Back to the start" link beside it; without `onRetry` the component renders as before. [#2611](https://github.com/softistx/nxgt-material/issues/2611)
+
+- [#2602](https://github.com/softistx/nxgt-material/pull/2602) [`db6f8c3`](https://github.com/softistx/nxgt-material/commit/db6f8c3fd1eca0d242a35c358d1ada411f1bead7) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Switch, SwitchField, SwitchFormField: add `variant` (`'box'` | `'plain'`). `box` is the default and keeps today's bordered, tinted row; `plain` draws a labelled switch with the label beside it and no border or tint. [#2579](https://github.com/softistx/nxgt-material/issues/2579)
+
+### Patch Changes
+
+- [#2613](https://github.com/softistx/nxgt-material/pull/2613) [`a07b331`](https://github.com/softistx/nxgt-material/commit/a07b3319492ed89e40569d405b73e0b177f29fa6) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Show the label of a `display: 'icon'` menu item in the phone's menu sheet. The entry stays an icon-only button in the collapsed rail and the expanded sidebar, but the sheet, where a lone icon reads poorly, now draws the icon and its label.
+
+## 3.89.0
+
+### Minor Changes
+
+- [#2581](https://github.com/softistx/nxgt-material/pull/2581) [`c3f6715`](https://github.com/softistx/nxgt-material/commit/c3f6715d84eb5a83ab770252f16d0afe9b763eb6) Thanks [@SteveGT96](https://github.com/SteveGT96)! - feat(dates): add `AgeField` and `AgeFormField`, an age as a number and a unit (day, week, month, year; the allowed `units` configurable), with a value like `{ value: 2, unit: 'month' }`, `min` and `max` per unit, and the age read aloud by locale ("2 months", « 2 mois », `material.age-field.*`) ([#2574](https://github.com/softistx/nxgt-material/issues/2574)).
+
+- [#2593](https://github.com/softistx/nxgt-material/pull/2593) [`6668fc0`](https://github.com/softistx/nxgt-material/commit/6668fc0246f34e997001787b195449e91e3866ff) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Badge: add a `size` prop (`sm` | `md`). `sm` is the default and keeps today's 20 px look; `md` is a 24 px badge with larger text and icon, for a list or table row next to body text. [#2582](https://github.com/softistx/nxgt-material/issues/2582)
+
+- [#2587](https://github.com/softistx/nxgt-material/pull/2587) [`81249b8`](https://github.com/softistx/nxgt-material/commit/81249b88e417ad6a9efb78a65eff68332c5eddb5) Thanks [@SteveGT96](https://github.com/SteveGT96)! - feat(app-shell): `MenuItem.childrenIn: 'sidebar'` keeps an entry's `children` in the expanded sidebar and the top dropdown while the phone's menu sheet shows the entry as a plain link to its `url`, with its badge ([#2573](https://github.com/softistx/nxgt-material/issues/2573)).
+
+- [#2598](https://github.com/softistx/nxgt-material/pull/2598) [`7ddcfb6`](https://github.com/softistx/nxgt-material/commit/7ddcfb64cc170e7f2883b8aaab1d2c533628ad75) Thanks [@SteveGT96](https://github.com/SteveGT96)! - feat(sortable-list): add `labelLines={2}` to let a row's label take two lines instead of one, and `rowActions` for a "..." menu (`RowMenu`; the item type is exported as `SortableListRowAction`) on each row beside the remove button; both pass through `SortableListFormField`, and `ListPaneItem` takes `titleLines` ([#2594](https://github.com/softistx/nxgt-material/issues/2594)).
+
+- [#2595](https://github.com/softistx/nxgt-material/pull/2595) [`3d88273`](https://github.com/softistx/nxgt-material/commit/3d88273219c54214636d3150d2f19cd1d2eee3dd) Thanks [@SteveGT96](https://github.com/SteveGT96)! - feat(tabs): add `scrollButtons="none"` to `TabsList` and `TabsNav`, a plain horizontally scrollable row with no chevron buttons (default `"auto"`, unchanged); the edge fade stays as the overflow cue, with `data-overflow-left` / `data-overflow-right` and the selected tab still scrolled into view ([#2577](https://github.com/softistx/nxgt-material/issues/2577)).
+
+- [#2576](https://github.com/softistx/nxgt-material/pull/2576) [`5772932`](https://github.com/softistx/nxgt-material/commit/5772932fbd704ff5d26972689f0a2079b5f8b6e6) Thanks [@SteveGT96](https://github.com/SteveGT96)! - New `meta.cellClassName(value, row)` on a column of `DataTable`, `ServerTable` and `DataGrid`: it returns classes for a body cell (or `undefined`) from the value the cell shows, merged after `meta.className`, so a cell is styled by its data without a custom `cell` renderer. `DataTable` and `ServerTable` pass `cell.getValue()` and the row's original; `DataGrid` passes the value the cell shows now, so the class follows an edit, a save and an undo. Not available in `@nxgt/material-vue` yet ([#2569](https://github.com/softistx/nxgt-material/issues/2569)). Fixes [#1117](https://github.com/softistx/nxgt-material/issues/1117).
+
+- [#2576](https://github.com/softistx/nxgt-material/pull/2576) [`5772932`](https://github.com/softistx/nxgt-material/commit/5772932fbd704ff5d26972689f0a2079b5f8b6e6) Thanks [@SteveGT96](https://github.com/SteveGT96)! - New `PersonCell`, a decorative initials avatar before a name for the first column of a table of people or a card title: `<PersonCell name src? initials? tone? description? size? />`. The avatar is `aria-hidden` and neutral by default (24 px as `sm`, the default, in a table; 32 px as `md` in a card), the initials come from the name or from `initials`, the name and the optional muted description truncate with an ellipsis (`min-w-0`) while their full text stays in the DOM. Not in `@nxgt/material-vue` yet ([#2569](https://github.com/softistx/nxgt-material/issues/2569)). Fixes [#1112](https://github.com/softistx/nxgt-material/issues/1112).
+
+- [#2576](https://github.com/softistx/nxgt-material/pull/2576) [`5772932`](https://github.com/softistx/nxgt-material/commit/5772932fbd704ff5d26972689f0a2079b5f8b6e6) Thanks [@SteveGT96](https://github.com/SteveGT96)! - New `meta.tone(value, row)` on a column of `DataTable`, `ServerTable` and `DataGrid`: it returns a tone or `undefined` from the value a cell shows. The cell gets `data-tone` and its content the new `ToneValue` (exported): the value in the tone's text colour after an `aria-hidden` shape fixed per tone (diamond for `error`, triangle for `warning`, circle for `success`, square for another tone, none for `neutral`), so the tone holds in dark, on a selected row and in forced colours. `meta.toneLabel` adds visually hidden words after the value (off by default). The default card of the `cards` and `tiles` layouts shows it too; a custom `renderCard` imports `ToneValue`. In `DataGrid` the tone is read from the value the cell shows now, so it follows an edit, a pending save, a refused save put back and an undo, while an edited cell keeps its editor ring and a text kept as an error is not toned; on a phone the list summary and the row panel show `ToneValue` too. `toneBands` (bands on a number, from `@nxgt/material-core/cell-tone`) is re-exported from `@nxgt/material/components`. Not in `@nxgt/material-vue` yet ([#2569](https://github.com/softistx/nxgt-material/issues/2569)). Fixes [#1032](https://github.com/softistx/nxgt-material/issues/1032).
+
+### Patch Changes
+
+- [#2600](https://github.com/softistx/nxgt-material/pull/2600) [`2a54443`](https://github.com/softistx/nxgt-material/commit/2a544430535a8d5324e8ccbeaca800e85e27233a) Thanks [@SteveGT96](https://github.com/SteveGT96)! - fix(number-field): draw the `suffix` inside the input box as its end adornment, with or without steppers, instead of after the increase button outside the border; `PercentField`'s `%` follows ([#2578](https://github.com/softistx/nxgt-material/issues/2578)).
+- Updated dependencies [[`5772932`](https://github.com/softistx/nxgt-material/commit/5772932fbd704ff5d26972689f0a2079b5f8b6e6)]:
+  - @nxgt/material-core@0.53.0
+
 ## 3.88.1
 
 ### Patch Changes

package/README.md

@@ -701,6 +701,7 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/date-time-daterangefield.webp" width="120" alt="DateRangeField"> | [`DateRangeField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/date-and-time.md#daterangefield) · `DateRangeFormField` | From / to range typed in segments or picked in a calendar (two months on a desktop, a bottom sheet on a phone), with presets (label and dates, the chosen one tinted with a bar) and times. A tonal box, ranges as a connected pill. | `DateRangeField`, `DateRangeFormField` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/date-time-timefield.webp" width="120" alt="TimeField"> | [`TimeField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/date-and-time.md#timefield), `TimeStringField`, `TimeFormField` | A time typed in segments, with a button that opens a `TimePicker` in a popover, or in a bottom sheet on a phone. A tonal box; `size="sm"` is compact, `TimeStringField` takes an `HH:mm` string. | `TimeField`, `TimeFormField`; `TimeStringField`: — (later) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/date-time-timepicker.webp" width="120" alt="TimePicker"> | [`TimePicker`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/date-and-time.md#timepicker) | Hours and minutes as big tiles with steppers, an AM / PM pair and quick minutes (columns with `variant="columns"`), 12- or 24-hour by language. | `TimePicker` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/date-time-agefield.webp" width="120" alt="AgeField"> | [`AgeField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/date-and-time.md#agefield) · `AgeFormField` | An age as a number and a unit (days, weeks, months, years), `{ value: 2, unit: 'month' }`, read aloud by locale: "2 months". `min` and `max` can differ per unit. | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/date-time-durationfield.webp" width="120" alt="DurationField"> | [`DurationField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/date-and-time.md#durationfield) · `DurationFormField` | Hours and minutes combined into a total in minutes, typed on one line, "1 h 29 min", with one −/+ pair for the focused part (`variant="fields"` for the two number fields). | `DurationField`, `DurationFormField` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/date-time-halfdayrangefield.webp" width="120" alt="HalfDayRangeField"> | [`HalfDayRangeField`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/date-and-time.md#halfdayrangefield) · `HalfDayRangeFormField` | A range whose two ends are each a day plus morning or afternoon, ordered on the half, for absences and closures counted to the half day. | — (later, #2555) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/date-time-minimonth.webp" width="120" alt="MiniMonth"> | [`MiniMonth`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/date-and-time.md#minimonth) | Compact month navigator: today ringed, a week band, event dots, a keyboard date grid. | — |
@@ -726,7 +727,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, drag-and-drop, reordering and a `max`. | `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 of strings you reorder by dragging or with the keyboard. | `SortableList`, `SortableListFormField` |
 | <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-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`, two-line labels (`labelLines`), a row menu (`rowActions`), 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) | Switches the active workspace, establishment or class: a menu, or a searchable panel with groups and links; an expressive variant; a clipped subtitle keeps its full text; a compact icon-only trigger (`size="compact"`) for the app bar; `open`/`onOpenChange`, and a link pick closes it. | `Switcher` |
 
@@ -736,16 +737,18 @@ Not components: what the stylesheet gives any element.
 | --- | --- | --- | --- |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-avatar.webp" width="120" alt="Avatar"> | [`Avatar`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#avatar), `AvatarImage`, `AvatarFallback`, `AvatarBase` | Image with a fallback and an optional online / offline dot; `shape` clips it to an expressive shape; the initials scale with the size (40 % of the diameter); `tone` colours the fallback. | `Avatar`, `AvatarImage`, `AvatarFallback` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-avatargroup.webp" width="120" alt="AvatarGroup"> | [`AvatarGroup`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#avatargroup) | Overlapping avatars with a `+N` overflow. | `AvatarGroup` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-personcell.webp" width="120" alt="PersonCell"> | [`PersonCell`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#personcell) | A decorative initials avatar (24 px in a table, 32 px in a card) before a name that truncates; optional `src`, `initials`, `tone` and a muted `description`. | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-seatring.webp" width="120" alt="SeatRing"> | [`SeatRing`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#seatring) | Participants as seats around a circle, or in a grid on a narrow box; avatar, name, status, badge and centre slots; optionally a listbox to pick one or several (`selectionMode`). | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-secretcard.webp" width="120" alt="SecretCard"> | [`SecretCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#secretcard) | A card whose secret is not rendered until a deliberate tap or click reveals it (a role, a one-time code, a recovery key); hide again, optional `autoHideMs`, controlled or not, polite announcement. | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-shape.webp" width="120" alt="Shape"> | [`Shape`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#shape) | Material 3 Expressive's 35 shapes and a squircle as a backdrop, an icon container or a mask for a photo, with a morph; eight tones or an app tone. | — |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-badge.webp" width="120" alt="Badge"> | [`Badge`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#badge) | Status pill, 20 px: default, secondary, error, success, info, warning, `soft` (tonal, for states), outlined; an optional decorative `icon` before the words. | `Badge` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-badge.webp" width="120" alt="Badge"> | [`Badge`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#badge) | Status pill, `sm` (20 px) or `md` (24 px): default, secondary, error, success, info, warning, `soft` (tonal, for states), outlined; an optional decorative `icon` before the words. | `Badge` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-countbadge.webp" width="120" alt="CountBadge"> | [`CountBadge`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#countbadge) | Count in the corner of its children, capped at `99+` and hidden at 0; `animated` pops it in when it changes. | `CountBadge` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-highlightedtext.webp" width="120" alt="HighlightedText"> | [`HighlightedText`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#highlightedtext) | A string with the words of a search query in a themed `<mark>`, folding case, accents and ligatures; `highlightRanges` gives the offsets. | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-dayseparator.webp" width="120" alt="DaySeparator"> | [`DaySeparator`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#dayseparator), `isNewDay`, `formatDayLabel` | "Today", "Yesterday", the weekday or the date between two hairlines, in the provider's language; sticky if asked. | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-periodcards.webp" width="120" alt="PeriodCards"> | [`PeriodCards`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#periodcards) | Consecutive date ranges (terms, sprints) as cards: a "Current" marker with `aria-current`, a link over each card, as many 14rem columns as fit (one on a phone). | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-chip.webp" width="120" alt="Chip"> | [`Chip`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#chip) | Compact pill in three looks (hairline, soft, tag) and a dashed add pill, with leading, avatar and trailing slots, a selected state and a dismiss button; a coloured soft chip reads as a status (the tone's container, its text colour on it). | `Chip` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-statcard.webp" width="120" alt="StatCard"> | [`StatCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#statcard) | KPI tile with value, hint, icon, toned delta and a loading skeleton; `tone` and `variant` (`outlined`, `tonal`, `filled`) colour it, `valueSize` enlarges the value, `size="sm"` makes a compact tile (it ignores `hint`, `delta` and `valueSize`); `href` (and `linkComponent`) makes the whole card one link with a trailing chevron; `StatCardGroup` lays compact tiles 2×2 on a phone and in a row beside, holds its width in a flex row, and `align="end"` sets them against its end edge. | `StatCard` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-tonevalue.webp" width="120" alt="ToneValue"> | [`ToneValue`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#tonevalue) | A value in its tone's text colour after a shape (diamond, triangle, circle, square), so colour is never the only signal; what `meta.tone` / `meta.toneLabel` put in a `DataTable`, `ServerTable` or `DataGrid` cell, with `toneBands` from `@nxgt/material-core/cell-tone`. | — |
 | | [`TotalsList`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#totalslist) | On-screen `PrintTotals`: a `dl` of labelled figures, labels at the start, right-aligned tabular amounts, a ruled `last` row for the grand total, a `tone` per amount, an accessible `label`; rows share the shape of `PrintTotalRow`. | — (later, #2492) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-metric-cards.webp" width="120" alt="TrendCard"> | [`TrendCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#metric-cards), `GoalCard`, `BreakdownCard`, `RankCard`, `CompareCard`, `HeatweekCard`, `FunnelCard`, `GaugeCard`, `SparkbarCard`, `DeltaListCard`, `BandCard`, `LatencyCard`, `RatioCard`, `ThresholdCard`, `PaceCard`, `HistogramCard`, `Sparkline` | Dashboard tiles including compare, heat, funnel, gauge, spark bars, delta list, range band, latency, ratio, threshold, pace and labelled histogram. Container queries. A `tone` (named, or your app's) draws the accent in it; deltas and breaches stay semantic. | `TrendCard`, `GoalCard`, `BreakdownCard`, `RankCard`, `CompareCard`, `HeatweekCard`, `FunnelCard`, `GaugeCard`, `SparkbarCard`, `DeltaListCard`, `BandCard`, `LatencyCard`, `RatioCard`, `ThresholdCard`, `PaceCard`, `HistogramCard` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-card-presets.webp" width="120" alt="FeatureCard"> | [`FeatureCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#card-presets), `MediaCard`, `PricingCard`, `ProfileCard`, `QuoteCard`, `OverlayCard`, `SpotlightCard`, `CrewCard`, `SplitCard`, `TicketCard`, `NoticeCard`, `TimelineCard`, `MessageCard`, `EventCard`, `StackCard`, `LinkCard`, `AlbumCard`, `TagCard`, `ReceiptCard`, `ReviewCard`, `OfferCard`, `PlaceCard`, `FileCard`, `StatusCard`, `ScoreCard`, `ShortcutCard`, `ChecklistCard` | Card presets including overlay, ticket, inbox, event, stack, link, album, tags, receipt, review, offer, place, file, status, score, shortcuts and checklist. Container queries. | `FeatureCard`, `MediaCard`, `PricingCard`, `ProfileCard`, `QuoteCard`, `OverlayCard`, `SpotlightCard`, `CrewCard`, `SplitCard`, `TicketCard`, `NoticeCard`, `TimelineCard`, `MessageCard`, `EventCard`, `StackCard`, `LinkCard`, `AlbumCard`, `TagCard`, `ReceiptCard`, `ReviewCard`, `OfferCard`, `PlaceCard`, `FileCard`, `StatusCard`, `ScoreCard`, `ShortcutCard`, `ChecklistCard` |
@@ -779,13 +782,13 @@ 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-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`). A column styles its cells by value with `meta.cellClassName`, `meta.tone` and `meta.toneLabel` ([guide](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#cells-toned-by-their-value)). | `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 (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`, 44px targets on a touch screen, focus kept while a page loads), actions that stay on the search's row on a phone (`bandActions`), `surface="none"` to sit in a Card with no frame of its own, a bulk bar that reserves no row until a selection, bulk actions with `appliesTo` that count and run only the selected rows they apply to (hidden at zero), an accessible `name`, a `max` rows with a notice, and `focusTrigger()` to give the focus back after a dialog, 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-rowmenu.webp" width="120" alt="RowMenu"> | [`RowMenu`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#rowmenu), `RowMenuTrigger`, `rowMenuColumn` | A row's "..." button named after its row ("Actions for Ada"; 44px on touch, 36px with a mouse from `md`), its menu aligned to the end with the destructive item last and 44px items on touch, and a column helper for `DataTable` and `ServerTable` under a hidden but named "Actions" header; focus returns to the button, also from a dialog an item opened; `useRowMenuFocus()` / `focusRowMenu(rowId)` hands it back to one row's button after an async action, a toast or a later dialog, and `rowFocusProps(rowId)` marks a plain row button the same way. | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-table-filter-lists-recordactionsmenu.webp" width="120" alt="RecordActionsMenu"> | [`RecordActionsMenu`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#recordactionsmenu), `useRecordActions` | A record's archive, restore and delete menu over `RowMenu`: Archive runs at once with an Undo toast that stays until dismissed, Restore runs at once, Delete permanently (archived records only) always asks and keeps a refusal in its locked dialog; `can` hides what is not allowed (and the whole menu when nothing is), `send` does the action, `onDone` follows it, `items` / `children` add your own entries, `messages` renames the words; `archivePolicy="confirm"` asks before archiving (no Undo), `consequence` notes what an action entails, `successAction` adds a toast action, and `ActionRefusal` / `isActionRefusal` carry a refusal's details and action. | — |
 | <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-pagefooter.webp" width="120" alt="PageFooter"> | [`PageFooter`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#pagefooter) | The page footer of a feed that is not a table (a list of cards, a news feed) under a `FilterBar`: the range ("21–40 of 134") and Previous / Next as real links built from the URL's cursor trail (`pageInfo`, `totalCount`, `params`; `totalCount` is optional: a feed with no total shows no range, only Previous / Next; `hideOnSinglePage` renders nothing when there is no previous and no next page), the same footer `ServerTable` draws, icon-only with `pageControls="icon"` (44px targets on a touch screen); an end with no page is a disabled button, `aria-disabled`. | `PageFooter` |
-| <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-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. Columns take the same `meta.cellClassName`, `meta.tone` and `meta.toneLabel` as `DataTable` ([guide](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#cells-toned-by-their-value)). | — (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`, `FilterBar`, `useFilterUrlQuery` · `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; `bandDensity="compact"` as on `ServerTable`), and `FilterBar`, the same bar bound to the URL for a feed or list without a table (`useFilterUrlQuery` is its hook, also `ServerTable`'s), a field `default` shown as an uncounted hint chip (a button that opens the editor on the default), a pressed toggle or checked values with a "Default" word (`defaults` prop), a `scope` field as a leading pill kept by "Clear all", a server refusal shown on the chip (`errors`, its words in the Alert under the bar unless `errorSummary={false}`), on the search box (`searchError`) or as an Alert under the bar (`formError`) and a model with `search: false`; the filter bar's "Filters (N)" (`FilterSheetTrigger`) can be placed inside a `ServerTable` (its actions). | `Filter`, `FilterProvider`, `FilterContent`, `FilterChips`, `FilterPresets`, `FilterSheetTrigger`, `FilterFormField`; `FilterBar`, `useFilterUrlQuery`: — (later, #1569) |
 | — | [`FilterInline`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-table-filter-and-lists.md#filterinline-filterpopover-filterdialog-filtersheet-filterdrawer), `FilterPopover`, `FilterDialog`, `FilterSheet`, `FilterDrawer` | The filter panel shown inline, or in a popover, dialog, sheet or drawer. | `FilterInline`, `FilterPopover`, `FilterDialog`, `FilterSheet`, `FilterDrawer` |
@@ -862,7 +865,7 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/feedback-status-customdialog.webp" width="120" alt="CustomDialog"> | [`CustomDialog`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/feedback-and-status.md#customdialog) | Ready-made dialog with trigger, icon, title, body and footer. | `CustomDialog` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/feedback-status-stepupdialog.webp" width="120" alt="StepUpDialog"> | [`StepUpDialog`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/feedback-and-status.md#stepupdialog) | "Confirm it's you": a dialog that asks for a one-time code, driven by props (`via`, `attemptsLeft`, `error`, `pending`, `confirming`). The title takes the focus, the field after a refusal; `DialogFooter` `stackOnPhone={false}` keeps its footer one row on a phone. | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/feedback-status-emptystate.webp" width="120" alt="EmptyState"> | [`EmptyState`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/feedback-and-status.md#emptystate) | Illustration, title, description and action, by kind (empty, search, not-found, unauthorized); `compact` size, or `inline` as one row in a list. | `EmptyState` |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/feedback-status-pageloadfailed.webp" width="120" alt="PageLoadFailed"> | [`PageLoadFailed`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/feedback-and-status.md#pageloadfailed) | An `EmptyState` for a page opened at a cursor that failed, with a "Back to the start" link. | not yet |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/feedback-status-pageloadfailed.webp" width="120" alt="PageLoadFailed"> | [`PageLoadFailed`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/feedback-and-status.md#pageloadfailed) | An `EmptyState` for a page opened at a cursor that failed, with a "Back to the start" link and an optional Retry (`onRetry`). | not yet |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/feedback-status-errorstate.webp" width="120" alt="ErrorState"> | [`ErrorState`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/feedback-and-status.md#errorstate) | Failure block (`role="alert"`) with illustration, outlined Retry and collapsed technical details; generic, offline and maintenance kinds. | `ErrorState` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/feedback-status-progress.webp" width="120" alt="Progress"> | [`Progress`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/feedback-and-status.md#progress), `CircularProgress`, `ProgressField` | Material 3 Expressive linear bar and circular ring (flat or wavy, eight tones, buffer and stop dot), and a labelled progress field. | `Progress`, `CircularProgress`, `ProgressField` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/feedback-status-scrollprogress.webp" width="120" alt="ScrollProgress"> | [`ScrollProgress`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/feedback-and-status.md#scrollprogress) | Hairline that tracks window or a scrollable `target` (`react-use` `useWindowScroll` / `useScroll`). `DocProgress` composes it. | `ScrollProgress` |

package/dist/{alert-dialog-CEGs7LMN.js → alert-dialog-BFk4ye-3.js}

@@ -4,7 +4,7 @@ import { o as n } from "./dist-DVRQkaTK.js";
 import { r } from "./dist-DWZXlCZR.js";
 import { a as i } from "./dist-DHdUUM1w.js";
 import { t as a } from "./in-dialog-D61Yeaol.js";
-import { a as o, c as s, d as c, i as l, l as u, n as d, o as f, r as p, s as m, t as h, u as g } from "./use-return-focus-Cqzvj9R0.js";
+import { a as o, c as s, d as c, i as l, l as u, n as d, o as f, r as p, s as m, t as h, u as g } from "./use-return-focus-CLEnhfka.js";
 import { i as _ } from "./escape-owner-DpaP0lm1.js";
 import * as v from "react";
 import { Fragment as y, isValidElement as b } from "react";

package/dist/{async-slice-CR0M95Jq.js → async-slice-gGyfyUw2.js}

@@ -1,4 +1,4 @@
-import { l as e, r as t, s as n, u as r } from "./translator-DoVsjUff.js";
+import { l as e, r as t, s as n, u as r } from "./translator-CfoXTrZd.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-DuTNpo28.js → button-C5OEq9bi.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { n as t, t as n } from "./dist-DVRQkaTK.js";
-import { n as r, t as i } from "./spinner-DcW21pN1.js";
+import { n as r, t as i } from "./spinner-JnLLiLIO.js";
 import { t as a } from "./dist-DkQbkF9T.js";
 import { a as o, i as s, n as c, o as l, s as u, t as d } from "./use-click-lock-Bwg_caHO.js";
 import { t as f } from "./is-production-GLw59WU8.js";

package/dist/{calculator-DsGk_fCw.js → calculator-Dg_L6d3R.js}

@@ -1,8 +1,8 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { n as t, r as n, t as r, u as i } from "./tabs-CdoBFtWx.js";
-import { t as a } from "./button-DuTNpo28.js";
-import { t as o } from "./use-material-translation-BdrItuwY.js";
-import { t as s } from "./icon-button-DE1EcO2-.js";
+import { d as t, n, r, t as i } from "./tabs-dXCZGShv.js";
+import { t as a } from "./button-C5OEq9bi.js";
+import { t as o } from "./use-material-translation-DoymV6IP.js";
+import { t as s } from "./icon-button-D0xjBCst.js";
 import { t as c } from "./copy-to-clipboard-Be5Ffvs_.js";
 import { t as l } from "./useEvent-2fKq-6w8.js";
 import { t as u } from "./useLatest-C2PnQEeD.js";
@@ -11,7 +11,7 @@ import { t as f } from "./skeleton-DSdtr2qc.js";
 import { t as p } from "./live-status-BGPaN8r8.js";
 import { n as m, t as h } from "./calculator-context-BugcKuVG.js";
 import { a as g, c as _, i as v, l as y, n as b, o as ee, r as te, s as ne } from "./calculator-announce-DRd2c6Dq.js";
-import { i as re, t as ie } from "./pos-types-CpTpT4vE.js";
+import { i as re, t as ie } from "./pos-types-BrZBX0Zg.js";
 import { a as ae, r as oe } from "./key-layout-cR79xfGE.js";
 import { n as x, r as se, t as ce } from "./programmer-word-CNCF7DJF.js";
 import { t as le } from "./standard-layout-BuSRr3TY.js";
@@ -279,11 +279,11 @@ function Le({ helpId: e }) {
 //#endregion
 //#region lib/components/ui/widgets/calculator/variants/variant-loader.ts
 var Re = {
-	scientific: () => import("./scientific-variant-rfvJKxB4.js"),
-	pos: () => import("./pos-variant-Bs5BUB1L.js"),
-	programmer: () => import("./programmer-variant-B1eI1fd0.js"),
-	financial: () => import("./financial-variant-CYgRZzKT.js"),
-	conversion: () => import("./conversion-variant-DfQiOwYC.js")
+	scientific: () => import("./scientific-variant-BvutlF8a.js"),
+	pos: () => import("./pos-variant-G12HCSfQ.js"),
+	programmer: () => import("./programmer-variant-WWLwTGRF.js"),
+	financial: () => import("./financial-variant-D80C1hVD.js"),
+	conversion: () => import("./conversion-variant-4gCdFWV-.js")
 }, B = "failed", V = /* @__PURE__ */ new Map(), H = /* @__PURE__ */ new Map(), U = /* @__PURE__ */ new Set(), W = () => {
 	for (let e of U) e();
 };
@@ -432,24 +432,24 @@ function qe(e) {
 //#region lib/components/ui/widgets/calculator/partials/calculator-switcher.tsx
 function Je({ children: e }) {
 	let { t: a } = o(), { variant: s, variants: c, setVariant: l } = m();
-	return /* @__PURE__ */ k(r, {
+	return /* @__PURE__ */ k(i, {
 		value: s,
 		variant: "segmented",
 		className: "nxgt-calc-tabs",
 		onValueChange: (e) => l(e),
-		children: [/* @__PURE__ */ O(n, {
+		children: [/* @__PURE__ */ O(r, {
 			"aria-label": a("material.calculator.variants.label", "Calculator type"),
 			className: "nxgt-calc-switcher",
 			children: c.map((e) => {
-				let n = q[e];
-				return /* @__PURE__ */ O(t, {
+				let t = q[e];
+				return /* @__PURE__ */ O(n, {
 					value: e,
 					onPointerEnter: () => void G(e),
 					onFocus: () => void G(e),
-					children: a(n.key, n.fallback)
+					children: a(t.key, t.fallback)
 				}, e);
 			})
-		}), /* @__PURE__ */ O(i, {
+		}), /* @__PURE__ */ O(t, {
 			value: s,
 			className: "nxgt-calc-panel",
 			children: e

package/dist/calculator-field.js

@@ -1,11 +1,11 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { t } from "./button-DuTNpo28.js";
-import { t as n } from "./use-material-translation-BdrItuwY.js";
-import { t as r } from "./icon-button-DE1EcO2-.js";
-import { a as i, i as a, n as o, r as s, t as c } from "./picker-surface-DkfTv_ft.js";
-import { r as l, t as u } from "./currency-field-cwC7cqUE.js";
+import { t } from "./button-C5OEq9bi.js";
+import { t as n } from "./use-material-translation-DoymV6IP.js";
+import { t as r } from "./icon-button-D0xjBCst.js";
+import { a as i, i as a, n as o, r as s, t as c } from "./picker-surface-CnlOKQ3D.js";
+import { r as l, t as u } from "./currency-field-CIqe7Wg4.js";
 import { r as d, t as f } from "./field-blur-DkiZOVNV.js";
-import { t as p } from "./calculator-DsGk_fCw.js";
+import { t as p } from "./calculator-Dg_L6d3R.js";
 import { useId as m, useState as h } from "react";
 import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
 import { Calculator as y } from "lucide-react";

package/dist/{calculator-segment-DMFptsDf.js → calculator-segment-CvAaDqKf.js}

@@ -1,4 +1,4 @@
-import { t as e } from "./use-material-translation-BdrItuwY.js";
+import { t as e } from "./use-material-translation-DoymV6IP.js";
 import { jsx as t } from "react/jsx-runtime";
 //#region lib/components/ui/widgets/calculator/partials/calculator-segment.tsx
 function n({ label: n, choices: r, value: i, nameKey: a, onChange: o }) {

package/dist/calculator.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "./calculator-DsGk_fCw.js";
+import { n as e, t } from "./calculator-Dg_L6d3R.js";
 export { e as CALCULATOR_VARIANTS, t as Calculator };

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 "./warn-once-C_e47JM8.js";
-import { t as r } from "./button-DuTNpo28.js";
-import { t as i } from "./use-material-translation-BdrItuwY.js";
+import { t as r } from "./button-C5OEq9bi.js";
+import { t as i } from "./use-material-translation-DoymV6IP.js";
 import { t as a } from "./use-ssr-media-query-C6M5m8sf.js";
 import { i as o, n as s, r as c, t as l } from "./util-4heV2LPI.js";
 import { t as u } from "./useIsomorphicLayoutEffect-DfgAhWcH.js";
-import { t as d } from "./chip-C-RAjar5.js";
+import { t as d } from "./chip-DOxFA4BI.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-C-RAjar5.js → chip-DOxFA4BI.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { n as t } from "./spinner-DcW21pN1.js";
+import { n as t } from "./spinner-JnLLiLIO.js";
 import { s as n } from "./use-click-lock-Bwg_caHO.js";
-import { t as r } from "./use-material-translation-BdrItuwY.js";
+import { t as r } from "./use-material-translation-DoymV6IP.js";
 import { t as i } from "./react-node-text-Crkpfpco.js";
 import { cloneElement as a, isValidElement as o } from "react";
 import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";

package/dist/{code-editor-DApeIOZ3.js → code-editor-tiAjhXW-.js}

@@ -1,12 +1,12 @@
 import { r as e } from "./rolldown-runtime-BFFgcFxR.js";
 import { t } from "./utils-BLfntITJ.js";
 import { t as n } from "./dist-DWZXlCZR.js";
-import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-xUUE5X6T.js";
+import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-DO5kUvof.js";
 import { a as c, i as l, n as u } from "./field-blur-context-BLGgf_3z.js";
-import { a as d, o as f, r as p, s as m, t as h } from "./toolbar-items-CZ1lJXZZ.js";
+import { a as d, o as f, r as p, s as m, t as h } from "./toolbar-items-B-kMYsDT.js";
 import { t as g } from "./is-production-GLw59WU8.js";
-import { t as _ } from "./use-material-translation-BdrItuwY.js";
-import { i as v, n as y, o as b, t as x } from "./code-language-items-CGtYfc1l.js";
+import { t as _ } from "./use-material-translation-DoymV6IP.js";
+import { i as v, n as y, o as b, t as x } from "./code-language-items-CcdzQvLT.js";
 import { t as S } from "./useIsomorphicLayoutEffect-DfgAhWcH.js";
 import { n as C, t as w } from "./escape-owner-DpaP0lm1.js";
 import { t as T } from "./skeleton-DSdtr2qc.js";

package/dist/code-editor.js

@@ -1,13 +1,13 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { t } from "./dist-DWZXlCZR.js";
-import { o as n, r, s as i, t as a } from "./toolbar-items-CZ1lJXZZ.js";
-import { t as o } from "./use-material-translation-BdrItuwY.js";
-import { i as s, n as c, o as l } from "./code-language-items-CGtYfc1l.js";
+import { o as n, r, s as i, t as a } from "./toolbar-items-B-kMYsDT.js";
+import { t as o } from "./use-material-translation-DoymV6IP.js";
+import { i as s, n as c, o as l } from "./code-language-items-CcdzQvLT.js";
 import { t as u } from "./skeleton-DSdtr2qc.js";
 import { t as d } from "./live-status-BGPaN8r8.js";
 import { t as f } from "./use-mobile-BDro060N.js";
 import { t as p } from "./react-node-text-Crkpfpco.js";
-import { a as m, c as h, d as g, f as _, i as v, l as y, m as b, o as x, p as S, r as C, s as w, t as T, u as E } from "./code-editor-DApeIOZ3.js";
+import { a as m, c as h, d as g, f as _, i as v, l as y, m as b, o as x, p as S, r as C, s as w, t as T, u as E } from "./code-editor-tiAjhXW-.js";
 import { r as D, t as O } from "./field-blur-DkiZOVNV.js";
 import { useEffect as k, useRef as A, useState as j } from "react";
 import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";

package/dist/{code-language-items-CGtYfc1l.js → code-language-items-CcdzQvLT.js}

@@ -1,5 +1,5 @@
-import { d as e, f as t } from "./dropdown-menu-xUUE5X6T.js";
-import { t as n } from "./use-material-translation-BdrItuwY.js";
+import { d as e, f as t } from "./dropdown-menu-DO5kUvof.js";
+import { t as n } from "./use-material-translation-DoymV6IP.js";
 import { t as r } from "./copy-to-clipboard-Be5Ffvs_.js";
 import { t as i } from "./live-status-BGPaN8r8.js";
 import { useEffect as a, useRef as o, useState as s } from "react";