@nxgt/material 3.92.0 → 3.93.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/CHANGELOG.md +40 -0
  2. package/README.md +2 -2
  3. package/dist/{alert-dialog-Bz5PlYKp.js → alert-dialog-D37eph4I.js} +1 -1
  4. package/dist/{async-slice-veSVxKqt.js → async-slice-BSqwhAj-.js} +1 -1
  5. package/dist/{button-a3tH3pq4.js → button-CG9SBAT-.js} +1 -1
  6. package/dist/{calculator-BtuKV3PK.js → calculator-YD3I3y-I.js} +10 -10
  7. package/dist/calculator-field.js +6 -6
  8. package/dist/{calculator-segment-CyB9IhEq.js → calculator-segment-Cjec9zi7.js} +1 -1
  9. package/dist/calculator.js +1 -1
  10. package/dist/charts.js +3 -3
  11. package/dist/{chip-BwGvGx_S.js → chip-BbUSBl3i.js} +2 -2
  12. package/dist/{code-editor-BLkmEoCi.js → code-editor-ZEM7AAcs.js} +4 -4
  13. package/dist/code-editor.js +4 -4
  14. package/dist/{code-language-items-DhAC_tCs.js → code-language-items-CAuHPrHd.js} +2 -2
  15. package/dist/components/components.css +1 -0
  16. package/dist/components/ui/widgets/event-calendar/event-calendar-backdrop.css +43 -0
  17. package/dist/{components-DX4aHtgP.js → components-CuFTrmGy.js} +19654 -19043
  18. package/dist/components.js +38 -38
  19. package/dist/{conversion-variant-C4t7aH9d.js → conversion-variant-DmEtTCSP.js} +3 -3
  20. package/dist/{currency-field-D0UQb5pn.js → currency-field-CabGnVO9.js} +5 -5
  21. package/dist/{dialog-vQMypIOm.js → dialog-Jhpx6ulb.js} +3 -3
  22. package/dist/dnd.js +1 -1
  23. package/dist/{dropdown-menu-B2ctUFti.js → dropdown-menu-nl0Q3tQ2.js} +1 -1
  24. package/dist/editor.js +7 -7
  25. package/dist/{empty-state-Bs44jnWk.js → empty-state-mrJuqph3.js} +1 -1
  26. package/dist/{financial-variant-B5iZ3pYf.js → financial-variant-P8gFA9aI.js} +5 -5
  27. package/dist/{hooks-CJtRFDYD.js → hooks-CjSpziWf.js} +2 -2
  28. package/dist/hooks.js +2 -2
  29. package/dist/{hover-card-B8PYUsv_.js → hover-card-BNb1M8ij.js} +1 -1
  30. package/dist/i18n.js +3 -3
  31. package/dist/{icon-badge-YT98b2Vx.js → icon-badge-CVMHwdFm.js} +1 -1
  32. package/dist/{icon-button-BylI02aX.js → icon-button-Ch0PThsa.js} +1 -1
  33. package/dist/{input-group-CiayHfBN.js → input-group-CPMSQcBx.js} +1 -1
  34. package/dist/lib/components/ui/collections/day-grouped-list/index.d.ts +6 -0
  35. package/dist/lib/components/ui/display/entity-header/entity-metadata.d.ts +2 -0
  36. package/dist/lib/components/ui/display/event-chip/event-chip-badges.d.ts +21 -0
  37. package/dist/lib/components/ui/display/event-chip/event-chip-content.d.ts +5 -7
  38. package/dist/lib/components/ui/display/event-chip/event-chip-title.d.ts +9 -0
  39. package/dist/lib/components/ui/display/event-chip/event-chip.classes.d.ts +9 -0
  40. package/dist/lib/components/ui/display/event-chip/event-chip.d.ts +15 -2
  41. package/dist/lib/components/ui/fields/attributes/attribute-values-form-field-set/attribute-values-form-field-set.d.ts +1 -1
  42. package/dist/lib/components/ui/fields/choice-list/choice-list-control.d.ts +1 -1
  43. package/dist/lib/components/ui/fields/choice-list/choice-list-field.d.ts +1 -1
  44. package/dist/lib/components/ui/fields/choice-list/choice-list-focus.d.ts +6 -3
  45. package/dist/lib/components/ui/fields/choice-list/choice-list-form-field.d.ts +2 -2
  46. package/dist/lib/components/ui/fields/choice-list/choice-list-names.d.ts +2 -0
  47. package/dist/lib/components/ui/fields/choice-list/choice-list.utils.d.ts +2 -0
  48. package/dist/lib/components/ui/fields/choice-list/index.d.ts +1 -1
  49. package/dist/lib/components/ui/fields/choice-list/partials/choice-row.d.ts +9 -3
  50. package/dist/lib/components/ui/fields/choice-list/types.d.ts +20 -0
  51. package/dist/lib/components/ui/fields/contacts/placeholders.d.ts +1 -1
  52. package/dist/lib/components/ui/layout/record-page/record-details.d.ts +6 -6
  53. package/dist/lib/components/ui/widgets/event-calendar/backdrop.types.d.ts +75 -0
  54. package/dist/lib/components/ui/widgets/event-calendar/chrome.types.d.ts +12 -0
  55. package/dist/lib/components/ui/widgets/event-calendar/event-calendar-context.d.ts +8 -1
  56. package/dist/lib/components/ui/widgets/event-calendar/event-calendar-events.utils.d.ts +3 -1
  57. package/dist/lib/components/ui/widgets/event-calendar/event-calendar-shell.d.ts +1 -1
  58. package/dist/lib/components/ui/widgets/event-calendar/event-calendar.backdrop.d.ts +38 -0
  59. package/dist/lib/components/ui/widgets/event-calendar/event-calendar.badges.d.ts +14 -0
  60. package/dist/lib/components/ui/widgets/event-calendar/event-calendar.labels.d.ts +14 -1
  61. package/dist/lib/components/ui/widgets/event-calendar/event-calendar.lanes.d.ts +9 -0
  62. package/dist/lib/components/ui/widgets/event-calendar/event-calendar.read-only.d.ts +57 -0
  63. package/dist/lib/components/ui/widgets/event-calendar/event-calendar.resources.d.ts +6 -1
  64. package/dist/lib/components/ui/widgets/event-calendar/index.d.ts +2 -1
  65. package/dist/lib/components/ui/widgets/event-calendar/partials/all-day-bars.d.ts +14 -0
  66. package/dist/lib/components/ui/widgets/event-calendar/partials/backdrop-bands.d.ts +11 -0
  67. package/dist/lib/components/ui/widgets/event-calendar/partials/backdrop-bar.d.ts +11 -0
  68. package/dist/lib/components/ui/widgets/event-calendar/partials/backdrop-cell.d.ts +13 -0
  69. package/dist/lib/components/ui/widgets/event-calendar/partials/backdrop-row.d.ts +8 -0
  70. package/dist/lib/components/ui/widgets/event-calendar/partials/calendar-badge.d.ts +16 -0
  71. package/dist/lib/components/ui/widgets/event-calendar/partials/month-day-cell.d.ts +4 -1
  72. package/dist/lib/components/ui/widgets/event-calendar/partials/month-day-parts.d.ts +12 -1
  73. package/dist/lib/components/ui/widgets/event-calendar/partials/resource-header.d.ts +2 -1
  74. package/dist/lib/components/ui/widgets/event-calendar/partials/span-event.d.ts +3 -1
  75. package/dist/lib/components/ui/widgets/event-calendar/partials/time-grid-header-day.d.ts +3 -6
  76. package/dist/lib/components/ui/widgets/event-calendar/partials/zone-corner.d.ts +10 -2
  77. package/dist/lib/components/ui/widgets/event-calendar/template.types.d.ts +7 -2
  78. package/dist/lib/components/ui/widgets/event-calendar/types.d.ts +25 -13
  79. package/dist/lib/components/ui/widgets/event-calendar/use-backdrops.d.ts +8 -0
  80. package/dist/lib/components/ui/widgets/event-calendar/use-badges.d.ts +5 -0
  81. package/dist/lib/components/ui/widgets/event-calendar/use-event-calendar.d.ts +3 -2
  82. package/dist/lib/components/ui/widgets/event-calendar/use-month-day.d.ts +6 -1
  83. package/dist/lib/components/ui/widgets/event-calendar/use-time-column.d.ts +1 -0
  84. package/dist/lib/i18n/resources/en/en.d.ts +7 -0
  85. package/dist/lib/i18n/resources/en/material.json.d.ts +7 -0
  86. package/dist/lib/i18n/resources/fr/fr.d.ts +7 -0
  87. package/dist/lib/i18n/resources/fr/material.json.d.ts +7 -0
  88. package/dist/lib/i18n/resources/resources.d.ts +14 -0
  89. package/dist/lib/i18n/translator.d.ts +1 -1
  90. package/dist/lib.js +1 -1
  91. package/dist/main.js +54 -54
  92. package/dist/map.js +7 -7
  93. package/dist/material.css +1 -1
  94. package/dist/pdf-reader.js +1 -1
  95. package/dist/{percent-field-DuoZieW9.js → percent-field-TWyupyr_.js} +1 -1
  96. package/dist/{picker-surface-BKzM6TWN.js → picker-surface-CoNsDWxX.js} +4 -4
  97. package/dist/{popover-ukgGm5B6.js → popover-BA1U82Wk.js} +1 -1
  98. package/dist/{pos-types-BNXbls3v.js → pos-types-BQqv-kb6.js} +1 -1
  99. package/dist/{pos-variant-CZ3OZtPq.js → pos-variant-D043n5y8.js} +4 -4
  100. package/dist/print.js +1 -1
  101. package/dist/{programmer-variant-DVu-pYhB.js → programmer-variant-jneMqtLs.js} +2 -2
  102. package/dist/{public-DtXwn8bx.js → public-DgrbdeZj.js} +9 -9
  103. package/dist/{rich-code-block-DUaSLxLT.js → rich-code-block-CGNjHawR.js} +5 -5
  104. package/dist/{scientific-variant-Ku9feVN1.js → scientific-variant-1L7brNNT.js} +2 -2
  105. package/dist/{sortable-provider-DIb1HgZA.js → sortable-provider-DZLV_svg.js} +2 -2
  106. package/dist/{spinner-CHWFXCfd.js → spinner-CQqRWxAW.js} +1 -1
  107. package/dist/{tabs-BideU0Rb.js → tabs-DQTx3C8e.js} +1 -1
  108. package/dist/theme-picker.js +2 -2
  109. package/dist/{theme-toggle-DUQTEe1y.js → theme-toggle-3NQ3VmJH.js} +1 -1
  110. package/dist/{toolbar-items-azkXY5w2.js → toolbar-items-BYCdJGUf.js} +4 -4
  111. package/dist/{translate-material-d8Q5K5a_.js → translate-material-jxfcGlD5.js} +1 -1
  112. package/dist/{translator-CxyFsfO0.js → translator-6XuDmqUJ.js} +10 -0
  113. package/dist/{use-chat-composer-FACltVyX.js → use-chat-composer-1eb4I1kM.js} +16 -16
  114. package/dist/{use-heading-spy-DHd5TScW.js → use-heading-spy-CzPujlKr.js} +4 -4
  115. package/dist/{use-material-translation-DA5ECZfA.js → use-material-translation-BUPqNmAg.js} +1 -1
  116. package/dist/{use-return-focus-CAAvJ6p5.js → use-return-focus-B_enQxp5.js} +1 -1
  117. package/docs/README.md +1 -0
  118. package/docs/components/data-display.md +6 -1
  119. package/docs/components/data-table-filter-and-lists.md +3 -0
  120. package/docs/components/form-fields.md +38 -5
  121. package/docs/components/navigation-and-layout.md +1 -0
  122. package/docs/components/rich-widgets.md +58 -5
  123. package/docs/guides/event-calendar.md +163 -0
  124. package/docs/guides/forms.md +2 -1
  125. package/docs/guides/i18n.md +2 -0
  126. package/docs/previews/data-display-eventchip.webp +0 -0
  127. package/docs/previews/rich-widgets-eventcalendar.webp +0 -0
  128. package/docs/roadmap.md +12 -0
  129. package/lib/components/components.css +1 -0
  130. package/lib/components/ui/widgets/event-calendar/event-calendar-backdrop.css +43 -0
  131. package/package.json +1 -1
