@nxgt/material 3.53.0 → 3.54.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @nxgt/material
 
+## 3.54.0
+
+### Minor Changes
+
+- [#1909](https://github.com/softistx/nxgt-material/pull/1909) [`6ffea13`](https://github.com/softistx/nxgt-material/commit/6ffea13d8897bfa87dac21a49e2dc244d3d90c6e) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Dark theme: cards, popovers and dialogs now lift off the page ground. The dark `--card`, `--popover`, `--muted`, `--accent`, `--border` and `--input` are 0.03 of lightness higher (same hue and chroma; Lavande's card goes from `oklch(0.19 0.019 289.4)` to `oklch(0.22 0.019 289.4)`), in `theme-tokens.css`, every shipped theme stylesheet and the `defineTheme` generator; the sidebar keeps its former surface. A new `--card-edge` token (`var(--border)` in light, so light does not change; `color-mix(in oklab, white 8%, var(--card))` in dark, also `border-card-edge`) draws the edge of `Card`, `Popover` and `Dialog`, with a faint top highlight in dark. An app with a custom theme regenerates it to get the new values and the token; an app that overrides `--card` in dark keeps its colour.
+
+### Patch Changes
+
+- [#1905](https://github.com/softistx/nxgt-material/pull/1905) [`0855c07`](https://github.com/softistx/nxgt-material/commit/0855c07bac2aa042e61de09f03e4892954277469) Thanks [@SteveGT96](https://github.com/SteveGT96)! - docs(data-grid): the guide says a column's `cell` renders a node on read-only and computed columns, and that `meta.format` and the built-in editors replace it with text [#1905](https://github.com/softistx/nxgt-material/pull/1905)
+
+- [#1908](https://github.com/softistx/nxgt-material/pull/1908) [`976a84b`](https://github.com/softistx/nxgt-material/commit/976a84bba04d3ee44a26575a7387c2e0aaf89d38) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `DataGrid`: a number column whose `meta.number.decimals` is a function of the row now shows exactly that many fraction digits (a saved 2.50 reads `2,50`, not `2,5`), in the cell, the editor and a copy. `meta.format` receives the cell's row as `ctx.row` (absent for a total). `numberCodes` gains `fixed` to write exactly `decimals` fraction digits ([#1903](https://github.com/softistx/nxgt-material/issues/1903)).
+
+- [#1907](https://github.com/softistx/nxgt-material/pull/1907) [`32a5103`](https://github.com/softistx/nxgt-material/commit/32a5103570bab504bbc3d276420c8accd80eb3ca) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Switcher: the tooltip that shows the full title (clipped title, or `size="compact"`) is visual only; the trigger no longer gets an `aria-describedby` to it, so a screen reader no longer reads the title and subtitle twice.
+- Updated dependencies [[`6ffea13`](https://github.com/softistx/nxgt-material/commit/6ffea13d8897bfa87dac21a49e2dc244d3d90c6e), [`976a84b`](https://github.com/softistx/nxgt-material/commit/976a84bba04d3ee44a26575a7387c2e0aaf89d38)]:
+  - @nxgt/material-core@0.42.0
+
 ## 3.53.0
 
 ### Minor Changes

package/dist/components/theme-tokens.css

@@ -11,6 +11,9 @@
 	   keeps the flat look with `--ground: var(--background)`. */
 	--ground: color-mix(in oklab, var(--primary) 7%, var(--background));
 	--card: oklch(1 0 0);
+	/* The card's edge (Card, Popover, Dialog): the border in light; dark draws it a
+	   hairline lighter than the card. */
+	--card-edge: var(--border);
 	--card-foreground: oklch(0.227 0.017 290);
 	--strix: oklch(45.91% 0.1864 310.75);
 	--popover: oklch(1 0 0);
@@ -111,38 +114,39 @@
 		var(--primary) 6%,
 		color-mix(in oklab, var(--background) 55%, black)
 	);
-	--card: oklch(0.19 0.019 289.4);
+	--card: oklch(0.22 0.019 289.4);
+	--card-edge: color-mix(in oklab, white 8%, var(--card));
 	--card-foreground: oklch(0.943 0.012 291.3);
-	--popover: oklch(0.19 0.019 289.4);
+	--popover: oklch(0.22 0.019 289.4);
 	--popover-foreground: oklch(0.943 0.012 291.3);
 	--primary: oklch(46% 0.1135 276.35);
 	--primary-foreground: oklch(0.995 0.002 291.3);
 	/* Mixed 60 % toward white (the tonal Button labels' recipe): readable as text
 	   on --background and --card. */
 	--primary-text: color-mix(in oklab, var(--primary) 40%, white);
-	/* --primary itself is 2.7:1 on --background, 2.5:1 on --card and 2.3:1 on
-	   --muted. Mixed 25 % toward white: 4.8:1, 4.5:1 and 4.2:1. */
+	/* --primary itself is 2.7:1 on --background, 2.4:1 on --card and 2.1:1 on
+	   --muted. Mixed 25 % toward white: 4.8:1, 4.2:1 and 3.8:1. */
 	--primary-indicator: color-mix(in oklab, var(--primary) 75%, white);
 	/* Brighter than the light one: it is read as text on the dark surfaces (6.8:1
-	   on --background, 6.4:1 on --card; 5.1:1 on its own 15 % tonal tint over a
+	   on --background, 6.0:1 on --card; 4.8:1 on its own 15 % tonal tint over a
 	   Card). A filled secondary surface mixes it toward --background (the opaque
 	   70 % mix) to keep 5.4:1 under its near-white text (4.9:1 over a Card). */
 	--secondary: oklch(0.675 0.1135 245.65);
 	--secondary-foreground: oklch(0.995 0.002 291.3);
-	--muted: oklch(0.228 0.022 290);
+	--muted: oklch(0.258 0.022 290);
 	--muted-foreground: oklch(0.725 0.03 292.2);
-	/* 3.7:1 on --background, 3.5:1 on --card; the fill 3.3:1 on the track. */
+	/* 3.7:1 on --background, 3.3:1 on --card; the fill 3.3:1 on the track. */
 	--track: oklch(0.53 0.03 290);
 	--track-fill: oklch(0.85 0.09 276.35);
 	--tooltip: oklch(0.925 0.012 291.3);
 	--tooltip-foreground: oklch(0.446 0.043 291);
-	--accent: oklch(0.25 0.022 290);
+	--accent: oklch(0.28 0.022 290);
 	--accent-foreground: oklch(0.943 0.012 291.3);
 	--error: oklch(0.577 0.245 27.325);
 	--error-foreground: oklch(0.995 0.002 291.3);
 	/* --error stays the fill under near-white text; as text it would give only
 	   4.0:1 on --background and 3.8:1 on --card. Lightened (76 % --error), 6.25
-	   and 5.9:1, and 5.2:1 on a focused error menu item (bg-error/20 over the
+	   and 5.5:1, and 4.9:1 on a focused error menu item (bg-error/20 over the
 	   popover; the former 80 % missed 4.5:1 once rendered). */
 	--error-text: color-mix(in oklab, var(--error) 76%, white);
 	/* The light brights: on the dark surfaces they read as text and as the
@@ -152,15 +156,15 @@
 	--success-foreground: oklch(0.995 0.002 291.3);
 	--info: oklch(0.707 0.165 254.624);
 	--info-foreground: oklch(0.995 0.002 291.3);
-	/* Amber too, as text: 7.2:1 on --background and 6.7:1 on --card, 6.4:1 and
-	   5.9:1 on its 10% tint; the badge's 60% fill under near-white text is
-	   6.1:1 on a page and 5.8:1 on a Card. */
+	/* Amber too, as text: 7.2:1 on --background and 6.3:1 on --card, 6.4:1 and
+	   5.5:1 on its 10% tint; the badge's 60% fill under near-white text is
+	   6.1:1 on a page and 5.6:1 on a Card. */
 	--warning: oklch(0.7 0.15 70);
 	--warning-foreground: oklch(0.995 0.002 291.3);
 	--destructive: oklch(0.704 0.191 22.216);
-	--border: oklch(0.259 0.025 291.4);
-	--input: oklch(0.298 0.027 291.4);
-	/* 4.05:1 on --background, 3.80:1 on --card, 3.50:1 on --muted. */
+	--border: oklch(0.289 0.025 291.4);
+	--input: oklch(0.328 0.027 291.4);
+	/* 4.05:1 on --background, 3.57:1 on --card, 3.22:1 on --muted. */
 	--ring: oklch(0.551 0.03 290);
 	--chart-1: oklch(0.488 0.243 264.376);
 	--chart-2: oklch(0.696 0.17 162.48);

package/dist/components/ui/overlays/dialog/dialog.css

@@ -39,7 +39,8 @@
 		--dialog-bg: color-mix(in oklab, var(--primary) 18%, var(--card));
 		box-shadow:
 			var(--nxgt-elevation-3),
-			inset 0 0 0 1px rgb(255 255 255 / 0.07);
+			inset 0 0 0 1px var(--card-edge),
+			inset 0 1px 0 rgb(255 255 255 / 0.03);
 	}
 	.nxgt-dialog[data-state="open"] {
 		animation:

package/dist/components/ui/overlays/popover/popover.css

@@ -30,13 +30,14 @@
 		--popover-bg: var(--popover);
 		--popover-lift:
 			0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
-		border: 1px solid var(--border);
+		border: 1px solid var(--card-edge);
 		border-radius: var(--radius-md);
 	}
 	:where(.dark, [data-theme="dark"]) .nxgt-popover {
 		--popover-bg: color-mix(in oklab, var(--primary) 16%, var(--popover));
 		--popover-lift:
-			var(--nxgt-elevation-2), inset 0 0 0 1px rgb(255 255 255 / 0.07);
+			var(--nxgt-elevation-2), inset 0 0 0 1px var(--card-edge),
+			inset 0 1px 0 rgb(255 255 255 / 0.03);
 	}
 	:where(.dark, [data-theme="dark"]) .nxgt-popover[data-variant="tonal"] {
 		--popover-bg: color-mix(in oklab, var(--primary) 34%, var(--popover));