@lynn123411/dsh-model-submenu 0.2.5 → 0.3.1

package/lib/client.js

@@ -8,8 +8,38 @@ window.__ModuleLoader__.load({
 		let react_dom = require("react-dom");
 		let _deepseek_ai_dsh_client_ui_primitives = require("@deepseek-ai/dsh-client-ui-primitives");
 		let react_jsx_runtime = require("react/jsx-runtime");
+		//#region src/client/icons.tsx
+		/**
+		* The one glyph this plugin draws itself.
+		*
+		* The shared icon library carries no star, so the favorite mark is defined here:
+		* a five-point star whose outline and fill use the same path, which keeps the
+		* hover-only outline and the standing filled state identical in geometry.
+		*/
+		/**
+		* Render the favorite star.
+		* @param props.filled - draw the solid star; otherwise the outline.
+		* @param props.size - square edge in pixels, matching the shared icon set's default.
+		* @param props.className - extra class for colour and placement.
+		* @returns the inline SVG.
+		*/
+		function StarIcon({ filled, size = 14, className }) {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+				width: size,
+				height: size,
+				viewBox: "0 0 24 24",
+				fill: filled ? "currentColor" : "none",
+				stroke: "currentColor",
+				strokeWidth: filled ? 0 : 1.6,
+				strokeLinejoin: "round",
+				"aria-hidden": "true",
+				className,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M12 3.2l2.7 5.6 6.1.85-4.45 4.3 1.08 6.05L12 17.1l-5.43 2.9 1.08-6.05L3.2 9.65l6.1-.85z" })
+			});
+		}
+		//#endregion
 		//#region \0dsh-css:/Users/tny/Desktop/work/my-dsh/plugins/dsh-model-submenu/src/client/ModelSubmenu.module.css.mjs
-		const css = ".FOsK3a_root{min-width:0;position:relative}.FOsK3a_trigger{min-width:0;max-width:min(360px,45cqw);height:28px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;border-radius:24px;outline:none;align-items:center;gap:4px;padding:0 4px 0 8px;font-size:13px;font-weight:500;line-height:20px;display:flex}.FOsK3a_trigger:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}.FOsK3a_trigger:focus-visible{box-shadow:0 0 0 2px var(--dsw-alias-border-l3)}.FOsK3a_trigger:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}.FOsK3a_triggerLabel{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.FOsK3a_triggerEffort{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--dsw-alias-label-caption);flex-shrink:1000;overflow:hidden}.FOsK3a_triggerIcon{flex:none;display:none}@container (width<=360px){.FOsK3a_triggerIcon{display:block}.FOsK3a_triggerLabel,.FOsK3a_triggerEffort{display:none}}.FOsK3a_chevron{color:var(--dsw-alias-label-caption);flex:none;transition:transform .12s}.FOsK3a_chevronOpen{transform:rotate(180deg)}.FOsK3a_menu{z-index:1100;--dsw-elevation-stroke-color:var(--dsw-alias-border-l1);width:max-content;min-width:min(240px,100vw - 32px);max-width:min(420px,100vw - 32px);max-height:min(360px,100vh - 96px);box-shadow:var(--dsw-elevation-prominent);color:var(--dsw-alias-label-primary);--dsh-scrollbar-thumb:var(--dsw-alias-scrollbar-bg-l2);--dsh-scrollbar-thumb-hover:var(--dsw-alias-scrollbar-hover-l2);border:0;flex-direction:column;padding:4px;display:flex;position:fixed;overflow:hidden}.FOsK3a_status,.FOsK3a_empty{color:var(--dsw-alias-label-tertiary);padding:10px;font-size:13px;line-height:20px}.FOsK3a_error,.FOsK3a_warning{background:var(--dsw-alias-interactive-bg-hover-danger);color:var(--dsw-alias-state-error-primary);border-radius:8px;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:4px;padding:7px 8px;font-size:12px;line-height:18px;display:flex}.FOsK3a_warning{background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-state-warn-label)}.FOsK3a_retry{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;flex:none;padding:0;font-weight:600}.FOsK3a_groups{min-height:0;overflow-y:auto}.FOsK3a_option{box-sizing:border-box;width:auto;min-width:100%;min-height:38px;color:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:10px;outline:none;align-items:center;gap:8px;padding:6px 8px;display:flex}.FOsK3a_option:hover:not(:disabled),.FOsK3a_option:focus-visible{background:var(--dsw-alias-interactive-bg-hover)}.FOsK3a_selected{background:0 0}.FOsK3a_option:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}.FOsK3a_optionCopy{flex-direction:column;flex:1;min-width:0;display:flex}.FOsK3a_modelName{color:inherit;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;line-height:20px;overflow:hidden}.FOsK3a_check{color:var(--dsw-alias-label-primary);flex:0 0 18px;place-items:center;display:grid}.FOsK3a_cell{box-sizing:border-box;width:auto;min-width:100%;height:40px;color:var(--dsw-alias-label-primary);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:10px;align-items:center;gap:8px;padding:0 10px;font-size:14px;line-height:22px;display:flex}.FOsK3a_cell:hover{background:var(--dsw-alias-interactive-bg-hover)}.FOsK3a_cellLabel{white-space:nowrap;flex:none}.FOsK3a_cellValue{text-overflow:ellipsis;white-space:nowrap;text-align:right;min-width:0;color:var(--dsw-alias-label-tertiary);flex:auto;overflow:hidden}.FOsK3a_cellChevron{color:var(--dsw-alias-label-tertiary);flex:none}";
+		const css = ".FOsK3a_root{min-width:0;display:flex;position:relative}.FOsK3a_trigger{min-width:0;max-width:min(360px,45cqw);height:28px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;border-radius:24px;outline:none;align-items:center;gap:4px;padding:0 4px 0 8px;font-size:13px;font-weight:500;line-height:20px;display:flex}.FOsK3a_trigger:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}.FOsK3a_trigger:focus-visible{box-shadow:0 0 0 2px var(--dsw-alias-border-l3)}.FOsK3a_trigger:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}.FOsK3a_triggerLabel{text-overflow:ellipsis;white-space:nowrap;min-width:0;display:var(--dsh-composer-model-text-display,block);overflow:hidden}.FOsK3a_triggerEffort{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--dsw-alias-state-business-primary);display:var(--dsh-composer-model-text-display,block);flex-shrink:1000;overflow:hidden}.FOsK3a_triggerIcon{display:var(--dsh-composer-model-icon-display,none);flex:none}.FOsK3a_chevron{color:var(--dsw-alias-label-caption);flex:none;transition:transform .12s}.FOsK3a_chevronOpen{transform:rotate(180deg)}.FOsK3a_menu{z-index:1100;--dsw-elevation-stroke-color:var(--dsw-alias-border-l1);box-sizing:border-box;width:min(252px,100vw - 24px);max-height:min(70vh,100vh - 96px);box-shadow:var(--dsw-elevation-prominent);color:var(--dsw-alias-label-primary);--dsh-scrollbar-thumb:var(--dsw-alias-scrollbar-bg-l2);--dsh-scrollbar-thumb-hover:var(--dsw-alias-scrollbar-hover-l2);border:0;flex-direction:column;padding:4px;display:flex;position:fixed;overflow:hidden}.FOsK3a_providerName{text-overflow:ellipsis;white-space:nowrap;min-height:24px;color:var(--dsw-alias-label-tertiary);align-items:center;padding:3px 8px;font-size:12px;font-weight:500;line-height:18px;display:flex;overflow:hidden}.FOsK3a_groups{min-height:0;overflow-y:auto}.FOsK3a_row{align-items:center;gap:2px;display:flex}.FOsK3a_rowPick{box-sizing:border-box;width:100%;min-width:0;min-height:34px;color:inherit;text-align:left;cursor:pointer;padding-inline:6px;background:0 0;border:none;border-radius:10px;outline:none;flex:1;align-items:center;gap:4px;padding:5px 7px;display:flex}.FOsK3a_rowPick:hover:not(:disabled),.FOsK3a_rowPick:focus-visible{background:var(--dsw-alias-interactive-bg-hover)}.FOsK3a_rowPick:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}.FOsK3a_rowCopy{flex-direction:column;flex:1;min-width:0;display:flex}.FOsK3a_rowName{color:inherit;text-overflow:ellipsis;white-space:nowrap;font-size:11.5px;font-weight:400;line-height:17px;overflow:hidden}.FOsK3a_menu .FOsK3a_rowName{font-weight:600}.FOsK3a_rowMeta{color:var(--dsw-alias-label-tertiary);text-overflow:ellipsis;white-space:nowrap;font-size:12px;line-height:18px;overflow:hidden}.FOsK3a_check{color:var(--dsw-alias-label-primary);flex:0 0 15px;place-items:center;display:grid}.FOsK3a_starStatic{color:var(--dsw-alias-state-warn-primary);flex:none;place-items:center;width:14px;display:grid}.FOsK3a_starButton{color:var(--dsw-alias-label-tertiary);cursor:pointer;opacity:0;background:0 0;border:none;border-radius:8px;outline:none;flex:none;place-items:center;width:26px;height:26px;display:grid}.FOsK3a_starButton:focus-visible{outline:2px solid var(--dsw-alias-border-l3)}.FOsK3a_row:hover .FOsK3a_starButton,.FOsK3a_row:focus-within .FOsK3a_starButton{opacity:1}.FOsK3a_starButton[aria-pressed=true]{color:var(--dsw-alias-state-warn-primary);opacity:1}@media (hover:none){.FOsK3a_starButton{opacity:1}}.FOsK3a_star{flex:none}.FOsK3a_divider{background:var(--dsw-alias-border-l2);flex:none;height:.5px;margin:3px 2px}.FOsK3a_effortRow{align-items:center;gap:6px;padding:3px 6px;display:flex}.FOsK3a_effortHeading{color:var(--dsw-alias-label-primary);flex:none;font-size:12px;line-height:18px}.FOsK3a_effortTrack{background:var(--dsw-alias-interactive-bg-hover);scrollbar-width:none;border-radius:999px;align-items:center;gap:1px;min-width:0;margin-left:auto;padding:2px;display:flex;overflow-x:auto}.FOsK3a_effortTrack::-webkit-scrollbar{display:none}.FOsK3a_effortSegment{color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;border-radius:999px;outline:none;flex:none;padding:2px 7px;font-size:11px;line-height:16px}.FOsK3a_effortSegment:hover:not(:disabled){color:var(--dsw-alias-label-primary)}.FOsK3a_effortSegment[aria-checked=true]{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-1);box-shadow:var(--dsw-elevation-soft);font-weight:600}.FOsK3a_effortSegment:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}.FOsK3a_effortSegment:focus-visible{outline:2px solid var(--dsw-alias-border-l3);outline-offset:-2px}.FOsK3a_hint{color:var(--dsw-alias-label-tertiary);margin:0;padding:6px 8px;font-size:11px;line-height:16px}.FOsK3a_moreRow{color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;border-radius:10px;outline:none;align-items:center;gap:6px;min-height:32px;padding:5px 8px;font-size:12px;line-height:18px;display:flex}.FOsK3a_moreRow:hover,.FOsK3a_moreRow:focus-visible{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-interactive-bg-hover)}.FOsK3a_moreIcon{color:var(--dsw-alias-label-tertiary);flex:none}.FOsK3a_notice{color:var(--dsw-alias-label-tertiary);justify-content:space-between;align-items:flex-start;gap:8px;padding:6px 10px;font-size:12px;line-height:18px;display:flex}.FOsK3a_retry{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;flex:none;padding:0;font-weight:600;text-decoration:underline}.FOsK3a_pickerDialog{gap:0;width:min(680px,100%);height:min(640px,80vh);padding:0}.FOsK3a_pickerContent,.FOsK3a_pickerContent>:last-child{flex-direction:column;flex:1;min-height:0;display:flex}.FOsK3a_pickerSearch{padding:0 20px 12px}.FOsK3a_pickerSearchInput{width:100%}.FOsK3a_pickerTabs{border-bottom:.5px solid var(--dsw-alias-border-l2);flex-wrap:wrap;gap:2px;padding:0 16px;display:flex}.FOsK3a_pickerTab{color:var(--dsw-alias-label-secondary);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:8px;outline:none;padding:6px 10px;font-size:13px;line-height:18px}.FOsK3a_pickerTab:hover{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-interactive-bg-hover)}.FOsK3a_pickerTab[aria-selected=true]{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-interactive-bg-hover);font-weight:600}.FOsK3a_pickerTab:focus-visible{outline:2px solid var(--dsw-alias-border-l3)}.FOsK3a_pickerList{flex:1;min-height:0;padding:8px 12px;overflow-y:auto}.FOsK3a_pickerFooter{border-top:.5px solid var(--dsw-alias-border-l2);color:var(--dsw-alias-label-tertiary);align-items:center;gap:6px;padding:10px 20px;font-size:12px;line-height:18px;display:flex}.FOsK3a_footerHint{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.FOsK3a_footerDot{color:var(--dsw-alias-label-dimmed)}";
 		const tagId = "@lynn123411/dsh-model-submenu/ModelSubmenu.module.css";
 		if (typeof document !== "undefined") {
 			let tag = document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]");
