dsh-ui-fortifier 0.1.2 → 0.5.2

package/lib/client.js

@@ -5,25 +5,32 @@ window.__ModuleLoader__.load({
 		var exports = module.exports;
 		Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 		let react_jsx_runtime = require("react/jsx-runtime");
+		let _deepseek_ai_dsh_client_ui_primitives = require("@deepseek-ai/dsh-client-ui-primitives");
+		let react = require("react");
+		let react_dom = require("react-dom");
 		//#region \0dsh-css:D:\data\code\deepseek-harness\packages\my\dsh-ui-fortifier\src\client\settings\FortifierSettingsPage.module.css.mjs
-		const css$1 = ".t1_2kq_page{flex-direction:column;gap:8px;padding:16px;display:flex}.t1_2kq_heading{color:var(--dsw-alias-label-primary);margin:0;font-size:16px;line-height:24px}.t1_2kq_list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.t1_2kq_row{background:var(--dsw-alias-bg-layer-2);border-radius:6px;align-items:center;gap:8px;padding:8px;display:flex}.t1_2kq_row label{cursor:pointer;color:var(--dsw-alias-label-primary);align-items:center;gap:8px;font-size:13px;line-height:20px;display:flex}";
-		const tagId$1 = "dsh-ui-fortifier/FortifierSettingsPage.module.css";
-		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId$1) + "]") === null) {
+		const css$4 = ".t1_2kq_page{flex-direction:column;gap:8px;max-width:520px;padding:16px;display:flex}.t1_2kq_heading{color:var(--dsw-alias-label-primary);margin:0;font-size:16px;line-height:24px}.t1_2kq_list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.t1_2kq_row{justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;display:flex}.t1_2kq_row+.t1_2kq_row{border-top:.5px solid var(--dsw-alias-border-l3)}.t1_2kq_row:hover{background:var(--dsw-alias-interactive-bg-hover)}.t1_2kq_rowLabel{color:var(--dsw-alias-label-primary);font-size:13px;line-height:20px}.t1_2kq_switch{box-sizing:border-box;background:var(--dsw-alias-border-l3);cursor:pointer;border:0;border-radius:10px;flex:none;width:36px;height:20px;padding:2px;position:relative}.t1_2kq_switchOn{background:var(--dsw-alias-brand-primary)}.t1_2kq_switch:disabled{cursor:default;opacity:.5}.t1_2kq_switch:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:2px}.t1_2kq_thumb{corner-shape:round;background:var(--dsw-alias-label-primary-foreground);border-radius:50%;width:16px;height:16px;transition:transform .12s;display:block}.t1_2kq_switchOn .t1_2kq_thumb{transform:translate(16px)}";
+		const tagId$4 = "dsh-ui-fortifier/FortifierSettingsPage.module.css";
+		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId$4) + "]") === null) {
 			const tag = document.createElement("style");
 			tag.dataset.plugin = "dsh-ui-fortifier";
-			tag.dataset.pluginCss = tagId$1;
-			tag.textContent = css$1;
+			tag.dataset.pluginCss = tagId$4;
+			tag.textContent = css$4;
 			document.head.appendChild(tag);
 		}
 		var FortifierSettingsPage_module_css_default = {
 			"heading": "t1_2kq_heading",
 			"list": "t1_2kq_list",
 			"page": "t1_2kq_page",
-			"row": "t1_2kq_row"
+			"row": "t1_2kq_row",
+			"rowLabel": "t1_2kq_rowLabel",
+			"switch": "t1_2kq_switch",
+			"switchOn": "t1_2kq_switchOn",
+			"thumb": "t1_2kq_thumb"
 		};
 		//#endregion
 		//#region src/client/settings/FortifierSettingsPage.tsx
-		/** 设置页：读取配置项自动生成开关行。 */
+		/** 设置页：读取配置项自动生成切换按钮行。 */
 		function FortifierSettingsPage(props) {
 			const t = props.t;
 			const rows = props.useToggles((value) => value);
@@ -34,16 +41,26 @@ window.__ModuleLoader__.load({
 					children: t("nav")
 				}), rows.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: t("empty") }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
 					className: FortifierSettingsPage_module_css_default.list,
-					children: rows.map((row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
-						className: FortifierSettingsPage_module_css_default.row,
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
-							type: "checkbox",
-							checked: row.value,
-							onChange: (event) => {
-								props.set(row.field, event.target.checked);
-							}
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t(`config.${row.field}`) })] })
-					}, row.field))
+					children: rows.map((row) => {
+						const label = t(`config.${row.field}`);
+						return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
+							className: FortifierSettingsPage_module_css_default.row,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: FortifierSettingsPage_module_css_default.rowLabel,
+								children: label
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								type: "button",
+								role: "switch",
+								"aria-checked": row.value,
+								"aria-label": label,
+								className: `${FortifierSettingsPage_module_css_default.switch} ${row.value ? FortifierSettingsPage_module_css_default.switchOn : ""}`,
+								onClick: () => {
+									props.set(row.field, !row.value);
+								},
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: FortifierSettingsPage_module_css_default.thumb })
+							})]
+						}, row.field);
+					})
 				})]
 			});
 		}
