@nxgt/material 3.16.0 → 3.18.0

package/dist/pdf-reader.js

@@ -1,3 +1,3 @@
-import { t as e } from "./public-Bj3rGSfS.js";
+import { t as e } from "./public-BLw13izR.js";
 import { configurePdfReader as t } from "@nxgt/material-core/pdf-reader";
 export { e as PdfReader, t as configurePdfReader };

package/dist/print.js

@@ -1,5 +1,5 @@
-import { r as e } from "./i18n-provider-GV4Ukoe2.js";
-import { t } from "./translate-material-C0aOnHpZ.js";
+import { r as e } from "./i18n-provider-3TsMIGn1.js";
+import { t } from "./translate-material-X1daoGxE.js";
 import { Children as n, createContext as r, isValidElement as i, useCallback as a, useContext as o, useEffect as s, useMemo as c, useState as l } from "react";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 import { resolvePdfFileName as f } from "@nxgt/material-core/pdf-file-name";

package/dist/{public-Bj3rGSfS.js → public-BLw13izR.js}

@@ -6,18 +6,18 @@ import { c as i, i as a, l as o, n as s, o as c, s as l } from "./dist-lmHmz_bu.
 import { a as u, o as d } from "./tooltip-CkttDIab.js";
 import { i as f } from "./dist-C4wtXCjf.js";
 import { r as p, t as m } from "./in-dialog-Vwkyp-M5.js";
-import { C as h, D as g, E as _, O as v, S as y, T as b, _ as x, f as S, g as ee, k as te, r as ne, t as C, u as re, w } from "./dialog-YHZJjDrI.js";
-import { c as T, d as ie, f as E, i as ae, l as oe, n as se, o as D, t as ce, u as O } from "./dropdown-menu-BEyP-A0J.js";
-import { S as le, a as k, d as A, g as ue, h as de, i as fe, m as pe, n as j, r as me, t as M, u as he, w as ge } from "./toolbar-items-CVQBYp4K.js";
-import { t as N } from "./use-material-translation-DGeVp-qP.js";
-import { t as _e } from "./button-BrgyWw7T.js";
+import { C as h, D as g, E as _, O as v, S as y, T as b, _ as x, f as S, g as ee, k as te, r as ne, t as C, u as re, w } from "./dialog-jYcWDh9G.js";
+import { c as T, d as ie, f as E, i as ae, l as oe, n as se, o as D, t as ce, u as O } from "./dropdown-menu-BEZhNnhr.js";
+import { S as le, a as k, d as A, g as ue, h as de, i as fe, m as pe, n as j, r as me, t as M, u as he, w as ge } from "./toolbar-items-CrATPuOX.js";
+import { t as N } from "./use-material-translation-tD9XqIBm.js";
+import { t as _e } from "./button-Ck1Bif-Q.js";
 import { n as ve, t as ye } from "./icon-button-ifTpXt0A.js";
 import { t as be } from "./useEvent-2fKq-6w8.js";
 import { n as xe, t as Se } from "./toggle-group-BMJNcFAC.js";
 import { o as Ce } from "./escape-owner-C4W_sOAU.js";
 import { n as we } from "./use-slice-reducer-BGkeGtML.js";
 import { r as Te } from "./use-csp-nonce-ZKs9k-ov.js";
-import { n as Ee, t as De } from "./empty-state-ZtqqpX0S.js";
+import { n as Ee, t as De } from "./empty-state-BBUsR0_X.js";
 import { t as Oe } from "./client-only.utils-3nHNzCki.js";
 import { t as ke } from "./use-scroll-away-PQRFZkT2.js";
 import { ArrowLeft as Ae, BookOpenText as je, ChevronDown as Me, ChevronLeft as Ne, ChevronRight as Pe, ChevronUp as Fe, Download as Ie, Eraser as Le, FileText as Re, FileWarning as ze, FileX2 as Be, Highlighter as Ve, KeyRound as He, LayoutGrid as Ue, List as We, Loader2 as Ge, Maximize as Ke, MessageSquareText as qe, Minimize as Je, MoreVertical as Ye, MousePointer2 as Xe, MoveHorizontal as Ze, PanelLeft as Qe, Pen as $e, PencilLine as et, Printer as tt, RotateCw as nt, Search as rt, StickyNote as it, Type as at, Underline as ot, Undo2 as st, Volume2 as ct, X as lt, XIcon as ut, ZoomIn as dt, ZoomOut as ft } from "lucide-react";