@@ -22,31 +52,786 @@ window.__ModuleLoader__.load({
 			tag.textContent = css;
 		}
 		var ModelSubmenu_module_css_default = {
-			"cell": "FOsK3a_cell",
-			"cellChevron": "FOsK3a_cellChevron",
-			"cellLabel": "FOsK3a_cellLabel",
-			"cellValue": "FOsK3a_cellValue",
 			"check": "FOsK3a_check",
 			"chevron": "FOsK3a_chevron",
 			"chevronOpen": "FOsK3a_chevronOpen",
-			"empty": "FOsK3a_empty",
-			"error": "FOsK3a_error",
+			"divider": "FOsK3a_divider",
+			"effortHeading": "FOsK3a_effortHeading",
+			"effortRow": "FOsK3a_effortRow",
+			"effortSegment": "FOsK3a_effortSegment",
+			"effortTrack": "FOsK3a_effortTrack",
+			"footerDot": "FOsK3a_footerDot",
+			"footerHint": "FOsK3a_footerHint",
 			"groups": "FOsK3a_groups",
+			"hint": "FOsK3a_hint",
 			"menu": "FOsK3a_menu",
-			"modelName": "FOsK3a_modelName",
-			"option": "FOsK3a_option",
-			"optionCopy": "FOsK3a_optionCopy",
+			"moreIcon": "FOsK3a_moreIcon",
+			"moreRow": "FOsK3a_moreRow",
+			"notice": "FOsK3a_notice",
+			"pickerContent": "FOsK3a_pickerContent",
+			"pickerDialog": "FOsK3a_pickerDialog",
+			"pickerFooter": "FOsK3a_pickerFooter",
+			"pickerList": "FOsK3a_pickerList",
+			"pickerSearch": "FOsK3a_pickerSearch",
+			"pickerSearchInput": "FOsK3a_pickerSearchInput",
+			"pickerTab": "FOsK3a_pickerTab",
+			"pickerTabs": "FOsK3a_pickerTabs",
+			"providerName": "FOsK3a_providerName",
 			"retry": "FOsK3a_retry",
 			"root": "FOsK3a_root",
-			"selected": "FOsK3a_selected",
-			"status": "FOsK3a_status",
+			"row": "FOsK3a_row",
+			"rowCopy": "FOsK3a_rowCopy",
+			"rowMeta": "FOsK3a_rowMeta",
+			"rowName": "FOsK3a_rowName",
+			"rowPick": "FOsK3a_rowPick",
+			"star": "FOsK3a_star",
+			"starButton": "FOsK3a_starButton",
+			"starStatic": "FOsK3a_starStatic",
 			"trigger": "FOsK3a_trigger",
 			"triggerEffort": "FOsK3a_triggerEffort",
 			"triggerIcon": "FOsK3a_triggerIcon",
-			"triggerLabel": "FOsK3a_triggerLabel",
-			"warning": "FOsK3a_warning"
+			"triggerLabel": "FOsK3a_triggerLabel"
 		};
 		//#endregion
+		//#region src/client/ModelRow.tsx
+		/**
+		* Render one model row.
+		* @param props - the row's content and behaviour.
+		* @returns the row element.
+		*/
+		function ModelRow({ name, selected, busy, star, favorited, meta, starLabel, starTabStop = false, rowTabIndex, onPick, onFocusRow, onToggleFavorite, children }) {
+			const copy = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+				className: ModelSubmenu_module_css_default.rowCopy,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: ModelSubmenu_module_css_default.rowName,
+					children: name
+				}), meta !== void 0 && meta !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: ModelSubmenu_module_css_default.rowMeta,
+					children: meta
+				})]
+			}) });
+			const mark = favorited ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StarIcon, {
+				filled: true,
+				className: ModelSubmenu_module_css_default.star
+			}) : null;
+			if (star === "static") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				role: "menuitemradio",
+				"aria-checked": selected,
+				tabIndex: rowTabIndex,
+				className: ModelSubmenu_module_css_default.rowPick,
+				title: name,
+				disabled: busy,
+				onClick: onPick,
+				onFocus: onFocusRow,
+				"data-selected": selected ? "" : void 0,
+				"data-favorited": favorited ? "" : void 0,
+				children: [
+					copy,
+					mark !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: ModelSubmenu_module_css_default.starStatic,
+						"aria-hidden": "true",
+						children: mark
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: ModelSubmenu_module_css_default.check,
+						"aria-hidden": !selected,
+						children: selected ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {}) : null
+					}),
+					children
+				]
+			});
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: ModelSubmenu_module_css_default.row,
+				"data-selected": selected ? "" : void 0,
+				"data-favorited": favorited ? "" : void 0,
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						role: "menuitemradio",
+						"aria-checked": selected,
+						tabIndex: rowTabIndex,
+						className: ModelSubmenu_module_css_default.rowPick,
+						title: name,
+						disabled: busy,
+						onClick: onPick,
+						onFocus: onFocusRow,
+						children: copy
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: ModelSubmenu_module_css_default.starButton,
+						"aria-pressed": favorited,
+						"aria-label": starLabel,
+						tabIndex: starTabStop ? 0 : -1,
+						disabled: busy,
+						onClick: onToggleFavorite,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StarIcon, {
+							filled: favorited,
+							className: ModelSubmenu_module_css_default.star
+						})
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: ModelSubmenu_module_css_default.check,
+						"aria-hidden": !selected,
+						children: selected ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {}) : null
+					}),
+					children
+				]
+			});
+		}
+		//#endregion
+		//#region src/client/favorites.ts
+		/** The single browser-wide storage key holding the whole table. */
+		const FAVORITES_KEY = "dsh-model-submenu.favorites";
+		/**
+		* Read the table, keeping only rows that name both halves.
+		* @param storage - browser storage, or undefined when the browser withholds it.
+		* @returns the stored favorites in stored order; empty when unreadable.
+		*/
+		function readFavorites(storage) {
+			const raw = getItem$1(storage);
+			if (raw === null) return [];
+			let parsed;
+			try {
+				parsed = JSON.parse(raw);
+			} catch {
+				return [];
+			}
+			if (!Array.isArray(parsed)) return [];
+			return parsed.filter((row) => typeof row === "object" && row !== null && typeof row.provider === "string" && typeof row.model === "string");
+		}
+		/**
+		* Add or remove one model, writing the whole table back.
+		* @param storage - browser storage, or undefined when writes are unavailable.
+		* @param provider - the provider route key.
+		* @param model - the model id inside that provider.
+		* @returns the table after the change, whether or not the write landed.
+		*/
+		function toggleFavorite(storage, provider, model) {
+			const current = readFavorites(storage);
+			const next = isFavorite(current, provider, model) ? current.filter((row) => row.provider !== provider || row.model !== model) : [...current, {
+				provider,
+				model
+			}];
+			try {
+				storage?.setItem(FAVORITES_KEY, JSON.stringify(next));
+			} catch {}
+			return next;
+		}
+		/**
+		* @param favorites - the table to search.
+		* @param provider - the provider route key.
+		* @param model - the model id inside that provider.
+		* @returns whether that exact pair is favorited.
+		*/
+		function isFavorite(favorites, provider, model) {
+			return favorites.some((row) => row.provider === provider && row.model === model);
+		}
+		/**
+		* Stable-partition a catalog so favorited rows lead, each part keeping the
+		* catalog's own order.
+		* @param rows - the catalog in its display order.
+		* @param favorited - predicate answering whether one row is favorited.
+		* @returns a new list; the input order when nothing is favorited.
+		*/
+		function orderWithFavorites(rows, favorited) {
+			const starred = rows.filter(favorited);
+			if (starred.length === 0) return rows;
+			return [...starred, ...rows.filter((row) => !favorited(row))];
+		}
+		function getItem$1(storage) {
+			try {
+				return storage?.getItem("dsh-model-submenu.favorites") ?? null;
+			} catch {
+				return null;
+			}
+		}
+		//#endregion
+		//#region src/client/model-facts.ts
+		/**
+		* The model knowledge a shipped adapter carries for its own account route.
+		*
+		* The account route has no `models` list on purpose: the account listing
+		* supplies the catalog and settings only carry per-model overrides. The same
+		* adapter family ships a default catalog for its API-key route, and the account
+		* route serves the same models, so those entries answer what the account
+		* profile cannot. Ids and facts mirror the adapter's own table.
+		*/
+		const FAMILY_DEFAULTS = { "deepseek-account": [{
+			id: "deepseek-flash",
+			contextWindow: 1e6,
+			images: true
+		}, {
+			id: "deepseek-v4-pro",
+			contextWindow: 1e6,
+			images: false
+		}] };
+		/**
+		* Build the fact lookup from the settings answer.
+		* @param providers - provider directory rows giving each route's settings address.
+		* @param namespaces - the describe answer's namespace views.
+		* @returns a lookup answering both fields for one provider and model.
+		*/
+		function buildModelFacts(providers, namespaces) {
+			const byName = new Map(namespaces.map((row) => [row.ns, row.value]));
+			const profiles = /* @__PURE__ */ new Map();
+			for (const row of providers) {
+				const profile = readPath(byName.get(row.settingsNs), row.settingsPath);
+				if (isRecord(profile)) profiles.set(row.provider, profile);
+			}
+			return (provider, model) => {
+				const profile = profiles.get(provider);
+				const entry = profile?.models === void 0 ? void 0 : profile.models.find((candidate) => candidate.id === model);
+				if (profile !== void 0 && entry !== void 0) return {
+					contextWindow: typeof entry.contextWindow === "number" && entry.contextWindow > 0 ? entry.contextWindow : void 0,
+					images: imageAnswer(entry, profile)
+				};
+				const override = readOverride(profile, model);
+				if (override !== void 0) return {
+					contextWindow: typeof override.contextWindow === "number" && override.contextWindow > 0 ? override.contextWindow : void 0,
+					images: Array.isArray(override.inputModalities) ? containsImage(override.inputModalities) : "unknown"
+				};
+				const family = FAMILY_DEFAULTS[provider]?.find((candidate) => candidate.id === model);
+				return family === void 0 ? {
+					contextWindow: void 0,
+					images: "unknown"
+				} : {
+					contextWindow: family.contextWindow,
+					images: family.images ? "yes" : "no"
+				};
+			};
+		}
+		/**
+		* Read one model entry's accepted image modalities.
+		*
+		* The two adapter families disagree about an omission. The Messages family
+		* names the field `inputModalities`, and leaving it out means text only. The
+		* pi-ai family names it `input`, and an empty or absent list defers to the
+		* route's `defaultInput`; with no route default the answer stays unknown.
+		*/
+		function imageAnswer(entry, profile) {
+			if (Array.isArray(entry.inputModalities)) return containsImage(entry.inputModalities);
+			const defaultInput = Array.isArray(profile.defaultInput) ? profile.defaultInput : void 0;
+			if (Array.isArray(entry.input)) {
+				if (entry.input.length > 0) return containsImage(entry.input);
+				return defaultInput === void 0 ? "unknown" : containsImage(defaultInput);
+			}
+			return defaultInput === void 0 ? "no" : containsImage(defaultInput);
+		}
+		/** One model's declared override, when the route keeps a `modelOverrides` table. */
+		function readOverride(profile, model) {
+			const overrides = profile?.modelOverrides;
+			if (!isRecord(overrides)) return void 0;
+			const entry = overrides[model];
+			return isRecord(entry) ? entry : void 0;
+		}
+		function containsImage(modalities) {
+			return modalities.includes("image") ? "yes" : "no";
+		}
+		/**
+		* Abbreviate one capacity the way the metadata line shows it.
+		* @param tokens - exact advertised capacity in tokens.
+		* @returns e.g. `1M ctx`, `1.5M ctx`, `272k ctx`, or `512 ctx` below a thousand.
+		*/
+		function formatContextWindow(tokens) {
+			if (tokens >= 1e6) return `${trimNumber(tokens / 1e6)}M ctx`;
+			if (tokens >= 1e3) return `${Math.round(tokens / 1e3)}k ctx`;
+			return `${tokens} ctx`;
+		}
+		/**
+		* Build the metadata line's segments.
+		* @param input.providerName - the provider's display name, omitted inside that provider's own tab.
+		* @param input.facts - what the settings document answered.
+		* @param input.thinks - whether the catalog advertises reasoning levels for this model.
+		* @param input.effortLabel - the localized word for the reasoning segment.
+		* @param input.imageLabel - the localized word for the image segment.
+		* @returns the segments to join; an empty list means show no line.
+		*/
+		function metaSegments(input) {
+			const segments = [];
+			if (input.providerName !== void 0) segments.push(input.providerName);
+			if (input.facts.contextWindow !== void 0) segments.push(formatContextWindow(input.facts.contextWindow));
+			if (input.thinks) segments.push(input.effortLabel);
+			if (input.facts.images === "yes") segments.push(input.imageLabel);
+			return segments;
+		}
+		function trimNumber(value) {
+			const rounded = Math.round(value * 10) / 10;
+			return Number.isInteger(rounded) ? String(rounded) : rounded.toFixed(1);
+		}
+		function readPath(value, path) {
+			let cursor = value;
+			for (const key of path) {
+				if (!isRecord(cursor)) return void 0;
+				cursor = cursor[key];
+			}
+			return cursor;
+		}
+		function isRecord(value) {
+			return typeof value === "object" && value !== null && !Array.isArray(value);
+		}
+		/**
+		* Flatten the catalog to one row per model.
+		* @param groups - the shared directory's provider groups, in display order.
+		* @returns the rows in catalog order.
+		*/
+		function flattenGroups(groups) {
+			return groups.flatMap((group) => group.models.map((model) => ({
+				provider: group.id,
+				providerName: group.name,
+				model: model.id,
+				entry: model
+			})));
+		}
+		/**
+		* Build the picker's tabs: the all-tab, then one per provider that has a model.
+		* @param groups - the shared directory's provider groups.
+		* @param allLabel - localized label for the all-tab.
+		* @returns the tabs in catalog order.
+		*/
+		function pickerTabs(groups, allLabel = "All") {
+			return [{
+				id: "*",
+				label: allLabel
+			}, ...groups.filter((group) => group.models.length > 0).map((group) => ({
+				id: group.id,
+				label: group.name
+			}))];
+		}
+		/**
+		* @param rows - the flat catalog.
+		* @param tab - the tab id; the all-tab keeps every row.
+		* @returns the rows the tab shows, in their current order.
+		*/
+		function rowsForTab(rows, tab) {
+			return tab === "*" ? rows : rows.filter((row) => row.provider === tab);
+		}
+		/**
+		* Shape rows as the shell's ranker candidates: the model name is the name, the
+		* provider display name is the second key, so a query reaches either.
+		* @param rows - the rows to search.
+		* @returns candidates in row order.
+		*/
+		function searchCandidates(rows) {
+			return rows.map((row) => ({
+				name: row.entry.name,
+				label: row.providerName,
+				row
+			}));
+		}
+		/**
+		* Read the reasoning metadata the catalog advertises for one model.
+		* @param groups - the shared directory's provider groups.
+		* @returns the metadata, or undefined when that model advertises none.
+		*/
+		function reasoningOf(groups) {
+			return (provider, model) => groups.find((group) => group.id === provider)?.models.find((candidate) => candidate.id === model)?.reasoning;
+		}
+		/**
+		* Filter rows by a query over the model name and the provider name.
+		* @param rows - the rows to search.
+		* @param query - the typed text; an empty or blank query keeps every row.
+		* @param rank - the shell's own ranker, so this search behaves like every other one.
+		* @returns the matching rows.
+		*/
+		function searchRows(rows, query, rank) {
+			const trimmed = query.trim();
+			if (trimmed === "") return rows;
+			return rank(searchCandidates(rows), trimmed).map((match) => match.row);
+		}
+		//#endregion
+		//#region src/client/selection.ts
+		/**
+		* Build the segments for one model's reasoning row.
+		* @param reasoning - the catalog's reasoning metadata, undefined when the model has none.
+		* @param providerDefaultLabel - the localized label for the "follow the provider" segment.
+		* @returns the segments in catalog order; the provider-default one leads when the model declares no default.
+		*/
+		function effortChoices(reasoning, providerDefaultLabel) {
+			if (reasoning === void 0) return [];
+			return [...reasoning.defaultEffort === void 0 ? [{
+				key: "provider-default",
+				effort: void 0,
+				label: providerDefaultLabel
+			}] : [], ...reasoning.efforts.map((level) => ({
+				key: level.id,
+				effort: level.id,
+				label: level.name
+			}))];
+		}
+		/**
+		* The selection a level click submits.
+		* @param live - the selection in force right now.
+		* @param effort - the clicked level, undefined meaning the provider default.
+		* @returns the selection to submit, or null when the level already is the live one.
+		*/
+		function planEffortCommit(live, effort) {
+			if (sameEffort(live.reasoningEffort, effort)) return null;
+			return {
+				provider: live.provider,
+				model: live.model,
+				...effort === void 0 ? {} : { reasoningEffort: effort }
+			};
+		}
+		/**
+		* The selection a model click submits.
+		* @param live - the selection in force right now, null before a first selection resolves.
+		* @param provider - the clicked model's provider.
+		* @param model - the clicked model id.
+		* @param reasoningOf - the catalog's reasoning metadata for one provider and model.
+		* @param remembered - the level this browser last used for the target model, if any.
+		* @returns the selection to submit, or null when the click changes nothing.
+		*/
+		function planModelCommit(live, provider, model, reasoningOf, remembered) {
+			if (live !== null && sameModel(live, provider, model)) return null;
+			const offered = reasoningOf(provider, model);
+			return {
+				provider,
+				model,
+				...offered !== void 0 && remembered !== void 0 && offered.efforts.some((level) => level.id === remembered) ? { reasoningEffort: remembered } : {}
+			};
+		}
+		/**
+		* @param live - one selection.
+		* @param provider - the provider to compare.
+		* @param model - the model id to compare.
+		* @returns whether both name the same model.
+		*/
+		function sameModel(live, provider, model) {
+			return live.provider === provider && live.model === model;
+		}
+		/**
+		* @param liveEffort - the level in force, undefined meaning the provider default.
+		* @param effort - the level in question.
+		* @returns whether they name the same level.
+		*/
+		function sameEffort(liveEffort, effort) {
+			return liveEffort === effort;
+		}
+		//#endregion
+		//#region src/client/ModelPicker.tsx
+		/**
+		* The model picker: the centered dialog opened from the menu's last row.
+		*
+		* It is the one place every provider is visible at once — a search field, a tab
+		* per provider with a model, and one flat list with each model's metadata line.
+		* Favorites lead the list and can be toggled from a row's star without
+		* selecting that row. A click commits at once; a rejected commit keeps the
+		* dialog open so the user can retry or pick another model.
+		*/
+		/**
+		* Render the picker.
+		* @param props - the catalog, the live selection, and the picker's verbs.
+		* @returns the dialog; nothing while closed.
+		*/
+		function ModelPicker({ open, state, live, facts, favorites, busy, onPick, onToggleFavorite, onReload, onClose, t }) {
+			const id = (0, react.useId)();
+			const searchRef = (0, react.useRef)(null);
+			const listRef = (0, react.useRef)(null);
+			const [query, setQuery] = (0, react.useState)("");
+			const [tab, setTab] = (0, react.useState)("*");
+			const [highlight, setHighlight] = (0, react.useState)(0);
+			const tabRefs = (0, react.useRef)(/* @__PURE__ */ new Map());
+			const tabs = (0, react.useMemo)(() => pickerTabs(state.groups, t("picker.all")), [state.groups, t]);
+			const reason = (0, react.useMemo)(() => reasoningOf(state.groups), [state.groups]);
+			const rows = (0, react.useMemo)(() => orderWithFavorites(rowsForTab(flattenGroups(state.groups), tab), (row) => isFavorite(favorites, row.provider, row.model)), [
+				state.groups,
+				tab,
+				favorites
+			]);
+			const visible = (0, react.useMemo)(() => orderWithFavorites(searchRows(rows, query, _deepseek_ai_dsh_client_ui_primitives.rankByName), (row) => isFavorite(favorites, row.provider, row.model)), [
+				rows,
+				query,
+				favorites
+			]);
+			(0, react.useEffect)(() => {
+				if (!open) return;
+				setQuery("");
+				setTab("*");
+				setHighlight(0);
+				if (listRef.current !== null) listRef.current.scrollTop = 0;
+				const frame = requestAnimationFrame(() => {
+					searchRef.current?.focus();
+				});
+				return () => {
+					cancelAnimationFrame(frame);
+				};
+			}, [open]);
+			(0, react.useEffect)(() => {
+				setHighlight((current) => visible.length === 0 ? 0 : Math.min(current, visible.length - 1));
+			}, [visible.length]);
+			(0, react.useEffect)(() => {
+				(listRef.current?.querySelector(`[data-row-index="${highlight}"]`))?.scrollIntoView({ block: "nearest" });
+			}, [highlight]);
+			if (!open) return null;
+			const activeRow = visible[highlight];
+			const activeId = activeRow === void 0 ? void 0 : `${id}-row-${highlight}`;
+			const onSearchKeyDown = (event) => {
+				if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+					event.preventDefault();
+					if (visible.length === 0) return;
+					setHighlight((current) => {
+						return (current + (event.key === "ArrowDown" ? 1 : -1) + visible.length) % visible.length;
+					});
+					return;
+				}
+				if (event.key === "Enter" && activeRow !== void 0 && !busy) {
+					event.preventDefault();
+					pick(activeRow);
+				}
+			};
+			const pick = (row) => {
+				const selection = planModelCommit(live, row.provider, row.model, reason);
+				if (selection === null) {
+					onClose();
+					return;
+				}
+				onPick(selection);
+			};
+			/** Move to another tab and hand it the keyboard, in one step. */
+			const goTab = (next) => {
+				if (next === void 0 || next.id === tab) return;
+				setTab(next.id);
+				setHighlight(0);
+				tabRefs.current.get(next.id)?.focus();
+			};
+			const onTabKeyDown = (event) => {
+				const index = tabs.findIndex((candidate) => candidate.id === tab);
+				if (event.key === "ArrowRight" || event.key === "ArrowLeft") {
+					event.preventDefault();
+					const step = event.key === "ArrowRight" ? 1 : -1;
+					goTab(tabs[((index === -1 ? 0 : index) + step + tabs.length) % tabs.length]);
+					return;
+				}
+				if (event.key === "Home" || event.key === "End") {
+					event.preventDefault();
+					goTab(tabs[event.key === "Home" ? 0 : tabs.length - 1]);
+				}
+			};
+			const failures = state.failures.filter((failure) => tab === "*" || failure.id === tab);
+			const failed = state.error !== null && state.status === "error";
+			const loading = state.status === "loading";
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_deepseek_ai_dsh_client_ui_primitives.Modal, {
+				open,
+				onClose,
+				title: t("picker.title"),
+				closeLabel: t("picker.close"),
+				className: ModelSubmenu_module_css_default.pickerDialog ?? "",
+				contentClassName: ModelSubmenu_module_css_default.pickerContent ?? "",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: ModelSubmenu_module_css_default.pickerSearch,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Input, {
+							ref: searchRef,
+							className: ModelSubmenu_module_css_default.pickerSearchInput ?? "",
+							type: "text",
+							role: "searchbox",
+							"aria-label": t("picker.search"),
+							"aria-controls": `${id}-list`,
+							"aria-activedescendant": activeId,
+							placeholder: t("picker.search"),
+							icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconSearchOutlineRegular, { size: 14 }),
+							value: query,
+							readOnly: busy,
+							onChange: (event) => {
+								setQuery(event.target.value);
+							},
+							onKeyDown: onSearchKeyDown,
+							"data-modal-autofocus": ""
+						})
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: ModelSubmenu_module_css_default.pickerTabs,
+						role: "tablist",
+						"aria-label": t("picker.title"),
+						children: tabs.map((entry) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							ref: (node) => {
+								if (node === null) tabRefs.current.delete(entry.id);
+								else tabRefs.current.set(entry.id, node);
+							},
+							type: "button",
+							role: "tab",
+							id: `${id}-tab-${entry.id}`,
+							"aria-selected": entry.id === tab,
+							"aria-controls": `${id}-list`,
+							tabIndex: 0,
+							className: ModelSubmenu_module_css_default.pickerTab,
+							onClick: () => {
+								setTab(entry.id);
+								setHighlight(0);
+							},
+							onKeyDown: onTabKeyDown,
+							onFocus: () => {
+								if (entry.id !== tab) {
+									setTab(entry.id);
+									setHighlight(0);
+								}
+							},
+							children: entry.label
+						}, entry.id))
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						ref: listRef,
+						id: `${id}-list`,
+						className: ModelSubmenu_module_css_default.pickerList,
+						role: "menu",
+						"aria-label": t("picker.title"),
+						children: [
+							loading && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: ModelSubmenu_module_css_default.notice,
+								children: t("status.loading")
+							}),
+							failed && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: ModelSubmenu_module_css_default.notice,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("status.failed", { message: state.error ?? "" }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: ModelSubmenu_module_css_default.retry,
+									onClick: onReload,
+									children: t("action.reload")
+								})]
+							}),
+							failures.map((failure) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: ModelSubmenu_module_css_default.notice,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("status.providerFailed", {
+									name: failure.name,
+									message: failure.message
+								}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: ModelSubmenu_module_css_default.retry,
+									onClick: onReload,
+									children: t("action.reload")
+								})]
+							}, failure.id)),
+							visible.length === 0 && !loading && !failed && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: ModelSubmenu_module_css_default.notice,
+								children: state.groups.length === 0 ? t("status.empty") : t("picker.searchEmpty")
+							}),
+							visible.map((row, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								"data-row-index": index,
+								id: `${id}-row-${index}`,
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModelRow, {
+									name: row.entry.name,
+									selected: live?.provider === row.provider && live.model === row.model,
+									busy,
+									star: "interactive",
+									favorited: isFavorite(favorites, row.provider, row.model),
+									meta: metaLine({
+										row,
+										facts: facts(row.provider, row.model),
+										providerName: tab === "*" ? row.providerName : void 0,
+										thinks: row.entry.reasoning !== void 0,
+										effortLabel: t("meta.effort"),
+										imageLabel: t("meta.images")
+									}),
+									starLabel: isFavorite(favorites, row.provider, row.model) ? t("picker.unfavorite", { model: row.entry.name }) : t("picker.favorite", { model: row.entry.name }),
+									starTabStop: index === highlight,
+									rowTabIndex: -1,
+									onPick: () => {
+										pick(row);
+									},
+									onFocusRow: () => {
+										setHighlight(index);
+									},
+									onToggleFavorite: () => {
+										onToggleFavorite(row.provider, row.model);
+									}
+								})
+							}, `${row.provider}/${row.model}`))
+						]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: ModelSubmenu_module_css_default.pickerFooter,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: ModelSubmenu_module_css_default.footerHint,
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.ShortcutKeys, { keys: ["↑", "↓"] }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("picker.hintNavigate") }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: ModelSubmenu_module_css_default.footerDot,
+									children: "·"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.ShortcutKeys, { keys: ["Enter"] }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("picker.hintSelect") }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: ModelSubmenu_module_css_default.footerDot,
+									children: "·"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.ShortcutKeys, { keys: ["Esc"] }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("picker.hintClose") })
+							]
+						})
+					})
+				]
+			});
+		}
+		function metaLine(input) {
+			return metaSegments({
+				...input.providerName === void 0 ? {} : { providerName: input.providerName },
+				facts: input.facts,
+				thinks: input.thinks,
+				effortLabel: input.effortLabel,
+				imageLabel: input.imageLabel
+			}).join(" · ");
+		}
+		//#endregion
+		//#region src/client/effort-memory.ts
+		/** The single browser-wide storage key holding the whole memory. */
+		const EFFORTS_KEY = "dsh-model-submenu.efforts";
+		/**
+		* Read the memory, keeping only rows naming both halves and a level.
+		* @param storage - browser storage, or undefined when the browser withholds it.
+		* @returns the remembered rows; empty when unreadable.
+		*/
+		function readEfforts(storage) {
+			const raw = getItem(storage);
+			if (raw === null) return [];
+			let parsed;
+			try {
+				parsed = JSON.parse(raw);
+			} catch {
+				return [];
+			}
+			if (!Array.isArray(parsed)) return [];
+			return parsed.filter((row) => typeof row === "object" && row !== null && typeof row.provider === "string" && typeof row.model === "string" && typeof row.effort === "string" && row.effort !== "");
+		}
+		/**
+		* @param memory - the rows to search.
+		* @param provider - the provider route key.
+		* @param model - the model id inside that provider.
+		* @returns the level last chosen for that exact model, or undefined.
+		*/
+		function effortFor(memory, provider, model) {
+			return memory.find((row) => row.provider === provider && row.model === model)?.effort;
+		}
+		/**
+		* Remember one model's level, or forget it when the choice is the provider default.
+		* @param storage - browser storage, or undefined when writes are unavailable.
+		* @param provider - the provider route key.
+		* @param model - the model id inside that provider.
+		* @param effort - the chosen level, undefined meaning the provider default.
+		* @returns the memory after the change, whether or not the write landed.
+		*/
+		function rememberEffort(storage, provider, model, effort) {
+			const rest = readEfforts(storage).filter((row) => row.provider !== provider || row.model !== model);
+			const next = effort === void 0 ? rest : [...rest, {
+				provider,
+				model,
+				effort
+			}];
+			try {
+				storage?.setItem(EFFORTS_KEY, JSON.stringify(next));
+			} catch {}
+			return next;
+		}
+		function getItem(storage) {
+			try {
+				return storage?.getItem("dsh-model-submenu.efforts") ?? null;
+			} catch {
+				return null;
+			}
+		}
+		//#endregion
 		//#region src/client/ModelSubmenu.tsx
 		/** Unplaced portal card: hidden but laid out at a fixed origin so offsetWidth/offsetHeight are real. */
 		const MEASURE_STYLE = {
@@ -57,27 +842,26 @@ window.__ModuleLoader__.load({
 		const cls = (...parts) => parts.filter((part) => part !== false && part !== void 0).join(" ");
 		/**
 		* The composer's model seat (`conversation.input.model`), taken over from the
-		* built-in occupant with a provider level: the root pane keeps the built-in's
-		* two cells — 供应商 in place of 模型, plus the native 推理等级 — the provider
-		* cell drills into the catalog's providers, and a provider drills into its
-		* models before submitting. The trigger, the menu surface, the keyboard
-		* contract (arrows move, Tab settles, Escape and Shift+Tab leave a drilled pane
-		* first), the effort list and the failure surfaces are the built-in ones.
-		*/
-		function ModelSubmenu({ locked, available, directory, load, select, t }) {
+		* built-in occupant with a provider-scoped menu: one provider's models above,
+		* the reasoning row as segments, the cache warning, and the door to the picker
+		* that lists every provider.
+		*
+		* Every click commits at once: a model, a reasoning level, or the picker door.
+		* Closing the menu never writes anything, and the picker reads the level the
+		* Host already accepted, so its "current" reading is never stale.
+		*/
+		function ModelSubmenu({ locked, available, directory, load, select, t, factsSource }) {
 			const state = (0, react.useSyncExternalStore)((fn) => directory.subscribe(fn), () => directory.getSnapshot());
 			const [open, setOpen] = (0, react.useState)(false);
-			const [pane, setPane] = (0, react.useState)("root");
-			const [providerId, setProviderId] = (0, react.useState)(null);
-			const lastActionRef = (0, react.useRef)("load");
+			const [pickerOpen, setPickerOpen] = (0, react.useState)(false);
+			const [favorites, setFavorites] = (0, react.useState)(() => readFavorites(storageOf()));
+			const [memory, setMemory] = (0, react.useState)(() => readEfforts(storageOf()));
 			const [toast, setToast] = (0, react.useState)(null);
 			const toastSeq = (0, react.useRef)(0);
 			const rootRef = (0, react.useRef)(null);
 			const triggerRef = (0, react.useRef)(null);
 			const menuRef = (0, react.useRef)(null);
 			const [menuPos, setMenuPos] = (0, react.useState)(null);
-			const itemRefs = (0, react.useRef)(/* @__PURE__ */ new Map());
-			const focusIntent = (0, react.useRef)(null);
 			const id = (0, react.useId)();
 			const groups = state.groups;
 			const current = state.current;
@@ -85,47 +869,71 @@ window.__ModuleLoader__.load({
 			const currentModel = currentGroup?.models.find((model) => model.id === current?.model);
 			const reasoning = currentModel?.reasoning;
 			const effectiveEffort = current?.reasoningEffort ?? reasoning?.defaultEffort;
-			const effortLabel = reasoning === void 0 ? void 0 : effectiveEffort === void 0 ? t("effort.providerDefault") : reasoning.efforts.find((level) => level.id === effectiveEffort)?.name ?? effectiveEffort;
-			const effortChoices = (0, react.useMemo)(() => reasoning === void 0 ? [] : [...reasoning.defaultEffort === void 0 ? [{
-				key: "provider-default",
-				effort: void 0,
-				label: t("effort.providerDefault")
-			}] : [], ...reasoning.efforts.map((level) => ({
-				key: `effort:${level.id}`,
-				effort: level.id,
-				label: level.name
-			}))], [reasoning, t]);
-			const shownGroup = pane === "models" && providerId !== null ? groups.find((group) => group.id === providerId) : void 0;
+			/**
+			* The trigger's caption. A model that advertises no levels still says so in
+			* the same place: the blue caption beside the name reads 默认 rather than
+			* disappearing, so the shape of the control never changes with the model.
+			*/
+			const effortLabel = reasoning === void 0 || effectiveEffort === void 0 ? t("effort.providerDefault") : reasoning.efforts.find((level) => level.id === effectiveEffort)?.name ?? effectiveEffort;
+			const choices = (0, react.useMemo)(() => effortChoices(reasoning, t("effort.providerDefault")), [reasoning, t]);
 			const busy = state.status === "selecting";
+			const live = (0, react.useMemo)(() => selectionOf(state), [state]);
+			const reason = (0, react.useMemo)(() => reasoningOf(groups), [groups]);
+			const facts = (0, react.useSyncExternalStore)((fn) => factsSource.subscribe(fn), () => factsSource.getSnapshot());
+			const menuRows = (0, react.useMemo)(() => currentGroup === void 0 ? [] : orderWithFavorites(currentGroup.models, (model) => isFavorite(favorites, currentGroup.id, model.id)), [currentGroup, favorites]);
+			const raiseToast = (text) => {
+				toastSeq.current += 1;
+				setToast({
+					seq: toastSeq.current,
+					text
+				});
+			};
 			const reload = () => {
-				lastActionRef.current = "load";
 				load();
 			};
+			const submit = (selection, onDone, onRejected) => {
+				select(selection).then((result) => {
+					if (result === void 0 || result.ok) {
+						remember(selection.provider, selection.model, selection.reasoningEffort);
+						onDone?.();
+						return;
+					}
+					onRejected?.();
+					raiseToast(result.error.code === "session/writer-held" ? t("error.sessionInUse") : t("error.action", { message: `${result.error.code}: ${result.error.message}` }));
+				});
+			};
+			/** Close the menu. Closing writes nothing: every choice already committed on click. */
+			const closeMenu = (0, react.useCallback)((restoreFocus) => {
+				setOpen(false);
+				if (restoreFocus) queueMicrotask(() => {
+					triggerRef.current?.focus();
+				});
+			}, []);
 			(0, react.useEffect)(() => {
 				if (!open) return;
 				const closeOutside = (event) => {
 					if (rootRef.current?.contains(event.target) === true) return;
 					if (menuRef.current?.contains(event.target) === true) return;
-					setOpen(false);
-					setPane("root");
+					closeMenu(false);
 				};
 				document.addEventListener("mousedown", closeOutside);
 				return () => {
 					document.removeEventListener("mousedown", closeOutside);
 				};
-			}, [open]);
+			}, [open, closeMenu]);
 			(0, react.useEffect)(() => {
-				const intent = focusIntent.current;
-				focusIntent.current = null;
-				if (!open || intent === null) return;
-				if (intent === "initial") {
-					const checked = menuRef.current?.querySelector("[role=\"menuitemradio\"][aria-checked=\"true\"]:not([disabled]), [role=\"menuitem\"][aria-current=\"true\"]:not([disabled])");
-					const first = [...itemRefs.current].find(([key]) => !key.startsWith("back:"))?.[1];
-					(checked ?? first ?? triggerRef.current)?.focus();
-					return;
-				}
-				(itemRefs.current.get(intent) ?? triggerRef.current)?.focus();
-			}, [open, pane]);
+				if (!open) return;
+				const frame = requestAnimationFrame(() => {
+					const checked = menuRef.current?.querySelector("[role=\"menuitemradio\"][aria-checked=\"true\"]:not([disabled])");
+					const first = menuRef.current?.querySelector("[role=\"menuitemradio\"]:not([disabled])");
+					const target = checked ?? first ?? triggerRef.current;
+					target?.scrollIntoView({ block: "nearest" });
+					target?.focus();
+				});
+				return () => {
+					cancelAnimationFrame(frame);
+				};
+			}, [open]);
 			(0, react.useLayoutEffect)(() => {
 				if (!open) {
 					setMenuPos(null);
@@ -153,63 +961,72 @@ window.__ModuleLoader__.load({
 					window.removeEventListener("scroll", place, true);
 					window.removeEventListener("resize", place);
 				};
-			}, [
-				open,
-				pane,
-				state
-			]);
+			}, [open, state]);
 			if (!available) return null;
 			const show = () => {
-				setPane("root");
-				setProviderId(null);
 				setOpen(true);
 				reload();
 			};
-			const close = (restoreFocus = false) => {
+			/** The picker door: the level already landed on click, so only the surface changes. */
+			const openPicker = () => {
 				setOpen(false);
-				setPane("root");
-				setProviderId(null);
-				if (restoreFocus) queueMicrotask(() => {
-					triggerRef.current?.focus();
-				});
+				setPickerOpen(true);
 			};
-			const drill = (next) => {
-				focusIntent.current = "initial";
-				setPane(next);
+			/** Record one model's level, so switching away and back restores it. */
+			const remember = (provider, model, effort) => {
+				setMemory(rememberEffort(storageOf(), provider, model, effort));
 			};
-			/** Leave the shown pane for its parent, handing the keyboard back to the row that opened it. */
-			const back = () => {
-				if (pane === "models") {
-					focusIntent.current = providerId === null ? null : `provider:${providerId}`;
-					setPane("providers");
+			const chooseModel = (provider, model) => {
+				const picked = planModelCommit(live, provider, model.id, reason, effortFor(memory, provider, model.id));
+				if (picked === null) {
+					setOpen(false);
+					queueMicrotask(() => {
+						triggerRef.current?.focus();
+					});
 					return;
 				}
-				focusIntent.current = pane === "effort" ? "root:effort" : "root:provider";
-				setPane("root");
+				setOpen(false);
+				submit(picked, () => {
+					queueMicrotask(() => {
+						triggerRef.current?.focus();
+					});
+				}, () => {
+					setOpen(true);
+				});
 			};
+			const rowButtons = () => [...menuRef.current?.querySelectorAll("[role=\"menuitemradio\"]:not([disabled])") ?? []];
 			const moveFocus = (offset) => {
-				const items = [...itemRefs.current.values()];
+				const items = rowButtons();
 				if (items.length === 0) return;
 				const active = items.findIndex((item) => item === document.activeElement);
 				items[active === -1 ? offset > 0 ? 0 : items.length - 1 : (active + offset + items.length) % items.length]?.focus();
 			};
+			const onEffortKeyDown = (event) => {
+				if (event.key !== "ArrowLeft" && event.key !== "ArrowRight") return;
+				if (choices.length === 0 || live === null) return;
+				event.preventDefault();
+				const index = choices.findIndex((choice) => choice.effort === effectiveEffort);
+				const step = event.key === "ArrowRight" ? 1 : -1;
+				const next = choices[((index === -1 ? 0 : index) + step + choices.length) % choices.length];
+				if (next === void 0) return;
+				const pending = planEffortCommit(live, next.effort);
+				if (pending !== null) submit(pending, null);
+			};
 			const onRootKeyDown = (event) => {
 				if (event.key === "Escape" && open) {
 					event.preventDefault();
-					if (pane !== "root") back();
-					else close(true);
+					closeMenu(true);
 					return;
 				}
 				if (!open) return;
 				if (event.key === "Tab") {
 					if (event.shiftKey) {
 						event.preventDefault();
-						if (pane !== "root") back();
-						else close(true);
+						closeMenu(true);
 						return;
 					}
 					const focused = document.activeElement;
-					const rows = [...itemRefs.current.values()];
+					const rows = rowButtons();
 					if (focused instanceof HTMLButtonElement && rows.includes(focused)) {
 						event.preventDefault();
 						focused.click();
@@ -217,7 +1034,7 @@ window.__ModuleLoader__.load({
 					}
 					if (focused !== triggerRef.current) return;
 					event.preventDefault();
-					(menuRef.current?.querySelector("[role=\"menuitemradio\"][aria-checked=\"true\"]:not([disabled]), [role=\"menuitem\"][aria-current=\"true\"]:not([disabled])") ?? rows.find((item) => !item.disabled))?.focus();
+					(menuRef.current?.querySelector("[role=\"menuitemradio\"][aria-checked=\"true\"]:not([disabled])") ?? rows[0])?.focus();
 					return;
 				}
 				if (event.key === "ArrowDown" || event.key === "ArrowUp") {
@@ -225,73 +1042,28 @@ window.__ModuleLoader__.load({
 					moveFocus(event.key === "ArrowDown" ? 1 : -1);
 				}
 			};
+			/**
+			* The keyboard leaving the seat closes the menu — but that is not one of the
+			* four closing gestures that write a mark, so it closes without committing.
+			* Otherwise clicking the notice text or a divider inside the menu, which moves
+			* focus without unmounting it, would land a level nobody asked to commit.
+			*/
 			const onBlur = (event) => {
+				if (pickerOpen) return;
 				if (event.relatedTarget instanceof Node && (rootRef.current?.contains(event.relatedTarget) === true || menuRef.current?.contains(event.relatedTarget) === true)) return;
-				close();
-			};
-			const settleSelection = (result) => {
-				if (result === void 0) return;
-				if (result.ok) {
-					if (rootRef.current !== null) close(true);
-					return;
-				}
-				const { error } = result;
-				toastSeq.current += 1;
-				setToast({
-					seq: toastSeq.current,
-					text: error.code === "session/writer-held" ? t("error.sessionInUse") : t("error.action", { message: `${error.code}: ${error.message}` })
-				});
-			};
-			const submit = (selection) => {
-				lastActionRef.current = "select";
-				select(selection).then(settleSelection);
-			};
-			/** A model commits outright; its reasoning levels stay behind the root's effort cell. */
-			const chooseModel = (provider, model) => {
-				if (current?.provider === provider && current.model === model.id) {
-					close(true);
-					return;
-				}
-				submit({
-					provider,
-					model: model.id
-				});
+				setOpen(false);
 			};
-			const chooseEffort = (effort) => {
-				if (current === null) return;
-				if (effectiveEffort === effort) {
-					close(true);
-					return;
-				}
-				submit({
-					provider: current.provider,
-					model: current.model,
-					...effort === void 0 ? {} : { reasoningEffort: effort }
-				});
+			const toggleFavoriteOf = (provider, model) => {
+				setFavorites(toggleFavorite(storageOf(), provider, model));
 			};
 			const waiting = current === null && state.status === "loading";
 			const modelLabel = waiting ? t("trigger.loading") : currentModel?.name ?? (current === null ? t("trigger.fallback") : `${current.provider}/${current.model}`);
-			const triggerLabel = effortLabel === void 0 ? modelLabel : `${modelLabel} · ${effortLabel}`;
 			const triggerAria = waiting ? t("trigger.loading") : current === null ? t("trigger.selectAria") : effortLabel === void 0 ? t("trigger.aria", { model: modelLabel }) : t("trigger.ariaEffort", {
 				model: modelLabel,
 				effort: effortLabel
 			});
-			itemRefs.current = /* @__PURE__ */ new Map();
-			const itemRef = (key) => (node) => {
-				if (node === null) itemRefs.current.delete(key);
-				else itemRefs.current.set(key, node);
-			};
-			const backRow = () => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-				ref: itemRef("back"),
-				type: "button",
-				role: "menuitem",
-				className: ModelSubmenu_module_css_default.cell,
-				onClick: back,
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconChevronLeftOutlineRegular, { className: ModelSubmenu_module_css_default.cellChevron }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: ModelSubmenu_module_css_default.cellLabel,
-					children: t("back")
-				})]
-			});
+			const providerName = currentGroup?.name ?? state.failures.find((failure) => failure.id === current?.provider)?.name ?? current?.provider ?? "";
+			const providerFailure = current === null ? void 0 : state.failures.find((failure) => failure.id === current.provider);
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				ref: rootRef,
 				className: ModelSubmenu_module_css_default.root,
@@ -306,14 +1078,14 @@ window.__ModuleLoader__.load({
 						"aria-haspopup": "menu",
 						"aria-expanded": open,
 						"aria-controls": open ? `${id}-menu` : void 0,
-						title: triggerLabel,
+						title: effortLabel === void 0 ? modelLabel : `${modelLabel} · ${effortLabel}`,
 						disabled: locked,
 						onClick: () => {
-							if (open) close();
+							if (open) closeMenu(false);
 							else show();
 						},
 						children: [
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconDataOutlineRegular, {
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconFlatListOutlineRegular, {
 								className: ModelSubmenu_module_css_default.triggerIcon,
 								size: 16
 							}),
@@ -333,171 +1105,127 @@ window.__ModuleLoader__.load({
 						id: `${id}-menu`,
 						className: ModelSubmenu_module_css_default.menu,
 						style: menuPos ?? MEASURE_STYLE,
-						role: "menu",
-						"aria-label": pane === "models" && shownGroup !== void 0 ? shownGroup.name : pane === "effort" ? t("menu.effort") : t("menu.aria"),
+						role: "group",
+						"aria-label": t("menu.aria"),
 						"aria-busy": state.status === "loading" || busy,
 						children: [
-							pane === "root" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-								ref: itemRef("root:provider"),
-								type: "button",
-								role: "menuitem",
-								className: ModelSubmenu_module_css_default.cell,
-								onClick: () => drill("providers"),
-								children: [
-									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-										className: ModelSubmenu_module_css_default.cellLabel,
-										children: t("menu.provider")
-									}),
-									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-										className: ModelSubmenu_module_css_default.cellValue,
-										children: currentGroup?.name ?? current?.provider ?? ""
-									}),
-									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconChevronRightOutlineRegular, { className: ModelSubmenu_module_css_default.cellChevron })
-								]
-							}), reasoning !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-								ref: itemRef("root:effort"),
-								type: "button",
-								role: "menuitem",
-								className: ModelSubmenu_module_css_default.cell,
-								onClick: () => drill("effort"),
-								children: [
-									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-										className: ModelSubmenu_module_css_default.cellLabel,
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: ModelSubmenu_module_css_default.providerName,
+								title: providerName,
+								children: providerName
+							}),
+							state.status === "loading" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: ModelSubmenu_module_css_default.notice,
+								children: t("status.loading")
+							}),
+							state.error !== null && state.status === "error" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: ModelSubmenu_module_css_default.notice,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("status.failed", { message: state.error }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: ModelSubmenu_module_css_default.retry,
+									onClick: reload,
+									children: t("action.reload")
+								})]
+							}),
+							providerFailure !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: ModelSubmenu_module_css_default.notice,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("status.providerFailed", {
+									name: providerFailure.name,
+									message: providerFailure.message
+								}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: ModelSubmenu_module_css_default.retry,
+									onClick: reload,
+									children: t("action.reload")
+								})]
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: cls(ModelSubmenu_module_css_default.groups, "scrollable"),
+								role: "menu",
+								"aria-label": t("menu.aria"),
+								children: [menuRows.map((model) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModelRow, {
+									name: model.name,
+									selected: current !== null && currentGroup !== void 0 && current.provider === currentGroup.id && current.model === model.id,
+									busy,
+									star: "static",
+									favorited: currentGroup !== void 0 && isFavorite(favorites, currentGroup.id, model.id),
+									onPick: () => {
+										if (currentGroup !== void 0) chooseModel(currentGroup.id, model);
+									}
+								}, model.id)), menuRows.length === 0 && state.status === "ready" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: ModelSubmenu_module_css_default.notice,
+									children: t("status.empty")
+								})]
+							}),
+							choices.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: ModelSubmenu_module_css_default.divider }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: ModelSubmenu_module_css_default.effortRow,
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: ModelSubmenu_module_css_default.effortHeading,
 										children: t("menu.effort")