@@ -53,13 +70,53 @@ window.__ModuleLoader__.load({
 		const en = {
 			nav: "ui-fortifier",
 			empty: "No feature modules registered.",
-			"config.provider-label": "Show provider in input"
+			"config.provider-label": "Input - Provider",
+			"config.open-dsh-folder": "Settings top-right - Open .dsh folder",
+			"config.settings-frame": "Settings panel - Drag and resize",
+			"config.model-picker": "Input - Cascading model picker",
+			openDshFolder: "Open .dsh folder",
+			"openDshFolder.error": "Could not open the .dsh folder",
+			"openDshFolder.pathLabel": "Path: ",
+			"settingsFrame.drag": "Drag the settings panel",
+			"settingsFrame.resize": "Resize the settings panel",
+			"modelPicker.trigger": "Open cascading model picker",
+			"modelPicker.searchPlaceholder": "Search providers or models",
+			"modelPicker.providers": "Providers",
+			"modelPicker.models": "Models",
+			"modelPicker.emptyProviders": "No providers loaded.",
+			"modelPicker.emptySearch": "No matching providers or models.",
+			"modelPicker.emptyModels": "No models for this provider.",
+			"modelPicker.loading": "Loading…",
+			"modelPicker.loadError": "Failed to load models",
+			"modelPicker.retry": "Retry",
+			"modelPicker.provider": "Provider: {name}",
+			"modelPicker.model": "Model: {name}"
 		};
 		/** 中文文案。 */
 		const zh = {
 			nav: "ui-fortifier",
 			empty: "没有已注册的功能模块。",
-			"config.provider-label": "输入框显示提供商"
+			"config.provider-label": "输入框 - 提供商",
+			"config.open-dsh-folder": "设置右上角 - 打开 .dsh 文件夹",
+			"config.settings-frame": "设置面板 - 拖动与缩放",
+			"config.model-picker": "输入框 - 级联模型选择器",
+			openDshFolder: "打开 .dsh 文件夹",
+			"openDshFolder.error": "无法打开 .dsh 文件夹",
+			"openDshFolder.pathLabel": "路径：",
+			"settingsFrame.drag": "拖动设置面板",
+			"settingsFrame.resize": "缩放设置面板",
+			"modelPicker.trigger": "打开级联模型选择器",
+			"modelPicker.searchPlaceholder": "搜索提供商或模型",
+			"modelPicker.providers": "提供商",
+			"modelPicker.models": "模型",
+			"modelPicker.emptyProviders": "没有已加载的提供商。",
+			"modelPicker.emptySearch": "没有匹配的提供商或模型。",
+			"modelPicker.emptyModels": "该提供商没有模型。",
+			"modelPicker.loading": "加载中…",
+			"modelPicker.loadError": "模型加载失败",
+			"modelPicker.retry": "重试",
+			"modelPicker.provider": "提供商：{name}",
+			"modelPicker.model": "模型：{name}"
 		};
 		//#endregion
 		//#region src/client/settings/index.ts
@@ -68,10 +125,10 @@ window.__ModuleLoader__.load({
 		/**
 		* 注册设置页并绑定功能开关的 settings 作用域。
 		* @param ctx - 需已提供 slots/locale/settingsScope 的客户端上下文。
-		* @param moduleFields - 功能模块字段列表(settings 开关 key),由调用方传入。
+		* @param moduleOrder - 功能模块字段的显示顺序(settings 开关 key)。
 		* @returns 功能开关的 settings 绑定,供调用方控制子模块注册。
 		*/
-		function installSettings(ctx, moduleFields) {
+		function installSettings(ctx, moduleOrder) {
 			ctx.effect(() => ctx.locale.register(UI_FORTIFIER, {
 				zh,
 				en
@@ -86,7 +143,7 @@ window.__ModuleLoader__.load({
 					hooks: { toggles: {
 						getSnapshot: () => {
 							const value = view()?.value ?? {};
-							const rows = moduleFields.map((field) => ({
+							const rows = moduleOrder.map((field) => ({
 								field,
 								value: value[field] ?? true
 							}));
@@ -123,13 +180,13 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region \0dsh-css:D:\data\code\deepseek-harness\packages\my\dsh-ui-fortifier\src\client\provider-label\ProviderLabel.module.css.mjs
-		const css = ".LjXNpG_label{text-overflow:ellipsis;white-space:nowrap;max-width:160px;color:var(--dsw-alias-label-secondary);font-size:13px;line-height:20px;overflow:hidden}";
-		const tagId = "dsh-ui-fortifier/ProviderLabel.module.css";
-		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]") === null) {
+		const css$3 = ".LjXNpG_label{text-overflow:ellipsis;white-space:nowrap;max-width:160px;color:var(--dsw-alias-label-secondary);font-size:13px;line-height:20px;overflow:hidden}";
+		const tagId$3 = "dsh-ui-fortifier/ProviderLabel.module.css";
+		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId$3) + "]") === null) {
 			const tag = document.createElement("style");
 			tag.dataset.plugin = "dsh-ui-fortifier";
-			tag.dataset.pluginCss = tagId;
-			tag.textContent = css;
+			tag.dataset.pluginCss = tagId$3;
+			tag.textContent = css$3;
 			document.head.appendChild(tag);
 		}
 		var ProviderLabel_module_css_default = { "label": "LjXNpG_label" };
@@ -160,24 +217,938 @@ window.__ModuleLoader__.load({
 			}, ProviderLabel));
 		}
 		//#endregion
+		//#region \0dsh-css:D:\data\code\deepseek-harness\packages\my\dsh-ui-fortifier\src\client\open-dsh-folder\OpenDshFolderAction.module.css.mjs
+		const css$2 = "._8KsKXW_action{align-items:center;gap:8px;min-width:0;display:flex}._8KsKXW_error{max-width:180px;color:var(--dsw-alias-state-error-primary);text-overflow:ellipsis;white-space:nowrap;font-size:12px;line-height:18px;overflow:hidden}";
+		const tagId$2 = "dsh-ui-fortifier/OpenDshFolderAction.module.css";
+		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId$2) + "]") === null) {
+			const tag = document.createElement("style");
+			tag.dataset.plugin = "dsh-ui-fortifier";
+			tag.dataset.pluginCss = tagId$2;
+			tag.textContent = css$2;
+			document.head.appendChild(tag);
+		}
+		var OpenDshFolderAction_module_css_default = {
+			"action": "_8KsKXW_action",
+			"error": "_8KsKXW_error"
+		};
+		//#endregion
+		//#region src/client/open-dsh-folder/OpenDshFolderAction.tsx
+		/**
+		* 渲染「打开 .dsh 文件夹」操作，点击后请求 Host 打开 .dsh 目录。
+		* @param props - header owner 参数、本地化文案与注入的打开回调。
+		* @returns 操作按钮及其结果提示。
+		*/
+		function OpenDshFolderAction(props) {
+			const { openDshFolder, t } = props;
+			const [state, setState] = (0, react.useState)({ kind: "idle" });
+			const open = async () => {
+				setState({ kind: "opening" });
+				const result = await openDshFolder();
+				if (!result.ok) {
+					setState({ kind: "error" });
+					return;
+				}
+				setState(result.value.opened ? { kind: "idle" } : {
+					kind: "path",
+					path: result.value.path
+				});
+			};
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: OpenDshFolderAction_module_css_default.action,
+				children: [
+					state.kind === "error" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: OpenDshFolderAction_module_css_default.error,
+						role: "alert",
+						children: t("openDshFolder.error")
+					}) : null,
+					state.kind === "path" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: OpenDshFolderAction_module_css_default.error,
+						role: "alert",
+						children: [t("openDshFolder.pathLabel"), state.path]
+					}) : null,
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+						variant: "outline",
+						size: "sm",
+						disabled: state.kind === "opening",
+						onClick: () => {
+							open();
+						},
+						children: t("openDshFolder")
+					})
+				]
+			});
+		}
+		//#endregion
+		//#region src/client/open-dsh-folder/index.ts
+		/** 本模块文案命名空间(与 host 侧一致)。 */
+		const NS$1 = "ui-fortifier";
+		/**
+		* 注册「打开 .dsh 文件夹」到设置页右上角操作区，仅在回环连接下注册。
+		* @param ctx - 需已提供 slots/connection 的客户端上下文。
+		* @returns 停止注入并卸载注册的 disposer。
+		*/
+		function installOpenDshFolder(ctx) {
+			const connection = ctx.get("connection");
+			if (!connection.isLoopback) return () => {};
+			const openDshFolder = () => connection.rpc.call("/api", "uiFortifier/openDshFolder", { args: {} });
+			return ctx.slots.inject("settings.action", () => ctx.slots.register({
+				name: "settings.action",
+				id: "open-dsh-folder",
+				order: 1,
+				locale: NS$1,
+				inject: () => ({ openDshFolder })
+			}, OpenDshFolderAction));
+		}
+		//#endregion
+		//#region \0dsh-css:D:\data\code\deepseek-harness\packages\my\dsh-ui-fortifier\src\client\settings-frame\SettingsFrameEnhancer.module.css.mjs
+		const css$1 = ".hB-7Ba_hostAnchor{display:none}.hB-7Ba_dragHandle{box-sizing:border-box;width:22px;height:22px;color:var(--dsw-alias-label-secondary);cursor:grab;vertical-align:middle;touch-action:none;background:0 0;border:none;border-radius:6px;flex:none;justify-content:center;align-items:center;margin:0 8px 0 0;padding:0;display:inline-flex}.hB-7Ba_dragHandle:hover{background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-primary)}.hB-7Ba_gripIcon{flex:none;width:10px;height:14px}.hB-7Ba_resizeHandle{cursor:nwse-resize;touch-action:none;background:0 0;border:none;width:16px;height:16px;margin:0;padding:0;position:absolute;bottom:8px;right:8px}.hB-7Ba_resizeHandle:before,.hB-7Ba_resizeHandle:after{content:\"\";pointer-events:none;position:absolute;bottom:0;right:0}.hB-7Ba_resizeHandle:after{border-right:2px solid var(--dsw-alias-label-secondary);border-bottom:2px solid var(--dsw-alias-label-secondary);width:10px;height:10px}.hB-7Ba_resizeHandle:before{border-right:2px solid var(--dsw-alias-label-tertiary);border-bottom:2px solid var(--dsw-alias-label-tertiary);width:6px;height:6px;bottom:4px;right:4px}.hB-7Ba_resizeHandle:hover:after{border-color:var(--dsw-alias-label-primary)}";
+		const tagId$1 = "dsh-ui-fortifier/SettingsFrameEnhancer.module.css";
+		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId$1) + "]") === null) {
+			const tag = document.createElement("style");
+			tag.dataset.plugin = "dsh-ui-fortifier";
+			tag.dataset.pluginCss = tagId$1;
+			tag.textContent = css$1;
+			document.head.appendChild(tag);
+		}
+		var SettingsFrameEnhancer_module_css_default = {
+			"dragHandle": "hB-7Ba_dragHandle",
+			"gripIcon": "hB-7Ba_gripIcon",
+			"hostAnchor": "hB-7Ba_hostAnchor",
+			"resizeHandle": "hB-7Ba_resizeHandle"
+		};
+		//#endregion
+		//#region src/client/settings-frame/SettingsFrameEnhancer.tsx
+		/**
+		* settings-frame 功能：让设置面板可拖动位置与缩放大小。
+		* 组件注册在 settings.action 槽（作为宿主获得面板生命周期），两个手柄均经 portal
+		* 挂载：拖动手柄进左上角标题行，缩放柄进面板右下角；面板改 fixed 定位后仅改内联
+		* 几何，关闭时恢复由 CSS 负责的默认居中尺寸。
+		*/
+		/** 面板最小宽高，防止缩放过小无法操作。 */
+		const MIN_WIDTH = 480;
+		const MIN_HEIGHT = 320;
+		/** localStorage 中面板几何的存储键。 */
+		const FRAME_STORAGE_KEY = "dsh.ui-fortifier.settingsFrame";
+		/** 读取持久化的面板几何；缺失或损坏返回 undefined。 */
+		function readFrameGeometry() {
+			const raw = localStorage.getItem(FRAME_STORAGE_KEY);
+			if (raw === null) return void 0;
+			try {
+				const parsed = JSON.parse(raw);
+				if (typeof parsed.left === "number" && Number.isFinite(parsed.left) && typeof parsed.top === "number" && Number.isFinite(parsed.top) && typeof parsed.width === "number" && Number.isFinite(parsed.width) && typeof parsed.height === "number" && Number.isFinite(parsed.height)) return parsed;
+				return;
+			} catch {
+				return;
+			}
+		}
+		/** 写回持久化的面板几何。 */
+		function writeFrameGeometry(geometry) {
+			localStorage.setItem(FRAME_STORAGE_KEY, JSON.stringify(geometry));
+		}
+		/** 读取面板当前几何并持久化（拖动/缩放结束后调用）。 */
+		function persistGeometry(panel) {
+			writeFrameGeometry({
+				left: panel.offsetLeft,
+				top: panel.offsetTop,
+				width: panel.offsetWidth,
+				height: panel.offsetHeight
+			});
+		}
+		/** 将面板几何钳制在视口内（左上角不小于 0，右下角不越出视口）。 */
+		function constrainPanel(panel) {
+			const vw = window.innerWidth;
+			const vh = window.innerHeight;
+			panel.style.left = `${clamp(panel.offsetLeft, 0, Math.max(0, vw - panel.offsetWidth))}px`;
+			panel.style.top = `${clamp(panel.offsetTop, 0, Math.max(0, vh - panel.offsetHeight))}px`;
+		}
+		/** 窗口尺寸变化时把面板收进视口：先收窄超出视口的宽高（不低于最小尺寸，窗口小于最小尺寸时随窗口），再钳制位置。 */
+		function constrainToViewport(panel) {
+			const vw = window.innerWidth;
+			const vh = window.innerHeight;
+			const width = clamp(panel.offsetWidth, Math.min(MIN_WIDTH, vw), vw);
+			const height = clamp(panel.offsetHeight, Math.min(MIN_HEIGHT, vh), vh);
+			panel.style.width = `${width}px`;
+			panel.style.height = `${height}px`;
+			panel.style.left = `${clamp(panel.offsetLeft, 0, Math.max(0, vw - width))}px`;
+			panel.style.top = `${clamp(panel.offsetTop, 0, Math.max(0, vh - height))}px`;
+		}
+		/** 将一个数值限制在闭合区间。 */
+		function clamp(value, min, max) {
+			return Math.min(Math.max(value, min), max);
+		}
+		/** 六点拖动把手图形（2 列 x 3 行规整点阵）。 */
+		function GripDots() {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+				className: SettingsFrameEnhancer_module_css_default.gripIcon,
+				viewBox: "0 0 10 14",
+				fill: "currentColor",
+				"aria-hidden": "true",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "2.5",
+						cy: "2.5",
+						r: "1.3"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "7.5",
+						cy: "2.5",
+						r: "1.3"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "2.5",
+						cy: "7",
+						r: "1.3"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "7.5",
+						cy: "7",
+						r: "1.3"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "2.5",
+						cy: "11.5",
+						r: "1.3"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "7.5",
+						cy: "11.5",
+						r: "1.3"
+					})
+				]
+			});
+		}
+		/**
+		* 渲染「拖动位置/大小」手柄。
+		* @param props - header owner 参数与本地化文案。
+		* @returns 挂入标题行的拖动手柄与挂入面板右下角的缩放柄。
+		*/
+		function SettingsFrameEnhancer(props) {
+			const { t } = props;
+			const anchorRef = (0, react.useRef)(null);
+			const dragHandleRef = (0, react.useRef)(null);
+			const resizeHandleRef = (0, react.useRef)(null);
+			const [panel, setPanel] = (0, react.useState)(null);
+			const [headerRow, setHeaderRow] = (0, react.useState)(null);
+			(0, react.useEffect)(() => {
+				const anchor = anchorRef.current;
+				if (anchor === null) return;
+				const dialog = anchor.closest("[role=\"dialog\"]");
+				if (!(dialog instanceof HTMLElement)) return;
+				const rect = dialog.getBoundingClientRect();
+				const saved = readFrameGeometry();
+				dialog.style.position = "fixed";
+				dialog.style.left = `${saved === void 0 ? rect.left : saved.left}px`;
+				dialog.style.top = `${saved === void 0 ? rect.top : saved.top}px`;
+				dialog.style.width = `${saved === void 0 ? rect.width : saved.width}px`;
+				dialog.style.height = `${saved === void 0 ? rect.height : saved.height}px`;
+				dialog.style.margin = "0";
+				dialog.style.maxWidth = "none";
+				constrainToViewport(dialog);
+				if (window.innerWidth >= MIN_WIDTH && window.innerHeight >= MIN_HEIGHT) persistGeometry(dialog);
+				setPanel(dialog);
+				const row = dialog.querySelector("nav")?.firstElementChild;
+				setHeaderRow(row instanceof HTMLElement ? row : null);
+				let windowResizeFrame = null;
+				const onWindowResize = () => {
+					if (windowResizeFrame !== null) return;
+					windowResizeFrame = requestAnimationFrame(() => {
+						windowResizeFrame = null;
+						constrainToViewport(dialog);
+						if (window.innerWidth >= MIN_WIDTH && window.innerHeight >= MIN_HEIGHT) persistGeometry(dialog);
+					});
+				};
+				window.addEventListener("resize", onWindowResize);
+				return () => {
+					if (windowResizeFrame !== null) {
+						cancelAnimationFrame(windowResizeFrame);
+						windowResizeFrame = null;
+					}
+					window.removeEventListener("resize", onWindowResize);
+					dialog.style.position = "";
+					dialog.style.left = "";
+					dialog.style.top = "";
+					dialog.style.width = "";
+					dialog.style.height = "";
+					dialog.style.margin = "";
+					dialog.style.maxWidth = "";
+					setPanel(null);
+					setHeaderRow(null);
+				};
+			}, []);
+			(0, react.useEffect)(() => {
+				const handle = dragHandleRef.current;
+				if (handle === null || headerRow === null) return;
+				if (headerRow.firstChild === handle) return;
+				headerRow.insertBefore(handle, headerRow.firstChild);
+			}, [headerRow]);
+			const dragState = (0, react.useRef)(null);
+			const latest = (0, react.useRef)({
+				x: 0,
+				y: 0
+			});
+			const frame = (0, react.useRef)(null);
+			const onDragPointerDown = (event) => {
+				if (panel === null) return;
+				event.preventDefault();
+				event.currentTarget.setPointerCapture(event.pointerId);
+				dragState.current = {
+					offsetX: event.clientX - panel.offsetLeft,
+					offsetY: event.clientY - panel.offsetTop
+				};
+			};
+			const onDragPointerMove = (event) => {
+				if (dragState.current === null) return;
+				latest.current = {
+					x: event.clientX,
+					y: event.clientY
+				};
+				frame.current ??= requestAnimationFrame(() => {
+					frame.current = null;
+					if (panel === null || dragState.current === null) return;
+					panel.style.left = `${latest.current.x - dragState.current.offsetX}px`;
+					panel.style.top = `${latest.current.y - dragState.current.offsetY}px`;
+					constrainPanel(panel);
+				});
+			};
+			const onDragPointerUp = (event) => {
+				if (dragState.current === null) return;
+				if (frame.current !== null) {
+					cancelAnimationFrame(frame.current);
+					frame.current = null;
+				}
+				dragState.current = null;
+				event.currentTarget.releasePointerCapture(event.pointerId);
+				if (panel === null) return;
+				constrainPanel(panel);
+				persistGeometry(panel);
+			};
+			const resizeOrigin = (0, react.useRef)(null);
+			const resizeBase = (0, react.useRef)(null);
+			const resizeMax = (0, react.useRef)(null);
+			const resizeFrame = (0, react.useRef)(null);
+			const onResizePointerDown = (event) => {
+				if (panel === null) return;
+				event.preventDefault();
+				event.stopPropagation();
+				event.currentTarget.setPointerCapture(event.pointerId);
+				resizeOrigin.current = {
+					x: event.clientX,
+					y: event.clientY
+				};
+				resizeBase.current = {
+					width: panel.offsetWidth,
+					height: panel.offsetHeight
+				};
+				resizeMax.current = {
+					width: window.innerWidth - panel.offsetLeft,
+					height: window.innerHeight - panel.offsetTop
+				};
+			};
+			const onResizePointerMove = (event) => {
+				if (resizeOrigin.current === null || resizeBase.current === null || resizeMax.current === null) return;
+				latest.current = {
+					x: event.clientX,
+					y: event.clientY
+				};
+				resizeFrame.current ??= requestAnimationFrame(() => {
+					resizeFrame.current = null;
+					if (panel === null || resizeOrigin.current === null || resizeBase.current === null || resizeMax.current === null) return;
+					const width = clamp(resizeBase.current.width + (latest.current.x - resizeOrigin.current.x), MIN_WIDTH, Math.max(MIN_WIDTH, resizeMax.current.width));
+					const height = clamp(resizeBase.current.height + (latest.current.y - resizeOrigin.current.y), MIN_HEIGHT, Math.max(MIN_HEIGHT, resizeMax.current.height));
+					panel.style.width = `${width}px`;
+					panel.style.height = `${height}px`;
+					constrainPanel(panel);
+				});
+			};
+			const onResizePointerUp = (event) => {
+				if (resizeOrigin.current === null) return;
+				if (resizeFrame.current !== null) {
+					cancelAnimationFrame(resizeFrame.current);
+					resizeFrame.current = null;
+				}
+				resizeOrigin.current = null;
+				resizeBase.current = null;
+				event.currentTarget.releasePointerCapture(event.pointerId);
+				if (panel !== null) persistGeometry(panel);
+			};
+			const dragHandle = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				ref: dragHandleRef,
+				type: "button",
+				className: SettingsFrameEnhancer_module_css_default.dragHandle,
+				title: t("settingsFrame.drag"),
+				"aria-label": t("settingsFrame.drag"),
+				onPointerDown: onDragPointerDown,
+				onPointerMove: onDragPointerMove,
+				onPointerUp: onDragPointerUp,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GripDots, {})
+			});
+			const resizeHandle = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				ref: resizeHandleRef,
+				type: "button",
+				className: SettingsFrameEnhancer_module_css_default.resizeHandle,
+				title: t("settingsFrame.resize"),
+				"aria-label": t("settingsFrame.resize"),
+				onPointerDown: onResizePointerDown,
+				onPointerMove: onResizePointerMove,
+				onPointerUp: onResizePointerUp
+			});
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					ref: anchorRef,
+					className: SettingsFrameEnhancer_module_css_default.hostAnchor
+				}),
+				headerRow !== null && (0, react_dom.createPortal)(dragHandle, headerRow),
+				panel !== null && (0, react_dom.createPortal)(resizeHandle, panel)
+			] });
+		}
+		//#endregion
+		//#region src/client/settings-frame/index.ts
+		/** 本模块文案命名空间(与 host 侧一致)。 */
+		const NS = "ui-fortifier";
+		/**
+		* 注册「拖动位置/大小」增强到设置页右上角操作区。
+		* @param ctx - 需已提供 slots 的客户端上下文。
+		* @returns 停止注入并卸载注册的 disposer。
+		*/
+		function installSettingsFrame(ctx) {
+			const injected = () => ({});
+			return ctx.slots.inject("settings.action", () => ctx.slots.register({
+				name: "settings.action",
+				id: "settings-frame-enhancer",
+				order: 2,
+				locale: NS,
+				inject: injected
+			}, SettingsFrameEnhancer));
+		}
+		//#endregion
+		//#region \0dsh-css:D:\data\code\deepseek-harness\packages\my\dsh-ui-fortifier\src\client\model-picker\ModelPicker.module.css.mjs
+		const css = ".AGI7WG_root{flex:none;display:inline-flex}.AGI7WG_trigger{box-sizing:border-box;width:28px;height:28px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;border-radius:14px;justify-content:center;align-items:center;padding:0;display:inline-flex}.AGI7WG_trigger:hover{background:var(--dsw-alias-interactive-bg-hover)}.AGI7WG_trigger:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.AGI7WG_triggerIcon{flex:none;width:14px;height:14px}.AGI7WG_menu{z-index:1100;box-sizing:border-box;background:var(--dsw-specific-menu);--dsw-elevation-stroke-color:var(--dsw-alias-border-l1);min-width:min(420px,100vw - 32px);max-width:min(520px,100vw - 32px);height:min(420px,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;border-radius:16px;flex-direction:column;padding:6px;display:flex;position:fixed;overflow:hidden}.AGI7WG_search{box-sizing:border-box;background:var(--dsw-alias-bg-layer-2);border:.5px solid var(--dsw-alias-border-l3);border-radius:10px;flex:none;align-items:center;gap:6px;height:28px;margin:0 2px 6px;padding:0 8px;display:flex}.AGI7WG_search:focus-within{border-color:var(--dsw-alias-brand-primary)}.AGI7WG_searchIcon{color:var(--dsw-alias-label-tertiary);flex:none;display:inline-flex}.AGI7WG_searchIcon svg{width:13px;height:13px}.AGI7WG_searchInput{min-width:0;color:var(--dsw-alias-label-primary);font:inherit;background:0 0;border:none;outline:none;flex:1;padding:0;font-size:13px;line-height:20px}.AGI7WG_searchInput::placeholder{color:var(--dsw-alias-label-tertiary)}.AGI7WG_columns{flex:1;min-height:0;display:flex;overflow:hidden}.AGI7WG_providers{flex:none;width:160px;padding-right:4px;overflow-y:auto}.AGI7WG_models{flex:1;min-width:0;padding-left:4px;overflow-y:auto}.AGI7WG_columnTitle{color:var(--dsw-alias-label-tertiary);padding:5px 8px 3px;font-size:12px;font-weight:500;line-height:18px}.AGI7WG_cell{box-sizing:border-box;width:100%;min-height:34px;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:10px;align-items:center;gap:8px;padding:6px 8px;display:flex}.AGI7WG_cell:hover:not(:disabled),.AGI7WG_cell:focus-visible{background:var(--dsw-alias-interactive-bg-hover)}.AGI7WG_cellActive{background:var(--dsw-alias-interactive-bg-active);color:var(--dsw-alias-label-primary)}.AGI7WG_cellSelected{color:var(--dsw-alias-label-primary);font-weight:500}.AGI7WG_cell:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}.AGI7WG_modelName{overflow-wrap:anywhere;flex:1;min-width:0}.AGI7WG_check{color:var(--dsw-alias-brand-primary);flex:none}.AGI7WG_status{color:var(--dsw-alias-label-tertiary);padding:10px;font-size:13px;line-height:20px}.AGI7WG_error{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}.AGI7WG_retry{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;flex:none;padding:0;font-weight:600}";
+		const tagId = "dsh-ui-fortifier/ModelPicker.module.css";
+		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]") === null) {
+			const tag = document.createElement("style");
+			tag.dataset.plugin = "dsh-ui-fortifier";
+			tag.dataset.pluginCss = tagId;
+			tag.textContent = css;
+			document.head.appendChild(tag);
+		}
+		var ModelPicker_module_css_default = {
+			"cell": "AGI7WG_cell",
+			"cellActive": "AGI7WG_cellActive",
+			"cellSelected": "AGI7WG_cellSelected",
+			"check": "AGI7WG_check",
+			"columnTitle": "AGI7WG_columnTitle",
+			"columns": "AGI7WG_columns",
+			"error": "AGI7WG_error",
+			"menu": "AGI7WG_menu",
+			"modelName": "AGI7WG_modelName",
+			"models": "AGI7WG_models",
+			"providers": "AGI7WG_providers",
+			"retry": "AGI7WG_retry",
+			"root": "AGI7WG_root",
+			"search": "AGI7WG_search",
+			"searchIcon": "AGI7WG_searchIcon",
+			"searchInput": "AGI7WG_searchInput",
+			"status": "AGI7WG_status",
+			"trigger": "AGI7WG_trigger",
+			"triggerIcon": "AGI7WG_triggerIcon"
+		};
+		//#endregion
+		//#region src/client/model-picker/ModelPicker.tsx
+		/**
+		* model-picker 功能：输入框右下角(following provider-label)的级联模型选择器。
+		* 左列提供商、右列该提供商的模型；顶部搜索框按名称过滤提供商与模型。
+		* 选择写回官方共享的 modelDirectories，因此与官方模型选择按钮/斜杠命令互通。
+		*/
+		/** 名称是否命中搜索关键字。 */
+		function matchesQuery(name, query) {
+			return query === "" || name.toLowerCase().includes(query);
+		}
+		/**
+		* 在滚动容器内把目标滚进视野。只调整容器自身的 scrollTop，不联动页面滚动，
+		* 因此面板浮在 body 上时不会带动背景页面。
+		* @param container - 滚动容器，缺失时不处理。
+		* @param target - 目标元素，缺失(如已被搜索过滤掉)时不处理。
+		*/
+		function scrollIntoViewWithin(container, target) {
+			if (container === null || target === null) return;
+			const containerRect = container.getBoundingClientRect();
+			const targetRect = target.getBoundingClientRect();
+			if (targetRect.top < containerRect.top) {
+				container.scrollTop -= containerRect.top - targetRect.top;
+				return;
+			}
+			if (targetRect.bottom > containerRect.bottom) container.scrollTop += targetRect.bottom - containerRect.bottom;
+		}
+		/**
+		* 未定位态：隐藏但按原点参与布局，使首帧 offsetWidth/offsetHeight 为真实尺寸，
+		* 定位不存在时也不会闪现在原点(与官方 ModelSelect 同法)。
+		*/
+		const MEASURE_STYLE = {
+			visibility: "hidden",
+			left: 0,
+			top: 0
+		};
+		/**
+		* 面板坐标：右边缘对齐触发按钮右边缘，仅当这样越出视口时才平移回边界内。
+		* 官方 useAnchoredPosition 固定以触发器左边缘为起点且无对齐选项，故本地实现。
+		* @param open - 面板是否展开；关闭时清空坐标。
+		* @param anchorRef - 触发按钮。
+		* @param panelRef - 面板，用于量取自身尺寸做视口钳位。
+		* @param gap - 面板下边缘与触发器上边缘的间距。
+		* @param margin - 面板与视口各边的最小距离。
+		* @returns 面板的 fixed 坐标；首次量取前为 null。
+		*/
+		function useRightAlignedMenuPosition(open, anchorRef, panelRef, gap, margin) {
+			const [position, setPosition] = (0, react.useState)(null);
+			(0, react.useLayoutEffect)(() => {
+				if (!open) {
+					setPosition(null);
+					return;
+				}
+				const place = () => {
+					const rect = anchorRef.current?.getBoundingClientRect();
+					if (rect === void 0) return;
+					const panel = panelRef.current;
+					const width = panel?.offsetWidth ?? 0;
+					const height = panel?.offsetHeight ?? 0;
+					let left = rect.right - width;
+					let top = rect.top - gap - height;
+					if (width > 0) left = Math.min(Math.max(left, margin), window.innerWidth - width - margin);
+					if (height > 0) top = Math.min(Math.max(top, margin), window.innerHeight - height - margin);
+					setPosition({
+						left,
+						top
+					});
+				};
+				place();
+				window.addEventListener("scroll", place, true);
+				window.addEventListener("resize", place);
+				const panel = panelRef.current;
+				let observer = null;
+				if (typeof ResizeObserver !== "undefined" && panel !== null) {
+					observer = new ResizeObserver(place);
+					observer.observe(panel);
+				}
+				return () => {
+					observer?.disconnect();
+					window.removeEventListener("scroll", place, true);
+					window.removeEventListener("resize", place);
+				};
+			}, [
+				open,
+				anchorRef,
+				panelRef,
+				gap,
+				margin
+			]);
+			return position;
+		}
+		/**
+		* 渲染级联模型选择器(左列提供商、右列模型)。
+		* @param props - owner 参数、文案与注入面。
+		* @returns 图标触发器按钮与展开时的两列面板。
+		*/
+		function ModelPicker(props) {
+			const t = props.t;
+			const state = props.useDirectory((value) => value);
+			const [picker, setPicker] = (0, react.useState)({
+				open: false,
+				provider: null,
+				query: "",
+				error: null
+			});
+			const [loading, setLoading] = (0, react.useState)(false);
+			const rootRef = (0, react.useRef)(null);
+			const triggerRef = (0, react.useRef)(null);
+			const menuRef = (0, react.useRef)(null);
+			const providersRef = (0, react.useRef)(null);
+			const modelsRef = (0, react.useRef)(null);
+			const currentProviderRef = (0, react.useRef)(null);
+			const currentModelRef = (0, react.useRef)(null);
+			const searchRef = (0, react.useRef)(null);
+			const positionedRef = (0, react.useRef)(false);
+			const pendingCurrentScrollRef = (0, react.useRef)(false);
+			const position = useRightAlignedMenuPosition(picker.open, triggerRef, menuRef, 8, 12);
+			const groups = state.groups;
+			const current = state.current;
+			const query = picker.query.trim().toLowerCase();
+			const hasModelHit = groups.some((group) => group.models.some((model) => matchesQuery(model.name, query)));
+			const visibleGroups = (0, react.useMemo)(() => {
+				if (query === "") return groups;
+				if (hasModelHit) return groups.filter((group) => group.models.some((model) => matchesQuery(model.name, query)));
+				return groups.filter((group) => matchesQuery(group.name, query));
+			}, [
+				groups,
+				query,
+				hasModelHit
+			]);
+			const activeGroup = visibleGroups.find((group) => group.id === picker.provider) ?? visibleGroups[0];
+			const activeProvider = activeGroup?.id ?? null;
+			const activeModels = (0, react.useMemo)(() => {
+				if (activeGroup === void 0) return [];
+				if (query === "") return activeGroup.models;
+				if (hasModelHit) return activeGroup.models.filter((model) => matchesQuery(model.name, query));
+				return activeGroup.models;
+			}, [
+				activeGroup,
+				query,
+				hasModelHit
+			]);
+			(0, react.useLayoutEffect)(() => {
+				if (!picker.open) {
+					positionedRef.current = false;
+					pendingCurrentScrollRef.current = false;
+					return;
+				}
+				if (pendingCurrentScrollRef.current) {
+					if (currentModelRef.current === null) return;
+					scrollIntoViewWithin(modelsRef.current, currentModelRef.current);
+					pendingCurrentScrollRef.current = false;
+					return;
+				}
+				if (positionedRef.current) return;
+				if (currentProviderRef.current === null && currentModelRef.current === null) return;
+				scrollIntoViewWithin(providersRef.current, currentProviderRef.current);
+				scrollIntoViewWithin(modelsRef.current, currentModelRef.current);
+				positionedRef.current = true;
+			}, [
+				picker.open,
+				activeProvider,
+				current?.provider,
+				current?.model,
+				visibleGroups,
+				activeModels
+			]);
+			(0, react.useEffect)(() => {
+				if (!picker.open) return;
+				const closeOutside = (event) => {
+					const target = event.target;
+					if (rootRef.current?.contains(target) === true) return;
+					if (menuRef.current?.contains(target) === true) return;
+					setPicker((p) => ({
+						...p,
+						open: false
+					}));
+				};
+				document.addEventListener("mousedown", closeOutside);
+				return () => {
+					document.removeEventListener("mousedown", closeOutside);
+				};
+			}, [picker.open]);
+			const open = () => {
+				setPicker((p) => ({
+					...p,
+					open: true,
+					provider: p.provider ?? current?.provider ?? null
+				}));
+				props.load();
+				setLoading(state.status === "loading" || state.status === "idle");
+				queueMicrotask(() => {
+					searchRef.current?.focus();
+				});
+			};
+			const close = (restoreFocus = false) => {
+				setPicker((p) => ({
+					...p,
+					open: false
+				}));
+				if (restoreFocus) queueMicrotask(() => {
+					triggerRef.current?.focus();
+				});
+			};
+			const chooseProvider = (provider) => {
+				setPicker((p) => ({
+					...p,
+					provider
+				}));
+				if (provider === current?.provider) {
+					if (provider === activeProvider) {
+						scrollIntoViewWithin(modelsRef.current, currentModelRef.current);
+						pendingCurrentScrollRef.current = false;
+						return;
+					}
+					pendingCurrentScrollRef.current = true;
+					return;
+				}
+				pendingCurrentScrollRef.current = false;
+				if (modelsRef.current !== null) modelsRef.current.scrollTop = 0;
+			};
+			const chooseModel = (modelId) => {
+				if (activeProvider === null) return;
+				const model = activeGroup?.models.find((m) => m.id === modelId);
+				if (model === void 0) return;
+				const selection = {
+					provider: activeProvider,
+					model: modelId,
+					...model.reasoning?.defaultEffort === void 0 ? {} : { reasoningEffort: model.reasoning.defaultEffort }
+				};
+				if (current?.provider === activeProvider && current.model === modelId) {
+					close(true);
+					return;
+				}
+				props.select(selection).then((accepted) => {
+					if (accepted) close(true);
+					else setPicker((p) => ({
+						...p,
+						error: t("modelPicker.loadError")
+					}));
+				});
+			};
+			const hasError = state.error !== null || picker.error !== null;
+			const shownError = state.error ?? picker.error;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				ref: rootRef,
+				className: ModelPicker_module_css_default.root,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					ref: triggerRef,
+					type: "button",
+					className: ModelPicker_module_css_default.trigger,
+					"aria-label": t("modelPicker.trigger"),
+					"aria-haspopup": "dialog",
+					"aria-expanded": picker.open,
+					title: t("modelPicker.trigger"),
+					onClick: () => {
+						if (picker.open) close();
+						else open();
+					},
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+						viewBox: "0 0 16 16",
+						className: ModelPicker_module_css_default.triggerIcon,
+						"aria-hidden": "true",
+						fill: "none",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+								x: "2",
+								y: "2",
+								width: "5",
+								height: "5",
+								rx: "1.5",
+								stroke: "currentColor",
+								strokeWidth: "1.5"
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+								x: "9",
+								y: "2",
+								width: "5",
+								height: "5",
+								rx: "1.5",
+								stroke: "currentColor",
+								strokeWidth: "1.5"
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+								x: "2",
+								y: "9",
+								width: "5",
+								height: "5",
+								rx: "1.5",
+								stroke: "currentColor",
+								strokeWidth: "1.5"
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+								x: "9",
+								y: "9",
+								width: "5",
+								height: "5",
+								rx: "1.5",
+								stroke: "currentColor",
+								strokeWidth: "1.5"
+							})
+						]
+					})
+				}), picker.open && (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					ref: menuRef,
+					className: ModelPicker_module_css_default.menu,
+					role: "dialog",
+					"aria-label": t("modelPicker.trigger"),
+					style: position ?? MEASURE_STYLE,
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: ModelPicker_module_css_default.search,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: ModelPicker_module_css_default.searchIcon,
+							"aria-hidden": "true",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+								viewBox: "0 0 16 16",
+								fill: "none",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+									cx: "7",
+									cy: "7",
+									r: "4.5",
+									stroke: "currentColor",
+									strokeWidth: "1.5"
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+									d: "M10.5 10.5 14 14",
+									stroke: "currentColor",
+									strokeWidth: "1.5",
+									strokeLinecap: "round"
+								})]
+							})
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+							ref: searchRef,
+							className: ModelPicker_module_css_default.searchInput,
+							type: "text",
+							value: picker.query,
+							placeholder: t("modelPicker.searchPlaceholder"),
+							onChange: (event) => {
+								setPicker((p) => ({
+									...p,
+									query: event.target.value
+								}));
+							},
+							"aria-label": t("modelPicker.searchPlaceholder")
+						})]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: ModelPicker_module_css_default.columns,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
+							ref: providersRef,
+							className: ModelPicker_module_css_default.providers,
+							"aria-label": t("modelPicker.providers"),
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: ModelPicker_module_css_default.columnTitle,
+								children: t("modelPicker.providers")
+							}), state.status === "loading" || loading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: ModelPicker_module_css_default.status,
+								children: t("modelPicker.loading")
+							}) : groups.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: ModelPicker_module_css_default.status,
+								children: t("modelPicker.emptyProviders")
+							}) : visibleGroups.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: ModelPicker_module_css_default.status,
+								children: t("modelPicker.emptySearch")
+							}) : visibleGroups.map((group) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								ref: group.id === activeProvider ? currentProviderRef : null,
+								type: "button",
+								className: `${ModelPicker_module_css_default.cell} ${group.id === activeProvider ? ModelPicker_module_css_default.cellActive : ""}`,
+								onClick: () => {
+									chooseProvider(group.id);
+								},
+								children: group.name
+							}, group.id))]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+							ref: modelsRef,
+							className: ModelPicker_module_css_default.models,
+							"aria-label": t("modelPicker.models"),
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: ModelPicker_module_css_default.columnTitle,
+									children: t("modelPicker.models")
+								}),
+								hasError && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: ModelPicker_module_css_default.error,
+									role: "alert",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: shownError }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										className: ModelPicker_module_css_default.retry,
+										onClick: () => {
+											props.load();
+											setPicker((p) => ({
+												...p,
+												error: null
+											}));
+										},
+										children: t("modelPicker.retry")
+									})]
+								}),
+								activeProvider === null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: ModelPicker_module_css_default.status,
+									children: t("modelPicker.emptyModels")
+								}) : activeModels.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: ModelPicker_module_css_default.status,
+									children: t("modelPicker.emptyModels")
+								}) : activeModels.map((model) => {
+									const selected = current?.provider === activeProvider && current.model === model.id;
+									return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+										ref: selected ? currentModelRef : null,
+										type: "button",
+										className: `${ModelPicker_module_css_default.cell} ${selected ? ModelPicker_module_css_default.cellSelected : ""}`,
+										disabled: state.status === "selecting",
+										onClick: () => {
+											chooseModel(model.id);
+										},
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+											className: ModelPicker_module_css_default.modelName,
+											children: model.name
+										}), selected ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+											className: ModelPicker_module_css_default.check,
+											"aria-hidden": "true",
+											children: "✓"
+										}) : null]
+									}, model.id);
+								})
+							]
+						})]
+					})]
+				}), document.body)]
+			});
+		}
+		//#endregion
+		//#region src/client/model-picker/index.ts
+		/**
+		* 注册模型选择器到 conversation.input.right（provider-label 右侧）。
+		* @param ctx - 需已提供 modelDirectories 服务的客户端上下文。
+		* @returns 停止注入并卸载注册的 disposer。
+		*/
+		function installModelPicker(ctx) {
+			return ctx.slots.inject("conversation.input.right", () => ctx.slots.register({
+				name: "conversation.input.right",
+				id: "model-picker",
+				order: 1e3,
+				locale: "ui-fortifier",
+				inject: (sessionId) => {
+					const directory = ctx.modelDirectories.directoryFor(sessionId);
+					return {
+						hooks: { directory: directory.store },
+						load: () => {
+							directory.load().catch(() => {});
+						},
+						select: (selection) => directory.select(selection).then(() => true, () => false)
+					};
+				}
+			}, ModelPicker));
+		}
+		//#endregion
 		//#region src/client/index.ts
 		/** 功能模块清单：字段名(settings 开关 key) → 模块安装面。 */
