@nxgt/material 3.95.1 → 3.96.1

package/CHANGELOG.md

@@ -1,5 +1,33 @@
 # @nxgt/material
 
+## 3.96.1
+
+### Patch Changes
+
+- [#2745](https://github.com/softistx/nxgt-material/pull/2745) [`9ed381a`](https://github.com/softistx/nxgt-material/commit/9ed381a22a7f9b704cd7a5d9a34b8b0a86195d52) Thanks [@SteveGT96](https://github.com/SteveGT96)! - fix(app-breadcrumb): the trail's first item (the home icon, or a text root) now starts on the content's left edge, in a right-to-left page the right edge, instead of sitting about 10px (4px for a text link) inside it by its own padding. It drops its start inset rather than pulling the trail out, so the link's box stays inside the column (clear of a rail, not clipped by a scroll container) and keeps its 44px hit area on a coarse pointer, and the focus ring. `AppBreadcrumb` in `@nxgt/material-vue` gets the same fix. A self-contained test that measured the home icon's position needs its numbers updated ([#2744](https://github.com/softistx/nxgt-material/issues/2744)).
+
+- [#2764](https://github.com/softistx/nxgt-material/pull/2764) [`e95154a`](https://github.com/softistx/nxgt-material/commit/e95154a25e0b8102de70cd51a72a96e4c507fd56) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Docs: the `Switch` `plain` variant row no longer claims to drop a tint it never drew; the `useSwitchChecked` comment names the row's `data-checked`.
+
+## 3.96.0
+
+### Minor Changes
+
+- [#2757](https://github.com/softistx/nxgt-material/pull/2757) [`bc0a23e`](https://github.com/softistx/nxgt-material/commit/bc0a23e29aa2ae0c666fc57cd0118088db15179c) Thanks [@SteveGT96](https://github.com/SteveGT96)! - feat(entity-header): an `actions` array keeps its first non-destructive action on the band, tonal, and moves the others to a "More" menu, destructive ones last ([#2737](https://github.com/softistx/nxgt-material/issues/2737)). The new `maxVisibleActions` prop (default `1`) sets how many stay visible; `0` puts them all in the menu, and when every action fits nothing is moved. The More button is named through `material.entity-header.more` ("More", « Plus »). An `actions` node is left exactly as it is. A text button or link that starts the actions row on a phone is pulled back by its own padding, so its text lines up with the title's left edge.
+  
+  Upgrade note: with an array of two or more actions, only the first non-destructive one stays a button now, and visible actions without their own `variant` are tonal instead of filled. Pass `maxVisibleActions={n}` (n at least the array's length) to keep them all on the band, and a `variant` to keep a filled look. A test that clicked a second action by role now opens the "More" menu first, and one that measured the actions row needs new numbers.
+  
+  A menu entry keeps only `icon`, `children`, `onClick`, `disabled`, `loading`, `aria-label`, `color: 'error'`, `asChild` and `data-*` attributes; `variant`, `tooltip`, `expanded` and `className` apply to visible buttons only, so an action that relied on them should stay visible (`maxVisibleActions`).
+
+- [#2757](https://github.com/softistx/nxgt-material/pull/2757) [`bc0a23e`](https://github.com/softistx/nxgt-material/commit/bc0a23e29aa2ae0c666fc57cd0118088db15179c) Thanks [@SteveGT96](https://github.com/SteveGT96)! - feat(entity-header): a new default look, direction A Refined ([#2736](https://github.com/softistx/nxgt-material/issues/2736)). The card is a hairline (a border, no shadow) with a larger radius, the icon a soft tinted 48 px squircle tile (or a 48 px round `Avatar`), the title `title-lg`, and the status stays beside the title and wraps under a long one.
+  
+  With a title, the order is now the identity, the actions, the facts under a hairline, the stats under their own hairline (on a full-width row, so the tiles are never squeezed), then `children`; from a 36rem container the actions sit at the end of the identity row. The facts take one column on a phone. `icon` now sits beside the title on every width, while `leading` keeps stacking above it on a phone. `surface="none"`, `headingLevel`, `variant`, `color` and the actions behave as before (an explicit `variant` or `color` still styles the tile).
+  
+  A test that measured the old layout needs new numbers. Old values: card padding 16 px (unchanged at 16 px, 20 px once the card itself is 28rem wide; the padding is on the band inside the card), radius `rounded` (now `rounded-lg`), shadow `shadow-xs` (now a 1 px border), icon 36 px-high badge with a `text-3xl` glyph and a `rounded` corner (now 48 px, `text-2xl`, `rounded-2xl`, tinted not filled), the icon above the title on a phone (now beside it), and the actions after the facts on a phone (now before them). An `Avatar` given as `icon` is now forced to 48 px, whatever size it was given. The markup gains wrappers around the facts and the stats.
+
+### Patch Changes
+
+- [#2756](https://github.com/softistx/nxgt-material/pull/2756) [`e9046b9`](https://github.com/softistx/nxgt-material/commit/e9046b9c7c3c7d5528588a2cb3b6985caad89625) Thanks [@SteveGT96](https://github.com/SteveGT96)! - fix(dates): typing over a date a React Hook Form field holds by default (`defaultValues`, a loaded record) no longer puts the old date back once the year is typed: the form hands its default back for the empty value a partial year emits, and the typed day, month and year now stay. Enter in a typed `DateField`, `DateRangeField` or `TimeField` now commits a typed value the field was holding back (outside `minDate` / `maxDate`) before the form submits, instead of only when focus leaves.
+
 ## 3.95.1
 
 ### Patch Changes

package/README.md

@@ -762,7 +762,7 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-summarydata.webp" width="120" alt="SummaryData"> | [`SummaryData`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#summarydata) | Label / value pairs as a grid or inline; hides empty values. | `SummaryData` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-description.webp" width="120" alt="Description"> | [`Description`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#description) | Read-only label / value pair that renders nothing when empty. | `Description` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-descriptionlist.webp" width="120" alt="DescriptionList"> | [`DescriptionList`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#descriptionlist), `DescriptionList.Group` | Dense auto-fill grid of `Description`s in a `dl` (`minItem`, `maxColumns`, `meta`, `span`, `labelPosition`, `lines`), or tonal panels per group with `variant="panels"`. | — (later, [#1614](https://github.com/softistx/nxgt-material/issues/1614)) |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-entityheader.webp" width="120" alt="EntityHeader"> | [`EntityHeader`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#entityheader) | Page header with icon, a `leading` control slot (a Switcher at the band's start), title (`headingLevel` 1 to 3), status, metadata, `stats` (figures as compact `size="sm"` StatCard tiles, 2×2 on a phone) and actions. | `EntityHeader` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-entityheader.webp" width="120" alt="EntityHeader"> | [`EntityHeader`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#entityheader) | Page header with icon, a `leading` control slot (a Switcher at the band's start), title (`headingLevel` 1 to 3), status, metadata, `stats` (figures as compact `size="sm"` StatCard tiles, 2×2 on a phone) and actions: with an array, `maxVisibleActions` (default `1`) keeps that many tonal buttons on the band and moves the rest to a More menu, destructive ones last. | `EntityHeader` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-listtile.webp" width="120" alt="ListTile"> | [`ListTile`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#listtile) | Row with leading / trailing slots, title and subtitle; becomes a link (with a decorative chevron; `selected` sets `aria-current="page"`), a button, or with `toggle` a switch row where the whole row toggles. `size="sm"` is the dense row; `chips` and `variant="divided"` make it a compact record row, `as="li"` puts it in a list. | `ListTile` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-accordioncard.webp" width="120" alt="AccordionCard"> | [`AccordionCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#accordioncard) | Renders `items` (title, content) as a styled accordion. | `AccordionCard` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-timeline.webp" width="120" alt="Timeline"> | [`Timeline`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#timeline), `TimelineItem`, `RelativeTime` | Vertical event timeline with shaped, toned markers, cards, alternating sides in a wide container, optional day groups and relative times. | `Timeline`, `TimelineItem`, `RelativeTime` |

package/dist/{alert-dialog-D4r0Kn9h.js → alert-dialog-CXrzx0_F.js}

@@ -4,7 +4,7 @@ import { o as n } from "./dist-DVRQkaTK.js";
 import { r } from "./dist-DWZXlCZR.js";
 import { a as i } from "./dist-DHdUUM1w.js";
 import { t as a } from "./in-dialog-D61Yeaol.js";
-import { a as o, c as s, d as c, i as l, l as u, n as d, o as f, r as p, s as m, t as h, u as g } from "./use-return-focus-BC4sGh1b.js";
+import { a as o, c as s, d as c, i as l, l as u, n as d, o as f, r as p, s as m, t as h, u as g } from "./use-return-focus-Dl3XUhck.js";
 import { i as _ } from "./escape-owner-DpaP0lm1.js";
 import * as v from "react";
 import { Fragment as y, isValidElement as b } from "react";

package/dist/{async-slice-Bx438UlG.js → async-slice-BU95-2E-.js}

@@ -1,4 +1,4 @@
-import { l as e, r as t, s as n, u as r } from "./translator-gdpQeToI.js";
+import { l as e, r as t, s as n, u as r } from "./translator-DcF9o74-.js";
 import { t as i } from "./_baseIsEqual-C6ksIHya.js";
 import { useMemo as a } from "react";
 import { asyncThunkCreator as o, buildCreateSlice as s } from "@reduxjs/toolkit";

package/dist/{button-Z_xcg10A.js → button-BWrgbYzl.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { n as t, t as n } from "./dist-DVRQkaTK.js";
-import { n as r, t as i } from "./spinner-rk8J5y9O.js";
+import { n as r, t as i } from "./spinner-CJFQWd2O.js";
 import { t as a } from "./dist-DkQbkF9T.js";
 import { a as o, i as s, n as c, o as l, s as u, t as d } from "./use-click-lock-Bwg_caHO.js";
 import { t as f } from "./is-production-GLw59WU8.js";

package/dist/{calculator-BfIBMiFX.js → calculator-CSzocvaa.js}

@@ -1,8 +1,8 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { d as t, n, r, t as i } from "./tabs-nuYLggwC.js";
-import { t as a } from "./button-Z_xcg10A.js";
-import { t as o } from "./use-material-translation-BW5HZMwt.js";
-import { t as s } from "./icon-button-BG438okX.js";
+import { d as t, n, r, t as i } from "./tabs-D5YrKdgT.js";
+import { t as a } from "./button-BWrgbYzl.js";
+import { t as o } from "./use-material-translation-CvL9XRpG.js";
+import { t as s } from "./icon-button-Cn1iJKLh.js";
 import { t as c } from "./copy-to-clipboard-Be5Ffvs_.js";
 import { t as l } from "./useEvent-2fKq-6w8.js";
 import { t as u } from "./useLatest-C2PnQEeD.js";
@@ -11,7 +11,7 @@ import { t as f } from "./skeleton-DSdtr2qc.js";
 import { t as p } from "./live-status-BGPaN8r8.js";
 import { n as m, t as h } from "./calculator-context-BugcKuVG.js";
 import { a as g, c as _, i as v, l as y, n as b, o as ee, r as te, s as ne } from "./calculator-announce-DRd2c6Dq.js";
-import { i as re, t as ie } from "./pos-types-BFVWeJki.js";
+import { i as re, t as ie } from "./pos-types-D29gSY6o.js";
 import { a as ae, r as oe } from "./key-layout-cR79xfGE.js";
 import { n as x, r as se, t as ce } from "./programmer-word-CNCF7DJF.js";
 import { t as le } from "./standard-layout-BuSRr3TY.js";
@@ -279,11 +279,11 @@ function Le({ helpId: e }) {
 //#endregion
 //#region lib/components/ui/widgets/calculator/variants/variant-loader.ts
 var Re = {
-	scientific: () => import("./scientific-variant-BP08Mo0g.js"),
-	pos: () => import("./pos-variant-DWB8Bc12.js"),
-	programmer: () => import("./programmer-variant-B-wPnDeX.js"),
-	financial: () => import("./financial-variant-CTXTLbE_.js"),
-	conversion: () => import("./conversion-variant-Ciii9Rbh.js")
+	scientific: () => import("./scientific-variant-Df2INIYv.js"),
+	pos: () => import("./pos-variant-DqPKfqlj.js"),
+	programmer: () => import("./programmer-variant-eUfpdy1g.js"),
+	financial: () => import("./financial-variant-CIeXbVuZ.js"),
+	conversion: () => import("./conversion-variant-BQYmd3cd.js")
 }, B = "failed", V = /* @__PURE__ */ new Map(), H = /* @__PURE__ */ new Map(), U = /* @__PURE__ */ new Set(), W = () => {
 	for (let e of U) e();
 };

package/dist/calculator-field.js

@@ -1,11 +1,11 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { t } from "./button-Z_xcg10A.js";
-import { t as n } from "./use-material-translation-BW5HZMwt.js";
-import { t as r } from "./icon-button-BG438okX.js";
-import { a as i, i as a, n as o, r as s, t as c } from "./picker-surface-Cr2n42qv.js";
-import { r as l, t as u } from "./currency-field-DipsI0Bv.js";
+import { t } from "./button-BWrgbYzl.js";
+import { t as n } from "./use-material-translation-CvL9XRpG.js";
+import { t as r } from "./icon-button-Cn1iJKLh.js";
+import { a as i, i as a, n as o, r as s, t as c } from "./picker-surface-GsabnsXj.js";
+import { r as l, t as u } from "./currency-field-BT6V3B9k.js";
 import { r as d, t as f } from "./field-blur-DkiZOVNV.js";
-import { t as p } from "./calculator-BfIBMiFX.js";
+import { t as p } from "./calculator-CSzocvaa.js";
 import { useId as m, useState as h } from "react";
 import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
 import { Calculator as y } from "lucide-react";

package/dist/{calculator-segment-DQE1EFdw.js → calculator-segment-eqckz2Gh.js}

@@ -1,4 +1,4 @@
-import { t as e } from "./use-material-translation-BW5HZMwt.js";
+import { t as e } from "./use-material-translation-CvL9XRpG.js";
 import { jsx as t } from "react/jsx-runtime";
 //#region lib/components/ui/widgets/calculator/partials/calculator-segment.tsx
 function n({ label: n, choices: r, value: i, nameKey: a, onChange: o }) {

package/dist/calculator.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "./calculator-BfIBMiFX.js";
+import { n as e, t } from "./calculator-CSzocvaa.js";
 export { e as CALCULATOR_VARIANTS, t as Calculator };

package/dist/charts.js

@@ -1,12 +1,12 @@
 import { t as e } from "./ui.utils-CAnKTCw5.js";
 import { t } from "./utils-BLfntITJ.js";
 import { t as n } from "./warn-once-C_e47JM8.js";
-import { t as r } from "./button-Z_xcg10A.js";
-import { t as i } from "./use-material-translation-BW5HZMwt.js";
+import { t as r } from "./button-BWrgbYzl.js";
+import { t as i } from "./use-material-translation-CvL9XRpG.js";
 import { t as a } from "./use-ssr-media-query-C6M5m8sf.js";
 import { i as o, n as s, r as c, t as l } from "./util-4heV2LPI.js";
 import { t as u } from "./useIsomorphicLayoutEffect-DfgAhWcH.js";
-import { t as d } from "./chip-Bb9SM3Ly.js";
+import { t as d } from "./chip-CXHTVFNy.js";
 import { c as f, d as p, f as m, i as h, o as g, p as _, s as v, t as y } from "./line-path-C5pZGC49.js";
 import { t as b } from "./live-status-BGPaN8r8.js";
 import { t as x } from "./linear-G97mfnKF.js";

package/dist/{chip-Bb9SM3Ly.js → chip-CXHTVFNy.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { n as t } from "./spinner-rk8J5y9O.js";
+import { n as t } from "./spinner-CJFQWd2O.js";
 import { s as n } from "./use-click-lock-Bwg_caHO.js";
-import { t as r } from "./use-material-translation-BW5HZMwt.js";
+import { t as r } from "./use-material-translation-CvL9XRpG.js";
 import { t as i } from "./react-node-text-Crkpfpco.js";
 import { cloneElement as a, isValidElement as o } from "react";
 import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";

package/dist/{code-editor-Cw-dOrn2.js → code-editor-jL17cLkd.js}

@@ -1,12 +1,12 @@
 import { r as e } from "./rolldown-runtime-BFFgcFxR.js";
 import { t } from "./utils-BLfntITJ.js";
 import { t as n } from "./dist-DWZXlCZR.js";
-import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-BvtBDoSD.js";
+import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-BvCQYzou.js";
 import { a as c, i as l, n as u } from "./field-blur-context-BLGgf_3z.js";
-import { a as d, o as f, r as p, s as m, t as h } from "./toolbar-items-Bo-nMzKJ.js";
+import { a as d, o as f, r as p, s as m, t as h } from "./toolbar-items-DSVVI5_f.js";
 import { t as g } from "./is-production-GLw59WU8.js";
-import { t as _ } from "./use-material-translation-BW5HZMwt.js";
-import { i as v, n as y, o as b, t as x } from "./code-language-items-BVfxGKiv.js";
+import { t as _ } from "./use-material-translation-CvL9XRpG.js";
+import { i as v, n as y, o as b, t as x } from "./code-language-items-CefP9Ag7.js";
 import { t as S } from "./useIsomorphicLayoutEffect-DfgAhWcH.js";
 import { n as C, t as w } from "./escape-owner-DpaP0lm1.js";
 import { t as T } from "./skeleton-DSdtr2qc.js";

package/dist/code-editor.js

@@ -1,13 +1,13 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { t } from "./dist-DWZXlCZR.js";
-import { o as n, r, s as i, t as a } from "./toolbar-items-Bo-nMzKJ.js";
-import { t as o } from "./use-material-translation-BW5HZMwt.js";
-import { i as s, n as c, o as l } from "./code-language-items-BVfxGKiv.js";
+import { o as n, r, s as i, t as a } from "./toolbar-items-DSVVI5_f.js";
+import { t as o } from "./use-material-translation-CvL9XRpG.js";
+import { i as s, n as c, o as l } from "./code-language-items-CefP9Ag7.js";
 import { t as u } from "./skeleton-DSdtr2qc.js";
 import { t as d } from "./live-status-BGPaN8r8.js";
 import { t as f } from "./use-mobile-BDro060N.js";
 import { t as p } from "./react-node-text-Crkpfpco.js";
-import { a as m, c as h, d as g, f as _, i as v, l as y, m as b, o as x, p as S, r as C, s as w, t as T, u as E } from "./code-editor-Cw-dOrn2.js";
+import { a as m, c as h, d as g, f as _, i as v, l as y, m as b, o as x, p as S, r as C, s as w, t as T, u as E } from "./code-editor-jL17cLkd.js";
 import { r as D, t as O } from "./field-blur-DkiZOVNV.js";
 import { useEffect as k, useRef as A, useState as j } from "react";
 import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";

package/dist/{code-language-items-BVfxGKiv.js → code-language-items-CefP9Ag7.js}

@@ -1,5 +1,5 @@
-import { d as e, f as t } from "./dropdown-menu-BvtBDoSD.js";
-import { t as n } from "./use-material-translation-BW5HZMwt.js";
+import { d as e, f as t } from "./dropdown-menu-BvCQYzou.js";
+import { t as n } from "./use-material-translation-CvL9XRpG.js";
 import { t as r } from "./copy-to-clipboard-Be5Ffvs_.js";
 import { t as i } from "./live-status-BGPaN8r8.js";
 import { useEffect as a, useRef as o, useState as s } from "react";