@nxgt/material 3.91.0 → 3.92.0

package/dist/{translator-CfoXTrZd.js → translator-CxyFsfO0.js}

@@ -1299,7 +1299,10 @@ var r = {
 			download: "Download",
 			remove: "Remove",
 			replace: "Replace",
-			retry: "Retry"
+			retry: "Retry",
+			"move-up": "Move {name} up",
+			"move-down": "Move {name} down",
+			moved: "Moved {name} to position {to}"
 		},
 		"inline-edit": {
 			edit: "Edit",
@@ -4776,7 +4779,10 @@ var r = {
 			download: "Télécharger",
 			remove: "Retirer",
 			replace: "Remplacer",
-			retry: "Réessayer"
+			retry: "Réessayer",
+			"move-up": "Monter {name}",
+			"move-down": "Descendre {name}",
+			moved: "{name} déplacé en position {to}"
 		},
 		"inline-edit": {
 			edit: "Modifier",

package/dist/{use-chat-composer-DFD_eF-r.js → use-chat-composer-FACltVyX.js}

@@ -4,28 +4,28 @@ import { t as n } from "./utils-BLfntITJ.js";
 import { n as r } from "./use-shape-morph-BKA_R5P5.js";
 import { n as i, o as a, t as o } from "./dist-DVRQkaTK.js";
 import { i as s, n as c, r as l, t as u } from "./dist-DWZXlCZR.js";
-import { _ as d, a as f, b as p, g as m, h, i as g, m as _, n as v, o as y, r as b, s as x, t as S, v as C, y as w } from "./spinner-JnLLiLIO.js";
+import { _ as d, a as f, b as p, g as m, h, i as g, m as _, n as v, o as y, r as b, s as x, t as S, v as C, y as w } from "./spinner-CHWFXCfd.js";
 import { a as T, i as E, n as D, r as O, t as k } from "./dist-DHdUUM1w.js";
 import { a as A, i as ee } from "./dist-DOK3zo5C.js";
 import { i as j, n as M } from "./in-dialog-D61Yeaol.js";
-import { c as N, l as P, n as te, r as F, t as ne } from "./alert-dialog-BFk4ye-3.js";
+import { c as N, l as P, n as te, r as F, t as ne } from "./alert-dialog-Bz5PlYKp.js";
 import { A as re, C as ie, D as ae, E as oe, O as se, S as I, T as ce, _ as le, a as ue, b as de, d as fe, f as pe, g as me, h as he, i as ge, k as _e, l as ve, m as ye, n as be, o as xe, p as Se, r as Ce, s as we, t as Te, u as Ee, v as De, w as Oe, x as ke, y as Ae } from "./floating-ui.dom-KkZSW8_E.js";
-import { D as je, E as Me, N as Ne, O as Pe, c as Fe, d as Ie, f as Le, i as Re, k as ze, m as Be, n as Ve, o as He, p as Ue, t as We, u as Ge } from "./dropdown-menu-DO5kUvof.js";
+import { D as je, E as Me, N as Ne, O as Pe, c as Fe, d as Ie, f as Le, i as Re, k as ze, m as Be, n as Ve, o as He, p as Ue, t as We, u as Ge } from "./dropdown-menu-B2ctUFti.js";
 import { a as Ke, i as qe, n as Je } from "./field-blur-context-BLGgf_3z.js";
-import { i as Ye, n as Xe, r as Ze, t as Qe } from "./popover-BevReSHi.js";
+import { i as Ye, n as Xe, r as Ze, t as Qe } from "./popover-ukgGm5B6.js";
 import { a as $e, i as et, n as tt, o as nt, t as rt } from "./bubble-input-CQwVSoU3.js";
-import { d as it, n as at, r as ot, t as st } from "./tabs-dXCZGShv.js";
-import { a as ct, n as lt, o as ut, s as dt, v as ft, y as pt } from "./toolbar-items-B-kMYsDT.js";
+import { d as it, n as at, r as ot, t as st } from "./tabs-BideU0Rb.js";
+import { a as ct, n as lt, o as ut, s as dt, v as ft, y as pt } from "./toolbar-items-azkXY5w2.js";
 import { t as mt } from "./dist-DkQbkF9T.js";
 import { o as ht, s as gt, t as _t } from "./use-click-lock-Bwg_caHO.js";
 import { a as vt, r as yt } from "./icon-sprites-CaYXzOL4.js";
 import { t as bt } from "./warn-once-C_e47JM8.js";
-import { r as xt, t as St } from "./button-C5OEq9bi.js";
-import { a as Ct } from "./translator-CfoXTrZd.js";
+import { r as xt, t as St } from "./button-a3tH3pq4.js";
+import { a as Ct } from "./translator-CxyFsfO0.js";
 import { h as wt } from "./get-CTzJAwfc.js";
 import { t as Tt } from "./isEmpty-F_g3jLf8.js";
-import { t as L } from "./use-material-translation-DoymV6IP.js";
-import { t as R } from "./icon-button-D0xjBCst.js";
+import { t as L } from "./use-material-translation-DA5ECZfA.js";
+import { t as R } from "./icon-button-BylI02aX.js";
 import { t as Et } from "./use-ssr-media-query-C6M5m8sf.js";
 import { n as Dt, t as Ot } from "./typography-CYEquVeb.js";
 import { n as kt, t as At } from "./util-4heV2LPI.js";
@@ -36,15 +36,15 @@ import { a as Bt } from "./toggle-group-CVMxEpWi.js";
 import { n as Vt } from "./use-slice-reducer-BGkeGtML.js";
 import { t as Ht } from "./browser-only-DQ94lWF8.js";
 import { t as Ut } from "./compose-refs-G4J4kaUA.js";
-import { n as Wt, r as Gt, t as Kt } from "./chip-DOxFA4BI.js";
+import { n as Wt, r as Gt, t as Kt } from "./chip-BwGvGx_S.js";
 import { c as qt, o as Jt, r as Yt, s as Xt, t as Zt } from "./input-CC2joTjB.js";
-import { i as Qt, n as $t, t as en } from "./input-group-CSlXMFxu.js";
+import { i as Qt, n as $t, t as en } from "./input-group-CiayHfBN.js";
 import { t as tn } from "./text-field-BAdY-kpO.js";
 import { r as nn } from "./use-csp-nonce-ZKs9k-ov.js";
-import { t as rn } from "./empty-state-DQnICuun.js";
+import { t as rn } from "./empty-state-Bs44jnWk.js";
 import { t as an } from "./skeleton-DSdtr2qc.js";
-import { l as on, n as sn, o as cn, r as ln, s as un, t as dn, u as fn } from "./dialog-d6Kdf5wc.js";
-import { t as pn } from "./icon-badge-BGczZ4Hc.js";
+import { l as on, n as sn, o as cn, r as ln, s as un, t as dn, u as fn } from "./dialog-vQMypIOm.js";
+import { t as pn } from "./icon-badge-YT98b2Vx.js";
 import { H as mn, V as hn, X as gn, bt as _n, it as vn, lt as yn, n as bn, t as xn, xt as Sn, yt as Cn } from "./dist-moutbfbd.js";
 import { t as wn } from "./markdown-Dw_uH7j7.js";
 import { r as Tn, t as En } from "./create-store-Dqp-PLLn.js";
@@ -11180,7 +11180,7 @@ var eS = (e = {}) => Tn({
 		let [{ default: t }, { lowlight: n }, { richCodeBlock: r }] = await Promise.all([
 			import("./dist-CRMFGjng.js"),
 			import("./lowlight-OtcjU2Sa.js"),
-			import("./rich-code-block-Dh9J-VZ8.js")
+			import("./rich-code-block-DUaSLxLT.js")
 		]);
 		return [r(t, {
 			lowlight: n,
@@ -21099,40 +21099,40 @@ function nF({ editor: e }) {
 //#endregion
 //#region lib/components/ui/widgets/editor/extensions/marks/compact-mark-buttons.tsx
 function rF({ editor: e }) {
-	let { t } = L(), n = Rt({
+	let { t } = L(), n = !!e.schema.marks.strike, r = Rt({
 		editor: e,
 		selector: (e) => ({
 			isBold: e.editor.isActive("bold") ?? !1,
 			canBold: e.editor.can().chain().toggleBold().run() ?? !1,
 			isItalic: e.editor.isActive("italic") ?? !1,
 			canItalic: e.editor.can().chain().toggleItalic().run() ?? !1,
-			isStrike: e.editor.isActive("strike") ?? !1,
-			canStrike: e.editor.can().chain().toggleStrike().run() ?? !1
+			isStrike: n && (e.editor.isActive("strike") ?? !1),
+			canStrike: n && (e.editor.can().chain().toggleStrike().run() ?? !1)
 		})
 	});
 	return /* @__PURE__ */ K(Jr, { children: [
 		/* @__PURE__ */ G(Hy, {
-			variant: n.isBold ? "filled" : "ghost",
-			"aria-pressed": n.isBold,
+			variant: r.isBold ? "filled" : "ghost",
+			"aria-pressed": r.isBold,
 			tooltip: t("material.rich-text-editor.bold", "Bold"),
 			onClick: () => e.chain().focus().toggleBold().run(),
-			disabled: !n.canBold,
+			disabled: !r.canBold,
 			children: /* @__PURE__ */ G(ci, {})
 		}),
 		/* @__PURE__ */ G(Hy, {
-			variant: n.isItalic ? "filled" : "ghost",
-			"aria-pressed": n.isItalic,
+			variant: r.isItalic ? "filled" : "ghost",
+			"aria-pressed": r.isItalic,
 			tooltip: t("material.rich-text-editor.italic", "Italic"),
 			onClick: () => e.chain().focus().toggleItalic().run(),
-			disabled: !n.canItalic,
+			disabled: !r.canItalic,
 			children: /* @__PURE__ */ G(Ui, {})
 		}),
-		/* @__PURE__ */ G(Hy, {
-			variant: n.isStrike ? "filled" : "ghost",
-			"aria-pressed": n.isStrike,
+		n && /* @__PURE__ */ G(Hy, {
+			variant: r.isStrike ? "filled" : "ghost",
+			"aria-pressed": r.isStrike,
 			tooltip: t("material.rich-text-editor.strikethrough", "Strikethrough"),
 			onClick: () => e.chain().focus().toggleStrike().run(),
-			disabled: !n.canStrike,
+			disabled: !r.canStrike,
 			children: /* @__PURE__ */ G(Ha, {})
 		})
 	] });
@@ -21181,7 +21181,7 @@ function oF({ editor: e, part: t = "all" }) {
 		strike: n("material.rich-text-editor.strikethrough", "Strikethrough"),
 		subscript: n("material.rich-text-editor.subscript", "Subscript"),
 		superscript: n("material.rich-text-editor.superscript", "Superscript")
-	}, i = iF.filter((e) => t === "all" || t === "main" == !!e.main), a = Rt({
+	}, i = iF.filter((n) => e.schema.marks[n.name] && (t === "all" || t === "main" == !!n.main)), a = Rt({
 		editor: e,
 		selector: (e) => i.map((t) => aF(e.editor, t.name)),
 		equalityFn: (e, t) => t !== null && e.length === t.length && e.every((e, n) => e.on === t[n]?.on && e.can === t[n]?.can)
@@ -21209,11 +21209,12 @@ function cF({ editor: e }) {
 }
 //#endregion
 //#region lib/components/ui/widgets/editor/kit/features/marks.ts
-var lF = ({ compact: e = !1 } = {}) => Tn({
+var lF = ({ compact: e = !1, strike: t = !0 } = {}) => Tn({
 	name: "marks",
 	extensions: (e) => [
 		Tr.configure({
 			codeBlock: !1,
+			strike: t ? void 0 : !1,
 			dropcursor: {
 				color: "var(--primary)",
 				width: 2,

package/dist/{use-heading-spy-BcNK1qvq.js → use-heading-spy-DHd5TScW.js}

@@ -1,8 +1,8 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { a as t, c as n, d as r, i, n as a, r as o, t as s, u as c } from "./alert-dialog-BFk4ye-3.js";
-import { a as l } from "./button-C5OEq9bi.js";
-import { i as u } from "./translate-material-BmpcP1p1.js";
-import { t as d } from "./use-material-translation-DoymV6IP.js";
+import { a as t, c as n, d as r, i, n as a, r as o, t as s, u as c } from "./alert-dialog-Bz5PlYKp.js";
+import { a as l } from "./button-a3tH3pq4.js";
+import { i as u } from "./translate-material-d8Q5K5a_.js";
+import { t as d } from "./use-material-translation-DA5ECZfA.js";
 import { _ as f, g as p, h as m, t as h, v as g, y as _ } from "./date.utils-JTEIo3mM.js";
 import { useCallback as v, useEffect as y, useMemo as b, useRef as x, useState as S } from "react";
 import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";

package/dist/{use-material-translation-DoymV6IP.js → use-material-translation-DA5ECZfA.js}

@@ -1,4 +1,4 @@
-import { i as e, t } from "./translate-material-BmpcP1p1.js";
+import { i as e, t } from "./translate-material-d8Q5K5a_.js";
 import { useCallback as n } from "react";
 //#region lib/i18n/use-material-translation.ts
 function r() {

package/dist/{use-return-focus-CLEnhfka.js → use-return-focus-CAAvJ6p5.js}

@@ -1,6 +1,6 @@
 import { o as e, r as t } from "./dist-DVRQkaTK.js";
 import { i as n, n as r, r as i, t as a } from "./dist-DWZXlCZR.js";
-import { C as o, S as s, x as c } from "./spinner-JnLLiLIO.js";
+import { C as o, S as s, x as c } from "./spinner-CHWFXCfd.js";
 import { a as l, i as u, r as d } from "./dist-DHdUUM1w.js";
 import { c as f, i as p, l as m, o as h, r as g, s as ee } from "./in-dialog-D61Yeaol.js";
 import { r as te } from "./escape-owner-DpaP0lm1.js";

package/docs/components/data-table-filter-and-lists.md

@@ -1720,10 +1720,42 @@ import { DayGroupedList } from '@nxgt/material/components';
 </div>
 ```
 
+For an agenda, `groupBy="date"` gives each distinct calendar date its own
+section, upcoming days included, with an aside such as a total beside the
+heading (outside the `<h3>`, so the heading's name stays the date). Undated
+items go last under "No date". Pass `now` and `timeZone` from the server so the
+headings match on hydration; an unknown `timeZone` falls back to the runtime's
+with a warning in development. The split is also plain data:
+`groupByDate` (re-exported by `@nxgt/material/components`, beside `groupByDay`).
+`calendarDateOf`, `formatCalendarDate` and `isValidTimeZone` are in
+`@nxgt/material-core/day-math`.
+
+```tsx
+import { DayGroupedList } from '@nxgt/material/components';
+
+// `sumMinutes` and `formatMinutes` are the app's own helpers.
+<DayGroupedList
+  items={tasks}
+  getDate={(task) => task.due}
+  getKey={(task) => task.id}
+  renderItem={(task) => <TaskRow task={task} />}
+  now={serverNow}
+  groupBy="date"
+  timeZone="America/Toronto"
+  renderAside={(_day, list) => formatMinutes(sumMinutes(list))}
+/>
+```
+
 | Prop | Type | Default | Effect |
 | --- | --- | --- | --- |
 | `items` / `getDate` / `getKey` / `renderItem` | — | required | the items, the date each is filed under, its key and its content |
 | `now` | `Date \| number` | required | the day the buckets count from, in the runtime's time zone; pass the same value to the server and the browser |
+| `groupBy` | `'relative' \| 'date'` | `'relative'` | `date` gives each distinct calendar date its own section, past and future, instead of the relative buckets |
+| `order` | `'asc' \| 'desc'` | `'asc'` | with `groupBy="date"`, earliest or latest date first |
+| `timeZone` | IANA zone | runtime's | with `groupBy="date"`, the zone instants are read in; pass the same to server and browser. A date-only string (`'2026-11-03'`) is that date in any zone |
+| `locale` | BCP 47 tag | active i18n language | with `groupBy="date"`, the language of the headings (weekday, day, month; the year only off the current year) |
+| `formatHeading` | `(day: string, items: T[]) => ReactNode` | — | with `groupBy="date"`, replaces a heading; `day` is `YYYY-MM-DD` (or `undated`) |
+| `renderAside` | `(key: string, items: T[]) => ReactNode` | — | content beside each heading, such as a day's total; `key` is the date (or `undated`), or `today`, `yesterday`… |
 | `labels` | `Partial<Record<DayGroupKey, ReactNode>>` | — | replaces a heading |
 | `sticky` | `boolean` | `true` | headings stick while their items scroll |
 | `showCount` | `boolean` | `false` | the count beside each heading |

package/docs/components/media-and-files.md

@@ -258,6 +258,22 @@ saved images).
 | `value` / `onValueChange` | `string[]` | `[]` | field variants: the stored URLs |
 | `onUpload` / `getPresignedUrl` | see [S3UploadField](#s3uploadfield-networkuploadfield) | — | field variants: how a file is sent |
 | `required` | `boolean` | — | field variants: the asterisk, and a "required" description on the field group (below) |
+| `describe` | `(value: string) => FileDescription \| null \| undefined` | — | field variants: names, sizes and types a kept value (an id, a key) instead of showing the value. `FileDescription` is `{ name?, size?, type?, href? }`; `href` is its download link (dropped when not safe: `javascript:` and the like get no Download button). `null` or `undefined` falls back to the plain display. Runs on every render: keep it pure and cheap |
+| `reorderable` | `boolean` | `false` | field variants: move up / move down buttons on the kept files, disabled at the ends and when the field is `disabled`; `onValueChange` receives the new order. The focus stays on the pressed button (the row's other one at an end) and a polite status says "Moved {name} to position {to}". Uploads in flight sit last until they finish |
+
+Kept files by name, size and type, reorderable (the value stays a `string[]`):
+
+```tsx
+<FileListS3Field
+  value={ids}
+  onValueChange={setIds}
+  getPresignedUrl={getPresignedUrl}
+  describe={(id) => files[id]} // { name, size, type, href? } | undefined
+  reorderable
+/>
+```
+
+A row's data is `NetworkUploadDisplayItem`, which gains an optional `type` and `href` (`null`: described with a link that is not safe). New `material.*` keys: `file-list.move-up` (`Move {name} up`), `file-list.move-down` (`Move {name} down`) and `file-list.moved` (`Moved {name} to position {to}`).
 
 The dropzone is a button, and a button may not carry `aria-required`, so the
 field's list and dropzone sit in a `group` named by the label. With `required`,

package/docs/components/rich-widgets.md

@@ -1108,6 +1108,21 @@ const [html, setHtml] = useState('<p></p>');
   `compactKit` and `chatKit` show bold, italic, strikethrough and inline code
   (`editorFeatures.inlineCode`) in the toolbar; underline, subscript and
   superscript stay readable in the content but have no button.
+  Strikethrough can be left out. `strike` defaults to `true` and works on both
+  the compact and the full editor: `editorFeatures.marks({ compact: true, strike: false })`
+  (replacing the kit's `marks` feature) drops the mark and its button, `~~x~~`
+  in pasted Markdown reads as plain `x`, and the
+  mark buttons also hide any mark the editor's schema lacks (for example a
+  starter kit configured with `strike: false`):
+
+  ```tsx
+  <CompactEditor
+    features={(kit) => [
+      ...kit.filter((f) => f.name !== 'marks'),
+      editorFeatures.marks({ compact: true, strike: false }),
+    ]}
+  />
+  ```
 - The toolbar opens with undo and redo (one group, kept last when the row folds), and the block type is one menu (Paragraph, Heading 1 to 6) whose button names the block under the caret; its label shows from 64rem of width, an icon alone below.
 - The toolbar is one row on the library's `Toolbar` (one tab stop, arrow keys), each feature's group a `ToolbarGroup`: groups that do not fit fold into the `Toolbar`'s More menu as a unit, lowest `priority` first: a group of two or more rows is a section under its name (its `label`, else `material.editor.group.<id>`, translated; else its id), a group of one row lists that row alone, and a single-choice group (the alignments) stays a radio group under its name. In that menu a toggle is a checkbox row with its state (bold, a list), the alignments one radio group (`menuitemradio` rows, the current one checked), a button a row that runs it (a dialog it opens, the link, the table, the image or the video, keeps the focus, and gives it back to the document when it closes; in the bar a dialog gives it back to its own button, and the image address, which has no button of its own, to the document), a menu control a submenu (the block type and the font as radio rows, the current one checked and shown on the row; the callout types, translated; the image's upload and address), and a popover control (the text colour, the highlight, the emoji) a row that opens its popover at the More button; Escape there gives the focus back to More, a choice to the document. An editor panel opened from More (the outline, the comments) stays open while you use More, and its row turns it off, the focus then going to the document. `EditorRoot` takes `look` (`'classic'` by default for a root you compose; the presets pass `'expressive'`), which `EditorToolbar` reads (`useEditorContext().look`); `EditorToolbar` takes `density` (`'compact'`: 36 px tools in the expressive look), `variant` (`docked`, the default, or `floating`) and `layout="wrap"` to keep every group on screen. `orientation` is `'horizontal'` (the default) or `'vertical'`, a column with Up and Down for the arrow keys, which folds what does not fit its height into the same More menu, at its bottom; `layout="page"` uses it for its rail, and you can use it in your own layout:
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nxgt/material",
-	"version": "3.91.0",
+	"version": "3.92.0",
 	"license": "MIT",
 	"bugs": {
 		"email": "stevegires@gmail.com"
@@ -390,7 +390,7 @@
 		"docs:previews": "rm -rf node_modules/.cache/nxgt-preview-free/missing && NXGT_PREVIEW_FREE=1 vitest run --project previews && bun .storybook/preview-free-report.ts"
 	},
 	"dependencies": {
-		"@nxgt/material-core": "^0.53.0",
+		"@nxgt/material-core": "^0.54.0",
 		"@base-ui/react": "^1.6.0",
 		"@dnd-kit/core": "^6.3.1",
 		"@dnd-kit/sortable": "^10.0.0",
@@ -477,7 +477,7 @@
 		"@fontsource-variable/inter": "^5",
 		"@fortawesome/fontawesome-free": "7.3.1",
 		"@nxgt/material-testing": "0.0.0",
-		"@nxgt/playwright": "^0.12.0",
+		"@nxgt/playwright": "^0.17.0",
 		"@react-leaflet/core": "^3.0.0",
 		"@react-pdf/renderer": "^4.9.0",
 		"@storybook/addon-a11y": "10.6.0",