@@ -1,3 +1,3 @@
1
- import { t as e } from "./public-DtXwn8bx.js";
1
+ import { t as e } from "./public-DgrbdeZj.js";
2
2
  import { configurePdfReader as t } from "@nxgt/material-core/pdf-reader";
3
3
  export { e as PdfReader, t as configurePdfReader };
@@ -1,4 +1,4 @@
1
- import { r as e } from "./currency-field-D0UQb5pn.js";
1
+ import { r as e } from "./currency-field-CabGnVO9.js";
2
2
  import { jsx as t } from "react/jsx-runtime";
3
3
  //#region lib/components/ui/fields/percent-field/percent-field.tsx
4
4
  function n({ min: n = 0, max: r = 100, step: i = 1, ...a }) {
@@ -1,9 +1,9 @@
1
1
  import { t as e } from "./utils-BLfntITJ.js";
2
2
  import { r as t, t as n } from "./in-dialog-D61Yeaol.js";
3
- import { a as r, c as i, i as a, l as o, n as s, o as c, r as l, s as u, t as d, u as f } from "./use-return-focus-CAAvJ6p5.js";
4
- import { i as p, o as m, r as h, t as g } from "./popover-ukgGm5B6.js";
5
- import { t as _ } from "./use-material-translation-DA5ECZfA.js";
6
- import { n as v, t as y } from "./icon-button-BylI02aX.js";
3
+ import { a as r, c as i, i as a, l as o, n as s, o as c, r as l, s as u, t as d, u as f } from "./use-return-focus-B_enQxp5.js";
4
+ import { i as p, o as m, r as h, t as g } from "./popover-BA1U82Wk.js";
5
+ import { t as _ } from "./use-material-translation-BUPqNmAg.js";
6
+ import { n as v, t as y } from "./icon-button-Ch0PThsa.js";
7
7
  import { t as b } from "./use-ssr-media-query-C6M5m8sf.js";
8
8
  import { i as x } from "./escape-owner-DpaP0lm1.js";
9
9
  import * as S from "react";
@@ -1,7 +1,7 @@
1
1
  import { t as e } from "./utils-BLfntITJ.js";
2
2
  import { o as t, r as n } from "./dist-DVRQkaTK.js";
3
3
  import { i as r, r as i, t as a } from "./dist-DWZXlCZR.js";
4
- import { S as o, d as s, f as c, l, p as u, u as d, x as f } from "./spinner-CHWFXCfd.js";
4
+ import { S as o, d as s, f as c, l, p as u, u as d, x as f } from "./spinner-CQqRWxAW.js";
5
5
  import { a as p, i as m, r as h } from "./dist-DHdUUM1w.js";
6
6
  import { a as g, c as _, l as v, o as y, r as b, s as x, t as S } from "./in-dialog-D61Yeaol.js";
7
7
  import { i as C } from "./escape-owner-DpaP0lm1.js";
@@ -1,4 +1,4 @@
1
- import { t as e } from "./use-material-translation-DA5ECZfA.js";
1
+ import { t as e } from "./use-material-translation-BUPqNmAg.js";
2
2
  import { n as t } from "./calculator-context-BugcKuVG.js";
3
3
  import { t as n } from "./calculator-announce-DRd2c6Dq.js";
4
4
  import { jsx as r, jsxs as i } from "react/jsx-runtime";
@@ -1,11 +1,11 @@
1
1
  import { t as e } from "./utils-BLfntITJ.js";
2
- import { t } from "./use-material-translation-DA5ECZfA.js";
3
- import { t as n } from "./icon-button-BylI02aX.js";
2
+ import { t } from "./use-material-translation-BUPqNmAg.js";
3
+ import { t as n } from "./icon-button-Ch0PThsa.js";
4
4
  import { n as r } from "./calculator-context-BugcKuVG.js";
5
- import { a as i, n as a, r as o, t as s } from "./pos-types-BNXbls3v.js";
5
+ import { a as i, n as a, r as o, t as s } from "./pos-types-BQqv-kb6.js";
6
6
  import { i as c, n as l, s as u } from "./key-layout-cR79xfGE.js";
7
7
  import { n as d, t as f } from "./currency-B-r3ig11.js";
8
- import { t as p } from "./calculator-segment-CyB9IhEq.js";
8
+ import { t as p } from "./calculator-segment-Cjec9zi7.js";
9
9
  import { useId as m, useState as h } from "react";
10
10
  import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
11
11
  import { ChevronDown as y, X as b } from "lucide-react";
package/dist/print.js CHANGED
@@ -1,4 +1,4 @@
1
- import { i as e, t } from "./translate-material-d8Q5K5a_.js";
1
+ import { i as e, t } from "./translate-material-jxfcGlD5.js";
2
2
  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";
3
3
  import { jsx as u, jsxs as d } from "react/jsx-runtime";
4
4
  import { resolvePdfFileName as f } from "@nxgt/material-core/pdf-file-name";
@@ -1,9 +1,9 @@
1
- import { t as e } from "./use-material-translation-DA5ECZfA.js";
1
+ import { t as e } from "./use-material-translation-BUPqNmAg.js";
2
2
  import { t } from "./toggle-FeCCJqbg.js";
3
3
  import { n } from "./calculator-context-BugcKuVG.js";
4
4
  import { i as r, n as i, s as a } from "./key-layout-cR79xfGE.js";
5
5
  import { t as o } from "./programmer-word-CNCF7DJF.js";
6
- import { t as s } from "./calculator-segment-CyB9IhEq.js";
6
+ import { t as s } from "./calculator-segment-Cjec9zi7.js";
7
7
  import { useId as c, useState as l } from "react";
8
8
  import { jsx as u, jsxs as d } from "react/jsx-runtime";
9
9
  import { calculate as f, formatExpression as p, sessionOptions as m, toCanonical as h, tokenize as g } from "@nxgt/material-core/calculator";
@@ -3,25 +3,25 @@ import { n as t } from "./ui.utils-CAnKTCw5.js";
3
3
  import { t as n } from "./utils-BLfntITJ.js";
4
4
  import { o as r } from "./dist-DVRQkaTK.js";
5
5
  import { i, n as a, r as o } from "./dist-DWZXlCZR.js";
6
- import { o as s } from "./spinner-CHWFXCfd.js";
6
+ import { o as s } from "./spinner-CQqRWxAW.js";
7
7
  import { a as c, i as l, n as u } from "./dist-DHdUUM1w.js";
8
8
  import { i as d } from "./dist-DOK3zo5C.js";
9
9
  import { r as f, t as p } from "./in-dialog-D61Yeaol.js";
10
- import { a as m, c as h, i as g, l as _, n as v, o as ee, r as y, s as b, t as te, u as ne } from "./use-return-focus-CAAvJ6p5.js";
11
- import { c as x, d as S, f as C, i as w, l as T, n as E, o as D, t as re, u as O } from "./dropdown-menu-B2ctUFti.js";
12
- import { a as k, b as ie, d as ae, f as oe, i as se, n as A, o as ce, r as le, s as j, t as M, u as ue, v as de } from "./toolbar-items-azkXY5w2.js";
10
+ import { a as m, c as h, i as g, l as _, n as v, o as ee, r as y, s as b, t as te, u as ne } from "./use-return-focus-B_enQxp5.js";
11
+ import { c as x, d as S, f as C, i as w, l as T, n as E, o as D, t as re, u as O } from "./dropdown-menu-nl0Q3tQ2.js";
12
+ import { a as k, b as ie, d as ae, f as oe, i as se, n as A, o as ce, r as le, s as j, t as M, u as ue, v as de } from "./toolbar-items-BYCdJGUf.js";
13
13
  import { t as fe } from "./dist-DkQbkF9T.js";
14
- import { t as pe } from "./button-a3tH3pq4.js";
15
- import { t as N } from "./use-material-translation-DA5ECZfA.js";
16
- import { n as me, t as he } from "./icon-button-BylI02aX.js";
14
+ import { t as pe } from "./button-CG9SBAT-.js";
15
+ import { t as N } from "./use-material-translation-BUPqNmAg.js";
16
+ import { n as me, t as he } from "./icon-button-Ch0PThsa.js";
17
17
  import { t as ge } from "./useEvent-2fKq-6w8.js";
18
18
  import { n as _e, t as ve } from "./toggle-group-CVMxEpWi.js";
19
19
  import { i as ye } from "./escape-owner-DpaP0lm1.js";
20
20
  import { n as be } from "./use-slice-reducer-BGkeGtML.js";
21
21
  import { t as xe } from "./input-CC2joTjB.js";
22
22
  import { r as Se } from "./use-csp-nonce-ZKs9k-ov.js";
23
- import { n as Ce, t as we } from "./empty-state-Bs44jnWk.js";
24
- import { r as Te, t as Ee, u as De } from "./dialog-vQMypIOm.js";
23
+ import { n as Ce, t as we } from "./empty-state-mrJuqph3.js";
24
+ import { r as Te, t as Ee, u as De } from "./dialog-Jhpx6ulb.js";
25
25
  import { t as Oe } from "./client-only.utils-3nHNzCki.js";
26
26
  import { t as ke } from "./use-scroll-away-PQRFZkT2.js";
27
27
  import * as P from "react";
@@ -1,7 +1,7 @@
1
- import { n as e } from "./spinner-CHWFXCfd.js";
2
- import { c as t, n, t as r } from "./dropdown-menu-B2ctUFti.js";
3
- import { t as i } from "./use-material-translation-DA5ECZfA.js";
4
- import { a, i as o, n as s, o as c, t as l } from "./code-language-items-DhAC_tCs.js";
1
+ import { n as e } from "./spinner-CQqRWxAW.js";
2
+ import { c as t, n, t as r } from "./dropdown-menu-nl0Q3tQ2.js";
3
+ import { t as i } from "./use-material-translation-BUPqNmAg.js";
4
+ import { a, i as o, n as s, o as c, t as l } from "./code-language-items-CAuHPrHd.js";
5
5
  import { i as u, n as d, r as f, s as p } from "./dist-C3GR7kJd.js";
6
6
  import { t as m } from "./code-block-spec-CGLKRhwD.js";
7
7
  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
143
143
  }