-									}),
-									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-										className: ModelSubmenu_module_css_default.cellValue,
-										children: effortLabel
-									}),
-									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconChevronRightOutlineRegular, { className: ModelSubmenu_module_css_default.cellChevron })
-								]
-							})] }),
-							pane === "providers" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [
-								state.status === "loading" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-									className: ModelSubmenu_module_css_default.status,
-									children: t("status.loading")
-								}),
-								state.error !== null && lastActionRef.current === "load" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-									className: ModelSubmenu_module_css_default.error,
-									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("error.action", { message: state.error }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-										type: "button",
-										className: ModelSubmenu_module_css_default.retry,
-										onClick: reload,
-										children: t("action.reload")
-									})]
-								}),
-								state.failures.map((failure) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-									className: ModelSubmenu_module_css_default.warning,
-									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("warning.groupLoad", {
-										name: failure.name,
-										message: failure.message
-									}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-										type: "button",
-										className: ModelSubmenu_module_css_default.retry,
-										onClick: reload,
-										children: t("action.reload")
-									})]
-								}, failure.id)),
-								state.status === "ready" && groups.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-									className: ModelSubmenu_module_css_default.empty,
-									children: t("empty.models")
-								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-									className: cls(ModelSubmenu_module_css_default.groups, "scrollable"),
-									children: groups.map((group) => {
-										const mine = current?.provider === group.id;
-										return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-											ref: itemRef(`provider:${group.id}`),
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										className: ModelSubmenu_module_css_default.effortTrack,
+										role: "radiogroup",
+										"aria-label": t("menu.effort"),
+										onKeyDown: onEffortKeyDown,
+										children: choices.map((choice) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 											type: "button",
-											role: "menuitem",
-											"aria-current": mine ? "true" : void 0,
-											className: ModelSubmenu_module_css_default.cell,
-											title: group.name,
+											role: "radio",
+											"aria-checked": choice.effort === effectiveEffort,
+											className: ModelSubmenu_module_css_default.effortSegment,
+											disabled: busy,
 											onClick: () => {
-												setProviderId(group.id);
-												drill("models");
+												if (live !== null) {
+													const pending = planEffortCommit(live, choice.effort);
+													if (pending !== null) submit(pending, null);
+												}
 											},
-											children: [
-												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-													className: ModelSubmenu_module_css_default.cellLabel,
-													children: group.name
-												}),
-												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-													className: ModelSubmenu_module_css_default.cellValue,
-													children: mine ? currentModel?.name ?? current?.model ?? "" : t("provider.modelCount", { count: String(group.models.length) })
-												}),
-												mine && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-													className: ModelSubmenu_module_css_default.check,
-													children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {})
-												}),
-												/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconChevronRightOutlineRegular, { className: ModelSubmenu_module_css_default.cellChevron })
-											]
-										}, group.id);
-									})
-								})
-							] }),
-							pane === "models" && shownGroup !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [backRow(), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-								className: cls(ModelSubmenu_module_css_default.groups, "scrollable"),
-								children: shownGroup.models.map((model) => {
-									const selected = current?.provider === shownGroup.id && current.model === model.id;
-									return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-										ref: itemRef(`model:${shownGroup.id}/${model.id}`),
-										type: "button",
-										role: "menuitemradio",
-										"aria-checked": selected,
-										className: cls(ModelSubmenu_module_css_default.option, selected && ModelSubmenu_module_css_default.selected),
-										title: model.name,
-										disabled: busy,
-										onClick: () => chooseModel(shownGroup.id, model),
-										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-											className: ModelSubmenu_module_css_default.optionCopy,
-											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-												className: ModelSubmenu_module_css_default.modelName,
-												children: model.name
-											})
-										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-											className: ModelSubmenu_module_css_default.check,
-											children: selected ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {}) : null
-										})]
-									}, model.id);
-								})
-							})] }),
-							pane === "effort" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [
-								backRow(),
-								state.error !== null && lastActionRef.current === "load" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-									className: ModelSubmenu_module_css_default.error,
-									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("error.action", { message: state.error }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-										type: "button",
-										className: ModelSubmenu_module_css_default.retry,
-										onClick: reload,
-										children: t("action.reload")
+											children: choice.label
+										}, choice.key))
 									})]
 								}),
