@nxgt/material 3.77.0 → 3.79.0

package/dist/{tabs-BT9pSRwk.js → tabs-KGKvve3y.js}

@@ -34,7 +34,7 @@ var ae = Object.defineProperty, x = (e, t) => ae(e, "name", {
 			ref: t
 		})
 	});
-}, "Tabs")), ue = "TabsList", T = /* @__PURE__ */ p.forwardRef(/* @__PURE__ */ x(function(e, t) {
+}, "Tabs")), ue = "TabsList", de = /* @__PURE__ */ p.forwardRef(/* @__PURE__ */ x(function(e, t) {
 	let { __scopeTabs: r, loop: i = !0, ...a } = e, o = w(ue, r);
 	return /* @__PURE__ */ y(l, {
 		asChild: !0,
@@ -49,8 +49,8 @@ var ae = Object.defineProperty, x = (e, t) => ae(e, "name", {
 			ref: t
 		})
 	});
-}, "TabsList")), E = "TabsTrigger", D = /* @__PURE__ */ p.forwardRef(/* @__PURE__ */ x(function(e, t) {
-	let { __scopeTabs: i, value: a, disabled: o = !1, ...s } = e, c = w(E, i), l = C(i), u = k(c.baseId, a), f = A(c.baseId, a), p = a === c.value;
+}, "TabsList")), T = "TabsTrigger", E = /* @__PURE__ */ p.forwardRef(/* @__PURE__ */ x(function(e, t) {
+	let { __scopeTabs: i, value: a, disabled: o = !1, ...s } = e, c = w(T, i), l = C(i), u = D(c.baseId, a), f = O(c.baseId, a), p = a === c.value;
 	return /* @__PURE__ */ y(d, {
 		asChild: !0,
 		...l,
@@ -79,8 +79,8 @@ var ae = Object.defineProperty, x = (e, t) => ae(e, "name", {
 			})
 		})
 	});
-}, "TabsTrigger")), O = "TabsContent", de = /* @__PURE__ */ p.forwardRef(/* @__PURE__ */ x(function(e, t) {
-	let { __scopeTabs: r, value: i, forceMount: a, children: s, ...c } = e, l = w(O, r), u = k(l.baseId, i), d = A(l.baseId, i), f = i === l.value, m = p.useRef(f);
+}, "TabsTrigger")), fe = "TabsContent", pe = /* @__PURE__ */ p.forwardRef(/* @__PURE__ */ x(function(e, t) {
+	let { __scopeTabs: r, value: i, forceMount: a, children: s, ...c } = e, l = w(fe, r), u = D(l.baseId, i), d = O(l.baseId, i), f = i === l.value, m = p.useRef(f);
 	return p.useEffect(() => {
 		let e = requestAnimationFrame(() => m.current = !1);
 		return () => cancelAnimationFrame(e);
@@ -104,55 +104,68 @@ var ae = Object.defineProperty, x = (e, t) => ae(e, "name", {
 		})
 	});
 }, "TabsContent"));
