@klarkxy/dsh-model-picker 0.0.0-stage → 0.1.0

package/lib/client.js

@@ -0,0 +1,1729 @@
+window.__ModuleLoader__.load({
+  id: "@klarkxy/dsh-model-picker",
+  factory: (dshRequire) => {
+    var require = dshRequire;
+    var module = { exports: {} };
+    var exports = module.exports;
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let react = require("react");
+let _deepseek_ai_dsh_client_ui_primitives = require("@deepseek-ai/dsh-client-ui-primitives");
+let react_dom = require("react-dom");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region ../dsh-model-route/src/menu.ts
+/** Localize standard effort ids only when the provider has not supplied a display name. */
+function modelMenuEffortLabel(effort, locale) {
+	if (effort.name !== effort.id) return effort.name;
+	return {
+		off: ["关闭", "Off"],
+		none: ["无", "None"],
+		minimal: ["最低", "Minimal"],
+		low: ["低", "Low"],
+		medium: ["中", "Medium"],
+		high: ["高", "High"],
+		xhigh: ["极高", "Extra high"],
+		max: ["最高", "Maximum"],
+		ultra: ["超高", "Ultra"]
+	}[effort.id]?.[locale?.toLowerCase().startsWith("zh") ? 0 : 1] ?? effort.name;
+}
+/** The short model label shown inside a provider group. */
+function modelMenuShortName(choice) {
+	const sep = choice.label.indexOf(" / ");
+	return sep > 0 ? choice.label.slice(sep + 3) : choice.model;
+}
+/** Group catalog choices by provider and filter them by a case-insensitive query. */
+function groupModelMenuChoices(choices, query) {
+	const needle = query.trim().toLowerCase();
+	const matched = needle ? choices.filter((choice) => choice.label.toLowerCase().includes(needle) || choice.model.toLowerCase().includes(needle) || choice.provider.toLowerCase().includes(needle) || (choice.providerLabel?.toLowerCase().includes(needle) ?? false)) : choices;
+	const groups = [];
+	for (const choice of matched) {
+		const sep = choice.label.indexOf(" / ");
+		const name = choice.providerLabel ?? (sep > 0 ? choice.label.slice(0, sep) : choice.provider);
+		const last = groups.at(-1);
+		if (last && last.provider === choice.provider) last.items.push(choice);
+		else groups.push({
+			provider: choice.provider,
+			name,
+			items: [choice]
+		});
+	}
+	return groups;
+}
+//#endregion
+//#region ../dsh-model-route/src/ui.tsx
+/**
+* ModelMenu: the standard editor of one model-route field — the visible half
+* of the x-model-route contract. A feature plugin's settings page renders it
+* for its own marked field; the model hub renders one per detected field.
+*
+* It is a plugin-side copy of the host's composer model picker
+* (dsh-client-ui-model-selection's ModelSelect), rebuilt from the official
+* primitives and the published bundle's behavior: one card that opens on the
+* root pane (Model / Effort cells), drills into the provider-grouped,
+* searchable model list or the effort list, and Escapes back before closing.
+* Sticky group headings, subsequence ranking, highlight walking and focus
+* hand-back all match the host. SYNC POINT: when the host's ModelSelect or
+* ModelSelect.module.css changes, this copy must be re-transcribed; styles
+* below may only reference allowlisted theme tokens (the --dsw-* set plus the
+* host's --ds-* motion tokens), never literal colors.
+*
+* It statically imports the primitives, so only browser clients should load
+* this entry; host code and node tests use the core entry (`./index.ts`).
+*/
+/** Unplaced portal card: hidden but laid out at a fixed origin so measurements are real. */
+const MEASURE_STYLE = {
+	visibility: "hidden",
+	left: 0,
+	top: 0
+};
+function ModelMenu(props) {
+	const language = props.locale?.toLowerCase().startsWith("zh") ? "zh" : "en";
+	const copy = language === "zh" ? {
+		model: "模型",
+		effort: "思考强度",
+		default: "默认",
+		search: "搜索模型…",
+		empty: "没有匹配的模型",
+		clear: "清除搜索"
+	} : {
+		model: "Model",
+		effort: "Reasoning",
+		default: "Default",
+		search: "Search models…",
+		empty: "No matching models",
+		clear: "Clear search"
+	};
+	const { open, onOpenChange, anchor, choices, selected, onPick, leading = [], onPickLeading, efforts = [], selectedEffort, onPickEffort, modelLabel = copy.model, modelValue = "—", effortLabel = copy.effort, effortValue, defaultEffortLabel = copy.default, searchPlaceholder = copy.search, emptyLabel = copy.empty, clearSearchLabel = copy.clear, initialPane = "root", alwaysShowSearch = false, reasoningSlider = false, menuHeader, disabled = false, busy = false, closeOnPick = true, closeOnDisable = true, className, listClassName } = props;
+	const rootRef = (0, react.useRef)(null);
+	const openRef = (0, react.useRef)(open);
+	openRef.current = open;
+	const pendingOpenRef = (0, react.useRef)(false);
+	const pendingRestoreFocus = (0, react.useRef)(false);
+	const [requestedOpen, setRequestedOpen] = (0, react.useState)(false);
+	const menuRef = (0, react.useRef)(null);
+	const groupsRef = (0, react.useRef)(null);
+	const searchRef = (0, react.useRef)(null);
+	const itemRefs = (0, react.useRef)([]);
+	const paneFocus = (0, react.useRef)(null);
+	const [pane, setPane] = (0, react.useState)("root");
+	const [query, setQuery] = (0, react.useState)("");
+	const [highlightedIndex, setHighlightedIndex] = (0, react.useState)(null);
+	const [keyNav, setKeyNav] = (0, react.useState)(0);
+	const [menuPos, setMenuPos] = (0, react.useState)(null);
+	const id = (0, react.useId)();
+	const showSearch = alwaysShowSearch || choices.length > 4;
+	const effortRows = (0, react.useMemo)(() => [{
+		id: "",
+		name: defaultEffortLabel
+	}, ...efforts.map((effort) => ({
+		...effort,
+		name: modelMenuEffortLabel(effort, language)
+	}))], [
+		defaultEffortLabel,
+		efforts,
+		language
+	]);
+	const filteredGroups = (0, react.useMemo)(() => groupModelMenuChoices(choices, "").map((group) => ({
+		...group,
+		items: (0, _deepseek_ai_dsh_client_ui_primitives.rankByName)(group.items.map((choice) => ({
+			choice,
+			name: modelMenuShortName(choice),
+			label: [
+				choice.provider,
+				choice.providerLabel,
+				choice.model,
+				choice.label
+			].filter(Boolean).join(" ")
+		})), showSearch ? query.trim() : "")
+	})).filter((group) => group.items.length > 0), [
+		choices,
+		query,
+		showSearch
+	]);
+	const visibleModels = (0, react.useMemo)(() => filteredGroups.flatMap((group) => group.items.map((item) => item.choice)), [filteredGroups]);
+	const currentVisibleIndex = visibleModels.findIndex((choice) => choice.provider === selected?.provider && choice.model === selected.model);
+	const activeModelIndex = Math.min(highlightedIndex ?? Math.max(0, currentVisibleIndex), visibleModels.length - 1);
+	const changeOpen = (next) => {
+		if (openRef.current === next) return;
+		openRef.current = next;
+		onOpenChange(next);
+	};
+	const requestOpen = () => {
+		if (open || pendingOpenRef.current) return;
+		pendingOpenRef.current = true;
+		pendingRestoreFocus.current = false;
+		setRequestedOpen(true);
+	};
+	const close = (restoreFocus = false) => {
+		const active = document.activeElement;
+		pendingRestoreFocus.current = restoreFocus && (active === document.body || rootRef.current?.contains(active) === true || menuRef.current?.contains(active) === true);
+		changeOpen(false);
+	};
+	const drill = (next) => {
+		setQuery("");
+		setHighlightedIndex(null);
+		paneFocus.current = "drill";
+		setPane(next);
+	};
+	/** Leave a drilled pane for the entry pane, handing the keyboard back to it.
+	*  A root entry refocuses the cell that opened the pane; a search-first
+	*  (model) entry refocuses that pane's own intent. */
+	const back = (from) => {
+		paneFocus.current = initialPane === "root" ? from : "drill";
+		setPane(initialPane);
+	};
+	const moveFocus = (offset) => {
+		const items = itemRefs.current.filter((item) => item !== null && !item.disabled);
+		if (!items.length) 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();
+	};
+	(0, react.useLayoutEffect)(() => {
+		if (open || !pendingRestoreFocus.current) return;
+		const active = document.activeElement;
+		if (active !== document.body && !rootRef.current?.contains(active)) {
+			pendingRestoreFocus.current = false;
+			return;
+		}
+		const trigger = rootRef.current?.querySelector("button");
+		if (!trigger || trigger.disabled) return;
+		trigger.focus();
+		if (document.activeElement === trigger) pendingRestoreFocus.current = false;
+	});
+	(0, react.useEffect)(() => {
+		if (open || !pendingRestoreFocus.current) return;
+		const cancelOutside = (event) => {
+			if (event.target instanceof Node && !rootRef.current?.contains(event.target)) pendingRestoreFocus.current = false;
+		};
+		document.addEventListener("focusin", cancelOutside);
+		document.addEventListener("pointerdown", cancelOutside);
+		return () => {
+			document.removeEventListener("focusin", cancelOutside);
+			document.removeEventListener("pointerdown", cancelOutside);
+		};
+	});
+	(0, react.useEffect)(() => {
+		if (!requestedOpen) return;
+		pendingOpenRef.current = false;
+		setRequestedOpen(false);
+		if (!open) changeOpen(true);
+	}, [requestedOpen, open]);
+	(0, react.useEffect)(() => {
+		if (!open) return;
+		setPane(initialPane);
+		if (initialPane === "model") paneFocus.current = "drill";
+		setQuery("");
+		setHighlightedIndex(null);
+	}, [open, initialPane]);
+	(0, react.useEffect)(() => {
+		if (disabled && open && closeOnDisable) changeOpen(false);
+	}, [
+		disabled,
+		open,
+		closeOnDisable
+	]);
+	(0, react.useEffect)(() => {
+		if (!open) return;
+		const closeOutside = (event) => {
+			const target = event.target;
+			if (rootRef.current?.contains(target) || menuRef.current?.contains(target)) return;
+			changeOpen(false);
+		};
+		const escapeOutside = (event) => {
+			if (event.key !== "Escape" || event.defaultPrevented || event.isComposing) return;
+			if (!openRef.current) return;
+			event.preventDefault();
+			if (pane !== initialPane) back(pane);
+			else close(true);
+		};
+		document.addEventListener("mousedown", closeOutside);
+		document.addEventListener("keydown", escapeOutside);
+		return () => {
+			document.removeEventListener("mousedown", closeOutside);
+			document.removeEventListener("keydown", escapeOutside);
+		};
+	}, [
+		open,
+		onOpenChange,
+		pane,
+		initialPane
+	]);
+	(0, react.useEffect)(() => {
+		const intent = paneFocus.current;
+		if (!open || menuPos === null || intent === null) return;
+		if (intent !== "drill" && pane !== "root") return;
+		paneFocus.current = null;
+		if (intent === "drill") {
+			if (pane === "model" && showSearch) {
+				searchRef.current?.focus();
+				return;
+			}
+			(menuRef.current?.querySelector("[role=\"menuitemradio\"][aria-checked=\"true\"]:not([disabled])") ?? itemRefs.current.find((item) => item !== null && !item.disabled))?.focus();
+			return;
+		}
+		itemRefs.current[intent === "effort" ? 1 : 0]?.focus();
+	}, [
+		open,
+		pane,
+		showSearch,
+		menuPos
+	]);
+	(0, react.useEffect)(() => {
+		const viewport = groupsRef.current;
+		if (viewport === null) return;
+		return (0, _deepseek_ai_dsh_client_ui_primitives.observeStickyMenuGroups)(viewport);
+	}, [
+		open,
+		pane,
+		filteredGroups
+	]);
+	const modelPaneOpen = open && pane === "model";
+	const scrollSignal = !modelPaneOpen ? "closed" : keyNav === 0 ? "open" : `key:${keyNav}`;
+	const scrollSignalRef = (0, react.useRef)(null);
+	(0, react.useLayoutEffect)(() => {
+		if (!modelPaneOpen || activeModelIndex < 0) {
+			if (!modelPaneOpen) scrollSignalRef.current = null;
+			return;
+		}
+		if (scrollSignalRef.current === scrollSignal) return;
+		scrollSignalRef.current = scrollSignal;
+		itemRefs.current[leading.length + activeModelIndex]?.scrollIntoView({ block: "nearest" });
+	}, [
+		modelPaneOpen,
+		scrollSignal,
+		activeModelIndex,
+		leading.length
+	]);
+	(0, react.useLayoutEffect)(() => {
+		if (!open) {
+			setMenuPos(null);
+			return;
+		}
+		const place = () => {
+			const rect = rootRef.current?.getBoundingClientRect();
+			if (!rect) return;
+			const margin = 12, lw = menuRef.current?.offsetWidth ?? 0, lh = menuRef.current?.offsetHeight ?? 0;
+			let x = rect.right - lw, y = rect.top - 8 - lh;
+			if (lw > 0) x = Math.min(Math.max(x, margin), window.innerWidth - lw - margin);
+			if (lh > 0) y = Math.min(Math.max(y, margin), window.innerHeight - lh - margin);
+			setMenuPos((prev) => prev && prev.left === x && prev.top === y ? prev : {
+				left: x,
+				top: y
+			});
+		};
+		place();
+		window.addEventListener("scroll", place, true);
+		window.addEventListener("resize", place);
+		return () => {
+			window.removeEventListener("scroll", place, true);
+			window.removeEventListener("resize", place);
+		};
+	}, [
+		open,
+		pane,
+		choices,
+		query
+	]);
+	function onKeyDown(event) {
+		if (event.defaultPrevented || event.nativeEvent.isComposing) return;
+		if (event.key === "Escape" && open) {
+			event.preventDefault();
+			if (pane !== initialPane) back(pane);
+			else close(true);
+			return;
+		}
+		if (disabled) return;
+		if (!open && [
+			"Enter",
+			" ",
+			"ArrowDown",
+			"ArrowUp"
+		].includes(event.key)) {
+			const button = event.target instanceof Element ? event.target.closest("button") : null;
+			if (!(button instanceof HTMLButtonElement) || button.disabled || !rootRef.current?.contains(button)) return;
+			event.preventDefault();
+			paneFocus.current = "model";
+			requestOpen();
+			return;
+		}
+		if (!open) return;
+		if (pane === "model" && showSearch && (event.key === "ArrowDown" || event.key === "ArrowUp")) {
+			event.preventDefault();
+			if (visibleModels.length > 0) {
+				setHighlightedIndex((activeModelIndex + (event.key === "ArrowDown" ? 1 : -1) + visibleModels.length) % visibleModels.length);
+				setKeyNav((n) => n + 1);
+				searchRef.current?.focus();
+			}
+			return;
+		}
+		if (pane === "model" && showSearch && event.target instanceof HTMLInputElement && (event.key === "Enter" || event.key === "Tab" && !event.shiftKey)) {
+			if (event.key === "Tab" && visibleModels.length === 0) return;
+			event.preventDefault();
+			const highlighted = visibleModels[activeModelIndex];
+			if (highlighted && !busy) {
+				onPick({
+					provider: highlighted.provider,
+					model: highlighted.model
+				});
+				if (closeOnPick) close(true);
+			}
+			return;
+		}
+		if (event.key === "Tab") {
+			if (event.shiftKey) {
+				event.preventDefault();
+				if (pane !== initialPane) back(pane);
+				else close(true);
+				return;
+			}
+			const focused = document.activeElement;
+			const rows = itemRefs.current.filter((item) => item !== null);
+			if (focused instanceof HTMLButtonElement && rows.includes(focused)) {
+				event.preventDefault();
+				focused.click();
+				return;
+			}
+			if (pane === "model" && showSearch) {
+				event.preventDefault();
+				setHighlightedIndex(null);
+				searchRef.current?.focus();
+			}
+			return;
+		}
+		if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+			event.preventDefault();
+			moveFocus(event.key === "ArrowDown" ? 1 : -1);
+		}
+	}
+	function onBlur(event) {
+		const related = event.relatedTarget;
+		if (related instanceof Node && (rootRef.current?.contains(related) || menuRef.current?.contains(related) || !related.isConnected)) return;
+		if (!closeOnPick && !(related instanceof Node)) return;
+		if (busy && related == null) return;
+		if (open) changeOpen(false);
+	}
+	itemRefs.current = [];
+	let itemIndex = 0;
+	let modelIndex = 0;
+	const itemRef = () => {
+		const at = itemIndex++;
+		return (node) => {
+			itemRefs.current[at] = node;
+		};
+	};
+	const menu = open && typeof document !== "undefined" ? (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_deepseek_ai_dsh_client_ui_primitives.MenuSurface, {
+		ref: menuRef,
+		id: `${id}-menu`,
+		className: `dsh-model-menu-menu${listClassName ? ` ${listClassName}` : ""}`,
+		style: menuPos ?? MEASURE_STYLE,
+		role: pane === "model" ? "group" : "menu",
+		"aria-label": modelLabel,
+		lang: language,
+		children: [
+			menuHeader ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsh-model-menu-header",
+				children: menuHeader
+			}) : null,
+			pane === "root" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				ref: itemRef(),
+				type: "button",
+				role: "menuitem",
+				className: "dsh-model-menu-cell",
+				disabled,
+				onClick: () => drill("model"),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsh-model-menu-cellLabel",
+						children: modelLabel
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsh-model-menu-cellValue",
+						children: modelValue
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconChevronRightOutlineRegular, { className: "dsh-model-menu-cellChevron" })
+				]
+			}), efforts.length > 0 && !reasoningSlider ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				ref: itemRef(),
+				type: "button",
+				role: "menuitem",
+				className: "dsh-model-menu-cell",
+				disabled,
+				onClick: () => drill("effort"),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsh-model-menu-cellLabel",
+						children: effortLabel
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsh-model-menu-cellValue",
+						children: effortValue ?? effortRows.find((row) => row.id === (selectedEffort ?? ""))?.name ?? defaultEffortLabel
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconChevronRightOutlineRegular, { className: "dsh-model-menu-cellChevron" })
+				]
+			}) : null] }) : null,
+			pane === "model" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+				showSearch ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "dsh-model-menu-searchRow",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Input, {
+						ref: searchRef,
+						disabled,
+						className: `dsh-model-menu-search${query !== "" ? " dsh-model-menu-searchWithQuery" : ""}`,
+						type: "text",
+						role: "searchbox",
+						"aria-label": searchPlaceholder,
+						"aria-controls": `${id}-models`,
+						"aria-activedescendant": activeModelIndex < 0 ? void 0 : `${id}-model-${activeModelIndex}`,
+						placeholder: searchPlaceholder,
+						value: query,
+						onChange: (event) => {
+							setQuery(event.target.value);
+							setHighlightedIndex(0);
+						}
+					}), query !== "" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsh-model-menu-searchClear",
+						"aria-label": clearSearchLabel,
+						disabled,
+						onClick: () => {
+							setQuery("");
+							setHighlightedIndex(null);
+							searchRef.current?.focus();
+						},
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCloseFillRegular, {})
+					}) : null]
+				}) : null,
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					ref: groupsRef,
+					id: `${id}-models`,
+					className: "dsh-model-menu-groups scrollable",
+					role: "menu",
+					"aria-label": modelLabel,
+					hidden: filteredGroups.length === 0,
+					children: [leading.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "dsh-model-menu-leading",
+						children: leading.map((item) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+							ref: itemRef(),
+							type: "button",
+							role: "menuitemradio",
+							"aria-checked": item.selected === true,
+							disabled: disabled || busy,
+							className: `dsh-model-menu-option${item.selected === true ? " dsh-model-menu-selected" : ""}`,
+							onClick: () => {
+								if (disabled || busy) return;
+								onPickLeading?.(item.id);
+								if (closeOnPick) close(true);
+							},
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "dsh-model-menu-optionCopy",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "dsh-model-menu-modelName",
+									children: item.label
+								})
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "dsh-model-menu-check",
+								children: item.selected === true ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {}) : null
+							})]
+						}, item.id))
+					}) : null, filteredGroups.map((group) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.MenuGroup, {
+						label: group.name,
+						children: group.items.map((item) => {
+							const index = modelIndex++;
+							const choice = item.choice;
+							const checked = selected?.provider === choice.provider && selected.model === choice.model;
+							return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+								ref: itemRef(),
+								type: "button",
+								role: "menuitemradio",
+								"aria-checked": checked,
+								id: `${id}-model-${index}`,
+								tabIndex: showSearch ? -1 : 0,
+								disabled: disabled || busy,
+								onFocus: () => setHighlightedIndex(index),
+								"data-highlighted": index === activeModelIndex ? "" : void 0,
+								className: `dsh-model-menu-option dsh-model-menu-modelOption${checked ? " dsh-model-menu-selected" : ""}${index === activeModelIndex ? " dsh-model-menu-optionActive" : ""}`,
+								onMouseMove: index === activeModelIndex ? void 0 : () => {
+									if (showSearch) setHighlightedIndex(index);
+									else itemRefs.current[leading.length + index]?.focus();
+								},
+								title: choice.label,
+								onClick: () => {
+									if (disabled || busy) return;
+									onPick({
+										provider: choice.provider,
+										model: choice.model
+									});
+									if (closeOnPick) close(true);
+								},
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "dsh-model-menu-optionCopy",
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: "dsh-model-menu-modelName",
+										children: modelMenuShortName(choice)
+									})
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "dsh-model-menu-check",
+									children: checked ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {}) : null
+								})]
+							}, `${choice.provider}/${choice.model}`);
+						})
+					}, group.provider))]
+				}),
+				reasoningSlider && efforts.length > 0 && filteredGroups.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EffortSlider, {
+					label: effortLabel,
+					rows: effortRows,
+					selected: selectedEffort ?? "",
+					disabled,
+					busy,
+					onPick: (value) => onPickEffort?.(value)
+				}) : null,
+				filteredGroups.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "dsh-model-menu-empty",
+					role: "status",
+					children: emptyLabel
+				}) : null
+			] }) : null,
+			pane === "effort" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: effortRows.map((row) => {
+				const checked = (selectedEffort ?? "") === row.id;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					ref: itemRef(),
+					type: "button",
+					role: "menuitemradio",
+					"aria-checked": checked,
+					disabled: disabled || busy,
+					className: `dsh-model-menu-option${checked ? " dsh-model-menu-selected" : ""}`,
+					onClick: () => {
+						if (disabled || busy) return;
+						onPickEffort?.(row.id || void 0);
+						if (closeOnPick) close(true);
+					},
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsh-model-menu-optionCopy",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "dsh-model-menu-modelName",
+							children: row.name
+						})
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsh-model-menu-check",
+						children: checked ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {}) : null
+					})]
+				}, row.id || "__default");
+			}) }) : null
+		]
+	}), document.body) : null;
+	const trigger = (0, react.isValidElement)(anchor) ? (0, react.cloneElement)(anchor, {
+		"aria-haspopup": "menu",
+		"aria-expanded": open,
+		"aria-controls": open ? `${id}-menu` : void 0,
+		"aria-disabled": disabled || void 0
+	}) : anchor;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		ref: rootRef,
+		className: `dsh-model-menu-root${className ? ` ${className}` : ""}`,
+		onKeyDown,
+		onBlur,
+		onClick: (event) => {
+			if (disabled || event.defaultPrevented) return;
+			const button = event.target instanceof Element ? event.target.closest("button") : null;
+			if (!(button instanceof HTMLButtonElement) || button.disabled || !rootRef.current?.contains(button)) return;
+			requestOpen();
+		},
+		onMouseDown: (event) => {
+			if (event.target instanceof Element && menuRef.current?.contains(event.target) && event.target.closest("button") !== null) event.preventDefault();
+		},
+		children: [trigger, menu]
+	});
+}
+/**
+* Discrete reasoning-effort slider shown under the model list in enhanced mode.
+*
+* A native range input (`step=1`) over exactly the rows the caller supplies —
+* the default row plus each effort the selected model advertises — so it can
+* never invent a level. It previews locally while dragging or arrowing and
+* commits only when the gesture ends (pointer up, key up, or blur), so a drag
+* does not write on every step. The menu stays open, so adjusting the effort
+* never loses the model selection or the search query.
+*
+* The input itself stays the entire interaction and accessibility surface —
+* keyboard, ARIA, disabled and the native step snapping all come from it —
+* while the track, gradient fill and thumb below are decorative layers painted
+* from the `--_p` percentage the preview position sets on the rail. Value
+* changes only update that custom property, so the CSS transitions animate
+* between levels without remounting nodes or restarting an animation.
+*/
+function EffortSlider(props) {
+	const { label, rows, selected, disabled = false, busy = false, onPick } = props;
+	const active = Math.max(0, rows.findIndex((row) => row.id === selected));
+	const [position, setPosition] = (0, react.useState)(active);
+	const positionRef = (0, react.useRef)(position);
+	(0, react.useEffect)(() => {
+		positionRef.current = active;
+		setPosition(active);
+	}, [active]);
+	const preview = (next) => {
+		positionRef.current = next;
+		setPosition(next);
+	};
+	const commit = () => {
+		if (disabled || busy) return;
+		const row = rows[positionRef.current];
+		if (row !== void 0) onPick(row.id === "" ? void 0 : row.id);
+	};
+	const max = Math.max(0, rows.length - 1);
+	const percent = max > 0 ? Math.round(position / max * 100) : 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsh-model-menu-sliderGroup",
+		role: "group",
+		"aria-label": label,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsh-model-menu-sliderHead",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsh-model-menu-sliderTitle",
+				children: label
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsh-model-menu-sliderValue",
+				children: rows[position]?.name
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsh-model-menu-sliderRail",
+			style: { "--_p": percent },
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+					type: "range",
+					className: "dsh-model-menu-sliderInput",
+					min: 0,
+					max,
+					step: 1,
+					value: position,
+					disabled,
+					"aria-label": label,
+					"aria-disabled": disabled || busy || void 0,
+					"aria-valuetext": rows[position]?.name,
+					onChange: (event) => {
+						const value = Number(event.target.value);
+						if (Number.isFinite(value)) preview(value);
+					},
+					onPointerUp: commit,
+					onKeyUp: commit,
+					onBlur: commit
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "dsh-model-menu-sliderTrack",
+					"aria-hidden": "true",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsh-model-menu-sliderFill",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "dsh-model-menu-sliderFillBar" })
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsh-model-menu-sliderNodes",
+						children: rows.map((row, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							"data-covered": index <= position ? "" : void 0,
+							className: "dsh-model-menu-sliderNode",
+							style: { "--_n": max > 0 ? Math.round(index / max * 100) : 0 }
+						}, row.id || "__default"))
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsh-model-menu-sliderThumb",
+					"aria-hidden": "true"
+				})
+			]
+		})]
+	});
+}
+/**
+* ModelMenu styles, transcribed from the official ModelSelect.module.css (the
+* published dsh-client-ui-model-selection bundle): card capped at
+* min(360px, 100vh - 96px), 34px option cells at 13/18 with 5px 7px padding,
+* 34px root cells at 13/20, a borderless 12px search row with a clear button,
+* sticky group headings (MenuGroup's own CSS), and the l1-stroke prominent
+* elevation at portal z-index 1100. The trigger mirrors the composer's 28px
+* model pill, chevron rotating open. MenuSurface paints fill and backdrop.
+* Only allowlisted --dsw- and --ds- theme tokens may appear here — a literal
+* color is a bug.
+*/
+const modelMenuCss = `
+.dsh-model-menu-root { min-width: 0; position: relative; display: inline-flex; }
+.dsh-model-menu-trigger {
+  border-radius: var(--dsw-radius-sm);
+  min-width: 0;
+  max-width: min(360px, 45cqw);
+  height: 28px;
+  color: var(--dsw-alias-label-secondary);
+  cursor: pointer;
+  background: none;
+  border: none;
+  outline: none;
+  align-items: center;
+  gap: 4px;
+  padding: 0 4px 0 8px;
+  font-size: 13px;
+  font-weight: 400;
+  line-height: 20px;
+  display: flex;
+}
+.dsh-model-menu-trigger:hover:not(:disabled) { background: var(--dsw-alias-interactive-bg-hover); }
+.dsh-model-menu-trigger:focus-visible:not([data-selection-focus]) { box-shadow: 0 0 0 var(--dsw-focus-ring-width) var(--dsw-focus-ring-color, var(--dsw-alias-state-business-primary)); }
+.dsh-model-menu-trigger:disabled { color: var(--dsw-alias-label-dimmed); cursor: default; }
+.dsh-model-menu-triggerLabel { text-overflow: ellipsis; white-space: nowrap; min-width: 0; overflow: hidden; }
+.dsh-model-menu-triggerEffort { text-overflow: ellipsis; white-space: nowrap; min-width: 0; color: var(--dsw-alias-label-caption); flex-shrink: 1000; overflow: hidden; }
+.dsh-model-menu-chevron { color: var(--dsw-alias-label-caption); flex: none; transition: transform var(--ds-transition-duration) var(--ds-ease-in-out); }
+.dsh-model-menu-chevronOpen { transform: rotate(180deg); }
+/* Portal overlay: the host publishes no z-index token, so the card keeps the
+ * native menu layer's 1100 verbatim. */
+.dsh-model-menu-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;
+}
+.dsh-model-menu-status, .dsh-model-menu-empty { color: var(--dsw-alias-label-tertiary); padding: 8px; font-size: 12px; line-height: 18px; }
+.dsh-model-menu-header { flex: none; padding: 2px 2px 4px; }
+.dsh-model-menu-searchRow { flex-shrink: 0; margin: 2px 0 3px; position: relative; }
+.dsh-model-menu-searchRow .dsh-model-menu-search { border-radius: var(--dsw-radius-md); background: none; border: 0 solid transparent; height: auto; padding: 5px 7px; display: flex; }
+.dsh-model-menu-searchRow .dsh-model-menu-search:focus-within { border-color: transparent; }
+.dsh-model-menu-searchWithQuery { padding-right: 34px; }
+.dsh-model-menu-searchRow .dsh-model-menu-search input { padding: 0; font-size: 12px; line-height: normal; }
+.dsh-model-menu-searchRow .dsh-model-menu-search input::placeholder { color: var(--dsw-alias-label-caption); }
+/* The clear button is a circle by geometry (border-radius: 50%), a shape the
+ * radius token scale does not describe. */
+.dsh-model-menu-searchClear {
+  width: 24px;
+  height: 24px;
+  color: var(--dsw-alias-label-secondary);
+  cursor: pointer;
+  background: none;
+  border: none;
+  border-radius: 50%;
+  justify-content: center;
+  align-items: center;
+  padding: 0;
+  display: inline-flex;
+  position: absolute;
+  top: 50%;
+  right: 4px;
+  transform: translateY(-50%);
+}
+.dsh-model-menu-searchClear:hover, .dsh-model-menu-searchClear:focus-visible { background: var(--dsw-alias-interactive-bg-hover); outline: none; }
+.dsh-model-menu-groups { min-height: 0; overflow-y: auto; }
+.dsh-model-menu-leading { border-bottom: 0.5px solid var(--dsw-alias-border-l2); margin-bottom: 3px; padding-bottom: 3px; }
+.dsh-model-menu-option {
+  box-sizing: border-box;
+  border-radius: var(--dsw-radius-md);
+  width: auto;
+  min-width: 100%;
+  min-height: 34px;
+  color: inherit;
+  text-align: left;
+  cursor: pointer;
+  background: none;
+  border: none;
+  outline: none;
+  align-items: center;
+  gap: 6px;
+  padding: 5px 7px;
+  display: flex;
+}
+.dsh-model-menu-option:not(.dsh-model-menu-modelOption):hover:not(:disabled),
+.dsh-model-menu-option:focus-visible,
+.dsh-model-menu-optionActive:not(:disabled) { background: var(--dsw-alias-interactive-bg-hover); }
+.dsh-model-menu-modelOption:hover:not(:disabled) { background: var(--dsw-alias-interactive-bg-hover); }
+.dsh-model-menu-selected { background: none; }
+.dsh-model-menu-option:disabled { color: var(--dsw-alias-label-dimmed); cursor: default; }
+.dsh-model-menu-optionCopy { flex-direction: column; flex: 1; min-width: 0; display: flex; }
+.dsh-model-menu-modelName { color: inherit; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 400; line-height: 18px; overflow: hidden; }
+.dsh-model-menu-check { color: var(--dsw-alias-label-primary); flex: 0 0 14px; place-items: center; display: grid; }
+.dsh-model-menu-check svg { width: 14px; height: 14px; }
+.dsh-model-menu-cell {
+  box-sizing: border-box;
+  border-radius: var(--dsw-radius-md);
+  width: auto;
+  min-width: 100%;
+  height: 34px;
+  color: var(--dsw-alias-label-primary);
+  cursor: pointer;
+  text-align: left;
+  background: none;
+  border: none;
+  outline: none;
+  align-items: center;
+  gap: 6px;
+  padding: 0 8px;
+  font-size: 13px;
+  line-height: 20px;
+  display: flex;
+}
+.dsh-model-menu-cell:hover, .dsh-model-menu-cell:focus-visible { background: var(--dsw-alias-interactive-bg-hover); }
+.dsh-model-menu-cellLabel { white-space: nowrap; flex: none; }
+.dsh-model-menu-cellValue { text-overflow: ellipsis; white-space: nowrap; text-align: right; min-width: 0; color: var(--dsw-alias-label-tertiary); flex: auto; overflow: hidden; }
+.dsh-model-menu-cellChevron { width: 12px; height: 12px; color: var(--dsw-alias-menu-icon); flex: none; }
+/* Discrete reasoning-effort slider under the model list (enhanced mode).
+ * The painted control is layered over a fully functional native range input:
+ * the input stays on top, transparent, and owns pointer/keyboard/ARIA, while
+ * the decorative track, fill and thumb render beneath it at pointer-events:
+ * none. Position lives in one custom property (--_p, 0–100) on the rail, so
+ * the only animated work a level change triggers is a clip-path/left
+ * transition — no keyframes, no element churn. */
+.dsh-model-menu-sliderGroup { border-top: 0.5px solid var(--dsw-alias-border-l2); flex: none; margin-top: 4px; padding: 6px 8px 8px; }
+.dsh-model-menu-sliderHead { align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 2px 4px; display: flex; }
+.dsh-model-menu-sliderTitle { color: var(--dsw-alias-label-tertiary); font-size: 12px; line-height: 18px; }
+.dsh-model-menu-sliderValue { color: var(--dsw-alias-label-primary); font-size: 13px; font-weight: 600; line-height: 20px; transition: color var(--ds-transition-duration) var(--ds-ease-in-out); }
+.dsh-model-menu-sliderRail { position: relative; direction: ltr; height: 38px; margin-top: 2px; }
+.dsh-model-menu-sliderRail:has(:disabled) { opacity: 0.45; }
+.dsh-model-menu-sliderInput {
+  appearance: none;
+  -webkit-appearance: none;
+  box-sizing: border-box;
+  border: 0;
+  cursor: pointer;
+  direction: ltr;
+  opacity: 0;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  touch-action: pan-y;
+}
+.dsh-model-menu-sliderInput:disabled { cursor: default; }
+/* The transparent input must keep the painted thumb's geometry: an
+ * appearance:none webkit thumb defaults to 16px, which would shift the
+ * end-point positions 7px off the decorative 30px disc and misplace the
+ * native drag hit target. Track gets the full rail height so the whole band
+ * maps to values identically. */
+.dsh-model-menu-sliderInput::-webkit-slider-runnable-track { width: 100%; height: 100%; }
+.dsh-model-menu-sliderInput::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 30px; height: 30px; margin: 0; }
+.dsh-model-menu-sliderInput::-moz-range-track { width: 100%; height: 100%; }
+.dsh-model-menu-sliderInput::-moz-range-thumb { width: 30px; height: 30px; margin: 0; border: 0; }
+.dsh-model-menu-sliderTrack {
+  pointer-events: none;
+  border-radius: 999px;
+  width: 100%;
+  height: 26px;
+  background: var(--dsw-alias-interactive-bg-hover);
+  box-shadow: inset 0 0 0 0.5px var(--dsw-alias-border-l2);
+  position: absolute;
+  inset-inline: 0;
+  top: 50%;
+  transform: translateY(-50%);
+  /* No overflow:hidden — it would clip the fill's drop-shadow glow; the bar's
+   * own clip-path already supplies the rounded reveal shape. */
+}
+/* The accent ramp paints the full track width once and is revealed by an
+ * animated clip-path, so raising the effort unwraps more of the spectrum
+ * instead of squashing the same gradient into a narrower bar. The glow lives
+ * on the un-clipped parent: a filter on the clipped element itself would be
+ * clipped away with it. */
+.dsh-model-menu-sliderFill {
+  display: block;
+  height: 100%;
+  filter: drop-shadow(0 0 5px var(--dsw-alias-state-business-primary));
+  transition: filter var(--ds-transition-duration) var(--ds-ease-in-out);
+}
+.dsh-model-menu-sliderInput:hover:not(:disabled) ~ .dsh-model-menu-sliderTrack .dsh-model-menu-sliderFill,
+.dsh-model-menu-sliderInput:active:not(:disabled) ~ .dsh-model-menu-sliderTrack .dsh-model-menu-sliderFill {
+  filter: drop-shadow(0 0 9px var(--dsw-alias-state-business-primary));
+}
+/* The fill stops at the thumb's center, not at the track edge — at a 30px
+ * thumb the end stops sit 15px in from each side, matching the node dots. */
+.dsh-model-menu-sliderFillBar {
+  display: block;
+  height: 100%;
+  background: linear-gradient(90deg,
+    var(--dsw-alias-state-business-primary),
+    var(--dsw-alias-state-success-primary),
+    var(--dsw-alias-state-warn-primary),
+    var(--dsw-alias-state-error-primary));
+  clip-path: inset(0 calc(100% - 15px - (100% - 30px) * var(--_p, 0) / 100) 0 0 round 999px);
+  transition: clip-path var(--ds-transition-duration) var(--ds-ease-in-out);
+}
+/* Stop dots: one per declared row (default + every advertised effort), evenly
+ * spread across the band between the two thumb-center extremes (inset 15px,
+ * i.e. half the 30px thumb). --_n is 0-100 along that band. A covered dot
+ * reads as a pale pin through the gradient; an uncovered one stays a neutral
+ * notch on the empty track. */
+.dsh-model-menu-sliderNodes {
+  pointer-events: none;
+  display: block;
+  position: absolute;
+  inset-inline: 15px;
+  inset-block: 0;
+}
+.dsh-model-menu-sliderNode {
+  pointer-events: none;
+  box-sizing: border-box;
+  width: 4px;
+  height: 4px;
+  border-radius: 50%;
+  background: color-mix(in srgb, var(--dsw-alias-label-secondary) 35%, transparent);
+  position: absolute;
+  left: calc(var(--_n, 0) * 1%);
+  top: 50%;
+  transform: translate(-50%, -50%);
+  transition: background-color var(--ds-transition-duration) var(--ds-ease-in-out),
+    transform var(--ds-transition-duration) var(--ds-ease-in-out);
+}
+.dsh-model-menu-sliderNode[data-covered] { background: color-mix(in srgb, var(--dsw-alias-label-primary) 60%, transparent); }
+.dsh-model-menu-sliderThumb {
+  pointer-events: none;
+  box-sizing: border-box;
+  border-radius: 50%;
+  width: 30px;
+  height: 30px;
+  background: var(--dsw-alias-button-primary-fill);
+  border: 0.5px solid var(--dsw-alias-border-l4);
+  box-shadow: 0 0 0 3px var(--dsw-alias-interactive-bg-hover), var(--dsw-elevation-soft);
+  position: absolute;
+  left: calc((100% - 30px) * var(--_p, 0) / 100);
+  top: 50%;
+  transform: translateY(-50%) scale(0.92);
+  transition: left var(--ds-transition-duration) var(--ds-ease-in-out),
+    transform var(--ds-transition-duration) var(--ds-ease-in-out),
+    box-shadow var(--ds-transition-duration) var(--ds-ease-in-out);
+}
+.dsh-model-menu-sliderInput:hover:not(:disabled) ~ .dsh-model-menu-sliderThumb { transform: translateY(-50%) scale(1); }
+.dsh-model-menu-sliderInput:active:not(:disabled) ~ .dsh-model-menu-sliderThumb {
+  transform: translateY(-50%) scale(1.1);
+  box-shadow: 0 0 0 4px var(--dsw-alias-interactive-bg-hover), 0 0 12px var(--dsw-alias-state-business-primary);
+}
+.dsh-model-menu-sliderInput:focus-visible ~ .dsh-model-menu-sliderThumb {
+  box-shadow: 0 0 0 3px var(--dsw-alias-interactive-bg-hover),
+    0 0 0 calc(3px + var(--dsw-focus-ring-width)) var(--dsw-focus-ring-color, var(--dsw-alias-state-business-primary));
+}
+@media (prefers-reduced-motion: reduce) {
+  .dsh-model-menu-sliderFill, .dsh-model-menu-sliderFillBar, .dsh-model-menu-sliderThumb,
+  .dsh-model-menu-sliderNode, .dsh-model-menu-sliderValue { transition: none; }
+}
+`;
+//#endregion
+//#region ../dsh-model-route/src/model-picker.ts
+/** Registered Factory name — the `renderFactorySlot`/`registerFactory` key. */
+const MODEL_PICKER_FACTORY = "klarkxy.model-picker";
+/** The one caller-selectable local position: the trigger rendered in place. */
+const MODEL_PICKER_ANCHOR_SLOT = "anchor";
+//#endregion
+//#region src/effort-preference.ts
+const keyOf = (route) => JSON.stringify([route.provider, route.model]);
+/**
+* In-memory per-route effort memory. One instance is shared by the composer
+* seat and any face that submits through `submit`, so a slider pick made in
+* one surface is what the next model pick re-attaches.
+*/
+var EffortPreference = class {
+	/** route key → remembered explicit effort (a cleared route has no entry). */
+	efforts = /* @__PURE__ */ new Map();
+	/** The remembered explicit effort for one route, or undefined. */
+	effortFor(route) {
+		return this.efforts.get(keyOf(route));
+	}
+	/**
+	* Record one confirmed pick. `undefined` clears the route's entry —
+	* "Default" is an explicit choice too, and must not be overridden later.
+	* Callers invoke this only after the Host accepted the selection.
+	*/
+	remember(route, effort) {
+		const key = keyOf(route);
+		if (effort === void 0) this.efforts.delete(key);
+		else this.efforts.set(key, effort);
+	}
+	/**
+	* Effort to attach to a fresh pick of `route`: the remembered value when
+	* the catalog still declares it for that route, else undefined (the pick
+	* then follows the adapter default). Validation is per-route — a model
+	* without declared efforts can never inherit an effort remembered for it.
+	*/
+	resolve(route, reasoning) {
+		const effort = this.efforts.get(keyOf(route));
+		if (effort === void 0) return void 0;
+		return reasoning?.efforts?.includes(effort) ? effort : void 0;
+	}
+	/**
+	* Submit helper for a MODEL pick: merge the remembered effort into
+	* `selection` when no effort is already present and the target route still
+	* supports it, call `select`, and remember the resolved effort only on
+	* success. On failure memory is untouched and the result is returned
+	* verbatim.
+	*
+	* This is NOT the right verb for the slider's "Default" row: a caller
+	* clearing an effort must submit through `select` directly and call
+	* `remember(route, undefined)` only after success — routing the clear
+	* through `submit` would just re-attach the remembered effort.
+	*/
+	async submit(selection, reasoning, select) {
+		const effort = selection.reasoningEffort ?? this.resolve(selection, reasoning);
+		const intent = effort === void 0 ? {
+			provider: selection.provider,
+			model: selection.model
+		} : {
+			...selection,
+			reasoningEffort: effort
+		};
+		const result = await select(intent);
+		if (result?.ok !== true) return result;
+		this.remember(intent, intent.reasoningEffort);
+		return result;
+	}
+};
+//#endregion
+//#region src/client.tsx
+/**
+* Model picker, browser half.
+*
+* Two surfaces ride one component:
+*
+* - `klarkxy.model-picker` (root Factory): the searchable model picker with a
+*   reasoning-effort slider that feature plugins mount through
+*   `renderFactorySlot`. Its props are pure data and callbacks so consumers
+*   never take a runtime dependency on this package — while the definition is
+*   absent the renderer resolves the caller's `options.fallback`.
+* - `conversation.input.model` (single/session, priority -2): the composer
+*   model seat, shadowing the shipped entry (priority 0) and a reasoning-slider
+*   entry (priority -1). The ledger keeps every occupant, so unmounting this
+*   entry restores the previous winner — the native or reference seat returns
+*   automatically on disable/uninstall. The label child slot stays declared by
+*   the shadowed native entry, which means only it may render it; like
+*   reasoning-slider this seat renders the model name verbatim.
+*
+* The seat drives the same per-session ModelDirectory the native seat and the
+* /model popup share (catalog load, selection submission, pending/error
+* projection), so selection semantics stay host-owned.
+*/
+const name = "dsh-model-picker-client";
+const inject = [
+	"slots",
+	"locale",
+	"sessions"
+];
+const MODEL_SEAT_PRIORITY = -2;
+const NS = "model-picker";
+const dictZh = {
+	"trigger.fallback": "请选择模型",
+	"trigger.aria": "选择模型，当前 {model}",
+	"trigger.ariaEffort": "选择模型，当前 {model}，推理等级 {effort}",
+	"menu.model": "模型",
+	"menu.effort": "推理等级",
+	"effort.providerDefault": "跟随模型默认",
+	"search.placeholder": "搜索模型…",
+	"search.clear": "清除搜索",
+	"search.empty": "没有匹配的模型。",
+	"empty.models": "暂无可用模型",
+	"status.loading": "正在刷新模型列表…",
+	"error.action": "模型操作失败：{message}",
+	"action.retry": "重试",
+	"warning.unroutable": "当前模型不在可用目录中"
+};
+const dictEn = {
+	"trigger.fallback": "Select model",
+	"trigger.aria": "Select model, current {model}",
+	"trigger.ariaEffort": "Select model, current {model}, reasoning effort {effort}",
+	"menu.model": "Model",
+	"menu.effort": "Effort",
+	"effort.providerDefault": "Default",
+	"search.placeholder": "Search models…",
+	"search.clear": "Clear search",
+	"search.empty": "No matching models.",
+	"empty.models": "No models available.",
+	"status.loading": "Refreshing model list…",
+	"error.action": "Model operation failed: {message}",
+	"action.retry": "Retry",
+	"warning.unroutable": "The selected model is not in the available catalog"
+};
+function template(text, params) {
+	return params ? text.replace(/\{(\w+)\}/g, (_, k) => String(params[k] ?? `{${k}}`)) : text;
+}
+/** Copy resolver for tests and for faces that never got a framework `t`. */
+function pickerCopy(locale) {
+	const dict = locale?.toLowerCase().startsWith("zh") ? dictZh : dictEn;
+	return (key, params) => template(dict[key], params);
+}
+const modelPickerCss = `${modelMenuCss}
+.dsh-model-picker-status {
+  display: flex; flex-direction: column; gap: 4px; flex: none;
+}
+.dsh-model-picker-statusRow {
+  display: flex; align-items: center; justify-content: space-between; gap: 8px;
+  border-radius: var(--dsw-radius-md); padding: 5px 7px;
+  color: var(--dsw-alias-state-error-primary);
+  background: var(--dsw-alias-interactive-bg-hover-danger);
+  font-size: 12px; line-height: 18px;
+}
+.dsh-model-picker-statusRow[data-tone="warn"] {
+  color: var(--dsw-alias-label-secondary);
+  background: var(--dsw-alias-interactive-bg-hover);
+}
+.dsh-model-picker-statusText { min-width: 0; flex: 1; overflow-wrap: anywhere; }
+.dsh-model-picker-retry {
+  color: inherit; font: inherit; font-weight: 600; cursor: pointer;
+  background: none; border: none; padding: 0 2px; flex: none;
+}
+.dsh-model-picker-retry:hover:not(:disabled) { text-decoration: underline; }
+.dsh-model-picker-retry:disabled { opacity: 0.6; cursor: default; }
+.dsh-model-picker-triggerIcon { display: var(--dsh-composer-model-icon-display, none); flex: none; }
+`;
+/** Directory provider groups → flat ModelMenu choices. */
+function directoryChoices(groups, bound) {
+	const choices = [];
+	for (const group of groups) {
+		const providerName = group.name || group.id;
+		for (const model of group.models) choices.push({
+			provider: group.id,
+			model: model.id,
+			label: `${providerName} / ${model.name || model.id}`,
+			providerLabel: providerName,
+			efforts: (model.reasoning?.efforts ?? []).map((effort) => ({
+				id: effort.id,
+				name: effort.name || effort.id
+			}))
+		});
+	}
+	if (bound?.provider && bound.model && !choices.some((item) => item.provider === bound.provider && item.model === bound.model)) choices.push({
+		provider: bound.provider,
+		model: bound.model,
+		label: `${bound.provider} / ${bound.model}`,
+		efforts: []
+	});
+	return choices;
+}
+function reasoningOf(groups, provider, model) {
+	return groups.find((group) => group.id === provider)?.models.find((entry) => entry.id === model)?.reasoning;
+}
+/** Route key only when the saved model is absent from the catalog. Effort-only
+* snapshot updates must not change this — a new `current` object is not a new list. */
+function outsideCatalogKey(groups, current) {
+	if (!current) return "";
+	for (const group of groups) {
+		if (group.id !== current.provider) continue;
+		if (group.models.some((model) => model.id === current.model)) return "";
+	}
+	return `${current.provider}\0${current.model}`;
+}
+/**
+* DOM attributes the anchor forwards: framework-stamped ARIA, identity and
+* style fields, and event handlers. Everything else in the local props —
+* injected kit members and hook objects — never reaches the DOM.
+*/
+const TRIGGER_FORWARD = /^(aria-|data-|id$|className$|style$|title$|role$|tabIndex$|on[A-Z])/;
+/**
+* The trigger every occurrence gets unless the caller selects its own
+* `anchor` local component. It mirrors the composer's model pill: icon +
+* label + effort caption + chevron (spinner while busy).
+*/
+function DefaultTrigger(props) {
+	const { open, disabled, busy, label, effortLabel, className, ...rest } = props;
+	const forward = {};
+	for (const [key, value] of Object.entries(rest)) if (TRIGGER_FORWARD.test(key)) forward[key] = value;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		type: "button",
+		...forward,
+		className: `dsh-model-menu-trigger${className ? ` ${className}` : ""}`,
+		disabled: disabled || void 0,
+		title: effortLabel ? `${label} · ${effortLabel}` : label,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconDataOutlineRegular, {
+				className: "dsh-model-picker-triggerIcon",
+				size: 16
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsh-model-menu-triggerLabel",
+				children: label
+			}),
+			effortLabel !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsh-model-menu-triggerEffort",
+				children: effortLabel
+			}) : null,
+			busy ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.StateDot, { state: "ongoing" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconChevronDownOutlineRegular, { className: `dsh-model-menu-chevron${open ? " dsh-model-menu-chevronOpen" : ""}` })
+		]
+	});
+}
+/**
+* One picker occurrence. `props` is the consumer's ModelPickerProps plus the
+* framework seats (`t`, `useFactorySlot`, injected hooks). Open state is per
+* occurrence; a `disabled` rise closes the menu and every pick is gated so a
+* busy or disabled picker can never select.
+*/
+function ModelPicker(props) {
+	const { t, useFactorySlot, useActiveLocale, ...input } = props;
+	const activeLocale = useActiveLocale ? String(useActiveLocale((snapshot) => snapshot.active)) : "en";
+	const [open, setOpen] = (0, react.useState)(false);
+	const disabled = input.disabled === true;
+	const busy = input.busy === true;
+	const gatedRef = (0, react.useRef)(disabled || busy);
+	gatedRef.current = disabled || busy;
+	const setMenuOpenRef = (0, react.useRef)((next) => {});
+	setMenuOpenRef.current = (next) => {
+		if (disabled && next) return;
+		setOpen(next);
+		input.onOpenChange?.(next);
+	};
+	const setMenuOpen = (next) => setMenuOpenRef.current(next);
+	const language = input.locale ?? activeLocale;
+	const selected = input.selected;
+	const selectedChoice = (0, react.useMemo)(() => input.choices.find((choice) => choice.provider === selected?.provider && choice.model === selected.model), [
+		input.choices,
+		selected?.provider,
+		selected?.model
+	]);
+	const triggerLabel = input.triggerLabel ?? selectedChoice?.label ?? (selected ? `${selected.provider} / ${selected.model}` : t("trigger.fallback"));
+	const effortRows = input.efforts ?? [];
+	const selectedEffort = input.selectedEffort ?? "";
+	const triggerEffortLabel = input.triggerEffortLabel ?? (selectedEffort ? modelMenuEffortLabel(effortRows.find((row) => row.id === selectedEffort) ?? {
+		id: selectedEffort,
+		name: selectedEffort
+	}, language) : effortRows.length > 0 ? input.defaultEffortLabel ?? t("effort.providerDefault") : void 0);
+	const status = input.status;
+	const loading = status?.busy === true && input.choices.length === 0;
+	const menuHeader = status && (loading || status.error || status.warning || (status.failures?.length ?? 0) > 0) ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsh-model-picker-status",
+		role: status.error ? "alert" : "status",
+		children: [
+			loading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsh-model-picker-statusRow",
+				"data-tone": "info",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsh-model-picker-statusText",
+					children: t("status.loading")
+				})
+			}) : null,
+			status.warning ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsh-model-picker-statusRow",
+				"data-tone": "warn",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsh-model-picker-statusText",
+					children: status.warning
+				})
+			}) : null,
+			status.error ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsh-model-picker-statusRow",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsh-model-picker-statusText",
+					children: t("error.action", { message: status.error })
+				}), status.retry ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsh-model-picker-retry",
+					disabled,
+					onClick: () => status.retry?.(),
+					children: input.retryLabel ?? t("action.retry")
+				}) : null]
+			}) : null,
+			(status.failures ?? []).map((failure) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsh-model-picker-statusRow",
+				"data-tone": "warn",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "dsh-model-picker-statusText",
+					children: [
+						failure.name || failure.id,
+						": ",
+						failure.message
+					]
+				}), status.retry ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsh-model-picker-retry",
+					disabled,
+					onClick: () => status.retry?.(),
+					children: input.retryLabel ?? t("action.retry")
+				}) : null]
+			}, failure.id))
+		]
+	}) : void 0;
+	const gate = (fn) => (...args) => {
+		if (!gatedRef.current) fn?.(...args);
+	};
+	const Anchor = useFactorySlot(MODEL_PICKER_ANCHOR_SLOT, DefaultTrigger);
+	const anchor = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Anchor, {
+		open,
+		disabled,
+		busy,
+		label: triggerLabel,
+		effortLabel: triggerEffortLabel,
+		className: input.triggerClassName,
+		"aria-label": triggerEffortLabel ? t("trigger.ariaEffort", {
+			model: triggerLabel,
+			effort: triggerEffortLabel
+		}) : t("trigger.aria", { model: triggerLabel })
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: modelPickerCss }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModelMenu, {
+		locale: language,
+		open,
+		onOpenChange: setMenuOpen,
+		anchor,
+		choices: input.choices,
+		selected: input.selected,
+		onPick: gate(input.onPick),
+		leading: input.leading ?? [],
+		onPickLeading: gate(input.onPickLeading),
+		menuHeader,
+		disabled,
+		busy,
+		efforts: effortRows,
+		selectedEffort,
+		onPickEffort: gate(input.onPickEffort),
+		modelLabel: input.modelLabel ?? t("menu.model"),
+		modelValue: input.modelValue ?? triggerLabel,
+		effortLabel: input.effortLabel ?? t("menu.effort"),
+		defaultEffortLabel: input.defaultEffortLabel ?? t("effort.providerDefault"),
+		searchPlaceholder: input.searchPlaceholder ?? t("search.placeholder"),
+		emptyLabel: input.emptyLabel ?? (input.choices.length === 0 ? t("empty.models") : t("search.empty")),
+		clearSearchLabel: input.clearSearchLabel ?? t("search.clear"),
+		initialPane: input.initialPane ?? "model",
+		alwaysShowSearch: input.alwaysShowSearch ?? true,
+		reasoningSlider: input.reasoningSlider ?? true,
+		closeOnPick: false,
+		closeOnDisable: false,
+		listClassName: `dsh-model-picker${input.listClassName ? ` ${input.listClassName}` : ""}`,
+		className: "dsh-model-picker"
+	})] });
+}
+/**
+* The composer model seat: the same injected face the native entry exposes,
+* rendered through the shared factory so the composer and every consumer
+* share one picker implementation. The bare ModelMenu below is the last-ditch
+* path for a missing factory — the seat never loses its control.
+*/
+function ComposerModelSeat(props) {
+	const { t } = props;
+	const directory = props.directory;
+	const subscribeDirectory = (0, react.useCallback)((onStoreChange) => directory.subscribe(onStoreChange), [directory]);
+	const snapshotDirectory = (0, react.useCallback)(() => directory.getSnapshot(), [directory]);
+	const state = (0, react.useSyncExternalStore)(subscribeDirectory, snapshotDirectory, snapshotDirectory);
+	const [toast, setToast] = (0, react.useState)(null);
+	const toastSeq = (0, react.useRef)(0);
+	const rootRef = (0, react.useRef)(null);
+	const groups = state.groups;
+	const current = state.current;
+	const outsideKey = outsideCatalogKey(groups, current);
+	const choices = (0, react.useMemo)(() => directoryChoices(groups, outsideKey === "" ? void 0 : {
+		provider: outsideKey.slice(0, outsideKey.indexOf("\0")),
+		model: outsideKey.slice(outsideKey.indexOf("\0") + 1)
+	}), [groups, outsideKey]);
+	const selectedChoice = choices.find((choice) => choice.provider === current?.provider && choice.model === current.model);
+	const reasoning = current ? reasoningOf(groups, current.provider, current.model) : void 0;
+	const efforts = (0, react.useMemo)(() => [...selectedChoice?.efforts ?? []], [selectedChoice]);
+	const busy = state.status === "selecting" || state.pending !== null;
+	(0, react.useEffect)(() => {
+		props.load();
+	}, [props.load]);
+	const onMenuOpenChange = (next) => {
+		if (next) props.load();
+	};
+	const report = (error) => {
+		toastSeq.current += 1;
+		setToast({
+			seq: toastSeq.current,
+			text: t("error.action", { message: `${error.code}: ${error.message}` })
+		});
+	};
+	const submit = (selection) => {
+		props.select(selection).then((result) => {
+			if (result !== void 0 && !result.ok) report(result.error);
+		}).catch((error) => report({
+			code: "model-picker/error",
+			message: error instanceof Error ? error.message : String(error)
+		}));
+	};
+	const unroutable = state.routable === false && current !== null;
+	const pickModel = (route) => {
+		if (current?.provider === route.provider && current.model === route.model) return;
+		if (unroutable && route.provider === current.provider && route.model === current.model) return;
+		submit({
+			provider: route.provider,
+			model: route.model
+		});
+	};
+	const pickEffort = (effort) => {
+		if (!current) return;
+		if ((current.reasoningEffort ?? void 0) === effort) return;
+		submit({
+			provider: current.provider,
+			model: current.model,
+			...effort === void 0 ? {} : { reasoningEffort: effort }
+		});
+	};
+	const modelName = selectedChoice ? selectedChoice.label.split(" / ").slice(1).join(" / ") || selectedChoice.model : current?.model ?? t("trigger.fallback");
+	const effortLabel = reasoning === void 0 ? state.retainedEffort : current?.reasoningEffort !== void 0 ? modelMenuEffortLabel(reasoning.efforts.find((row) => row.id === current?.reasoningEffort) ?? {
+		id: current?.reasoningEffort ?? "",
+		name: current?.reasoningEffort ?? ""
+	}, void 0) : reasoning.efforts.length > 0 || reasoning.defaultEffort !== void 0 ? t("effort.providerDefault") : void 0;
+	if (!props.available) return null;
+	const fallback = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModelMenuFallback, {
+		t,
+		state,
+		choices,
+		efforts,
+		savedEffort: current?.reasoningEffort,
+		effortLabel,
+		modelName,
+		locked: props.locked,
+		busy,
+		onPick: pickModel,
+		onPickEffort: pickEffort,
+		onOpen: onMenuOpenChange,
+		onRetry: () => props.load()
+	});
+	const pickerProps = {
+		choices,
+		selected: current ? {
+			provider: current.provider,
+			model: current.model
+		} : void 0,
+		onPick: pickModel,
+		efforts,
+		selectedEffort: current?.reasoningEffort ?? "",
+		onPickEffort: pickEffort,
+		disabled: props.locked,
+		busy,
+		triggerLabel: modelName,
+		triggerEffortLabel: effortLabel,
+		onOpenChange: onMenuOpenChange,
+		status: {
+			error: state.error,
+			busy: state.status === "loading",
+			warning: unroutable ? t("warning.unroutable") : void 0,
+			failures: state.failures,
+			retry: () => props.load()
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		ref: rootRef,
+		className: "dsh-model-picker",
+		children: [props.renderFactorySlot ? props.renderFactorySlot(MODEL_PICKER_FACTORY, pickerProps, { fallback }) : fallback, 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, {}),
+			anchor: rootRef.current?.closest("[data-composer-card]") ?? rootRef.current,
+			onDone: () => setToast(null)
+		}, toast.seq)]
+	});
+}
+/** Bare-menu fallback used only if the factory never registered. */
+function ModelMenuFallback(props) {
+	const { t, state } = props;
+	const [open, setOpen] = (0, react.useState)(false);
+	(0, react.useEffect)(() => {
+		if (props.locked) setOpen(false);
+	}, [props.locked]);
+	const gated = props.locked || props.busy;
+	const unroutable = state.routable === false && state.current !== null;
+	const loading = state.status === "loading" && props.choices.length === 0;
+	const menuHeader = loading || state.error || unroutable || state.failures.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsh-model-picker-status",
+		role: state.error ? "alert" : "status",
+		children: [
+			loading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsh-model-picker-statusRow",
+				"data-tone": "info",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsh-model-picker-statusText",
+					children: t("status.loading")
+				})
+			}) : null,
+			unroutable ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsh-model-picker-statusRow",
+				"data-tone": "warn",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsh-model-picker-statusText",
+					children: t("warning.unroutable")
+				})
+			}) : null,
+			state.error ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsh-model-picker-statusRow",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsh-model-picker-statusText",
+					children: t("error.action", { message: state.error })
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsh-model-picker-retry",
+					disabled: gated,
+					onClick: props.onRetry,
+					children: t("action.retry")
+				})]
+			}) : null,
+			state.failures.map((failure) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsh-model-picker-statusRow",
+				"data-tone": "warn",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "dsh-model-picker-statusText",
+					children: [
+						failure.name || failure.id,
+						": ",
+						failure.message
+					]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsh-model-picker-retry",
+					disabled: gated,
+					onClick: props.onRetry,
+					children: t("action.retry")
+				})]
+			}, failure.id))
+		]
+	}) : void 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: modelPickerCss }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModelMenu, {
+		locale: "en",
+		open: open && !props.locked,
+		onOpenChange: (next) => {
+			if (props.locked) return;
+			setOpen(next);
+			if (next) props.onOpen(next);
+		},
+		anchor: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DefaultTrigger, {
+			open,
+			disabled: gated,
+			busy: props.busy,
+			label: props.modelName,
+			effortLabel: props.effortLabel,
+			"aria-label": props.effortLabel ? t("trigger.ariaEffort", {
+				model: props.modelName,
+				effort: props.effortLabel
+			}) : t("trigger.aria", { model: props.modelName })
+		}),
+		choices: props.choices,
+		selected: state.current ? {
+			provider: state.current.provider,
+			model: state.current.model
+		} : void 0,
+		onPick: (route) => {
+			if (!gated) props.onPick(route);
+		},
+		menuHeader,
+		disabled: props.locked,
+		busy: props.busy,
+		efforts: props.efforts,
+		selectedEffort: props.savedEffort ?? "",
+		onPickEffort: (effort) => {
+			if (!gated) props.onPickEffort(effort);
+		},
+		modelLabel: t("menu.model"),
+		modelValue: props.modelName,
+		effortLabel: t("menu.effort"),
+		defaultEffortLabel: t("effort.providerDefault"),
+		searchPlaceholder: t("search.placeholder"),
+		emptyLabel: t("empty.models"),
+		clearSearchLabel: t("search.clear"),
+		initialPane: "model",
+		alwaysShowSearch: true,
+		reasoningSlider: true,
+		closeOnPick: false,
+		listClassName: "dsh-model-picker",
+		className: "dsh-model-picker"
+	})] });
+}
+/**
+* Wrap one per-session `ModelDirectory.select` with the page-lifetime effort
+* memory: a cross-route pick with no explicit effort re-attaches the route's
+* last successful human pick (only while the catalog still declares it), and
+* every confirmed selection records its effort so the Host default save —
+* `sessionController.selectModel` persists the complete selection through
+* `agentDefaultModel.saveSelection` — keeps the effort for new Sessions that
+* follow the default. Memory updates strictly on `result.ok === true`; a
+* failure leaves the remembered route untouched. Exported for the wiring spec.
+*/
+function createPreferredSelect(directory, preference) {
+	return async (selection) => {
+		const state = directory.store.getSnapshot();
+		const current = state.current;
+		const sameRoute = current !== null && current.provider === selection.provider && current.model === selection.model;
+		let final = selection;
+		if (!sameRoute && selection.reasoningEffort === void 0) {
+			const reasoning = state.groups.find((group) => group.id === selection.provider)?.models.find((model) => model.id === selection.model)?.reasoning;
+			const effort = preference.resolve(selection, reasoning === void 0 ? void 0 : { efforts: reasoning.efforts.map((row) => row.id) });
+			if (effort !== void 0) final = {
+				...selection,
+				reasoningEffort: effort
+			};
+		}
+		const result = await directory.select(final);
+		if (result?.ok === true) preference.remember(final, final.reasoningEffort);
+		return result;
+	};
+}
+function apply(ctx) {
+	const preference = new EffortPreference();
+	ctx.effect(() => {
+		const zh = ctx.locale?.register(NS, "zh", dictZh);
+		const en = ctx.locale?.register(NS, "en", dictEn);
+		return () => {
+			zh?.();
+			en?.();
+		};
+	});
+	ctx.slots.registerFactory({
+		name: MODEL_PICKER_FACTORY,
+		scope: "root",
+		locale: NS,
+		inject: () => ({ hooks: { activeLocale: ctx.locale } }),
+		slots: { [MODEL_PICKER_ANCHOR_SLOT]: { scope: "root" } }
+	}, ModelPicker);
+	ctx.inject(["modelDirectories"], (scope) => {
+		const directories = scope.modelDirectories;
+		scope.slots.inject("conversation.input.model", () => scope.slots.register({
+			name: "conversation.input.model",
+			priority: MODEL_SEAT_PRIORITY,
+			locale: NS,
+			inject: (sessionId) => {
+				const unavailable = {
+					available: false,
+					directory: {
+						getSnapshot: () => EMPTY_STATE,
+						subscribe: () => () => {},
+						update: () => {},
+						set: () => {}
+					},
+					load: () => {},
+					resolveText: (text) => ctx.locale?.resolveText(text) ?? String(text),
+					select: async () => void 0
+				};
+				if (scope.sessions?.subagentAddress?.(sessionId) !== void 0) return unavailable;
+				try {
+					const directory = directories.directoryFor(sessionId);
+					return {
+						available: true,
+						directory: directory.store,
+						load: () => {
+							directory.load().catch(() => {});
+						},
+						resolveText: (text) => ctx.locale?.resolveText(text) ?? String(text),
+						select: createPreferredSelect(directory, preference)
+					};
+				} catch {
+					return unavailable;
+				}
+			}
+		}, ComposerModelSeat));
+	});
+}
+const EMPTY_STATE = {
+	current: null,
+	routable: null,
+	groups: [],
+	failures: [],
+	status: "idle",
+	pending: null,
+	error: null
+};
+//#endregion
+exports.ComposerModelSeat = ComposerModelSeat;
+exports.ModelPicker = ModelPicker;
+exports.apply = apply;
+exports.createPreferredSelect = createPreferredSelect;
+exports.dictEn = dictEn;
+exports.dictZh = dictZh;
+exports.directoryChoices = directoryChoices;
+exports.inject = inject;
+exports.modelPickerCss = modelPickerCss;
+exports.name = name;
+exports.pickerCopy = pickerCopy;
+
+//# sourceMappingURL=client.inner.cjs.map
+    return module.exports;
+  }
+});