-								effortChoices.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-									className: ModelSubmenu_module_css_default.empty,
-									children: t("empty.efforts")
-								}) : effortChoices.map((level) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-									ref: itemRef(`effort:${level.key}`),
-									type: "button",
-									role: "menuitemradio",
-									"aria-checked": effectiveEffort === level.effort,
-									className: cls(ModelSubmenu_module_css_default.option, effectiveEffort === level.effort && ModelSubmenu_module_css_default.selected),
-									disabled: busy,
-									onClick: () => chooseEffort(level.effort),
-									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-										className: ModelSubmenu_module_css_default.optionCopy,
-										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-											className: ModelSubmenu_module_css_default.modelName,
-											children: level.label
-										})
-									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-										className: ModelSubmenu_module_css_default.check,
-										children: effectiveEffort === level.effort ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {}) : null
-									})]
-								}, level.key))
-							] })
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: ModelSubmenu_module_css_default.divider })
+							] }),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+								className: ModelSubmenu_module_css_default.hint,
+								children: t("menu.hint")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: ModelSubmenu_module_css_default.divider }),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+								type: "button",
+								role: "menuitem",
+								className: ModelSubmenu_module_css_default.moreRow,
+								onClick: openPicker,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconFlatListOutlineRegular, {
+									className: ModelSubmenu_module_css_default.moreIcon,
+									size: 16
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("menu.more") })]
+							})
 						]
 					}), document.body),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModelPicker, {
+						open: pickerOpen,
+						state,
+						live,
+						facts,
+						favorites,
+						busy,
+						t,
+						onPick: (selection) => {
+							submit(selection, () => {
+								setPickerOpen(false);
+							});
+						},
+						onToggleFavorite: toggleFavoriteOf,
+						onReload: reload,
+						onClose: () => {
+							setPickerOpen(false);
+							queueMicrotask(() => {
+								triggerRef.current?.focus();
+							});
+						}
+					}),
 					toast !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Toast, {
 						text: toast.text,
 						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconWarningOutlineRegular, {}),
