dsh-calorie 0.3.10 → 0.3.12

package/dist/client.js

@@ -28,137 +28,52 @@ window.__ModuleLoader__.load({
 		//#endregion
 		let react = require("react");
 		react = __toESM(react, 1);
-		//#region src/contract.ts
-		/** dsh-calorie 端口（port）：DSH 世界与卡路里 hexagon 之间的契约。
+		//#region ../plugin-manager/dist/config-panel-contract.js
+		/** 共用配置面板 · 契约：行表形状、配置面回执、几条两侧共用的常量。
 		*
-		* browser 安全：零 node 导入。host 适配器（注册 RPC 通道）与 client
-		* 适配器（调用 RPC）共用同一份定义；单测与 loader 回路以此为准。
-		* 通道命名遵守宿主约束：单段且不等于 /api（见 cookbook「RPC 通道」）。
+		* 为什么住这里：六个单品插件的设置页各有一份逐字相同的那套代码（卡片骨架／行渲染／样式表／
+		* 状态机／配置面三通电话约 3105 行）。本件是抽件之后的**唯一一处定义地**。
+		*
+		* 本件不认识任何一家能力：行表由调用方给，分支只能由行表数据与配置面回执决定，
+		* 里面不出现任何一个能力的名字（结构纪律「依赖方向」）。
+		*
+		* 对外只经 `config-panel-api.ts` 那一道门；本件自己不出门。
 		*/
-		const RPC_CHANNEL = "/ilife-calorie";
-		const RPC_ENDPOINT_READ = "read";
-		/** #676 配置端点：读设置页整面、保存一份取值、重置为默认。同走一条通道，靠端点名分发。 */
+		/** 面板对配置面的三通电话：读整面／保存一份取值／重置为默认。三个名字各家逐字相同，收在这里一处。 */
 		const RPC_ENDPOINT_CONFIG_GET = "config.get";
 		const RPC_ENDPOINT_CONFIG_SAVE = "config.save";
 		const RPC_ENDPOINT_CONFIG_RESET = "config.reset";
-		/** 面板默认读键（与 HITL 一致性对比同键）。 */
-		const DEFAULT_READ_KEY = "calorie.view.home";
-		/** 信封守卫：供 client 拆包前校验（port 拥有信封定义，守卫住 port）。 */
-		function isRpcResult(raw) {
+		/** 高级组标题与副文案（六家逐字相同，收在这里一处）。 */
+		const ADVANCED_GROUP_TITLE = "高级";
+		const ADVANCED_GROUP_NOTE = "不常改。留空＝用默认值。";
+		/** 请求超时毫秒：与宿主侧 SPAWN_TIMEOUT_MS 同级，界面永不无限转圈。 */
+		const READ_TIMEOUT_MS$1 = 2e4;
+		/** 复制那一枚按钮就地变「已复制」之后，多久变回「复制」（定稿 v3 第三条：1.5 秒，不弹提示）。 */
+		const COPY_FEEDBACK_MS = 1500;
+		/** 宿主给「这是哪一种目录选择能力」时用的那两格原语的名字（软依赖：按名字现取，缺席即没有入口）。 */
+		const REMOTE_DIRECTORY_PICKER = "remote.directoryPicker";
+		/** 宿主在「这条路不给」时回的那个码（`directory-browser-state` 的 `openRowBrowser` 只照比不认名）。 */
+		const DIRECTORY_PICKER_REFUSED = "directory-picker/unavailable";
+		/** 信封守卫：拆包前校验（信封形状的定义地在这里）。 */
+		function isRpcResult$1(raw) {
 			if (typeof raw !== "object" || raw === null) return false;
-			const ok = raw.ok;
-			return ok === true || ok === false;
+			return raw.ok === true || raw.ok === false;
 		}
 		//#endregion
-		//#region src/slot.ts
-		const SLOT_TITLE = "卡路里";
-		//#endregion
-		//#region src/settings.ts
-		/** 常用项：数据目录／库文件名／产物目录名／照片目录／训记 KEY（可改 3 ＋ 只读 2）。 */
-		const COMMON = [
-			{
-				key: "db.dir",
-				title: "数据目录",
-				tier: "common",
-				control: "directory",
-				prefillFrom: "dataDir",
-				hint: "库文件与各类产物的根目录。留空＝用默认目录。"
-			},
-			{
-				key: "db.name",
-				title: "库文件名",
-				tier: "common",
-				control: "text",
-				readonly: true,
-				resolveFrom: "dbFile",
-				hint: "数据目录下的数据库文件。只读，要改请编辑配置文件。"
-			},
-			{
-				key: "html.dir",
-				title: "HTML 产物目录名",
-				tier: "common",
-				control: "text",
-				readonly: true,
-				resolveFrom: "htmlDir",
-				hint: "数据目录下存放交付页面的子目录。只读，要改请编辑配置文件。"
-			},
-			{
-				key: "photos.dir",
-				title: "照片目录",
-				tier: "common",
-				control: "directory",
-				prefillResolved: "photosDir",
-				hint: "身材照的存放目录。留空＝用默认目录（数据目录下的 photos）。"
-			},
-			{
-				key: "xunji.key",
-				title: "训记 KEY",
-				tier: "common",
-				control: "text",
-				hint: "训记的凭据。留空＝未配置，推送与回写会被拦下。"
-			}
-		];
-		/** 高级项：默认收起（只读 6 项）。改错了多半只是自己撞上麻烦，不确定就别动。 */
-		const ADVANCED = [
-			{
-				key: "photos.gifs",
-				title: "照片 GIF 子目录",
-				tier: "advanced",
-				control: "text",
-				readonly: true,
-				resolveFrom: "gifsDir",
-				hint: "照片目录下存放 GIF 的子目录。只读，要改请编辑配置文件。"
-			},
-			{
-				key: "xunji.stateDir",
-				title: "训记状态文件目录",
-				tier: "advanced",
-				control: "directory",
-				readonly: true,
-				resolveFrom: "stateDir",
-				hint: "训记的限频与同步游标存放目录。只读，要改请编辑配置文件。"
-			},
-			{
-				key: "xunji.catalog",
-				title: "训记动作库路径",
-				tier: "advanced",
-				control: "text",
-				readonly: true,
-				resolveFrom: "catalog",
-				hint: "动作名判定用的动作库。只读，要改请编辑配置文件。"
-			},
-			{
-				key: "xunji.backfillDays",
-				title: "回写默认天数",
-				tier: "advanced",
-				control: "number",
-				readonly: true,
-				hint: "从训记拉实绩时默认回溯的天数。只读，要改请编辑配置文件。"
-			},
-			{
-				key: "land.xunjiSeconds",
-				title: "训记调用限时（秒）",
-				tier: "advanced",
-				control: "number",
-				readonly: true,
-				hint: "调用训记的超时秒数。只读，要改请编辑配置文件。"
-			},
-			{
-				key: "land.landSeconds",
-				title: "落地调用限时（秒）",
-				tier: "advanced",
-				control: "number",
-				readonly: true,
-				hint: "落地训练各步骤的超时秒数。只读，要改请编辑配置文件。"
-			}
-		];
-		/** 设置页的行表，顺序即页面顺序。 */
-		const CONFIG_ITEMS = [...COMMON, ...ADVANCED];
-		/** 常用项行数（页面上直接画出来的那些）。 */
-		const COMMON_ITEM_COUNT = COMMON.length;
-		/** 高级组标题与副文案。 */
-		const ADVANCED_GROUP_TITLE = "高级";
-		const ADVANCED_GROUP_NOTE = "不常改。留空＝用默认值。";
+		//#region ../plugin-manager/dist/config-panel-value.js
+		/** 共用配置面板 · 取值与填值半：一份配置取值 ↔ 一张表单态，外加脏基线、跟随键、人话报错与三通电话。
+		*
+		* 本件**不认识 React**，也不认识宿主：喂一份配置面回执与一张行表，它把「页面上每一行该显示什么」
+		* 算出来（取值），再把「表单态里哪几格真能改」还原成一份取值（填值）。因此它在 Node 里就能直测。
+		*
+		* 三条口径（照 #749 起的定稿）：
+		*   · **只读行显示技能算好的绝对值**（回执 `resolved` 组那一格）：面板一个字都不算；回执缺那一格
+		*     （旧技能）就显示空串，绝不编一条路径出来。
+		*   · **可改行取值空着**时，直接把回执里那个落点绝对路径显示上去——用户不必自己拼路径。
+		*   · **保存只提交真能改的行**：只读行显示的是绝对路径，把它当配置值写回去就是把「显示」当「配置」。
+		*
+		* 对外只经 `config-panel-api.ts` 那一道门；本件自己不出门。
+		*/
 		/** 按 `a.b` 路径从配置取值里读（缺层或类型不符一律回 undefined）。 */
 		function readPath(values, key) {
 			const parts = key.split(".");
@@ -181,31 +96,157 @@ window.__ModuleLoader__.load({
 			}
 			cur[parts[parts.length - 1]] = value;
 		}
-		//#endregion
-		//#region src/dsh-ctx.ts
-		/** 宿主目录选择命名空间的服务名（#736；出处与禁令见 cookbook §13）。 */
-		const REMOTE_DIRECTORY_PICKER = "remote.directoryPicker";
-		/** 宿主「这条路没给」的回执码（#744）：一次组合里只服务一种能力（native 或 browse），
-		* 另一条路上的动词一律回它。
+		/** 落点来源取一格：先看回执 `resolved` 组同名格，再看回执顶层同名格（两种写法收成同一格）。
 		*
-		* 出处：`@deepseek-ai/dsh-api-workspace-controller/lib/types/directory-picker.js` 的 `requireCapability()`
-		* ——`RemoteError('directory-picker/unavailable', …)`。三条动词在客户端命名空间上都在，
-		* 所以只有真调一次、看它拒没拒，才知道组合里服务哪种能力。
-		* 共用件不认识这个名字（只照比对），于是这条宿主事实住在本镜像里。 */
-		const DIRECTORY_PICKER_REFUSED = "directory-picker/unavailable";
-		/** 总管那条电话通道的两个字面量（#744）：载体第一段与第二段。
+		* 顶层那一格为什么只认 `dataDir`：它是**技能算出来的生效数据目录**这个概念的格名，各家的回执
+		* 都叫它 `dataDir`；其余落点（照片目录、附件目录等）一律住在 `resolved` 组里。本件不猜别的名字。 */
+		function prefillValueOf(source, name) {
+			const fromResolved = source.resolved?.[name];
+			if (typeof fromResolved === "string" && fromResolved !== "") return fromResolved;
+			if (name === "dataDir" && typeof source.dataDir === "string" && source.dataDir !== "") return source.dataDir;
+		}
+		/** 只读行显示什么：标了 `resolveFrom` ⇒ 回执 `resolved` 组那一格（技能算好的绝对路径）；
+		*  没标 ⇒ 配置文件里那个值本身（数字类只读项走这一档：显示的是生效数字）。 */
+		function readonlyTextOf(item, raw, source) {
+			if (item.resolveFrom === void 0) return raw;
+			const shown = source.resolved?.[item.resolveFrom];
+			return typeof shown === "string" ? shown : "";
+		}
+		/** 把配置取值铺成「行键 → 控件里的文本」（页面表单态；值缺项即空串，不返空留白）。 */
+		function toDraft(items, values, source) {
+			const draft = {};
+			for (const item of items) {
+				const v = readPath(values, item.key);
+				const raw = v === void 0 || v === null ? "" : String(v);
+				if (item.readonly === true) {
+					draft[item.key] = readonlyTextOf(item, raw, source);
+					continue;
+				}
+				const fallback = item.prefillFrom === void 0 ? void 0 : prefillValueOf(source, item.prefillFrom);
+				draft[item.key] = raw === "" && fallback !== void 0 ? fallback : raw;
+			}
+			return draft;
+		}
+		/** 表单态 → 配置取值（按控件种类还原类型；空串对文本项照收，语义由「按默认落点」承担）。
+		*
+		*  **只读行不收**：它们显示的是技能算好的绝对路径，写回配置就是把「显示的路径」当成「配置值」——
+		*  保存只提交真能改的那些行，其余键由技能侧做组内合并保留现值。 */
+		function fromDraft(items, draft) {
+			const values = {};
+			for (const item of items) {
+				if (item.readonly === true) continue;
+				const raw = draft[item.key] ?? "";
+				if (item.control === "number") {
+					const n = Number(raw);
+					writePath(values, item.key, Number.isFinite(n) ? n : 0);
+				} else if (item.control === "switch") writePath(values, item.key, raw === "true");
+				else writePath(values, item.key, raw);
+			}
+			return values;
+		}
+		/** 可改行（脏基线只看这一档）。 */
+		function editableItemsOf(items) {
+			return items.filter((item) => item.readonly !== true);
+		}
+		/** 脏键：表单态里与「刚读到的整面」不一致的**可改行**。
+		*
+		*  只读行不进来：它们显示的是技能算好的绝对路径，拿它当「改动」会让面板一打开就显示「未保存」。 */
+		function dirtyKeysOf(items, draft, baseline) {
+			return editableItemsOf(items).filter((item) => (draft[item.key] ?? "") !== (baseline[item.key] ?? "")).map((item) => item.key);
+		}
+		/** 跟随映射的缺省：没有映射就是「一行都不跟随」。 */
+		function noFollowKeys() {
+			return [];
+		}
+		/** 这一行有没有「写的值 ≠ 生效值」这回事：只要是可改行、标了落点来源、写的非空、
+		*  且技能算出来的生效值另有其值（去掉尾分隔符后仍不同），就报这两个事实。 */
+		function fallbackFactsOf(item, raw, source) {
+			if (item.readonly === true || item.prefillFrom === void 0) return null;
+			const written = raw.trim();
+			if (written === "") return null;
+			const effective = prefillValueOf(source, item.prefillFrom);
+			if (effective === void 0) return null;
+			const strip = (path) => path.replace(/[\\/]+$/, "");
+			if (strip(written) === strip(effective)) return null;
+			return {
+				written,
+				effective
+			};
+		}
+		/** 配置面报错 → 人话指引。
 		*
-		* 出处：主管包 `packages/plugin-manager/src/update-contract.ts` 的 `MANAGER_RPC.base`／`.endpoint`
-		* ——那边是一处定义，这边是镜像（本包不许 import 总管的宿主半：会把 node 内建带进浏览器束）。
-		* 传错第一段就是 404：总管自己在 #678 栽过一次、各家的配置体检在 #735 又栽过一次。 */
-		const MANAGER_RPC_BASE = "/api";
-		const MANAGER_RPC_ENDPOINT = "ilife-manager";
-		/** 总管那通「本机根清单」电话名（#744）：入参 `{}`，回包 `{roots: [{path, kind}]}`。
+		*  报文由技能侧给出（`base-link-core` 的 `ConfigError` 已带行号与文件名，技能 `cli/config.ts`
+		*  原样交出，插件 bridge 原样带上），所以这里**不重写报文**，只按报错类补一句「接下来怎么办」。 */
+		function humanizeConfigFailure(code, message) {
+			const text = message.trim().length > 0 ? message.trim() : `（${code}，宿主未给报文）`;
+			if (/解析|YAML|parse/i.test(text)) return `${text}\n改回「键: 值」的写法，或点「重置为默认」。`;
+			if (/不认识|未知键|UNKNOWN_KEY/i.test(text)) return `${text}\n删掉页面上没有的行，或点「重置为默认」。`;
+			if (/类型|TYPE_MISMATCH/i.test(text)) return `${text}\n按本页的控件形状填，或点「重置为默认」。`;
+			if (/缺席|missing-cli/i.test(text)) return `${text}\n技能出口没找到：先确认技能包已装好，再点「重新读取」。`;
+			return `${text}\n改不动就点「重置为默认」，或照上面那条路径手工改配置文件。`;
+		}
+		/** 有界等待：借平台 `AbortSignal.timeout` 的 abort 事件做**一次**超时拒绝。
 		*
-		* 出处：主管包 `update-contract.ts` 的 `MANAGER_ACTIONS.roots`。为什么要走总管：
-		* 浏览器里没有卷清单接口，宿主那条目录选择接缝也只有 `list`／`createDirectory` 两格，
-		* 「这台机器上有哪些盘」只能由宿主去问操作系统——那份实现在总管宿主半的 `roots.ts`。 */
-		const MANAGER_ROOTS_METHOD = "ilife-manager.roots";
+		* 为什么不自建定时器：本仓冻结边界是「无数据轮询」，而设置页等的是一次电话回执，不是轮询；
+		* 用平台自带的一次性超时既守住边界的本意，也把「不转圈」落到实处。同一个 signal 也交给传输，
+		* 双保险：它搭理 signal 就早收工，不理也有这一道兜底（桌面端自研传输会忽略 signal，见 #760）。 */
+		function withDeadline(promise, ms) {
+			const signal = AbortSignal.timeout(ms);
+			const limit = new Promise((_, reject) => {
+				signal.addEventListener("abort", () => {
+					const e = /* @__PURE__ */ new Error(`配置请求超时（${Math.round(ms / 1e3)}s）：宿主未回`);
+					e.name = "TimeoutError";
+					reject(e);
+				}, { once: true });
+			});
+			return Promise.race([promise, limit]);
+		}
+		/** 一次配置电话（走调用方给的那条通道，靠端点名分发；永不抛，失败落字）。 */
+		async function configRpc(call, channel, method, payload) {
+			if (typeof call !== "function") return {
+				ok: false,
+				message: "宿主连接缺席：connection.rpc.call 不可用"
+			};
+			try {
+				const raw = await withDeadline(call("/api", channel.replace(/^\//, ""), {
+					method,
+					payload
+				}, AbortSignal.timeout(READ_TIMEOUT_MS$1)), READ_TIMEOUT_MS$1);
+				if (!isRpcResult$1(raw)) return {
+					ok: false,
+					message: "回执信封异常（非 ok 信封）"
+				};
+				if (!raw.ok) return {
+					ok: false,
+					message: humanizeConfigFailure(raw.error?.code ?? "unknown", raw.error?.message ?? "")
+				};
+				return {
+					ok: true,
+					surface: raw.value
+				};
+			} catch (e) {
+				if (e instanceof Error && (e.name === "AbortError" || e.name === "TimeoutError")) return {
+					ok: false,
+					message: `配置请求超时（${Math.round(READ_TIMEOUT_MS$1 / 1e3)}s）：宿主未回`
+				};
+				return {
+					ok: false,
+					message: `配置失败：${e instanceof Error ? e.message : String(e)}`
+				};
+			}
+		}
+		/** 读设置页整面。 */
+		function fetchConfigSurface(call, channel) {
+			return configRpc(call, channel, RPC_ENDPOINT_CONFIG_GET, {});
+		}
+		/** 保存一份取值（回执只有 `{path, values}`，**不是**整面：写完要重新读一份整面）。 */
+		function saveConfigSurface(call, channel, values) {
+			return configRpc(call, channel, RPC_ENDPOINT_CONFIG_SAVE, { values });
+		}
+		/** 重置为默认（技能侧先落一份备份；回执同样不是整面，写完要重新读一份整面）。 */
+		function resetConfigSurface(call, channel) {
+			return configRpc(call, channel, RPC_ENDPOINT_CONFIG_RESET, {});
+		}
 		//#endregion
 		//#region ../plugin-manager/dist/directory-browser-contract.js
 		/** 目录浏览器的纯逻辑半（**不认识宿主**：只认两格原语）。
@@ -239,7 +280,7 @@ window.__ModuleLoader__.load({
 		* 与组合里服务哪种能力无关），所以两格原语在＝这台宿主**可能**给浏览；真调一次才知道给不给，
 		* 不给（{@link CAPABILITY_REFUSED}）再由调用方换系统对话框。反过来先认 `pick` 就会在
 		* Desktop 这种「只服务 browse」的宿主上每次都去唤一次系统对话框、被拒一次（#744 实测）。 */
-		function pickerModeOf$1(raw) {
+		function pickerModeOf(raw) {
 			if (isBrowseFace(raw)) return "browse";
 			return hasPickFn(raw) ? "native" : "none";
 		}
@@ -248,7 +289,7 @@ window.__ModuleLoader__.load({
 		* 出处：`@deepseek-ai/dsh-api-gateway/lib/client.js` 的 `invoke()`（失败不抛、成功也不回裸值），
 		* 第一方消费方 `@deepseek-ai/dsh-client-ui-workspace/lib/client.js:99-103` 就照这个信封拆。
 		* 裸串照收（老形状兜底），认不出的形状当「供不了」报出来，不当取消吞掉（#743 的教训）。 */
-		function readPickAnswer$1(raw) {
+		function readPickAnswer(raw) {
 			if (typeof raw === "string") return raw.trim() === "" ? { kind: "cancelled" } : {
 				kind: "picked",
 				path: raw
@@ -643,48 +684,6 @@ window.__ModuleLoader__.load({
 			});
 		}
 		//#endregion
-		//#region ../plugin-manager/dist/directory-browser-roots.js
-		/** 「本机根清单」的取数接线（客户端半）：把一通电话变成图上那一行可跳转的根。
-		*
-		* **不认识宿主**：载体基段、通道名（第二段）、电话名全由调用方传进来——各家从自己的宿主镜像里拿
-		* 那几个字面量（和 `openRowBrowser` 的 `refusalCode` 同一条规矩）。本件只做两件事：
-		* 发一次调用、把回执信封拆成根清单；**任何失败都当空清单**（图上少画一行，不报错、不挡路）。
-		*/
-		/** 认一认某个值像不像一个根（认不出的行丢掉：图的干净比多画一行重要）。 */
-		function isRootRow(raw) {
-			if (typeof raw !== "object" || raw === null) return false;
-			const row = raw;
-			return typeof row.path === "string" && row.path !== "" && typeof row.kind === "string";
-		}
-		/** 信封 → 根清单（纯函数，**永不抛**）：`{ok:true, value:{roots:[…]}}` 之外的形状一律当空。 */
-		function readRootsAnswer(raw) {
-			const answer = typeof raw === "object" && raw !== null ? raw : {};
-			if (answer.ok !== true) return [];
-			const value = typeof answer.value === "object" && answer.value !== null ? answer.value : {};
-			if (!Array.isArray(value.roots)) return [];
-			return value.roots.filter(isRootRow).map((row) => ({
-				path: row.path,
-				kind: row.kind
-			}));
-		}
-		/** 建一个「根清单取数器」：给调用口与三个名字，回一个 `() => Promise<RootRow[]>`。
-		*
-		* 界面按需调它（开图一次），不在渲染里调，也不缓存到这里——缓存是宿主半的事。 */
-		function createRootsSource(input) {
-			return async () => {
-				const call = input.getCall();
-				if (typeof call !== "function") return [];
-				try {
-					return readRootsAnswer(await call(input.base, input.endpoint, {
-						method: input.method,
-						payload: {}
-					}));
-				} catch {
-					return [];
-				}
-			};
-		}
-		//#endregion
 		//#region ../plugin-manager/dist/directory-browser-parts.js
 		/** 文件浏览器视图半的**零件**：样式表与四行控件（面包屑／根／一行子目录／新建行）。
 		*
@@ -1064,37 +1063,23 @@ window.__ModuleLoader__.load({
 			});
 		}
 		//#endregion
-		//#region src/client.ts
-		/** dsh-calorie client 适配器（六边形：port=contract+dsh-ctx 镜像，adapter=本文件）。
+		//#region ../plugin-manager/dist/config-panel-view.js
+		/** 共用配置面板 · 视图半：一行怎么画（`Row`）、整面怎么画（`PanelBody`）。
 		*
-		* 产物经 tsdown 打成 loader 工厂包（browser/CJS，见 tsdown.config.ts）。
-		* 本文件传递闭包：禁 node、禁 DOM 直写（document/window/process）。
-		* 注册两处（grill 定案，新术语见 CONTEXT.md）：
-		* (a) 技能设置页 → 爱生活页签槽（总管声明的 children，各技能自研自家配置页）；
-		* (b) 技能功能页 → sidebar槽（better-sidebar 服务，非 DSH slot；软依赖，
-		*     缺席即跳过，不断链。DSH右侧槽 + sidebar.footer.action 彻底出局，已删）。
-		* 有界重试例外依据（唯一允许的定时器）：注册重试非数据轮询，照抄
-		* dsh-mattpocock-skills-deck/src/client/panelAssembly.js:100-108
-		* （betterSidebar 服务可能晚于本模块到达，最多 10 次、间隔 1000ms；卸载清理）。
-		* 样式：React 内联 style + DSH 主题别名（var(--dsw-alias-*)，带回退），无外部样式表、
-		* 无 <style> 注入、无类名冲突；只用 dsh-ctx 镜像内成员（slots.inject/register、
-		* connection.rpc.call 经闭包现取、betterSidebar 与 #736 的目录选择命名空间经 ctx.get 运行时取）；
-		* 取数只经 connection.rpc.call 进 host 通道；缺席/错误纯条件渲染，不返空冒充。
-		* 组件 React.createElement 手写，不引入 JSX。
+		* 本件是**纯函数**：吃一份状态与一组回调，回一棵 React 元素树，自己不留任何状态、不取任何数。
+		* 为什么这么分：状态机与副作用住在 `config-panel.ts` 那一层，于是本件在 Node 里就能直测
+		* （照 `directory-browser-ui.ts` 的既有作法：用例把组件当普通函数调，直接读回那棵树）。
 		*
-		* #676：技能设置页从「只读设置行 + 状态读数」换成**真配置页**——行表来自 settings.ts，
-		* 取值来自宿主侧配置件（`config.get`／`config.save`／`config.reset` 三个端点）。
-		* 本文件仍禁 node：不读盘、不算默认值，默认值由宿主一并送来。
-		* 照 CONTEXT.md，「技能设置页」只配置、不干活：本页没有任何取数／记一餐入口，
-		* 状态读数也已移出（读数属技能功能页）。
-		*/
-		/** client 短名声明：只有这两个（#736 的目录选择走**可选查找**，不写进来——
-		* 写进来＝硬依赖，提供方缺席时整包被停靠，设置页会跟着装不上；见 cookbook §13）。 */
-		const inject = ["slots", "connection"];
-		/** 面板视觉（内联 style；颜色走 DSH 主题别名，深浅主题自适应，写死值只做回退）。
+		* 手写 `React.createElement`（本包 client 束禁 JSX）。样式表 `S` 就在本件里——面板怎么画只有这一处。
 		*
-		* **六家逐项同形**（备忘·卡路里·记账·作息·居家·大厨）：同一项在这六份里逐字相同，
-		* 改任一条要六家一起改，锁见 `test/panel-copy-743.test.mjs` 第 ⑤ 条。 */
+		* 三条定稿（v3）在本件落地：
+		*   ① **只读行的目录按钮不画**（不画一枚点了也没反应的死按钮）；
+		*   ② 目录行的按钮字面**两档合一**，一律「浏览文件夹」（入口供不了时整枚不画）；
+		*   ③ **每行一枚「复制」**：复制这一行完好的值文本；点下去按钮就地变「已复制」再变回，不弹提示。
+		*
+		* 对外只经 `config-panel-api.ts` 那一道门；本件自己不出门。
+		*/
+		/** 面板的样式表：颜色走 DSH 主题别名（深浅主题自适应，写死值只做回退），字号一律相对单位（em）。 */
 		const S = {
 			card: {
 				padding: "12px 14px",
@@ -1109,11 +1094,6 @@ window.__ModuleLoader__.load({
 				fontWeight: 700,
 				marginBottom: 8
 			},
-			total: {
-				fontSize: 22,
-				fontWeight: 700,
-				margin: "2px 0 4px"
-			},
 			muted: {
 				color: "var(--dsw-alias-label-secondary, #9a9a9a)",
 				fontSize: "0.92em"
@@ -1134,13 +1114,6 @@ window.__ModuleLoader__.load({
 				borderTop: "1px solid var(--dsw-alias-border, rgba(128,128,128,.25))",
 				paddingTop: 8
 			},
-			version: {
-				marginTop: 8,
-				paddingTop: 8,
-				borderTop: "1px dashed var(--dsw-alias-border, rgba(128,128,128,.25))",
-				color: "var(--dsw-alias-label-tertiary, #8a8a8a)",
-				fontSize: "0.92em"
-			},
 			info: {
 				color: "var(--dsw-alias-label-secondary, #9a9a9a)",
 				fontSize: "0.92em",
@@ -1167,6 +1140,12 @@ window.__ModuleLoader__.load({
 				gap: 6,
 				alignItems: "center"
 			},
+			acts: {
+				display: "flex",
+				gap: 6,
+				alignItems: "center",
+				flex: "0 0 auto"
+			},
 			btnPick: {
 				flex: "0 0 auto",
 				padding: "4px 10px",
@@ -1177,11 +1156,43 @@ window.__ModuleLoader__.load({
 				whiteSpace: "nowrap",
 				cursor: "pointer"
 			},
+			invalid: {
+				marginTop: 6,
+				padding: "6px 8px",
+				borderRadius: 6,
+				background: "color-mix(in srgb, var(--dsw-alias-state-warning-primary, #b26a00) 16%, transparent)",
+				border: "1px solid var(--dsw-alias-state-warning-primary, #b26a00)",
+				color: "var(--dsw-alias-label-primary, inherit)",
+				fontSize: "0.92em"
+			},
 			bar: {
 				display: "flex",
 				gap: 8,
 				marginTop: 12,
-				flexWrap: "wrap"
+				flexWrap: "wrap",
+				position: "sticky",
+				bottom: 0,
+				zIndex: 1,
+				background: "var(--dsw-alias-bg-layer-1, #232329)",
+				padding: "8px 0",
+				borderTop: "1px solid var(--dsw-alias-border, rgba(128,128,128,.25))"
+			},
+			saveMsg: {
+				marginRight: "auto",
+				alignSelf: "center",
+				color: "var(--dsw-alias-state-warning-primary, #b26a00)",
+				fontSize: "0.9em"
+			},
+			dirtyDot: {
+				color: "var(--dsw-alias-state-warning-primary, #b26a00)",
+				fontSize: "0.85em",
+				marginLeft: 6,
+				fontWeight: 400
+			},
+			followNote: {
+				color: "var(--dsw-alias-state-warning-primary, #b26a00)",
+				fontSize: "0.85em",
+				marginBottom: 4
 			},
 			btn: {
 				padding: "4px 12px",
@@ -1199,10 +1210,677 @@ window.__ModuleLoader__.load({
 				color: "#fff",
 				cursor: "pointer"
 			},
-			advanced: { marginTop: 12 },
-			summary: {
-				cursor: "pointer",
-				fontWeight: 600
+			advanced: { marginTop: 12 },
+			summary: {
+				cursor: "pointer",
+				fontWeight: 600
+			},
+			version: {
+				marginTop: 8,
+				paddingTop: 8,
+				borderTop: "1px dashed var(--dsw-alias-border, rgba(128,128,128,.25))",
+				color: "var(--dsw-alias-label-tertiary, #8a8a8a)",
+				fontSize: "0.92em"
+			}
+		};
+		/** 复制那一枚按钮的字面（定稿 v3 第三条：就地变，不弹提示）。 */
+		function copyLabelOf(state) {
+			if (state === "done") return "已复制";
+			if (state === "failed") return "复制失败";
+			return "复制";
+		}
+		/** 一行输入（四种控件对齐受限 YAML 子集：文本／数字／布尔／目录）。
+		*
+		* 目录档＝文本框 ＋ 一枚唤起目录选择的按钮；入口三态是 `none`（命名空间拿不到、或这条路已被拒）
+		* **就不画按钮**，文本框照旧——那是该缝自己的契约（供不了就收起入口，不是失败）。
+		* **只读行**：控件一律 `disabled`、`onChange` 不接，目录行的按钮**一枚都不画**（定稿 v3 ①）。 */
+		function Row(props) {
+			const { item } = props;
+			const readonly = item.readonly === true;
+			const disabled = props.disabled || readonly;
+			const onChange = readonly ? void 0 : (e) => props.onChange(item.key, e.target.value);
+			const control = item.control === "switch" ? react.createElement("input", {
+				type: "checkbox",
+				checked: props.value === "true",
+				disabled,
+				onChange: readonly ? void 0 : (e) => props.onChange(item.key, e.target.checked ? "true" : "false")
+			}) : react.createElement("input", {
+				style: props.dirty === true ? {
+					...S.input,
+					borderColor: "var(--dsw-alias-state-warning-primary, #b26a00)"
+				} : readonly && props.follow === true ? {
+					...S.input,
+					opacity: .55
+				} : S.input,
+				type: item.control === "number" ? "number" : "text",
+				value: props.value,
+				disabled,
+				spellCheck: false,
+				onChange
+			});
+			/** 目录入口：只读行不画（定稿 v3 ①），供不了（`none`／缺席）也不画。 */
+			const entry = props.browser ?? null;
+			const browse = item.control === "directory" && !readonly && entry !== null && entry.mode !== "none" ? react.createElement("button", {
+				style: S.btnPick,
+				type: "button",
+				disabled,
+				onClick: () => entry.onOpen(item.key)
+			}, "浏览文件夹") : null;
+			const copy = react.createElement("button", {
+				style: S.btnPick,
+				type: "button",
+				disabled: props.onCopy === void 0,
+				onClick: () => props.onCopy?.(item.key, props.value)
+			}, copyLabelOf(props.copyState));
+			const acts = react.createElement("div", { style: S.acts }, browse, copy);
+			const facts = props.fallback ?? null;
+			return react.createElement("div", { style: S.row }, react.createElement("div", { style: S.label }, item.title, props.dirty === true ? react.createElement("span", { style: S.dirtyDot }, "●已改动") : null), react.createElement("div", { style: S.hint }, item.hint), readonly && props.follow === true ? react.createElement("div", { style: S.followNote }, "将跟随更新，保存后生效。") : null, facts === null ? null : react.createElement("div", { style: S.invalid }, "配置里写的是 ", react.createElement("b", null, facts.written), "；现在生效的是 ", react.createElement("b", null, facts.effective), "。"), react.createElement("div", { style: S.pickRow }, control, acts));
+		}
+		/** 应用内浏览器对话框的文案（面板自带，逐条对应图上那几个位置）。 */
+		const BROWSER_LABELS = {
+			title: "选择文件夹",
+			close: "关闭",
+			up: "上一级",
+			pathPlaceholder: "直接填绝对路径，回车即进入",
+			go: "转到",
+			showHidden: (n) => "显示隐藏目录（" + n + "）",
+			empty: "这个目录里没有子目录。",
+			loading: "正在读取",
+			newFolder: "新建文件夹",
+			createConfirm: "创建",
+			createCancel: "取消",
+			select: "选",
+			selected: "已选",
+			open: "选定这个目录",
+			cancel: "取消",
+			willPick: "将选定："
+		};
+		/** 画整面（四支控件、三支错误落位、底栏、附加块槽都在这里）。 */
+		function PanelBody(props) {
+			const { state, title } = props;
+			const surface = state.kind === "ready" ? state.surface : null;
+			const headText = title === void 0 ? "配置" : `${title} · 配置`;
+			const headDataDir = surface === null ? "" : surface.resolved?.["dbDir"] ?? surface.dataDir;
+			const head = react.createElement("div", null, react.createElement("div", { style: S.title }, headText), surface === null ? null : react.createElement("div", null, react.createElement("div", { style: S.info }, `配置文件 ${surface.path}`), react.createElement("div", { style: S.info }, `数据目录 ${headDataDir}`), surface.created ? react.createElement("div", { style: S.muted }, "（配置文件刚按默认值生成）") : null));
+			const parts = {
+				styles: S,
+				reply: surface
+			};
+			const extra = props.extra === void 0 ? null : props.extra(parts);
+			if (state.kind === "loading") return react.createElement("div", { style: S.card }, head, react.createElement("div", { style: S.muted }, "配置读取中"), extra);
+			if (state.kind === "failed") return react.createElement("div", { style: S.card }, head, react.createElement("div", { style: S.error }, state.message), extra, react.createElement("div", { style: S.bar }, react.createElement("button", {
+				style: S.btn,
+				type: "button",
+				onClick: props.onRetry
+			}, "重试"), react.createElement("button", {
+				style: S.btn,
+				type: "button",
+				onClick: props.onReset
+			}, "重置为默认")));
+			const common = props.items.filter((item) => item.tier === "common");
+			const advanced = props.items.filter((item) => item.tier === "advanced");
+			const renderRow = (item) => react.createElement(Row, {
+				key: item.key,
+				item,
+				value: props.draft[item.key] ?? "",
+				disabled: props.busy,
+				onChange: props.onChange,
+				browser: props.rowEntry,
+				dirty: props.dirtyKeys.includes(item.key),
+				follow: props.followKeys.includes(item.key),
+				onCopy: props.onCopy,
+				copyState: props.copy !== null && props.copy.key === item.key ? props.copy.ok ? "done" : "failed" : "idle",
+				fallback: item.readonly !== true && item.prefillFrom !== void 0 ? fallbackFactsOf(item, props.draft[item.key] ?? "", draftSourceOf(surface)) : null
+			});
+			const dirtyCount = props.dirtyKeys.length;
+			const dirty = dirtyCount > 0;
+			return react.createElement("div", { style: S.card }, head, react.createElement("div", { style: S.rows }, common.map(renderRow)), advanced.length === 0 ? null : react.createElement("details", { style: S.advanced }, react.createElement("summary", { style: S.summary }, ADVANCED_GROUP_TITLE), react.createElement("div", { style: S.muted }, ADVANCED_GROUP_NOTE), advanced.map(renderRow)), extra, react.createElement("div", { style: S.bar }, dirty ? react.createElement("div", { style: S.saveMsg }, `浏览改动后请点保存（${dirtyCount} 项未保存），保存后跟随项自动更新`) : null, react.createElement("button", {
+				style: dirty ? S.btnPrimary : S.btn,
+				type: "button",
+				disabled: props.busy || !dirty,
+				onClick: props.onSave
+			}, props.busy ? "处理中" : dirty ? `保存（${dirtyCount} 项未保存）` : "保存"), react.createElement("button", {
+				style: S.btn,
+				type: "button",
+				disabled: props.busy,
+				onClick: props.onReset
+			}, "重置为默认"), react.createElement("button", {
+				style: S.btn,
+				type: "button",
+				disabled: props.busy,
+				onClick: props.onRetry
+			}, "重新读取")), props.picking ? react.createElement("div", { style: S.muted }, "已唤起系统文件夹对话框：选中后自动填上，取消则不动。") : null, props.browseRow !== null ? react.createElement(DirectoryBrowserFromRow, {
+				open: true,
+				row: props.browseRow,
+				labels: BROWSER_LABELS
+			}) : null, props.writeError !== null ? react.createElement("div", {
+				style: S.error,
+				role: "alert"
+			}, props.writeError) : null, props.error !== null ? react.createElement("div", { style: S.error }, props.error) : null, props.notice !== null ? react.createElement("div", { style: S.okText }, props.notice) : null);
+		}
+		/** 「写的值 ≠ 生效值」两个事实要的那几格：整面回执里取值本身、落点顶层那一个、`resolved` 组。 */
+		function draftSourceOf(surface) {
+			if (surface === null) return { values: {} };
+			return {
+				values: surface.values,
+				dataDir: surface.dataDir,
+				resolved: surface.resolved
+			};
+		}
+		//#endregion
+		//#region ../plugin-manager/dist/directory-browser-roots.js
+		/** 「本机根清单」的取数接线（客户端半）：把一通电话变成图上那一行可跳转的根。
+		*
+		* **不认识宿主**：载体基段、通道名（第二段）、电话名全由调用方传进来——各家从自己的宿主镜像里拿
+		* 那几个字面量（和 `openRowBrowser` 的 `refusalCode` 同一条规矩）。本件只做两件事：
+		* 发一次调用、把回执信封拆成根清单；**任何失败都当空清单**（图上少画一行，不报错、不挡路）。
+		*/
+		/** 认一认某个值像不像一个根（认不出的行丢掉：图的干净比多画一行重要）。 */
+		function isRootRow(raw) {
+			if (typeof raw !== "object" || raw === null) return false;
+			const row = raw;
+			return typeof row.path === "string" && row.path !== "" && typeof row.kind === "string";
+		}
+		/** 信封 → 根清单（纯函数，**永不抛**）：`{ok:true, value:{roots:[…]}}` 之外的形状一律当空。 */
+		function readRootsAnswer(raw) {
+			const answer = typeof raw === "object" && raw !== null ? raw : {};
+			if (answer.ok !== true) return [];
+			const value = typeof answer.value === "object" && answer.value !== null ? answer.value : {};
+			if (!Array.isArray(value.roots)) return [];
+			return value.roots.filter(isRootRow).map((row) => ({
+				path: row.path,
+				kind: row.kind
+			}));
+		}
+		/** 建一个「根清单取数器」：给调用口与三个名字，回一个 `() => Promise<RootRow[]>`。
+		*
+		* 界面按需调它（开图一次），不在渲染里调，也不缓存到这里——缓存是宿主半的事。 */
+		function createRootsSource(input) {
+			return async () => {
+				const call = input.getCall();
+				if (typeof call !== "function") return [];
+				try {
+					return readRootsAnswer(await call(input.base, input.endpoint, {
+						method: input.method,
+						payload: {}
+					}));
+				} catch {
+					return [];
+				}
+			};
+		}
+		/** 载体：宿主注册 `connection.fetch.register` 的路径 / 面板 `connection.rpc.call` 的两段参数。 */
+		const MANAGER_RPC = {
+			/** 载体基段（`connection.rpc.call` 的**第一段**参数）。传错第一段就是 404：真机上踩过一次。 */
+			base: "/api",
+			/** 单段通道名，须 match `/^\/[A-Za-z0-9._~-]+$/`（cookbook §6）。 */
+			channel: "/ilife-manager",
+			/** 面板侧第二段参数（等于通道名去掉前导斜杠那一段）。 */
+			endpoint: "ilife-manager",
+			/** 宿主侧注册的完整路径（＝ `base` ＋ `channel`）。 */
+			path: "/api/ilife-manager"
+		};
+		/** 总管自有电话名：更新包的三个动作名是冻结集合（`config.ts:14`），这里另起名字不撞车。 */
+		const MANAGER_ACTIONS = {
+			/** 装上缺席的目标包：入参 `{packageName, version}`，回包 `{packageName, version}`。 */
+			install: "ilife-manager.install",
+			/** 七个更新目标的表：入参 `{}`，回包 `{targets: [{key, title, packageName, phones, runningVersion, installedVersion, panelRegistered, skill}]}`。
+			*
+			* 电话名为什么由宿主转交而不是面板侧写死：更新包的三个电话名只有它自己知道
+			* （`update.phoneNames`，`host.ts:335`）；面板侧既不能 import 更新包（浏览器产物纯度门）
+			* 也不该把名字再写一份（写两份必然走散）。宿主把名字表连同版本行一起交出去，
+			* 面板一行字面量都不留。 */
+			targets: "ilife-manager.targets",
+			/** 总管自述版本（票 #737）：入参 `{}`，回包 `{version}`。
+			*
+			* 宿主读**自己这份已安装包**的 `package.json`（`manager-version.ts`），面板只渲染读到的值。
+			* 为什么走电话：面板是浏览器产物，禁 node 内建（`test/client-bundle-48.test.mjs` 看门），
+			* 读盘只许在宿主半；与卡路里 #130 同一条路（host 读 → RPC → client 纯渲染）。 */
+			version: "ilife-manager.version",
+			/** 本机「根」清单（票 #744）：入参 `{}`，回包 `{roots: [{path, kind}]}`。
+			*
+			* 为什么这条能力住在总管：浏览器里没有卷清单接口，而宿主那条目录选择接缝只有
+			* `list`／`createDirectory` 两格——「这台机器上有哪些盘」只能由宿主去问操作系统。
+			* 六家的目录浏览器都取这一通电话，故名字与实现都只有这一处（清单本身见 `roots.ts`）。
+			* 回包**恒成功**：列不出来是空清单，不是错误码（界面据此只是不画那一行）。 */
+			roots: "ilife-manager.roots"
+		};
+		//#endregion
+		//#region ../plugin-manager/dist/config-panel.js
+		/** 共用配置面板 · 组件本体：一台状态机 ＋ 一圈副作用，渲染交给 `config-panel-view.ts`。
+		*
+		* 这一件就是六个技能设置页的那张卡片：六家只交「连哪条通道」与「有哪些配置项」（行表），
+		* 另加三个可选钩子（跟随映射／卡片标题／自家附加块）。卡片怎么画、值怎么取又怎么填回去、
+		* 哪些行被改过还没保存、保存／重置／重新读取怎么走、出错时说什么话，全在本件与它下面那几件里。
+		*
+		* 状态：读到了没（loading／ready／failed）、哪些行被改过（脏基线）、正在写（busy）、
+		* 写完的结果（notice／writeError）、就地失败（error）、目录选择那一路（picking／browseRow）、
+		* 复制回执（copy）。**脏基线只看可改行**：只读行显示的是技能算好的绝对路径，拿它当「改动」
+		* 会让面板一打开就显示「未保存」。**写完一律重新读一份整面**：写回执不是整面，拿它当整面用
+		* 会让页头那行「数据目录」显示成空。
+		*
+		* 只挂一个副作用（挂载期读一次整面）：取数口是**取用器**，每次调它现取，所以那个 effect
+		* 不需要跟着任何一格重跑——否则回执一落定就再读一次，会自己把自己转起来。
+		*
+		* 对外只经 `config-panel-api.ts` 那一道门；本件自己不出门。
+		*/
+		/** 认一认某个值像不像目录选择命名空间（认不出就当没有，绝不把设置页带下来）。 */
+		function isPickerFace(raw) {
+			if (typeof raw !== "object" || raw === null) return false;
+			return typeof raw.pick === "function";
+		}
+		/** 现取目录选择命名空间：**软依赖**，拿不到回 null（页面据此不出入口）。 */
+		function resolvePicker(getService) {
+			if (getService === void 0) return null;
+			try {
+				const raw = getService(REMOTE_DIRECTORY_PICKER);
+				return isPickerFace(raw) ? raw : null;
+			} catch {
+				return null;
+			}
+		}
+		/** 唤起一次系统文件夹选择器并归一结果（**永不抛**）。 */
+		async function pickDirectory(picker) {
+			try {
+				return readPickAnswer(await picker.pick());
+			} catch (e) {
+				return {
+					kind: "unavailable",
+					message: "打不开系统文件夹对话框（" + (e instanceof Error ? e.message : String(e)) + "）：请直接在框里填绝对路径。"
+				};
+			}
+		}
+		/** 写一次剪贴板：**不碰 DOM**，只读当刻环境的 `globalThis.navigator`（拿不到就回 false，不抛）。
+		*
+		* 为什么不照原型那样退到 `document.execCommand`：本仓插件侧禁 DOM 直写（`document`／`window`），
+		* 所以没有那条兜底；拿不到剪贴板就如实回 false，界面上那一枚按钮就地显示「复制失败」。 */
+		async function writeClipboard(text) {
+			try {
+				const clip = globalThis.navigator?.clipboard;
+				if (clip === void 0 || typeof clip.writeText !== "function") return false;
+				await clip.writeText(text);
+				return true;
+			} catch {
+				return false;
+			}
+		}
+		/** 技能设置页：承载一家自己的全部可配置项（只配置，不干活）。 */
+		function ConfigPanel(props) {
+			const [state, setState] = react.useState({ kind: "loading" });
+			const [pickerGone, setPickerGone] = react.useState(false);
+			const [picking, setPicking] = react.useState(false);
+			const [draft, setDraft] = react.useState({});
+			const [busy, setBusy] = react.useState(false);
+			const [notice, setNotice] = react.useState(null);
+			const [writeError, setWriteError] = react.useState(null);
+			const [error, setError] = react.useState(null);
+			const [browseRow, setBrowseRow] = react.useState(null);
+			const [copy, setCopy] = react.useState(null);
+			/** 复制回执的复位定时器：**一次性 UI 回执**，不是数据轮询——点一次起一个，到点自我复位，
+			*  下一次点击先清掉旧的，卸载时也清掉（下面那个清扫 effect 就是那一半）。 */
+			const copyTimer = react.useRef(null);
+			react.useEffect(() => () => {
+				if (copyTimer.current !== null) {
+					clearTimeout(copyTimer.current);
+					copyTimer.current = null;
+				}
+			}, []);
+			/** 挂载期读一次整面：卸载之后回来的回执丢掉（不许往已经没了的页面上写）。 */
+			react.useEffect(() => {
+				let alive = true;
+				(async () => {
+					const r = await fetchConfigSurface(props.getCall(), props.channel);
+					if (!alive) return;
+					if (r.ok) {
+						setState({
+							kind: "ready",
+							surface: r.surface
+						});
+						setDraft(toDraft(props.items, r.surface.values, r.surface));
+					} else setState({
+						kind: "failed",
+						message: r.message
+					});
+				})();
+				return () => {
+					alive = false;
+				};
+			}, []);
+			/** 把一份整面铺到页面上（读到之后唯一那一处落点）。 */
+			const apply = (surface) => {
+				setState({
+					kind: "ready",
+					surface
+				});
+				setDraft(toDraft(props.items, surface.values, surface));
+			};
+			const load = async () => {
+				setNotice(null);
+				setWriteError(null);
+				setError(null);
+				const r = await fetchConfigSurface(props.getCall(), props.channel);
+				if (r.ok) apply(r.surface);
+				else setState({
+					kind: "failed",
+					message: r.message
+				});
+			};
+			/** 写完（保存／重置）之后重新读一份整面：写回执只有 `{path, values}`、重置回执只有
+			*  `{path, backupPath}`，都不是整面——拿它当整面用，页头那行「数据目录」会显示成空。 */
+			const writeThenReload = async (done) => {
+				setBusy(true);
+				setNotice(null);
+				setWriteError(null);
+				setError(null);
+				const r = await fetchConfigSurface(props.getCall(), props.channel);
+				if (r.ok) {
+					apply(r.surface);
+					setNotice(done);
+				} else setState({
+					kind: "failed",
+					message: r.message
+				});
+				setBusy(false);
+			};
+			const onChange = (key, next) => {
+				setDraft((prev) => ({
+					...prev,
+					[key]: next
+				}));
+				setNotice(null);
+				setWriteError(null);
+				setError(null);
+			};
+			const picker = pickerGone ? null : resolvePicker(props.getService);
+			/** 唤起系统文件夹选择器那一条路（应用内浏览被拒时的兜底，也是命名空间只给 `pick` 时的唯一一条）。 */
+			const openNative = async (key) => {
+				const face = pickerGone ? null : resolvePicker(props.getService);
+				if (face === null) return;
+				setPicking(true);
+				setError(null);
+				const outcome = await pickDirectory(face);
+				setPicking(false);
+				if (outcome.kind === "picked") onChange(key, outcome.path);
+				else if (outcome.kind === "unavailable") {
+					setError(outcome.message);
+					setPickerGone(true);
+				}
+			};
+			/** 目录行的入口动作：**先应用内浏览，宿主没给这条路再换系统对话框**（判断在共用件里）。 */
+			const onOpenRow = async (key) => {
+				setError(null);
+				const opened = openRowBrowser({
+					picker,
+					initialPath: draft[key] ?? "",
+					onChange: (next) => onChange(key, next),
+					onRow: setBrowseRow,
+					refusalCode: DIRECTORY_PICKER_REFUSED,
+					rootsSource: createRootsSource({
+						getCall: props.getCall,
+						base: MANAGER_RPC.base,
+						endpoint: MANAGER_RPC.endpoint,
+						method: MANAGER_ACTIONS.roots
+					})
+				});
+				if (opened === void 0 || await opened === "refused") await openNative(key);
+			};
+			/** 复制一行（定稿 v3 第三条）：写完就地变「已复制」（写不进去就地变「复制失败」），1.5 秒后复位，不弹提示。 */
+			const onCopy = (key, text) => {
+				writeClipboard(text).then((ok) => {
+					setCopy({
+						key,
+						ok
+					});
+					if (copyTimer.current !== null) clearTimeout(copyTimer.current);
+					copyTimer.current = setTimeout(() => {
+						copyTimer.current = null;
+						setCopy(null);
+					}, COPY_FEEDBACK_MS);
+				});
+			};
+			const onSave = async () => {
+				setBusy(true);
+				setNotice(null);
+				setWriteError(null);
+				setError(null);
+				const r = await saveConfigSurface(props.getCall(), props.channel, fromDraft(props.items, draft));
+				setBusy(false);
+				if (r.ok) await writeThenReload("已保存，立即生效（不用重启宿主）");
+				else setWriteError(r.message);
+			};
+			const onReset = async () => {
+				setBusy(true);
+				setNotice(null);
+				setWriteError(null);
+				setError(null);
+				const r = await resetConfigSurface(props.getCall(), props.channel);
+				setBusy(false);
+				if (r.ok) await writeThenReload("已重置为默认（原配置已另存一份 .bak）");
+				else setWriteError(r.message);
+			};
+			const surface = state.kind === "ready" ? state.surface : null;
+			const baseline = surface !== null ? toDraft(props.items, surface.values, surface) : null;
+			const dirtyKeys = baseline === null ? [] : dirtyKeysOf(props.items, draft, baseline);
+			const followKeys = (props.followKeysOf ?? noFollowKeys)(dirtyKeys);
+			const mode = pickerModeOf(picker);
+			const rowEntry = mode === "none" ? null : {
+				mode,
+				onOpen: onOpenRow
+			};
+			return react.createElement(PanelBody, {
+				title: props.title,
+				items: props.items,
+				state,
+				draft,
+				busy,
+				notice,
+				writeError,
+				error,
+				picking,
+				browseRow,
+				rowEntry,
+				dirtyKeys,
+				followKeys,
+				copy,
+				onCopy,
+				onChange,
+				onSave: () => void onSave(),
+				onReset: () => void onReset(),
+				onRetry: () => void load(),
+				extra: props.extra
+			});
+		}
+		//#endregion
+		//#region src/contract.ts
+		/** dsh-calorie 端口（port）：DSH 世界与卡路里 hexagon 之间的契约。
+		*
+		* browser 安全：零 node 导入。host 适配器（注册 RPC 通道）与 client
+		* 适配器（调用 RPC）共用同一份定义；单测与 loader 回路以此为准。
+		* 通道命名遵守宿主约束：单段且不等于 /api（见 cookbook「RPC 通道」）。
+		*/
+		const RPC_CHANNEL = "/ilife-calorie";
+		const RPC_ENDPOINT_READ = "read";
+		/** 面板默认读键（与 HITL 一致性对比同键）。 */
+		const DEFAULT_READ_KEY = "calorie.view.home";
+		/** 信封守卫：供 client 拆包前校验（port 拥有信封定义，守卫住 port）。 */
+		function isRpcResult(raw) {
+			if (typeof raw !== "object" || raw === null) return false;
+			const ok = raw.ok;
+			return ok === true || ok === false;
+		}
+		//#endregion
+		//#region src/slot.ts
+		const SLOT_TITLE = "卡路里";
+		const PLUGIN = "dsh-calorie";
+		//#endregion
+		//#region src/settings.ts
+		/** 常用项：数据目录／库文件名／产物目录名／照片目录／训记 KEY（可改 3 ＋ 只读 2）。 */
+		const COMMON = [
+			{
+				key: "db.dir",
+				title: "数据目录",
+				tier: "common",
+				control: "directory",
+				prefillFrom: "dataDir",
+				hint: "库文件与各类产物的根目录。留空＝用默认目录。"
+			},
+			{
+				key: "db.name",
+				title: "库文件名",
+				tier: "common",
+				control: "text",
+				readonly: true,
+				resolveFrom: "dbFile",
+				hint: "数据目录下的数据库文件。"
+			},
+			{
+				key: "html.dir",
+				title: "HTML 产物目录名",
+				tier: "common",
+				control: "text",
+				readonly: true,
+				resolveFrom: "htmlDir",
+				hint: "数据目录下存放交付页面的子目录。"
+			},
+			{
+				key: "photos.dir",
+				title: "照片目录",
+				tier: "common",
+				control: "directory",
+				prefillFrom: "photosDir",
+				hint: "身材照的存放目录。留空＝用默认目录（数据目录下的 photos）。"
+			},
+			{
+				key: "xunji.key",
+				title: "训记 KEY",
+				tier: "common",
+				control: "text",
+				hint: "训记的凭据。留空＝未配置，推送与回写会被拦下。"
+			}
+		];
+		/** 高级项：默认收起（只读 6 项）。改错了多半只是自己撞上麻烦，不确定就别动。 */
+		const ADVANCED = [
+			{
+				key: "photos.gifs",
+				title: "照片 GIF 子目录",
+				tier: "advanced",
+				control: "text",
+				readonly: true,
+				resolveFrom: "gifsDir",
+				hint: "照片目录下存放 GIF 的子目录。"
+			},
+			{
+				key: "xunji.stateDir",
+				title: "训记状态文件目录",
+				tier: "advanced",
+				control: "directory",
+				readonly: true,
+				resolveFrom: "stateDir",
+				hint: "训记的限频与同步游标存放目录。"
+			},
+			{
+				key: "xunji.catalog",
+				title: "训记动作库路径",
+				tier: "advanced",
+				control: "text",
+				readonly: true,
+				resolveFrom: "catalog",
+				hint: "动作名判定用的动作库。"
+			},
+			{
+				key: "xunji.backfillDays",
+				title: "回写默认天数",
+				tier: "advanced",
+				control: "number",
+				readonly: true,
+				hint: "从训记拉实绩时默认回溯的天数。"
+			},
+			{
+				key: "land.xunjiSeconds",
+				title: "训记调用限时（秒）",
+				tier: "advanced",
+				control: "number",
+				readonly: true,
+				hint: "调用训记的超时秒数。"
+			},
+			{
+				key: "land.landSeconds",
+				title: "落地调用限时（秒）",
+				tier: "advanced",
+				control: "number",
+				readonly: true,
+				hint: "落地训练各步骤的超时秒数。"
+			}
+		];
+		/** 设置页的行表，顺序即页面顺序。 */
+		const CONFIG_ITEMS = [...COMMON, ...ADVANCED];
+		COMMON.length;
+		//#endregion
+		//#region src/client.ts
+		/** dsh-calorie client 适配器（六边形：port=contract，adapter=本文件）。
+		*
+		* 产物经 tsdown 打成 loader 工厂包（browser/CJS，见 tsdown.config.ts）。
+		* 本文件传递闭包：禁 node、禁 DOM 直写（document/window/process）。
+		* 两处注册：**技能设置页** → 爱生活页签槽（总管声明的 children）；**技能功能页** → sidebar 槽（软依赖）。
+		* 取数只经 connection.rpc.call 进 host 通道；缺席/错误纯条件渲染，不返空冒充。
+		* 组件 React.createElement 手写，不引入 JSX。
+		*
+		* #909：设置页本体（样式表／行渲染／卡片骨架／状态机／取值与填值／配置面三通电话／
+		* 目录选择入口）**收进共用件** `dsh-life-pack/config-panel`，本文件只留四处接线：
+		*   ① 行表（住 `settings.ts`——那是本家自己的配置数据，不是 UI）；
+		*   ② 通道路由名（`RPC_CHANNEL`，本家唯一那个真变量）；
+		*   ③ 三个可选钩子（卡片标题／跟随映射／自家附加块＝版本行）；
+		*   ④ 两格宿主取数接线（`getCall`／`getService`）。
+		* 本家**不再有**设置页的样式表与行渲染函数：改一次共用面板，六家一起变。
+		* 文件里剩下那张 `W` 样式表是**技能功能页**（sidebar 槽那张卡）自己的，与设置页无关。
+		* 照 CONTEXT.md，「技能设置页」只配置、不干活：本页没有任何取数／记一餐入口，
+		* 状态读数也已移出（读数属技能功能页）。
+		*/
+		/** client 短名声明：只有这两个（#736 的目录选择走**可选查找**，不写进来——
+		* 写进来＝硬依赖，提供方缺席时整包被停靠，设置页会跟着装不上；见 cookbook §13）。 */
+		const inject = ["slots", "connection"];
+		/** **技能功能页**（sidebar 槽那张卡）的视觉。设置页的样式表不在这里——它收进了共用件
+		* `dsh-life-pack/config-panel`（#909）。这张表只服务本家自己的功能页，故不参与六家同形面。 */
+		const W = {
+			card: {
+				padding: "12px 14px",
+				borderRadius: 10,
+				border: "1px solid var(--dsw-alias-border, rgba(128,128,128,.35))",
+				background: "var(--dsw-alias-bg-base, transparent)",
+				color: "var(--dsw-alias-label-primary, inherit)",
+				lineHeight: 1.6
+			},
+			title: {
+				fontSize: "1.08em",
+				fontWeight: 700,
+				marginBottom: 8
+			},
+			total: {
+				fontSize: 22,
+				fontWeight: 700,
+				margin: "2px 0 4px"
+			},
+			muted: {
+				color: "var(--dsw-alias-label-secondary, #9a9a9a)",
+				fontSize: "0.92em"
+			},
+			error: {
+				marginTop: 8,
+				color: "var(--dsw-alias-label-error, #b3261e)",
+				fontSize: "1em",
+				whiteSpace: "pre-wrap"
+			},
+			okText: {
+				marginTop: 8,
+				color: "var(--dsw-alias-state-success-primary, #12805c)",
+				fontSize: "0.96em"
+			},
+			version: {
+				marginTop: 8,
+				paddingTop: 8,
+				borderTop: "1px dashed var(--dsw-alias-border, rgba(128,128,128,.25))",
+				color: "var(--dsw-alias-label-tertiary, #8a8a8a)",
+				fontSize: "0.92em"
 			}
 		};
 		/** #130 版本通道（host 侧动态读取已安装版本，client 纯渲染＋unknown 降级）。
@@ -1226,7 +1904,7 @@ window.__ModuleLoader__.load({
 		}
 		/** 版本行：纯渲染 host 传来的值＋unknown 降级（用户要求：每技能设置页自报家门）。 */
 		function VersionLine(props) {
-			return react.createElement("div", { style: S.version }, formatVersionLine(props.pluginVersion, props.skillVersion));
+			return react.createElement("div", { style: W.version }, formatVersionLine(props.pluginVersion, props.skillVersion));
 		}
 		/** 版本取值（与 fetchRead 同 connection.rpc.call 模式；单次、无轮询；任何失败→双 unknown，永不抛）。 */
 		async function fetchVersions(call) {
@@ -1408,264 +2086,40 @@ window.__ModuleLoader__.load({
 					alive = false;
 				};
 			}, [props.getCall]);
-			if (state.kind === "loading") return react.createElement("div", { style: S.card }, react.createElement("div", { style: S.muted }, "卡路里加载中"));
-			if (state.kind === "data") return react.createElement("div", { style: S.card }, react.createElement("div", { style: S.title }, `卡路里 · ${state.date}`), react.createElement("div", { style: S.total }, `total ${state.total}`), react.createElement(VersionLine, {
+			if (state.kind === "loading") return react.createElement("div", { style: W.card }, react.createElement("div", { style: W.muted }, "卡路里加载中"));
+			if (state.kind === "data") return react.createElement("div", { style: W.card }, react.createElement("div", { style: W.title }, `卡路里 · ${state.date}`), react.createElement("div", { style: W.total }, `total ${state.total}`), react.createElement(VersionLine, {
 				pluginVersion: versions.plugin,
 				skillVersion: versions.skill
 			}));
-			return react.createElement("div", { style: S.card }, react.createElement("div", { style: state.kind === "absent" ? S.muted : S.error }, state.message), react.createElement(VersionLine, {
+			return react.createElement("div", { style: W.card }, react.createElement("div", { style: state.kind === "absent" ? W.muted : W.error }, state.message), react.createElement(VersionLine, {
 				pluginVersion: versions.plugin,
 				skillVersion: versions.skill
 			}));
 		}
-		/** 配置面报错 → 人话指引。
-		*
-		* 报文由技能侧给出：base-link-core 的 `ConfigError` 已经带行号与文件名，技能
-		* `cli/config.ts` 原样交出来，插件 bridge 原样带上（`fetch-failed：出口非 0（1）：<那一句>`）。
-		* 所以这里**不重写报文**，只按报错类补一句「接下来怎么办」——免得两处各写一套人话。
-		*/
-		function humanizeConfigFailure(code, message) {
-			const text = message.trim().length > 0 ? message.trim() : `（${code}，宿主未给报文）`;
-			if (/解析|YAML|parse/i.test(text)) return `${text}\n改回「键: 值」的写法，或点「重置为默认」。`;
-			if (/不认识|未知键|UNKNOWN_KEY/i.test(text)) return `${text}\n删掉页面上没有的行，或点「重置为默认」。`;
-			if (/类型|TYPE_MISMATCH/i.test(text)) return `${text}\n按本页的控件形状填，或点「重置为默认」。`;
-			if (/缺席|missing-cli/.test(text)) return `${text}\n技能出口没找到：先确认技能包已装好，再点「重新读取」。`;
-			return `${text}\n改不动就点「重置为默认」，或照上面那条路径手工改配置文件。`;
-		}
-		/** 一次配置 RPC（与 fetchRead 同通道、同超时纪律；永不抛，失败落字）。 */
-		async function configRpc(call, method, payload) {
-			if (typeof call !== "function") return {
-				ok: false,
-				message: "宿主连接缺席：connection.rpc.call 不可用"
-			};
-			try {
-				const raw = await withTimeout(call("/api", RPC_CHANNEL.slice(1), {
-					method,
-					payload
-				}, AbortSignal.timeout(READ_TIMEOUT_MS)), READ_TIMEOUT_MS);
-				if (!isRpcResult(raw)) return {
-					ok: false,
-					message: "回执信封异常（非 ok 信封）"
-				};
-				if (!raw.ok) return {
-					ok: false,
-					message: humanizeConfigFailure(raw.error?.code ?? "unknown", raw.error?.message ?? "")
-				};
-				return {
-					ok: true,
-					surface: raw.value
-				};
-			} catch (e) {
-				if (e instanceof Error && e.name === "AbortError") return {
-					ok: false,
-					message: `配置读取超时（${Math.round(READ_TIMEOUT_MS / 1e3)}s）：宿主未回`
-				};
-				if (e instanceof Error && e.name === "TimeoutError") return {
-					ok: false,
-					message: e.message
-				};
-				return {
-					ok: false,
-					message: `配置失败：${e instanceof Error ? e.message : String(e)}`
-				};
-			}
-		}
-		/** 读设置页整面。 */
-		function fetchConfigSurface(call) {
-			return configRpc(call, RPC_ENDPOINT_CONFIG_GET, {});
-		}
-		/** 保存（回全表）。 */
-		function saveConfigSurface(call, values) {
-			return configRpc(call, RPC_ENDPOINT_CONFIG_SAVE, { values });
-		}
-		/** 重置为默认（配置件先落 .bak）。 */
-		function resetConfigSurface(call) {
-			return configRpc(call, RPC_ENDPOINT_CONFIG_RESET, {});
-		}
-		/** 只读行显示什么：标了 `resolveFrom` ⇒ 回执 `resolved` 组那一格；没标 ⇒ 配置文件里那个值本身
-		*  （数字类只读项走这一档：显示的是生效数字，见 #749 补注二的甲档）。 */
-		function readonlyTextOf(item, raw, prefill) {
-			if (item.resolveFrom === void 0) return raw;
-			const shown = prefill.resolved?.[item.resolveFrom];
-			return typeof shown === "string" ? shown : "";
-		}
-		function toDraft(values, prefill = {}) {
-			const draft = {};
-			for (const item of CONFIG_ITEMS) {
-				const v = readPath(values, item.key);
-				const raw = v === void 0 || v === null ? "" : String(v);
-				if (item.readonly === true) {
-					draft[item.key] = readonlyTextOf(item, raw, prefill);
-					continue;
-				}
-				if (raw !== "") {
-					draft[item.key] = raw;
-					continue;
-				}
-				const top = item.prefillFrom === void 0 ? void 0 : prefill[item.prefillFrom];
-				if (typeof top === "string" && top !== "") {
-					draft[item.key] = top;
-					continue;
-				}
-				const resolved = item.prefillResolved === void 0 ? void 0 : prefill.resolved?.[item.prefillResolved];
-				draft[item.key] = typeof resolved === "string" ? resolved : raw;
-			}
-			return draft;
-		}
-		/** 表单态 → 配置取值（按控件种类还原类型；空串对文本项照收，语义由「未配」承担）。
-		*
-		*  **只读行不收**（#757）：它们显示的是技能算好的绝对路径，写回配置就是把「显示的路径」当成「配置值」——
-		*  保存只提交真能改的那些行（本家＝数据目录／照片目录／训记 KEY 三行），其余键由技能侧做组内合并保留现值。 */
-		function fromDraft(draft) {
-			const values = {};
-			for (const item of CONFIG_ITEMS) {
-				if (item.readonly === true) continue;
-				const raw = draft[item.key] ?? "";
-				if (item.control === "number") {
-					const n = Number(raw);
-					writePath(values, item.key, Number.isFinite(n) ? n : 0);
-				} else if (item.control === "switch") writePath(values, item.key, raw === "true");
-				else writePath(values, item.key, raw);
-			}
-			return values;
-		}
-		/** 形状守卫：拿到的那个东西像不像目录选择命名空间（本包只认 `pick` 是函数）。 */
-		function isDirectoryPicker(raw) {
-			if (typeof raw !== "object" || raw === null) return false;
-			return typeof raw.pick === "function";
-		}
-		/** 现取目录选择命名空间：**软依赖**，拿不到回 null（页面据此不出入口）。
-		*
-		* 为什么不用 `inject` 声明：见 cookbook §13——写进声明＝硬依赖，提供方缺席时整包被停靠，
-		* 设置页会跟着装不上。这里按平台给的「可选查找」办：缺席只是没有入口。
-		* 守卫拒绝或提供方中途卸载会抛，一律当「没有」，绝不把设置页带下来。 */
-		function resolveDirectoryPicker(getService) {
-			if (typeof getService !== "function") return null;
-			try {
-				const raw = getService(REMOTE_DIRECTORY_PICKER);
-				return isDirectoryPicker(raw) ? raw : null;
-			} catch {
-				return null;
-			}
-		}
-		/** 平台回执／入口三态：**已经收进共用件**（票 #744），这里只同名转出。 */
-		const readPickAnswer = readPickAnswer$1;
-		const pickerModeOf = pickerModeOf$1;
-		/** 唤起一次系统文件夹选择器并归一结果（**永不抛**）。 */
-		async function pickDirectory(picker) {
-			try {
-				return readPickAnswer(await picker.pick());
-			} catch (e) {
-				return {
-					kind: "unavailable",
-					message: "打不开系统文件夹对话框（" + (e instanceof Error ? e.message : String(e)) + "）：请直接在框里填绝对路径。"
-				};
-			}
-		}
-		/** 入口三态：有系统对话框（`pick`）／只有应用内浏览（`list` ＋ `createDirectory`）／都没有。
-		*
-		* 判定取自共用件（一处定义）。本函数只读那个命名空间，不做 IO。 */
-		function directoryEntryMode(picker) {
-			return picker === null ? "none" : pickerModeOf(picker);
-		}
-		/** 「选择文件夹」按钮的真装配函数（目录行渲染出来的按钮，onClick 就是它）。
-		*
-		* 回 Promise 是为了本地可判（用例直接 await）；接进 React 时调用方 `void` 掉。 */
-		function createBrowseHandler(deps) {
-			return async (key) => {
-				const outcome = await pickDirectory(deps.picker);
-				if (outcome.kind === "picked") deps.onChange(key, outcome.path);
-				else if (outcome.kind === "unavailable") deps.onUnavailable(outcome.message);
-			};
-		}
-		/** 一行输入（四种控件对齐受限 YAML 子集：文本／数字／布尔／目录）。
-		*
-		* 目录档＝文本框 ＋ 一枚唤起系统文件夹选择器的按钮；`onBrowse` 缺席（命名空间拿不到、
-		* 或这条路已被拒）时不画按钮，文本框照旧——那是该缝自己的契约（供不了就收起入口，不是失败）。
-		*
-		* **只读行（#757）**：`item.readonly` 为真时控件一律 `disabled`（值只经技能侧解析后显示、不给改），
-		* 目录行的浏览按钮**保留但不可点击**（#748 定稿：入口不作废，只是不能改）。控件文案**不出现省略号**
-		* （#746 处置 9）——按钮就写「选择文件夹」／「浏览」两个字面。 */
-		function Row(props) {
-			const { item } = props;
-			const readonly = item.readonly === true;
-			const disabled = props.disabled || readonly;
-			const onChange = readonly ? void 0 : (e) => props.onChange(item.key, e.target.value);
-			const control = item.control === "switch" ? react.createElement("input", {
-				type: "checkbox",
-				checked: props.value === "true",
-				disabled,
-				onChange: readonly ? void 0 : (e) => props.onChange(item.key, e.target.checked ? "true" : "false")
-			}) : react.createElement("input", {
-				style: S.input,
-				type: item.control === "number" ? "number" : "text",
-				value: props.value,
-				disabled,
-				spellCheck: false,
-				onChange
-			});
-			/** 三态入口：供不了（`none`／缺席）就不画，不摆一个点了没反应的死按钮。
-			*  只读行照画（按钮保留），但 `disabled` ⇒ 点不动。 */
-			const entry = props.browser ?? null;
-			const browse = item.control === "directory" && entry !== null && entry.mode !== "none" ? react.createElement("button", {
-				style: S.btnPick,
-				type: "button",
-				disabled,
-				onClick: () => entry.onOpen(item.key)
-			}, entry.mode === "native" ? "选择文件夹" : "浏览") : null;
-			return react.createElement("div", { style: S.row }, react.createElement("div", { style: S.label }, item.title), react.createElement("div", { style: S.hint }, item.hint), browse === null ? control : react.createElement("div", { style: S.pickRow }, control, browse));
+		/** 跟随映射（#863）：触发键一脏，这些只读派生行就进“将跟随更新”态。纯函数，面板与单测共用。 */
+		const DB_FOLLOWERS = [
+			"db.name",
+			"html.dir",
+			"xunji.stateDir",
+			"photos.gifs"
+		];
+		const PHOTOS_FOLLOWERS = ["photos.gifs"];
+		/** 脏键 → 跟随行（#863 纯函数，交给共用面板当钩子）。 */
+		function followKeysOf(dirtyKeys) {
+			const keys = [];
+			if (dirtyKeys.includes("db.dir")) keys.push(...DB_FOLLOWERS);
+			if (dirtyKeys.includes("photos.dir")) keys.push(...PHOTOS_FOLLOWERS);
+			return [...new Set(keys)];
 		}
-		/** 技能设置页：承载卡路里自己的全部可配置项（只配置，不干活）。
+		/** 自家附加块（设置页那张卡的版本行）：共用面板留的插槽，画在面板主体之后、动作条之前。
 		*
-		* 三态：loading（一次 RPC 内）／ready（真表单）／failed（人话报错 + 指引，不返空、不转圈）。
-		* 没有任何干活入口——查数、记一餐在技能功能页（sidebar槽）。 */
-		function CalorieConfig(props) {
-			const [state, setState] = react.useState({ kind: "loading" });
-			const [pickerGone, setPickerGone] = react.useState(false);
-			const [picking, setPicking] = react.useState(false);
-			const [draft, setDraft] = react.useState({});
-			const [busy, setBusy] = react.useState(false);
-			const [notice, setNotice] = react.useState(null);
-			const [error, setError] = react.useState(null);
+		* 为什么单起一个组件：版本是**本家自己的一通电话**（`dsh-calorie.version`），共用面板不认识它；
+		* 组件自己持状态，面板只管把它画进插槽。 */
+		function CalorieVersionLine(props) {
 			const [versions, setVersions] = react.useState({
 				plugin: VERSION_UNKNOWN,
 				skill: VERSION_UNKNOWN
 			});
-			const load = react.useCallback(async () => {
-				setNotice(null);
-				setError(null);
-				const r = await fetchConfigSurface(props.getCall());
-				if (r.ok) {
-					setState({
-						kind: "ready",
-						surface: r.surface
-					});
-					setDraft(toDraft(r.surface.values, r.surface));
-				} else setState({
-					kind: "failed",
-					message: r.message
-				});
-			}, [props.getCall]);
-			react.useEffect(() => {
-				let alive = true;
-				(async () => {
-					const r = await fetchConfigSurface(props.getCall());
-					if (!alive) return;
-					if (r.ok) {
-						setState({
-							kind: "ready",
-							surface: r.surface
-						});
-						setDraft(toDraft(r.surface.values, r.surface));
-					} else setState({
-						kind: "failed",
-						message: r.message
-					});
-				})();
-				return () => {
-					alive = false;
-				};
-			}, [props.getCall]);
 			react.useEffect(() => {
 				let alive = true;
 				(async () => {
@@ -1679,196 +2133,28 @@ window.__ModuleLoader__.load({
 					alive = false;
 				};
 			}, [props.getCall]);
-			const onChange = react.useCallback((key, next) => {
-				setDraft((prev) => ({
-					...prev,
-					[key]: next
-				}));
-				setNotice(null);
-				setError(null);
-			}, []);
-			/** 目录行入口：三态（系统对话框／应用内浏览／都没有）。
-			*
-			* **软依赖**：拿不到命名空间就没有入口（留文本框），被拒一次即收起入口，不留死按钮。
-			* 状态全部住在组件自己（hook 顺序与旧版同形）：浏览器那一份只存「当前开着的那条」。 */
-			const picker = pickerGone ? null : props.pickerSource();
-			const [browseRow, setBrowseRow] = react.useState(null);
-			/** 唤起系统文件夹选择器那一条路（应用内浏览被拒时的兜底，也是命名空间只给 `pick` 时的唯一一条）。 */
-			const openNative = react.useCallback(async (key) => {
-				const face = pickerGone ? null : props.pickerSource();
-				if (face === null) return;
-				setPicking(true);
-				setError(null);
-				const outcome = await pickDirectory(face);
-				setPicking(false);
-				if (outcome.kind === "picked") onChange(key, outcome.path);
-				else if (outcome.kind === "unavailable") {
-					setError(outcome.message);
-					setPickerGone(true);
-				}
-			}, [
-				pickerGone,
-				onChange,
-				props.pickerSource
-			]);
-			/** 目录行的入口动作：**先应用内浏览，宿主没给这条路再换系统对话框**（判断在共用件里）。
-			*
-			* 两条都供不了就不给入口（`undefined` 时 `rowEntry` 为 null ⇒ Row 不画按钮）。 */
-			const onOpenRow = react.useCallback(async (key) => {
-				setError(null);
-				const opened = openRowBrowser({
-					picker,
-					initialPath: draft[key] ?? "",
-					onChange: (next) => onChange(key, next),
-					onRow: setBrowseRow,
-					refusalCode: DIRECTORY_PICKER_REFUSED,
-					rootsSource: props.rootsSource
-				});
-				if (opened === void 0 || await opened === "refused") await openNative(key);
-			}, [
-				picker,
-				onChange,
-				draft,
-				openNative,
-				props.rootsSource
-			]);
-			/** 给 Row 的三态入口：`none` 时给 null（不画按钮，文本框照旧）。 */
-			const rowEntry = pickerModeOf(picker) === "none" ? null : {
-				mode: pickerModeOf(picker),
-				onOpen: onOpenRow
-			};
-			const surface = state.kind === "ready" ? state.surface : null;
-			/** 脏值只看**可改行**（#757）：只读行显示的是技能算好的绝对路径，拿它当「改动」会让打开面板就变「未保存」。 */
-			const editableItems = CONFIG_ITEMS.filter((i) => i.readonly !== true);
-			const dirty = surface !== null && editableItems.some((i) => (draft[i.key] ?? "") !== (toDraft(surface.values, surface)[i.key] ?? ""));
-			/** 写完（保存／重置）之后重新读一份整面：写回执是 `{path, values}`、重置回执是 `{path, backupPath}`，
-			*  都不是整面——拿写回执当整面用，页头那行「数据目录」会显示成 undefined（#743 实测）。 */
-			const writeThenReload = react.useCallback(async (done) => {
-				setBusy(true);
-				setNotice(null);
-				setError(null);
-				const r = await fetchConfigSurface(props.getCall());
-				if (r.ok) {
-					setState({
-						kind: "ready",
-						surface: r.surface
-					});
-					setDraft(toDraft(r.surface.values, r.surface));
-					setNotice(done);
-				} else setState({
-					kind: "failed",
-					message: r.message
-				});
-				setBusy(false);
-			}, [props.getCall]);
-			const onSave = react.useCallback(async () => {
-				setBusy(true);
-				setNotice(null);
-				setError(null);
-				const r = await saveConfigSurface(props.getCall(), fromDraft(draft));
-				setBusy(false);
-				if (r.ok) await writeThenReload("已保存，立即生效（不用重启宿主）");
-				else setError(r.message);
-			}, [
-				draft,
-				props.getCall,
-				writeThenReload
-			]);
-			const onReset = react.useCallback(async () => {
-				setBusy(true);
-				setNotice(null);
-				setError(null);
-				const r = await resetConfigSurface(props.getCall());
-				setBusy(false);
-				if (r.ok) await writeThenReload("已重置为默认（原配置已另存一份 .bak）");
-				else setError(r.message);
-			}, [props.getCall, writeThenReload]);
-			/** 头部两行：配置文件路径与**生效**数据目录（#757：回执 `resolved.dbDir` 是技能按配置文件算出来的那一个，
-			*  装了旧技能没有那一组时回落到 `dataDir`——两个值在「数据目录留空」时逐字相同）。 */
-			const headDataDir = surface?.resolved?.dbDir ?? surface?.dataDir ?? "";
-			const head = react.createElement("div", null, react.createElement("div", { style: S.title }, `${SLOT_TITLE} · 配置`), surface !== null ? react.createElement("div", null, react.createElement("div", { style: S.info }, `配置文件 ${surface.path}`), react.createElement("div", { style: S.info }, `数据目录 ${headDataDir}`), surface.created ? react.createElement("div", { style: S.muted }, "（配置文件刚按默认值生成）") : null) : null);
-			if (state.kind === "loading") return react.createElement("div", { style: S.card }, head, react.createElement("div", { style: S.muted }, "配置读取中"));
-			if (state.kind === "failed") return react.createElement("div", { style: S.card }, react.createElement("div", { style: S.title }, `${SLOT_TITLE} · 配置`), react.createElement("div", { style: S.error }, state.message), react.createElement("div", { style: S.bar }, react.createElement("button", {
-				style: S.btn,
-				type: "button",
-				onClick: () => void load()
-			}, "重试"), react.createElement("button", {
-				style: S.btn,
-				type: "button",
-				onClick: () => void onReset()
-			}, "重置为默认")), react.createElement(VersionLine, {
+			return react.createElement(VersionLine, {
 				pluginVersion: versions.plugin,
 				skillVersion: versions.skill
-			}));
-			const common = CONFIG_ITEMS.slice(0, COMMON_ITEM_COUNT);
-			const advanced = CONFIG_ITEMS.slice(COMMON_ITEM_COUNT);
-			const renderRow = (item) => react.createElement(Row, {
-				key: item.key,
-				item,
-				value: draft[item.key] ?? "",
-				disabled: busy,
-				onChange,
-				browser: rowEntry
 			});
-			return react.createElement("div", { style: S.card }, head, react.createElement("div", { style: S.rows }, common.map(renderRow)), react.createElement("details", { style: S.advanced }, react.createElement("summary", { style: S.summary }, ADVANCED_GROUP_TITLE), react.createElement("div", { style: S.muted }, ADVANCED_GROUP_NOTE), advanced.map(renderRow)), react.createElement("div", { style: S.bar }, react.createElement("button", {
-				style: dirty ? S.btnPrimary : S.btn,
-				type: "button",
-				disabled: busy || !dirty,
-				onClick: () => void onSave()
-			}, busy ? "处理中" : "保存"), react.createElement("button", {
-				style: S.btn,
-				type: "button",
-				disabled: busy,
-				onClick: () => void onReset()
-			}, "重置为默认"), react.createElement("button", {
-				style: S.btn,
-				type: "button",
-				disabled: busy,
-				onClick: () => void load()
-			}, "重新读取")), picking ? react.createElement("div", { style: S.muted }, "已唤起系统文件夹对话框：选中后自动填上，取消则不动。") : null, browseRow !== null ? react.createElement(DirectoryBrowserFromRow, {
-				open: true,
-				row: browseRow,
-				labels: {
-					title: "选择文件夹",
-					close: "关闭",
-					up: "上一级",
-					pathPlaceholder: "直接填绝对路径，回车即进入",
-					go: "转到",
-					showHidden: (n) => "显示隐藏目录（" + n + "）",
-					empty: "这个目录里没有子目录。",
-					loading: "正在读取",
-					newFolder: "新建文件夹",
-					createConfirm: "创建",
-					createCancel: "取消",
-					select: "选",
-					selected: "已选",
-					open: "选定这个目录",
-					cancel: "取消",
-					willPick: "将选定："
-				}
-			}) : null, notice !== null ? react.createElement("div", { style: S.okText }, notice) : null, error !== null ? react.createElement("div", { style: S.error }, error) : null, react.createElement(VersionLine, {
-				pluginVersion: versions.plugin,
-				skillVersion: versions.skill
-			}));
 		}
 		function apply(ctx) {
 			const getCall = () => ctx.connection?.rpc?.call ?? null;
-			const getPicker = () => typeof ctx.get === "function" ? resolveDirectoryPicker((name) => ctx.get?.(name)) : null;
+			const getService = (name) => typeof ctx.get === "function" ? ctx.get(name) : void 0;
 			ctx.slots.inject("ilife.config-tab", () => ctx.slots.register({
 				name: "ilife.config-tab",
-				id: "dsh-calorie",
+				id: PLUGIN,
 				order: 75,
 				label: () => SLOT_TITLE,
 				channel: RPC_CHANNEL
-			}, () => react.createElement(CalorieConfig, {
+			}, () => react.createElement(ConfigPanel, {
+				channel: RPC_CHANNEL,
+				items: CONFIG_ITEMS,
+				title: SLOT_TITLE,
+				followKeysOf,
+				extra: () => react.createElement(CalorieVersionLine, { getCall }),
 				getCall,
-				pickerSource: getPicker,
-				rootsSource: createRootsSource({
-					getCall,
-					base: MANAGER_RPC_BASE,
-					endpoint: MANAGER_RPC_ENDPOINT,
-					method: MANAGER_ROOTS_METHOD
-				})
+				getService
 			})));
 			const ensureWorkTab = () => {
 				try {
@@ -1904,29 +2190,15 @@ window.__ModuleLoader__.load({
 			}
 		}
 		//#endregion
-		exports.Row = Row;
 		exports.VERSION_READ_KEY = VERSION_READ_KEY;
 		exports.VERSION_UNKNOWN = VERSION_UNKNOWN;
 		exports.VersionLine = VersionLine;
 		exports.apply = apply;
-		exports.createBrowseHandler = createBrowseHandler;
-		exports.directoryEntryMode = directoryEntryMode;
-		exports.fetchConfigSurface = fetchConfigSurface;
 		exports.fetchVersions = fetchVersions;
+		exports.followKeysOf = followKeysOf;
 		exports.formatVersionLine = formatVersionLine;
-		exports.fromDraft = fromDraft;
-		exports.humanizeConfigFailure = humanizeConfigFailure;
 		exports.inject = inject;
-		exports.isDirectoryPicker = isDirectoryPicker;
 		exports.normalizeVersion = normalizeVersion;
-		exports.openRowBrowser = openRowBrowser;
-		exports.pickDirectory = pickDirectory;
-		exports.pickerModeOf = pickerModeOf;
-		exports.readPickAnswer = readPickAnswer;
-		exports.resetConfigSurface = resetConfigSurface;
-		exports.resolveDirectoryPicker = resolveDirectoryPicker;
-		exports.saveConfigSurface = saveConfigSurface;
-		exports.toDraft = toDraft;
 		return module.exports;
 	}
 });