@nxgt/material 3.65.0 → 3.66.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @nxgt/material
 
+## 3.66.0
+
+### Minor Changes
+
+- [#2062](https://github.com/softistx/nxgt-material/pull/2062) [`6d1e6f6`](https://github.com/softistx/nxgt-material/commit/6d1e6f631b738f5e3c7539e2d54b73e36cbaa2e5) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `NumberField` and `NumberFormField`: the +/− buttons are named after their field ("Increase Guests", "Diminuer Invités"), through the new `material.number-field.increase-named` and `decrease-named` keys (en, fr), so a form with several number fields no longer gives a screen reader identical buttons ([#1928](https://github.com/softistx/nxgt-material/issues/1928)). The name is the plain-text `label`, else `aria-label`; a field with neither keeps "Increase" / "Decrease". A test that looks the buttons up by the exact name `Increase` now needs `/^Increase/` or the full name. The Vue twin is the `vue` issue [#2060](https://github.com/softistx/nxgt-material/issues/2060).
+
+- [#2078](https://github.com/softistx/nxgt-material/pull/2078) [`1c6ca26`](https://github.com/softistx/nxgt-material/commit/1c6ca2674d0cea09a3f728b041cae42d0c1f9ccd) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Add `SegmentedNav` and `SegmentedNavItem`, segmented route links: the segmented `ToggleGroup` look as a labelled `nav` of links, the current one marked `aria-current="page"` from `value` or `current` and drawn as the selected pill. Tab moves from link to link; on a phone the nav scrolls inside itself with an edge fade. The links render through React Router's `Link` or the `LinkComponentProvider`, with `preventScrollReset` on by default. The segmented and forced-colours `ToggleGroup` styles also follow `aria-current="page"`.
+
+- [#2070](https://github.com/softistx/nxgt-material/pull/2070) [`59a0cdc`](https://github.com/softistx/nxgt-material/commit/59a0cdc8642bdca240f3483f743e808a9d2a747b) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `ShareButton` (Buttons & actions) shares a link, text or title (`url`, `text`, `title`) through `navigator.share` when the browser has it (and `canShare` accepts the data), does nothing when the user closes the sheet (`AbortError`), and otherwise copies the link with `CopyButton`'s "Copied" / "Copy failed" announcement. The accessible name stays "Share" (`SHARE_BUTTON_LABEL`, or `label`) and `onShare` reports `'shared'`, `'cancelled'`, `'copied'` or `'failed'`. `navigator` is read on click, so it server-renders. New text `material.share.share`, in English and French. Additive; React only for now. Fixes [#1945](https://github.com/softistx/nxgt-material/issues/1945).
+
+- [#2073](https://github.com/softistx/nxgt-material/pull/2073) [`76c8eac`](https://github.com/softistx/nxgt-material/commit/76c8eac2c26fb38e47e43e317498b3c4a393b4d8) Thanks [@SteveGT96](https://github.com/SteveGT96)! - `StatCard` takes `href` (and `linkComponent`, like `LinkButton`; `LinkComponentProvider` applies too): the whole card becomes one link with a trailing chevron (a link without hover, on a phone), the card's hover border and focus-visible ring, named by its label and value ([#2072](https://github.com/softistx/nxgt-material/issues/2072)).
+
+- [#2078](https://github.com/softistx/nxgt-material/pull/2078) [`1c6ca26`](https://github.com/softistx/nxgt-material/commit/1c6ca2674d0cea09a3f728b041cae42d0c1f9ccd) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Add `useTabParam`, `skipTabChange` and `tabIds` for route tabs kept in the URL. `useTabParam({ values })` reads `values` as literal types and returns the current `value` (an unknown param falls back to the default) and `hrefFor(tab)`, a `to` for `TabsNavLink` / `SegmentedNavItem` that keeps the other params, drops the hash (`keepHash` keeps it, since `ScrollRestoration` jumps to a hash) and writes no param for the default tab (`explicitDefault` writes it out). `skipTabChange()` is a `shouldRevalidate` that skips the loaders when only the tab param changed. `tabIds(value, prefix = 'tab')` returns the stable `<prefix>-<value>` / `<prefix>-panel-<value>` ids for the tab and its panel, for tests; the prefix keeps two tab sets on one page apart.
+
+- [#2078](https://github.com/softistx/nxgt-material/pull/2078) [`1c6ca26`](https://github.com/softistx/nxgt-material/commit/1c6ca2674d0cea09a3f728b041cae42d0c1f9ccd) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Add `TabsNav` and `TabsNavLink`, route tabs as links: a labelled `nav` of links in the `Tabs` look (`underline` or `segmented`), the current one marked `aria-current="page"` from `value` or `current`, with the sliding indicator and the phone scroll cue. The links render through React Router's `Link` or the `LinkComponentProvider`, with `preventScrollReset` on by default. The current link stays marked in forced colours, links keep a 44px target on a coarse pointer, and inside an `ActivityLayout` with a `backdrop` the strip is a frosted band like `Tabs`.
+
+### Patch Changes
+
+- [#2067](https://github.com/softistx/nxgt-material/pull/2067) [`b60e637`](https://github.com/softistx/nxgt-material/commit/b60e637ce3d9b94e84b1de570281582443628309) Thanks [@SteveGT96](https://github.com/SteveGT96)! - Internal: the label hooks reuse `cleanObject` instead of six local copies ([#1941](https://github.com/softistx/nxgt-material/issues/1941)).
+
 ## 3.65.0
 
 ### Minor Changes

package/README.md

@@ -526,6 +526,8 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/primitives-scrollarea.webp" width="120" alt="ScrollArea"> | [`ScrollArea`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/primitives.md#scrollarea), `ScrollBar` | Scroll container with a thin custom scrollbar that matches the theme. | `ScrollArea`, `ScrollBar` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/primitives-table.webp" width="120" alt="Table"> | [`Table`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/primitives.md#table), `TableHeader`, `TableBody`, `TableFooter`, `TableRow`, `TableHead`, `TableCell`, `TableCaption`, `TableEmpty` | Styled semantic table inside a scrollable wrapper; `TableEmpty` is the full-width "nothing here" row. | `Table` (same parts) |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/primitives-tabs.webp" width="120" alt="Tabs"> | [`Tabs`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/primitives.md#tabs), `TabsList`, `TabsTrigger`, `TabsContent` | Tabs whose triggers can take an icon, in two looks: `underline` (the default) and the `segmented` pill. | `Tabs` (same parts) |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/primitives-tabsnav.webp" width="120" alt="TabsNav"> | [`TabsNav`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/primitives.md#tabsnav), `TabsNavLink`, `useTabParam`, `skipTabChange`, `tabIds` | Route tabs as links: a `nav` of links in the `Tabs` look, with `aria-current="page"` on the current one, the sliding indicator and the phone scroll cue; `useTabParam` keeps the tab in the URL. | no equivalent yet |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/primitives-segmentednav.webp" width="120" alt="SegmentedNav"> | [`SegmentedNav`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/primitives.md#segmentednav), `SegmentedNavItem` | Segmented links: the segmented `ToggleGroup` look as a `nav` of links, with `aria-current="page"` and the pill on the current one; it scrolls inside itself on a phone. | no equivalent yet |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/primitives-toggle.webp" width="120" alt="Toggle"> | [`Toggle`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/primitives.md#toggle) | Pressable on / off button: default or outlined, three sizes. | `Toggle` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/primitives-togglegroup.webp" width="120" alt="ToggleGroup"> | [`ToggleGroup`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/primitives.md#togglegroup), `ToggleGroupItem`, `ToggleGroupSeparator` | Toggle group in three looks: connected (pill morph), segmented (sliding pill), separate; sizes sm, md, lg; horizontal or vertical. | `ToggleGroup`, `ToggleGroupItem` |
 | — | [`Activity`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/primitives.md#activity) | React `<Activity>` switched by a boolean `visible`. | `Activity` |
@@ -546,6 +548,7 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/buttons-actions-responsivebutton.webp" width="120" alt="ResponsiveButton"> | [`ResponsiveButton`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/buttons-and-actions.md#responsivebutton) | Shows its label on desktop and collapses to icon-only on mobile, keeping the label for screen readers. | `ResponsiveButton` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/buttons-actions-linkbutton.webp" width="120" alt="LinkButton"> | [`LinkButton`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/buttons-and-actions.md#linkbutton), `IconLinkButton`, `ResponsiveLinkButton` | The button styles rendered as `react-router` links. | `LinkButton`, `IconLinkButton`, `ResponsiveLinkButton` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/buttons-actions-copybutton.webp" width="120" alt="CopyButton"> | [`CopyButton`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/buttons-and-actions.md#copybutton), `CopyValue` | Copies a value to the clipboard and briefly shows a check mark. `CopyValue` displays the value next to the button. | `CopyButton`, `CopyValue` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/buttons-actions-sharebutton.webp" width="120" alt="ShareButton"> | [`ShareButton`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/buttons-and-actions.md#sharebutton) | Opens the system share sheet (`navigator.share`) and copies the link where there is none. | not yet |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/buttons-actions-highlighttext.webp" width="120" alt="HighlightText"> | [`HighlightText`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/buttons-and-actions.md#highlighttext) | Marks case-insensitive matches of a query inside a string (`splitMatch`). | `HighlightText` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/buttons-actions-loadmorebutton.webp" width="120" alt="LoadMoreButton"> | [`LoadMoreButton`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/buttons-and-actions.md#loadmorebutton) | "Load more" button for cursor pagination; icon-only with a tooltip unless `expanded`. | `LoadMoreButton` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/buttons-actions-loadmorefooter.webp" width="120" alt="LoadMoreFooter"> | [`LoadMoreFooter`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/buttons-and-actions.md#loadmorefooter) | Footer of a paged list: shown-of-total line, load button, and a failed state with retry. | not yet |
@@ -639,7 +642,7 @@ Not components: what the stylesheet gives any element.
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-dayseparator.webp" width="120" alt="DaySeparator"> | [`DaySeparator`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#dayseparator), `isNewDay`, `formatDayLabel` | "Today", "Yesterday", the weekday or the date between two hairlines, in the provider's language; sticky if asked. | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-periodcards.webp" width="120" alt="PeriodCards"> | [`PeriodCards`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#periodcards) | Consecutive date ranges (terms, sprints) as cards: a "Current" marker with `aria-current`, a link over each card, as many 14rem columns as fit (one on a phone). | — |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-chip.webp" width="120" alt="Chip"> | [`Chip`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#chip) | Compact pill in three looks (hairline, soft, tag) and a dashed add pill, with leading, avatar and trailing slots, a selected state and a dismiss button; a coloured soft chip reads as a status (the tone's container, its text colour on it). | `Chip` |
-| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-statcard.webp" width="120" alt="StatCard"> | [`StatCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#statcard) | KPI tile with value, hint, icon, toned delta and a loading skeleton; `tone` and `variant` (`outlined`, `tonal`, `filled`) colour it, `valueSize` enlarges the value, `size="sm"` makes a compact tile (it ignores `hint`, `delta` and `valueSize`); `StatCardGroup` lays compact tiles 2×2 on a phone and in a row beside, holds its width in a flex row, and `align="end"` sets them against its end edge. | `StatCard` |
+| <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-statcard.webp" width="120" alt="StatCard"> | [`StatCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#statcard) | KPI tile with value, hint, icon, toned delta and a loading skeleton; `tone` and `variant` (`outlined`, `tonal`, `filled`) colour it, `valueSize` enlarges the value, `size="sm"` makes a compact tile (it ignores `hint`, `delta` and `valueSize`); `href` (and `linkComponent`) makes the whole card one link with a trailing chevron; `StatCardGroup` lays compact tiles 2×2 on a phone and in a row beside, holds its width in a flex row, and `align="end"` sets them against its end edge. | `StatCard` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-metric-cards.webp" width="120" alt="TrendCard"> | [`TrendCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#metric-cards), `GoalCard`, `BreakdownCard`, `RankCard`, `CompareCard`, `HeatweekCard`, `FunnelCard`, `GaugeCard`, `SparkbarCard`, `DeltaListCard`, `BandCard`, `LatencyCard`, `RatioCard`, `ThresholdCard`, `PaceCard`, `HistogramCard`, `Sparkline` | Dashboard tiles including compare, heat, funnel, gauge, spark bars, delta list, range band, latency, ratio, threshold, pace and labelled histogram. Container queries. A `tone` (named, or your app's) draws the accent in it; deltas and breaches stay semantic. | `TrendCard`, `GoalCard`, `BreakdownCard`, `RankCard`, `CompareCard`, `HeatweekCard`, `FunnelCard`, `GaugeCard`, `SparkbarCard`, `DeltaListCard`, `BandCard`, `LatencyCard`, `RatioCard`, `ThresholdCard`, `PaceCard`, `HistogramCard` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-card-presets.webp" width="120" alt="FeatureCard"> | [`FeatureCard`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#card-presets), `MediaCard`, `PricingCard`, `ProfileCard`, `QuoteCard`, `OverlayCard`, `SpotlightCard`, `CrewCard`, `SplitCard`, `TicketCard`, `NoticeCard`, `TimelineCard`, `MessageCard`, `EventCard`, `StackCard`, `LinkCard`, `AlbumCard`, `TagCard`, `ReceiptCard`, `ReviewCard`, `OfferCard`, `PlaceCard`, `FileCard`, `StatusCard`, `ScoreCard`, `ShortcutCard`, `ChecklistCard` | Card presets including overlay, ticket, inbox, event, stack, link, album, tags, receipt, review, offer, place, file, status, score, shortcuts and checklist. Container queries. | `FeatureCard`, `MediaCard`, `PricingCard`, `ProfileCard`, `QuoteCard`, `OverlayCard`, `SpotlightCard`, `CrewCard`, `SplitCard`, `TicketCard`, `NoticeCard`, `TimelineCard`, `MessageCard`, `EventCard`, `StackCard`, `LinkCard`, `AlbumCard`, `TagCard`, `ReceiptCard`, `ReviewCard`, `OfferCard`, `PlaceCard`, `FileCard`, `StatusCard`, `ScoreCard`, `ShortcutCard`, `ChecklistCard` |
 | <img src="https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/previews/data-display-statusindicator.webp" width="120" alt="StatusIndicator"> | [`StatusIndicator`](https://cdn.jsdelivr.net/npm/@nxgt/material@3/docs/components/data-display.md#statusindicator) | Coloured status dot with an optional pulse and label. | `StatusIndicator` |

package/dist/{alert-dialog-C0nGUSCP.js → alert-dialog-BgQDxcYh.js}

@@ -3,7 +3,7 @@ import { t } from "./utils-BLfntITJ.js";
 import { o as n } from "./dist-DVRQkaTK.js";
 import { c as r, s as i } from "./dist-lmHmz_bu.js";
 import { t as a } from "./in-dialog-Vwkyp-M5.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-BQ413TNG.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-KypnR7vv.js";
 import { i as _ } from "./escape-owner-DpaP0lm1.js";
 import * as v from "react";
 import { jsx as y, jsxs as b } from "react/jsx-runtime";

package/dist/{async-slice-CyansBvD.js → async-slice-BCZyWgGr.js}

@@ -1,4 +1,4 @@
-import { l as e, r as t, s as n, u as r } from "./translator-BJsjXcAp.js";
+import { l as e, r as t, s as n, u as r } from "./translator-ChpeKCO3.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";
@@ -72,8 +72,31 @@ function x(e) {
 	return /^(https?:)?\/\//.test(e) || e.startsWith("mailto:");
 }
 //#endregion
+//#region lib/lib/object.utils.ts
+function S(e, t) {
+	let n = {};
+	if (!Array.isArray(t)) n[t] = e?.[t];
+	else for (let r of t) n[r] = e?.[r];
+	return n;
+}
+function C(e, t) {
+	let n = { ...e };
+	if (Array.isArray(t)) for (let e of t) delete n?.[e];
+	else delete n?.[t];
+	return n ?? {};
+}
+function w(e) {
+	return e;
+}
+async function T(e) {
+	return await e;
+}
+function E(e, t = !1) {
+	return Object.fromEntries(Object.entries(e).filter(([e, n]) => t ? n != null && n !== void 0 : n !== void 0));
+}
+//#endregion
 //#region lib/lib/zod-error-map.ts
-var S = (e) => {
+var D = (e) => {
 	let t = typeof e;
 	switch (t) {
 		case "number": return Number.isNaN(e) ? "NaN" : "number";
@@ -83,7 +106,7 @@ var S = (e) => {
 			if (Object.getPrototypeOf(e) !== Object.prototype && e.constructor) return e.constructor.name;
 	}
 	return t;
-}, C = ({ storageKey: i = e, language: a, translate: o = t } = {}) => {
+}, O = ({ storageKey: i = e, language: a, translate: o = t } = {}) => {
 	let s = () => typeof a == "function" ? a() : a ?? n(i, "en", r);
 	return (e) => {
 		let t = s(), n = (e, n) => o(e, n, t), r = (e, t) => {
@@ -94,7 +117,7 @@ var S = (e) => {
 			case "invalid_type": {
 				let t = {
 					expected: e.expected,
-					received: S(e.input)
+					received: D(e.input)
 				};
 				return e.input ? r(`material.zod.invalid_type.${e.expected}`, t) ?? n("material.zod.invalid_type.default", t) : n("material.zod.required", t);
 			}
@@ -119,12 +142,12 @@ var S = (e) => {
 };
 //#endregion
 //#region ../../node_modules/redux/dist/redux.mjs
-function w(e) {
+function k(e) {
 	return `Minified Redux error #${e}; visit https://redux.js.org/Errors?code=${e} for the full message or use the non-minified dev environment for full errors. `;
 }
-var T = () => Math.random().toString(36).substring(7).split("").join(".");
-`${/* @__PURE__ */ T()}`, `${/* @__PURE__ */ T()}`;
-function E(e) {
+var A = () => Math.random().toString(36).substring(7).split("").join(".");
+`${/* @__PURE__ */ A()}`, `${/* @__PURE__ */ A()}`;
+function j(e) {
 	if (e === void 0) return "undefined";
 	if (e === null) return "null";
 	let t = typeof e;
@@ -136,9 +159,9 @@ function E(e) {
 		case "function": return t;
 	}
 	if (Array.isArray(e)) return "array";
-	if (k(e)) return "date";
-	if (O(e)) return "error";
-	let n = D(e);
+	if (P(e)) return "date";
+	if (N(e)) return "error";
+	let n = M(e);
 	switch (n) {
 		case "Symbol":
 		case "Promise":
@@ -149,42 +172,42 @@ function E(e) {
 	}
 	return Object.prototype.toString.call(e).slice(8, -1).toLowerCase().replace(/\s/g, "");
 }
-function D(e) {
+function M(e) {
 	return typeof e.constructor == "function" ? e.constructor.name : null;
 }
-function O(e) {
+function N(e) {
 	return e instanceof Error || typeof e.message == "string" && e.constructor && typeof e.constructor.stackTraceLimit == "number";
 }
-function k(e) {
+function P(e) {
 	return e instanceof Date || typeof e.toDateString == "function" && typeof e.getDate == "function" && typeof e.setDate == "function";
 }
-function A(e) {
+function F(e) {
 	let t = typeof e;
-	return process.env.NODE_ENV !== "production" && (t = E(e)), t;
+	return process.env.NODE_ENV !== "production" && (t = j(e)), t;
 }
-function j(e, t) {
+function I(e, t) {
 	return function(...n) {
 		return t(e.apply(this, n));
 	};
 }
-function M(e, t) {
-	if (typeof e == "function") return j(e, t);
-	if (typeof e != "object" || !e) throw Error(process.env.NODE_ENV === "production" ? w(16) : `bindActionCreators expected an object or a function, but instead received: '${A(e)}'. Did you write "import ActionCreators from" instead of "import * as ActionCreators from"?`);
+function L(e, t) {
+	if (typeof e == "function") return I(e, t);
+	if (typeof e != "object" || !e) throw Error(process.env.NODE_ENV === "production" ? k(16) : `bindActionCreators expected an object or a function, but instead received: '${F(e)}'. Did you write "import ActionCreators from" instead of "import * as ActionCreators from"?`);
 	let n = {};
 	for (let r in e) {
 		let i = e[r];
-		typeof i == "function" && (n[r] = j(i, t));
+		typeof i == "function" && (n[r] = I(i, t));
 	}
 	return n;
 }
 //#endregion
 //#region lib/lib/redux/use-actions.ts
-function N(e, t) {
+function R(e, t) {
 	let n = u();
-	return a(() => M(e, n), t ? [n, ...t] : [n]);
+	return a(() => L(e, n), t ? [n, ...t] : [n]);
 }
 //#endregion
 //#region lib/lib/redux/async-slice.ts
-var P = s({ creators: { asyncThunk: o } });
+var z = s({ creators: { asyncThunk: o } });
 //#endregion
-export { x as a, v as c, h as d, p as f, d as h, C as i, _ as l, f as m, N as n, b as o, g as p, S as r, y as s, P as t, m as u };
+export { p as _, w as a, d as b, C as c, b as d, y as f, h as g, m as h, O as i, S as l, _ as m, R as n, T as o, v as p, D as r, E as s, z as t, x as u, g as v, f as y };

package/dist/{background-qdnet2A5.js → background-D1gC4m2R.js}

@@ -2,7 +2,7 @@ import { r as e } from "./rolldown-runtime-BFFgcFxR.js";
 import { a as t, i as n, n as r, r as i } from "./icon-sprites-CaYXzOL4.js";
 import { t as a } from "./is-production-GLw59WU8.js";
 import { a as o, t as s } from "./theme-context-Cofk6vgs.js";
-import { t as c } from "./compose-refs-DZ0iIVF-.js";
+import { t as c } from "./compose-refs-G4J4kaUA.js";
 import { t as l } from "./use-background-activity-KxQgelFF.js";
 import { t as u } from "./scene-svg-DJKa5vsg.js";
 import { n as d, r as f, t as p } from "./scene-options-2zNF3ZkQ.js";

package/dist/backgrounds.js

@@ -1,3 +1,3 @@
-import { r as e, t } from "./background-qdnet2A5.js";
+import { r as e, t } from "./background-D1gC4m2R.js";
 import { BACKGROUND_INTENSITIES as n, BACKGROUND_PRESETS as r, BACKGROUND_TONES as i, MOTIF_SHAPES as a, MOTIF_SHAPES_ALL as o, SHIPPED_BACKGROUND_PRESETS as s } from "@nxgt/material-core/backgrounds";
 export { e as AVAILABLE_BACKGROUND_PRESETS, n as BACKGROUND_INTENSITIES, r as BACKGROUND_PRESETS, i as BACKGROUND_TONES, t as Background, a as MOTIF_SHAPES, o as MOTIF_SHAPES_ALL, s as SHIPPED_BACKGROUND_PRESETS };

package/dist/{button-D5k3K-gM.js → button-2de_lrix.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, r as i, t as a } from "./spinner-OQAweH2r.js";
+import { n as r, r as i, t as a } from "./spinner-PdSk7zEs.js";
 import { a as o, i as s, n as c, o as l, s as u, t as d } from "./use-click-lock-BZYtTmVt.js";
 import { t as f } from "./is-production-GLw59WU8.js";
 import { t as p } from "./button-group-context-CaP0X5p_.js";

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-D5k3K-gM.js";
-import { t as i } from "./use-material-translation-mY3U83TV.js";
+import { t as r } from "./button-2de_lrix.js";
+import { t as i } from "./use-material-translation-DkE9J5NE.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-lWXIJkqo.js";
+import { t as d } from "./chip-Cs0uEjpu.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-lWXIJkqo.js → chip-Cs0uEjpu.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./utils-BLfntITJ.js";
-import { r as t } from "./spinner-OQAweH2r.js";
+import { r as t } from "./spinner-PdSk7zEs.js";
 import { s as n } from "./use-click-lock-BZYtTmVt.js";
-import { t as r } from "./use-material-translation-mY3U83TV.js";
+import { t as r } from "./use-material-translation-DkE9J5NE.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-aXG4CdY-.js → code-editor-BYhBAfcc.js}

@@ -1,12 +1,12 @@
 import { r as e } from "./rolldown-runtime-BFFgcFxR.js";
 import { t } from "./utils-BLfntITJ.js";
 import { a as n } from "./dist-lmHmz_bu.js";
-import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-ChvAIQIW.js";
-import { a as c, i as l, n as u } from "./field-blur-context-C8BX8IBy.js";
-import { a as d, d as f, r as p, t as m, u as h } from "./toolbar-items-CQ3S_XZw.js";
+import { c as r, d as i, f as a, n as o, t as s } from "./dropdown-menu-DdzyvN76.js";
+import { a as c, i as l, n as u } from "./field-blur-context-BZtwcPUV.js";
+import { a as d, d as f, r as p, t as m, u as h } from "./toolbar-items-BmNYNaRB.js";
 import { t as g } from "./is-production-GLw59WU8.js";
-import { t as _ } from "./use-material-translation-mY3U83TV.js";
-import { i as v, n as y, o as b, t as x } from "./code-language-items-CsaXyApg.js";
+import { t as _ } from "./use-material-translation-DkE9J5NE.js";
+import { i as v, n as y, o as b, t as x } from "./code-language-items-xhmbF6wA.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,14 +1,14 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { a as t } from "./dist-lmHmz_bu.js";
-import { d as n, r, t as i, u as a } from "./toolbar-items-CQ3S_XZw.js";
-import { t as o } from "./use-material-translation-mY3U83TV.js";
-import { i as s, n as c, o as l } from "./code-language-items-CsaXyApg.js";
-import { r as u, t as d } from "./field-blur-CV9orzdJ.js";
+import { d as n, r, t as i, u as a } from "./toolbar-items-BmNYNaRB.js";
+import { t as o } from "./use-material-translation-DkE9J5NE.js";
+import { i as s, n as c, o as l } from "./code-language-items-xhmbF6wA.js";
+import { r as u, t as d } from "./field-blur-B2y-bNYi.js";
 import { t as f } from "./skeleton-DSdtr2qc.js";
 import { t as p } from "./live-status-BGPaN8r8.js";
 import { t as m } from "./use-mobile-BDro060N.js";
 import { t as h } from "./react-node-text-Crkpfpco.js";
-import { a as g, c as _, d as v, f as y, i as b, l as x, m as S, o as C, p as w, r as T, s as E, t as D, u as O } from "./code-editor-aXG4CdY-.js";
+import { a as g, c as _, d as v, f as y, i as b, l as x, m as S, o as C, p as w, r as T, s as E, t as D, u as O } from "./code-editor-BYhBAfcc.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-CsaXyApg.js → code-language-items-xhmbF6wA.js}

@@ -1,5 +1,5 @@
-import { d as e, f as t } from "./dropdown-menu-ChvAIQIW.js";
-import { t as n } from "./use-material-translation-mY3U83TV.js";
+import { d as e, f as t } from "./dropdown-menu-DdzyvN76.js";
+import { t as n } from "./use-material-translation-DkE9J5NE.js";
 import { t as r } from "./live-status-BGPaN8r8.js";
 import { useEffect as i, useRef as a, useState as o } from "react";
 import { jsx as s } from "react/jsx-runtime";

package/dist/components/components.css

@@ -122,6 +122,8 @@
 @import "./ui/primitives/accordion/accordion.css";
 @import "./ui/primitives/accordion/accordion-surfaces.css";
 @import "./ui/primitives/collapsible/collapsible.css";
+/* TabsNav in forced colours (the current link's mark). */
+@import "./ui/primitives/tabs/tabs-nav-forced.css";
 /* ToggleGroup: shared rules, then one file per variant. */
 @import "./ui/primitives/toggle-group/toggle-group.css";
 @import "./ui/primitives/toggle-group/toggle-group-connected.css";

package/dist/components/ui/layout/app-shell/activity-backdrop.css

@@ -149,9 +149,10 @@
 		backdrop-filter: blur(var(--nxgt-backdrop-blur));
 	}
 
-	/* Tabs: the strip is a band, its top corners rounded. (The segmented look
-	 * has its own track.) */
-	[data-slot="activity-layout"][data-backdrop] [data-slot="tabs-list"] {
+	/* Tabs and route tabs (`TabsNav`): the strip is a band, its top corners
+	 * rounded. (The segmented look has its own track.) */
+	[data-slot="activity-layout"][data-backdrop]
+	:is([data-slot="tabs-list"], [data-slot="tabs-nav"]) {
 		border-start-start-radius: var(--radius);
 		border-start-end-radius: var(--radius);
 		background: var(--nxgt-backdrop-fill-nav);

package/dist/components/ui/primitives/tabs/tabs-nav-forced.css

@@ -0,0 +1,27 @@
+/* The indicator hides when no link is current (a `value` that matches none). */
+[data-slot="tabs-nav"]:not(:has([data-state="active"]))
+> [data-slot="tabs-indicator"] {
+	visibility: hidden;
+}
+
+/* TabsNav in forced colours: the current link keeps a mark. The indicator and
+ * the active link's ::after are backgrounds and borders, which the browser
+ * flattens; they are painted again with the system Highlight. React only
+ * (tabs-classes.ts is shared with Vue, so this is not a class there). */
+@media (forced-colors: active) {
+	[data-slot="tabs-nav"][data-variant="underline"]
+		> [data-slot="tabs-indicator"],
+	[data-slot="tabs-nav"][data-variant="underline"]
+		[data-slot="tabs-trigger"][aria-current="page"]::after {
+		forced-color-adjust: none;
+		background: Highlight;
+	}
+	[data-slot="tabs-nav"][data-variant="segmented"]
+		> [data-slot="tabs-indicator"],
+	[data-slot="tabs-nav"][data-variant="segmented"]
+		[data-slot="tabs-trigger"][aria-current="page"]::after {
+		forced-color-adjust: none;
+		border: 2px solid Highlight;
+		background: Canvas;
+	}
+}

package/dist/components/ui/primitives/toggle-group/toggle-group-segmented.css

@@ -61,7 +61,8 @@
 		> .nxgt-toggle-group-item:hover:not(
 			:disabled,
 			[aria-checked="true"],
-			[aria-pressed="true"]
+			[aria-pressed="true"],
+			[aria-current="page"]
 		) {
 		background: var(--tg-seg-hover);
 	}
@@ -78,7 +79,11 @@
 	 * every chosen state is primary). Forced colours: the pill is hidden and
 	 * the SelectedItem rule in toggle-group.css wins (its layer-less rule). */
 	[data-variant="segmented"]
-	> .nxgt-toggle-group-item:is([aria-checked="true"], [aria-pressed="true"]) {
+	> .nxgt-toggle-group-item:is(
+		[aria-checked="true"],
+		[aria-pressed="true"],
+		[aria-current="page"]
+	) {
 		color: var(--primary-text);
 	}
 
@@ -135,6 +140,9 @@
 	/* Multiple: a pill per pressed item; touching pills join. Also a single
 	 * group of 9 or more items, which has no sliding pill. */
 	[data-variant="segmented"] > .nxgt-toggle-group-item[aria-pressed="true"],
+	/* SegmentedNav: a scrolling track has no sliding pill, the current link
+	 * paints its own. */
+	[data-variant="segmented"] > .nxgt-toggle-group-item[aria-current="page"],
 	[data-variant="segmented"]:has(> .nxgt-toggle-group-item:nth-of-type(9))
 		> .nxgt-toggle-group-item[aria-checked="true"] {
 		background: var(--tg-pill);

package/dist/components/ui/primitives/toggle-group/toggle-group.css

@@ -127,7 +127,11 @@
 	.nxgt-toggle-group-item {
 		border: 1px solid ButtonText;
 	}
-	.nxgt-toggle-group-item:is([aria-checked="true"], [aria-pressed="true"]) {
+	.nxgt-toggle-group-item:is(
+		[aria-checked="true"],
+		[aria-pressed="true"],
+		[aria-current="page"]
+	) {
 		forced-color-adjust: none;
 		background: SelectedItem;
 		color: SelectedItemText;