@nxgt/material 3.95.1 → 3.96.1
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.
- package/CHANGELOG.md +28 -0
- package/README.md +1 -1
- package/dist/{alert-dialog-D4r0Kn9h.js → alert-dialog-CXrzx0_F.js} +1 -1
- package/dist/{async-slice-Bx438UlG.js → async-slice-BU95-2E-.js} +1 -1
- package/dist/{button-Z_xcg10A.js → button-BWrgbYzl.js} +1 -1
- package/dist/{calculator-BfIBMiFX.js → calculator-CSzocvaa.js} +10 -10
- package/dist/calculator-field.js +6 -6
- package/dist/{calculator-segment-DQE1EFdw.js → calculator-segment-eqckz2Gh.js} +1 -1
- package/dist/calculator.js +1 -1
- package/dist/charts.js +3 -3
- package/dist/{chip-Bb9SM3Ly.js → chip-CXHTVFNy.js} +2 -2
- package/dist/{code-editor-Cw-dOrn2.js → code-editor-jL17cLkd.js} +4 -4
- package/dist/code-editor.js +4 -4
- package/dist/{code-language-items-BVfxGKiv.js → code-language-items-CefP9Ag7.js} +2 -2
- package/dist/{components-DXCfO95n.js → components-CrglpttC.js} +11630 -11514
- package/dist/components.js +24 -24
- package/dist/{conversion-variant-Ciii9Rbh.js → conversion-variant-BQYmd3cd.js} +4 -4
- package/dist/{currency-field-DipsI0Bv.js → currency-field-BT6V3B9k.js} +4 -4
- package/dist/{dialog-CFuONiW5.js → dialog-CraDDyZ5.js} +3 -3
- package/dist/dnd.js +1 -1
- package/dist/{dropdown-menu-BvtBDoSD.js → dropdown-menu-BvCQYzou.js} +1 -1
- package/dist/editor.js +8 -8
- package/dist/{empty-state-n2zb23YG.js → empty-state-BZ-z6vFF.js} +1 -1
- package/dist/{financial-variant-CTXTLbE_.js → financial-variant-CIeXbVuZ.js} +5 -5
- package/dist/{hooks-zyRsvilJ.js → hooks-DnDZqwHK.js} +2 -2
- package/dist/hooks.js +2 -2
- package/dist/{hover-card-BJ15hu7B.js → hover-card-Dnaux56l.js} +1 -1
- package/dist/i18n.js +3 -3
- package/dist/{icon-badge-B2ns44Cz.js → icon-badge-DoQcaVIt.js} +1 -1
- package/dist/{icon-button-BG438okX.js → icon-button-Cn1iJKLh.js} +1 -1
- package/dist/lib/components/ui/collections/row-menu/coarse-items.d.ts +2 -0
- package/dist/lib/components/ui/dates/picker-trigger/typed-box.d.ts +1 -1
- package/dist/lib/components/ui/dates/picker-trigger/use-typed-value.d.ts +4 -2
- package/dist/lib/components/ui/display/entity-header/entity-header.d.ts +23 -5
- package/dist/lib/components/ui/display/entity-header/partials/entity-header-actions.d.ts +7 -2
- package/dist/lib/components/ui/display/entity-header/partials/entity-header-body.d.ts +3 -1
- package/dist/lib/components/ui/display/entity-header/partials/entity-header-icon.d.ts +1 -2
- package/dist/lib/components/ui/display/entity-header/partials/entity-header-layout.d.ts +21 -7
- package/dist/lib/components/ui/display/entity-header/partials/entity-header-more.d.ts +8 -0
- package/dist/lib/components/ui/display/entity-header/partials/entity-header-split.d.ts +16 -0
- package/dist/lib/components/ui/display/entity-header/partials/entity-header-start.d.ts +3 -1
- package/dist/lib/components/ui/fields/contacts/placeholders.d.ts +1 -1
- package/dist/lib/components/ui/fields/switch/use-switch-checked.d.ts +1 -1
- package/dist/lib/components/ui/layout/app-shell/app-breadcrumb.d.ts +3 -1
- package/dist/lib/components/ui/layout/app-shell/app-breadcrumb.utils.d.ts +13 -0
- package/dist/lib/i18n/resources/en/en.d.ts +3 -0
- package/dist/lib/i18n/resources/en/material.json.d.ts +3 -0
- package/dist/lib/i18n/resources/fr/fr.d.ts +3 -0
- package/dist/lib/i18n/resources/fr/material.json.d.ts +3 -0
- package/dist/lib/i18n/resources/resources.d.ts +6 -0
- package/dist/lib/i18n/translator.d.ts +1 -1
- package/dist/lib.js +1 -1
- package/dist/main.js +28 -28
- package/dist/map.js +8 -8
- package/dist/material.css +1 -1
- package/dist/pdf-reader.js +1 -1
- package/dist/{percent-field-Cjc_3pP0.js → percent-field-Cb1aKl2E.js} +2 -2
- package/dist/{picker-surface-Cr2n42qv.js → picker-surface-GsabnsXj.js} +4 -4
- package/dist/{popover-XBAX2Shp.js → popover-ChQHl-f7.js} +1 -1
- package/dist/{pos-types-BFVWeJki.js → pos-types-D29gSY6o.js} +1 -1
- package/dist/{pos-variant-DWB8Bc12.js → pos-variant-DqPKfqlj.js} +4 -4
- package/dist/print.js +1 -1
- package/dist/{programmer-variant-B-wPnDeX.js → programmer-variant-eUfpdy1g.js} +2 -2
- package/dist/{public-D1bH-KPQ.js → public-BZqEkG6p.js} +9 -9
- package/dist/{rich-code-block-DP2RT7pV.js → rich-code-block-LhH6kbbp.js} +5 -5
- package/dist/{scientific-variant-BP08Mo0g.js → scientific-variant-Df2INIYv.js} +2 -2
- package/dist/{sortable-provider-CHGZrS0f.js → sortable-provider-COpuXp55.js} +2 -2
- package/dist/{spinner-rk8J5y9O.js → spinner-CJFQWd2O.js} +1 -1
- package/dist/{tabs-nuYLggwC.js → tabs-D5YrKdgT.js} +1 -1
- package/dist/{text-field-DOndWDT5.js → text-field-D8y_9TyA.js} +1 -1
- package/dist/theme-picker.js +2 -2
- package/dist/{theme-toggle-5waw9Wk8.js → theme-toggle-B6k9-nbm.js} +1 -1
- package/dist/{toolbar-items-Bo-nMzKJ.js → toolbar-items-DSVVI5_f.js} +4 -4
- package/dist/{translate-material-H5GMStyF.js → translate-material-B_3mzvSr.js} +1 -1
- package/dist/{translator-gdpQeToI.js → translator-DcF9o74-.js} +2 -0
- package/dist/{use-chat-composer-DEd6GM2N.js → use-chat-composer-DaD-HRc_.js} +16 -16
- package/dist/{use-heading-spy-n_wPa5jC.js → use-heading-spy-BrH2blon.js} +4 -4
- package/dist/{use-material-translation-BW5HZMwt.js → use-material-translation-CvL9XRpG.js} +1 -1
- package/dist/{use-return-focus-BC4sGh1b.js → use-return-focus-Dl3XUhck.js} +1 -1
- package/docs/components/data-display.md +35 -9
- package/docs/components/date-and-time.md +7 -4
- package/docs/components/form-fields.md +1 -1
- package/docs/guides/app-shell.md +5 -0
- package/docs/previews/data-display-entityheader.webp +0 -0
- package/docs/roadmap.md +1 -0
- package/docs/troubleshooting.md +15 -0
- package/package.json +1 -1
package/dist/pdf-reader.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { t as e } from "./utils-BLfntITJ.js";
|
|
2
2
|
import { a as t, i as n, n as r } from "./field-blur-context-BLGgf_3z.js";
|
|
3
|
-
import { t as i } from "./use-material-translation-
|
|
4
|
-
import { a, r as o } from "./currency-field-
|
|
3
|
+
import { t as i } from "./use-material-translation-CvL9XRpG.js";
|
|
4
|
+
import { a, r as o } from "./currency-field-BT6V3B9k.js";
|
|
5
5
|
import { useId as s } from "react";
|
|
6
6
|
import { jsx as c, jsxs as l } from "react/jsx-runtime";
|
|
7
7
|
import { LockIcon as u } from "lucide-react";
|
|
@@ -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-
|
|
4
|
-
import { i as p, o as m, r as h, t as g } from "./popover-
|
|
5
|
-
import { t as _ } from "./use-material-translation-
|
|
6
|
-
import { n as v, t as y } from "./icon-button-
|
|
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-Dl3XUhck.js";
|
|
4
|
+
import { i as p, o as m, r as h, t as g } from "./popover-ChQHl-f7.js";
|
|
5
|
+
import { t as _ } from "./use-material-translation-CvL9XRpG.js";
|
|
6
|
+
import { n as v, t as y } from "./icon-button-Cn1iJKLh.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-
|
|
4
|
+
import { S as o, d as s, f as c, l, p as u, u as d, x as f } from "./spinner-CJFQWd2O.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-
|
|
1
|
+
import { t as e } from "./use-material-translation-CvL9XRpG.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-
|
|
3
|
-
import { t as n } from "./icon-button-
|
|
2
|
+
import { t } from "./use-material-translation-CvL9XRpG.js";
|
|
3
|
+
import { t as n } from "./icon-button-Cn1iJKLh.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-
|
|
5
|
+
import { a as i, n as a, r as o, t as s } from "./pos-types-D29gSY6o.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-
|
|
8
|
+
import { t as p } from "./calculator-segment-eqckz2Gh.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-
|
|
1
|
+
import { i as e, t } from "./translate-material-B_3mzvSr.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-
|
|
1
|
+
import { t as e } from "./use-material-translation-CvL9XRpG.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-
|
|
6
|
+
import { t as s } from "./calculator-segment-eqckz2Gh.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-
|
|
6
|
+
import { o as s } from "./spinner-CJFQWd2O.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-
|
|
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-
|
|
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-
|
|
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-Dl3XUhck.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-BvCQYzou.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-DSVVI5_f.js";
|
|
13
13
|
import { t as fe } from "./dist-DkQbkF9T.js";
|
|
14
|
-
import { t as pe } from "./button-
|
|
15
|
-
import { t as N } from "./use-material-translation-
|
|
16
|
-
import { n as me, t as he } from "./icon-button-
|
|
14
|
+
import { t as pe } from "./button-BWrgbYzl.js";
|
|
15
|
+
import { t as N } from "./use-material-translation-CvL9XRpG.js";
|
|
16
|
+
import { n as me, t as he } from "./icon-button-Cn1iJKLh.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-
|
|
24
|
-
import { r as Te, t as Ee, u as De } from "./dialog-
|
|
23
|
+
import { n as Ce, t as we } from "./empty-state-BZ-z6vFF.js";
|
|
24
|
+
import { r as Te, t as Ee, u as De } from "./dialog-CraDDyZ5.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-
|
|
2
|
-
import { c as t, n, t as r } from "./dropdown-menu-
|
|
3
|
-
import { t as i } from "./use-material-translation-
|
|
4
|
-
import { a, i as o, n as s, o as c, t as l } from "./code-language-items-
|
|
1
|
+
import { n as e } from "./spinner-CJFQWd2O.js";
|
|
2
|
+
import { c as t, n, t as r } from "./dropdown-menu-BvCQYzou.js";
|
|
3
|
+
import { t as i } from "./use-material-translation-CvL9XRpG.js";
|
|
4
|
+
import { a, i as o, n as s, o as c, t as l } from "./code-language-items-CefP9Ag7.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-
|
|
146
|
+
var N = g(() => import("./code-editor-jL17cLkd.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-
|
|
1
|
+
import { t as e } from "./use-material-translation-CvL9XRpG.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-
|
|
6
|
+
import { t as o } from "./calculator-segment-eqckz2Gh.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-
|
|
4
|
-
import { t as r } from "./icon-button-
|
|
3
|
+
import { t as n } from "./use-material-translation-CvL9XRpG.js";
|
|
4
|
+
import { t as r } from "./icon-button-Cn1iJKLh.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-
|
|
8
|
+
import { t as w } from "./use-material-translation-CvL9XRpG.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-
|
|
6
|
+
import { t as f } from "./use-material-translation-CvL9XRpG.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,7 +1,7 @@
|
|
|
1
1
|
import { t as e } from "./utils-BLfntITJ.js";
|
|
2
2
|
import { a as t, i as n, n as r } from "./field-blur-context-BLGgf_3z.js";
|
|
3
3
|
import { t as i } from "./dist-DkQbkF9T.js";
|
|
4
|
-
import { t as a } from "./icon-button-
|
|
4
|
+
import { t as a } from "./icon-button-Cn1iJKLh.js";
|
|
5
5
|
import { t as o } from "./compose-refs-G4J4kaUA.js";
|
|
6
6
|
import { a as s, o as c, t as l } from "./input-CC2joTjB.js";
|
|
7
7
|
import { isValidElement as u, useEffect as d, useId as f, useMemo as p, useRef as m, useState as h } from "react";
|
package/dist/theme-picker.js
CHANGED
|
@@ -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-
|
|
4
|
+
import { t as l } from "./use-material-translation-CvL9XRpG.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-
|
|
7
|
+
import { t as p } from "./theme-toggle-B6k9-nbm.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-
|
|
1
|
+
import { t as e } from "./use-material-translation-CvL9XRpG.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-
|
|
4
|
+
import { n as a } from "./spinner-CJFQWd2O.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-
|
|
9
|
-
import { a as te, n as ne } from "./popover-
|
|
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-BvCQYzou.js";
|
|
9
|
+
import { a as te, n as ne } from "./popover-ChQHl-f7.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-
|
|
12
|
+
import { t as ce } from "./use-material-translation-CvL9XRpG.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-
|
|
1
|
+
import { a as e, l as t, r as n, s as r, t as i, u as a } from "./translator-DcF9o74-.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
|
|
@@ -1299,6 +1299,7 @@ var r = {
|
|
|
1299
1299
|
unchanged: "No change"
|
|
1300
1300
|
},
|
|
1301
1301
|
"color-field": { open: "Pick a color" },
|
|
1302
|
+
"entity-header": { more: "More" },
|
|
1302
1303
|
toolbar: {
|
|
1303
1304
|
more: "More",
|
|
1304
1305
|
back: "Back"
|
|
@@ -4813,6 +4814,7 @@ var r = {
|
|
|
4813
4814
|
unchanged: "Sans changement"
|
|
4814
4815
|
},
|
|
4815
4816
|
"color-field": { open: "Choisir une couleur" },
|
|
4817
|
+
"entity-header": { more: "Plus" },
|
|
4816
4818
|
toolbar: {
|
|
4817
4819
|
more: "Plus",
|
|
4818
4820
|
back: "Retour"
|
|
@@ -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-
|
|
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-CJFQWd2O.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-
|
|
11
|
+
import { c as N, l as P, n as te, r as F, t as ne } from "./alert-dialog-CXrzx0_F.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-
|
|
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-BvCQYzou.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-
|
|
15
|
+
import { i as Ye, n as Xe, r as Ze, t as Qe } from "./popover-ChQHl-f7.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-
|
|
18
|
-
import { a as ct, n as lt, o as ut, s as dt, v as ft, y as pt } from "./toolbar-items-
|
|
17
|
+
import { d as it, n as at, r as ot, t as st } from "./tabs-D5YrKdgT.js";
|
|
18
|
+
import { a as ct, n as lt, o as ut, s as dt, v as ft, y as pt } from "./toolbar-items-DSVVI5_f.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-
|
|
24
|
-
import { a as Ct } from "./translator-
|
|
23
|
+
import { r as xt, t as St } from "./button-BWrgbYzl.js";
|
|
24
|
+
import { a as Ct } from "./translator-DcF9o74-.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-
|
|
28
|
-
import { t as R } from "./icon-button-
|
|
27
|
+
import { t as L } from "./use-material-translation-CvL9XRpG.js";
|
|
28
|
+
import { t as R } from "./icon-button-Cn1iJKLh.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,14 +36,14 @@ 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-
|
|
39
|
+
import { n as Wt, r as Gt, t as Kt } from "./chip-CXHTVFNy.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 { a as Qt, n as $t, r as en, t as tn } from "./text-field-
|
|
41
|
+
import { a as Qt, n as $t, r as en, t as tn } from "./text-field-D8y_9TyA.js";
|
|
42
42
|
import { r as nn } from "./use-csp-nonce-ZKs9k-ov.js";
|
|
43
|
-
import { t as rn } from "./empty-state-
|
|
43
|
+
import { t as rn } from "./empty-state-BZ-z6vFF.js";
|
|
44
44
|
import { t as an } from "./skeleton-DSdtr2qc.js";
|
|
45
|
-
import { l as on, n as sn, o as cn, r as ln, s as un, t as dn, u as fn } from "./dialog-
|
|
46
|
-
import { t as pn } from "./icon-badge-
|
|
45
|
+
import { l as on, n as sn, o as cn, r as ln, s as un, t as dn, u as fn } from "./dialog-CraDDyZ5.js";
|
|
46
|
+
import { t as pn } from "./icon-badge-DoQcaVIt.js";
|
|
47
47
|
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";
|
|
48
48
|
import { t as wn } from "./markdown-Dw_uH7j7.js";
|
|
49
49
|
import { r as Tn, t as En } from "./create-store-Dqp-PLLn.js";
|
|
@@ -11179,7 +11179,7 @@ var eS = (e = {}) => Tn({
|
|
|
11179
11179
|
let [{ default: t }, { lowlight: n }, { richCodeBlock: r }] = await Promise.all([
|
|
11180
11180
|
import("./dist-CRMFGjng.js"),
|
|
11181
11181
|
import("./lowlight-OtcjU2Sa.js"),
|
|
11182
|
-
import("./rich-code-block-
|
|
11182
|
+
import("./rich-code-block-LhH6kbbp.js")
|
|
11183
11183
|
]);
|
|
11184
11184
|
return [r(t, {
|
|
11185
11185
|
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-
|
|
3
|
-
import { a as l } from "./button-
|
|
4
|
-
import { i as u } from "./translate-material-
|
|
5
|
-
import { t as d } from "./use-material-translation-
|
|
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-CXrzx0_F.js";
|
|
3
|
+
import { a as l } from "./button-BWrgbYzl.js";
|
|
4
|
+
import { i as u } from "./translate-material-B_3mzvSr.js";
|
|
5
|
+
import { t as d } from "./use-material-translation-CvL9XRpG.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,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-
|
|
3
|
+
import { C as o, S as s, x as c } from "./spinner-CJFQWd2O.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";
|
|
@@ -1043,7 +1043,7 @@ import { Badge, EntityHeader } from '@nxgt/material/components';
|
|
|
1043
1043
|
title="John Doe"
|
|
1044
1044
|
status={<Badge variant="success">Active</Badge>}
|
|
1045
1045
|
metadata={[{ label: 'Email', value: 'john.doe@example.com' }]}
|
|
1046
|
-
actions={[{ children: 'Edit',
|
|
1046
|
+
actions={[{ children: 'Edit', icon: <Edit /> }]}
|
|
1047
1047
|
/>
|
|
1048
1048
|
```
|
|
1049
1049
|
|
|
@@ -1051,15 +1051,41 @@ import { Badge, EntityHeader } from '@nxgt/material/components';
|
|
|
1051
1051
|
| --- | --- | --- | --- |
|
|
1052
1052
|
| `title` | `ReactNode` | — | the heading (an `h1` unless `headingLevel` says otherwise); optional: without it no heading is rendered (see below) |
|
|
1053
1053
|
| `headingLevel` | `1 \| 2 \| 3` | `1` | the title's heading level: pass `2` or `3` when the page already has its `h1` (a list title beside a detail header); the look does not change |
|
|
1054
|
-
| `icon`, `status` | `ReactNode` | — | before and after the title; `icon` is decoration, shown in an `aria-hidden`
|
|
1054
|
+
| `icon`, `status` | `ReactNode` | — | before and after the title; `icon` is decoration, shown in an `aria-hidden` 48px tinted tile with rounded corners (a round `Avatar` is drawn as it is, 48px, with no tile), beside the title at every width, so put nothing meaningful or focusable there; for a control, use `leading` |
|
|
1055
1055
|
| `leading` | `ReactNode` | — | an interactive control at the band's start, such as a [Switcher](selection-and-choice.md#switcher) of either variant: drawn as it is, at its natural size (at most 18rem wide beside the title, from a 384px band; narrower, it takes the band's width), in the accessibility tree, with no badge and no `aria-hidden`; on a phone it takes the band's width above the title. **It replaces `icon` when both are given** (a development warning says so). Root `data-slot="entity-header-leading"` |
|
|
1056
|
-
| `metadata` | `{ label: string; value: ReactNode }[]` | `[]` | facts under the title, a description list laid out as a grid of equal columns (as many as the width allows, one per
|
|
1057
|
-
| `stats` | `EntityStat[]` | `[]` | figures (counts, a mean) as compact `size="sm"` [StatCard](#statcard) tiles in a `StatCardGroup` (2×2 on a phone, a wrapping row beside) under the
|
|
1058
|
-
| `actions` | `ResponsiveButtonProps[] \| ReactNode` | `[]` | an array becomes responsive buttons (icon-only on phones) |
|
|
1059
|
-
| `
|
|
1056
|
+
| `metadata` | `{ label: string; value: ReactNode }[]` | `[]` | facts under the title, a description list laid out as a grid of equal columns (as many as the width allows, one per 13rem at least in the header and one column below `@sm`; a standalone `EntityMetadata` keeps 9.5rem): a small muted label above its value, no colon, a long value wraps inside its column; a link or a text button in a value keeps the text's height (its own `min-h-11` is dropped; on a touch pointer its 44px tap target is a hit area that adds no height), and a link in a value is drawn in the primary text colour (`text-primary-text`), not the prose link's info blue, and `nxgt-plain-link` still opts out |
|
|
1057
|
+
| `stats` | `EntityStat[]` | `[]` | figures (counts, a mean) as compact `size="sm"` [StatCard](#statcard) tiles in a `StatCardGroup` (2×2 on a phone, a wrapping row beside) as a full-width row under its own hairline, after the facts; a `tone` paints a tile, `0` is a figure, an empty value drops the tile (see Stats below) |
|
|
1058
|
+
| `actions` | `ResponsiveButtonProps[] \| ReactNode` | `[]` | an array becomes responsive buttons (icon-only on phones): the first `maxVisibleActions` non-destructive ones stay on the band, tonal unless they set their own `variant`, and the rest go to a More menu (see below); a node is rendered exactly as it is, and `maxVisibleActions` does not apply to it |
|
|
1059
|
+
| `maxVisibleActions` | `number` | `1` | how many actions of an `actions` array stay visible; `0` puts them all in the menu, `Infinity` keeps them all, `NaN` falls back to `1` |
|
|
1060
|
+
| `surface` | `'card' \| 'none'` | `'card'` | `'none'` draws the header flat (no background, border or padding) for a header that sits directly on a page band or inside a surface of its own, so surfaces do not nest; the identity, actions and facts keep their order, only the card's own padding is gone |
|
|
1060
1061
|
|
|
1061
1062
|
The root carries `data-slot="entity-header"`; the metadata is a `dl` with `data-slot="entity-metadata"` (a muted `dt` label above its `dd` value in a grid cell, no colon), and the actions sit in `data-slot="entity-header-actions"` (absent when there are none). Inside an EntityHeader that replaces the old `summary-data` slot and its `Label:` text, so update a selector or a test that read "Label: value".
|
|
1062
1063
|
|
|
1064
|
+
**Actions and the More menu.** With an array, one action stays on the band as a tonal button and the others open from a More button at the end of the actions. The rules:
|
|
1065
|
+
|
|
1066
|
+
- Destructive actions (`color: 'error'`) come last in the menu, under a separator. When every action is destructive and more than `maxVisibleActions` fit, none stays visible: they all go to the menu.
|
|
1067
|
+
- When every action fits, nothing moves: no More button, no separator.
|
|
1068
|
+
- A menu entry keeps `icon`, `children`, `onClick`, `disabled`, `loading`, `aria-label`, `color: 'error'`, `asChild` (a link child works as a menu item) and `data-*` attributes. `variant`, `tooltip`, `expanded` and `className` apply to visible buttons only, so an action that depends on them should stay visible.
|
|
1069
|
+
- The More button is named by the `material.entity-header.more` i18n key ("More"), and carries `data-slot="entity-header-more"` inside `data-slot="entity-header-actions"`. A menu entry is a `menuitem`, so a test that clicked a second action by role opens the More menu first.
|
|
1070
|
+
- On a phone, a text button or link that starts the actions is pulled back by its own padding, so its text lines up with the band's content edge.
|
|
1071
|
+
|
|
1072
|
+
```tsx
|
|
1073
|
+
import { Edit, Share } from 'lucide-react';
|
|
1074
|
+
import { EntityHeader } from '@nxgt/material/components';
|
|
1075
|
+
|
|
1076
|
+
<EntityHeader
|
|
1077
|
+
title="John Doe"
|
|
1078
|
+
actions={[
|
|
1079
|
+
{ children: 'Edit', icon: <Edit /> },
|
|
1080
|
+
{ children: 'Share', icon: <Share />, onClick: share },
|
|
1081
|
+
{ children: 'Delete', color: 'error', onClick: remove },
|
|
1082
|
+
]}
|
|
1083
|
+
/>
|
|
1084
|
+
// Edit stays on the band; Share, then Delete under a separator, are in More.
|
|
1085
|
+
|
|
1086
|
+
<EntityHeader title="John Doe" maxVisibleActions={Infinity} actions={actions} /> // all on the band
|
|
1087
|
+
```
|
|
1088
|
+
|
|
1063
1089
|
**Flat, on a page band.** `surface="none"` drops the header's own card; `className` still merges.
|
|
1064
1090
|
|
|
1065
1091
|
```tsx
|
|
@@ -1105,7 +1131,7 @@ import { Badge, EntityHeader } from '@nxgt/material/components';
|
|
|
1105
1131
|
icon={<User />}
|
|
1106
1132
|
status={<Badge variant="success">Active</Badge>}
|
|
1107
1133
|
metadata={[{ label: 'Email', value: 'john.doe@example.com' }]}
|
|
1108
|
-
actions={[{ children: 'Edit',
|
|
1134
|
+
actions={[{ children: 'Edit', icon: <Edit /> }]}
|
|
1109
1135
|
/>
|
|
1110
1136
|
```
|
|
1111
1137
|
|
|
@@ -1117,9 +1143,9 @@ The root is a plain `div` in every case, never a landmark, so there is no access
|
|
|
1117
1143
|
<EntityHeader headingLevel={2} title="Ada Lovelace" metadata={[{ label: 'Role', value: 'Analyst' }]} />
|
|
1118
1144
|
```
|
|
1119
1145
|
|
|
1120
|
-
Without a `title` the band is one row at every width: the icon inline before the status and metadata, the content taking the space, the actions at the end of the row or, when they do not fit, wrapped below and still at the end. An `Avatar` as `icon` is drawn without the badge around it.
|
|
1146
|
+
Without a `title` the band is one row at every width: the icon tile inline before the status and metadata, the content taking the space, the actions at the end of the row or, when they do not fit, wrapped below and still at the end. An `Avatar` as `icon` is drawn without the badge around it.
|
|
1121
1147
|
|
|
1122
|
-
With a title,
|
|
1148
|
+
With a title, the order at every width is the identity (tile, title, status), the actions, the facts, the stats, then `children`; from a 36rem container (`@xl`) the actions sit at the identity's end, yet they come before the facts in the DOM and so in focus order.
|
|
1123
1149
|
|
|
1124
1150
|
**Storybook:** `Data display/EntityHeader` · **Vue:** `EntityHeader`
|
|
1125
1151
|
|
|
@@ -195,8 +195,11 @@ it.
|
|
|
195
195
|
Every other `Calendar` prop (`disablePast`, `minDate`, …) is passed to the
|
|
196
196
|
calendar. A typed date outside `minDate`, `maxDate`, `disablePast` or
|
|
197
197
|
`disableFuture` is no value while it is typed, and is kept as entered once
|
|
198
|
-
focus leaves the field
|
|
199
|
-
it
|
|
198
|
+
focus leaves the field or Enter is pressed in a segment, so the form that Enter submits
|
|
199
|
+
has it (never moved to another day: the form's rule refuses
|
|
200
|
+
it, the calendar keeps the day unpickable). Typing over a date a form holds by
|
|
201
|
+
default (React Hook Form gives the default back for `undefined`) keeps the
|
|
202
|
+
typed segments while the date is incomplete. A value you set from outside
|
|
200
203
|
(`setValue`) is shown and kept the same way. A typed day that `disabledDays`
|
|
201
204
|
rules out is refused: it stays on screen with no value (it is not moved to
|
|
202
205
|
another day). An Invalid Date is no value. `id` goes on the first
|
|
@@ -442,8 +445,8 @@ start is no `to` (it stays on screen, and becomes the `to` once the start is
|
|
|
442
445
|
moved before it), and a start typed past the end drops the end, as a click in
|
|
443
446
|
the calendar does. A date outside `minDate`, `maxDate`, `disablePast` or
|
|
444
447
|
`disableFuture` is no value while it is typed and is kept as entered once
|
|
445
|
-
focus leaves the field (the form refuses it);
|
|
446
|
-
refused, kept on screen with no value. Retyping the start keeps the end
|
|
448
|
+
focus leaves the field or Enter is pressed in a segment (the form refuses it);
|
|
449
|
+
a day `disabledDays` rules out is refused, kept on screen with no value. Retyping the start keeps the end
|
|
447
450
|
while the start is incomplete. Typing a day keeps the time of day
|
|
448
451
|
of the end it replaces (`withTime`). The ends sit on one line while they fit
|
|
449
452
|
(about 330px for the dates, "Clear" and the calendar button on a mouse, about
|
|
@@ -1779,7 +1779,7 @@ import { Switch } from '@nxgt/material/components';
|
|
|
1779
1779
|
| `helperText` | `ReactNode` | — | line under the row (or under the bare switch), with or without `placeholder`; `SwitchFormField` puts the validation message here |
|
|
1780
1780
|
| `error` | `boolean` | — | error border on the row, error helper text, `aria-invalid` on the `switch` (a passed `aria-invalid` wins) |
|
|
1781
1781
|
| `thumbIcons` | `boolean` | `false` | a 24px thumb in both states, a cross when off and a check when on |
|
|
1782
|
-
| `variant` | `'box' \| 'plain'` | `'box'` | `plain` draws a labelled switch with no border
|
|
1782
|
+
| `variant` | `'box' \| 'plain'` | `'box'` | `plain` draws a labelled switch with no border: the label beside the switch. No effect on a bare switch |
|
|
1783
1783
|
| `className` | `string` | — | on the outermost element: the field, else the row, else the switch |
|
|
1784
1784
|
|
|
1785
1785
|
```tsx
|
package/docs/guides/app-shell.md
CHANGED
|
@@ -1838,6 +1838,11 @@ The trail is hidden when no route has a breadcrumb. A crumb whose
|
|
|
1838
1838
|
its separator, as `handle.title` accepts `null`, so the trail is hidden too
|
|
1839
1839
|
when every matched route returns `null`.
|
|
1840
1840
|
|
|
1841
|
+
The first crumb's icon or text starts on the content's left edge (the right in a
|
|
1842
|
+
right-to-left page), the same line as the page title below: it drops its own start
|
|
1843
|
+
inset instead of pulling the trail out of the column; a coarse pointer keeps the
|
|
1844
|
+
44px hit area.
|
|
1845
|
+
|
|
1841
1846
|
An error page rendered by `ActivityLayout` still matches the failed route, so
|
|
1842
1847
|
it would show its trail ("Home > Section" on a 404). Pass `breadcrumb={false}`
|
|
1843
1848
|
to render the layout without the trail:
|
|
Binary file
|
package/docs/roadmap.md
CHANGED
|
@@ -379,6 +379,7 @@ version they shipped in, and planned entries may name the major they target.
|
|
|
379
379
|
|
|
380
380
|
## Shipped
|
|
381
381
|
|
|
382
|
+
- **EntityHeader modern default (3.96.0)** — `EntityHeader` has a new default look: a clearer hierarchy with a leading icon tile or avatar beside the title, the facts on a grid under hairlines, stats as compact tiles, and one tonal action with the rest in a More menu (`maxVisibleActions`). Upgrade notes in [Troubleshooting](troubleshooting.md) ([#2733](https://github.com/softistx/nxgt-material/issues/2733)).
|
|
382
383
|
- **Fields Refined** (3.95.0) — every text-like field (text, select, combobox,
|
|
383
384
|
search, phone, date and time boxes) gets a crisper, more legible look by
|
|
384
385
|
default: a border of at least 3:1 contrast, the card surface, a clear focus
|
package/docs/troubleshooting.md
CHANGED
|
@@ -46,6 +46,7 @@ words in your error.
|
|
|
46
46
|
- [An accessibility audit reports low contrast on a badge, a button, a toast or a menu entry](#an-accessibility-audit-reports-low-contrast-on-a-badge-a-button-a-toast-or-a-menu-entry)
|
|
47
47
|
- [`ARIA hidden element must not be focusable or contain focusable elements`](#aria-hidden-element-must-not-be-focusable-or-contain-focusable-elements)
|
|
48
48
|
- [An `EntityHeader` metadata test that measured the label beside its value now fails](#an-entityheader-metadata-test-that-measured-the-label-beside-its-value-now-fails)
|
|
49
|
+
- [An `EntityHeader` layout test that measured the old header, or clicked a second action by role, now fails](#an-entityheader-layout-test-that-measured-the-old-header-or-clicked-a-second-action-by-role-now-fails)
|
|
49
50
|
- [A control in an `EntityHeader`'s `icon` is hidden from assistive tech, squashed, and reports `aria-hidden-focus`](#a-control-in-an-entityheaders-icon-is-hidden-from-assistive-tech-squashed-and-reports-aria-hidden-focus)
|
|
50
51
|
- [A `Switcher` in link mode leaves focus on the trigger after a navigation, and the new page's title never gets it](#a-switcher-in-link-mode-leaves-focus-on-the-trigger-after-a-navigation-and-the-new-pages-title-never-gets-it)
|
|
51
52
|
- [An accessibility audit reports low contrast on a tonal or outlined button, a selected list tile or a hovered badge link](#an-accessibility-audit-reports-low-contrast-on-a-tonal-or-outlined-button-a-selected-list-tile-or-a-hovered-badge-link)
|
|
@@ -1200,6 +1201,20 @@ const meta = container.querySelector('[data-slot="entity-metadata"]');
|
|
|
1200
1201
|
expect(meta).toHaveTextContent('Owner');
|
|
1201
1202
|
```
|
|
1202
1203
|
|
|
1204
|
+
### An `EntityHeader` layout test that measured the old header, or clicked a second action by role, now fails
|
|
1205
|
+
|
|
1206
|
+
**When:** after upgrading, a test or a screenshot of an `EntityHeader` expects the icon above the title on a phone, the actions after the facts, the old card padding, or filled actions; or it clicks the second action with `getByRole('button', { name })`.
|
|
1207
|
+
**Why:** the header has a new default look. The icon tile sits beside the title at every width, the order is identity, actions, facts, stats, and the card is a hairline border with no shadow (padding 16px, 20px from 28rem wide). With an `actions` array only `maxVisibleActions` (default `1`) actions stay on the band, tonal unless they set a `variant`; the others, destructive last, are `menuitem`s in a More menu (`material.entity-header.more`).
|
|
1208
|
+
**Fix:** update the numbers, open the More menu first, or keep every action on the band.
|
|
1209
|
+
|
|
1210
|
+
```tsx
|
|
1211
|
+
await user.click(screen.getByRole('button', { name: 'More' }));
|
|
1212
|
+
await user.click(screen.getByRole('menuitem', { name: 'Delete' }));
|
|
1213
|
+
|
|
1214
|
+
// or keep them all visible
|
|
1215
|
+
<EntityHeader title="John Doe" maxVisibleActions={Infinity} actions={actions} />
|
|
1216
|
+
```
|
|
1217
|
+
|
|
1203
1218
|
### A control in an `EntityHeader`'s `icon` is hidden from assistive tech, squashed, and reports `aria-hidden-focus`
|
|
1204
1219
|
|
|
1205
1220
|
**When:** an `EntityHeader` gets a `Switcher`, a button or a link as its `icon`.
|