@nxgt/material 3.25.0 → 3.26.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @nxgt/material
 
+## 3.26.0
+
+### Minor Changes
+
+- [#1627](https://github.com/softistx/nxgt-material/pull/1627) [`ba65c4e`](https://github.com/softistx/nxgt-material/commit/ba65c4e9aaaa9cf58bd3bd9036b93931227d2974) Thanks [@SteveGT96](https://github.com/SteveGT96)! - New `ChangeHistory` (`Data display/ChangeHistory`): a history of the changes made to anything (a document, a project's settings, a file), with who changed what and when and the values before and after. Nothing in its API names a domain: `entries`, `kinds`, `author`.
+  
+  - `variant="rail"` (default): a thin rail of toned dot icons, one row per entry with the avatar, a sentence, the relative time (exact time on hover and on focus), and the changes as a description list (old value struck through, an arrow, the new value in a tinted pill). `variant="cards"`: a card tinted by kind with an icon chip, the kind word and a Before / After block that spells its words.
+  - `kinds` merges over the built-ins (`created` success, `updated` neutral, `archived` and `restored` warning, `purged` and `deleted` error); an app overrides a part or adds its own kinds. `groupBy` (`day` | `none`), `collapseAfter` (default 3, "N fields changed" / "N fields set" with a preview of the names), `filter` slot, `loading`, `hasMore` / `onLoadMore` / `total` ("Showing X of Y", announced politely; the focus moves to the first new entry when Load more takes the last page), `empty`, `now` and `timeZone` (pass both from the server so the grouping and labels match on hydration), `headingLevel` (day headings, default 3).
+  - A `redacted` change shows "Hidden" and never renders its values; a `created` entry shows values only. Each entry is an `article` in an `ol` labelled "{kind} by {author}, {date and time}"; day headings are real headings.
+  - Small, additive upstream changes with unchanged defaults: `DaySeparator` takes `as` (`h2` to `h6` for a real heading), `RelativeTime` takes `focusable`, `tooltip` and `now` and forwards its `ref`.
+  - i18n: `material.history.*` in en and fr (React only; the Vue twin is a `vue` issue).
+
+## 3.25.1
+
+### Patch Changes
+
+- [#1636](https://github.com/softistx/nxgt-material/pull/1636) [`ec28832`](https://github.com/softistx/nxgt-material/commit/ec28832aa373e6998398ddeeb137dddc537ac348) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `ActivityLayout`: the sidebar's fill now runs the whole height of the page. The sidebar is sticky and only as tall as the viewport, so on a page taller than the viewport the column below it showed the page ground (a visible step at the bottom left, most visible in dark, where the ground is darker than the rail). The fill now sits on a lane around the sidebar (`data-slot="activity-layout-rail"`) that stretches with the frame, out to its top, left and bottom edges; the sidebar inside it has no fill of its own. A play pins that the backdrop layer is drawn above the page ground and that the rail's fill reaches the bottom of a tall page, in light and dark, with and without a backdrop. Fixes [#1632](https://github.com/softistx/nxgt-material/issues/1632).
+  
+  Shapes missing between the cards of a dense page are not the ground: since 3.22 a backdrop glyph is dropped wherever it would meet a card, a text or a control (8px margin), so a gap narrower than a glyph stays empty. See the troubleshooting entry.
+
 ## 3.25.0
 
 ### Minor Changes

package/README.md

@@ -611,6 +611,7 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-listtile.webp" width="120" alt="ListTile"> | [`ListTile`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#listtile) | Row with leading / trailing slots, title and subtitle; becomes a link (with a decorative chevron; `selected` sets `aria-current="page"`), a button, or with `toggle` a switch row where the whole row toggles. `size="sm"` is the dense row; `chips` and `variant="divided"` make it a compact record row, `as="li"` puts it in a list. | `ListTile` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-accordioncard.webp" width="120" alt="AccordionCard"> | [`AccordionCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#accordioncard) | Renders `items` (title, content) as a styled accordion. | `AccordionCard` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-timeline.webp" width="120" alt="Timeline"> | [`Timeline`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#timeline), `TimelineItem`, `RelativeTime` | Vertical event timeline with toned icons and relative times. | `Timeline`, `TimelineItem`, `RelativeTime` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-changehistory.webp" width="120" alt="ChangeHistory"> | [`ChangeHistory`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#changehistory) | History of the changes made to anything (a document, a project's settings, a file): a rail of toned dots or tinted cards with a Before / After block, a heading per day (sticky on the rail), long entries collapsed behind "N fields changed", redacted values shown as "Hidden", the exact time on hover and focus, load more. | — (later, #1626) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-eventchip.webp" width="120" alt="EventChip"> | [`EventChip`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#eventchip) | Calendar event pill — soft, solid or outlined — with its times, all-day and continuation edges. | `EventChip` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-codeblock.webp" width="120" alt="CodeBlock"> | [`CodeBlock`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#codeblock), `JsonViewer`, `CodeGroup` | Highlighted code with line numbers and copy, a collapsible JSON tree, and tabbed samples (`Tabs`, underlined). `CodeDiff` is under Rich widgets. | `CodeBlock`, `JsonViewer`, `CodeGroup` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-markdown.webp" width="120" alt="Markdown"> | [`Markdown`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#markdown), `MermaidDiagram` | GFM markdown with KaTeX math and mermaid diagrams (`clientOnly`). Fences reuse `CodeBlock`. `ChatMarkdown` renders through it. | `Markdown`, `MermaidDiagram` |

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

@@ -1,5 +1,5 @@
-import { i as e, r as t, t as n } from "./stored-language-CJn_iWwG.js";
-import { r } from "./translator-1THr41fc.js";
+import { i as e, r as t, t as n } from "./stored-language-pHK1kTl6.js";
+import { r } from "./translator-DEPJOWV-.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-rdIhY2BT.js → button-e-N2SrR4.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-B7HCQMFr.js";
+import { t as o } from "./spinner-BuMxoFCj.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-BFQODuQz.js";
-import { t as r } from "./button-rdIhY2BT.js";
+import { t as n } from "./use-material-translation-DgeOLK6g.js";
+import { t as r } from "./button-e-N2SrR4.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-CEau88ZV.js";
+import { t as d } from "./chip-CaIK5m3c.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-CEau88ZV.js → chip-CaIK5m3c.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-BFQODuQz.js";
+import { t as n } from "./use-material-translation-DgeOLK6g.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-DHB5ytUz.js → code-editor-CTNdNmnn.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-mTDyFwbQ.js";
+import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-D5yDYO-N.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-Tn3MMu-s.js";
+import { a as d, d as f, r as p, t as m, u as h } from "./toolbar-items-BgcE2dSq.js";
 import { t as g } from "./is-production-GLw59WU8.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 _ } from "./use-material-translation-DgeOLK6g.js";
+import { i as v, n as y, o as b, t as x } from "./code-language-items-Cra1Wt0w.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-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 { d as n, r, t as i, u as a } from "./toolbar-items-BgcE2dSq.js";
+import { t as o } from "./use-material-translation-DgeOLK6g.js";
+import { i as s, n as c, o as l } from "./code-language-items-Cra1Wt0w.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-DHB5ytUz.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-CTNdNmnn.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-Dww9amx_.js → code-language-items-Cra1Wt0w.js}

@@ -1,5 +1,5 @@
-import { d as e, f as t } from "./dropdown-menu-mTDyFwbQ.js";
-import { t as n } from "./use-material-translation-BFQODuQz.js";
+import { d as e, f as t } from "./dropdown-menu-D5yDYO-N.js";
+import { t as n } from "./use-material-translation-DgeOLK6g.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";