@@ -509,67 +1237,160 @@ window.__ModuleLoader__.load({
 				]
 			});
 		}
+		/** The selection in force, or null while the host has not resolved one. */
+		function selectionOf(state) {
+			if (state.current === null) return null;
+			return state.current.reasoningEffort === void 0 ? {
+				provider: state.current.provider,
+				model: state.current.model
+			} : {
+				provider: state.current.provider,
+				model: state.current.model,
+				reasoningEffort: state.current.reasoningEffort
+			};
+		}
+		/** Isolate the browser's storage so a locked-down browser reads as "no favorites". */
+		function storageOf() {
+			try {
+				return globalThis.localStorage;
+			} catch {
+				return;
+			}
+		}
+		//#endregion
+		//#region src/client/facts-source.ts
+		const EMPTY = () => ({
+			contextWindow: void 0,
+			images: "unknown"
+		});
+		/**
+		* Join the settings mirror with the provider directory.
+		* @param deps.describe - the settings mirror's describe face.
+		* @param deps.listProviders - reads the LLM provider directory once.
+		* @returns the source, plus `start` which wires both reads and returns its disposer.
+		*/
+		function createFactsSource(deps) {
+			const listeners = /* @__PURE__ */ new Set();
+			let providers = [];
+			let lookup = EMPTY;
+			const rebuild = () => {
+				const namespaces = deps.describe.getSnapshot().view?.namespaces ?? [];
+				lookup = providers.length === 0 || namespaces.length === 0 ? EMPTY : buildModelFacts(providers, namespaces);
+				for (const listener of [...listeners]) listener();
+			};
+			return {
+				source: {
+					getSnapshot: () => lookup,
+					subscribe: (listener) => {
+						listeners.add(listener);
+						return () => {
+							listeners.delete(listener);
+						};
+					}
+				},
+				start: () => {
+					const off = deps.describe.subscribe(rebuild);
+					deps.describe.ensure().catch(() => {});
+					deps.listProviders().then((answer) => {
+						providers = answer.ok && answer.value !== void 0 ? answer.value : [];
+						rebuild();
+					}, () => {});
+					rebuild();
+					return () => {
+						off();
+						listeners.clear();
+					};
+				}
+			};
+		}
 		//#endregion
 		//#region src/client/locales.ts