-function k(e, t) {
+function D(e, t) {
 	return `${e}-trigger-${t}`;
 }
-x(k, "makeTriggerId");
-function A(e, t) {
+x(D, "makeTriggerId");
+function O(e, t) {
 	return `${e}-content-${t}`;
 }
-x(A, "makeContentId");
-var fe = le, pe = T, me = D, he = de;
+x(O, "makeContentId");
+var me = le, he = de, ge = E, _e = pe;
 //#endregion
 //#region lib/components/ui/primitives/tabs/tabs-classes.ts
-function j(e) {
+function k(e) {
 	return e === "segmented" || e === "line" ? "segmented" : "underline";
 }
-var M = "aria-[orientation=vertical]:flex-col", ge = {
+var A = "aria-[orientation=vertical]:flex-col", ve = {
 	underline: "flex min-w-0 flex-col gap-2 items-stretch data-[orientation=vertical]:flex-row",
 	segmented: "flex min-w-0 flex-col gap-2 items-start data-[orientation=vertical]:flex-row"
-}, N = {
-	underline: `group/tabs-list relative flex gap-1 border-b border-border overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden ${M} aria-[orientation=vertical]:border-b-0 aria-[orientation=vertical]:border-l aria-[orientation=vertical]:overflow-x-visible aria-[orientation=vertical]:overflow-y-auto`,
-	segmented: `group/tabs-list relative inline-flex max-w-full rounded-full bg-muted p-1 overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden ${M} aria-[orientation=vertical]:rounded-3xl aria-[orientation=vertical]:overflow-x-visible aria-[orientation=vertical]:overflow-y-auto`
-}, P = "relative inline-flex shrink-0 cursor-pointer select-none items-center justify-center gap-2 whitespace-nowrap text-sm font-medium text-muted-foreground transition-colors disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4 focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-primary dark:focus-visible:outline-track-fill", F = "group-data-[indicator=ready]/tabs-list:after:hidden", I = {
-	underline: `${P} h-10 px-4 rounded-t-md hover:bg-primary/5 data-[state=inactive]:hover:text-foreground data-[state=active]:text-primary-text data-[orientation=vertical]:justify-start data-[orientation=vertical]:rounded-t-none data-[orientation=vertical]:rounded-r-md after:pointer-events-none after:absolute after:inset-x-0 after:bottom-0 after:h-0.5 after:rounded-full data-[state=active]:after:bg-primary dark:data-[state=active]:after:bg-track-fill data-[orientation=vertical]:after:inset-x-auto data-[orientation=vertical]:after:left-0 data-[orientation=vertical]:after:inset-y-0 data-[orientation=vertical]:after:h-auto data-[orientation=vertical]:after:w-0.5 ${F}`,
-	segmented: `${P} z-10 h-8 px-4 rounded-full data-[state=inactive]:hover:text-foreground data-[state=active]:text-foreground data-[state=active]:font-semibold after:pointer-events-none after:absolute after:inset-0 after:-z-10 after:rounded-full data-[state=active]:after:bg-background data-[state=active]:after:shadow-sm data-[state=active]:after:border data-[state=active]:after:border-muted-foreground dark:data-[state=active]:after:bg-card ${F}`
-}, L = "pointer-events-none absolute left-0 invisible group-data-[indicator=ready]/tabs-list:visible group-data-[indicator=ready]/tabs-list:motion-safe:transition-[translate,width,height] duration-300 ease-out", _e = {
-	underline: `${L} bottom-0 h-0.5 rounded-full bg-primary dark:bg-track-fill w-(--tabs-indicator-w) translate-x-(--tabs-indicator-x) group-aria-[orientation=vertical]/tabs-list:bottom-auto group-aria-[orientation=vertical]/tabs-list:top-0 group-aria-[orientation=vertical]/tabs-list:w-0.5 group-aria-[orientation=vertical]/tabs-list:h-(--tabs-indicator-w) group-aria-[orientation=vertical]/tabs-list:translate-x-0 group-aria-[orientation=vertical]/tabs-list:translate-y-(--tabs-indicator-x)`,
-	segmented: `${L} inset-y-1 rounded-full bg-background shadow-sm border border-muted-foreground dark:bg-card w-(--tabs-indicator-w) translate-x-(--tabs-indicator-x) group-aria-[orientation=vertical]/tabs-list:inset-y-auto group-aria-[orientation=vertical]/tabs-list:inset-x-1 group-aria-[orientation=vertical]/tabs-list:top-0 group-aria-[orientation=vertical]/tabs-list:w-auto group-aria-[orientation=vertical]/tabs-list:h-(--tabs-indicator-w) group-aria-[orientation=vertical]/tabs-list:translate-x-0 group-aria-[orientation=vertical]/tabs-list:translate-y-(--tabs-indicator-x)`
-}, ve = "inline-flex items-center gap-2", R = "flex justify-center", ye = "w-full flex-1 outline-none";
+}, j = {
+	underline: `group/tabs-list relative flex gap-1 border-b border-border overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden ${A} aria-[orientation=vertical]:border-b-0 aria-[orientation=vertical]:border-l aria-[orientation=vertical]:overflow-x-visible aria-[orientation=vertical]:overflow-y-auto`,
+	segmented: `group/tabs-list relative inline-flex max-w-full rounded-full bg-muted p-1 overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden ${A} aria-[orientation=vertical]:rounded-3xl aria-[orientation=vertical]:overflow-x-visible aria-[orientation=vertical]:overflow-y-auto`
+}, M = "relative inline-flex shrink-0 cursor-pointer select-none items-center justify-center gap-2 whitespace-nowrap text-sm font-medium text-muted-foreground transition-colors disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4 focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-primary dark:focus-visible:outline-track-fill", N = "group-data-[indicator=ready]/tabs-list:after:hidden", P = {
+	underline: `${M} h-10 px-4 rounded-t-md hover:bg-primary/5 data-[state=inactive]:hover:text-foreground data-[state=active]:text-primary-text data-[orientation=vertical]:justify-start data-[orientation=vertical]:rounded-t-none data-[orientation=vertical]:rounded-r-md after:pointer-events-none after:absolute after:inset-x-0 after:bottom-0 after:h-0.5 after:rounded-full data-[state=active]:after:bg-primary dark:data-[state=active]:after:bg-track-fill data-[orientation=vertical]:after:inset-x-auto data-[orientation=vertical]:after:left-0 data-[orientation=vertical]:after:inset-y-0 data-[orientation=vertical]:after:h-auto data-[orientation=vertical]:after:w-0.5 ${N}`,
+	segmented: `${M} z-10 h-8 px-4 rounded-full data-[state=inactive]:hover:text-foreground data-[state=active]:text-foreground data-[state=active]:font-semibold after:pointer-events-none after:absolute after:inset-0 after:-z-10 after:rounded-full data-[state=active]:after:bg-background data-[state=active]:after:shadow-sm data-[state=active]:after:border data-[state=active]:after:border-muted-foreground dark:data-[state=active]:after:bg-card ${N}`
+}, F = "pointer-events-none absolute left-0 invisible group-data-[indicator=ready]/tabs-list:visible group-data-[indicator=ready]/tabs-list:motion-safe:transition-[translate,width,height] duration-300 ease-out", ye = {
+	underline: `${F} bottom-0 h-0.5 rounded-full bg-primary dark:bg-track-fill w-(--tabs-indicator-w) translate-x-(--tabs-indicator-x) group-aria-[orientation=vertical]/tabs-list:bottom-auto group-aria-[orientation=vertical]/tabs-list:top-0 group-aria-[orientation=vertical]/tabs-list:w-0.5 group-aria-[orientation=vertical]/tabs-list:h-(--tabs-indicator-w) group-aria-[orientation=vertical]/tabs-list:translate-x-0 group-aria-[orientation=vertical]/tabs-list:translate-y-(--tabs-indicator-x)`,
+	segmented: `${F} inset-y-1 rounded-full bg-background shadow-sm border border-muted-foreground dark:bg-card w-(--tabs-indicator-w) translate-x-(--tabs-indicator-x) group-aria-[orientation=vertical]/tabs-list:inset-y-auto group-aria-[orientation=vertical]/tabs-list:inset-x-1 group-aria-[orientation=vertical]/tabs-list:top-0 group-aria-[orientation=vertical]/tabs-list:w-auto group-aria-[orientation=vertical]/tabs-list:h-(--tabs-indicator-w) group-aria-[orientation=vertical]/tabs-list:translate-x-0 group-aria-[orientation=vertical]/tabs-list:translate-y-(--tabs-indicator-x)`
+}, be = "inline-flex items-center gap-2", xe = "flex justify-center", Se = "w-full flex-1 outline-none";
 //#endregion
 //#region lib/components/ui/primitives/tabs/partials/tabs-content.tsx
-function be({ className: t, ...n }) {
-	return /* @__PURE__ */ y(he, {
+function Ce({ className: t, ...n }) {
+	return /* @__PURE__ */ y(_e, {
 		"data-slot": "tabs-content",
-		className: e(ye, t),
+		className: e(Se, t),
 		...n
 	});
 }
 //#endregion
 //#region lib/components/ui/primitives/tabs/tabs-overflow-classes.ts
-var z = "[--tabs-cue:2rem] pointer-coarse:[--tabs-cue:3rem] data-[overflow-left]:[--tabs-inset-left:var(--tabs-cue)] data-[overflow-left]:[--tabs-fade-left:calc(var(--tabs-cue)_+_1rem)] data-[overflow-right]:[--tabs-inset-right:var(--tabs-cue)] data-[overflow-right]:[--tabs-fade-right:calc(var(--tabs-cue)_+_1rem)] data-[overflow-left]:[mask-image:linear-gradient(to_right,transparent_var(--tabs-inset-left,0px),#000_var(--tabs-fade-left,0px),#000_calc(100%_-_var(--tabs-fade-right,0px)),transparent_calc(100%_-_var(--tabs-inset-right,0px)))] data-[overflow-right]:[mask-image:linear-gradient(to_right,transparent_var(--tabs-inset-left,0px),#000_var(--tabs-fade-left,0px),#000_calc(100%_-_var(--tabs-fade-right,0px)),transparent_calc(100%_-_var(--tabs-inset-right,0px)))]", xe = "pointer-events-none absolute z-20 overflow-hidden", B = "pointer-events-auto absolute top-1/2 inline-flex size-7 -translate-y-1/2 cursor-pointer items-center justify-center rounded-full border border-border bg-background text-foreground shadow-sm transition-colors hover:bg-muted pointer-coarse:h-full pointer-coarse:max-h-11 pointer-coarse:w-11 focus-visible:outline-2 focus-visible:outline-offset-[-3px] focus-visible:outline-primary dark:focus-visible:outline-track-fill [&_svg]:size-4", Se = `${B} left-1`, Ce = `${B} right-1`, V = m("underline");
-function H() {
-	return g(V);
+var I = "[--tabs-cue:2rem] pointer-coarse:[--tabs-cue:3rem] data-[overflow-left]:[--tabs-inset-left:var(--tabs-cue)] data-[overflow-right]:[--tabs-inset-right:var(--tabs-cue)] data-[overflow-left]:[mask-image:linear-gradient(to_right,transparent_var(--tabs-inset-left,0px),#000_var(--tabs-inset-left,0px),#000_calc(100%_-_var(--tabs-inset-right,0px)),transparent_calc(100%_-_var(--tabs-inset-right,0px)))] data-[overflow-right]:[mask-image:linear-gradient(to_right,transparent_var(--tabs-inset-left,0px),#000_var(--tabs-inset-left,0px),#000_calc(100%_-_var(--tabs-inset-right,0px)),transparent_calc(100%_-_var(--tabs-inset-right,0px)))] [&_[data-clipped]]:opacity-0", we = "pointer-events-none absolute z-20 overflow-hidden", L = "pointer-events-auto absolute top-1/2 inline-flex size-7 -translate-y-1/2 cursor-pointer items-center justify-center rounded-full border border-border bg-background text-foreground shadow-sm transition-colors hover:bg-muted pointer-coarse:h-full pointer-coarse:max-h-11 pointer-coarse:w-11 focus-visible:outline-2 focus-visible:outline-offset-[-3px] focus-visible:outline-primary dark:focus-visible:outline-track-fill [&_svg]:size-4", Te = `${L} left-1`, Ee = `${L} right-1`, R = m("underline");
+function z() {
+	return g(R);
+}
+//#endregion
+//#region lib/components/ui/primitives/tabs/tabs-clipped.ts
+function B(e) {
+	let t = getComputedStyle(e).getPropertyValue("--tabs-cue").trim(), n = Number.parseFloat(t);
+	return Number.isFinite(n) ? t.endsWith("rem") ? n * Number.parseFloat(getComputedStyle(document.documentElement).fontSize) : n : 0;
+}
+function V(e, t, n, r) {
+	let i = e.getBoundingClientRect(), a = B(e), o = i.left + (n ? a : 0), s = i.right - (r ? a : 0);
+	for (let a of e.querySelectorAll(t.tab)) {
+		let e = a.getBoundingClientRect(), c = n && e.left < o - 1 && e.right > i.left || r && e.right > s + 1 && e.left < i.right, l = a.matches(t.active) || a === document.activeElement, u = c && !l;
+		u !== a.hasAttribute("data-clipped") && a.toggleAttribute("data-clipped", u);
+	}
 }
 //#endregion
 //#region lib/components/ui/primitives/tabs/tabs-manual-scroll.ts
-var U = "tabs-manual-scroll";
-function we(e) {
-	e.dispatchEvent(new Event(U));
+var H = "tabs-manual-scroll";
+function De(e) {
+	e.dispatchEvent(new Event(H));
 }
-function Te(e, t) {
+function Oe(e, t) {
 	let n = 0, r = 0, i = "", a = () => `${e.clientWidth}/${e.scrollWidth}`, o = { follow: !0 }, s = () => {
 		o.follow = !1;
 	}, c = (e) => {
@@ -160,67 +173,65 @@ function Te(e, t) {
 	}, l = () => {
 		a() === i && (e.scrollLeft < n - 1 || e.scrollLeft > r + 1) && s();
 	};
-	return i = a(), e.addEventListener("wheel", c, { passive: !0 }), e.addEventListener("scroll", l, { passive: !0 }), e.addEventListener(U, s), {
+	return i = a(), e.addEventListener("wheel", c, { passive: !0 }), e.addEventListener("scroll", l, { passive: !0 }), e.addEventListener(H, s), {
 		state: o,
 		reveal(o, s) {
 			let c = e.scrollLeft, l = t(e, o, s);
 			n = Math.min(c, c + l), r = Math.max(c, c + l), i = a();
 		},
 		dispose() {
-			e.removeEventListener("wheel", c), e.removeEventListener("scroll", l), e.removeEventListener(U, s);
+			e.removeEventListener("wheel", c), e.removeEventListener("scroll", l), e.removeEventListener(H, s);
 		}
 	};
 }
 //#endregion
-//#region lib/components/ui/primitives/tabs/tabs-selectors.ts
-var W = "[role=\"tab\"], [data-slot=\"tabs-trigger\"]", G = "[role=\"tab\"][data-state=\"active\"], [data-slot=\"tabs-trigger\"][data-state=\"active\"]", K = 64, q = {
+//#region lib/components/ui/primitives/tabs/tabs-overflow-state.ts
+var U = {
 	left: !1,
 	right: !1,
 	top: 0,
 	x: 0,
 	width: 0,
 	height: 0
+}, W = (e, t) => e.left === t.left && e.right === t.right && e.top === t.top && e.x === t.x && e.width === t.width && e.height === t.height, G = "[role=\"tab\"], [data-slot=\"tabs-trigger\"]", K = "[role=\"tab\"][data-state=\"active\"], [data-slot=\"tabs-trigger\"][data-state=\"active\"]", q = 64, J = {
+	tab: G,
+	active: K
 };
-function J() {
+function Y() {
 	return window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "instant" : "smooth";
 }
-function Y(e) {
-	if (e.getAttribute("aria-orientation") === "vertical") return q;
-	let t = e.scrollWidth - e.clientWidth;
-	if (t <= 1) return q;
-	let n = Math.abs(e.scrollLeft), r = n > 1, i = t - n > 1, a = getComputedStyle(e).direction === "rtl";
-	return {
-		left: a ? i : r,
-		right: a ? r : i,
+function X(e, t = J) {
+	let n = e.scrollWidth - e.clientWidth;
+	if (e.getAttribute("aria-orientation") === "vertical" || n <= 1) return V(e, t, !1, !1), U;
+	let r = Math.abs(e.scrollLeft), i = r > 1, a = n - r > 1, o = getComputedStyle(e).direction === "rtl", s = o ? a : i, c = o ? i : a;
+	return V(e, t, s, c), {
+		left: s,
+		right: c,
 		top: e.offsetTop,
 		x: e.offsetLeft,
 		width: e.offsetWidth,
 		height: e.offsetHeight
 	};
 }
-var X = (e, t) => e.left === t.left && e.right === t.right && e.top === t.top && e.x === t.x && e.width === t.width && e.height === t.height;
-function Ee(e, t, n = J()) {
+function ke(e, t, n = Y()) {
 	if (e.scrollWidth <= e.clientWidth) return 0;
 	let r = e.getBoundingClientRect(), i = t.getBoundingClientRect(), a = 0;
-	return i.left < r.left + K ? a = i.left - r.left - K : i.right > r.right - K && (a = i.right - r.right + K), a && e.scrollBy({
+	return i.left < r.left + q ? a = i.left - r.left - q : i.right > r.right - q && (a = i.right - r.right + q), a && e.scrollBy({
 		left: a,
 		behavior: n
 	}), a;
 }
-function Z(e, t = {
-	tab: W,
-	active: G
-}) {
-	let [n, r] = te(q);
+function Z(e, t = J) {
+	let [n, r] = te(U);
 	return _(() => {
 		let n = e.current;
 		if (!n) return;
 		let i = 0, a = () => {
 			cancelAnimationFrame(i), i = requestAnimationFrame(() => {
-				let e = Y(n);
-				r((t) => X(t, e) ? t : e);
+				let e = X(n, t);
+				r((t) => W(t, e) ? t : e);
 			});
-		}, o = () => n.querySelector(t.active), s = Te(n, Ee), { state: c, reveal: l } = s, u = new ResizeObserver(() => {
+		}, o = () => n.querySelector(t.active), s = Oe(n, ke), { state: c, reveal: l } = s, u = new ResizeObserver(() => {
 			a();
 			let e = c.follow ? o() : null;
 			e && l(e, "instant");
@@ -244,35 +255,32 @@ function Z(e, t = {
 		};
 		n.addEventListener("focusin", p), d();
 		let m = o();
-		return m && l(m, "instant"), r(Y(n)), () => {
+		return m && l(m, "instant"), r(X(n, t)), () => {
 			cancelAnimationFrame(i), u.disconnect(), f.disconnect(), n.removeEventListener("focusin", p), s.dispose();
 		};
-	}, [
-		e,
-		t.tab,
-		t.active
-	]), De(e, n.left || n.right, r), n;
+	}, [e, t]), Ae(e, n.left || n.right, r, t), n;
 }
-function De(e, t, n) {
+function Ae(e, t, n, r) {
 	ee(() => {
-		let r = e.current;
-		if (!r || !t) return;
-		let i = 0, a = () => {
-			cancelAnimationFrame(i), i = requestAnimationFrame(() => {
-				let e = Y(r);
-				n((t) => X(t, e) ? t : e);
+		let i = e.current;
+		if (!i || !t) return;
+		let a = 0, o = () => {
+			cancelAnimationFrame(a), a = requestAnimationFrame(() => {
+				let e = X(i, r);
+				n((t) => W(t, e) ? t : e);
 			});
 		};
-		return document.addEventListener("scroll", a, {
+		return document.addEventListener("scroll", o, {
 			passive: !0,
 			capture: !0
 		}), () => {
-			cancelAnimationFrame(i), document.removeEventListener("scroll", a, { capture: !0 });
+			cancelAnimationFrame(a), document.removeEventListener("scroll", o, { capture: !0 });
 		};
 	}, [
 		e,
 		t,
-		n
+		n,
+		r
 	]);
 }
 //#endregion
@@ -284,14 +292,14 @@ function Q({ look: t }) {
 		if (!e || !t) return;
 		let r = 0, i = () => {
 			cancelAnimationFrame(r), r = requestAnimationFrame(() => {
-				let n = t.querySelector(G);
+				let n = t.querySelector(K);
 				if (!n) return;
 				let r = t.getAttribute("aria-orientation") === "vertical", i = r ? n.offsetHeight : n.offsetWidth, a = r ? n.offsetTop : n.offsetLeft;
 				e.style.setProperty("--tabs-indicator-w", `${i}px`), e.style.setProperty("--tabs-indicator-x", `${a}px`), t.dataset.indicator !== "ready" && (e.offsetWidth, t.dataset.indicator = "ready");
 			});
 		}, a = new ResizeObserver(i), o = () => {
 			a.disconnect(), a.observe(t);
-			for (let e of t.querySelectorAll(W)) a.observe(e);
+			for (let e of t.querySelectorAll(G)) a.observe(e);
 		}, s = new MutationObserver(() => {
 			o(), i();
 		});
@@ -308,7 +316,7 @@ function Q({ look: t }) {
 		ref: n,
 		"aria-hidden": !0,
 		"data-slot": "tabs-indicator",
-		className: e(_e[t])
+		className: e(ye[t])
 	});
 }
 //#endregion
@@ -319,11 +327,11 @@ function $({ list: e, overflow: t }) {
 	let r = (t) => {
 		let n = e.current;
 		if (!n) return;
-		we(n);
+		De(n);
 		let r = Math.max(96, n.clientWidth * .75);
 		n.scrollBy({
 			left: t * r,
-			behavior: J()
+			behavior: Y()
 		});
 	}, i = {
 		type: "button",
@@ -332,7 +340,7 @@ function $({ list: e, overflow: t }) {
 	};
 	return /* @__PURE__ */ b("div", {
 		"data-slot": "tabs-scroll",
-		className: xe,
+		className: we,
 		style: {
 			top: t.top,
 			left: t.x,
@@ -343,14 +351,14 @@ function $({ list: e, overflow: t }) {
 			...i,
 			"data-slot": "tabs-scroll-left",
 			"aria-label": n("material.tabs.scroll-left", "Scroll tabs left"),
-			className: Se,
+			className: Te,
 			onClick: () => r(-1),
 			children: /* @__PURE__ */ y(re, { "aria-hidden": !0 })
 		}), t.right && /* @__PURE__ */ y("button", {
 			...i,
 			"data-slot": "tabs-scroll-right",
 			"aria-label": n("material.tabs.scroll-right", "Scroll tabs right"),
-			className: Ce,
+			className: Ee,
 			onClick: () => r(1),
 			children: /* @__PURE__ */ y(ie, { "aria-hidden": !0 })
 		})]
@@ -358,9 +366,9 @@ function $({ list: e, overflow: t }) {
 }
 //#endregion
 //#region lib/components/ui/primitives/tabs/partials/tabs-list.tsx
-function Oe({ className: n, children: r, ref: i, ...a }) {
-	let o = H(), s = v(null), c = Z(s);
-	return /* @__PURE__ */ b(ne, { children: [/* @__PURE__ */ b(pe, {
+function je({ className: n, children: r, ref: i, ...a }) {
+	let o = z(), s = v(null), c = Z(s);
+	return /* @__PURE__ */ b(ne, { children: [/* @__PURE__ */ b(he, {
 		ref: h((e) => {
 			s.current = e, typeof i == "function" ? i(e) : i && (i.current = e);
 		}, [i]),
@@ -368,7 +376,7 @@ function Oe({ className: n, children: r, ref: i, ...a }) {
 		"data-pw": "tabs-list",
 		"data-overflow-left": c.left ? "" : void 0,
 		"data-overflow-right": c.right ? "" : void 0,
-		className: e(N[o], z, n),
+		className: e(j[o], I, n),
 		...a,
 		children: [/* @__PURE__ */ y(t, { children: r }), /* @__PURE__ */ y(Q, { look: o })]
 	}), /* @__PURE__ */ y($, {
@@ -378,10 +386,10 @@ function Oe({ className: n, children: r, ref: i, ...a }) {
 }
 //#endregion
 //#region lib/components/ui/primitives/tabs/partials/tabs-trigger.tsx
-function ke({ className: n, children: r, icon: i, ...a }) {
-	return /* @__PURE__ */ b(me, {
+function Me({ className: n, children: r, icon: i, ...a }) {
+	return /* @__PURE__ */ b(ge, {
 		"data-slot": "tabs-trigger",
-		className: e(I[H()], n),
+		className: e(P[z()], n),
 		...a,
 		children: [i && /* @__PURE__ */ y("span", {
 			"data-slot": "tabs-trigger-icon",
@@ -398,17 +406,17 @@ function ke({ className: n, children: r, icon: i, ...a }) {
 }
 //#endregion
 //#region lib/components/ui/primitives/tabs/tabs.tsx
-function Ae({ className: t, variant: n = "underline", ...r }) {
-	let i = j(n);
-	return /* @__PURE__ */ y(V.Provider, {
+function Ne({ className: t, variant: n = "underline", ...r }) {
+	let i = k(n);
+	return /* @__PURE__ */ y(R.Provider, {
 		value: i,
-		children: /* @__PURE__ */ y(fe, {
+		children: /* @__PURE__ */ y(me, {
 			"data-slot": "tabs",
 			"data-variant": n,
-			className: e(ge[i], t),
+			className: e(ve[i], t),
 			...r
 		})
 	});
 }
 //#endregion
-export { Q as a, H as c, R as d, ve as f, j as h, $ as i, z as l, I as m, ke as n, Z as o, N as p, Oe as r, V as s, Ae as t, be as u };
+export { Q as a, z as c, xe as d, be as f, k as h, $ as i, I as l, P as m, Me as n, Z as o, j as p, je as r, R as s, Ne as t, Ce as u };

package/dist/{use-chat-composer-BOx4I6Ma.js → use-chat-composer-BFhRMHcX.js}

@@ -14,7 +14,7 @@ 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,
 import { a as Ke, i as qe, n as Je } from "./field-blur-context-BLGgf_3z.js";
 import { i as Ye, n as Xe, r as Ze, t as Qe } from "./popover-Cd7DkND4.js";
 import { a as $e, i as et, n as tt, o as nt, t as rt } from "./bubble-input-CQwVSoU3.js";
-import { n as it, r as at, t as ot, u as st } from "./tabs-BT9pSRwk.js";
+import { n as it, r as at, t as ot, u as st } from "./tabs-KGKvve3y.js";
 import { a as ct, n as lt, o as ut, s as dt, v as ft, y as pt } from "./toolbar-items-D310xDuM.js";
 import { t as mt } from "./dist-DkQbkF9T.js";
 import { o as ht, s as gt, t as _t } from "./use-click-lock-BZYtTmVt.js";

package/docs/components/buttons-and-actions.md

@@ -931,7 +931,15 @@ It renders one `<a>`. The label names the destination and is the link's accessib
 
 It takes every [`LinkButton`](#linkbutton) prop (`to`, `variant`, `color`, `size`, `replace`, `state`, `linkComponent`, ...), so it follows the router or the [`LinkComponentProvider`](./primitives.md#linkcomponentprovider). Only the default differs: `variant` is `'ghost'`.
 
-**Storybook:** `Buttons & actions/BackLink` (`Default`, `LinkStyle`, `Rtl`) · **Vue:** none yet
+In a page header with other actions, `collapse="phone"` keeps only the arrow below 768px, as [`ResponsiveLinkButton`](#linkbutton) does: the label stays in the DOM as the accessible name and, when it is a string, the tooltip, and `variant` and `aria-label` are kept. The collapse is CSS, so the server HTML is right on every device. Unset (the default), the label always shows.
+
+```tsx
+<BackLink to="/items" variant="outlined" collapse="phone">
+	Back to items
+</BackLink>
+```
+
+**Storybook:** `Buttons & actions/BackLink` (`Default`, `LinkStyle`, `Rtl`, `CollapsedOnPhone`) · **Vue:** none yet
 
 ---
 

package/docs/components/data-table-filter-and-lists.md

@@ -1083,6 +1083,9 @@ not three:
    "Select all on this page"); at the end, the sort menu, "Filters (N)" and
    the page's `actions`.
 
+Without `actions`, "Filters (N)" stays beside the search, inside the `search`
+landmark, and row 2 holds the "Select all" checkbox and the sort menu.
+
 On a phone (below 768px) the "Select all" text shortens with an ellipsis (the box keeps its
 full name) rather than run under the sort, "Filters (N)" or the actions. When
 the end group is too wide to leave the start 6rem, it wraps to a line of its
@@ -1105,8 +1108,8 @@ form (`bulkActions={(ids) => node}`) is drawn whole in the row, so keep it to
 one or two compact buttons; the footer's polite status still tells the selection once. The cards'
 own list bar row is gone in this layout; the names, the sort menu and the
 Filters sheet are the same. A list that cannot be selected has no checkbox
-(row 2 starts with the sort). The table layout, a list without `filter` or
-without `actions`, `variant: 'facets'` and every width from 768px are
+(row 2 starts with the sort). The table layout, a list without `filter`,
+`variant: 'facets'` and every width from 768px are
 unchanged, and `bandActions` has no effect while the second row is there.
 
 The row is narrow, so it compacts to the band's width: when the end group is
@@ -1176,7 +1179,7 @@ sprite file's name, or a list of them). On "nothing matches", an `action` in
 `noMatch` replaces "Clear search and filters". The live region speaks the
 page's `title`.
 
-`ServerTable` uses `DataTable`'s `focusable`, `focusRef` (the table, or the list of cards or tiles), `announceLoading`, `announceEmpty`, `filtered` and `pagination.live` (see [DataTable](#datatable)).
+`ServerTable` takes `focusRef` like `DataTable` (a `Ref<HTMLElement>`, filled with the table, or the list of cards or tiles, beside its own): give it `useRowMenuFocus()`'s so `focusRowMenu(id)` looks only inside that table. It uses `DataTable`'s `focusable`, `focusRef`, `announceLoading`, `announceEmpty`, `filtered` and `pagination.live` (see [DataTable](#datatable)).
 
 **Storybook:** `Data table, filter & lists/ServerTable` (`Error No Loading`, `Error Retry`), `…/ServerTable/Band and empty page`, `…/ServerTable/Phone`, `…/ServerTable/Phone header`, `…/ServerTable/Cards`, `…/ServerTable/Tiles`, `…/ServerTable/Own controls` (`Past The Last Page`, `Slow Router Keeps Search`), `…/ServerTable/Locked rows`, `…/ServerTable/Compact band and icon paging` · **Vue:** `ServerTable`
 
@@ -1308,7 +1311,8 @@ const columns = useMemo(
 <DataTable focusRef={focusRef} getRowId={(p) => p.id} columns={columns} data={people} />;
 ```
 
-`focusRef` scopes the search to that table; without it the whole document is
+`focusRef` scopes the search to that table (`ServerTable` takes it too, in the
+table and the cards and tiles layouts); without it the whole document is
 searched. For a dialog, [`onCloseAutoFocus`](#focus-after-a-bulk-action) with
 `preventDefault()` is the precise hook if you want to take the focus yourself.
 

package/docs/components/primitives.md

@@ -737,9 +737,9 @@ Parts: `Tabs`, `TabsList`, `TabsTrigger`, `TabsContent`. `TabsList` and
 takes the primary colour, and a bar under it slides to the tab clicked or
 reached with the arrow keys. The list scrolls sideways when the tabs do not
 fit (its scrollbar hidden), which suits a phone or a narrow popover. While it
-overflows, each side with hidden tabs fades and gets a small scroll button
+overflows, each side with hidden tabs gets a small scroll button
 ("Scroll tabs left" / "Scroll tabs right", from `material.tabs.*`; out of the
-tab order; on a touch screen 44px wide and as tall as the list, so it never covers content). Under a button the list shows nothing (its edge mask is transparent there and fades in just beyond), so no label is ever cut by the button, even at 375px; the selected and the focused tab are
+tab order; on a touch screen 44px wide and as tall as the list, so it never covers content). Under a button the list shows nothing (its edge mask is transparent there, with a hard edge), and a tab that does not fit whole between the buttons turns transparent (`data-clipped`, still focusable), so a label is shown whole or not at all, even at 375px; the selected and the focused tab are
 scrolled into view clear of the button, instantly under reduced motion. A list that fits has
 neither, and neither is in the server markup. `segmented` does the same.
 
@@ -856,8 +856,8 @@ address can be copied. `aria-label` names the navigation and is required.
 - **Keyboard**: the links are plain links, so Tab moves from one to the next;
   the arrow keys do nothing (they are not tabs, there is no `tablist`).
 - **Looks**: `variant="underline"` (the default) or `"segmented"`, as `Tabs`.
-  A nav wider than its container scrolls inside itself, with the same edge
-  fades and scroll buttons as `Tabs`. On a coarse pointer each link is 44px
+  A nav wider than its container scrolls inside itself, with the same
+  hard-edged mask, clipped tabs (`data-clipped`) and scroll buttons as `Tabs`. On a coarse pointer each link is 44px
   tall at least. In forced colours the current link keeps a `Highlight` mark.
 - **The link**: `TabsNavLink` takes `LinkButton`'s props (`to`, `replace`,
   `state`, `target`, `reloadDocument`, `download`, `linkComponent`) and an

package/docs/components/selection-and-choice.md

@@ -1145,6 +1145,7 @@ export function Ranking() {
 | `searchable` | `boolean` | `true` | filter box |
 | `height` | `number \| string` | `320` | list height |
 | `required` | `boolean` | — | the asterisk, and `aria-required` on the `listbox`, which the label names |
+| `hideLabel` | `boolean` | `false` | `true` keeps `label` as the list's accessible name (`aria-labelledby`) but draws nothing, for a heading that already titles it |
 | `numbered` | `boolean` | `false` | each row shows its rank in the whole order |
 | `removable` | `boolean` | `false` | a remove button on each row, and Delete: the row leaves the value |
 | `appearance` | `'cards' \| 'plain'` | `'cards'` | raised cards, or flat rows in one surface |
@@ -1156,7 +1157,7 @@ where it is: no grip, not draggable, not movable from the keyboard, not
 removable).
 
 **Emits:** `string[]`, in the new order.
-**Form wrapper:** `SortableListFormField` — `control` and `name`, see
+**Form wrapper:** `SortableListFormField` — `control` and `name` plus the same props, `hideLabel` included (the label's `required` asterisk is hidden with it; the `listbox` keeps `aria-required`), see
 [forms](../guides/forms.md#the-pair) and [what each field emits](../guides/forms.md#what-each-field-emits).
 **Storybook:** `Selection & choice/SortableList` · **Vue:** `SortableList`, `SortableListFormField`
 

package/docs/guides/illustrations.md

@@ -120,7 +120,7 @@ in a state, a string that is not a registered id is a node, as before (so the
 set must be registered for the string shorthand). An app that never imports the
 subpath does not carry the table. A table of your own is a `SceneTable`
 (`SceneRow` from `@nxgt/material-core/illustrations`), passed through `sets` or
-`scenes`; its ids are not in `SceneId`, so type them with the `scenes` prop. `HEALTH_SUGGESTED_ICONS` (like `SUGGESTED_ICONS`) lists the icon names the set draws, hero first.
+`scenes`; its ids join `SceneId` once you register them ([Scenes of your own](#scenes-of-your-own)). `HEALTH_SUGGESTED_ICONS` (like `SUGGESTED_ICONS`) lists the icon names the set draws, hero first.
 
 ## Scene sets: the education scenes
 
@@ -179,6 +179,39 @@ unrelated to the `night-sky` Background preset. Every icon is in the Free sheet,
 needs no substitution; `GAME_SUGGESTED_ICONS` lists the names, hero first.
 Importing the entry adds the ids to `SceneId`.
 
+## Scenes of your own
+
+A table of your own is a `SceneTable` (a row is `[plate, tone, layout, hero, ...satellites]`). Register it with `IllustrationDefaults` `sets`, and declare its ids once so `scene` accepts them beside the built-in ones, without a cast:
+
+The file that holds the `declare module` must be a module (it has an `import` or an `export`), otherwise the declaration replaces the module's types instead of augmenting them.
+
+```tsx
+import type { SceneTable } from '@nxgt/material-core/illustrations';
+import {
+  Illustration,
+  IllustrationDefaults,
+  type SceneTableIds,
+} from '@nxgt/material/illustrations';
+
+const MY_SCENES = {
+  'my-scene': ['cookie-9', 'primary', 0, 'star', 'moon', 'heart'],
+} satisfies SceneTable;
+
+declare module '@nxgt/material/illustrations' {
+  interface RegisteredScenes extends SceneTableIds<typeof MY_SCENES> {}
+}
+
+export function Example({ id }: { id: 'empty' | 'my-scene' }) {
+  return (
+    <IllustrationDefaults sets={[MY_SCENES]}>
+      <Illustration scene={id} />
+    </IllustrationDefaults>
+  );
+}
+```
+
+`RegisteredScenes` is an empty interface: each key is a scene id (the value is ignored). `SceneTableIds<typeof TABLE>` derives the keys of a table, so the augmentation is one line; write `interface RegisteredScenes { 'my-scene': true }` by hand if you prefer. The ids widen `SceneId` (so `RegisteredScene` too) for `Illustration scene`, a state's `illustration` and `emptyIllustration`. The declaration is only types: the table still has to be registered (`sets`) or passed (`scenes={MY_SCENES}`) to be drawn. Passing `scenes={MY_SCENES}` keeps its own typing: `scene` is then one of that table's ids only.
+
 ## Turn them on for an app
 
 `IllustrationDefaults` opts a subtree in: every default-size `EmptyState` and

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nxgt/material",
-	"version": "3.77.0",
+	"version": "3.79.0",
 	"license": "MIT",
 	"bugs": {
 		"email": "stevegires@gmail.com"