-		const modules = { "provider-label": {
-			module: installProviderLabel,
-			dispose: void 0
-		} };
+		const modules = {
+			"provider-label": {
+				module: installProviderLabel,
+				dispose: void 0
+			},
+			"open-dsh-folder": {
+				module: installOpenDshFolder,
+				dispose: void 0
+			},
+			"settings-frame": {
+				module: installSettingsFrame,
+				dispose: void 0
+			},
+			"model-picker": {
+				module: installModelPicker,
+				dispose: void 0
+			}
+		};
+		/** 设置页开关行的显示顺序(按位置排序)；不在表中的字段排在其后。 */
+		const MODULE_ORDER = [
+			"provider-label",
+			"model-picker",
+			"open-dsh-folder",
+			"settings-frame"
+		];
 		const inject = [
 			"slots",
 			"locale",
 			"settingsScope",
-			"modelDirectories"
+			"modelDirectories",
+			"connection",
+			"sessions",
+			"remote",
+			"remote.session"
 		];
 		/**
 		* 客户端插件体：注册设置页并据开关状态挂载各功能模块。
-		* @param ctx - 需已提供 slots/locale/settingsScope/modelDirectories 的客户端上下文。
+		* @param ctx - 需已提供 slots/locale/settingsScope/modelDirectories/connection/sessions/remote 的客户端上下文。
 		*/
 		function apply(ctx) {
-			const scope = installSettings(ctx, Object.keys(modules));
+			const scope = installSettings(ctx, MODULE_ORDER);
 			for (const field of Object.keys(modules)) {
 				const item = modules[field];
 				const sync = () => {
@@ -191,6 +1162,7 @@ window.__ModuleLoader__.load({
 			}
 		}
 		//#endregion
+		exports.MODULE_ORDER = MODULE_ORDER;
 		exports.apply = apply;
 		exports.inject = inject;
 		exports.modules = modules;