@nxgt/material 3.71.0 → 3.72.0

package/dist/pdf-reader.js

@@ -1,3 +1,3 @@
-import { t as e } from "./public-BSaSCwy7.js";
+import { t as e } from "./public-CFj2qn7l.js";
 import { configurePdfReader as t } from "@nxgt/material-core/pdf-reader";
 export { e as PdfReader, t as configurePdfReader };

package/dist/print.js

@@ -1,4 +1,4 @@
-import { i as e, t } from "./translate-material-R-uLthBy.js";
+import { i as e, t } from "./translate-material-D1ndrd7a.js";
 import { Children as n, createContext as r, isValidElement as i, useCallback as a, useContext as o, useEffect as s, useMemo as c, useState as l } from "react";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 import { resolvePdfFileName as f } from "@nxgt/material-core/pdf-file-name";

package/dist/{public-BSaSCwy7.js → public-CFj2qn7l.js}

@@ -3,22 +3,22 @@ import { n as t } from "./ui.utils-CAnKTCw5.js";
 import { t as n } from "./utils-BLfntITJ.js";
 import { o as r } from "./dist-DVRQkaTK.js";
 import { c as i, i as a, l as o, n as s, o as c, s as l } from "./dist-lmHmz_bu.js";
-import { n as u, s as d } from "./spinner-BFZxqdWC.js";
+import { n as u, s as d } from "./spinner-C5Kb6MWu.js";
 import { i as f } from "./dist-C4wtXCjf.js";
 import { r as p, t as m } from "./in-dialog-Vwkyp-M5.js";
-import { a as h, c as g, i as _, l as v, n as y, o as b, r as x, s as ee, t as te, u as ne } from "./use-return-focus-Duk40DZI.js";
-import { c as S, d as C, f as w, i as T, l as re, n as ie, o as E, t as ae, u as D } from "./dropdown-menu-LN60hu_3.js";
-import { S as oe, a as O, d as k, g as se, h as ce, i as le, m as ue, n as A, r as de, t as j, u as fe, w as pe } from "./toolbar-items-BTtoKVlx.js";
-import { t as me } from "./button-D54Hrjo0.js";
-import { t as M } from "./use-material-translation-CCWUeiEn.js";
-import { n as he, t as ge } from "./icon-button-C59DqL7L.js";
+import { a as h, c as g, i as _, l as v, n as y, o as b, r as x, s as ee, t as te, u as ne } from "./use-return-focus-CkUX1HFl.js";
+import { c as S, d as C, f as w, i as T, l as re, n as ie, o as E, t as ae, u as D } from "./dropdown-menu-tadySeGH.js";
+import { S as oe, a as O, d as k, g as se, h as ce, i as le, m as ue, n as A, r as de, t as j, u as fe, w as pe } from "./toolbar-items-m_1FTFPQ.js";
+import { t as me } from "./button-C8moFnIT.js";
+import { t as M } from "./use-material-translation-C6H0B4kE.js";
+import { n as he, t as ge } from "./icon-button-BbGU17cb.js";
 import { t as _e } from "./useEvent-2fKq-6w8.js";
 import { n as ve, t as ye } from "./toggle-group-DXXlqid2.js";
 import { i as be } from "./escape-owner-DpaP0lm1.js";
 import { n as xe } from "./use-slice-reducer-BGkeGtML.js";
-import { f as Se, r as Ce, t as we, u as Te } from "./dialog-AjCYZ2Vz.js";
+import { f as Se, r as Ce, t as we, u as Te } from "./dialog-WuLTwxkr.js";
 import { r as Ee } from "./use-csp-nonce-ZKs9k-ov.js";
-import { n as De, t as Oe } from "./empty-state-Bo8G8W8G.js";
+import { n as De, t as Oe } from "./empty-state-ZYiFSSBQ.js";
 import { t as ke } from "./client-only.utils-3nHNzCki.js";
 import { t as Ae } from "./use-scroll-away-PQRFZkT2.js";
 import * as N from "react";

package/dist/{rich-code-block-BFVj1GWz.js → rich-code-block-B7Teg7-e.js}

@@ -1,7 +1,7 @@
-import { r as e } from "./spinner-BFZxqdWC.js";
-import { c as t, n, t as r } from "./dropdown-menu-LN60hu_3.js";
-import { t as i } from "./use-material-translation-CCWUeiEn.js";
-import { a, i as o, n as s, o as c, t as l } from "./code-language-items-BWDnqUqn.js";
+import { r as e } from "./spinner-C5Kb6MWu.js";
+import { c as t, n, t as r } from "./dropdown-menu-tadySeGH.js";
+import { t as i } from "./use-material-translation-C6H0B4kE.js";
+import { a, i as o, n as s, o as c, t as l } from "./code-language-items-8VL0aMKG.js";
 import { i as u, n as d, r as f, s as p } from "./dist-C3GR7kJd.js";
 import { t as m } from "./code-block-spec-CGLKRhwD.js";
 import { Suspense as h, lazy as g, useEffect as _, useRef as v, useState as y } from "react";