-		/** Locale bundles for the composer model seat this plugin takes over. */
+		/** Locale bundles for the composer model menu and the picker it opens. */
 		/** Dictionary namespace owned by this plugin. */
 		const NS = "modelSubmenu";
 		/** Simplified Chinese dictionary (the key-set source of truth). */
 		const zh = {
-			"back": "返回",
-			"provider.modelCount": "{count} 个模型",
-			"action.reload": "重新加载",
 			"trigger.fallback": "选择模型",
 			"trigger.loading": "正在加载模型…",
 			"trigger.selectAria": "选择模型",
 			"trigger.aria": "选择模型，当前 {model}",
-			"trigger.ariaEffort": "选择模型，当前 {model}，推理等级 {effort}",
-			"menu.aria": "供应商与推理等级",
-			"menu.provider": "供应商",
-			"menu.effort": "推理等级",
-			"effort.providerDefault": "Default",
-			"status.loading": "正在刷新模型列表…",
+			"trigger.ariaEffort": "选择模型，当前 {model}，思考等级 {effort}",
+			"menu.aria": "模型与思考等级",
+			"menu.effort": "思考",
+			"menu.more": "更多模型…",
+			"menu.hint": "提示：切换模型或思考程度会使既有的提示词缓存失效。建议新建会话，避免额外的 token 消耗。",
+			"effort.providerDefault": "默认",
+			"status.loading": "正在加载模型…",
+			"status.empty": "没有可用的模型。",
+			"status.failed": "模型列表加载失败：{message}",
+			"status.providerFailed": "{name} 加载失败：{message}",
+			"action.reload": "重新加载",
 			"error.action": "模型操作失败：{message}",
 			"error.sessionInUse": "当前会话已被占用，可能是其他正在运行的 DSH 导致的（如其他 dsh web、桌面端），请退出其他正在运行的 DSH 后重试。",
-			"warning.groupLoad": "{name} 加载失败：{message}",
-			"empty.models": "没有可用的模型。",
-			"empty.efforts": "当前模型未提供推理等级。"
+			"picker.title": "切换模型",
+			"picker.close": "关闭",
+			"picker.search": "搜索模型或提供商…",
+			"picker.searchEmpty": "没有匹配的模型。",
+			"picker.all": "全部",
+			"picker.favorite": "收藏 {model}",
+			"picker.unfavorite": "取消收藏 {model}",
+			"picker.hintNavigate": "导航",
+			"picker.hintSelect": "选择",
+			"picker.hintClose": "关闭",
+			"meta.effort": "思考",
+			"meta.images": "图片输入"
 		};
 		/** English dictionary, checked complete against the zh key set. */
 		const en = {
-			"back": "Back",
-			"provider.modelCount": "{count} models",
-			"action.reload": "Reload",
 			"trigger.fallback": "Select model",
 			"trigger.loading": "Loading models…",
 			"trigger.selectAria": "Select model",
 			"trigger.aria": "Select model, current {model}",
-			"trigger.ariaEffort": "Select model, current {model}, reasoning effort {effort}",
-			"menu.aria": "Provider and reasoning effort",
-			"menu.provider": "Provider",
+			"trigger.ariaEffort": "Select model, current {model}, effort {effort}",
+			"menu.aria": "Model and effort",
 			"menu.effort": "Effort",
+			"menu.more": "More models…",
+			"menu.hint": "Changing the model or the effort invalidates the existing prompt cache. Start a new session to avoid the extra token cost.",
 			"effort.providerDefault": "Default",
-			"status.loading": "Refreshing model list…",
+			"status.loading": "Loading models…",
+			"status.empty": "No models available.",
+			"status.failed": "Model list failed to load: {message}",
+			"status.providerFailed": "{name} failed to load: {message}",
+			"action.reload": "Reload",
 			"error.action": "Model operation failed: {message}",
 			"error.sessionInUse": "This session is already in use, possibly by another running DSH instance (such as dsh web or the desktop app). Quit other running DSH instances and try again.",
-			"warning.groupLoad": "{name} failed to load: {message}",
-			"empty.models": "No models available.",
-			"empty.efforts": "This model provides no reasoning effort levels."
+			"picker.title": "Switch model",
+			"picker.close": "Close",
+			"picker.search": "Search models or providers…",
+			"picker.searchEmpty": "No matching models.",
+			"picker.all": "All",
+			"picker.favorite": "Favorite {model}",
+			"picker.unfavorite": "Remove {model} from favorites",
+			"picker.hintNavigate": "navigate",
+			"picker.hintSelect": "select",
+			"picker.hintClose": "close",
+			"meta.effort": "Effort",
+			"meta.images": "Images"
 		};
 		//#endregion
 		//#region src/client/index.ts
 		/**
 		* Cordis services required by the browser half. `slots` is the contribution
-		* registry, `sessions` tells whether a session may select a model, and
+		* registry, `sessions` tells whether a session may select a model,
 		* `modelDirectories` owns the per-session catalog snapshot this seat renders
-		* from. `remote` / `remote.session` are declared because a service method runs
-		* on the calling context: `directoryFor` reads `this.ctx.remote.session` while
-		* building the directory, so the seat must carry that service too.
+		* from, and `configForms` carries the settings provider's shared describe
+		* mirror, which answers each model's context window and accepted modalities.
+		* `remote`, `remote.llm`, and `remote.session` are declared because a service
+		* method runs on the calling context: `directoryFor` reads
+		* `this.ctx.remote.session`, and the provider directory that names each
+		* settings address is read through `this.ctx.remote.llm`.
 		*/
 		const inject = [
+			"configForms",
 			"locale",
 			"modelDirectories",
 			"remote",
+			"remote.llm",
 			"remote.session",
 			"sessions",
 			"slots"
@@ -585,9 +1406,19 @@ window.__ModuleLoader__.load({
 				zh,
 				en
 			}), "dsh-model-submenu: dictionaries");
-			ctx.inject(["slots", "modelDirectories"], (scope) => {
+			ctx.inject([
+				"slots",
+				"modelDirectories",
+				"configForms",
+				"remote"
+			], (scope) => {
 				const models = scope.modelDirectories;
 				const sessions = scope.sessions;
+				const facts = createFactsSource({
+					describe: scope.configForms.describe(),
+					listProviders: () => scope.remote.llm.listConfigurableProviders()
+				});
+				ctx.effect(() => facts.start(), "dsh-model-submenu: model metadata");
 				scope.slots.inject("conversation.input.model", () => scope.slots.register({
 					name: "conversation.input.model",
 					priority: -100,
@@ -600,6 +1431,7 @@ window.__ModuleLoader__.load({
 						return {
 							available,
 							directory: directory.store,
+							factsSource: facts.source,
 							load: () => {
 								if (available) directory.load().catch(() => {});
 							},