@nxgt/material 3.101.0 → 3.104.0

package/dist/code-editor.js

@@ -1,14 +1,14 @@
 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-IANZdcw4.js";
-import { t as o } from "./use-material-translation-CLNaMhUf.js";
-import { i as s, n as c, o as l } from "./code-language-items-CSZX5zxD.js";
+import { o as n, r, s as i, t as a } from "./toolbar-items-BDfoh8QB.js";
+import { t as o } from "./use-material-translation-xNzbSVgS.js";
+import { i as s, n as c, s as l } from "./code-language-items-Nq1iOGId.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-BByXZOGy.js";
-import { r as D, t as O } from "./field-blur-DkiZOVNV.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-CZg3nLZO.js";
+import { r as D, t as O } from "./field-blur-DMJwPLsg.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";
 import { getCspNonce as F } from "@nxgt/material-core/csp-nonce";

package/dist/{code-language-items-CSZX5zxD.js → code-language-items-Nq1iOGId.js}

@@ -1,5 +1,5 @@
-import { d as e, f as t } from "./dropdown-menu-FdGC5kIP.js";
-import { t as n } from "./use-material-translation-CLNaMhUf.js";
+import { d as e, f as t } from "./dropdown-menu-QMDbRidH.js";
+import { t as n } from "./use-material-translation-xNzbSVgS.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";
@@ -115,9 +115,18 @@ function p(e) {
 	let t = e.toLowerCase();
 	return d.find((e) => e.id === t || e.aliases?.includes(t))?.label ?? e;
 }
+var m = [
+	"text",
+	"plaintext",
+	"plain",
+	"txt"
+];
+function h(e) {
+	return e !== void 0 && m.includes(e.toLowerCase());
+}
 //#endregion
 //#region lib/components/ui/widgets/code-editor/toolbar/code-copy-status.tsx