@@ -143,7 +143,7 @@ function M({ node: e, editor: t, updateAttributes: n, editable: r, wrap: a, onWr
 }
 //#endregion
 //#region lib/components/ui/widgets/editor/extensions/code/code-block-open.tsx
-var N = g(() => import("./code-editor-mULs4SL8.js").then((e) => e.n).then((e) => ({ default: e.CodeEditor })));
+var N = g(() => import("./code-editor-DQZIKL54.js").then((e) => e.n).then((e) => ({ default: e.CodeEditor })));
 function P() {
 	let { t: e } = i();
 	return /* @__PURE__ */ b("div", {

package/dist/{sortable-provider-REwyjiOZ.js → sortable-provider-y5sFhRDj.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { t } from "./dist-DVRQkaTK.js";
-import { t as n } from "./use-material-translation-CCWUeiEn.js";
-import { t as r } from "./icon-button-C59DqL7L.js";
+import { t as n } from "./use-material-translation-C6H0B4kE.js";
+import { t as r } from "./icon-button-BbGU17cb.js";
 import { t as i } from "./compose-refs-G4J4kaUA.js";
 import a, { cloneElement as o, createContext as s, forwardRef as c, memo as l, useCallback as u, useContext as d, useEffect as f, useId as p, useLayoutEffect as m, useMemo as h, useReducer as g, useRef as _, useState as v } from "react";
 import { jsx as y } from "react/jsx-runtime";

package/dist/{spinner-BFZxqdWC.js → spinner-C5Kb6MWu.js}

@@ -3,7 +3,7 @@ import { n as t, t as n } from "./utils-BLfntITJ.js";
 import { i as r, o as i } from "./dist-DVRQkaTK.js";
 import { a, c as o, i as s, l as c, n as l, o as u, r as d, s as f, t as p, u as m } from "./dist-lmHmz_bu.js";
 import { a as h, c as g, d as _, i as v, l as y, o as b, r as x, t as S, u as C } from "./floating-ui.dom-KkZSW8_E.js";
-import { t as w } from "./use-material-translation-CCWUeiEn.js";
+import { t as w } from "./use-material-translation-C6H0B4kE.js";
 import * as T from "react";
 import { useLayoutEffect as E, useRef as D, useSyncExternalStore as O } from "react";
 import { jsx as k, jsxs as A } from "react/jsx-runtime";

package/dist/theme-picker.js

@@ -1,10 +1,10 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { a as t, i as n, n as r, o as i, r as a, t as o } from "./bubble-input-B7BVd9fX.js";
 import { a as s, r as c } from "./icon-sprites-CaYXzOL4.js";
-import { t as l } from "./use-material-translation-CCWUeiEn.js";
+import { t as l } from "./use-material-translation-C6H0B4kE.js";
 import { t as u } from "./use-theme-BCLireTd.js";
 import { a as d, r as f } from "./theme-context-Cofk6vgs.js";
-import { t as p } from "./theme-toggle-BHi6miz-.js";
+import { t as p } from "./theme-toggle-B1JZg7mU.js";
 import { n as m, t as h } from "./nxgt-theme-DA1IQe0O.js";
 import { useContext as g } from "react";
 import { jsx as _, jsxs as v } from "react/jsx-runtime";

package/dist/{theme-toggle-BHi6miz-.js → theme-toggle-B1JZg7mU.js}

@@ -1,4 +1,4 @@
-import { t as e } from "./use-material-translation-CCWUeiEn.js";
+import { t as e } from "./use-material-translation-C6H0B4kE.js";
 import { i as t } from "./theme-store-BdPp43cV.js";
 import { n, t as r } from "./use-theme-BCLireTd.js";
 import { r as i } from "./theme-context-Cofk6vgs.js";

package/dist/{toolbar-items-BTtoKVlx.js → toolbar-items-m_1FTFPQ.js}

@@ -1,13 +1,13 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { o as t, r as n, t as r } from "./dist-DVRQkaTK.js";
 import { a as i, c as a, i as o, l as s, r as c, s as l } from "./dist-lmHmz_bu.js";
-import { C as u, S as d, d as f, f as p, m, p as h, r as g, u as _ } from "./spinner-BFZxqdWC.js";
+import { C as u, S as d, d as f, f as p, m, p as h, r as g, u as _ } from "./spinner-C5Kb6MWu.js";
 import { i as v, n as y, r as b, t as x } from "./dist-C4wtXCjf.js";
 import { a as S, c as C, l as w, o as T, r as ee, s as te, t as ne } from "./in-dialog-Vwkyp-M5.js";
-import { A as re, M as ie, N as ae, b as oe, d as se, f as ce, i as le, j as ue, l as de, n as fe, o as pe, r as me, t as he, u as ge, y as _e } from "./dropdown-menu-LN60hu_3.js";
+import { A as re, M as ie, N as ae, b as oe, d as se, f as ce, i as le, j as ue, l as de, n as fe, o as pe, r as me, t as he, u as ge, y as _e } from "./dropdown-menu-tadySeGH.js";
 import { a as ve, n as ye, r as be, t as xe } from "./dist-B7RjY7SL.js";
 import { t as Se } from "./warn-once-C_e47JM8.js";
-import { t as Ce } from "./use-material-translation-CCWUeiEn.js";
+import { t as Ce } from "./use-material-translation-C6H0B4kE.js";
 import { i as we } from "./escape-owner-DpaP0lm1.js";
 import * as E from "react";
 import { createContext as D, useCallback as Te, useContext as O, useEffect as k, useId as Ee, useLayoutEffect as A, useMemo as j, useReducer as De, useRef as M, useState as N } from "react";

package/dist/{translate-material-R-uLthBy.js → translate-material-D1ndrd7a.js}

@@ -1,4 +1,4 @@
-import { a as e, l as t, r as n, s as r, t as i, u as a } from "./translator-ClbXOGQO.js";
+import { a as e, l as t, r as n, s as r, t as i, u as a } from "./translator-CtEC_AQa.js";
 import { createContext as o, useCallback as s, useContext as c, useEffect as l, useMemo as u, useRef as d, useState as f } from "react";
 import { jsx as p } from "react/jsx-runtime";
 //#region lib/i18n/material-resources-registry.ts

package/dist/{translator-ClbXOGQO.js → translator-CtEC_AQa.js}

@@ -111,6 +111,13 @@ var r = {
 		},
 		toc: { "on-this-page": "On this page" },
 		upload: {
+			accept: {
+				images: "Images",
+				audio: "Audio",
+				video: "Videos",
+				text: "Text files",
+				application: "Documents"
+			},
 			dropzone: {
 				idle: "Drag & drop files here, or click to browse",
 				"at-capacity": "Maximum number of files reached",
@@ -3078,6 +3085,13 @@ var r = {
 		},
 		toc: { "on-this-page": "Sur cette page" },
 		upload: {
+			accept: {
+				images: "Images",
+				audio: "Audio",
+				video: "Vidéos",
+				text: "Fichiers texte",
+				application: "Documents"
+			},
 			dropzone: {
 				idle: "Glissez-déposez des fichiers ici, ou cliquez pour parcourir",
 				"at-capacity": "Nombre maximum de fichiers atteint",

package/dist/{typography-v-PJ4Zco.js → typography-prQHb3gI.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { t } from "./dist-DVRQkaTK.js";
-import { n } from "./spinner-BFZxqdWC.js";
+import { n } from "./spinner-C5Kb6MWu.js";
 import { jsx as r } from "react/jsx-runtime";
 //#region lib/components/ui/primitives/typography/typography.variants.ts
 var i = [

package/dist/{use-chat-composer-Rhan4Xv0.js → use-chat-composer-DBiyNXvL.js}

@@ -4,40 +4,40 @@ 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 { a as s, c, i as l, l as u, n as d, o as f, r as p, s as m, t as h } from "./dist-lmHmz_bu.js";
-import { _ as g, a as _, b as v, c as y, g as b, h as x, i as S, n as C, o as w, r as T, s as E, t as D, v as O, x as k, y as A } from "./spinner-BFZxqdWC.js";
+import { _ as g, a as _, b as v, c as y, g as b, h as x, i as S, n as C, o as w, r as T, s as E, t as D, v as O, x as k, y as A } from "./spinner-C5Kb6MWu.js";
 import { a as ee, i as j, n as M, r as N, t as te } from "./dist-C4wtXCjf.js";
 import { i as ne, n as P } from "./in-dialog-Vwkyp-M5.js";
-import { c as re, l as ie, n as F, r as ae, t as oe } from "./alert-dialog-y2pbowVh.js";
+import { c as re, l as ie, n as F, r as ae, t as oe } from "./alert-dialog-A8K8zai1.js";
 import { A as se, C as I, D as ce, E as le, O as ue, S as de, T as fe, _ as pe, a as me, b as he, d as ge, f as _e, g as ve, h as ye, i as be, k as xe, l as Se, m as Ce, n as we, o as Te, p as Ee, r as De, s as Oe, t as ke, u as Ae, v as je, w as Me, x as Ne, y as Pe } from "./floating-ui.dom-KkZSW8_E.js";
-import { D as Fe, E as Ie, N as Le, O as Re, c as ze, d as Be, f as Ve, i as He, k as Ue, m as We, n as Ge, o as Ke, p as qe, t as Je, u as Ye } from "./dropdown-menu-LN60hu_3.js";
-import { a as Xe, i as Ze, n as Qe } from "./field-blur-context-bUFZj8iN.js";
-import { C as $e, S as et, a as tt, c as nt, d as rt, l as it, n as at, o as ot, s as st, u as ct } from "./toolbar-items-BTtoKVlx.js";
+import { D as Fe, E as Ie, N as Le, O as Re, c as ze, d as Be, f as Ve, i as He, k as Ue, m as We, n as Ge, o as Ke, p as qe, t as Je, u as Ye } from "./dropdown-menu-tadySeGH.js";
+import { a as Xe, i as Ze, n as Qe } from "./field-blur-context-bEhByoK-.js";
+import { C as $e, S as et, a as tt, c as nt, d as rt, l as it, n as at, o as ot, s as st, u as ct } from "./toolbar-items-m_1FTFPQ.js";
 import { a as lt, i as ut, n as dt, o as ft, t as pt } from "./bubble-input-B7BVd9fX.js";
 import { i as mt } from "./dist-B7RjY7SL.js";
 import { o as ht, s as gt, t as _t } from "./use-click-lock-BZYtTmVt.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-D54Hrjo0.js";
-import { a as Ct } from "./translator-ClbXOGQO.js";
+import { r as xt, t as St } from "./button-C8moFnIT.js";
+import { a as Ct } from "./translator-CtEC_AQa.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-CCWUeiEn.js";
-import { t as R } from "./icon-button-C59DqL7L.js";
+import { t as L } from "./use-material-translation-C6H0B4kE.js";
+import { t as R } from "./icon-button-BbGU17cb.js";
 import { t as Et } from "./use-ssr-media-query-C6M5m8sf.js";
-import { n as Dt, t as Ot } from "./typography-v-PJ4Zco.js";
+import { n as Dt, t as Ot } from "./typography-prQHb3gI.js";
 import { n as kt, t as At } from "./util-4heV2LPI.js";
 import { t as jt } from "./useEvent-2fKq-6w8.js";
-import { p as Mt } from "./field-blur-Cnd6FfCH.js";
+import { p as Mt } from "./field-blur-BYR0yE5L.js";
 import { c as Nt, i as Pt, l as Ft, o as It, r as Lt, s as Rt, t as zt } from "./dist-C3GR7kJd.js";
 import { a as Bt } from "./toggle-group-DXXlqid2.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-B5MhXBfm.js";
-import { _ as qt, f as Jt, g as Yt, l as Xt, m as Zt, n as Qt, o as $t, r as en, s as tn, t as nn, u as rn, v as an, y as on } from "./dialog-AjCYZ2Vz.js";
-import { n as sn, t as cn } from "./icon-badge-DLbpCQIm.js";
+import { n as Wt, r as Gt, t as Kt } from "./chip-B6AY1E91.js";
+import { _ as qt, f as Jt, g as Yt, l as Xt, m as Zt, n as Qt, o as $t, r as en, s as tn, t as nn, u as rn, v as an, y as on } from "./dialog-WuLTwxkr.js";
+import { n as sn, t as cn } from "./icon-badge-B1B0Lg02.js";
 import { r as ln } from "./use-csp-nonce-ZKs9k-ov.js";
-import { t as un } from "./empty-state-Bo8G8W8G.js";
+import { t as un } from "./empty-state-ZYiFSSBQ.js";
 import { t as dn } from "./skeleton-DSdtr2qc.js";
 import { H as fn, V as pn, X as mn, bt as hn, it as gn, lt as _n, n as vn, t as yn, xt as bn, yt as xn } from "./dist-moutbfbd.js";
 import { t as Sn } from "./markdown-Dw_uH7j7.js";
@@ -11308,7 +11308,7 @@ var ES = (e = {}) => Cn({
 		let [{ default: t }, { lowlight: n }, { richCodeBlock: r }] = await Promise.all([
 			import("./dist-CRMFGjng.js"),
 			import("./lowlight-OtcjU2Sa.js"),
-			import("./rich-code-block-BFVj1GWz.js")
+			import("./rich-code-block-B7Teg7-e.js")
 		]);
 		return [r(t, {
 			lowlight: n,

package/dist/{use-heading-spy-CJnBkCY0.js → use-heading-spy-Bzj5mIUZ.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-y2pbowVh.js";
-import { a as l } from "./button-D54Hrjo0.js";
-import { i as u } from "./translate-material-R-uLthBy.js";
-import { t as d } from "./use-material-translation-CCWUeiEn.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-A8K8zai1.js";
+import { a as l } from "./button-C8moFnIT.js";
+import { i as u } from "./translate-material-D1ndrd7a.js";
+import { t as d } from "./use-material-translation-C6H0B4kE.js";
 import { _ as f, g as p, h as m, n as h, v as g, y as _ } from "./number.utils-BG_eEt5g.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-CCWUeiEn.js → use-material-translation-C6H0B4kE.js}

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

package/dist/{use-return-focus-Duk40DZI.js → use-return-focus-CkUX1HFl.js}

@@ -1,6 +1,6 @@
 import { o as e, r as t } from "./dist-DVRQkaTK.js";
 import { a as n, c as r, i, l as a, o, r as s, s as c } from "./dist-lmHmz_bu.js";
-import { C as l, S as u, w as d } from "./spinner-BFZxqdWC.js";
+import { C as l, S as u, w as d } from "./spinner-C5Kb6MWu.js";
 import { c as f, i as p, l as m, o as h, r as g, s as ee } from "./in-dialog-Vwkyp-M5.js";
 import { r as _ } from "./escape-owner-DpaP0lm1.js";
 import * as v from "react";

package/docs/components/form-fields.md

@@ -1700,6 +1700,37 @@ import { AttributesFormField } from '@nxgt/material/components';
 <AttributesFormField control={control} name="attributes" label="Attributes" />
 ```
 
+**`AttributeValuesFormFieldSet`** renders one input per attribute and writes
+`{ [attribute.name]: value }` to the form at `name`:
+
+```tsx
+import { AttributeValuesFormFieldSet, FormSection } from '@nxgt/material/components';
+
+const form = useForm({ defaultValues: { attributes: { color: '#2563eb', size: 'M' } } });
+
+<FormSection title="Attributes">
+  <AttributeValuesFormFieldSet
+    control={form.control}
+    name="attributes"
+    label="Attributes"
+    hideLabel
+    attributes={[
+      { name: 'color', label: 'Colour', type: 'COLOR' },
+      { name: 'size', label: 'Size', type: 'SELECT', options: ['S', 'M', 'L'] },
+    ]}
+  />
+</FormSection>
+```
+
+| Prop | |
+| --- | --- |
+| `attributes` | the attributes to fill, one input each |
+| `control`, `name` | the form and the path of the object it writes |
+| `label` | the fieldset's accessible name (required) |
+| `hideLabel` | default `false`. `true` keeps `label` as the name but draws nothing, for a `FormSection` that already has the title |
+| `defaultValues` | optional fallback, used only while the form value at `name` is empty: `undefined`, `null` or an object with no keys (`{}`). Any other value in the form wins |
+| `className` | on the `<fieldset>` |
+
 **The inline editor** is one row per attribute: a grip, the type's icon, the
 label with `name · Type` under it, the unit as a badge and the default value
 (a Yes or No, a colour swatch, a number with its unit). A row opens to its
@@ -1811,7 +1842,10 @@ const schema = z.object({ attributes: attributesListSchema() });
 
 **Emits:** `Attribute[]`; the inline editor writes a date as `yyyy-MM-dd`, a
 date-time as an ISO instant and a time as `HH:mm`. `AttributeValuesFormFieldSet`
-writes an object keyed by attribute `name`; `AttributeValuesForm` reads a bare
+writes an object keyed by attribute `name`, reads the form's value at `name`
+(`defaultValues` is only the fallback while it holds nothing), fills the row
+width, and takes `hideLabel` to keep `label` as the fieldset's accessible name
+without drawing the heading; `AttributeValuesForm` reads a bare
 `yyyy-MM-dd` default as that local day.
 **Form wrapper:** `AttributesFormField` — `control` and `name`, see
 [forms](../guides/forms.md#the-pair), [what each field emits](../guides/forms.md#what-each-field-emits)
@@ -1863,6 +1897,32 @@ The editor checks the shape of a value, not that the line exists. Below 640px
 each contact is a summary row; tapping it opens a bottom sheet with the same
 fields and actions, and closing it with an empty value drops the contact.
 
+**Limit the types, hide the star.** A backend that stores only some types, or
+no primary flag, says so on `ContactsFormField` and `ContactsEditor` (`primary` is inline only):
+
+```tsx
+<ContactsFormField
+  control={control}
+  name="contacts"
+  label="Contacts"
+  types={['EMAIL', 'PHONE', 'FAX', 'WEBSITE']}
+  primary={false}
+/>
+```
+
+`types` (an array of `ContactTypeName`, i.e. `'EMAIL' | 'PHONE' | …` or the
+`ContactType` values; every type by default) limits the "Add" chips and the
+type select; list at least one type, since an empty `types={[]}` is not
+supported. The chips keep the library's order (phone, mobile, email,
+website, fax); the select follows the order given. With `editing="dialog"`,
+`types` limits the dialog's type select (`ContactDialog` takes it too, and a
+new contact starts with the first type); `primary` has no effect there, since
+the dialog has no star. A contact
+already in the value with another type is kept and shown, and its own type
+stays in its select, so nothing is changed silently. `primary={false}` (`true`
+by default) hides the star and the primary marks; a `primary` flag already in
+the value is left untouched.
+
 `variant="cards"` is the Expressive variant: each contact is its own tinted
 card with a round tile for the primary one. The fields keep the library's
 field radius in both. `variant` is on `ContactsFormField`, `ContactsEditor`
@@ -1895,9 +1955,9 @@ only, and a value that fails its check is shown without a link.
 | `empty` | `ReactNode` | "No contacts" | shown when there is nothing to list; `null` renders nothing |
 
 `ContactsEditor` takes `value`, `onValueChange`, `label`, `headingLevel` (`3`
-by default; the type headings sit one below it), `variant` and `disabled`. A
+by default; the type headings sit one below it), `variant`, `types`, `primary` and `disabled`. A
 wrong format is said once the field was left, a duplicate at once. `ContactsFormField` takes `editing` (`'inline' \| 'dialog'`,
-default `'inline'`), `variant` (inline only) and `cancelVariant` (dialog only,
+default `'inline'`), `variant` (inline only), `types`, `primary` (inline only) and `cancelVariant` (dialog only,
 the Cancel button's `Button` variant, default `'tonal'`; `'outlined'` restores
 the earlier look). `Contacts` takes `data`, `onAdd`, `onEdit` and `disabled`.
 

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

@@ -78,12 +78,15 @@ function Attachments() {
 | `mode` | `'single' \| 'multiple'` | — (required) | `value` is a `string` or a `string[]` |
 | `onUpload` | `(file, onProgress?, signal?) => Promise<string>` | — | `NetworkUploadField` only; the resolved string becomes the value. Removing an uploading row or unmounting the field aborts `signal`: pass it to your request, or the upload still completes (its value is dropped). An abort after the request completed cannot unsend it: the value is dropped and `onRemove` is not called. The S3 fields abort their request themselves and reject with an `UploadError` of kind `aborted` (named `AbortError`, no longer a `DOMException`) |
 | `getPresignedUrl` | `(file) => Promise<PresignedUploadTarget>` | — | `S3UploadField` only; `{ uploadUrl, publicUrl, headers? }` PUTs the file and stores `publicUrl`; `{ method: 'POST', url, fields, value }` posts a form and stores `value` (see [presigned POST](#presigned-post)) |
-| `accept` | `string` | — | file input `accept`, also shown under the drop zone |
+| `accept` | `string` | — | file input `accept`; the drop zone's hint shows it as short names (`image/jpeg,image/png` reads `JPEG, PNG`, `.pdf` reads `PDF`, `image/*` reads `Images`; unknown entries stay as given) |
+| `acceptLabel` | `string` | — | replaces those names in the hint (`"Photos only"`); `""` hides the type part. |
 | `maxSize` | `number` (bytes) | — | larger files are rejected before upload |
 | `maxFiles` | `number` | — | `mode="multiple"` only; the drop zone is disabled once reached |
 | `onRemove` | `(value) => void \| Promise<void>` | — | called when a committed file is removed (delete it server-side here) |
 | `resolveUrl` | `(value) => string \| null \| undefined` | — | turns a stored key into an `<img src>` so saved images preview |
 
+The drop zone's hint wraps in a narrow dialog instead of being clipped.
+
 The field is a `group` named by its `label`. The drop zone is a `button`, which
 may not carry `aria-invalid`: with `error` it is described by `helperText`, or
 without one by a visually hidden "This value is not valid."

package/docs/components/overlays-and-menus.md

@@ -61,10 +61,27 @@ Your own `onEscapeKeyDown` on the content receives the Escape that only closes a
 >
 ```
 
+**A long dialog scrolls its body, not the whole box.** Wrap the fields in `DialogBody` (a direct child of `DialogContent`, between `DialogHeader` and `DialogFooter`): the content becomes a clipped column, the header and the footer stay in view, and only the body scrolls. A hairline shows on the edge where content is hidden beneath the header or the footer. It works the same as a bottom sheet or full screen on a phone, with the safe-area padding kept under the footer. A dialog without `DialogBody` is unchanged and scrolls as a whole. Give the body an `aria-label` (or `aria-labelledby`) to make it a named region; `className` sets its inner layout (`grid gap-3`). It sets `data-overflow-start` and `data-overflow-end` while content is hidden above or below. `DialogScrollContent`, `Sheet`, `Drawer` and `AlertDialog` do not take it yet.
+
+```tsx
+<DialogContent>
+	<DialogHeader>
+		<DialogTitle>New item</DialogTitle>
+	</DialogHeader>
+	<DialogBody aria-label="Item fields" className="grid gap-3">
+		{/* twelve fields */}
+	</DialogBody>
+	<DialogFooter>
+		<Button>Save</Button>
+	</DialogFooter>
+</DialogContent>
+```
+
 ```tsx
 import {
 	Button,
 	Dialog,
+	DialogBody,
 	DialogClose,
 	DialogContent,
 	DialogDescription,
@@ -94,7 +111,8 @@ import {
 ```
 
 Parts: `Dialog`, `DialogTrigger`, `DialogContent`, `DialogHeader`,
-`DialogTitle`, `DialogDescription`, `DialogFooter`, `DialogClose`, plus
+`DialogTitle`, `DialogDescription`, `DialogFooter`, `DialogBody` (the part
+that scrolls alone), `DialogClose`, plus
 `DialogOverlay` and `DialogPortal`, and `DialogScrollContent`: a content for
 a dialog taller than the screen, which sits in a scrolling overlay with a
 margin instead of being clipped, and renders its own close button. It takes
@@ -132,6 +150,7 @@ export function Terms() {
 | `variant`, `color` (`DialogClose`) | as `IconButton` | `'ghost'` | a top-right X button, named "Close" (`material.buttons.close`, translated) while it shows only the icon; text children or an `aria-label` name it instead, and icon-only children leave it unnamed; children replace the X |
 | `size` (`DialogContent`) | `'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'` | `'md'` | its width from 640 px up: 384, 512, 672, 896 px, or the screen less 2rem a side |
 | `mobilePresentation` (`DialogContent`) | `'dialog' \| 'bottom-sheet' \| 'top' \| 'fullscreen'` | `'dialog'` | below 640 px: a centred dialog, a sheet that springs up from the bottom edge (rounded top corners), a dialog pinned under the top edge, or the whole screen |
+| `className`, `aria-label` / `aria-labelledby`, `onScroll`, `ref` (`DialogBody`) | `ComponentProps<'div'>` | — | the scroll region: `className` lays out its content (`grid gap-3`); an `aria-label` or `aria-labelledby` makes it a `region` with that name; `onScroll` and `ref` are called after its own overflow flags update. It sets `data-overflow-start` / `data-overflow-end` while content is hidden above / below, and bleeds by `--dialog-px` (1.5rem) so a `DialogContent` with its own padding sets both: `p-4 [--dialog-px:1rem]` |
 | `scrim` (`DialogContent`, `SheetContent`, `DrawerContent`) | `'dim' \| 'blur'` | `'dim'` | the scrim behind; `blur` also blurs the page a little |
 
 The look lives in the stylesheet (`nxgt-dialog`, `nxgt-scrim`), under the

package/docs/guides/forms.md

@@ -279,10 +279,11 @@ the form, on a translucent, blurred background, so Cancel and Save stay in
 reach while the fields scroll under them; a form shorter than the screen
 shows them right under its fields.
 
-- In a `DialogContent` or a `SheetContent`, which are capped to the screen
+- In a `DialogContent` without a `DialogBody`, or a `SheetContent`, which are capped to the screen
   and scroll themselves, the actions stick to the dialog's or the sheet's
   bottom. A `DrawerContent` does not scroll: a form that is its direct child
   is the scroll box there.
+- A long form in a `Dialog` can pin its own header and `DialogFooter` instead: put the fields in a `DialogBody` and only the body scrolls (see the Dialog section of the overlays page). Do not combine it with `form-actions`: they would stick inside the body, so use a `DialogFooter` for the buttons and `form="id"` on the submit button.
 - In an `AlertDialogContent` (the rich text editor's edit dialogs use one),
   the actions stick to its bottom the same way, over its padding.
 - `ConfirmationDialog` holds a form when you pass it `formOptions` (a schema, its `defaultValues` and `renderForm`): it renders the
@@ -608,7 +609,7 @@ export function SupplierForm({ onSave }: { onSave: (values: Values) => void }) {
 
 | Wrapper | Value | Notes |
 | --- | --- | --- |
-| `ContactsFormField` | `Contact[]` | Edited in place by default (one `primary` per type); `editing="dialog"` goes through `ContactDialog`. `ContactType` is `EMAIL`, `FAX`, `MOBILE`, `PHONE`, `WEBSITE` |
+| `ContactsFormField` | `Contact[]` | Edited in place by default (one `primary` per type); `editing="dialog"` goes through `ContactDialog`. `ContactType` is `EMAIL`, `FAX`, `MOBILE`, `PHONE`, `WEBSITE`; `types={['EMAIL', 'PHONE']}` limits the offered types and `primary={false}` hides the star (inline only) |
 | `OpeningHoursFormField` | `OpeningHour[]` | Edits the week inline by default (`weekStartsOn` and `locale` apply there); `editing="dialog"` keeps the list and dialog, where `showAddAllDays` adds Monday–Friday 09:00–17:00 and a closed weekend in one click |
 | `PostalAddressFormField` | `PostalAddressFieldValue` | Deleting the address writes `{}`, not `null` |
 | `AttributesFormField` | `Attribute[]` | A typed attribute editor, in place by default (rows that open, drag and keyboard reorder that sets `priority`, unique names); `editing="dialog"` keeps the list and dialog. Its `label` prop is required |
@@ -628,7 +629,11 @@ export function SupplierForm({ onSave }: { onSave: (values: Values) => void }) {
   `form.setValue()` replace the list it shows.
 - `AttributeValuesFormFieldSet` is the other half: given `attributes`, it
   renders one input per attribute and writes `{ [attribute.name]: value }` to
-  its `name`.
+  its `name`. It reads the value the form already holds at `name` (and shows
+  a `reset()` or `setValue()`), so `defaultValues` is only the fallback while
+  the form value is empty (`undefined`, `null` or `{}`). Its fields fill the row, and `hideLabel` keeps
+  `label` as the group's accessible name without drawing it, under a
+  `FormSection` that already has the title.
 
 ### Rows a user adds and removes
 

package/docs/guides/i18n.md

@@ -324,7 +324,7 @@ breadcrumb (`material.doc.breadcrumb`); `MessageCard`'s "Unread"
 failed", its type, size and count errors (`material.upload.replace-named`,
 `remove-named`, `failed`, `invalid-type`, `too-large`, `max-files`; an error keeps the language
 it was raised in) and the drop zone's "Max {size}" and "Up to {count} files"
-(`material.upload.dropzone.max-size` / `max-files`); the editor's
+(`material.upload.dropzone.max-size` / `max-files`) and the names `accept` wildcards read as (`material.upload.accept.images`, `audio`, `video`, `text`, `application`); the editor's
 placeholder, which follows a language change without rebuilding the editor,
 and its emoji buttons (`material['rich-text-editor'].placeholder` /
 `insert-emoji`); `CircularProgress`'s "Progress: {value}%"

package/docs/troubleshooting.md

@@ -11,6 +11,7 @@ words in your error.
 - [`Cannot find package '@react-pdf/renderer'`](#cannot-find-package-react-pdfrenderer)
 - [`Cannot find package 'react-router'` after upgrading to 3.0](#cannot-find-package-react-router-after-upgrading-to-30) (and `ERESOLVE` on `react` or `react-router`; `Element type is invalid` for `ViewTransition` or `browser is not a function` from a stale Storybook or Vitest pre-bundle)
 - [`Conflicting peer dependency: @react-pdf/renderer` (`ERESOLVE`)](#conflicting-peer-dependency-react-pdfrenderer)
+- [`AttributeValuesFormFieldSet` shows empty fields, or ignores my `defaultValues`](#attributevaluesformfieldset-shows-empty-fields-or-ignores-my-defaultvalues)
 - [`Cannot find package 'leaflet'`](#cannot-find-package-leaflet)
 - [`hls.js could not be loaded. Install it (`npm i hls.js`) to play HLS streams in this browser.`](#hlsjs-could-not-be-loaded-install-it-npm-i-hlsjs-to-play-hls-streams-in-this-browser)
 - [`This browser cannot play HLS streams.`](#this-browser-cannot-play-hls-streams)
@@ -68,6 +69,8 @@ words in your error.
 - [An input now has `placeholder=" "` in the DOM](#an-input-now-has-placeholder--in-the-dom)
 - ["Select all" runs under the sort, "Filters" or the actions in a cards or tiles list on a phone](#select-all-runs-under-the-sort-filters-or-the-actions-in-a-cards-or-tiles-list-on-a-phone)
 - [A dialog or sheet scrolls, or clips a child, after upgrading](#a-dialog-or-sheet-scrolls-or-clips-a-child-after-upgrading)
+- [A `DialogBody`'s header and footer do not stay pinned](#a-dialogbodys-header-and-footer-do-not-stay-pinned)
+- [A form's `form-actions` bar sticks inside a `DialogBody`](#a-forms-form-actions-bar-sticks-inside-a-dialogbody)
 - [A form's fields no longer scroll in their own box after upgrading](#a-forms-fields-no-longer-scroll-in-their-own-box-after-upgrading)
 - [My activity content lost its side padding, or the rail's entries moved up](#my-activity-content-lost-its-side-padding-or-the-rails-entries-moved-up)
 - [axe reports `target-size` on a control under a form's sticky actions](#axe-reports-target-size-on-a-control-under-a-forms-sticky-actions)
@@ -381,6 +384,7 @@ words in your error.
 - [`` [@nxgt/material] DataTable: `tableRef` stays null in the `cards` layout; use `focusRef`. ``](#nxgtmaterial-datatable-tableref-stays-null-in-the-cards-layout-use-focusref)
 - [`defineCodeTheme: "keyword" must be a hex colour`](#definecodetheme-keyword-must-be-a-hex-colour-rgb-or-rrggbb)
 - [A `CodeEditor` shows its code in one colour after another Monaco editor mounts](#a-codeeditor-shows-its-code-in-one-colour-after-another-monaco-editor-mounts)
+- [`primary={false}` has no effect on a `ContactsFormField` with `editing="dialog"`](#primaryfalse-has-no-effect-on-a-contactsformfield-with-editingdialog)
 
 **PDF reader**
 
@@ -536,7 +540,28 @@ bun add @react-pdf/renderer@^4.9
 `--legacy-peer-deps` silences the error but keeps a renderer the print
 entry is not tested against.
 
-### `Cannot find package 'leaflet'`
+### `AttributeValuesFormFieldSet` shows empty fields, or ignores my `defaultValues`
+
+**When:** the set comes up empty although you pass `defaultValues`, or shows
+other values than the ones you passed.
+
+**Why:** the set reads the form value at `name` first. `defaultValues`
+is only a fallback while that value is empty: `undefined`, `null` or an object
+with no keys. A form that already holds `{ color: 'red' }` at `name` wins over
+`defaultValues`; a form that holds `{ color: undefined }` has a key, so it is
+not empty either.
+
+**Fix:** put the values in the form, where every other field reads them:
+
+```tsx
+const form = useForm({ defaultValues: { attributes: { size: 'M' } } });
+// or, for a record loaded later
+form.reset({ attributes: record.attributes });
+```
+
+Keep `defaultValues` on the set only for a fallback when the form holds nothing.
+
+## `Cannot find package 'leaflet'`
 
 **When:** at build or at the first import of `@nxgt/material/map`. The missing
 name may also be `react-leaflet`, `@react-leaflet/core`,
@@ -614,6 +639,14 @@ never receives the press.
 forwards `ref` and `...props` to its root. Or skip `trigger` and open it from
 your own state with `open` / `onOpenChange`.
 
+### A test that read the upload hint now sees "JPEG, PNG, WebP" or "Images"
+
+**When:** after upgrading, a test or snapshot that matched the drop zone's hint
+(`image/jpeg,image/png · Max 2 MB`, `image/*`) fails.
+**Why:** the hint shows short names derived from `accept` instead of the raw
+list: `JPEG, PNG · Max 2 MB`, `Images`.
+**Fix:** match the names, or pass `acceptLabel="..."` to fix the text.
+
 ### `This browser cannot play HLS streams.`
 
 **When:** an HLS track on a browser without Media Source Extensions where
@@ -1461,6 +1494,38 @@ with `className="max-h-none overflow-visible"`; to change the cap, pass your own
 For a dialog that should grow taller than the screen and scroll inside the
 overlay instead of capping, use `DialogScrollContent`.
 
+With a `DialogBody` as a direct child, the content is `overflow-hidden` (a
+clipped flex column) and only the body scrolls, so a child that sticks out of
+the content is clipped there too; keep popovers in a portal.
+
+### A `DialogBody`'s header and footer do not stay pinned
+
+**When:** a long dialog with a `DialogBody` still scrolls as a whole, or the
+footer sits at the end of the fields.
+**Why:** the content only turns into a column when the `DialogBody` is a
+*direct* child of `DialogContent` (`has-[>[data-slot=dialog-body]]`). Inside a
+`<form>` or another wrapper it is not. Another cause: a `max-h-none` or
+`overflow-visible` in the content's `className`.
+**Fix:** make the body a direct child, and put the `<form>` around the whole
+content, or keep the body inside and submit with `form="id"` on the footer button:
+
+```tsx
+<DialogContent>
+	<DialogHeader>…</DialogHeader>
+	<DialogBody>…</DialogBody>
+	<DialogFooter>…</DialogFooter>
+</DialogContent>
+```
+
+### A form's `form-actions` bar sticks inside a `DialogBody`
+
+**When:** a `.form-grid-layout` form with `form-actions` in a `DialogBody` shows
+its Save bar at the bottom of the body, not of the dialog.
+**Why:** the bar is sticky at the bottom of whatever scrolls, and the body now
+scrolls.
+**Fix:** use the `DialogFooter` for the buttons, with `form="my-form"` on the
+submit button and `id="my-form"` on the form, and leave `form-actions` out.
+
 ### A form's fields no longer scroll in their own box after upgrading
 
 **When:** after upgrading, a `.form-grid-layout` form grows with the page
@@ -6950,6 +7015,19 @@ structural theme back when it mounts, but not while the other editor stays.
 **Fix:** keep that editor on a page of its own, or stop it calling `setTheme`
 (`CodeEditor`'s `ref` handle gives Monaco's editor for the options you need).
 
+### `primary={false}` has no effect on a `ContactsFormField` with `editing="dialog"`
+
+**When:** `<ContactsFormField editing="dialog" primary={false} />` looks the
+same as without the prop.
+
+**Why:** `primary` hides the star and the primary marks of the inline editor.
+The dialog edits `type`, `value` and `label` only; it has no star to hide, and
+the `primary` flag already in the value is left untouched. `types` does work
+in both modes.
+
+**Fix:** use the default `editing="inline"` when the star must go, or drop the
+`primary` flag from the value before saving.
+
 ## PDF reader
 
 ### PDF text is missing or in the wrong font in `PdfReader` (cMaps and standard fonts)

package/lib/components/ui/fields/attributes/attribute-values-form/attribute-values-form.css

@@ -3,6 +3,11 @@
 	form {
 		@apply grid @xl:grid-cols-2 @2xl:grid-cols-3 @3xl:grid-cols-4 gap-2;
 
+		/* Every field takes its cell's full width, whatever its own slot. */
+		> * {
+			@apply w-full min-w-0;
+		}
+
 		[data-slot="separator"] {
 			@apply col-start-full;
 		}