package/dist/{rich-code-block-RN-EpeTA.js → rich-code-block-DPe5USBG.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./tooltip-CkttDIab.js";
-import { c as t, n, t as r } from "./dropdown-menu-BEyP-A0J.js";
-import { t as i } from "./use-material-translation-DGeVp-qP.js";
-import { a, i as o, n as s, o as c, t as l } from "./code-language-items-D1lpNQ6J.js";
+import { c as t, n, t as r } from "./dropdown-menu-BEZhNnhr.js";
+import { t as i } from "./use-material-translation-tD9XqIBm.js";
+import { a, i as o, n as s, o as c, t as l } from "./code-language-items-Bnm_WDVg.js";
 import { i as u, n as d, r as f, s as p } from "./dist-C3GR7kJd.js";
 import { t as m } from "./code-block-spec-CGLKRhwD.js";
 import { Check as h, ChevronDown as g, Copy as _, Maximize2 as v, WrapText as y } from "lucide-react";
@@ -143,7 +143,7 @@ function M({ node: e, editor: t, updateAttributes: n, editable: r, wrap: a, onWr
 }
 //#endregion
 //#region lib/components/ui/widgets/editor/extensions/code/code-block-open.tsx
-var N = x(() => import("./code-editor-DjY7_8TH.js").then((e) => e.n).then((e) => ({ default: e.CodeEditor })));
+var N = x(() => import("./code-editor-M4DcaX-P.js").then((e) => e.n).then((e) => ({ default: e.CodeEditor })));
 function P() {
 	let { t: e } = i();
 	return /* @__PURE__ */ T("div", {

package/dist/{sortable-provider-Iej7IS4n.js → sortable-provider-CtAb1Q02.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { t } from "./dist-DVRQkaTK.js";
-import { t as n } from "./use-material-translation-DGeVp-qP.js";
+import { t as n } from "./use-material-translation-tD9XqIBm.js";
 import { t as r } from "./icon-button-ifTpXt0A.js";
 import { t as i } from "./compose-refs-DZ0iIVF-.js";
 import { GripVertical as a } from "lucide-react";

package/dist/{spinner-BwWDXIbg.js → spinner-CcmXeIHf.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { o as t } from "./tooltip-CkttDIab.js";
-import { t as n } from "./use-material-translation-DGeVp-qP.js";
+import { t as n } from "./use-material-translation-tD9XqIBm.js";
 import { jsx as r } from "react/jsx-runtime";
 //#region lib/components/ui/feedback/spinner/spinner.tsx
 var i = t("transition-all duration-500", {

package/dist/{stored-language-BAAP7qS3.js → stored-language-CsDEJDR7.js}

@@ -1275,6 +1275,7 @@ var t = {
 			bar: {
 				label: "Filters",
 				search: "Search",
+				"search-min": "Type at least {min, plural, one {# character} other {# characters}} to search",
 				active: "Active filters",
 				locked: "Locked",
 				"locked-reason": "Locked: {reason}",
@@ -2599,7 +2600,17 @@ var t = {
 				"scatter-series": "{series}: {count, plural, one {# point} other {# points}}."
 			}
 		},
-		"list-details": { back: "Back to the list" }
+		"list-details": { back: "Back to the list" },
+		switcher: {
+			search: "Search",
+			"search-placeholder": "Search…",
+			clear: "Clear the search",
+			empty: "No results for “{query}”",
+			results: "{count, plural, =0 {No results} one {# result} other {# results}}",
+			recent: "Recent",
+			manage: "Manage…",
+			choose: "Choose"
+		}
 	} },
 	fr: { material: {
 		"empty-state": {
@@ -3874,6 +3885,7 @@ var t = {
 			bar: {
 				label: "Filtres",
 				search: "Rechercher",
+				"search-min": "Saisissez au moins {min, plural, one {# caractère} other {# caractères}} pour rechercher",
 				active: "Filtres actifs",
 				locked: "Verrouillé",
 				"locked-reason": "Verrouillé : {reason}",
@@ -5198,7 +5210,17 @@ var t = {
 				"scatter-series": "{series} : {count, plural, one {# point} other {# points}}."
 			}
 		},
-		"list-details": { back: "Retour à la liste" }
+		"list-details": { back: "Retour à la liste" },
+		switcher: {
+			search: "Rechercher",
+			"search-placeholder": "Rechercher…",
+			clear: "Effacer la recherche",
+			empty: "Aucun résultat pour « {query} »",
+			results: "{count, plural, =0 {Aucun résultat} one {# résultat} other {# résultats}}",
+			recent: "Récents",
+			manage: "Gérer…",
+			choose: "Choisir"
+		}
 	} }
 }, n = "language", r = "en", i = Object.keys(t);
 //#endregion

package/dist/theme-picker.js

@@ -1,10 +1,10 @@
 import { t as e } from "./utils-BLfntITJ.js";
 import { a as t, i as n, n as r, o as i, r as a, t as o } from "./bubble-input-B7BVd9fX.js";
-import { t as s } from "./use-material-translation-DGeVp-qP.js";
+import { t as s } from "./use-material-translation-tD9XqIBm.js";
 import { n as c, r as l } from "./icon-sprites-FxHyqyhg.js";
 import { t as u } from "./use-theme-DMcyJ52N.js";
 import { a as d, r as f } from "./theme-context-Cofk6vgs.js";
-import { t as p } from "./theme-toggle-8zHeXSD1.js";
+import { t as p } from "./theme-toggle-CWovcIQY.js";
 import { n as m, t as h } from "./nxgt-theme-ZS945iMP.js";
 import { Check as g } from "lucide-react";
 import { useContext as _ } from "react";

package/dist/{theme-toggle-8zHeXSD1.js → theme-toggle-CWovcIQY.js}

@@ -1,4 +1,4 @@
-import { t as e } from "./use-material-translation-DGeVp-qP.js";
+import { t as e } from "./use-material-translation-tD9XqIBm.js";
 import { i as t } from "./theme-store-CSl51uNH.js";
 import { n, t as r } from "./use-theme-DMcyJ52N.js";
 import { r as i } from "./theme-context-Cofk6vgs.js";

package/dist/{toolbar-items-CVQBYp4K.js → toolbar-items-CrATPuOX.js}

@@ -4,9 +4,9 @@ import { a as i, c as a, i as o, l as s, r as c, s as l } from "./dist-lmHmz_bu.
 import { b as u, c as d, d as f, f as p, l as m, t as h, u as g, x as _ } from "./tooltip-CkttDIab.js";
 import { i as v, n as y, r as b, t as x } from "./dist-C4wtXCjf.js";
 import { a as S, c as C, l as w, o as T, r as ee, s as te, t as E } from "./in-dialog-Vwkyp-M5.js";
-import { A as ne, M as re, N as ie, b as ae, d as oe, f as se, i as ce, j as le, l as ue, n as de, o as fe, r as pe, t as me, u as he, y as ge } from "./dropdown-menu-BEyP-A0J.js";
+import { A as ne, M as re, N as ie, b as ae, d as oe, f as se, i as ce, j as le, l as ue, n as de, o as fe, r as pe, t as me, u as he, y as ge } from "./dropdown-menu-BEZhNnhr.js";
 import { a as _e, n as ve, r as ye, t as be } from "./dist-B7RjY7SL.js";
-import { t as xe } from "./use-material-translation-DGeVp-qP.js";
+import { t as xe } from "./use-material-translation-tD9XqIBm.js";
 import { t as Se } from "./warn-once-C_e47JM8.js";
 import { o as Ce } from "./escape-owner-C4W_sOAU.js";
 import { ChevronLeft as we, ChevronRightIcon as Te, MoreVertical as Ee } from "lucide-react";

package/dist/{translate-material-C0aOnHpZ.js → translate-material-X1daoGxE.js}

@@ -1,5 +1,5 @@
-import "./stored-language-BAAP7qS3.js";
-import { a as e, r as t } from "./translator-BU07gNva.js";
+import "./stored-language-CsDEJDR7.js";
+import { a as e, r as t } from "./translator-BUVKAo4l.js";
 //#region lib/i18n/translate-material.ts
 function n(n, r, i, a) {
 	if (n) for (let e of /* @__PURE__ */ new Set([n, n.split("-")[0]])) {

package/dist/{translator-BU07gNva.js → translator-BUVKAo4l.js}

@@ -1,5 +1,5 @@
 import { t as e } from "./is-production-GLw59WU8.js";
-import { a as t, i as n, r, t as i } from "./stored-language-BAAP7qS3.js";
+import { a as t, i as n, r, t as i } from "./stored-language-CsDEJDR7.js";
 import { t as a } from "./get-CTzJAwfc.js";
 //#region ../../node_modules/@formatjs/fast-memoize/index.js
 function o(e, t) {

package/dist/{use-chat-composer-CoXmJCkr.js → use-chat-composer-UZVFm8Tw.js}

@@ -7,21 +7,21 @@ import { a as o, c as s, i as c, l, n as u, o as d, r as f, s as p, t as m } fro
 import { _ as h, a as g, g as _, h as v, m as y, o as b, p as x, t as S, v as C, y as w } from "./tooltip-CkttDIab.js";
 import { a as T, i as E, n as D, r as O, t as k } from "./dist-C4wtXCjf.js";
 import { i as A, n as ee, t as j } from "./in-dialog-Vwkyp-M5.js";
-import { A as M, C as N, D as te, E as ne, O as P, S as re, T as ie, _ as F, b as ae, f as oe, g as se, k as I, l as ce, m as le, n as ue, o as de, r as fe, s as pe, t as me, u as he, v as ge, w as _e, x as ve, y as ye } from "./dialog-YHZJjDrI.js";
+import { A as M, C as N, D as te, E as ne, O as P, S as re, T as ie, _ as F, b as ae, f as oe, g as se, k as I, l as ce, m as le, n as ue, o as de, r as fe, s as pe, t as me, u as he, v as ge, w as _e, x as ve, y as ye } from "./dialog-jYcWDh9G.js";
 import { A as be, C as xe, D as Se, E as Ce, O as we, S as Te, T as Ee, _ as De, a as Oe, b as ke, d as Ae, f as je, g as Me, h as Ne, i as Pe, k as Fe, l as Ie, m as Le, n as Re, o as ze, p as Be, r as Ve, s as He, t as Ue, u as We, v as Ge, w as Ke, x as qe, y as Je } from "./floating-ui.dom-KkZSW8_E.js";
-import { D as Ye, E as Xe, N as Ze, O as Qe, c as $e, d as et, f as tt, i as nt, k as rt, m as it, n as at, o as ot, p as st, t as ct, u as lt } from "./dropdown-menu-BEyP-A0J.js";
+import { D as Ye, E as Xe, N as Ze, O as Qe, c as $e, d as et, f as tt, i as nt, k as rt, m as it, n as at, o as ot, p as st, t as ct, u as lt } from "./dropdown-menu-BEZhNnhr.js";
 import { a as ut, i as dt, n as ft } from "./field-blur-context-Cft9s7Hg.js";
-import { C as pt, S as mt, a as ht, c as gt, d as _t, l as vt, n as yt, o as bt, s as xt, u as St } from "./toolbar-items-CVQBYp4K.js";
+import { C as pt, S as mt, a as ht, c as gt, d as _t, l as vt, n as yt, o as bt, s as xt, u as St } from "./toolbar-items-CrATPuOX.js";
 import { a as Ct, i as wt, n as Tt, o as Et, t as Dt } from "./bubble-input-B7BVd9fX.js";
 import { i as Ot } from "./dist-B7RjY7SL.js";
-import "./stored-language-BAAP7qS3.js";
-import { a as kt } from "./translator-BU07gNva.js";
+import "./stored-language-CsDEJDR7.js";
+import { a as kt } from "./translator-BUVKAo4l.js";
 import { h as At } from "./get-CTzJAwfc.js";
 import { t as jt } from "./isEmpty-F_g3jLf8.js";
-import { t as L } from "./use-material-translation-DGeVp-qP.js";
-import { t as Mt } from "./spinner-BwWDXIbg.js";
+import { t as L } from "./use-material-translation-tD9XqIBm.js";
+import { t as Mt } from "./spinner-CcmXeIHf.js";
 import { a as Nt } from "./button-tones-BwuVvAmd.js";
-import { a as Pt, i as Ft, n as It, r as Lt, t as Rt } from "./button-BrgyWw7T.js";
+import { a as Pt, i as Ft, n as It, r as Lt, t as Rt } from "./button-Ck1Bif-Q.js";
 import { t as R } from "./icon-button-ifTpXt0A.js";
 import { n as zt, r as Bt } from "./icon-sprites-FxHyqyhg.js";
 import { t as Vt } from "./use-ssr-media-query-C6M5m8sf.js";
@@ -35,10 +35,10 @@ import { a as tn, i as nn, o as rn } from "./escape-owner-C4W_sOAU.js";
 import { n as an } from "./use-slice-reducer-BGkeGtML.js";
 import { t as on } from "./browser-only-DQ94lWF8.js";
 import { t as sn } from "./compose-refs-DZ0iIVF-.js";
-import { n as cn, r as ln, t as un } from "./chip-BZu-bvAJ.js";
-import { n as dn, t as fn } from "./icon-badge-C0TGvF9o.js";
+import { n as cn, r as ln, t as un } from "./chip-B9pZFWbi.js";
+import { n as dn, t as fn } from "./icon-badge-92uhu2o6.js";
 import { r as pn } from "./use-csp-nonce-ZKs9k-ov.js";
-import { t as mn } from "./empty-state-ZtqqpX0S.js";
+import { t as mn } from "./empty-state-BBUsR0_X.js";
 import { t as hn } from "./skeleton-DSdtr2qc.js";
 import { H as gn, V as _n, X as vn, bt as yn, it as bn, lt as xn, n as Sn, t as Cn, xt as wn, yt as Tn } from "./dist-moutbfbd.js";
 import { t as En } from "./markdown-Dw_uH7j7.js";
@@ -10782,7 +10782,7 @@ var CS = (e = {}) => Dn({
 		let [{ default: t }, { lowlight: n }, { richCodeBlock: r }] = await Promise.all([
 			import("./dist-CRMFGjng.js"),
 			import("./lowlight-OtcjU2Sa.js"),
-			import("./rich-code-block-RN-EpeTA.js")
+			import("./rich-code-block-DPe5USBG.js")
 		]);
 		return [r(t, {
 			lowlight: n,
@@ -12053,35 +12053,35 @@ function WC({ shortcut: e, loading: t, filled: n, disabled: r, onClear: i }) {
 }
 //#endregion
 //#region lib/components/ui/fields/search-field/search-field.tsx
-function GC({ id: e, value: t, defaultValue: r = "", onChange: i, onValueChange: a, debounceMs: o = 0, loading: s = !1, placeholder: c, label: l, helperText: u, error: d, disabled: f, required: p, name: m, className: h, onKeyDown: g, shortcut: _, ...v }) {
-	let { t: y } = L(), b = eo(), x = eo(), [S, C] = W(String(r ?? "")), w = t !== void 0, T = w ? String(t ?? "") : S, E = Gt(a), D = a !== void 0, O = H(() => o ? Po((e) => E.current?.(e), o) : null, [o, E]);
-	V(() => () => O?.cancel(), [O]);
-	let k = (e, t = !1) => {
-		if (w || C(e), D) {
-			if (t || !O) {
-				O?.cancel(), E.current?.(e);
+function GC({ id: e, value: t, defaultValue: r = "", onChange: i, onValueChange: a, onClear: o, debounceMs: s = 0, loading: c = !1, placeholder: l, label: u, helperText: d, error: f, disabled: p, required: m, name: h, className: g, onKeyDown: _, shortcut: v, ...y }) {
+	let { t: b } = L(), x = eo(), S = eo(), [C, w] = W(String(r ?? "")), T = t !== void 0, E = T ? String(t ?? "") : C, D = Gt(a), O = a !== void 0, k = H(() => s ? Po((e) => D.current?.(e), s) : null, [s, D]);
+	V(() => () => k?.cancel(), [k]);
+	let A = (e, t = !1) => {
+		if (T || w(e), O) {
+			if (t || !k) {
+				k?.cancel(), D.current?.(e);
 				return;
 			}
-			O(e);
+			k(e);
 		}
-	}, A = () => {
-		k("", !0), i?.({
+	}, ee = () => {
+		A("", !0), o?.(), i?.({
 			target: { value: "" },
 			currentTarget: { value: "" }
 		});
-	}, ee = e ?? b, j = po(v["aria-describedby"], !!u && x);
+	}, j = e ?? x, M = po(y["aria-describedby"], !!d && S);
 	return /* @__PURE__ */ K("div", {
 		"data-slot": "search-field",
-		"data-pw": m ?? "search-field",
-		className: n("grid w-full content-start gap-1.5", h),
+		"data-pw": h ?? "search-field",
+		className: n("grid w-full content-start gap-1.5", g),
 		children: [
-			l && /* @__PURE__ */ G(dt, {
-				htmlFor: ee,
-				withAsterisk: p,
-				children: l
+			u && /* @__PURE__ */ G(dt, {
+				htmlFor: j,
+				withAsterisk: m,
+				children: u
 			}),
 			/* @__PURE__ */ K(lv, {
-				"data-disabled": f || void 0,
+				"data-disabled": p || void 0,
 				children: [
 					/* @__PURE__ */ G(dv, {
 						align: "inline-start",
@@ -12093,39 +12093,39 @@ function GC({ id: e, value: t, defaultValue: r = "", onChange: i, onValueChange:
 						})
 					}),
 					/* @__PURE__ */ G(mv, {
-						...v,
-						id: ee,
-						name: m,
+						...y,
+						id: j,
+						name: h,
 						type: "search",
-						value: T,
-						disabled: f,
-						required: p,
-						"aria-invalid": d || void 0,
-						"aria-busy": s || void 0,
-						"aria-describedby": j,
-						"aria-keyshortcuts": _,
-						placeholder: c ?? y("material.search-field.placeholder", "Search"),
+						value: E,
+						disabled: p,
+						required: m,
+						"aria-invalid": f || void 0,
+						"aria-busy": c || void 0,
+						"aria-describedby": M,
+						"aria-keyshortcuts": v,
+						placeholder: l ?? b("material.search-field.placeholder", "Search"),
 						className: "[&::-webkit-search-cancel-button]:hidden",
 						onChange: (e) => {
-							k(e.target.value), i?.(e);
+							A(e.target.value), i?.(e);
 						},
 						onKeyDown: (e) => {
-							e.key === "Escape" && T && (e.preventDefault(), A()), g?.(e);
+							e.key === "Escape" && E && (e.preventDefault(), ee()), _?.(e);
 						}
 					}),
 					/* @__PURE__ */ G(WC, {
-						shortcut: _,
-						loading: s,
-						filled: T !== "",
-						disabled: f,
-						onClear: A
+						shortcut: v,
+						loading: c,
+						filled: E !== "",
+						disabled: p,
+						onClear: ee
 					})
 				]
 			}),
-			u && /* @__PURE__ */ G(ut, {
-				id: x,
-				error: d,
-				children: u
+			d && /* @__PURE__ */ G(ut, {
+				id: S,
+				error: f,
+				children: d
 			})
 		]
 	});

package/dist/{use-heading-spy-DETdqnB6.js → use-heading-spy-ByraZUf9.js}

@@ -1,4 +1,4 @@
-import { r as e } from "./i18n-provider-GV4Ukoe2.js";
+import { r as e } from "./i18n-provider-3TsMIGn1.js";
 import { _ as t, g as n, h as r, n as i, v as a, y as o } from "./number.utils-BG_eEt5g.js";
 import { useCallback as s, useEffect as c, useMemo as l, useRef as u } from "react";
 //#region ../../node_modules/date-fns/locale/fr/_lib/formatDistance.js

package/dist/{use-material-translation-DGeVp-qP.js → use-material-translation-tD9XqIBm.js}

@@ -1,5 +1,5 @@
-import { r as e } from "./i18n-provider-GV4Ukoe2.js";
-import { t } from "./translate-material-C0aOnHpZ.js";
+import { r as e } from "./i18n-provider-3TsMIGn1.js";
+import { t } from "./translate-material-X1daoGxE.js";
 import { useCallback as n } from "react";
 //#region lib/i18n/use-material-translation.ts
 function r() {

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

@@ -847,7 +847,8 @@ Its props are `ServerTableProps<T>`; `filter` is a `ServerTableFilter`,
 | `rows`, `totalCount`, `pageInfo` | the connection's page | — | `pageInfo: { endCursor?, hasNextPage }`; `rows` stable per answer |
 | `pageSize` | `number` | — | the footer's range ("21–40 of 45") |
 | `getRowId` | `(row) => string` | — | the selection's key |
-| `filter` | `ServerTableFilter` | — | `{ model, locked?, fieldProps?, variant?, sheetTrigger?, quick?, density?, shortcuts?, previewCount?, counts?, liveDelayMs?, label?, searchLabel?, searchPlaceholder? }` |
+| `filter` | `ServerTableFilter` | — | `{ model, locked?, fieldProps?, variant?, sheetTrigger?, quick?, density?, shortcuts?, previewCount?, counts?, liveDelayMs?, label?, searchLabel?, searchPlaceholder?, searchApply?, searchMinLength?, codec? }` |
+| `filter.codec` | `{ keepKnownValues?, encoding? }` | — | how the page reads and writes the URL: pass the loader's `keepKnownValues` / `encoding` so chips and rows agree |
 | `title` | `ReactNode` | — | the band's title (a string is an `<h2>`) |
 | `actions` | `ReactNode` | — | the page's actions, at the band's end |
 | `sorting` | `createSorting(…)` | — | headers sorted from the URL |
@@ -1163,10 +1164,41 @@ Its props are `FilterQueryProps`, its `variant` a `FilterQueryVariant`
 overload per kind, so `<Filter variant="bar" />` does not compile).
 `query` / `defaultQuery` + `onQueryChange` carry the user's query, never a
 locked condition; `density` (a `FilterDensity`: `'comfortable'` or
-`'compact'`), `label`, `searchLabel`, `searchPlaceholder` and `liveDelayMs`
-(200 ms) tune it. A locked chip is a focusable group named by its text ("Year is 2026-2027"), with "Locked: <reason>" as its description. The other variants
+`'compact'`), `label`, `searchLabel`, `searchPlaceholder`, `liveDelayMs`
+(200 ms), `searchApply` and `searchMinLength` tune it. A locked chip is a focusable group named by its text ("Year is 2026-2027"), with "Locked: <reason>" as its description. The other variants
 and `FilterProps` are unchanged.
 
+#### The search: apply on Enter, a minimum length
+
+By default the search is live: the text reaches `onQueryChange` (and a
+`ServerTable`'s URL) `liveDelayMs` after the last keystroke. A list whose
+every request is costly or audited can hold it back:
+
+```tsx
+<ServerTable
+  filter={{ model, searchApply: 'enter', searchMinLength: 3 }}
+  {...props}
+/>
+```
+
+- `searchApply: 'live' | 'enter'` (default `'live'`). With `'enter'`, typing
+  changes nothing until Enter is pressed. Clearing the field (the ✕, Escape,
+  or emptying it by hand then Enter) applies at once. The URL is written only
+  when the search is applied, so a half-typed query never reaches the router
+  or the loader.
+- `searchMinLength` (default `0`, in both modes): below it nothing is applied,
+  and a short hint (`material.filter.bar.search-min`, "Type at least 3
+  characters to search") is shown under the field and announced politely. An
+  empty field is always allowed, because it clears. The length counts the
+  trimmed text.
+- Both go on `Filter` (`variant="bar"` and `"facets"`) and on
+  `ServerTable`'s `filter`. On a phone the search sits beside "Filters (N)"
+  and follows them the same way.
+- A `text` field (an IPP number, a city) inherits `searchApply`, with no
+  option of its own: its editor (the chip's popover, the facets panel) holds
+  the text until Enter, which applies at once. The phone sheet and a staged
+  panel keep their own Apply. `searchMinLength` concerns the search field only.
+
 #### The model, the query and the URL
 
 Declare the fields once, in a `.ts` module with no JSX, so the route's loader

package/docs/components/form-fields.md

@@ -609,6 +609,7 @@ import { SearchField } from '@nxgt/material/components';
 | Prop | Type | Default | Effect |
 | --- | --- | --- | --- |
 | `onValueChange` | `(value: string) => void` | — | the text, debounced when `debounceMs` is set; the latest `onValueChange` is called when the delay ends, so an inline arrow is safe |
+| `onClear` | `() => void` | — | the clear button or Escape emptied the field, after `onValueChange('')`; an input emptied by typing does not call it |
 | `debounceMs` | `number` | `0` | delay before `onValueChange`; `0` calls it on every key |
 | `loading` | `boolean` | `false` | spinner in place of the clear button |
 | `shortcut` | `string` | — | a hint for the key that focuses the field, e.g. `"/"`: a `Kbd` at the end while the field is empty, not loading and not disabled (`aria-hidden`) and `aria-keyshortcuts` on the input. It binds no key; your page listens and focuses the field |

package/docs/components/overlays-and-menus.md

@@ -21,7 +21,7 @@ that prevents the default and focuses nothing) goes to the layer's content.
 Non-modal layers (`modal={false}`, and `DropdownMenu` and `Popover` by
 default) leave the page as it is.
 
-**Checked and radio items draw a mark.** The check of a `*CheckboxItem` draws in and out and the dot of a `*RadioItem` springs in; a checked `CommandItem`, a chosen `Select` or `Combobox` option, the `PhoneField` country menu, the `Switcher` and the `FilterPresets` menu draw their check in. The mark is `data-slot="option-mark"`, `aria-hidden`, follows the row's text colour and stops moving under reduced motion. Roles, `aria-checked` and keyboard behaviour are unchanged: read `aria-checked` on the item, not the mark.
+**Checked and radio items draw a mark.** The check of a `*CheckboxItem` draws in and out and the dot of a `*RadioItem` springs in; a checked `CommandItem`, a chosen `Select` or `Combobox` option, the `PhoneField` country menu and the `FilterPresets` menu draw their check in. The mark is `data-slot="option-mark"`, `aria-hidden`, follows the row's text colour and stops moving under reduced motion. Roles, `aria-checked` and keyboard behaviour are unchanged: read `aria-checked` on the item, not the mark.
 
 **Chosen and highlighted items look the same everywhere.** In the radio groups of `DropdownMenu`, `ContextMenu` and `Menubar`, and in `Select` and
 `Autocomplete` lists, the one chosen item has a 12 % primary tint, a 3px rounded bar

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

@@ -28,7 +28,7 @@ value type each one writes. Everything is imported from
 | <img src="../previews/selection-choice-transferlist.webp" width="96" alt=""> | [TransferList](#transferlist) | Two-pane picker: search, counts, select-all, drag between panes |
 | <img src="../previews/selection-choice-sortablelist.webp" width="96" alt=""> | [SortableList](#sortablelist) | Reorderable list: drag or keyboard, announced |
 | <img src="../previews/selection-choice-treeselectfield.webp" width="96" alt=""> | [TreeSelectField](#treeselectfield) | Pick from a tree, single or multiple |
-| <img src="../previews/selection-choice-switcher.webp" width="96" alt=""> | [Switcher](#switcher) | Workspace or account switcher |
+| <img src="../previews/selection-choice-switcher.webp" width="96" alt=""> | [Switcher](#switcher) | Workspace, establishment or class switcher: menu, search, groups, links |
 
 ## Select
 
@@ -1125,7 +1125,7 @@ multiple mode).
 
 ![Switcher](../previews/selection-choice-switcher.webp)
 
-Dropdown for switching the active workspace or account, with an avatar.
+Switches the workspace, the establishment or the class a page is about. A 44px card trigger (initial or icon tile, title, subtitle, up-down chevron) opens a menu for up to 7 options, and from 8 a panel with a search, groups and a listbox; on a phone it is a bottom sheet. `variant="expressive"` is a pill with a larger panel, "Recent" tiles and soft badges. With `getHref` the options are links.
 
 ```tsx
 import { Switcher, type SwitcherItem } from '@nxgt/material/components';
@@ -1138,17 +1138,87 @@ const workspaces: SwitcherItem[] = [
 
 export function Workspaces() {
 	const [value, setValue] = useState('acme');
-	return <Switcher label="Workspaces" options={workspaces} value={value} onValueChange={setValue} />;
+	return <Switcher label="Workspace" options={workspaces} value={value} onValueChange={setValue} />;
 }
 ```
 
+An option with no `icon` draws its `initial` (default: the first letter of its title) in a tile of its `tone`. Establishments take an icon, a tone and a "Manage…" footer:
+
+```tsx
+import { Icon, Switcher } from '@nxgt/material/components';
+
+<Switcher
+	label="Establishment"
+	value={school}
+	onValueChange={setSchool}
+	options={[
+		{ id: 'ljc', title: 'Lycée Joss', subtitle: 'Lycée · Douala', icon: <Icon name="school" />, tone: 'primary' },
+		{ id: 'src', title: 'École La Source', subtitle: 'Primaire · Bafoussam', icon: <Icon name="graduation-cap" />, tone: 'success' },
+	]}
+	footer={{ onSelect: () => navigate('/establishments') }}
+/>;
+```
+
+### Classes: search, groups and links
+
+Eight options or more (or `searchable`) open a popover with a search field. It is a combobox over a listbox: typing filters on the title, the subtitle and the group (accents and case ignored), the arrows move the active option, Enter chooses it and gives the focus back to the trigger. Options with a `group` are listed under its header, and put the pupil count in the subtitle **or** in `badge`, not both.
+
+With `getHref` each option is a link, for a switcher that is a navigation (`/classes/6b`): the panel is a `nav` of links with `aria-current="page"` on the chosen one (no `listbox` role), and the arrows move the real focus. Pass your router's link as `linkComponent`, as for `ListTile` and `AccountMenu`:
+
+```tsx
+import { Link } from 'react-router';
+import { Switcher, type AppShellLinkComponent } from '@nxgt/material/components';
+
+// Hoisted, outside the render: not a new component on every render.
+const RouterLink: AppShellLinkComponent = ({ href, ...props }) => <Link to={href} {...props} />;
+
+<Switcher
+	label="Class"
+	value={classId}
+	options={classes} // { id: '6b', title: '6e B', subtitle: 'Mathematics · 26 pupils', group: '6e', tone: 'primary' }
+	getHref={(item) => `/classes/${item.id}`}
+	linkComponent={RouterLink}
+	footer={{ label: 'Manage my classes…', href: '/classes' }}
+/>;
+```
+
+### Expressive
+
+`variant="expressive"` is a pill that opens a larger panel (always with a search). `recent` lists up to 3 option ids shown as tiles above the groups while nothing is typed; `badge` draws a soft badge after the title. On a phone the sheet is full height with a close button.
+
+```tsx
+<Switcher
+	variant="expressive"
+	label="Class"
+	value={classId}
+	onValueChange={setClassId}
+	options={classes.map((c) => ({ ...c, badge: c.pupils }))}
+	recent={['6b', 't1', '4a']}
+/>
+```
+
+A title that does not fit the trigger is cut with an ellipsis: the span carries the full title in `aria-label` (what `expectNoTextOverflow` of `@nxgt/playwright` reads), hovering or focusing the trigger shows it with the subtitle in a tooltip, and the trigger's accessible name is the label, the full title and the subtitle.
+
 | Prop | Type | Default | Effect |
 | --- | --- | --- | --- |
-| `options` | `SwitcherItem[]` | — | `{ id, title, subtitle?, icon? }`; without `icon` an initial avatar is shown |
+| `options` | `SwitcherItem[]` | — | see below |
 | `value` | `string` | — | the active `id` |
 | `onValueChange` | `(value: string) => void` | — | |
-| `label` | `ReactNode` | — | heading of the menu |
+| `label` | `ReactNode` | — | what is switched: names the trigger, the panel and the list |
+| `variant` | `'default' \| 'expressive'` | `'default'` | tile trigger and menu, or pill and large panel |
+| `searchable` | `boolean` | from 8 options (always, expressive) | the search field of the panel; `true` also replaces the menu with the panel |
+| `recent` | `string[]` | — | up to 3 option ids shown as tiles (expressive) |
+| `getHref` | `(item) => string \| undefined` | — | link mode; falls back to `item.href` |
+| `linkComponent` | `LinkComponent` | `<a>` | your router's link: takes `href`, spreads every prop, forwards `ref` |
+| `footer` | `{ label?, onSelect?, href? }` | — | a "Manage…" button (a link with `href`) at the end of the panel; `label` defaults to `material.switcher.manage` |
+| `emptyLabel` | `ReactNode` | `material.switcher.empty` | shown when the search matches nothing |
+| `sheet` | `boolean` | on a phone | `true` always opens a sheet, `false` never |
+| `name`, button props | `ComponentProps<'button'>` | — | spread on the trigger; `name` is its `data-pw` |
+
+`SwitcherItem`: `{ id, title, subtitle?, icon?, group?, initial?, tone?, badge?, href?, disabled? }`.
+
+Strings (the search field, "Recent", "Manage…", the empty and result texts) are `material.switcher.*` keys, in English and French.
 
 **Emits:** `string` (the item `id`). No form wrapper — it switches context,
 it is not a form value.
-**Storybook:** `Selection & choice/Switcher` · **Vue:** `Switcher`
+**Storybook:** `Selection & choice/Switcher` (and `/Behaviour`) · **Vue:** `Switcher` (the earlier look; the modern one is React only for now)

package/docs/guides/i18n.md

@@ -275,7 +275,7 @@ children, `Spinner`'s and `ScrollToTop`'s `aria-label`, `LocationMarker`'s
 
 `Filter variant="bar"` words everything through its own keys,
 overridable like the rest: `material.filter.bar.*` (`label` "Filters" for its
-`search` landmark, `search`, `active` "Active filters" for the chip list,
+`search` landmark, `search`, `search-min` "Type at least {min} character(s) to search" (the hint under the search while it is shorter than `searchMinLength`; a plural), `active` "Active filters" for the chip list,
 `locked` "Locked" and `locked-reason` "Locked: {reason}" (a locked
 chip's description), and a chip's words: `chip` "{field} {operator}
 {value}", `chip-plain`, `remove` "Remove {field}: {value}", `quick-active`;

package/docs/guides/server-lists-url.md

@@ -144,6 +144,12 @@ export default function Students({ loaderData }: Route.ComponentProps) {
   never leaves you on a page that no longer exists. `serializeFilterQuery`
   copies `into`, it does not change it, and it replaces the search, every `f=`,
   every aliased param and the `reset` ones.
+- **The search on Enter.** Every applied edit is one URL write, hence one
+  loader call. `searchApply: 'enter'` (on `Filter`, or `ServerTable`'s
+  `filter`) writes the search only when Enter is pressed, and
+  `searchMinLength` keeps a too-short text out of the URL; clearing the field
+  writes at once. Typing in between writes nothing, so a loader whose every
+  read is audited is called once per search.
 - **`resultCount` and `loading`** drive the bar's one live region: it waits
   for `loading` to end, then tells the count once.
 - **A readable URL.** `` `?${written}` `` prints `f=level:in:CE1,CE2`. Passing
@@ -151,6 +157,12 @@ export default function Students({ loaderData }: Route.ComponentProps) {
   re-encodes them (`f=level%3Ain%3ACE1%2CCE2`), which parses back the same. To
   compare a URL you wrote with the one the router hands back, use
   `paramsKey(a) === paramsKey(b)`.
+- **The same options on both sides.** If the loader parses with
+  `keepKnownValues: true` (or writes `encoding: 'standard'`), give
+  `ServerTable` the same: `filter={{ model, codec: { keepKnownValues: true,
+  encoding: 'standard' } }}`. Without it the page drops a condition such as
+  `f=level:in:a,zzz` whole and shows no chip, while the loader keeps `a` and
+  filters the rows.
 - **Standard encoding.** If your list URLs are already written the
   `URLSearchParams` way (`status=a%2Cb`), pass `encoding: 'standard'` to
   `serializeFilterQuery` (and to `tableFilters` / `withoutFilters`): the params