-function m({ slot: e, status: t }) {
+function g({ slot: e, status: t }) {
 	let { t: r } = n();
 	return /* @__PURE__ */ c(i, {
 		slot: e,
@@ -126,7 +135,7 @@ function m({ slot: e, status: t }) {
 }
 //#endregion
 //#region lib/components/ui/widgets/code-editor/toolbar/code-language-items.tsx
-function h({ language: n, onChange: r }) {
+function _({ language: n, onChange: r }) {
 	return /* @__PURE__ */ c(e, {
 		value: n ? f(n) : "",
 		onValueChange: r,
@@ -137,4 +146,4 @@ function h({ language: n, onChange: r }) {
 	});
 }
 //#endregion
-export { f as a, p as i, m as n, u as o, d as r, h as t };
+export { h as a, p as i, g as n, f as o, d as r, u as s, _ as t };

package/dist/components/ui/actions/action-card/action-card-tile.css

@@ -133,6 +133,53 @@
 		align-self: start;
 	}
 
+	/* A tile with an action wraps instead of overflowing: a flex line holds the
+	 * icon, the title and the action; the title may shrink to --ac-title-min
+	 * (4.5rem), so an action that does not fit beside it (a StatusMenu chip in
+	 * a narrow tile) drops under the title, where an icon button still fits
+	 * beside it. The status, description, meta and footer are full-width lines.
+	 * No query, no measuring. */
+	.nxgt-action-card[data-size="tile"][data-has-action] {
+		--ac-icon-offset: 0px;
+		display: flex;
+		flex-wrap: wrap;
+		align-items: flex-start;
+		align-content: flex-start;
+	}
+	.nxgt-action-card[data-size="tile"][data-has-action][data-icon] {
+		--ac-icon-offset: 44px;
+	}
+	.nxgt-action-card[data-size="tile"][data-has-action]
+		> .nxgt-action-card-icon {
+		flex: none;
+	}
+	.nxgt-action-card[data-size="tile"][data-has-action] .nxgt-action-card-title {
+		order: 1;
+		flex: 1 1 var(--ac-title-min, 4.5rem);
+	}
+	.nxgt-action-card[data-size="tile"][data-has-action]
+		> .nxgt-action-card-action {
+		order: 2;
+		flex: none;
+		max-inline-size: 100%;
+	}
+	.nxgt-action-card[data-size="tile"][data-has-action]
+		> .nxgt-action-card-indicator {
+		order: 3;
+		flex: none;
+		margin-inline-start: auto;
+	}
+	.nxgt-action-card[data-size="tile"][data-has-action] .nxgt-action-card-status,
+	.nxgt-action-card[data-size="tile"][data-has-action]
+		.nxgt-action-card-description,
+	.nxgt-action-card[data-size="tile"][data-has-action] .nxgt-action-card-meta,
+	.nxgt-action-card[data-size="tile"][data-has-action]
+		.nxgt-action-card-footer {
+		order: 4;
+		flex: 0 0 calc(100% - var(--ac-icon-offset));
+		margin-inline-start: var(--ac-icon-offset);
+	}
+
 	@media (forced-colors: active) {
 		.nxgt-action-card:has(.nxgt-action-card-button:focus-visible) {
 			outline: 3px solid CanvasText;

package/dist/components/ui/display/chip/chip-soft.css

@@ -1,5 +1,5 @@
 /* Chip `tonal` and `filled`, "soft": no outline at all. A low tonal fill that reads as a
- * chip on any surface; selected = the library's primary tint, a hairline
+ * chip on any surface; selected = the library's primary tint (a toggle chip of a tone: the filled tone, last block), a hairline
  * ring in primary-text and a check (the ≥3:1 cue), the label unchanged. In
  * dark the tint is mixed from --primary-text, the light end of the primary,
  * 56 % at rest and 58 % on hover, and the label is white: in all 14 themes
@@ -91,7 +91,8 @@
  * (--nxgt-tone-text, 4.5:1 or more on it). It reads --nxgt-tint-status, not
  * --nxgt-tint-container: the container of a calm zone (calm.css) fades to
  * the surface through its flags, and a status chip keeps its tint there. Selected
- * keeps the primary tint and the foreground label above. */
+ * keeps the primary tint and the foreground label above, except a toggle chip of a
+ * tone (the last block). */
 @layer components {
 	.nxgt-chip[data-look="soft"]:not([data-tone="neutral"]) {
 		--chip-status-base: var(--nxgt-tone);
@@ -121,3 +122,27 @@
 		color: var(--nxgt-tone-text);
 	}
 }
+
+/* A coloured toggle chip, selected: the filled tone (--nxgt-tone) under the
+ * tone's on-colour (--nxgt-tone-on, 4.5:1 or more, light and dark), the ring
+ * in the on-colour so the edge holds on the page. The check stays the
+ * non-colour cue. A status chip (`active`, not a toggle) keeps the tint. */
+@layer components {
+	.nxgt-chip[data-look="soft"]:not([data-tone="neutral"])[data-selected]:is(
+		[aria-checked="true"],
+		[aria-pressed="true"]
+	) {
+		--chip-on: var(--nxgt-tone);
+		--chip-on-hover: color-mix(
+			in oklab,
+			var(--nxgt-tone-on) 10%,
+			var(--nxgt-tone)
+		);
+		--chip-on-ring: color-mix(
+			in oklab,
+			var(--nxgt-tone-on) 55%,
+			var(--nxgt-tone)
+		);
+		--chip-on-text: var(--nxgt-tone-on);
+	}
+}

package/dist/components/ui/display/code/code-moonlight.css

@@ -4,7 +4,7 @@
 [data-slot="code-block"][data-scheme="dark"] {
 	--code-bg: #222436;
 	--code-fg: #c8d3f5;
-	--code-comment: #7a88cf;
+	--code-comment: #8f9ad6;
 	--code-blue: #82aaff;
 	--code-cyan: #86e1fc;
 	--code-green: #c3e88d;
@@ -19,15 +19,15 @@
 [data-slot="code-block"][data-scheme="light"] {
 	--code-bg: #f5f7ff;
 	--code-fg: #383a51;
-	--code-comment: #7a88cf;
-	--code-blue: #3e68d7;
-	--code-cyan: #0b8ec2;
-	--code-green: #4db380;
-	--code-orange: #c44c22;
-	--code-yellow: #ac8300;
-	--code-red: #c53b40;
-	--code-magenta: #7a5af5;
-	--code-pink: #b04d9a;
+	--code-comment: #4356ba;
+	--code-blue: #2a56ca;
+	--code-cyan: #08658a;
+	--code-green: #2d6a4c;
+	--code-orange: #a33f1c;
+	--code-yellow: #765a00;
+	--code-red: #ac3337;
+	--code-magenta: #5d36f3;
+	--code-pink: #924080;
 	--code-selection: #d4daf0;
 }
 

package/dist/components/ui/primitives/collapsible/collapsible.css

@@ -73,6 +73,15 @@
 	.nxgt-collapsible-trigger[data-variant="tonal"][data-state="open"] {
 		border-radius: 0.75rem;
 	}
+	/* `flush` (text only): label at the left edge, the parent's font, so the
+	 * trigger can sit in a heading. */
+	.nxgt-collapsible-trigger[data-variant="text"][data-flush] {
+		min-height: 1.5rem;
+		padding: 0.25rem 0.25rem 0.25rem 0;
+		border-radius: 0.5rem;
+		font: inherit;
+		letter-spacing: inherit;
+	}
 	.nxgt-collapsible-trigger:hover:not(:disabled) {
 		background-color: color-mix(in oklab, var(--ct-fg) 8%, var(--ct-bg));
 	}