144
144
  //#endregion
145
145
  //#region lib/components/ui/widgets/editor/extensions/code/code-block-open.tsx
146
- var N = g(() => import("./code-editor-BLkmEoCi.js").then((e) => e.n).then((e) => ({ default: e.CodeEditor })));
146
+ var N = g(() => import("./code-editor-ZEM7AAcs.js").then((e) => e.n).then((e) => ({ default: e.CodeEditor })));
147
147
  function P() {
148
148
  let { t: e } = i();
149
149
  return /* @__PURE__ */ b("div", {
@@ -1,9 +1,9 @@
1
- import { t as e } from "./use-material-translation-DA5ECZfA.js";
1
+ import { t as e } from "./use-material-translation-BUPqNmAg.js";
2
2
  import { t } from "./toggle-FeCCJqbg.js";
3
3
  import { n } from "./calculator-context-BugcKuVG.js";
4
4
  import { i as r, o as i } from "./key-layout-cR79xfGE.js";
5
5
  import { t as a } from "./standard-layout-BuSRr3TY.js";
6
- import { t as o } from "./calculator-segment-CyB9IhEq.js";
6
+ import { t as o } from "./calculator-segment-Cjec9zi7.js";
7
7
  import { jsx as s, jsxs as c } from "react/jsx-runtime";
8
8
  import { scientificOptions as l } from "@nxgt/material-core/calculator/scientific";
9
9
  //#region lib/components/ui/widgets/calculator/variants/scientific/scientific-layout.ts
@@ -1,7 +1,7 @@
1
1
  import { t as e } from "./utils-BLfntITJ.js";
2
2
  import { t } from "./dist-DVRQkaTK.js";
3
- import { t as n } from "./use-material-translation-DA5ECZfA.js";
4
- import { t as r } from "./icon-button-BylI02aX.js";
3
+ import { t as n } from "./use-material-translation-BUPqNmAg.js";
4
+ import { t as r } from "./icon-button-Ch0PThsa.js";
5
5
  import { t as i } from "./compose-refs-G4J4kaUA.js";
6
6
  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";
7
7
  import { jsx as y } from "react/jsx-runtime";
@@ -5,7 +5,7 @@ import { a as i, i as a, n as o, r as s, t as c } from "./dist-DWZXlCZR.js";
5
5
  import { a as l, i as u, n as d, r as f, t as p } from "./dist-DHdUUM1w.js";
6
6
  import { a as m, c as h, d as g, i as _, l as v, o as y, r as b, t as x, u as S } from "./floating-ui.dom-KkZSW8_E.js";
7
7
  import { t as C } from "./dist-DkQbkF9T.js";
8
- import { t as w } from "./use-material-translation-DA5ECZfA.js";
8
+ import { t as w } from "./use-material-translation-BUPqNmAg.js";
9
9
  import * as T from "react";
10
10
  import { useLayoutEffect as E, useRef as D, useSyncExternalStore as O } from "react";
11
11
  import { jsx as k, jsxs as A } from "react/jsx-runtime";
@@ -3,7 +3,7 @@ import { n as t } from "./dist-DVRQkaTK.js";
3
3
  import { i as n, r, t as i } from "./dist-DWZXlCZR.js";
4
4
  import { a, i as o, r as s } from "./dist-DHdUUM1w.js";
5
5
  import { i as c, n as l, r as u, t as d } from "./dist-DOK3zo5C.js";
6
- import { t as f } from "./use-material-translation-DA5ECZfA.js";
6
+ import { t as f } from "./use-material-translation-BUPqNmAg.js";
7
7
  import * as p from "react";
8
8
  import { createContext as m, useCallback as h, useContext as g, useEffect as ee, useLayoutEffect as _, useRef as v, useState as te } from "react";
9
9
  import { Fragment as ne, jsx as y, jsxs as b } from "react/jsx-runtime";
@@ -1,10 +1,10 @@
1
1
  import { t as e } from "./utils-BLfntITJ.js";
2
2
  import { a as t, i as n, n as r, o as i, r as a, t as o } from "./bubble-input-CQwVSoU3.js";
3
3
  import { a as s, r as c } from "./icon-sprites-CaYXzOL4.js";
4
- import { t as l } from "./use-material-translation-DA5ECZfA.js";
4
+ import { t as l } from "./use-material-translation-BUPqNmAg.js";
5
5
  import { t as u } from "./use-theme-BCLireTd.js";
6
6
  import { a as d, r as f } from "./theme-context-Cofk6vgs.js";
7
- import { t as p } from "./theme-toggle-DUQTEe1y.js";
7
+ import { t as p } from "./theme-toggle-3NQ3VmJH.js";
8
8
  import { n as m, t as h } from "./nxgt-theme-DA1IQe0O.js";
9
9
  import { useContext as g } from "react";
10
10
  import { jsx as _, jsxs as v } from "react/jsx-runtime";
@@ -1,4 +1,4 @@
1
- import { t as e } from "./use-material-translation-DA5ECZfA.js";
1
+ import { t as e } from "./use-material-translation-BUPqNmAg.js";
2
2
  import { i as t } from "./theme-store-BdPp43cV.js";
3
3
  import { n, t as r } from "./use-theme-BCLireTd.js";
4
4
  import { r as i } from "./theme-context-Cofk6vgs.js";
@@ -1,15 +1,15 @@
1
1
  import { t as e } from "./utils-BLfntITJ.js";
2
2
  import { o as t, t as n } from "./dist-DVRQkaTK.js";
3
3
  import { i as r, r as i } from "./dist-DWZXlCZR.js";
4
- import { n as a } from "./spinner-CHWFXCfd.js";
4
+ import { n as a } from "./spinner-CQqRWxAW.js";
5
5
  import { a as o } from "./dist-DHdUUM1w.js";
6
6
  import { i as s, n as c, r as l, t as u } from "./dist-DOK3zo5C.js";
7
7
  import { t as d } from "./in-dialog-D61Yeaol.js";
8
- import { A as f, M as p, N as m, b as h, d as g, f as _, i as v, j as y, l as b, n as x, o as S, r as C, t as w, u as T, y as ee } from "./dropdown-menu-B2ctUFti.js";
9
- import { a as te, n as ne } from "./popover-ukgGm5B6.js";
8
+ import { A as f, M as p, N as m, b as h, d as g, f as _, i as v, j as y, l as b, n as x, o as S, r as C, t as w, u as T, y as ee } from "./dropdown-menu-nl0Q3tQ2.js";
9
+ import { a as te, n as ne } from "./popover-BA1U82Wk.js";
10
10
  import { i as re, n as ie, r as ae, t as oe } from "./dist-BZe2evxL.js";
11
11
  import { t as se } from "./warn-once-C_e47JM8.js";
12
- import { t as ce } from "./use-material-translation-DA5ECZfA.js";
12
+ import { t as ce } from "./use-material-translation-BUPqNmAg.js";
13
13
  import * as E from "react";
14
14
  import { createContext as D, useCallback as le, useContext as O, useEffect as k, useId as ue, useLayoutEffect as A, useMemo as j, useReducer as de, useRef as M, useState as N } from "react";
15
15
  import { Fragment as P, jsx as F, jsxs as I } from "react/jsx-runtime";
@@ -1,4 +1,4 @@
1
- import { a as e, l as t, r as n, s as r, t as i, u as a } from "./translator-CxyFsfO0.js";
1
+ import { a as e, l as t, r as n, s as r, t as i, u as a } from "./translator-6XuDmqUJ.js";
2
2
  import { createContext as o, useCallback as s, useContext as c, useEffect as l, useMemo as u, useRef as d, useState as f } from "react";
3
3
  import { jsx as p } from "react/jsx-runtime";
4
4
  //#region lib/i18n/material-resources-registry.ts
@@ -1763,6 +1763,7 @@ var r = {
1763
1763
  events: "{count, plural, one {# event} other {# events}}",
1764
1764
  more: "+{count} more",
1765
1765
  drag: "Drag event",
1766
+ label: "Event calendar",
1766
1767
  add: "Add event",
1767
1768
  resize: "Resize event",
1768
1769
  "new-event": "New event",
@@ -1782,8 +1783,11 @@ var r = {
1782
1783
  resource: "Resource",
1783
1784
  lane: "Week",
1784
1785
  "lane-all": "All weeks",
1786
+ cancelled: "Cancelled",
1787
+ "week-badge": "Week: {label}",
1785
1788
  "time-zone": "Time zone: {zone}"
1786
1789
  },
1790
+ "event-chip": { cancelled: "Cancelled" },
1787
1791
  dnd: { drag: "Drag" },
1788
1792
  "rich-text-editor": {
1789
1793
  words: "words",
@@ -2209,6 +2213,7 @@ var r = {
2209
2213
  "none-single": "Mark the correct {label}",
2210
2214
  "none-multiple": "Mark at least one correct {label}",
2211
2215
  blank: "Fill in every {label}",
2216
+ detail: "Explanation",
2212
2217
  "text-required": "Enter the {label}"
2213
2218
  },
2214
2219
  "repeatable-group": {
@@ -5243,6 +5248,7 @@ var r = {
5243
5248
  events: "{count, plural, one {# événement} other {# événements}}",
5244
5249
  more: "+{count} de plus",
5245
5250
  drag: "Déplacer l'événement",
5251
+ label: "Calendrier d'événements",
5246
5252
  add: "Ajouter un événement",
5247
5253
  resize: "Redimensionner l'événement",
5248
5254
  "new-event": "Nouvel événement",
@@ -5262,8 +5268,11 @@ var r = {
5262
5268
  resource: "Ressource",
5263
5269
  lane: "Semaine",
5264
5270
  "lane-all": "Toutes les semaines",
5271
+ cancelled: "Annulé",
5272
+ "week-badge": "Semaine : {label}",
5265
5273
  "time-zone": "Fuseau horaire : {zone}"
5266
5274
  },
5275
+ "event-chip": { cancelled: "Annulé" },
5267
5276
  dnd: { drag: "Déplacer" },
5268
5277
  "rich-text-editor": {
5269
5278
  words: "mots",
@@ -5689,6 +5698,7 @@ var r = {
5689
5698
  "none-single": "Indiquez la {label} juste",
5690
5699
  "none-multiple": "Indiquez au moins une {label} juste",
5691
5700
  blank: "Remplissez chaque {label}",
5701
+ detail: "Explication",
5692
5702
  "text-required": "Saisissez la {label}"
5693
5703
  },
5694
5704
  "repeatable-group": {
@@ -4,28 +4,28 @@ import { t as n } from "./utils-BLfntITJ.js";
4
4
  import { n as r } from "./use-shape-morph-BKA_R5P5.js";
5
5
  import { n as i, o as a, t as o } from "./dist-DVRQkaTK.js";
6
6
  import { i as s, n as c, r as l, t as u } from "./dist-DWZXlCZR.js";
7
- 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";
7
+ 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-CQqRWxAW.js";
8
8
  import { a as T, i as E, n as D, r as O, t as k } from "./dist-DHdUUM1w.js";
9
9
  import { a as A, i as ee } from "./dist-DOK3zo5C.js";
10
10
  import { i as j, n as M } from "./in-dialog-D61Yeaol.js";
11
- import { c as N, l as P, n as te, r as F, t as ne } from "./alert-dialog-Bz5PlYKp.js";
11
+ import { c as N, l as P, n as te, r as F, t as ne } from "./alert-dialog-D37eph4I.js";
12
12
  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";
13
- 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";
13
+ 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-nl0Q3tQ2.js";
14
14
  import { a as Ke, i as qe, n as Je } from "./field-blur-context-BLGgf_3z.js";
15
- import { i as Ye, n as Xe, r as Ze, t as Qe } from "./popover-ukgGm5B6.js";
15
+ import { i as Ye, n as Xe, r as Ze, t as Qe } from "./popover-BA1U82Wk.js";
16
16
  import { a as $e, i as et, n as tt, o as nt, t as rt } from "./bubble-input-CQwVSoU3.js";
17
- import { d as it, n as at, r as ot, t as st } from "./tabs-BideU0Rb.js";
18
- import { a as ct, n as lt, o as ut, s as dt, v as ft, y as pt } from "./toolbar-items-azkXY5w2.js";
17
+ import { d as it, n as at, r as ot, t as st } from "./tabs-DQTx3C8e.js";
18
+ import { a as ct, n as lt, o as ut, s as dt, v as ft, y as pt } from "./toolbar-items-BYCdJGUf.js";
19
19
  import { t as mt } from "./dist-DkQbkF9T.js";
20
20
  import { o as ht, s as gt, t as _t } from "./use-click-lock-Bwg_caHO.js";
21
21
  import { a as vt, r as yt } from "./icon-sprites-CaYXzOL4.js";
22
22
  import { t as bt } from "./warn-once-C_e47JM8.js";
23
- import { r as xt, t as St } from "./button-a3tH3pq4.js";
24
- import { a as Ct } from "./translator-CxyFsfO0.js";
23
+ import { r as xt, t as St } from "./button-CG9SBAT-.js";
24
+ import { a as Ct } from "./translator-6XuDmqUJ.js";
25
25
  import { h as wt } from "./get-CTzJAwfc.js";
26
26
  import { t as Tt } from "./isEmpty-F_g3jLf8.js";
27
- import { t as L } from "./use-material-translation-DA5ECZfA.js";
28
- import { t as R } from "./icon-button-BylI02aX.js";
27
+ import { t as L } from "./use-material-translation-BUPqNmAg.js";
28
+ import { t as R } from "./icon-button-Ch0PThsa.js";
29
29
  import { t as Et } from "./use-ssr-media-query-C6M5m8sf.js";
30
30
  import { n as Dt, t as Ot } from "./typography-CYEquVeb.js";
31
31
  import { n as kt, t as At } from "./util-4heV2LPI.js";
@@ -36,15 +36,15 @@ import { a as Bt } from "./toggle-group-CVMxEpWi.js";
36
36
  import { n as Vt } from "./use-slice-reducer-BGkeGtML.js";
37
37
  import { t as Ht } from "./browser-only-DQ94lWF8.js";
38
38
  import { t as Ut } from "./compose-refs-G4J4kaUA.js";
39
- import { n as Wt, r as Gt, t as Kt } from "./chip-BwGvGx_S.js";
39
+ import { n as Wt, r as Gt, t as Kt } from "./chip-BbUSBl3i.js";
40
40
  import { c as qt, o as Jt, r as Yt, s as Xt, t as Zt } from "./input-CC2joTjB.js";
41
- import { i as Qt, n as $t, t as en } from "./input-group-CiayHfBN.js";
41
+ import { i as Qt, n as $t, t as en } from "./input-group-CPMSQcBx.js";
42
42
  import { t as tn } from "./text-field-BAdY-kpO.js";
43
43
  import { r as nn } from "./use-csp-nonce-ZKs9k-ov.js";
44
- import { t as rn } from "./empty-state-Bs44jnWk.js";
44
+ import { t as rn } from "./empty-state-mrJuqph3.js";
45
45
  import { t as an } from "./skeleton-DSdtr2qc.js";
46
- 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";
47
- import { t as pn } from "./icon-badge-YT98b2Vx.js";
46
+ import { l as on, n as sn, o as cn, r as ln, s as un, t as dn, u as fn } from "./dialog-Jhpx6ulb.js";
47
+ import { t as pn } from "./icon-badge-CVMHwdFm.js";
48
48
  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";
49
49
  import { t as wn } from "./markdown-Dw_uH7j7.js";
50
50
  import { r as Tn, t as En } from "./create-store-Dqp-PLLn.js";
@@ -11180,7 +11180,7 @@ var eS = (e = {}) => Tn({
11180
11180
  let [{ default: t }, { lowlight: n }, { richCodeBlock: r }] = await Promise.all([
11181
11181
  import("./dist-CRMFGjng.js"),
11182
11182
  import("./lowlight-OtcjU2Sa.js"),
11183
- import("./rich-code-block-DUaSLxLT.js")
11183
+ import("./rich-code-block-CGNjHawR.js")
11184
11184
  ]);
11185
11185
  return [r(t, {
11186
11186
  lowlight: n,
@@ -1,8 +1,8 @@
1
1
  import { t as e } from "./utils-BLfntITJ.js";
2
- 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";
3
- import { a as l } from "./button-a3tH3pq4.js";
4
- import { i as u } from "./translate-material-d8Q5K5a_.js";
5
- import { t as d } from "./use-material-translation-DA5ECZfA.js";
2
+ 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-D37eph4I.js";
3
+ import { a as l } from "./button-CG9SBAT-.js";
4
+ import { i as u } from "./translate-material-jxfcGlD5.js";
5
+ import { t as d } from "./use-material-translation-BUPqNmAg.js";
6
6
  import { _ as f, g as p, h as m, t as h, v as g, y as _ } from "./date.utils-JTEIo3mM.js";
7
7
  import { useCallback as v, useEffect as y, useMemo as b, useRef as x, useState as S } from "react";
8
8
  import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
@@ -1,4 +1,4 @@
1
- import { i as e, t } from "./translate-material-d8Q5K5a_.js";
1
+ import { i as e, t } from "./translate-material-jxfcGlD5.js";
2
2
  import { useCallback as n } from "react";
3
3
  //#region lib/i18n/use-material-translation.ts
4
4
  function r() {
@@ -1,6 +1,6 @@
1
1
  import { o as e, r as t } from "./dist-DVRQkaTK.js";
2
2
  import { i as n, n as r, r as i, t as a } from "./dist-DWZXlCZR.js";
3
- import { C as o, S as s, x as c } from "./spinner-CHWFXCfd.js";
3
+ import { C as o, S as s, x as c } from "./spinner-CQqRWxAW.js";
4
4
  import { a as l, i as u, r as d } from "./dist-DHdUUM1w.js";
5
5
  import { c as f, i as p, l as m, o as h, r as g, s as ee } from "./in-dialog-D61Yeaol.js";
6
6
  import { r as te } from "./escape-owner-DpaP0lm1.js";
package/docs/README.md CHANGED
@@ -13,6 +13,7 @@ detail: every option, the second example, and the traps.
13
13
  | [Calculator](guides/calculator.md) | You add an exact-decimal calculator with `@nxgt/material/calculator` (and `CalculatorField` with `@nxgt/material/calculator-field`): `Calculator`, the keyboard, the tape and memory, copy and paste, what is stored, feedback, sizing and accessibility |
14
14
  | [Charts](guides/charts.md) | You draw charts with `@nxgt/material/charts`: each chart, the shared props, reference bands, thresholds and point tones, zoom and phone scroll, the keyboard, accessibility, theming the `--chart-1..5` tokens, and moving off the Nivo charts, removed in 3.0 |
15
15
  | [Cards and tiles](guides/cards-and-tiles.md) | You want a `DataTable` as a list of cards or tiles: `layout`, `renderCard`, `renderTile`, the card's one link, selection, the sort control, columns by the list's width |
16
+ | [EventCalendar](guides/event-calendar.md) | You mark periods with `spans`, label days and weeks with `dayBadges` and `weekBadges`, colour events with `tone`, cancel them with `status`, or make them read-only with `readOnlyEvents` |
16
17
  | [DataGrid](guides/data-grid.md) | You are building an editable grid: columns and editors, save modes and conflicts, resizing, hiding and reordering columns, paste, fill and series, undo, totals, long lists, phones, custom editors, CSP |
17
18
  | [Code editor](guides/code-editor.md) | You want `CodeEditor` or `CodeDiff` in a theme preset or your own (`defineCodeTheme`), several themes on one page, Monaco bundled instead of the CDN, or the new `@nxgt/material/code-editor` import (the reader look, the view props, the `ref` handle and the file tabs are in the component's own page) |
18
19
  | [i18n](guides/i18n.md) | You want the components in French, your own strings typed, or translated Zod messages |
@@ -1607,9 +1607,14 @@ import { EventChip } from '@nxgt/material/components';
1607
1607
  | `compact` | `boolean` | `false` | one line, the time before the title, for month cells |
1608
1608
  | `continuesBefore`, `continuesAfter` | `boolean` | `false` | square edges for a multi-day event |
1609
1609
  | `badge` | `{ label: string; tone?: Tone }` | — | a small tinted label after the title (neutral without a `tone`); cut with an ellipsis; in a box under 20px tall or 7rem wide it becomes a tone dot (its tooltip is the label) while the label stays in the chip's accessible name. `EventCalendar` sets it from `CalendarEvent.badge` |
1610
+ | `badges` | `{ label: string; tone?: Tone }[]` | — | further badges after `badge`, each with the same pill and tone-dot behaviour and each in the accessible name. `EventCalendar` sets it from `CalendarEvent.badges` |
1611
+ | `tone` | `Tone` | — | draws the chip in a tone of the library (or one your app declared) when it sets no `color`; a `color` wins |
1612
+ | `cancelled` | `boolean` | `false` | a muted chip with a dashed outline, the title struck through (`<del>`) and "Cancelled" in its accessible name (`material.event-chip.cancelled`, English and French) |
1610
1613
  | `selected`, `disabled` | `boolean` | `false` | state |
1611
1614
 
1612
- **Storybook:** `Data display/EventChip` · **Vue:** `EventChip` (`variant`, `endTime`: React only for now, #892; `badge`: #2526)
1615
+ The colour shows as a thin accent bar inset from the chip's edges (never a border of the chip); a cancelled chip fades it.
1616
+
1617
+ **Storybook:** `Data display/EventChip` · **Vue:** `EventChip` (`variant`, `endTime`: React only for now, #892; `badge`, `badges`, `tone`, `cancelled`: #2526, #2662)
1613
1618
 
1614
1619
  ---
1615
1620
 
@@ -1727,6 +1727,9 @@ items go last under "No date". Pass `now` and `timeZone` from the server so the
1727
1727
  headings match on hydration; an unknown `timeZone` falls back to the runtime's
1728
1728
  with a warning in development. The split is also plain data:
1729
1729
  `groupByDate` (re-exported by `@nxgt/material/components`, beside `groupByDay`).
1730
+ `useDayGroups({ items, getDate, … })` (options type `DayGroupsOptions`) returns the
1731
+ resolved groups (`ResolvedDayGroup[]`, each with its heading) for a custom layout,
1732
+ and `DAY_GROUP_ORDER` is the order of the buckets.
1730
1733
  `calendarDateOf`, `formatCalendarDate` and `isValidTimeZone` are in
1731
1734
  `@nxgt/material-core/day-math`.
1732
1735
 
@@ -333,8 +333,8 @@ masculine one.
333
333
  ![ChoiceListField](../previews/form-fields-choicelistfield.webp)
334
334
 
335
335
  An editable list of answer choices, for a quiz question: each row has a text
336
- and a "correct" mark. `ChoiceListFormField` wires it to react-hook-form; the
337
- value is an array of `{ id, text, correct }`.
336
+ and a "correct" mark (and, with `rowDetail`, a short explanation). `ChoiceListFormField` wires it to react-hook-form; the
337
+ value is an array of `{ id, text, correct }` (plus `explanation?` with `rowDetail`).
338
338
 
339
339
  ```tsx
340
340
  import { useForm } from 'react-hook-form';
@@ -403,6 +403,8 @@ form.setError('choices.1.text', { message }, { shouldFocus: true });
403
403
  | `label` | `ReactNode` | none | names the group (a `group`, or a `radiogroup` in `single`) |
404
404
  | `rowLabel`, `addLabel` | `string` | "answer", "Add answer" | lower-case noun for the buttons (translated by default) |
405
405
  | `error`, `rowErrors` | `ReactNode`, `{ [id]: ReactNode }` | none | the list's error and each row's, by id (`ChoiceListField`; the form field fills them from the form) |
406
+ | `rowDetail` | `boolean \| { label?, placeholder?, maxLength? }` | off | adds a textarea under each row, stored as `ChoiceRow.explanation` (why a choice is right or wrong). `true` uses the defaults (`ChoiceRowDetail` types the object): label "Explanation" (translated, numbered "Explanation 2"), no placeholder, no limit. `maxLength` limits the text and shows a counter. Off: rows are `{ id, text, correct }` and nothing changes |
407
+ | `rowDetailErrors` | `{ [id]: ReactNode }` | none | each row's detail error, by id (`ChoiceListField`; the form field fills them from the form) |
406
408
  | `onBlur` | `() => void` | none | `ChoiceListField` alone: called when the focus leaves the whole list. In a form the list's root is registered with the form's `FieldBlur`, so touched works without it |
407
409
  | `onAssignIds` | `(rows) => void` | `onChange` | `ChoiceListField`: called once on mount with ids given to rows that had none or repeated one; the form field sets them without marking the form dirty |
408
410
  | other props | `div` props | | passed to the group's root (`className`, `id`, `data-*`, `ref`) |
@@ -414,6 +416,28 @@ form.setError('choices.1.text', { message }, { shouldFocus: true });
414
416
  one on mount (the form field does it with `setValue` when the `FormProvider` above is its own form, and then leaves the form clean; otherwise it calls `onChange`). Give the rows ids in `defaultValues`, the clean path: with assigned ids `defaultValues` still lack them, so `dirtyFields.choices` marks rows after the first real edit.
415
417
  In `single`, the new row is marked when no row is. A list that arrives with
416
418
  several rows marked is not changed: it fails the `too-many` rule.
419
+ - **Row detail:** with `rowDetail`, each row gets a textarea named "Explanation 2"
420
+ (or your `label`) that edits `ChoiceRow.explanation`. It follows its row through
421
+ reorder, add and remove, like `text`. A resolver's issue on
422
+ `choices.2.explanation` shows under that textarea, and `setFocus('choices.2.explanation')`
423
+ focuses it. The built-in rules never refuse a blank explanation; require one in
424
+ your schema. `explanation` stays absent on a row until its textarea is edited.
425
+
426
+ ```tsx
427
+ import type { ChoiceRowDetail } from '@nxgt/material/components';
428
+
429
+ const detail: ChoiceRowDetail = { label: 'Why', maxLength: 200 };
430
+ // <ChoiceListFormField … rowDetail={detail} />
431
+ ```
432
+
433
+ ```tsx
434
+ <ChoiceListFormField
435
+ control={control}
436
+ name="choices"
437
+ label="Answers"
438
+ rowDetail={{ label: 'Why', placeholder: 'Why is it right or wrong?', maxLength: 200 }}
439
+ />
440
+ ```
417
441
  - **Semantics:** each row's text is a labelled input ("Answer 2"); its mark
418
442
  is a radio or a checkbox named "Correct: answer 2" (the visible word
419
443
  "Correct" starts the name), so `getByRole('checkbox', { name: 'Correct: answer 2' })`
@@ -433,7 +457,7 @@ form.setError('choices.1.text', { message }, { shouldFocus: true });
433
457
  list, and blank rows are marked invalid (only for that rule, never for a resolver's or another rule's message). With a resolver (zod), an issue on
434
458
  `choices.2.text` shows under row 3 and an issue on `choices` under the list.
435
459
  When both fail in one pass, react-hook-form keeps only the list's.
436
- - **Translations:** `material.choice-list.*` (English and French). The
460
+ - **Translations:** `material.choice-list.*` (English and French; `detail` is the default label of `rowDetail`). The
437
461
  messages name the row with `rowLabel` ("Fill in every answer"); `too-few`
438
462
  is a plural that adds `s` to it, and the French templates carry the
439
463
  feminine article, so a French app overrides the keys for a masculine noun.
@@ -1753,7 +1777,14 @@ import { AttributesFormField } from '@nxgt/material/components';
1753
1777
  ```tsx
1754
1778
  import { AttributeValuesFormFieldSet, FormSection } from '@nxgt/material/components';
1755
1779
 
1756
- const form = useForm({ defaultValues: { attributes: { color: '#2563eb', size: 'M' } } });
1780
+ interface ItemValues {
1781
+ label: string;
1782
+ attributes: Record<string, string>;
1783
+ }
1784
+
1785
+ const form = useForm<ItemValues>({
1786
+ defaultValues: { label: 'Shirt', attributes: { color: '#2563eb', size: 'M' } },
1787
+ });
1757
1788
 
1758
1789
  <FormSection title="Attributes">
1759
1790
  <AttributeValuesFormFieldSet
@@ -1769,10 +1800,12 @@ const form = useForm({ defaultValues: { attributes: { color: '#2563eb', size: 'M
1769
1800
  </FormSection>
1770
1801
  ```
1771
1802
 
1803
+ `T` is inferred from `control`, so `name` is checked against the form's paths and no `as never` cast is needed.
1804
+
1772
1805
  | Prop | |
1773
1806
  | --- | --- |
1774
1807
  | `attributes` | the attributes to fill, one input each |
1775
- | `control`, `name` | the form and the path of the object it writes |
1808
+ | `control`, `name` | the form and the path of the object it writes; generic over the form values (`Control<T>`, `Path<T>`), so a typed form needs no cast |
1776
1809
  | `label` | the fieldset's accessible name (required) |
1777
1810
  | `hideLabel` | default `false`. `true` keeps `label` as the name but draws nothing, for a `FormSection` that already has the title |
1778
1811
  | `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 |
@@ -1249,6 +1249,7 @@ import { Badge, Button, Card, CardContent, Description, RecordDetails, RecordPag
1249
1249
  | `created`, `updated` | `{ label: string; at: Date \| string \| number }` | — | The two segments of the muted meta line; each « label date » stays on one line |
1250
1250
  | `timeZone` | IANA zone | `'UTC'` | The zone the dates are written in, the same on a server and in a browser. Dates have no seconds and no zone suffix |
1251
1251
  | `maxColumns` | `1`-`6` | `4` | The most columns of the facts: the panel's own width gives one, a stacked and wide panel up to this |
1252
+ | other `div` props | `ComponentProps<'div'>` minus `title` | — | `data-*`, `id`, `aria-*` and `className` go to the root card; `className` is merged with its own classes |
1252
1253
 
1253
1254
  The facts are a [`DescriptionList`](data-display.md#descriptionlist), so the columns follow the card's width, not the window's.
1254
1255